<div class="container py-1">
    <div class="row equal-height">
        <!-- Formulaire de contact -->
        <div class="col-lg-6">
            <div class="card shadow-lg h-100">
                <div class="card-body d-flex flex-column">
                    <h2 class="card-title mb-4 text-primary">Formulaire de contact</h2>
                    <form id="contact_Form" enctype="multipart/form-data" class="d-flex flex-column flex-grow-1">
                        <input type="hidden" id="mra_nonce" name="mra_nonce" value="b2a08a3819" /><input type="hidden" name="_wp_http_referer" value="/deneigement/wp-json/wp/v2/pages/1299" />                        <input type="hidden" name="csrf_token" value="xzoHFcgOzTb0gOyQDXtBkIo6CVD6NLB9">


                        <div class="row g-3">
                            <!-- Vos champs de formulaire ici -->
                            <div class="form-floating mb-3">
                            <select class="form-select" id="sujet" name="sujet" required>
                                <option value=""></option>
                                <option value="plainte">Démande de service</option>
                                <option value="bris">Déclaration de bris</option>
                                <option value="demande de devis">Demande de Soumission</option>
                                <option value="demande-emplois">Demande d’emplois</option>
                                <option value="demande-info">Demande d’information</option>
                                
                                <option value="reclamation">Réclamation</option>
                                
                                <option value="facture">Facturation</option>
                                
                            </select>
                            <label for="sujet">Sujet concerné par l’envoi <span class="text-danger">*</label>
                        </div>
                        
                        <!-- Bloc explicatif qui change selon le sujet -->
                        <div id="explication-sujet" class="hidden-field mb-3"></div>

                            <div class="col-md-6">
                                <div class="form-floating">
                                    <input type="text" class="form-control" id="prenom" name="prenom" placeholder="Prénom" required>
                                    <label for="prenom">Prénom <span class="text-danger">*</span></label>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-floating">
                                    <input type="text" class="form-control" id="nom" name="nom" placeholder="Nom" required>
                                    <label for="nom">Nom <span class="text-danger">*</span></label>
                                </div>
                            </div>
                        </div>

                        <!-- Conteneur autour du champ Entreprise -->
                        <div id="entreprise-container" class="form-floating my-3">
                          <input type="text" class="form-control" id="entreprise" name="entreprise" placeholder="Entreprise">
                          <label for="entreprise">Entreprise</label>
                        </div>

                        <div class="form-floating mb-3">
                            <input type="email" class="form-control" id="courriel" name="courriel" placeholder="Courriel" required>
                            <label for="courriel">Courriel <span class="text-danger">*</span></label>
                        </div>

                        <div class="form-floating mb-3">
                            <input type="tel" class="form-control" id="telephone" name="telephone" placeholder="Téléphone">
                            <label for="telephone">Téléphone</label>
                        </div>

                        
                        <div class="hidden-field" id="adresse-secteur-container">
                           <div class="row g-3 mb-3 ">
                             <!-- Adresse -->
                                <div class="col-md-6">
                                     <div class="form-floating  dynamic-field" >
                                        <input type="text" class="form-control" id="numero_contrat" name="numero_contrat" placeholder="Numéro du contrat" >
                                        <label for="numero_contrat">Numéro du contrat </span></label>
                                    </div>
                                </div>

                                <!-- Secteur -->
                                <div class="col-md-6">
                                    <div class="form-floating dynamic-field">
                                        <select class="form-select" id="secteur" name="secteur">
                                            <option value="">--Selectionner un secteur--</option>
                                            <option value="SUD">Sud</option>
                                            <option value="NORD">Nord</option>
                                            <option value="LEVIS">Levis</option>
                                            <option value="BASE MILITAIRE">base militaire</option>
                                            <option value="AUTRE">Autre</option>
                                        </select>
                                        <label for="secteur">Secteur</label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="form-floating mb-3 dynamic-field">
                                    <input type="text" class="form-control" id="adresse" name="adresse" placeholder="Adresse" >
                                    <label for="adresse">Adresse des travaux </label>
                                </div>
                            </div>
                        </div>

                        <div class="form-floating mb-3 hidden-field dynamic-field" id="type-d-one">
                            <select class="form-select" id="type" name="type">
                                <option value=""></option>
                                <option value="Tracteur">Mécanique</option>
                                <option value="Pelletage">Accès piétonier</option>
                                <option value="Epandage">Épandage d'abrasifs</option>
                                <option value="Transport">Transport de neige</option>
                                <option value="autre">Autre</option>
                            </select>
                            <label for="secteur">Type de service</label>
                        </div>

                        <div class="hidden-field" id="adresse-type-de-bris">
                            
                            <div class="form-floating mb-3 dynamic-field">
                                <input type="date" class="form-control" id="date_incident" name="date_incident" placeholder="date_incident" >
                                <label for="date_incident">Date de l'incident </label>
                            </div>
                            
                            <div class="form-floating mb-3 dynamic-field" >
                                <select class="form-select" id="type-de-bris" name="type_de_bris">
                                    <option value="" selected>-- Sélectionnez un type de bris --</option>
                                    <option value="1205644096561518">ASPHALTE</option>
                                    <option value="1205644096561521">BATIMENT / CONSTRUCTION</option>
                                    <option value="1207614143107460">BORDURE</option>
                                    <option value="1207614143107461">CLOTURE</option>
                                    <option value="1205644096561522">ÉQUIPEMENT / APPAREIL</option>
                                    <option value="1207038084028122">GAZON</option>
                                    <option value="1207037145733276">GRAVIER SUR TERRAIN</option>
                                    <option value="1205644096561519">MURET</option>
                                    <option value="1206072606795941">PORTE DE GARAGE</option>
                                    <option value="1205644096561520">TERRAIN / PAYSAGEMENT</option>
                                    <option value="1205644096561517">VOITURE</option>
                                    <option value="1205644096561523">AUTRE</option>
                                </select>
                                <label for="type-de-bris">Type de Bris <span class="text-danger">*</span></label>
                            </div>

                            <div class="form-floating mb-3 dynamic-field" id="items">
                                <h6 ><strong>Cochez les ITEMS À RÉPARER </strong><span class="text-danger">*</span></h6>
                                <div class="row g-3">
                                    <div class="col-md-6">
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="voiture-peinture" name="items[]" value="VOITURE - Peinture / débosselage">
                                            <label class="form-check-label" for="voiture-peinture">VOITURE - Peinture / débosselage</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="voiture-mecanique" name="items[]" value="VOITURE - Mécanique">
                                            <label class="form-check-label" for="voiture-mecanique">VOITURE - Mécanique</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="asphalte-egratignure" name="items[]" value="ASPHALTE - Égratignure">
                                            <label class="form-check-label" for="asphalte-egratignure">ASPHALTE - Égratignure</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="asphalte-brisee" name="items[]" value="ASPHALTE - Brisée">
                                            <label class="form-check-label" for="asphalte-brisee">ASPHALTE - Brisée</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="muret-replacer" name="items[]" value="MURET - À replacer">
                                            <label class="form-check-label" for="muret-replacer">MURET - À replacer</label>
                                        </div>
                                    </div>
                                    <div class="col-md-6">
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="muret-pierre-brisee" name="items[]" value="MURET - Pierre brisée / à remplacer">
                                            <label class="form-check-label" for="muret-pierre-brisee">MURET - Pierre brisée / à remplacer</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="terrain-gazon" name="items[]" value="TERRAIN - Gazon à remplacer">
                                            <label class="form-check-label" for="terrain-gazon">TERRAIN - Gazon à remplacer</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="terrain-trou" name="items[]" value="TERRAIN - Trou à remplir / terre à égaliser">
                                            <label class="form-check-label" for="terrain-trou">TERRAIN - Trou à remplir / terre à égaliser</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="batiment-porte-garage" name="items[]" value="BÂTIMENT - Porte de garage">
                                            <label class="form-check-label" for="batiment-porte-garage">BÂTIMENT - Porte de garage</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="batiment-fondation" name="items[]" value="BÂTIMENT - Fondation">
                                            <label class="form-check-label" for="batiment-fondation">BÂTIMENT - Fondation</label>
                                        </div>
                                        <div class="form-check form-switch">
                                            <input class="form-check-input toggle-switch" type="checkbox" id="AUTRES" name="items[]" value="AUTRE">
                                            <label class="form-check-label" for="AUTRES">Autre</label>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>

                        <div class="form-floating  mb-3">
                            <textarea class="form-control" id="message" name="message" placeholder="Message" style="height: 150px;" required></textarea>
                            <label for="message">Message <span class="text-danger">*</span></label>
                        </div>

                        <div class="mb-3">
                            <label for="fichier" class="form-label">Joindre un ou plusieurs fichiers</label>
                            <input class="form-control" type="file" id="fichier" name="fichier[]" multiple>
                        </div>
                        <input type="hidden" name="g_recaptcha_token" id="g_recaptcha_token" value="">


                        <!-- Place le bouton en bas -->
                        <div class="mt-auto">
                            <button type="submit" class="btn btn-primary w-100">Envoyer</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!-- Informations de contact -->
        <div class="col-lg-6">
            <div class="info-card shadow-lg">
                <h3 class="mb-4 text-primary">Parlez-nous en personne !</h3>
                <p>Nous sommes très contents de discuter avec nos clients. Appelez-nous pendant les heures normales d'ouverture et nous répondrons à vos questions.</p>
                
                <p><strong>MRA Neige - Les Entreprises MRA Paysagistes</strong></p>
                <p>1530, boulevard Wilfrid-Hamel, suite 104, Québec, QC, G1N 3Y6</p>
                <p><strong>Tél :</strong> <a href="tel:+14186815068">(418) 681-5068</a></p>
                <p><strong>Fax :</strong> (418) 681-9388</p>
                <p><strong>Email :</strong> <a href="mailto:info@mraneige.com">info@mraneige.com</a></p>

                <h3 class="mt-4 text-primary">Horaires d’ouverture</h3>
                <ul class="list-unstyled">
                    <li><strong>Lundi - Jeudi :</strong> 08:00 – 17:00</li>
                    <li><strong>Vendredi :</strong> 08:00 – 17:00 (12:00 entre mi-mai et début septembre)</li>
                    <li><strong>Samedi - Dimanche :</strong> Fermé</li>
                    <li><strong>Pause déjeuner :</strong> 12:00 – 12:30</li>
                </ul>

                <!-- Place l'iframe en bas -->
                <div class="mt-auto">
                    <iframe 
                        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2687.4763429304174!2d-71.270041!3d46.800219!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4cb8968fb9fdd61d%3A0xa03e26d4fc1a795e!2s1530%20Bd%20Wilfrid-Hamel%2C%20Qu%C3%A9bec%2C%20QC%20G1N%203Y6%2C%20Canada!5e0!3m2!1sfr!2sfr!4v1697828909272!5m2!1sfr!2sfr" 
                        width="100%" height="300" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
                </div>
            </div>
        </div>
    </div>
