@extends('base')

@section('title', 'Home')

@section('content')


            <!-- Page Header Start -->
            <div class="page-header">
                <div class="container">
                    <div class="row">
                        <div class="col-12">
                            <h2>Contactez-nous</h2>
                        </div>
                        <div class="col-12">
                            <a href="">Accueil</a>
                            <a href="">Contactez-nous</a>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Fin de l'en-tête de la page -->


            <!-- Début Contact -->
            <div class="contact">
                <div class="container">
                    <div class="section-header">
                        <p>Contactez-nous</p>
                        <h2>Trouvez votre réponse / Envoyez un message</h2>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="faqs">
                                <div id="accordion">
                                    <div class="card">
                                        <div class="card-header">
                                            <a class="card-link collapsed" data-toggle="collapse" href="#collapseOne"
                                                aria-expanded="true">
                                                <span>1</span> Qu'est-ce que le nettoyage écologique ?
                                            </a>
                                        </div>
                                        <div id="collapseOne" class="collapse show" data-parent="#accordion">
                                            <div class="card-body">
                                                Le nettoyage écologique est une méthode de nettoyage qui utilise des produits et des techniques respectueux de l'environnement.
                                            </div>
                                        </div>
                                    </div>
                                    <div class="card">
                                        <div class="card-header">
                                            <a class="card-link" data-toggle="collapse" href="#collapseTwo">
                                                <span>2</span> Comment puis-je réserver un service ?
                                            </a>
                                        </div>
                                        <div id="collapseTwo" class="collapse" data-parent="#accordion">
                                            <div class="card-body">
                                                Vous pouvez réserver un service en nous contactant directement par téléphone ou en remplissant le formulaire de réservation sur notre site web.
                                            </div>
                                        </div>
                                    </div>
                                    <div class="card">
                                        <div class="card-header">
                                            <a class="card-link" data-toggle="collapse" href="#collapseThree">
                                                <span>3</span> Quels sont vos horaires d'ouverture ?
                                            </a>
                                        </div>
                                        <div id="collapseThree" class="collapse" data-parent="#accordion">
                                            <div class="card-body">
                                                Nous sommes ouverts du lundi au vendredi, de 9h à 18h. Nous sommes également disponibles le samedi sur rendez-vous.
                                            </div>
                                        </div>
                                    </div>
                                    <div class="card">
                                        <div class="card-header">
                                            <a class="card-link" data-toggle="collapse" href="#collapseFour">
                                                <span>4</span> Quels types de services proposez-vous ?
                                            </a>
                                        </div>
                                        <div id="collapseFour" class="collapse" data-parent="#accordion">
                                            <div class="card-body">
                                                Nous proposons une gamme de services de nettoyage, y compris le nettoyage résidentiel, commercial et de fin de bail.
                                            </div>
                                        </div>
                                    </div>
                                    <div class="card">
                                        <div class="card-header">
                                            <a class="card-link" data-toggle="collapse" href="#collapseFive">
                                                <span>5</span> Acceptez-vous les paiements par carte de crédit ?
                                            </a>
                                        </div>
                                        <div id="collapseFive" class="collapse" data-parent="#accordion">
                                            <div class="card-body">
                                                Oui, nous acceptons les paiements par carte de crédit, ainsi que les paiements en espèces et par virement bancaire.
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="contact-form">
                                <form>
                                    <div class="form-row">
                                        <div class="form-group col-md-6">
                                            <input type="text" class="form-control" placeholder="Your Name" required="required" />
                                        </div>
                                        <div class="form-group col-md-6">
                                            <input type="email" class="form-control" placeholder="Your Email" required="required" />
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <input type="text" class="form-control" placeholder="Subject" required="required" />
                                    </div>
                                    <div class="form-group">
                                        <textarea class="form-control" rows="6" placeholder="Message" required="required" ></textarea>
                                    </div>
                                    <div><button class="btn" type="submit">Envoyer</button></div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Contact End -->

            @endsection