{"id":641,"date":"2025-11-15T18:33:37","date_gmt":"2025-11-15T18:33:37","guid":{"rendered":"https:\/\/maroctreks.com\/?page_id=641"},"modified":"2025-11-26T10:44:18","modified_gmt":"2025-11-26T10:44:18","slug":"contact","status":"publish","type":"page","link":"https:\/\/maroctreks.com\/en\/contact\/","title":{"rendered":"Contact"},"content":{"rendered":"
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Contact - Maroc Treks | Randonn\u00e9es au Maroc<\/title>\r\n <meta name=\"description\" content=\"Contactez Maroc Treks pour vos randonn\u00e9es au Maroc. Circuit d\u00e9sert, Atlas, c\u00f4te atlantique. Guides certifi\u00e9s, exp\u00e9riences authentiques.\">\r\n <meta name=\"keywords\" content=\"contact randonn\u00e9e Maroc, circuit d\u00e9sert Maroc, trekking Atlas, guide Maroc, informations randonn\u00e9e\">\r\n <meta property=\"og:title\" content=\"Contact - Maroc Treks\">\r\n <meta property=\"og:description\" content=\"Contactez-nous pour organiser votre randonn\u00e9e au Maroc. D\u00e9sert, Atlas, c\u00f4te atlantique - Exp\u00e9riences authentiques avec guides locaux.\">\r\n <meta property=\"og:type\" content=\"website\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@400;500;600;700;800&display=swap\" rel=\"stylesheet\">\r\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n <script src=\"https:\/\/cdn.jsdelivr.net\/npm\/@emailjs\/browser@3\/dist\/email.min.js\"><\/script>\r\n\r\n <style>\r\n \/* ---- Contact Page Styles - Unique Prefix ---- *\/\r\n .mt-contact-page{\r\n --mt-bg:#fff7ed; \r\n --mt-ink:#0f172a; \r\n --mt-muted:#6b7280; \r\n --mt-card:#ffffff;\r\n --mt-border:#e5e7eb; \r\n --mt-primary:#e67e22; \/* primary accent - orange *\/\r\n --mt-primary-700:#d35400;\r\n --mt-secondary:#f39c12; \/* secondary accent - warm amber *\/\r\n --mt-secondary-700:#c97a0c; \r\n --mt-cream:#fff4e0; \/* soft desert background *\/\r\n --mt-radius:18px; \r\n --mt-shadow:0 18px 45px rgba(15,23,42,.14);\r\n box-sizing:border-box; \r\n font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;\r\n background:radial-gradient(circle at top, var(--mt-cream) 0, var(--mt-bg) 45%, #f3f4f6 100%);\r\n color:var(--mt-ink); \r\n line-height:1.6;\r\n -webkit-text-size-adjust:100%;\r\n min-height:100vh;\r\n margin: 0;\r\n padding: 0;\r\n }\r\n .mt-contact-page *{box-sizing:border-box}\r\n .mt-contact-page .mt-container{max-width:1160px;margin-inline:auto;padding:24px}\r\n\r\n \/* ---- Global layout ---- *\/\r\n .mt-content-wrapper{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:18px}\r\n @media (max-width:980px){.mt-content-wrapper{grid-template-columns:1fr}}\r\n \r\n .mt-section{\r\n background:var(--mt-card);\r\n border-radius:var(--mt-radius);\r\n padding:30px;\r\n margin-bottom:20px;\r\n box-shadow:var(--mt-shadow);\r\n border:1px solid rgba(148,163,184,0.35);\r\n }\r\n .mt-section-title{\r\n display:flex;align-items:center;gap:10px;\r\n font-size:1.5rem;margin:0 0 20px;color:var(--mt-ink);letter-spacing:.02em\r\n }\r\n .mt-section-title i{color:var(--mt-primary)}\r\n .mt-description{color:var(--mt-muted);font-size:1.02rem;margin-bottom:20px}\r\n\r\n \/* ---- Hero Header ---- *\/\r\n .mt-contact-header{\r\n text-align:center;\r\n margin-bottom:40px;\r\n padding:30px 20px;\r\n border-radius:0;\r\n background:linear-gradient(135deg, #7c2d12, #e67e22);\r\n color:#fff7ed;\r\n box-shadow:0 18px 45px rgba(120,53,15,.45);\r\n position:relative;\r\n overflow:hidden;\r\n width: 100%;\r\n }\r\n .mt-contact-header::after{\r\n content:\"\";\r\n position:absolute;\r\n inset:auto -60px -80px auto;\r\n width:220px;height:220px;\r\n background:radial-gradient(circle at center, rgba(244,165,96,.8), transparent 65%);\r\n opacity:.8;\r\n }\r\n .mt-contact-label{\r\n display:inline-flex;align-items:center;gap:8px;\r\n padding:8px 16px;border-radius:999px;\r\n background:rgba(15,23,42,.9);\r\n font-size:.85rem;\r\n text-transform:uppercase;\r\n letter-spacing:.12em;\r\n margin-bottom:15px;\r\n }\r\n .mt-contact-label i{color:#fed7aa}\r\n .mt-contact-header h1{\r\n font-size:clamp(2rem,4vw,3rem);\r\n margin:0 0 10px;\r\n font-weight:800;\r\n }\r\n .mt-contact-subtitle{\r\n margin:0 0 20px;\r\n font-size:1.1rem;\r\n color:#fffbeb;\r\n max-width:600px;\r\n margin-left:auto;\r\n margin-right:auto;\r\n }\r\n\r\n \/* ---- Contact Info ---- *\/\r\n .mt-contact-info-grid{\r\n display:grid;\r\n grid-template-columns:repeat(auto-fit,minmax(250px,1fr));\r\n gap:20px;\r\n margin-bottom:30px;\r\n }\r\n .mt-contact-info-item{\r\n display:flex;align-items:flex-start;gap:15px;\r\n padding:20px;\r\n background:rgba(248,250,252,.85);\r\n border-radius:14px;\r\n border-left:4px solid var(--mt-primary);\r\n transition:transform .2s, box-shadow .2s;\r\n }\r\n .mt-contact-info-item:hover{\r\n transform:translateY(-2px);\r\n box-shadow:0 8px 25px rgba(148,81,26,.25);\r\n }\r\n .mt-contact-icon{\r\n background:var(--mt-primary);\r\n color:#fff7ed;\r\n width:50px;height:50px;border-radius:50%;\r\n display:flex;align-items:center;justify-content:center;font-size:1.3rem;\r\n flex-shrink:0;\r\n }\r\n .mt-contact-details h3{margin:0 0 8px;font-size:1.1rem;color:var(--mt-ink)}\r\n .mt-contact-details p{margin:0;color:var(--mt-muted);font-size:.95rem;line-height:1.5}\r\n\r\n \/* ---- Social Links ---- *\/\r\n .mt-social-links{\r\n display:flex;\r\n gap:15px;\r\n margin-top:20px;\r\n }\r\n .mt-social-link{\r\n display:flex;align-items:center;justify-content:center;\r\n width:45px;height:45px;\r\n background:var(--mt-primary);\r\n color:white;\r\n border-radius:50%;\r\n text-decoration:none;\r\n transition:transform .2s, background .2s;\r\n }\r\n .mt-social-link:hover{\r\n transform:translateY(-2px);\r\n background:var(--mt-primary-700);\r\n }\r\n\r\n \/* ---- Form Styles ---- *\/\r\n .mt-form-group{margin-bottom:20px}\r\n .mt-label{display:block;margin-bottom:8px;font-weight:600;color:var(--mt-ink);font-size:.95rem}\r\n .mt-form-control{\r\n width:100%;padding:14px 16px;\r\n border:1px solid var(--mt-border);border-radius:12px;\r\n background:#f9fafb;font:inherit;font-size:16px;\r\n transition:border-color .2s, box-shadow .2s;\r\n }\r\n .mt-form-control:focus{\r\n outline:2px solid rgba(230,126,34,.25);\r\n border-color:rgba(230,126,34,.7);\r\n background:#ffffff;\r\n box-shadow:0 0 0 3px rgba(230,126,34,.25);\r\n }\r\n .mt-form-control::placeholder{color:#9ca3af;opacity:1}\r\n .mt-form-control.mt-error{border-color:#e11d48;background-color:rgba(248,113,113,0.06)}\r\n .mt-error-message{color:#e11d48;font-size:0.8rem;margin-top:6px;display:none}\r\n \r\n textarea.mt-form-control{\r\n min-height:120px;\r\n resize:vertical;\r\n }\r\n\r\n .mt-btn-submit{\r\n width:100%;display:inline-flex;align-items:center;justify-content:center;\r\n gap:.55rem;border:0;\r\n background:linear-gradient(145deg,var(--mt-primary),var(--mt-secondary-700));\r\n color:#f9fafb;padding:16px 20px;border-radius:12px;\r\n font-weight:700;cursor:pointer;\r\n box-shadow:0 9px 24px rgba(148,81,26,.4);\r\n transition:.18s transform,.18s box-shadow;\r\n font-size:1rem;\r\n }\r\n .mt-btn-submit:hover{transform:translateY(-2px);box-shadow:0 12px 28px rgba(148,81,26,.48)}\r\n .mt-btn-submit:disabled{background:#9ca3af;cursor:not-allowed;transform:none;box-shadow:none}\r\n\r\n \/* ---- Toast \/ Messages ---- *\/\r\n .mt-toast{\r\n position:fixed;left:50%;transform:translateX(-50%);\r\n bottom:20px;padding:14px 20px;border-radius:999px;\r\n background:var(--mt-ink);color:#f9fafb;\r\n box-shadow:var(--mt-shadow);display:none;z-index:100;\r\n font-size:.9rem;\r\n max-width:90%;\r\n text-align:center;\r\n }\r\n .mt-toast.show{display:block;animation:mt-fadeInUp .3s ease-out}\r\n .mt-toast.success{background:var(--mt-primary)}\r\n .mt-toast.error{background:#e11d48}\r\n\r\n @keyframes mt-fadeInUp{\r\n from{opacity:0;transform:translateX(-50%) translateY(20px)}\r\n to{opacity:1;transform:translateX(-50%) translateY(0)}\r\n }\r\n\r\n \/* ---- Responsive ---- *\/\r\n @media (max-width:768px){\r\n .mt-contact-page .mt-container{padding:16px}\r\n .mt-content-wrapper{gap:20px}\r\n .mt-section{padding:20px}\r\n .mt-contact-header{padding:20px 15px}\r\n .mt-contact-info-grid{grid-template-columns:1fr}\r\n .mt-contact-info-item{padding:15px}\r\n .mt-social-links{justify-content:center}\r\n .mt-form-control{padding:12px 14px}\r\n .mt-btn-submit{padding:14px 18px}\r\n }\r\n\r\n \/* ---- Thank You Overlay ---- *\/\r\n .mt-thankyou-overlay {\r\n display: none;\r\n position: fixed;\r\n top: 0;left: 0;\r\n width: 100%;height: 100%;\r\n background: rgba(15, 23, 42, 0.82);\r\n z-index: 10000;\r\n backdrop-filter: blur(6px);\r\n overflow-y: auto;\r\n padding: 20px;\r\n box-sizing: border-box;\r\n }\r\n .mt-thankyou-card {\r\n position: absolute;\r\n top: 50%;left: 50%;\r\n transform: translate(-50%, -50%);\r\n background: #ffffff;\r\n border-radius: 20px;\r\n padding: 40px 34px;\r\n max-width: 430px;\r\n width: 90%;\r\n text-align: center;\r\n box-shadow: 0 24px 60px rgba(15, 23, 42, 0.5);\r\n border: 1px solid var(--mt-border);\r\n animation: mt-thankYouSlideIn 0.45s ease-out;\r\n }\r\n @keyframes mt-thankYouSlideIn {\r\n 0% { opacity: 0; transform: translate(-50%, -40%); }\r\n 100% { opacity: 1; transform: translate(-50%, -50%); }\r\n }\r\n .mt-thankyou-card .mt-icon {\r\n width: 84px;height: 84px;\r\n background: linear-gradient(135deg, var(--mt-primary), var(--mt-secondary));\r\n border-radius: 50%;\r\n display: flex;align-items: center;justify-content: center;\r\n margin: 0 auto 24px;\r\n color: white;font-size: 2.2rem;\r\n box-shadow: 0 12px 30px rgba(148,81,26,0.55);\r\n }\r\n .mt-thankyou-card h3 {\r\n font-size: 1.9rem;\r\n margin-bottom: 16px;\r\n color: var(--mt-ink);\r\n font-weight: 800;\r\n line-height: 1.2;\r\n }\r\n .mt-thankyou-card p {\r\n color: var(--mt-muted);\r\n margin-bottom: 0;\r\n line-height: 1.6;\r\n font-size: 1.05rem;\r\n }\r\n .mt-thankyou-card .mt-btn-row {\r\n display: flex;\r\n justify-content: center;\r\n gap: 14px;\r\n margin-top: 26px;\r\n }\r\n .mt-thankyou-card .mt-btn-submit {\r\n padding: 12px 22px;\r\n font-size: 1rem;\r\n min-width: 130px;\r\n width: auto;\r\n }\r\n @media (max-width: 600px) {\r\n .mt-thankyou-card {\r\n padding: 34px 22px;\r\n width: 95%;\r\n }\r\n .mt-thankyou-card .mt-icon {\r\n width: 78px;height: 78px;font-size: 2.1rem;margin-bottom: 22px;\r\n }\r\n .mt-thankyou-card h3 {font-size: 1.7rem;margin-bottom: 12px;}\r\n .mt-thankyou-card p {font-size: 1rem;}\r\n .mt-thankyou-card .mt-btn-row {flex-direction: column;gap: 10px;margin-top: 22px;}\r\n .mt-thankyou-card .mt-btn-submit {width: 100%;padding: 11px 16px;}\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"mt-contact-page\">\r\n <div class=\"mt-container center\">\r\n\r\n <!-- HERO HEADER -->\r\n <div class=\"mt-contact-header\">\r\n <div class=\"mt-contact-label\"><i class=\"fas fa-envelope-open-text\"><\/i> CONTACT<\/div>\r\n <h1>Contact Maroc Treks<\/h1>\r\n <p class=\"mt-contact-subtitle\">\r\n Ready for adventure? Contact us to organize your trek in Morocco.\r\n We'll be happy to answer all your questions.\r\n <\/p>\r\n <\/div>\r\n\r\n <div class=\"mt-content-wrapper\">\r\n <!-- Contact Form -->\r\n <div class=\"mt-main-content\">\r\n <section class=\"mt-section\">\r\n <h2 class=\"mt-section-title\"><i class=\"fas fa-paper-plane\"><\/i> Send us a message<\/h2>\r\n <p class=\"mt-description\">\r\n Fill in the form below and we'll get back to you as soon as possible.\r\n If you have any questions, special requests or plans for a tour, please let us know.\r\n <\/p>\r\n \r\n <form id=\"mt-contact-form\" novalidate action=\"\">\r\n <div class=\"mt-form-group\">\r\n <label for=\"mt-full-name\" class=\"mt-label\">Full name *<\/label>\r\n <input type=\"text\" id=\"mt-full-name\" class=\"mt-form-control\" required placeholder=\"Your full name\">\r\n <div class=\"mt-error-message\" id=\"mt-name-error\">Please enter your full name<\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-form-group\">\r\n <label for=\"mt-contact-email\" class=\"mt-label\">Email address *<\/label>\r\n <input type=\"email\" id=\"mt-contact-email\" class=\"mt-form-control\" required placeholder=\"votre@email.com\">\r\n <div class=\"mt-error-message\" id=\"mt-email-error\">Please enter a valid email address<\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-form-group\">\r\n <label for=\"mt-contact-phone\" class=\"mt-label\">Phone number *<\/label>\r\n <input type=\"tel\" id=\"mt-contact-phone\" class=\"mt-form-control\" required placeholder=\"+212 6 12 34 56 78\">\r\n <div class=\"mt-error-message\" id=\"mt-phone-error\">Please enter a valid phone number<\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-form-group\">\r\n <label for=\"mt-message\" class=\"mt-label\">Your message *<\/label>\r\n <textarea id=\"mt-message\" class=\"mt-form-control\" required placeholder=\"Describe your hiking project, your expectations, any special questions...\"><\/textarea>\r\n <div class=\"mt-error-message\" id=\"mt-message-error\">Please write your message<\/div>\r\n <\/div>\r\n\r\n <button type=\"submit\" class=\"mt-btn-submit\" id=\"mt-submit-btn\">\r\n <i class=\"fa-solid fa-paper-plane\"><\/i> Send message\r\n <\/button>\r\n <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\r\n <\/section>\r\n <\/div>\r\n\r\n <!-- Contact Info -->\r\n <div class=\"mt-sidebar-content\">\r\n <section class=\"mt-section\">\r\n <h2 class=\"mt-section-title\"><i class=\"fas fa-info-circle\"><\/i> Contact information<\/h2>\r\n \r\n <div class=\"mt-contact-info-grid\">\r\n <div class=\"mt-contact-info-item\">\r\n <div class=\"mt-contact-icon\">\r\n <i class=\"fas fa-map-marker-alt\"><\/i>\r\n <\/div>\r\n <div class=\"mt-contact-details\">\r\n <h3>Main address<\/h3>\r\n <p>\r\n Douar Armed Imlil Asni 42152<br>\r\n By Marrakech - MOROCCO\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-contact-info-item\">\r\n <div class=\"mt-contact-icon\">\r\n <i class=\"fas fa-map-marker-alt\"><\/i>\r\n <\/div>\r\n <div class=\"mt-contact-details\">\r\n <h3>Secondary address<\/h3>\r\n <p>\r\n Mhamid 9 N\u00b0 1033<br>\r\n Marrakech - MOROCCO\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-contact-info-item\">\r\n <div class=\"mt-contact-icon\">\r\n <i class=\"fas fa-phone\"><\/i>\r\n <\/div>\r\n <div class=\"mt-contact-details\">\r\n <h3>Phone<\/h3>\r\n <p>\r\n +212 6 67 59 19 33<br>\r\n Available every day\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-contact-info-item\">\r\n <div class=\"mt-contact-icon\">\r\n <i class=\"fas fa-envelope\"><\/i>\r\n <\/div>\r\n <div class=\"mt-contact-details\">\r\n <h3>Email<\/h3>\r\n <p>\r\n info@maroctreks.com<br>\r\n tadrartmed@gmail.com\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-social-links\">\r\n <a href=\"https:\/\/web.facebook.com\/profile.php?id=61584003150673\" class=\"mt-social-link\" aria-label=\"Facebook\" target=\"_blank\" rel=\"noopener\">\r\n <i class=\"fab fa-facebook-f\"><\/i>\r\n <\/a>\r\n <a href=\"https:\/\/www.instagram.com\/maroc_treks\/\" class=\"mt-social-link\" aria-label=\"Instagram\" target=\"_blank\" rel=\"noopener\">\r\n <i class=\"fab fa-instagram\"><\/i>\r\n <\/a>\r\n <a href=\"https:\/\/wa.link\/26w24d\" class=\"mt-social-link\" aria-label=\"WhatsApp\" target=\"_blank\" rel=\"noopener\">\r\n <i class=\"fab fa-whatsapp\"><\/i>\r\n <\/a>\r\n <\/div>\r\n <\/section>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Thank You Overlay -->\r\n <div class=\"mt-thankyou-overlay\" id=\"mt-thankyou\">\r\n <div class=\"mt-thankyou-card\">\r\n <div class=\"mt-icon\"><i class=\"fa-solid fa-check\"><\/i><\/div>\r\n <h3>Message sent!<\/h3>\r\n <p>We have received your message and will contact you as soon as possible to respond to your request.<\/p>\r\n <div class=\"mt-btn-row\">\r\n <button class=\"mt-btn-submit\" id=\"mt-ty-close\">Close<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"mt-toast\" id=\"mt-toast\" role=\"status\" aria-live=\"polite\"><\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Initialize EmailJS with your PUBLIC KEY\r\n (function(){ \r\n emailjs.init(\"yZHVz5dZwIBbhTQjN\");\r\n })();\r\n\r\n \/* Validation Functions *\/\r\n function validateEmail(email) {\r\n const emailRegex = \/^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$\/;\r\n return emailRegex.test(email);\r\n }\r\n\r\n function validatePhone(phone) {\r\n const cleanPhone = phone.replace(\/\\D\/g, '');\r\n return cleanPhone.length >= 10;\r\n }\r\n\r\n function showError(inputId, errorId, message) {\r\n document.getElementById(inputId).classList.add('mt-error');\r\n document.getElementById(errorId).textContent = message;\r\n document.getElementById(errorId).style.display = 'block';\r\n }\r\n\r\n function hideError(inputId, errorId) {\r\n document.getElementById(inputId).classList.remove('mt-error');\r\n document.getElementById(errorId).style.display = 'none';\r\n }\r\n\r\n function validateForm() {\r\n let isValid = true;\r\n\r\n \/\/ Validate name\r\n const name = document.getElementById('mt-full-name').value.trim();\r\n if (!name) {\r\n showError('mt-full-name', 'mt-name-error', 'Veuillez entrer votre nom complet');\r\n isValid = false;\r\n } else {\r\n hideError('mt-full-name', 'mt-name-error');\r\n }\r\n\r\n \/\/ Validate email\r\n const email = document.getElementById('mt-contact-email').value.trim();\r\n if (!validateEmail(email)) {\r\n showError('mt-contact-email', 'mt-email-error', 'Veuillez entrer une adresse email valide (ex. nom@domaine.com)');\r\n isValid = false;\r\n } else {\r\n hideError('mt-contact-email', 'mt-email-error');\r\n }\r\n\r\n \/\/ Validate phone\r\n const phone = document.getElementById('mt-contact-phone').value.trim();\r\n if (!validatePhone(phone)) {\r\n showError('mt-contact-phone', 'mt-phone-error', 'Veuillez entrer un num\u00e9ro de t\u00e9l\u00e9phone valide avec au moins 10 chiffres');\r\n isValid = false;\r\n } else {\r\n hideError('mt-contact-phone', 'mt-phone-error');\r\n }\r\n\r\n \/\/ Validate message\r\n const message = document.getElementById('mt-message').value.trim();\r\n if (!message) {\r\n showError('mt-message', 'mt-message-error', 'Veuillez \u00e9crire votre message');\r\n isValid = false;\r\n } else {\r\n hideError('mt-message', 'mt-message-error');\r\n }\r\n\r\n return isValid;\r\n }\r\n\r\n \/* Toast *\/\r\n const toast = document.getElementById('mt-toast');\r\n function showToast(text, type = 'success') {\r\n toast.textContent = text;\r\n toast.className = 'mt-toast show ' + type;\r\n setTimeout(() => toast.classList.remove('show'), 5000);\r\n }\r\n\r\n \/* Thank You overlay *\/\r\n const TY = document.getElementById('mt-thankyou');\r\n const TY_CLOSE = document.getElementById('mt-ty-close');\r\n function showThankYou() {\r\n TY.style.display = 'block';\r\n document.body.style.overflow = 'hidden';\r\n }\r\n function hideThankYou() {\r\n TY.style.display = 'none';\r\n document.body.style.overflow = '';\r\n }\r\n TY_CLOSE.addEventListener('click', hideThankYou);\r\n\r\n \/* Form submission *\/\r\n const form = document.getElementById('mt-contact-form');\r\n const submitBtn = document.getElementById('mt-submit-btn');\r\n \r\n if (form) {\r\n form.addEventListener('submit', async (e) => {\r\n e.preventDefault();\r\n \r\n if (!validateForm()) {\r\n showToast('Veuillez corriger les erreurs dans le formulaire', 'error');\r\n return;\r\n }\r\n \r\n submitBtn.disabled = true;\r\n submitBtn.innerHTML = '<i class=\"fas fa-spinner fa-spin\"><\/i> Envoi en cours...';\r\n \r\n try {\r\n const formData = {\r\n full_name: document.getElementById('mt-full-name').value,\r\n email: document.getElementById('mt-contact-email').value,\r\n phone: document.getElementById('mt-contact-phone').value,\r\n message: document.getElementById('mt-message').value\r\n };\r\n \r\n \/\/ Updated EmailJS configuration with your Service ID and Template ID\r\n await emailjs.send('service_n36h9q6', 'template_qeqn0tb', formData);\r\n showThankYou();\r\n form.reset();\r\n } catch (err) {\r\n console.error('EmailJS Error:', err);\r\n showToast('D\u00e9sol\u00e9, une erreur s\\'est produite lors de l\\'envoi de votre message. Veuillez r\u00e9essayer.', 'error');\r\n } finally {\r\n submitBtn.disabled = false;\r\n submitBtn.innerHTML = '<i class=\"fa-solid fa-paper-plane\"><\/i> Envoyer le message';\r\n }\r\n });\r\n }\r\n\r\n \/\/ Real-time validation\r\n document.addEventListener('DOMContentLoaded', function() {\r\n const emailInput = document.getElementById('mt-contact-email');\r\n const phoneInput = document.getElementById('mt-contact-phone');\r\n \r\n if (emailInput) {\r\n emailInput.addEventListener('blur', function() {\r\n if (this.value.trim() && !validateEmail(this.value.trim())) {\r\n showError('mt-contact-email', 'mt-email-error', 'Veuillez entrer une adresse email valide (ex. nom@domaine.com)');\r\n } else {\r\n hideError('mt-contact-email', 'mt-email-error');\r\n }\r\n });\r\n }\r\n \r\n if (phoneInput) {\r\n phoneInput.addEventListener('blur', function() {\r\n if (this.value.trim() && !validatePhone(this.value.trim())) {\r\n showError('mt-contact-phone', 'mt-phone-error', 'Veuillez entrer un num\u00e9ro de t\u00e9l\u00e9phone valide avec au moins 10 chiffres');\r\n } else {\r\n hideError('mt-contact-phone', 'mt-phone-error');\r\n }\r\n });\r\n }\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Contact – Maroc Treks | Randonn\u00e9es au Maroc CONTACT Contact Maroc Treks Pr\u00eat \u00e0 vivre l’aventure ? Contactez-nous pour organiser votre randonn\u00e9e au Maroc. Nous sommes \u00e0 votre disposition pour r\u00e9pondre \u00e0 toutes vos questions. Envoyez-nous un message Remplissez le formulaire ci-dessous et nous vous r\u00e9pondrons dans les plus brefs d\u00e9lais. N’h\u00e9sitez pas \u00e0 nous […]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-641","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/maroctreks.com\/en\/wp-json\/wp\/v2\/pages\/641","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/maroctreks.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/maroctreks.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/maroctreks.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/maroctreks.com\/en\/wp-json\/wp\/v2\/comments?post=641"}],"version-history":[{"count":28,"href":"https:\/\/maroctreks.com\/en\/wp-json\/wp\/v2\/pages\/641\/revisions"}],"predecessor-version":[{"id":1096,"href":"https:\/\/maroctreks.com\/en\/wp-json\/wp\/v2\/pages\/641\/revisions\/1096"}],"wp:attachment":[{"href":"https:\/\/maroctreks.com\/en\/wp-json\/wp\/v2\/media?parent=641"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}