</div>{"id":1299,"date":"2025-07-17T15:15:23","date_gmt":"2025-07-17T19:15:23","guid":{"rendered":"https:\/\/mrapaysagistes.com\/deneigement\/?page_id=1299"},"modified":"2025-11-16T19:59:38","modified_gmt":"2025-11-17T00:59:38","slug":"contact-2","status":"publish","type":"page","link":"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/","title":{"rendered":"Contact"},"content":{"rendered":"\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","_kadence_starter_templates_imported_post":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"footnotes":""},"class_list":["post-1299","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.4 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Contact - MRA Neige<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Contact - MRA Neige\" \/>\n<meta property=\"og:url\" content=\"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/\" \/>\n<meta property=\"og:site_name\" content=\"MRA Neige\" \/>\n<meta property=\"article:modified_time\" content=\"2025-11-17T00:59:38+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/\",\"url\":\"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/\",\"name\":\"Contact - MRA Neige\",\"isPartOf\":{\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/#website\"},\"datePublished\":\"2025-07-17T19:15:23+00:00\",\"dateModified\":\"2025-11-17T00:59:38+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/mrapaysagistes.com\/deneigement\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Contact\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/#website\",\"url\":\"https:\/\/mrapaysagistes.com\/deneigement\/\",\"name\":\"MRA Neige\",\"description\":\"Pour une saison hivernale sans tracas\",\"publisher\":{\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/mrapaysagistes.com\/deneigement\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/#organization\",\"name\":\"MRA Neige\",\"url\":\"https:\/\/mrapaysagistes.com\/deneigement\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/mrapaysagistes.com\/deneigement\/wp-content\/uploads\/sites\/3\/2021\/12\/cropped-LOGO_HIVER-couleurs_low-res.png\",\"contentUrl\":\"https:\/\/mrapaysagistes.com\/deneigement\/wp-content\/uploads\/sites\/3\/2021\/12\/cropped-LOGO_HIVER-couleurs_low-res.png\",\"width\":180,\"height\":172,\"caption\":\"MRA Neige\"},\"image\":{\"@id\":\"https:\/\/mrapaysagistes.com\/deneigement\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Contact - MRA Neige","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/","og_locale":"fr_FR","og_type":"article","og_title":"Contact - MRA Neige","og_url":"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/","og_site_name":"MRA Neige","article_modified_time":"2025-11-17T00:59:38+00:00","twitter_card":"summary_large_image","twitter_misc":{"Dur\u00e9e de lecture estim\u00e9e":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/","url":"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/","name":"Contact - MRA Neige","isPartOf":{"@id":"https:\/\/mrapaysagistes.com\/deneigement\/#website"},"datePublished":"2025-07-17T19:15:23+00:00","dateModified":"2025-11-17T00:59:38+00:00","breadcrumb":{"@id":"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/mrapaysagistes.com\/deneigement\/contact-2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/mrapaysagistes.com\/deneigement\/"},{"@type":"ListItem","position":2,"name":"Contact"}]},{"@type":"WebSite","@id":"https:\/\/mrapaysagistes.com\/deneigement\/#website","url":"https:\/\/mrapaysagistes.com\/deneigement\/","name":"MRA Neige","description":"Pour une saison hivernale sans tracas","publisher":{"@id":"https:\/\/mrapaysagistes.com\/deneigement\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/mrapaysagistes.com\/deneigement\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/mrapaysagistes.com\/deneigement\/#organization","name":"MRA Neige","url":"https:\/\/mrapaysagistes.com\/deneigement\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/mrapaysagistes.com\/deneigement\/#\/schema\/logo\/image\/","url":"https:\/\/mrapaysagistes.com\/deneigement\/wp-content\/uploads\/sites\/3\/2021\/12\/cropped-LOGO_HIVER-couleurs_low-res.png","contentUrl":"https:\/\/mrapaysagistes.com\/deneigement\/wp-content\/uploads\/sites\/3\/2021\/12\/cropped-LOGO_HIVER-couleurs_low-res.png","width":180,"height":172,"caption":"MRA Neige"},"image":{"@id":"https:\/\/mrapaysagistes.com\/deneigement\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/mrapaysagistes.com\/deneigement\/wp-json\/wp\/v2\/pages\/1299","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mrapaysagistes.com\/deneigement\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mrapaysagistes.com\/deneigement\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mrapaysagistes.com\/deneigement\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mrapaysagistes.com\/deneigement\/wp-json\/wp\/v2\/comments?post=1299"}],"version-history":[{"count":2,"href":"https:\/\/mrapaysagistes.com\/deneigement\/wp-json\/wp\/v2\/pages\/1299\/revisions"}],"predecessor-version":[{"id":1301,"href":"https:\/\/mrapaysagistes.com\/deneigement\/wp-json\/wp\/v2\/pages\/1299\/revisions\/1301"}],"wp:attachment":[{"href":"https:\/\/mrapaysagistes.com\/deneigement\/wp-json\/wp\/v2\/media?parent=1299"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}