{"id":13,"date":"2026-03-18T15:35:32","date_gmt":"2026-03-18T15:35:32","guid":{"rendered":"http:\/\/dmbpyjc.cluster100.hosting.ovh.net\/?page_id=13"},"modified":"2026-04-14T10:33:49","modified_gmt":"2026-04-14T10:33:49","slug":"accueil","status":"publish","type":"page","link":"https:\/\/harmodul.com\/","title":{"rendered":"Accueil"},"content":{"rendered":"\t\t
\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\nHarmodul \u2014 Construction Modulaire Premium<\/title>\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=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,700;0,9..40,800;1,9..40,300&display=swap\" rel=\"stylesheet\">\r\n\r\n<style>\r\n :root {\r\n --gray-dark: #2e2e2e;\r\n --gray-mid: #555555;\r\n --white: #ffffff;\r\n --black: #000000;\r\n --teal: #96bfad;\r\n --orange: #ff784f;\r\n --gray-light: #f4f3f1;\r\n --gray-border: #e0ddd9;\r\n }\r\n\r\n *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }\r\n html { scroll-behavior: smooth; overflow-x: hidden; }\r\n body { overflow-x: hidden; }\r\n\r\n a { color: inherit; text-decoration: none; }\r\n a:hover, a:focus, a:active, a:visited { color: inherit; text-decoration: none; outline: none; }\r\n body {\r\n font-family: 'DM Sans', sans-serif;\r\n background: var(--white);\r\n color: var(--gray-dark);\r\n overflow-x: hidden;\r\n }\r\n\r\n h1, h2, h3, h4 {\r\n font-family: 'DM Sans', sans-serif;\r\n font-weight: 800;\r\n letter-spacing: -0.01em;\r\n }\r\n\r\n .container-texture {\r\n background-color: var(--gray-dark);\r\n background-image: repeating-linear-gradient(\r\n 90deg,\r\n transparent,\r\n transparent 50px,\r\n rgba(255,255,255,0.02) 50px,\r\n rgba(255,255,255,0.02) 56px\r\n );\r\n }\r\n\r\n \/* \u2500\u2500 SCROLL ANIMATIONS \u2500\u2500 *\/\r\n .reveal { opacity: 1; transform: none; transition: opacity 0.72s cubic-bezier(.22,.68,0,1.2), transform 0.72s cubic-bezier(.22,.68,0,1.2); }\r\n .reveal.anim { opacity: 0; transform: translateY(32px); }\r\n .reveal.anim.visible { opacity: 1; transform: translateY(0); }\r\n\r\n .reveal-left { opacity: 1; transform: none; transition: opacity 0.72s cubic-bezier(.22,.68,0,1.2), transform 0.72s cubic-bezier(.22,.68,0,1.2); }\r\n .reveal-left.anim { opacity: 0; transform: translateX(-40px); }\r\n .reveal-left.anim.visible { opacity: 1; transform: translateX(0); }\r\n\r\n .reveal-right { opacity: 1; transform: none; transition: opacity 0.72s cubic-bezier(.22,.68,0,1.2), transform 0.72s cubic-bezier(.22,.68,0,1.2); }\r\n .reveal-right.anim { opacity: 0; transform: translateX(40px); }\r\n .reveal-right.anim.visible { opacity: 1; transform: translateX(0); }\r\n\r\n .delay-1 { transition-delay: 0.1s; }\r\n .delay-2 { transition-delay: 0.22s; }\r\n .delay-3 { transition-delay: 0.34s; }\r\n .delay-4 { transition-delay: 0.46s; }\r\n\r\n \/* \u2500\u2500 NAV \u2500\u2500 *\/\r\n nav {\r\n position: fixed;\r\n top: 0; left: 0; right: 0;\r\n z-index: 600;\r\n display: flex;\r\n align-items: center;\r\n justify-content: space-between;\r\n padding: 0 48px;\r\n height: 100px;\r\n transition: height 0.4s ease, background 0.4s, box-shadow 0.4s;\r\n }\r\n nav.scrolled {\r\n height: 72px;\r\n background: rgba(255,255,255,0.97);\r\n box-shadow: 0 1px 0 var(--gray-border);\r\n }\r\n nav.scrolled .nav-logo-white { display: none; }\r\n nav.scrolled .nav-logo-color { display: block; }\r\n nav:not(.scrolled) .nav-logo-white { display: block; }\r\n nav:not(.scrolled) .nav-logo-color { display: none; }\r\n\r\n .nav-logo img { width: auto; transition: height 0.4s ease, transform 0.4s cubic-bezier(.34,1.56,.64,1), filter 0.4s ease; }\r\n nav:not(.scrolled) .nav-logo img { height: 88px; }\r\n nav.scrolled .nav-logo img { height: 44px; }\r\n .nav-logo:hover img {\r\n transform: scale(1.07) rotate(-1.5deg);\r\n filter: drop-shadow(0 4px 16px rgba(150,191,173,0.45));\r\n }\r\n\r\n .nav-menu {\r\n display: flex;\r\n align-items: center;\r\n gap: 36px;\r\n list-style: none;\r\n }\r\n .nav-menu a {\r\n text-decoration: none;\r\n font-family: 'DM Sans', sans-serif;\r\n font-size: 14px;\r\n font-weight: 600;\r\n letter-spacing: 0.06em;\r\n text-transform: uppercase;\r\n transition: color 0.2s;\r\n }\r\n nav:not(.scrolled) .nav-menu a { color: rgba(255,255,255,0.88); }\r\n nav:not(.scrolled) .nav-menu a:hover { color: var(--white); }\r\n nav.scrolled .nav-menu a { color: var(--gray-mid); }\r\n nav.scrolled .nav-menu a:hover { color: var(--gray-dark); }\r\n\r\n .nav-cta {\r\n position: relative;\r\n overflow: hidden;\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 8px;\r\n padding: 10px 22px;\r\n background: #466752 !important;\r\n color: var(--white) !important;\r\n border-radius: 4px;\r\n font-size: 12px !important;\r\n font-weight: 700 !important;\r\n letter-spacing: 0.08em !important;\r\n text-transform: uppercase !important;\r\n transition: background 0.2s, transform 0.2s !important;\r\n text-decoration: none !important;\r\n outline: none !important;\r\n box-shadow: none !important;\r\n }\r\n .nav-cta::after {\r\n content: '';\r\n position: absolute;\r\n top: 0; left: -75%;\r\n width: 50%;\r\n height: 100%;\r\n background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.3) 50%, transparent 100%);\r\n transform: skewX(-20deg);\r\n pointer-events: none;\r\n }\r\n .nav-cta:hover::after { left: 130%; transition: left 0.5s cubic-bezier(.4,0,.2,1); }\r\n .nav-cta:hover { background: #354f3e !important; transform: translateY(-1px) !important; color: var(--white) !important; }\r\n .nav-cta:focus, .nav-cta:active, .nav-cta:visited { color: var(--white) !important; background: #466752 !important; }\r\n\r\n \/* \u2500\u2500 HAMBURGER \u2500\u2500 *\/\r\n .hamburger {\r\n display: none;\r\n flex-direction: column;\r\n justify-content: center;\r\n align-items: center;\r\n width: 44px;\r\n height: 44px;\r\n cursor: pointer;\r\n background: transparent !important;\r\n border: none;\r\n padding: 0;\r\n position: relative;\r\n flex-shrink: 0;\r\n -webkit-tap-highlight-color: transparent;\r\n -webkit-appearance: none;\r\n appearance: none;\r\n outline: none !important;\r\n box-shadow: none !important;\r\n }\r\n .hamburger:focus { outline: none !important; box-shadow: none !important; }\r\n .hamburger:active { background: transparent !important; }\r\n .hamburger span {\r\n display: block;\r\n width: 24px;\r\n height: 2px;\r\n border-radius: 2px;\r\n transition: transform 0.35s cubic-bezier(.77,0,.175,1), opacity 0.2s, background 0.3s;\r\n position: absolute;\r\n }\r\n .hamburger span:nth-child(1) { transform: translateY(-8px); }\r\n .hamburger span:nth-child(2) { transform: translateY(0); }\r\n .hamburger span:nth-child(3) { transform: translateY(8px); }\r\n\r\n \/* Couleur selon \u00e9tat scroll *\/\r\n nav:not(.scrolled) .hamburger span { background: var(--white); }\r\n nav.scrolled .hamburger:not(.open) span { background: var(--gray-dark); }\r\n \/* Quand menu ouvert : croix couleur selon scroll *\/\r\n nav:not(.scrolled) .hamburger.open span { background: var(--white) !important; }\r\n nav.scrolled .hamburger.open span { background: var(--gray-dark) !important; }\r\n\r\n .hamburger.open span:nth-child(1) { transform: translateY(0) rotate(45deg); }\r\n .hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }\r\n .hamburger.open span:nth-child(3) { transform: translateY(0) rotate(-45deg); }\r\n\r\n \/* \u2500\u2500 MOBILE MENU OVERLAY \u2500\u2500 *\/\r\n .mobile-menu-overlay {\r\n position: fixed;\r\n inset: 0;\r\n z-index: 500;\r\n background: rgba(20,20,20,0.98);\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 0;\r\n opacity: 0;\r\n visibility: hidden;\r\n transition: opacity 0.3s ease, visibility 0.3s ease;\r\n pointer-events: none;\r\n }\r\n .mobile-menu-overlay.active {\r\n opacity: 1;\r\n visibility: visible;\r\n pointer-events: all;\r\n }\r\n .mobile-menu-overlay ul {\r\n list-style: none;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 8px;\r\n width: 100%;\r\n padding: 0 32px;\r\n }\r\n .mobile-menu-overlay ul li a {\r\n display: block;\r\n font-size: 22px;\r\n font-weight: 700;\r\n color: rgba(255,255,255,0.85);\r\n letter-spacing: 0.04em;\r\n text-transform: uppercase;\r\n padding: 16px 0;\r\n text-align: center;\r\n border-bottom: 1px solid rgba(255,255,255,0.07);\r\n width: 100%;\r\n transition: color 0.2s;\r\n }\r\n .mobile-menu-overlay ul li:last-child a { border-bottom: none; }\r\n .mobile-menu-overlay ul li a:hover { color: var(--teal); }\r\n .mobile-menu-cta {\r\n margin-top: 32px;\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 10px;\r\n padding: 15px 36px;\r\n background: #466752;\r\n color: var(--white) !important;\r\n border-radius: 4px;\r\n font-size: 14px;\r\n font-weight: 700;\r\n letter-spacing: 0.08em;\r\n text-transform: uppercase;\r\n text-decoration: none !important;\r\n }\r\n\r\n \/* \u2500\u2500 FOOTER LOGO ANIMATION \u2500\u2500 *\/\r\n .footer-brand a { display: inline-block; }\r\n .footer-brand a img {\r\n transition: transform 0.4s cubic-bezier(.34,1.56,.64,1), filter 0.4s ease;\r\n }\r\n .footer-brand a:hover img {\r\n transform: scale(1.06) rotate(1deg);\r\n filter: drop-shadow(0 4px 20px rgba(150,191,173,0.5)) brightness(1.08);\r\n }\r\n\r\n \/* \u2500\u2500 HERO \u2500\u2500 *\/\r\n .hero {\r\n position: relative;\r\n min-height: 100vh;\r\n display: flex;\r\n align-items: center;\r\n overflow: hidden;\r\n }\r\n\r\n .hero-bg {\r\n position: absolute;\r\n inset: 0;\r\n background-image: url('https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/task_01kmk1hq3rfyr95h8kf0geckf6_1774460696_img_0.webp');\r\n background-size: cover;\r\n background-position: center;\r\n transform: scale(1.04);\r\n transition: transform 8s ease;\r\n }\r\n .hero-bg.loaded { transform: scale(1); }\r\n\r\n .hero-overlay {\r\n position: absolute;\r\n inset: 0;\r\n background: linear-gradient(100deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.55) 50%, rgba(0,0,0,0.1) 100%);\r\n }\r\n\r\n .hero-content {\r\n position: relative;\r\n z-index: 2;\r\n width: 100%;\r\n padding: 0 64px;\r\n padding-top: 100px;\r\n }\r\n\r\n .hero-tag {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 10px;\r\n font-size: 11px;\r\n font-weight: 500;\r\n letter-spacing: 0.16em;\r\n text-transform: uppercase;\r\n color: var(--teal);\r\n margin-bottom: 28px;\r\n opacity: 0;\r\n transform: translateY(20px);\r\n animation: fadeUp 0.7s 0.3s forwards;\r\n }\r\n .hero-tag::before {\r\n content: '';\r\n display: block;\r\n width: 28px;\r\n height: 1px;\r\n background: var(--teal);\r\n }\r\n\r\n .hero h1 {\r\n font-size: clamp(2.4rem, 5.5vw, 4.2rem);\r\n font-weight: 800;\r\n color: var(--white);\r\n line-height: 1.08;\r\n max-width: 640px;\r\n margin-bottom: 24px;\r\n opacity: 0;\r\n transform: translateY(24px);\r\n animation: fadeUp 0.8s 0.5s forwards;\r\n }\r\n .hero h1 span { color: var(--teal); }\r\n\r\n .hero-sub {\r\n font-size: 17px;\r\n font-weight: 300;\r\n color: rgba(255,255,255,0.78);\r\n max-width: 480px;\r\n line-height: 1.7;\r\n margin-bottom: 40px;\r\n opacity: 0;\r\n transform: translateY(20px);\r\n animation: fadeUp 0.8s 0.7s forwards;\r\n }\r\n\r\n .hero-actions {\r\n display: flex;\r\n gap: 16px;\r\n flex-wrap: wrap;\r\n opacity: 0;\r\n transform: translateY(20px);\r\n animation: fadeUp 0.8s 0.9s forwards;\r\n }\r\n\r\n .btn-primary {\r\n position: relative;\r\n overflow: hidden;\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 10px;\r\n padding: 15px 30px;\r\n background: var(--orange);\r\n color: var(--white) !important;\r\n font-family: 'DM Sans', sans-serif;\r\n font-size: 14px;\r\n font-weight: 700;\r\n letter-spacing: 0.06em;\r\n text-decoration: none !important;\r\n border-radius: 4px;\r\n transition: background 0.2s, transform 0.2s, box-shadow 0.2s;\r\n }\r\n .btn-primary::after {\r\n content: '';\r\n position: absolute;\r\n top: 0; left: -75%;\r\n width: 50%;\r\n height: 100%;\r\n background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.38) 50%, transparent 100%);\r\n transform: skewX(-20deg);\r\n transition: none;\r\n pointer-events: none;\r\n }\r\n .btn-primary:hover::after { left: 130%; transition: left 0.55s cubic-bezier(.4,0,.2,1); }\r\n .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary:visited { color: var(--white) !important; text-decoration: none !important; }\r\n .btn-primary:hover {\r\n background: #e5633a;\r\n transform: translateY(-2px);\r\n box-shadow: 0 8px 28px rgba(255,120,79,0.4);\r\n color: var(--white) !important;\r\n }\r\n\r\n .btn-outline {\r\n position: relative;\r\n overflow: hidden;\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 10px;\r\n padding: 15px 30px;\r\n background: transparent;\r\n color: var(--white) !important;\r\n font-family: 'DM Sans', sans-serif;\r\n font-size: 14px;\r\n font-weight: 700;\r\n letter-spacing: 0.06em;\r\n text-decoration: none !important;\r\n border: 1px solid rgba(255,255,255,0.4);\r\n border-radius: 4px;\r\n transition: border-color 0.2s, background 0.2s, transform 0.2s;\r\n }\r\n .btn-outline::after {\r\n content: '';\r\n position: absolute;\r\n top: 0; left: -75%;\r\n width: 50%;\r\n height: 100%;\r\n background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.22) 50%, transparent 100%);\r\n transform: skewX(-20deg);\r\n pointer-events: none;\r\n }\r\n .btn-outline:hover::after { left: 130%; transition: left 0.55s cubic-bezier(.4,0,.2,1); }\r\n .btn-outline:hover, .btn-outline:focus, .btn-outline:active, .btn-outline:visited {\r\n color: var(--white) !important;\r\n text-decoration: none !important;\r\n border-color: var(--white);\r\n background: rgba(255,255,255,0.08);\r\n transform: translateY(-2px);\r\n }\r\n\r\n .hero-scroll {\r\n position: absolute;\r\n bottom: 36px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n gap: 8px;\r\n opacity: 0;\r\n animation: fadeUp 0.7s 1.4s forwards;\r\n }\r\n .hero-scroll span {\r\n font-size: 10px;\r\n letter-spacing: 0.16em;\r\n text-transform: uppercase;\r\n color: rgba(255,255,255,0.4);\r\n }\r\n .scroll-line {\r\n width: 1px;\r\n height: 40px;\r\n background: linear-gradient(to bottom, rgba(255,255,255,0.4), transparent);\r\n animation: scrollPulse 2s infinite;\r\n }\r\n\r\n @keyframes fadeUp { to { opacity: 1; transform: translateY(0); } }\r\n @keyframes scrollPulse {\r\n 0%, 100% { opacity: 0.4; transform: scaleY(1); }\r\n 50% { opacity: 1; transform: scaleY(1.1); }\r\n }\r\n\r\n \/* \u2500\u2500 SECTION SHARED \u2500\u2500 *\/\r\n section { padding: 100px 0; }\r\n .container { max-width: 1200px; margin: 0 auto; padding: 0 48px; }\r\n\r\n .section-label {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 10px;\r\n font-size: 11px;\r\n font-weight: 600;\r\n letter-spacing: 0.18em;\r\n text-transform: uppercase;\r\n color: var(--teal);\r\n margin-bottom: 16px;\r\n }\r\n .section-label::before {\r\n content: '';\r\n display: block;\r\n width: 24px;\r\n height: 1px;\r\n background: var(--teal);\r\n }\r\n\r\n .section-title {\r\n font-size: clamp(1.8rem, 3.5vw, 2.6rem);\r\n font-weight: 800;\r\n color: var(--gray-dark);\r\n line-height: 1.1;\r\n margin-bottom: 20px;\r\n }\r\n .section-title-white {\r\n font-size: clamp(1.8rem, 3.5vw, 2.6rem);\r\n font-weight: 800;\r\n color: var(--white);\r\n line-height: 1.1;\r\n margin-bottom: 20px;\r\n }\r\n .section-sub {\r\n font-size: 16px;\r\n font-weight: 300;\r\n color: var(--gray-mid);\r\n line-height: 1.8;\r\n max-width: 580px;\r\n margin-bottom: 60px;\r\n }\r\n\r\n \/* \u2500\u2500 CONCEPT \u2500\u2500 *\/\r\n .concept-section { background: var(--gray-light); }\r\n .concept-header { text-align: center; margin-bottom: 64px; }\r\n .concept-header .section-sub { margin: 0 auto 0; }\r\n .concept-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }\r\n\r\n .concept-card {\r\n background: var(--white);\r\n border: 1px solid var(--gray-border);\r\n border-radius: 8px;\r\n padding: 36px 28px;\r\n text-align: center;\r\n transition: transform 0.3s, box-shadow 0.3s;\r\n }\r\n .concept-card:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(0,0,0,0.08); }\r\n\r\n .concept-icon {\r\n width: 56px; height: 56px;\r\n margin: 0 auto 24px;\r\n display: flex; align-items: center; justify-content: center;\r\n background: rgba(150, 191, 173, 0.12);\r\n border-radius: 50%;\r\n }\r\n .concept-icon img { width: 32px; height: 32px; object-fit: contain; }\r\n .concept-card h4 { font-size: 15px; font-weight: 700; color: var(--gray-dark); margin-bottom: 10px; }\r\n .concept-card p { font-size: 14px; color: var(--gray-mid); line-height: 1.7; }\r\n\r\n \/* \u2500\u2500 SOLUTIONS \u2500\u2500 *\/\r\n .solutions-section { background: var(--white); }\r\n .solutions-header { margin-bottom: 60px; }\r\n .solutions-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 28px; }\r\n\r\n .solution-card {\r\n border-radius: 10px;\r\n overflow: hidden;\r\n background: var(--white);\r\n border: 1px solid var(--gray-border);\r\n transition: transform 0.35s, box-shadow 0.35s;\r\n display: flex;\r\n flex-direction: column;\r\n }\r\n .solution-card:hover { transform: translateY(-8px); box-shadow: 0 24px 60px rgba(0,0,0,0.1); }\r\n\r\n .solution-img {\r\n position: relative;\r\n height: 260px;\r\n overflow: hidden;\r\n }\r\n .solution-img img {\r\n width: 100%; height: 100%;\r\n object-fit: cover;\r\n transition: transform 0.5s ease;\r\n }\r\n .solution-card:hover .solution-img img { transform: scale(1.06); }\r\n\r\n .solution-badge {\r\n position: absolute;\r\n top: 16px; left: 16px;\r\n background: var(--orange);\r\n color: var(--white);\r\n font-size: 11px;\r\n font-weight: 700;\r\n letter-spacing: 0.08em;\r\n text-transform: uppercase;\r\n padding: 5px 12px;\r\n border-radius: 3px;\r\n }\r\n\r\n .solution-body { padding: 28px; flex: 1; }\r\n .solution-body .solution-cat {\r\n font-size: 11px;\r\n font-weight: 600;\r\n letter-spacing: 0.14em;\r\n text-transform: uppercase;\r\n color: var(--teal);\r\n margin-bottom: 8px;\r\n }\r\n .solution-body h3 { font-size: 20px; font-weight: 800; color: var(--gray-dark); margin-bottom: 10px; }\r\n .solution-body p { font-size: 14px; color: var(--gray-mid); line-height: 1.75; margin-bottom: 24px; }\r\n\r\n .btn-link {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 8px;\r\n font-family: 'DM Sans', sans-serif;\r\n font-size: 13px;\r\n font-weight: 700;\r\n letter-spacing: 0.06em;\r\n color: var(--gray-dark) !important;\r\n text-decoration: none !important;\r\n border-bottom: 1.5px solid var(--gray-dark);\r\n padding-bottom: 2px;\r\n transition: border-color 0.2s, gap 0.2s;\r\n }\r\n .btn-link:hover, .btn-link:focus, .btn-link:active { color: var(--gray-dark) !important; text-decoration: none !important; border-color: var(--orange); gap: 14px; }\r\n .btn-link svg { width: 14px; height: 14px; transition: transform 0.2s; }\r\n .btn-link:hover svg { transform: translateX(3px); }\r\n\r\n \/* \u2500\u2500 WHY HARMODUL \u2500\u2500 *\/\r\n .why-section { padding: 0; }\r\n .why-inner { display: grid; grid-template-columns: 1fr 1fr; min-height: 640px; }\r\n .why-image { position: relative; overflow: hidden; }\r\n .why-image img { width: 100%; height: 100%; object-fit: cover; display: block; }\r\n\r\n .why-content {\r\n padding: 80px 72px;\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n }\r\n\r\n .container-texture .section-label { color: var(--teal); }\r\n .container-texture .section-label::before { background: var(--teal); }\r\n\r\n .advantages-list { display: flex; flex-direction: column; gap: 20px; margin-top: 16px; }\r\n .advantage-item { display: flex; align-items: flex-start; gap: 16px; }\r\n .advantage-icon {\r\n width: 40px; height: 40px; flex-shrink: 0;\r\n background: rgba(150, 191, 173, 0.15);\r\n border-radius: 6px;\r\n display: flex; align-items: center; justify-content: center;\r\n }\r\n .advantage-icon img { width: 24px; height: 24px; object-fit: contain; }\r\n .advantage-text h4 { font-size: 15px; font-weight: 700; color: var(--white); margin-bottom: 3px; }\r\n .advantage-text p { font-size: 13px; color: rgba(255,255,255,0.6); line-height: 1.6; }\r\n\r\n \/* \u2500\u2500 AFRIQUE \u2500\u2500 *\/\r\n .africa-section { background: var(--gray-light); }\r\n .africa-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }\r\n .africa-content .section-sub { margin-bottom: 32px; }\r\n\r\n .africa-stat {\r\n display: flex; gap: 40px;\r\n margin-top: 40px; padding-top: 40px;\r\n border-top: 1px solid var(--gray-border);\r\n }\r\n .africa-stat-item .num {\r\n font-family: 'DM Sans', sans-serif;\r\n font-size: 2.6rem; font-weight: 800;\r\n color: var(--gray-dark); line-height: 1;\r\n }\r\n .africa-stat-item .num span { color: var(--orange); }\r\n .africa-stat-item p { font-size: 13px; color: var(--gray-mid); margin-top: 6px; }\r\n\r\n .africa-image {\r\n position: relative;\r\n border-radius: 10px;\r\n overflow: hidden;\r\n aspect-ratio: 3\/4;\r\n max-height: 540px;\r\n }\r\n .africa-image img {\r\n width: 100%; height: 100%;\r\n object-fit: cover; display: block;\r\n transition: transform 6s ease;\r\n }\r\n .africa-image:hover img { transform: scale(1.04); }\r\n .africa-image-accent {\r\n position: absolute;\r\n bottom: -1px; left: -1px; right: -1px;\r\n height: 120px;\r\n background: linear-gradient(to top, var(--gray-light), transparent);\r\n }\r\n\r\n \/* \u2500\u2500 PROCESS \u2500\u2500 *\/\r\n .process-section { background: var(--white); overflow: hidden; }\r\n .process-header { text-align: center; margin-bottom: 80px; }\r\n .process-header .section-sub { margin: 0 auto; }\r\n\r\n .process-grid {\r\n display: grid;\r\n grid-template-columns: repeat(4, 1fr);\r\n gap: 0;\r\n position: relative;\r\n }\r\n .process-grid::before {\r\n content: '';\r\n position: absolute;\r\n top: 40px; left: 10%; right: 10%;\r\n height: 1px;\r\n background: var(--gray-border);\r\n z-index: 0;\r\n }\r\n\r\n .process-step { text-align: center; padding: 0 24px; position: relative; z-index: 1; }\r\n\r\n .process-num {\r\n width: 80px; height: 80px;\r\n border-radius: 50%;\r\n background: var(--white);\r\n border: 1px solid var(--gray-border);\r\n display: flex; align-items: center; justify-content: center;\r\n margin: 0 auto 28px;\r\n font-family: 'DM Sans', sans-serif;\r\n font-size: 22px; font-weight: 800;\r\n color: var(--gray-dark);\r\n transition: background 0.3s, color 0.3s, border-color 0.3s;\r\n }\r\n .process-step:hover .process-num { background: var(--orange); color: var(--white); border-color: var(--orange); }\r\n .process-step h4 { font-size: 16px; font-weight: 700; color: var(--gray-dark); margin-bottom: 10px; }\r\n .process-step p { font-size: 14px; color: var(--gray-mid); line-height: 1.7; }\r\n\r\n \/* \u2500\u2500 CTA FINAL \u2500\u2500 *\/\r\n .cta-section { padding: 0; position: relative; overflow: hidden; }\r\n .cta-inner { position: relative; min-height: 560px; display: flex; align-items: center; }\r\n\r\n .cta-bg-image {\r\n position: absolute; inset: 0;\r\n background-image: url('https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/task_01kmk20y62f0bvqgz6jfkf8p74_1774461203_img_1.webp');\r\n background-size: cover;\r\n background-position: center;\r\n }\r\n\r\n .cta-overlay {\r\n position: absolute; inset: 0;\r\n background-color: rgba(30,30,30,0.88);\r\n background-image: repeating-linear-gradient(\r\n 90deg, transparent, transparent 50px,\r\n rgba(255,255,255,0.02) 50px, rgba(255,255,255,0.02) 56px\r\n );\r\n }\r\n\r\n .cta-content {\r\n position: relative; z-index: 2;\r\n max-width: 1200px; margin: 0 auto;\r\n padding: 80px 48px; text-align: center;\r\n }\r\n .cta-content .section-label { justify-content: center; color: var(--teal); }\r\n .cta-content .section-label::before { background: var(--teal); }\r\n .cta-content h2 { font-size: clamp(2rem, 4vw, 3.2rem); font-weight: 800; color: var(--white); margin-bottom: 20px; }\r\n .cta-content p { font-size: 17px; color: rgba(255,255,255,0.7); max-width: 500px; margin: 0 auto 48px; line-height: 1.8; font-weight: 300; }\r\n .cta-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }\r\n\r\n \/* \u2500\u2500 FOOTER \u2500\u2500 *\/\r\n footer {\r\n background-color: #1e1e1e;\r\n background-image: repeating-linear-gradient(\r\n 90deg, transparent, transparent 50px,\r\n rgba(255,255,255,0.015) 50px, rgba(255,255,255,0.015) 56px\r\n );\r\n padding: 64px 0 32px;\r\n color: rgba(255,255,255,0.7);\r\n }\r\n\r\n .footer-inner {\r\n display: grid;\r\n grid-template-columns: 1.5fr 1fr 1fr 1fr;\r\n gap: 48px;\r\n margin-bottom: 56px;\r\n }\r\n\r\n .footer-brand img { height: 110px; margin-bottom: 20px; display: block; }\r\n .footer-brand p { font-size: 14px; line-height: 1.75; color: rgba(255,255,255,0.5); max-width: 260px; }\r\n\r\n .footer-col h5 {\r\n font-family: 'DM Sans', sans-serif;\r\n font-size: 12px; font-weight: 700;\r\n letter-spacing: 0.16em;\r\n text-transform: uppercase;\r\n color: var(--white);\r\n margin-bottom: 20px;\r\n }\r\n .footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 10px; }\r\n .footer-col ul a { font-size: 14px; color: rgba(255,255,255,0.5); text-decoration: none; transition: color 0.2s; }\r\n .footer-col ul a:hover { color: var(--teal); }\r\n\r\n .footer-bottom {\r\n border-top: 1px solid rgba(255,255,255,0.08);\r\n padding-top: 28px;\r\n display: flex; justify-content: space-between; align-items: center;\r\n gap: 16px;\r\n }\r\n .footer-bottom p { font-size: 13px; color: rgba(255,255,255,0.35); white-space: nowrap; }\r\n\r\n \/* \u2500\u2500 DIVIDER \u2500\u2500 *\/\r\n .divider-accent { height: 4px; background: linear-gradient(90deg, var(--orange) 0%, var(--teal) 100%); }\r\n\r\n \/* \u2500\u2500 MOBILE CAROUSEL \u2500\u2500 *\/\r\n .mobile-carousel-wrapper {\r\n display: none;\r\n position: relative;\r\n width: 100%;\r\n overflow: hidden;\r\n }\r\n .mobile-carousel-track {\r\n display: flex;\r\n transition: transform 0.4s cubic-bezier(.25,.46,.45,.94);\r\n will-change: transform;\r\n }\r\n .mobile-carousel-track .concept-card,\r\n .mobile-carousel-track .process-step {\r\n flex: 0 0 100%;\r\n width: 100%;\r\n margin-right: 0;\r\n }\r\n .mobile-carousel-track .process-step {\r\n background: var(--white);\r\n border: 1px solid var(--gray-border);\r\n border-radius: 8px;\r\n padding: 36px 24px;\r\n }\r\n .mobile-carousel-dots {\r\n display: flex;\r\n justify-content: center;\r\n gap: 8px;\r\n margin-top: 24px;\r\n }\r\n .carousel-dot {\r\n width: 8px; height: 8px;\r\n border-radius: 50%;\r\n background: var(--gray-border);\r\n border: none;\r\n cursor: pointer;\r\n padding: 0;\r\n transition: background 0.2s, transform 0.2s;\r\n }\r\n .carousel-dot.active { background: var(--orange); transform: scale(1.25); }\r\n\r\n \/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n @media (max-width: 1024px) {\r\n nav { padding: 0 28px; }\r\n .container { padding: 0 28px; }\r\n .concept-grid { grid-template-columns: repeat(2, 1fr); }\r\n .solutions-grid { grid-template-columns: 1fr 1fr; }\r\n .process-grid { grid-template-columns: repeat(2, 1fr); gap: 40px; }\r\n .process-grid::before { display: none; }\r\n .africa-inner { gap: 48px; }\r\n .footer-inner { grid-template-columns: 1fr 1fr; }\r\n }\r\n\r\n @media (max-width: 768px) {\r\n nav { padding: 0 20px; }\r\n nav .nav-menu { display: none; }\r\n .hamburger { display: flex; }\r\n\r\n .container { padding: 0 20px; }\r\n section { padding: 72px 0; }\r\n .hero-content { padding: 0 20px; padding-top: 72px; }\r\n .why-inner { grid-template-columns: 1fr; }\r\n .why-image { height: 320px; }\r\n .why-content { padding: 56px 28px; }\r\n .africa-inner { grid-template-columns: 1fr; }\r\n .africa-image { aspect-ratio: 16\/9; }\r\n .solutions-grid { grid-template-columns: 1fr; }\r\n\r\n \/* Hide desktop grids, show carousels *\/\r\n .concept-grid { display: none; }\r\n .process-grid { display: none; }\r\n .mobile-carousel-wrapper { display: block; }\r\n .mobile-carousel-track .concept-card,\r\n .mobile-carousel-track .process-step {\r\n flex: 0 0 100%;\r\n width: 100%;\r\n }\r\n\r\n \/* Process header on mobile *\/\r\n .process-header { margin-bottom: 48px; }\r\n\r\n \/* Footer mobile *\/\r\n .footer-inner {\r\n grid-template-columns: 1fr;\r\n text-align: center;\r\n gap: 32px;\r\n }\r\n .footer-brand img { margin: 0 auto 20px; }\r\n .footer-brand p { max-width: 100%; margin: 0 auto; }\r\n .footer-col.footer-hide-mobile { display: none; }\r\n .footer-col ul { align-items: center; }\r\n .footer-bottom {\r\n flex-direction: column;\r\n gap: 12px;\r\n text-align: center;\r\n }\r\n .footer-bottom p { white-space: normal; }\r\n .cta-content { padding: 64px 20px; }\r\n }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<!-- \u2500\u2500 NAVIGATION \u2500\u2500 -->\r\n<nav id=\"navbar\">\r\n <a href=\"https:\/\/harmodul.com\" class=\"nav-logo\">\r\n <img decoding=\"async\" class=\"nav-logo-white\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-3.png\" alt=\"Harmodul\">\r\n <img decoding=\"async\" class=\"nav-logo-color\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png\" alt=\"Harmodul\">\r\n <\/a>\r\n <ul class=\"nav-menu\">\r\n <li><a href=\"https:\/\/harmodul.com\">Accueil<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/concept-modulaire\/\">Concept<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/nos-modules\/\">Nos modules<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/presentation\/\">Pr\u00e9sentation<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/contact\/\" class=\"nav-cta\">Devis<\/a><\/li>\r\n <\/ul>\r\n <button class=\"hamburger\" id=\"hamburger\" aria-label=\"Menu\">\r\n <span><\/span>\r\n <span><\/span>\r\n <span><\/span>\r\n <\/button>\r\n<\/nav>\r\n\r\n<!-- \u2500\u2500 MOBILE MENU OVERLAY \u2500\u2500 -->\r\n<div class=\"mobile-menu-overlay\" id=\"mobileMenu\">\r\n <ul>\r\n <li><a href=\"https:\/\/harmodul.com\" onclick=\"closeMobileMenu()\">Accueil<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/concept-modulaire\/\" onclick=\"closeMobileMenu()\">Concept<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/nos-modules\/\" onclick=\"closeMobileMenu()\">Nos modules<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/presentation\/\" onclick=\"closeMobileMenu()\">Pr\u00e9sentation<\/a><\/li>\r\n <\/ul>\r\n <a href=\"https:\/\/harmodul.com\/index.php\/contact\/\" class=\"mobile-menu-cta\" onclick=\"closeMobileMenu()\">Demander un devis \u2192<\/a>\r\n<\/div>\r\n\r\n<!-- \u2500\u2500 HERO \u2500\u2500 -->\r\n<section class=\"hero\" id=\"accueil\">\r\n <div class=\"hero-bg\" id=\"heroBg\"><\/div>\r\n <div class=\"hero-overlay\"><\/div>\r\n <div class=\"hero-content\">\r\n <div class=\"hero-tag\">Construction modulaire<\/div>\r\n <h1>Construire autrement<br>avec <span>Harmodul<\/span><\/h1>\r\n <p class=\"hero-sub\">Des solutions modulaires innovantes, durables et accessibles pour l'habitat, les commerces et les infrastructures.<\/p>\r\n <div class=\"hero-actions\">\r\n <a href=\"#cta\" class=\"btn-primary\">\r\n Demander un devis\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" viewBox=\"0 0 24 24\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\r\n <\/a>\r\n <a href=\"#solutions\" class=\"btn-outline\">D\u00e9couvrir nos solutions<\/a>\r\n <\/div>\r\n <\/div>\r\n <div class=\"hero-scroll\">\r\n <span>Scroll<\/span>\r\n <div class=\"scroll-line\"><\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<div class=\"divider-accent\"><\/div>\r\n\r\n<!-- \u2500\u2500 CONCEPT \u2500\u2500 -->\r\n<section class=\"concept-section\" id=\"concept\">\r\n <div class=\"container\">\r\n <div class=\"concept-header reveal\">\r\n <div class=\"section-label\">Notre approche<\/div>\r\n <h2 class=\"section-title\">La construction modulaire,<br>une nouvelle fa\u00e7on de b\u00e2tir<\/h2>\r\n <p class=\"section-sub\" style=\"margin:0 auto\">Con\u00e7ue \u00e0 partir de conteneurs maritimes recycl\u00e9s, la construction modulaire offre une alternative rapide, \u00e9conomique et durable aux m\u00e9thodes traditionnelles. Chaque module est fabriqu\u00e9 en atelier, puis assembl\u00e9 sur site avec pr\u00e9cision.<\/p>\r\n <\/div>\r\n\r\n <!-- Desktop grid -->\r\n <div class=\"concept-grid\">\r\n <div class=\"concept-card reveal delay-1\">\r\n <div class=\"concept-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/4.png\" alt=\"Construction rapide\"><\/div>\r\n <h4>Construction rapide<\/h4>\r\n <p>Des d\u00e9lais jusqu'\u00e0 3\u00d7 plus courts qu'une construction traditionnelle gr\u00e2ce \u00e0 la pr\u00e9fabrication en atelier.<\/p>\r\n <\/div>\r\n <div class=\"concept-card reveal delay-2\">\r\n <div class=\"concept-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/3-1.png\" alt=\"\u00c9cologique\"><\/div>\r\n <h4>\u00c9cologique<\/h4>\r\n <p>R\u00e9utilisation de conteneurs existants, r\u00e9duction des d\u00e9chets de chantier et empreinte carbone minimis\u00e9e.<\/p>\r\n <\/div>\r\n <div class=\"concept-card reveal delay-3\">\r\n <div class=\"concept-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/2-1.png\" alt=\"Co\u00fbt ma\u00eetris\u00e9\"><\/div>\r\n <h4>Co\u00fbt ma\u00eetris\u00e9<\/h4>\r\n <p>Budget pr\u00e9visible et ma\u00eetris\u00e9 d\u00e8s la conception. Pas de mauvaises surprises ni de d\u00e9passements.<\/p>\r\n <\/div>\r\n <div class=\"concept-card reveal delay-4\">\r\n <div class=\"concept-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/1-1.png\" alt=\"Modulable\"><\/div>\r\n <h4>Modulable<\/h4>\r\n <p>Extensions, empilages, reconfigurations : vos besoins \u00e9voluent, vos modules aussi.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Mobile carousel -->\r\n <div class=\"mobile-carousel-wrapper\" id=\"conceptCarousel\">\r\n <div class=\"mobile-carousel-track\" id=\"conceptTrack\">\r\n <div class=\"concept-card\">\r\n <div class=\"concept-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/4.png\" alt=\"Construction rapide\"><\/div>\r\n <h4>Construction rapide<\/h4>\r\n <p>Des d\u00e9lais jusqu'\u00e0 3\u00d7 plus courts qu'une construction traditionnelle gr\u00e2ce \u00e0 la pr\u00e9fabrication en atelier.<\/p>\r\n <\/div>\r\n <div class=\"concept-card\">\r\n <div class=\"concept-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/3-1.png\" alt=\"\u00c9cologique\"><\/div>\r\n <h4>\u00c9cologique<\/h4>\r\n <p>R\u00e9utilisation de conteneurs existants, r\u00e9duction des d\u00e9chets de chantier et empreinte carbone minimis\u00e9e.<\/p>\r\n <\/div>\r\n <div class=\"concept-card\">\r\n <div class=\"concept-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/2-1.png\" alt=\"Co\u00fbt ma\u00eetris\u00e9\"><\/div>\r\n <h4>Co\u00fbt ma\u00eetris\u00e9<\/h4>\r\n <p>Budget pr\u00e9visible et ma\u00eetris\u00e9 d\u00e8s la conception. Pas de mauvaises surprises ni de d\u00e9passements.<\/p>\r\n <\/div>\r\n <div class=\"concept-card\">\r\n <div class=\"concept-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/1-1.png\" alt=\"Modulable\"><\/div>\r\n <h4>Modulable<\/h4>\r\n <p>Extensions, empilages, reconfigurations : vos besoins \u00e9voluent, vos modules aussi.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"mobile-carousel-dots\" id=\"conceptDots\"><\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<!-- \u2500\u2500 SOLUTIONS \u2500\u2500 -->\r\n<section class=\"solutions-section\" id=\"solutions\">\r\n <div class=\"container\">\r\n <div class=\"solutions-header reveal\">\r\n <div class=\"section-label\">Gamme de produits<\/div>\r\n <h2 class=\"section-title\">Nos solutions modulaires<\/h2>\r\n <p class=\"section-sub\">Quatre domaines d'expertise pour r\u00e9pondre \u00e0 chaque projet, chaque besoin et chaque territoire.<\/p>\r\n <\/div>\r\n <div class=\"solutions-grid\">\r\n <div class=\"solution-card reveal delay-1\">\r\n <div class=\"solution-img\">\r\n <img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/2.png\" alt=\"Espaces de vie & professionnels\">\r\n <div class=\"solution-badge\">\ud83c\udfe0 Espaces de vie<\/div>\r\n <\/div>\r\n <div class=\"solution-body\">\r\n <div class=\"solution-cat\">Habitations \u00b7 Bureaux \u00b7 Commerces \u00b7 Bases vie<\/div>\r\n <h3>Espaces de vie & professionnels<\/h3>\r\n <p>Des espaces confortables, rapides \u00e0 d\u00e9ployer et enti\u00e8rement personnalisables pour r\u00e9pondre \u00e0 tous les besoins du quotidien comme des activit\u00e9s professionnelles.<\/p>\r\n <a href=\"https:\/\/harmodul.com\/index.php\/contact\/\" class=\"btn-link\">\r\n En savoir plus\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"solution-card reveal delay-2\">\r\n <div class=\"solution-img\">\r\n <img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/task_01km5tj3ftfbcv5wkyg211dce8_1774017159_img_0.webp\" alt=\"Autonomie \u00e9nerg\u00e9tique\">\r\n <div class=\"solution-badge\" style=\"background:var(--teal)\">\u26a1 \u00c9nergie<\/div>\r\n <\/div>\r\n <div class=\"solution-body\">\r\n <div class=\"solution-cat\">Solutions photovolta\u00efques int\u00e9gr\u00e9es<\/div>\r\n <h3>Autonomie \u00e9nerg\u00e9tique<\/h3>\r\n <p>Production d'\u00e9nergie autonome gr\u00e2ce \u00e0 des installations solaires adapt\u00e9es, avec optimisation des performances et maintenance int\u00e9gr\u00e9e.<\/p>\r\n <a href=\"https:\/\/harmodul.com\/index.php\/contact\/\" class=\"btn-link\">\r\n En savoir plus\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"solution-card reveal delay-3\">\r\n <div class=\"solution-img\">\r\n <img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/task_01km5t7381fjv8sh3wnvnscefx_1774016802_img_1.webp\" alt=\"Solutions agricoles\">\r\n <div class=\"solution-badge\" style=\"background:#4a7c59\">\ud83c\udf31 Agriculture<\/div>\r\n <\/div>\r\n <div class=\"solution-body\">\r\n <div class=\"solution-cat\">Unit\u00e9s modulaires pour l'agriculture<\/div>\r\n <h3>Solutions agricoles<\/h3>\r\n <p>Espaces d\u00e9di\u00e9s au stockage, \u00e0 la transformation et \u00e0 la production agricole, favorisant l'autonomie alimentaire et le d\u00e9veloppement local.<\/p>\r\n <a href=\"https:\/\/harmodul.com\/index.php\/contact\/\" class=\"btn-link\">\r\n En savoir plus\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"solution-card reveal delay-4\">\r\n <div class=\"solution-img\">\r\n <img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/task_01km5t1b5jfd1b31gjma43wav9_1774016614_img_0.webp\" alt=\"Centre de formation\">\r\n <div class=\"solution-badge\" style=\"background:#2e2e2e\">\ud83c\udf93 Formation<\/div>\r\n <\/div>\r\n <div class=\"solution-body\">\r\n <div class=\"solution-cat\">Espaces p\u00e9dagogiques modulaires<\/div>\r\n <h3>Centre de formation<\/h3>\r\n <p>Structures con\u00e7ues pour la formation et la mont\u00e9e en comp\u00e9tences, adapt\u00e9es aux besoins locaux et aux enjeux de d\u00e9veloppement.<\/p>\r\n <a href=\"https:\/\/harmodul.com\/index.php\/contact\/\" class=\"btn-link\">\r\n En savoir plus\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\r\n <\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<!-- \u2500\u2500 WHY HARMODUL \u2500\u2500 -->\r\n<section class=\"why-section\" id=\"pourquoi\">\r\n <div class=\"why-inner\">\r\n <div class=\"why-image reveal-left\">\r\n <img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/task_01km5v00d1ewpra7de69rn2386_1774017611_img_0.webp\" alt=\"Pourquoi Harmodul\">\r\n <\/div>\r\n <div class=\"why-content container-texture reveal-right\">\r\n <div class=\"section-label\">Nos engagements<\/div>\r\n <h2 class=\"section-title-white\">Pourquoi choisir<br>Harmodul ?<\/h2>\r\n <div class=\"advantages-list\">\r\n <div class=\"advantage-item\">\r\n <div class=\"advantage-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/8-1.png\" alt=\"Rapidit\u00e9 de construction\"><\/div>\r\n <div class=\"advantage-text\">\r\n <h4>Rapidit\u00e9 de construction<\/h4>\r\n <p>Livraison 3 \u00e0 4 fois plus rapide qu'une construction traditionnelle.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"advantage-item\">\r\n <div class=\"advantage-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/7-1.png\" alt=\"R\u00e9duction des co\u00fbts\"><\/div>\r\n <div class=\"advantage-text\">\r\n <h4>R\u00e9duction des co\u00fbts<\/h4>\r\n <p>Budget transparent, sans surco\u00fbts cach\u00e9s ni impr\u00e9vus de chantier.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"advantage-item\">\r\n <div class=\"advantage-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/9-1.png\" alt=\"Mat\u00e9riaux durables\"><\/div>\r\n <div class=\"advantage-text\">\r\n <h4>Mat\u00e9riaux durables<\/h4>\r\n <p>Acier Corten, isolants performants, finitions de qualit\u00e9 pour une dur\u00e9e de vie maximale.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"advantage-item\">\r\n <div class=\"advantage-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/9-1.png\" alt=\"Adaptation au climat\"><\/div>\r\n <div class=\"advantage-text\">\r\n <h4>Adaptation au climat<\/h4>\r\n <p>Solutions pens\u00e9es pour les sp\u00e9cificit\u00e9s climatiques de chaque r\u00e9gion.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"advantage-item\">\r\n <div class=\"advantage-icon\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/6-1.png\" alt=\"Solutions \u00e9volutives\"><\/div>\r\n <div class=\"advantage-text\">\r\n <h4>Solutions \u00e9volutives<\/h4>\r\n <p>Ajoutez, modifiez ou d\u00e9placez vos modules au fil de vos besoins.<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<!-- \u2500\u2500 AFRIQUE \u2500\u2500 -->\r\n<section class=\"africa-section\">\r\n <div class=\"container\">\r\n <div class=\"africa-inner\">\r\n <div class=\"africa-content reveal-left\">\r\n <div class=\"section-label\">Vision & March\u00e9<\/div>\r\n <h2 class=\"section-title\">Le modulaire,<br>nouvel horizon africain<\/h2>\r\n <p class=\"section-sub\">L'Afrique conna\u00eet l'une des urbanisations les plus rapides de l'histoire. Face \u00e0 un besoin massif en logements, en commerces et en infrastructures, la construction modulaire s'impose comme une r\u00e9ponse concr\u00e8te, rapide et durable \u00e0 cette \u00e9quation complexe.<\/p>\r\n <p style=\"font-size:15px;color:var(--gray-mid);line-height:1.8;font-weight:300\">Harmodul accompagne ce mouvement en proposant des solutions adapt\u00e9es aux r\u00e9alit\u00e9s du continent : accessibilit\u00e9 \u00e9conomique, r\u00e9sistance climatique, rapidit\u00e9 d'installation et respect de l'environnement local.<\/p>\r\n <div class=\"africa-stat\">\r\n <div class=\"africa-stat-item\">\r\n <div class=\"num\">60<span>%<\/span><\/div>\r\n <p>des Africains vivront<br>en ville d'ici 2050<\/p>\r\n <\/div>\r\n <div class=\"africa-stat-item\">\r\n <div class=\"num\">3<span>\u00d7<\/span><\/div>\r\n <p>plus rapide qu'une<br>construction classique<\/p>\r\n <\/div>\r\n <\/div>\r\n <div style=\"margin-top:36px\">\r\n <a href=\"#cta\" class=\"btn-primary\">En savoir plus sur notre vision<\/a>\r\n <\/div>\r\n <\/div>\r\n <div class=\"africa-image reveal-right\">\r\n <img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/WhatsApp-Image-2026-03-20-at-18.03.09.jpg\" alt=\"Afrique modulaire\">\r\n <div class=\"africa-image-accent\"><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<!-- \u2500\u2500 PROCESS \u2500\u2500 -->\r\n<section class=\"process-section\" id=\"process\">\r\n <div class=\"container\">\r\n <div class=\"process-header reveal\">\r\n <div class=\"section-label\">Notre m\u00e9thode<\/div>\r\n <h2 class=\"section-title\">Un processus simple et efficace<\/h2>\r\n <p class=\"section-sub\">De votre id\u00e9e \u00e0 la remise des cl\u00e9s, nous vous accompagnons \u00e0 chaque \u00e9tape avec m\u00e9thode et transparence.<\/p>\r\n <\/div>\r\n\r\n <!-- Desktop grid -->\r\n <div class=\"process-grid\">\r\n <div class=\"process-step reveal delay-1\">\r\n <div class=\"process-num\">01<\/div>\r\n <h4>Analyse de vos besoins<\/h4>\r\n <p>\u00c9tude de votre projet, de vos contraintes et de vos objectifs afin de d\u00e9finir une solution adapt\u00e9e.<\/p>\r\n <\/div>\r\n <div class=\"process-step reveal delay-2\">\r\n <div class=\"process-num\">02<\/div>\r\n <h4>Conception sur mesure<\/h4>\r\n <p>Cr\u00e9ation d'un projet personnalis\u00e9 : plans, am\u00e9nagements, choix des mat\u00e9riaux et options techniques.<\/p>\r\n <\/div>\r\n <div class=\"process-step reveal delay-3\">\r\n <div class=\"process-num\">03<\/div>\r\n <h4>Fabrication en atelier<\/h4>\r\n <p>Production des modules dans des conditions optimis\u00e9es, garantissant qualit\u00e9, rapidit\u00e9 et ma\u00eetrise des co\u00fbts.<\/p>\r\n <\/div>\r\n <div class=\"process-step reveal delay-4\">\r\n <div class=\"process-num\">04<\/div>\r\n <h4>Livraison & installation cl\u00e9 en main<\/h4>\r\n <p>Transport, assemblage et mise en service sur site pour une solution pr\u00eate \u00e0 l'emploi.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Mobile carousel -->\r\n <div class=\"mobile-carousel-wrapper\" id=\"processCarousel\">\r\n <div class=\"mobile-carousel-track\" id=\"processTrack\">\r\n <div class=\"process-step\">\r\n <div class=\"process-num\">01<\/div>\r\n <h4>Analyse de vos besoins<\/h4>\r\n <p>\u00c9tude de votre projet, de vos contraintes et de vos objectifs afin de d\u00e9finir une solution adapt\u00e9e.<\/p>\r\n <\/div>\r\n <div class=\"process-step\">\r\n <div class=\"process-num\">02<\/div>\r\n <h4>Conception sur mesure<\/h4>\r\n <p>Cr\u00e9ation d'un projet personnalis\u00e9 : plans, am\u00e9nagements, choix des mat\u00e9riaux et options techniques.<\/p>\r\n <\/div>\r\n <div class=\"process-step\">\r\n <div class=\"process-num\">03<\/div>\r\n <h4>Fabrication en atelier<\/h4>\r\n <p>Production des modules dans des conditions optimis\u00e9es, garantissant qualit\u00e9, rapidit\u00e9 et ma\u00eetrise des co\u00fbts.<\/p>\r\n <\/div>\r\n <div class=\"process-step\">\r\n <div class=\"process-num\">04<\/div>\r\n <h4>Livraison & installation cl\u00e9 en main<\/h4>\r\n <p>Transport, assemblage et mise en service sur site pour une solution pr\u00eate \u00e0 l'emploi.<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"mobile-carousel-dots\" id=\"processDots\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"reveal\" style=\"margin-top:72px;border-radius:10px;overflow:hidden;max-height:400px\">\r\n <img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/task_01kmk253bsf1saa9t7fpd27nha_1774461324_img_0.webp\" alt=\"Processus Harmodul\" style=\"width:100%;height:100%;object-fit:cover;object-position:center 75%;display:block\">\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<!-- \u2500\u2500 CTA FINAL \u2500\u2500 -->\r\n<section class=\"cta-section\" id=\"cta\">\r\n <div class=\"cta-inner\">\r\n <div class=\"cta-bg-image\"><\/div>\r\n <div class=\"cta-overlay\"><\/div>\r\n <div class=\"cta-content\">\r\n <div class=\"section-label\">Passez \u00e0 l'action<\/div>\r\n <h2 class=\"reveal\">Un projet ?<br>Parlons-en.<\/h2>\r\n <p class=\"reveal delay-1\">Contactez-nous pour \u00e9tudier votre projet et obtenir un devis personnalis\u00e9, sans engagement.<\/p>\r\n <div class=\"cta-actions reveal delay-2\">\r\n <a href=\"https:\/\/harmodul.com\/index.php\/contact\/\" class=\"btn-primary\">\r\n Demander un devis\r\n <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"16\" height=\"16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" viewBox=\"0 0 24 24\"><path d=\"M5 12h14M12 5l7 7-7 7\"\/><\/svg>\r\n <\/a>\r\n <a href=\"https:\/\/harmodul.com\/index.php\/contact\/\" class=\"btn-outline\">Nous contacter<\/a>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/section>\r\n\r\n<!-- \u2500\u2500 FOOTER \u2500\u2500 -->\r\n<footer id=\"contact\">\r\n <div class=\"container\">\r\n <div class=\"footer-inner\">\r\n <div class=\"footer-brand\">\r\n <a href=\"https:\/\/harmodul.com\"><img decoding=\"async\" src=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-3.png\" alt=\"Harmodul\"><\/a>\r\n <p>Harmodul con\u00e7oit et livre des espaces modulaires \u00e0 base de conteneurs pour l'habitat, les commerces et les infrastructures.<\/p>\r\n <\/div>\r\n <!-- Hidden on mobile -->\r\n <div class=\"footer-col footer-hide-mobile\">\r\n <h5>Navigation<\/h5>\r\n <ul>\r\n <li><a href=\"#accueil\">Accueil<\/a><\/li>\r\n <li><a href=\"#concept\">Pr\u00e9sentation<\/a><\/li>\r\n <li><a href=\"#solutions\">Nos modules<\/a><\/li>\r\n <li><a href=\"#process\">Processus<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n <!-- Hidden on mobile -->\r\n <div class=\"footer-col footer-hide-mobile\">\r\n <h5>Solutions<\/h5>\r\n <ul>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/contact\/\">Espaces de vie<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/contact\/\">Autonomie \u00e9nerg\u00e9tique<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/contact\/\">Solutions agricoles<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/contact\/\">Centre de formation<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n <div class=\"footer-col\">\r\n <h5>Contact<\/h5>\r\n <ul>\r\n <li><a href=\"\/cdn-cgi\/l\/email-protection#89eae6e7fde8eafdc9e1e8fbe4e6edfce5a7eae6e4\">contact@harmodul.com<\/a><\/li>\r\n <li><a href=\"tel:+22600000000\">+226 00 00 00 00<\/a><\/li>\r\n <li><a href=\"tel:+33652565173\">+33 6 52 56 51 73<\/a><\/li>\r\n <li><a href=\"https:\/\/harmodul.com\/index.php\/contact\/\">Demander un devis<\/a><\/li>\r\n <\/ul>\r\n <\/div>\r\n <\/div>\r\n <div class=\"footer-bottom\">\r\n <p>\u00a9 2026 Harmodul. Tous droits r\u00e9serv\u00e9s.<\/p>\r\n <p style=\"color:rgba(255,255,255,0.35);font-size:12px\">Site r\u00e9alis\u00e9 par <a href=\"https:\/\/webleague.fr\" target=\"_blank\" rel=\"noopener\" style=\"color:rgba(255,255,255,0.5);text-decoration:none;transition:color 0.2s;\" onmouseover=\"this.style.color='#96bfad'\" onmouseout=\"this.style.color='rgba(255,255,255,0.5)'\">Webleague.fr<\/a><\/p>\r\n <p style=\"font-size:12px;display:flex;gap:16px;align-items:center\">\r\n <a href=\"https:\/\/harmodul.com\/index.php\/mentions-legales-rgpd\/\" target=\"_blank\" rel=\"noopener\" style=\"color:rgba(255,255,255,0.35);text-decoration:none;transition:color 0.2s;\" onmouseover=\"this.style.color='#96bfad'\" onmouseout=\"this.style.color='rgba(255,255,255,0.35)'\">Mentions l\u00e9gales<\/a>\r\n <span style=\"color:rgba(255,255,255,0.15)\">\u00b7<\/span>\r\n <a href=\"https:\/\/harmodul.com\/index.php\/privacy-policy\/\" target=\"_blank\" rel=\"noopener\" style=\"color:rgba(255,255,255,0.35);text-decoration:none;transition:color 0.2s;\" onmouseover=\"this.style.color='#96bfad'\" onmouseout=\"this.style.color='rgba(255,255,255,0.35)'\">Politique de confidentialit\u00e9<\/a>\r\n <\/p>\r\n <\/div>\r\n <\/div>\r\n<\/footer>\r\n\r\n<script>\r\n \/\/ \u2500\u2500 NAV SCROLL \u2500\u2500\r\n const navbar = document.getElementById('navbar');\r\n window.addEventListener('scroll', () => {\r\n navbar.classList.toggle('scrolled', window.scrollY > 60);\r\n });\r\n\r\n \/\/ \u2500\u2500 HERO BG LOAD \u2500\u2500\r\n const heroBg = document.getElementById('heroBg');\r\n setTimeout(() => heroBg.classList.add('loaded'), 100);\r\n\r\n \/\/ \u2500\u2500 SCROLL ANIMATIONS \u2500\u2500\r\n const allReveal = document.querySelectorAll('.reveal, .reveal-left, .reveal-right');\r\n allReveal.forEach(el => {\r\n const rect = el.getBoundingClientRect();\r\n if (rect.top > window.innerHeight * 0.95) {\r\n el.classList.add('anim');\r\n }\r\n });\r\n\r\n const observer = new IntersectionObserver((entries) => {\r\n entries.forEach(entry => {\r\n if (entry.isIntersecting) {\r\n entry.target.classList.add('visible');\r\n }\r\n });\r\n }, { threshold: 0.1 });\r\n\r\n allReveal.forEach(el => {\r\n if (el.classList.contains('anim')) observer.observe(el);\r\n });\r\n\r\n \/\/ \u2500\u2500 HAMBURGER \/ MOBILE MENU \u2500\u2500\r\n const hamburger = document.getElementById('hamburger');\r\n const mobileMenu = document.getElementById('mobileMenu');\r\n\r\n function closeMobileMenu() {\r\n hamburger.classList.remove('open');\r\n mobileMenu.classList.remove('active');\r\n document.body.style.overflow = '';\r\n }\r\n window.closeMobileMenu = closeMobileMenu;\r\n\r\n hamburger.addEventListener('click', () => {\r\n const isOpen = hamburger.classList.toggle('open');\r\n mobileMenu.classList.toggle('active', isOpen);\r\n document.body.style.overflow = isOpen ? 'hidden' : '';\r\n });\r\n\r\n mobileMenu.addEventListener('click', (e) => {\r\n if (e.target === mobileMenu) closeMobileMenu();\r\n });\r\n\r\n \/\/ \u2500\u2500 CAROUSEL FACTORY \u2500\u2500\r\n function initCarousel(trackId, dotsId, count) {\r\n const track = document.getElementById(trackId);\r\n const dotsContainer = document.getElementById(dotsId);\r\n if (!track || !dotsContainer) return;\r\n\r\n let current = 0;\r\n let startX = 0;\r\n let isDragging = false;\r\n\r\n \/\/ Build dots\r\n for (let i = 0; i < count; i++) {\r\n const dot = document.createElement('button');\r\n dot.className = 'carousel-dot' + (i === 0 ? ' active' : '');\r\n dot.setAttribute('aria-label', `Slide ${i + 1}`);\r\n dot.addEventListener('click', () => goTo(i));\r\n dotsContainer.appendChild(dot);\r\n }\r\n\r\n function getSlideWidth() {\r\n return track.parentElement.offsetWidth;\r\n }\r\n\r\n function goTo(index) {\r\n current = Math.max(0, Math.min(index, count - 1));\r\n track.style.transform = `translateX(-${current * getSlideWidth()}px)`;\r\n dotsContainer.querySelectorAll('.carousel-dot').forEach((d, i) => {\r\n d.classList.toggle('active', i === current);\r\n });\r\n }\r\n\r\n \/\/ Touch\/swipe\r\n track.addEventListener('touchstart', (e) => {\r\n startX = e.touches[0].clientX;\r\n isDragging = true;\r\n }, { passive: true });\r\n\r\n track.addEventListener('touchend', (e) => {\r\n if (!isDragging) return;\r\n const diff = startX - e.changedTouches[0].clientX;\r\n if (Math.abs(diff) > 40) {\r\n goTo(diff > 0 ? current + 1 : current - 1);\r\n }\r\n isDragging = false;\r\n }, { passive: true });\r\n\r\n window.addEventListener('resize', () => goTo(current));\r\n }\r\n\r\n initCarousel('conceptTrack', 'conceptDots', 4);\r\n initCarousel('processTrack', 'processDots', 4);\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>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Harmodul \u2014 Construction Modulaire Premium Accueil Concept Nos modules Pr\u00e9sentation Devis Accueil Concept Nos modules Pr\u00e9sentation Demander un devis \u2192 Construction modulaire Construire autrementavec Harmodul Des solutions modulaires innovantes, durables et accessibles pour l’habitat, les commerces et les infrastructures. Demander un devis D\u00e9couvrir nos solutions Scroll Notre approche La construction modulaire,une nouvelle fa\u00e7on de b\u00e2tir […]<\/p>\n","protected":false},"author":1,"featured_media":30,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-13","page","type-page","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Accueil - Harmodul<\/title>\n<meta name=\"description\" content=\"Harmodul con\u00e7oit des constructions modulaires \u00e0 partir de conteneurs : habitat, bureaux, agriculture et solutions durables.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/harmodul.com\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Accueil - Harmodul\" \/>\n<meta property=\"og:description\" content=\"Harmodul con\u00e7oit des constructions modulaires \u00e0 partir de conteneurs : habitat, bureaux, agriculture et solutions durables.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/harmodul.com\/\" \/>\n<meta property=\"og:site_name\" content=\"Harmodul\" \/>\n<meta property=\"article:modified_time\" content=\"2026-04-14T10:33:49+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"500\" \/>\n\t<meta property=\"og:image:height\" content=\"500\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\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=\"26 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/harmodul.com\/\",\"url\":\"https:\/\/harmodul.com\/\",\"name\":\"Accueil - Harmodul\",\"isPartOf\":{\"@id\":\"https:\/\/harmodul.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/harmodul.com\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/harmodul.com\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png\",\"datePublished\":\"2026-03-18T15:35:32+00:00\",\"dateModified\":\"2026-04-14T10:33:49+00:00\",\"description\":\"Harmodul con\u00e7oit des constructions modulaires \u00e0 partir de conteneurs : habitat, bureaux, agriculture et solutions durables.\",\"breadcrumb\":{\"@id\":\"https:\/\/harmodul.com\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/harmodul.com\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/harmodul.com\/#primaryimage\",\"url\":\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png\",\"contentUrl\":\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png\",\"width\":500,\"height\":500,\"caption\":\"construction modulaire conteneur harmodul habitat moderne\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/harmodul.com\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Accueil\",\"item\":\"https:\/\/harmodul.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Accueil\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/harmodul.com\/#website\",\"url\":\"https:\/\/harmodul.com\/\",\"name\":\"Harmodul\",\"description\":\"Des espaces qui ont du sens\",\"publisher\":{\"@id\":\"https:\/\/harmodul.com\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/harmodul.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/harmodul.com\/#organization\",\"name\":\"Harmodul\",\"url\":\"https:\/\/harmodul.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/harmodul.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png\",\"contentUrl\":\"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png\",\"width\":500,\"height\":500,\"caption\":\"Harmodul\"},\"image\":{\"@id\":\"https:\/\/harmodul.com\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Accueil - Harmodul","description":"Harmodul con\u00e7oit des constructions modulaires \u00e0 partir de conteneurs : habitat, bureaux, agriculture et solutions durables.","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:\/\/harmodul.com\/","og_locale":"fr_FR","og_type":"article","og_title":"Accueil - Harmodul","og_description":"Harmodul con\u00e7oit des constructions modulaires \u00e0 partir de conteneurs : habitat, bureaux, agriculture et solutions durables.","og_url":"https:\/\/harmodul.com\/","og_site_name":"Harmodul","article_modified_time":"2026-04-14T10:33:49+00:00","og_image":[{"width":500,"height":500,"url":"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Dur\u00e9e de lecture estim\u00e9e":"26 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/harmodul.com\/","url":"https:\/\/harmodul.com\/","name":"Accueil - Harmodul","isPartOf":{"@id":"https:\/\/harmodul.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/harmodul.com\/#primaryimage"},"image":{"@id":"https:\/\/harmodul.com\/#primaryimage"},"thumbnailUrl":"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png","datePublished":"2026-03-18T15:35:32+00:00","dateModified":"2026-04-14T10:33:49+00:00","description":"Harmodul con\u00e7oit des constructions modulaires \u00e0 partir de conteneurs : habitat, bureaux, agriculture et solutions durables.","breadcrumb":{"@id":"https:\/\/harmodul.com\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/harmodul.com\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/harmodul.com\/#primaryimage","url":"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png","contentUrl":"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png","width":500,"height":500,"caption":"construction modulaire conteneur harmodul habitat moderne"},{"@type":"BreadcrumbList","@id":"https:\/\/harmodul.com\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Accueil","item":"https:\/\/harmodul.com\/"},{"@type":"ListItem","position":2,"name":"Accueil"}]},{"@type":"WebSite","@id":"https:\/\/harmodul.com\/#website","url":"https:\/\/harmodul.com\/","name":"Harmodul","description":"Des espaces qui ont du sens","publisher":{"@id":"https:\/\/harmodul.com\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/harmodul.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Organization","@id":"https:\/\/harmodul.com\/#organization","name":"Harmodul","url":"https:\/\/harmodul.com\/","logo":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/harmodul.com\/#\/schema\/logo\/image\/","url":"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png","contentUrl":"https:\/\/harmodul.com\/wp-content\/uploads\/2026\/03\/Design-sans-titre-1.png","width":500,"height":500,"caption":"Harmodul"},"image":{"@id":"https:\/\/harmodul.com\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/pages\/13","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/comments?post=13"}],"version-history":[{"count":76,"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/pages\/13\/revisions"}],"predecessor-version":[{"id":261,"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/pages\/13\/revisions\/261"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/media\/30"}],"wp:attachment":[{"href":"https:\/\/harmodul.com\/index.php\/wp-json\/wp\/v2\/media?parent=13"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}