/* =====================================================================
   ECO SMART FRANCE — v2 "Énergie vivante"
   Crème chaud · vert profond · lime · typo display condensée
   ===================================================================== */
:root{
  --cream:#F3F0E8; --cream-2:#EAE6DA; --cream-3:#E1DCCB;
  --dark:#0A1F17; --dark-2:#0F2A20; --dark-3:#16382B;
  --green:#1F7A4D; --green-2:#2A9A5F; --lime:#D4FF3D; --lime-2:#B9E82E; --sun:#FFB347; --sun-2:#FF8A3D;
  --ink:#0E1A14; --ink-2:#3A4A42; --muted:#6F7C75; --line:rgba(14,26,20,.12); --line-d:rgba(255,255,255,.12);
  --r-xl:40px; --r:24px; --r-sm:14px;
  --ease:cubic-bezier(.22,1,.36,1); --ease-2:cubic-bezier(.77,0,.18,1); --ease-3:cubic-bezier(.65,0,.35,1);
  --display:"Bricolage Grotesque","Inter",system-ui,sans-serif; --body:"Inter",system-ui,-apple-system,sans-serif;
  --container:1360px; --gutter:clamp(18px,4vw,56px); --header-h:84px;
  --shadow:0 30px 80px -30px rgba(10,31,23,.35); --shadow-sm:0 14px 40px -18px rgba(10,31,23,.3);
}
*,*::before,*::after{box-sizing:border-box}
/* v8.2 (28/09/2026) — fond de DOCUMENT sombre, fond de PAGE crème porté par .page-wrap.
   WebKit calcule la « couleur de document » (html ⊕ body) et l'utilise sur iOS 26 pour :
   - la zone de rebond (overscroll) en haut/en bas et le canevas sous la barre du bas après le footer,
   - le mélange des couleurs semi-transparentes relevées sur le header (voir bloc HEADER).
   Avec body crème, cette couleur était crème (bande claire sous le footer sombre). body est donc
   transparent, html sombre, et c'est .page-wrap (qui enveloppe tout le contenu) qui peint le crème. */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--dark)}
body{margin:0;font-family:var(--body);color:var(--ink);background:var(--cream);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
/* v8.8 (28/09) — La couleur de document (html ⊕ body) est aussi celle que Safari affiche à la place des zones
   pas encore dessinées pendant un défilement rapide. Sombre = gros aplat vert sombre (vidéo du client).
   Donc crème par défaut ; sombre seulement quand le footer (sombre) est à l'écran, pour le rebond et la
   zone sous la barre Safari en bas de page. La bascule est faite par main.js (classe html.edge-dark). */
html.edge-dark body{background:var(--dark)}
/* v7.6 (25/09/2026) — le blocage du défilement horizontal est porté par ce wrapper dédié et non par
   html/body (overflow-x sur la racine est mal géré par iOS Safari et peut perturber le scroll natif).
   Valeur finale : overflow-x:clip (voir plus bas) — ne crée pas de conteneur de scroll. */
.page-wrap{overflow-x:hidden;width:100%;background:var(--cream)}
body.menu-open,body.loading{overflow:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
h1,h2,h3,h4{margin:0 0 .5em;color:var(--ink);font-family:var(--display);font-weight:800;line-height:.98;letter-spacing:-.025em}
h1,h2{font-variation-settings:"wdth" 80,"opsz" 96;text-transform:uppercase;letter-spacing:-.02em}
h1{font-size:clamp(3.2rem,8.2vw,7.6rem);line-height:.9}
h2{font-size:clamp(2.4rem,5.2vw,4.8rem);line-height:.92}
h3{font-size:clamp(1.3rem,2vw,1.7rem);font-weight:700}
h4{font-size:1.1rem}
p{margin:0 0 1em}
.lead{font-size:clamp(1.05rem,1.35vw,1.28rem);color:var(--ink-2);line-height:1.55}
strong{font-weight:600}
ul,ol{padding-left:1.2em}
.container{width:min(var(--container),100% - 2*var(--gutter));margin-inline:auto}
section{position:relative}
.section{padding-block:clamp(80px,10vw,140px)}
.section-sm{padding-block:clamp(56px,6vw,88px)}
.bg-2{background:var(--cream-2)}
.bg-dark{background:var(--dark);color:#fff}
.bg-dark h1,.bg-dark h2,.bg-dark h3,.bg-dark h4{color:#fff}
.bg-dark .lead,.bg-dark p{color:rgba(255,255,255,.75)}
/* overlapping rounded sections */
.bg-dark.section,.bg-dark.section-sm{border-radius:var(--r-xl) var(--r-xl) 0 0;margin-top:calc(-1*var(--r-xl));padding-top:calc(clamp(80px,10vw,140px) + var(--r-xl))}
.bg-dark.section + .section:not(.bg-dark),.bg-dark.section + .section-sm:not(.bg-dark){border-radius:var(--r-xl) var(--r-xl) 0 0;margin-top:calc(-1*var(--r-xl));padding-top:calc(clamp(80px,10vw,140px) + var(--r-xl));background:var(--cream);position:relative;z-index:1}
.text-center{text-align:center}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--green);margin-bottom:22px}
.eyebrow::before{content:"";width:34px;height:2px;background:currentColor;border-radius:2px}
.bg-dark .eyebrow{color:var(--lime)}
.section-head{max-width:820px;margin-bottom:clamp(40px,5vw,72px)}
.section-head.center{margin-inline:auto;text-align:center}
.section-head.center .eyebrow{justify-content:center}
.section-head.split{max-width:none;display:grid;grid-template-columns:1.3fr .7fr;gap:56px;align-items:end}
.section-head.split .lead{margin:0 0 12px}
@media (max-width:900px){.section-head.split{grid-template-columns:1fr;gap:16px}}
.hl{color:var(--green-2)}.bg-dark .hl{color:var(--lime)}.hl-sun{color:var(--sun)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* grain */
/* grain : calque fixe plein écran — PC uniquement (voir v8.5 plus bas : il casse la couleur de bord Safari iOS). */
body::after{content:"";position:fixed;inset:-50%;width:200%;height:200%;pointer-events:none;z-index:9000;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(4) infinite;mix-blend-mode:multiply}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-1%,-1%)}100%{transform:translate(3%,1%)}}
@media (prefers-reduced-motion:reduce){body::after{animation:none}}
/* v8.5 (28/09) — CAUSE DE LA BANDE SAFARI iOS, prouvée par bissection sur l'iPhone du client (T2 = T0 + grain →
   bande ; T0, T9 → pas de bande) : Safari iOS 26 prend ce calque fixe plein écran pour « l'élément fixe du bord
   haut », n'y trouve pas de couleur et ne peint donc pas la zone sous sa barre d'adresse. Grain désactivé sur
   tactile et sur les largeurs mobiles/tablettes. Ne pas le réactiver sur mobile. */
@media (hover:none),(max-width:1180px){body::after{display:none}}

/* ---------- Buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:18px 30px;border-radius:999px;font-family:var(--display);font-weight:700;font-size:1rem;line-height:1;letter-spacing:-.01em;transition:transform .5s var(--ease),color .35s,background .35s,border-color .35s;overflow:hidden;white-space:nowrap;isolation:isolate}
.btn svg{width:18px;height:18px;flex:none;transition:transform .45s var(--ease)}
.btn:hover svg{transform:translateX(5px)}
.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;transform:translateY(102%);transition:transform .55s var(--ease)}
.btn:hover::after{transform:translateY(0)}
.btn-primary{background:var(--lime);color:var(--dark)}
.btn-primary::after{background:var(--dark)}
.btn-primary:hover{color:var(--lime)}
.bg-dark .btn-primary::after{background:#fff}.bg-dark .btn-primary:hover{color:var(--dark)}
.btn-dark{background:var(--dark);color:#fff}.btn-dark::after{background:var(--lime)}.btn-dark:hover{color:var(--dark)}
.btn-outline{border:1.5px solid rgba(255,255,255,.4);color:#fff;background:rgba(255,255,255,.04);backdrop-filter:blur(8px)}
.btn-outline::after{background:#fff}.btn-outline:hover{color:var(--dark);border-color:#fff}
.btn-outline-dark{border:1.5px solid var(--dark);color:var(--dark)}
.btn-outline-dark::after{background:var(--dark)}.btn-outline-dark:hover{color:#fff}
.btn-sm{padding:13px 20px;font-size:.9rem}.btn-lg{padding:22px 38px;font-size:1.08rem}
.btn-link{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;color:var(--green);position:relative;font-size:1rem}
.btn-link::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:2px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.btn-link:hover::after{transform:scaleX(1);transform-origin:left}
.btn-link svg{width:16px;height:16px;transition:transform .45s var(--ease)}.btn-link:hover svg{transform:translateX(5px)}
.bg-dark .btn-link{color:var(--lime)}
.btn-group{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.micro{display:flex;align-items:center;gap:6px;font-size:.82rem;color:var(--muted);margin-top:14px}
.micro svg{width:14px;height:14px;color:var(--green-2);flex:none}
.bg-dark .micro,.hero .micro{color:rgba(255,255,255,.6)}

/* ---------- Preloader ---------- */
/* inset haut de 8 px (invisible : zone sous la barre Safari / même sombre que la page) — voir bloc HEADER, point 2 */
.preloader{position:fixed;inset:8px 0 0 0;z-index:9999;background:var(--dark);color:#fff;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,4vw,48px);transition:clip-path 1.1s var(--ease-2)}
.preloader.done{clip-path:inset(0 0 100% 0);pointer-events:none}
/* iOS 26 : bottom:0 s'arrête au-dessus de la barre flottante du bas → on prolonge le fond sombre dessous */
.preloader::after{content:"";position:absolute;left:0;right:0;top:100%;height:240px;background:var(--dark);pointer-events:none}
.preloader__top{display:flex;justify-content:space-between;font-family:var(--display);font-weight:700;font-size:.8rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.preloader__big{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 78;text-transform:uppercase;font-size:clamp(4rem,16vw,15rem);line-height:.85;letter-spacing:-.03em;color:#fff}
.preloader__big span{color:var(--lime)}
.preloader__bottom{display:flex;justify-content:space-between;align-items:flex-end}
.preloader__num{font-family:var(--display);font-weight:800;font-size:clamp(3rem,8vw,7rem);line-height:1;letter-spacing:-.04em;color:var(--lime)}
.preloader__bar{position:absolute;left:0;bottom:0;height:4px;width:0;background:var(--lime);transition:width .2s linear}

/* ---------- Cursor ---------- */
.cursor{position:fixed;top:0;left:0;width:12px;height:12px;border-radius:50%;background:var(--lime);mix-blend-mode:difference;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);transition:width .35s var(--ease),height .35s var(--ease),opacity .3s;opacity:0}
.cursor.is-active{width:64px;height:64px}.cursor.is-visible{opacity:1}
@media (hover:none),(max-width:900px){.cursor{display:none}}

/* ---------- Header ---------- */
.topbar{background:var(--dark);color:rgba(255,255,255,.75);font-size:.8rem;position:relative;z-index:901}
.topbar .container{display:flex;justify-content:space-between;align-items:center;height:38px;gap:16px}
.topbar a{display:inline-flex;align-items:center;gap:6px}.topbar a:hover{color:var(--lime)}
.topbar__left,.topbar__right{display:flex;gap:24px;align-items:center}
.topbar svg{width:14px;height:14px}
@media (max-width:1100px){.topbar{display:none}}
/* ======================================================================
   HEADER — v8.3 (28/09/2026) : version stabilisée pour Safari iOS 26
   ----------------------------------------------------------------------
   1. position:fixed (et non sticky) : le header ne prend pas de place dans le flux ;
      .hero / .phero / .devis / .notfound / .rea-hero compensent avec un padding-top
      de var(--header-h).

   2. LA RÈGLE QUI COMPTE (source WebKit : LocalFrameView::fixedContainerEdges,
      Page::updateFixedContainerEdges, WKWebView _updateFixedColorExtensionViews).
      Sur iOS 26, Safari peint la zone barre d'état + barre d'adresse (et donc la bande
      entre la pilule réduite et le haut de la page) avec la couleur de fond CSS de
      l'élément position:fixed/sticky qui se trouve sous le point situé 4 px sous le
      bord haut, au milieu de l'écran = le header. Il lit `background-color` sur
      l'élément fixe LUI-MÊME (pas ses enfants, pas ses pseudo-éléments). Fond
      transparent ou `backdrop-filter` → aucune couleur → la page défile derrière la
      barre = « l'espace vide » du client. Alpha < 0,75 → mélange incertain (v17 : la
      couleur à 2 % est restée invisible sur l'iPhone) → il faut une couleur OPAQUE.
      Et surtout : sur l'iPhone du client, cette couleur est FIGÉE AU CHARGEMENT
      (après le premier geste utilisateur Safari ne relit plus le header — réglage
      WebKit TopContentInsetBackgroundCanChangeAfterScrolling). Elle doit donc être
      la bonne dès le chargement, avant tout scroll.

      D'où la construction v8.3 :
        - .header porte TOUJOURS `background-color:var(--cream)` opaque, mais avec
          `background-clip:text` : la couleur existe dans le style (Safari la lit →
          bande crème), mais elle n'est peinte que dans les glyphes de texte, sous le
          texte lui-même → invisible. Le header reste visuellement transparent sur la
          photo, comme validé par le client.
        - le fond crème VISIBLE (après scroll, et en permanence sur les pages claires)
          est porté par le pseudo-élément ::before (z-index:-1, fondu d'opacité), que
          Safari ignore ; il déborde de 240 px vers le haut (zone d'overscroll).
        - menu ouvert : background-color sombre (toujours clip:text, invisible) pour
          que Safari, s'il relit, peigne la bande de la couleur du menu.
        - un calque fixe d'opacité < 0,1 avec pointer-events:none est ignoré par
          Safari (grain body::after — garder opacity < .1).
        - le préchargeur commence 8 px sous le bord haut pour que le point de test
          de Safari tombe sur le header (crème) et non sur lui (sombre).
      NE JAMAIS : `background:transparent` / un raccourci `background:` (il remettrait
      background-clip à border-box → barre crème visible) / `backdrop-filter` sur .header.
      main.js bascule un élément fixe invisible (« edge kick ») à chaque changement pour
      forcer le recalcul là où Safari le permet.

   3. Pas de transform / will-change sur le header. La compensation JS (main.js,
      « visualViewport ») ne pose un translateY que si iOS signale un décalage stable
      (bug WebKit 297779, iOS 26.0/26.1).
   ====================================================================== */
/* v8.6 (28/09) — plus de background-clip:text (WebKit iOS re-rasterise mal un calque fixe plein d'images avec un
   masque texte : header blanc / contenu qui ne s'affiche plus après un retour en haut de page). Même principe,
   autre moyen : la couleur existe dans le style (Safari la lit), mais background-clip:content-box + padding-top
   égal à la hauteur = zone de peinture de hauteur nulle → invisible. Le contenu (.container) est en absolu. */
.header{position:fixed;top:0;left:0;right:0;width:100%;z-index:900;height:var(--header-h);padding:var(--header-h) 0 0;background-color:var(--cream);-webkit-background-clip:content-box;background-clip:content-box;transition:box-shadow .45s,color .3s;color:var(--ink)}
.header::before{content:"";position:absolute;left:0;right:0;top:-240px;bottom:0;z-index:-1;background:var(--cream);opacity:0;transition:opacity .45s;pointer-events:none}
.header.on-dark{color:#fff}
.header:not(.on-dark)::before,.header.is-scrolled::before{opacity:1}
.header.is-scrolled{box-shadow:0 1px 0 var(--line);color:var(--ink)}
.header .container{display:flex;align-items:center;justify-content:space-between;height:100%;gap:20px}
.logo{display:flex;align-items:center;gap:12px;font-family:var(--display);font-weight:800;letter-spacing:-.02em;font-size:1rem;line-height:1;flex:none}
.logo img{width:52px;height:52px;border-radius:14px;background:#fff;padding:3px}
.logo span{display:flex;flex-direction:column}
.logo small{font-weight:600;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;opacity:.7;margin-top:4px}
.nav{display:flex;align-items:center;gap:2px;height:100%;margin:0;padding:0;list-style:none}
.nav>li{height:100%;display:flex;align-items:center}
.nav__link{display:inline-flex;align-items:center;gap:6px;padding:10px 11px;border-radius:999px;font-weight:600;font-size:.9rem;white-space:nowrap;transition:background .3s;cursor:pointer}
.nav__link svg{width:12px;height:12px;transition:transform .3s}
.nav>li:hover .nav__link,.nav>li.is-open .nav__link{background:rgba(14,26,20,.07)}
.header.on-dark:not(.is-scrolled) .nav>li:hover .nav__link{background:rgba(255,255,255,.12)}
.nav>li:hover .nav__link svg,.nav>li.is-open .nav__link svg{transform:rotate(180deg)}
.header__cta{display:flex;align-items:center;gap:8px;flex:none}
.header__phone{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-family:var(--display);padding:10px 12px;border-radius:999px;white-space:nowrap}
.header__phone svg{width:16px;height:16px}
.burger{display:none;width:50px;height:50px;border-radius:50%;background:var(--dark);place-items:center;flex:none}
.header.on-dark:not(.is-scrolled) .burger{background:var(--lime)}
.burger i{display:block;width:20px;height:2px;background:#fff;position:relative;transition:transform .3s}
.header.on-dark:not(.is-scrolled) .burger i,.header.on-dark:not(.is-scrolled) .burger i::before,.header.on-dark:not(.is-scrolled) .burger i::after{background:var(--dark)}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:100%;height:2px;background:#fff;transition:transform .3s,top .3s}
.burger i::before{top:-6px}.burger i::after{top:6px}
body.menu-open .burger{background:var(--lime)!important}
body.menu-open .burger i{background:transparent!important}
body.menu-open .burger i::before{top:0;transform:rotate(45deg);background:var(--dark)!important}
body.menu-open .burger i::after{top:0;transform:rotate(-45deg);background:var(--dark)!important}
@media (max-width:1520px){.header__phone{display:none}}
@media (max-width:1180px){.nav{display:none}.burger{display:grid}}
@media (max-width:560px){.header__cta .btn{display:none}.header .logo span{display:none}}

/* Mini CTA header (mobile) — remplace la barre fixe en bas d'écran. Boutons ronds (même
   langage que le burger), taille d'origine conservée pour ne pas déformer les icônes. */
.header__mcta{display:none;align-items:center;gap:8px;flex:none}
.mcta__btn{display:flex;align-items:center;justify-content:center;flex:none;width:42px;height:42px;border-radius:50%;background:rgba(15,42,32,.08);color:var(--dark);transition:background .3s,color .3s}
.mcta__btn svg{display:block;width:17px;height:17px;flex:none}
.mcta__btn--primary{background:var(--green);color:var(--cream)}
.header.on-dark:not(.is-scrolled) .mcta__btn{background:rgba(255,255,255,.16);color:#fff}
.header.on-dark:not(.is-scrolled) .mcta__btn--primary{background:var(--lime);color:var(--dark)}
body.menu-open .header__mcta{opacity:0;pointer-events:none}
@media (max-width:1180px){
  .header .container{justify-content:space-between}
  .header__mcta{display:flex;position:absolute;left:var(--gutter);top:50%;transform:translateY(-50%);z-index:2}
}

/* Mega menu */
.mega{position:absolute;left:0;right:0;top:100%;background:var(--cream);color:var(--ink);border-top:1px solid var(--line);box-shadow:0 50px 90px -30px rgba(10,31,23,.4);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .35s var(--ease),transform .45s var(--ease),visibility .35s;pointer-events:none;border-radius:0 0 var(--r) var(--r);overflow:hidden}
.nav>li:hover .mega,.nav>li.is-open .mega{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}
.mega__inner{display:grid;grid-template-columns:280px 1fr 320px;gap:44px;padding:40px 0 44px}
.mega__intro h4{font-family:var(--display);font-size:1.9rem;font-weight:800;line-height:1;letter-spacing:-.03em;margin-bottom:12px}
.mega__intro p{color:var(--ink-2);font-size:.95rem}
.mega__list{display:grid;grid-template-columns:repeat(2,1fr);gap:6px 20px;margin:0;padding:0;list-style:none;align-content:start}
.mega__list.one{grid-template-columns:1fr}
.mega__item{display:flex;gap:14px;padding:14px;border-radius:16px;transition:background .3s,transform .4s var(--ease)}
.mega__item:hover{background:#fff;transform:translateX(5px)}
.mega__icon{width:46px;height:46px;border-radius:14px;background:var(--dark);display:grid;place-items:center;flex:none;color:var(--lime)}
.mega__icon svg{width:22px;height:22px}
.mega__item b{display:block;font-family:var(--display);font-weight:700;font-size:1.02rem;margin-bottom:2px}
.mega__item span{font-size:.85rem;color:var(--muted);line-height:1.4;display:block}
.mega__card{border-radius:var(--r);overflow:hidden;position:relative;min-height:280px;background:var(--dark);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:26px}
.mega__card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.6;transition:transform 1.2s var(--ease)}
.mega__card:hover img{transform:scale(1.06)}
.mega__card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 20%,rgba(10,31,23,.96))}
.mega__card>*{position:relative}
.mega__card b{font-family:var(--display);font-size:1.4rem;line-height:1.05;display:block;margin-bottom:8px}
.mega__card p{font-size:.88rem;color:rgba(255,255,255,.8);margin-bottom:14px}

/* Mobile menu */
/* Menu mobile plein écran. bottom:-240px + padding-bottom équivalent : sur iOS 26, bottom:0 s'arrête
   au-dessus de la barre flottante du bas ; on prolonge le fond sombre dessous (plage de scroll inchangée). */
/* v8.4 : le défilement se fait dans .mnav__scroll (enfant), pas dans .mnav : la croix, le logo (header) et le
   bandeau sombre du haut restent parfaitement immobiles quand on fait défiler le menu. */
.mnav{position:fixed;top:0;left:0;right:0;bottom:-240px;z-index:850;background:var(--dark);color:#fff;padding:0;overflow:hidden;transform:translateY(-100%);transition:transform .8s var(--ease-2);visibility:hidden}
.mnav__scroll{position:absolute;top:0;left:0;right:0;bottom:0;overflow:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:calc(var(--header-h) + 30px) var(--gutter) calc(120px + 240px);z-index:1}
body.menu-open .mnav{transform:translateY(0);visibility:visible}
.mnav__group{border-bottom:1px solid var(--line-d)}
.mnav__toggle{width:100%;display:flex;justify-content:space-between;align-items:center;padding:20px 0;font-family:var(--display);font-weight:800;font-size:2rem;text-transform:uppercase;font-variation-settings:"wdth" 80;letter-spacing:-.02em;text-align:left;line-height:1}
.mnav__toggle svg{width:22px;height:22px;transition:transform .3s;color:var(--lime)}
.mnav__group.is-open .mnav__toggle svg{transform:rotate(45deg)}
.mnav__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.mnav__group.is-open .mnav__panel{grid-template-rows:1fr}
.mnav__panel>div{overflow:hidden}
.mnav__panel a{display:block;padding:12px 0 12px 18px;color:rgba(255,255,255,.8);font-size:1.05rem;border-left:2px solid rgba(212,255,61,.35)}
.mnav__panel a:last-child{margin-bottom:16px}
.mnav__panel a:hover{color:var(--lime)}
.mnav__ctas{margin-top:30px;display:flex;flex-direction:column;gap:12px}
.mnav__ctas .btn{width:100%}
.mnav__meta{margin-top:28px;font-size:.9rem;color:rgba(255,255,255,.55);line-height:2}

/* ---------- HERO ---------- */
.hero{position:relative;min-height:100svh;padding-top:calc(var(--header-h) + clamp(40px,6vw,90px));padding-bottom:clamp(60px,7vw,110px);display:flex;align-items:flex-end;background:var(--dark);color:#fff;overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__bg img{width:100%;height:112%;object-fit:cover;object-position:center 55%;opacity:.95;transform:scale(1.02)}
.hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,31,23,.5) 0%,rgba(10,31,23,0) 30%,rgba(10,31,23,.35) 65%,rgba(10,31,23,.96) 100%),linear-gradient(90deg,rgba(10,31,23,.8) 0%,rgba(10,31,23,.35) 45%,transparent 70%)}
.hero__sun{position:absolute;z-index:1;width:min(60vw,760px);aspect-ratio:1;border-radius:50%;right:-10%;top:-20%;background:radial-gradient(circle,rgba(255,179,71,.55),rgba(255,138,61,.18) 40%,transparent 68%);filter:blur(30px);pointer-events:none;animation:sun 9s ease-in-out infinite alternate}
@keyframes sun{from{transform:translate(0,0) scale(1)}to{transform:translate(-6%,8%) scale(1.08)}}
.hero__canvas{position:absolute;inset:0;z-index:1;pointer-events:none;mix-blend-mode:screen;opacity:.75}
.hero .container{position:relative;z-index:2;display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:end}
@media (max-width:1000px){.hero .container{grid-template-columns:1fr}}
.hero__kicker{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);font-size:.82rem;font-weight:600;margin-bottom:30px;backdrop-filter:blur(8px)}
.hero__kicker i{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--lime);color:var(--dark)}
.hero__kicker svg{width:14px;height:14px}
.hero h1{color:#fff;margin-bottom:28px;font-size:clamp(3.4rem,9.4vw,9.2rem)}
.hero h1 .line{display:block;overflow:hidden;padding-bottom:.04em;margin-bottom:-.04em}
.hero h1 .line>span{display:block}
.hero .lead{max-width:600px;color:rgba(255,255,255,.82);margin-bottom:36px;font-size:clamp(1.05rem,1.4vw,1.3rem)}
.hero__trust{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:44px;padding-top:26px;border-top:1px solid rgba(255,255,255,.16)}
.hero__trust div{display:flex;align-items:center;gap:10px;font-size:.86rem;color:rgba(255,255,255,.85);font-weight:500}
.hero__trust svg{width:20px;height:20px;color:var(--lime);flex:none}
.hero__panel{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);border-radius:28px;padding:28px;position:relative}
.hero__panel h3{color:#fff;font-size:1.5rem;margin-bottom:6px;font-family:var(--display);font-weight:800;letter-spacing:-.02em}
.hero__panel p{font-size:.9rem;color:rgba(255,255,255,.65);margin-bottom:18px}
.hero__panel .choices{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.choice{display:flex;flex-direction:column;gap:14px;padding:18px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:#fff;font-weight:600;font-size:.92rem;line-height:1.25;transition:background .3s,transform .45s var(--ease),border-color .3s;text-align:left}
.choice svg{width:30px;height:30px;color:var(--lime)}
.choice:hover{background:rgba(212,255,61,.16);border-color:rgba(212,255,61,.7);transform:translateY(-4px)}
.hero__scroll{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:8px;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.hero__scroll i{width:1px;height:48px;background:linear-gradient(var(--lime),transparent);animation:scrollHint 1.9s var(--ease) infinite}
@keyframes scrollHint{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media (max-width:1000px){.hero__scroll{display:none}.hero{align-items:flex-start}}

/* ---------- Marquee ---------- */
.marquee{overflow:hidden;background:var(--lime);color:var(--dark);padding:18px 0;font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 80;font-size:clamp(1.1rem,2vw,1.7rem);text-transform:uppercase;white-space:nowrap;position:relative;z-index:2;transform:rotate(-1.2deg) scale(1.03);transform-origin:center;margin:-10px 0 -10px}
.marquee__track{display:inline-flex;animation:marquee 34s linear infinite;will-change:transform}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__track span{display:inline-flex;align-items:center;gap:28px;padding-inline:28px}
.marquee__track span::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--dark)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- Big stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
@media (max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}}
.stat{padding:clamp(28px,3vw,44px) clamp(16px,2vw,32px);border-right:1px solid var(--line);position:relative}
.stat:last-child{border-right:0}
@media (max-width:900px){.stat:nth-child(2){border-right:0}.stat:nth-child(-n+2){border-bottom:1px solid var(--line)}}
.stat b{display:block;font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 78;font-size:clamp(3.4rem,6.6vw,6.8rem);letter-spacing:-.05em;color:var(--dark);line-height:.9;margin-bottom:14px}
.stat b small{font-size:.5em;color:var(--green-2);vertical-align:top;line-height:1.6}
.stat b .cnt{font-variant-numeric:tabular-nums}
.stat > span{display:block;color:var(--ink-2);font-size:.95rem;max-width:22ch;line-height:1.4}
.bg-dark .stats{border-color:var(--line-d)}.bg-dark .stat{border-color:var(--line-d)}
.bg-dark .stat b{color:#fff}.bg-dark .stat>span{color:rgba(255,255,255,.65)}

/* ---------- Stacking solution cards ---------- */
.stack{display:grid;gap:24px}
.stack__card{position:sticky;top:calc(var(--header-h) + 24px);display:grid;grid-template-columns:1.05fr .95fr;min-height:min(72vh,640px);border-radius:var(--r-xl);overflow:hidden;background:var(--cream-2);color:var(--ink);box-shadow:0 -20px 60px -40px rgba(10,31,23,.4);isolation:isolate}
.stack__card:nth-child(2){top:calc(var(--header-h) + 48px);background:var(--dark-2);color:#fff}
.stack__card:nth-child(3){top:calc(var(--header-h) + 72px);background:var(--green);color:#fff}
.stack__card:nth-child(2) h3,.stack__card:nth-child(3) h3{color:#fff}
.stack__card:nth-child(2) p,.stack__card:nth-child(3) p{color:rgba(255,255,255,.8)}
.stack__media{position:relative;overflow:hidden;min-height:300px}
.stack__media img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform 1.4s var(--ease)}
.stack__card:hover .stack__media img{transform:scale(1.05)}
.stack__body{padding:clamp(28px,4vw,64px);display:flex;flex-direction:column;justify-content:center;gap:18px;position:relative}
.stack__num{font-family:var(--display);font-weight:800;font-size:.85rem;letter-spacing:.2em;display:flex;align-items:center;gap:12px;opacity:.7}
.stack__num::after{content:"";width:40px;height:1px;background:currentColor}
.stack__body h3{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 80;text-transform:uppercase;font-size:clamp(2rem,3.8vw,3.6rem);line-height:.92;letter-spacing:-.02em;margin:0}
.stack__body p{font-size:1.02rem;margin:0;max-width:46ch}
.stack__gain{display:inline-flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;font-size:1.25rem;letter-spacing:-.02em}
.stack__gain svg{width:22px;height:22px}
.stack__card:nth-child(1) .stack__gain{color:var(--green)}
.stack__card:nth-child(2) .stack__gain,.stack__card:nth-child(3) .stack__gain{color:var(--lime)}
.stack__links{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.stack__links a{font-size:.85rem;font-weight:600;padding:9px 16px;border-radius:999px;border:1.5px solid currentColor;transition:background .3s,color .3s;opacity:.9}
.stack__card:nth-child(1) .stack__links a:hover{background:var(--dark);color:#fff;border-color:var(--dark)}
.stack__card:nth-child(n+2) .stack__links a:hover{background:var(--lime);color:var(--dark);border-color:var(--lime)}
.stack__cta{margin-top:10px}
@media (max-width:900px){.stack__card{grid-template-columns:1fr;position:relative;top:auto!important;min-height:0}.stack__media{min-height:240px;aspect-ratio:16/10}.stack__media img{position:relative}}

/* ---------- Cards (hubs) ---------- */
.grid{display:grid;gap:22px}
.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1000px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
.scard{position:relative;display:flex;flex-direction:column;min-height:440px;border-radius:var(--r);overflow:hidden;background:var(--dark);color:#fff;isolation:isolate}
.scard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.4s var(--ease),opacity .6s;opacity:.75}
.scard::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,31,23,.05) 0%,rgba(10,31,23,.5) 50%,rgba(10,31,23,.97) 100%)}
.scard:hover img{transform:scale(1.07);opacity:.9}
.scard__link{position:absolute;inset:0;z-index:2}
.scard__top{display:flex;justify-content:space-between;align-items:flex-start;padding:22px;position:relative;z-index:1}
.scard__tag{padding:8px 13px;border-radius:999px;background:rgba(255,255,255,.14);backdrop-filter:blur(8px);font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.scard__arrow{width:46px;height:46px;border-radius:50%;background:var(--lime);color:var(--dark);display:grid;place-items:center;transition:transform .5s var(--ease)}
.scard__arrow svg{width:18px;height:18px}
.scard:hover .scard__arrow{transform:rotate(-45deg) scale(1.08)}
.scard__body{margin-top:auto;padding:24px;position:relative;z-index:1}
.scard__body h3{color:#fff;margin-bottom:8px;font-family:var(--display);font-weight:800;font-size:clamp(1.5rem,2vw,1.9rem);letter-spacing:-.02em;line-height:1}
.scard__body p{color:rgba(255,255,255,.78);font-size:.93rem;margin-bottom:12px}
.scard__gain{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-weight:700;color:var(--lime);font-size:.98rem}
.scard__gain svg{width:16px;height:16px}

.feature{padding:34px 30px;border-radius:var(--r);background:#fff;border:1px solid var(--line);transition:transform .5s var(--ease),box-shadow .5s;position:relative;overflow:hidden}
.feature:hover{transform:translateY(-6px);box-shadow:var(--shadow-sm)}
.feature__icon{width:54px;height:54px;border-radius:16px;background:var(--dark);display:grid;place-items:center;color:var(--lime);margin-bottom:24px}
.feature__icon svg{width:24px;height:24px}
.feature h3{font-size:1.3rem;margin-bottom:10px;letter-spacing:-.02em}
.feature p{color:var(--ink-2);font-size:.95rem;margin:0}
.feature .num{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 78;font-size:3.6rem;letter-spacing:-.05em;color:transparent;-webkit-text-stroke:1.5px var(--green-2);line-height:1;margin-bottom:10px}
.bg-dark .feature{background:rgba(255,255,255,.05);border-color:var(--line-d)}
.bg-dark .feature__icon{background:var(--lime);color:var(--dark)}
.bg-dark .feature h3{color:#fff}.bg-dark .feature p{color:rgba(255,255,255,.72)}
.bg-dark .feature .num{-webkit-text-stroke-color:var(--lime)}

/* ---------- Aides ---------- */
.aides{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
@media (max-width:1000px){.aides{grid-template-columns:1fr}}
.aides__logos{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.aides__logos a,.aides__logos div{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px;display:grid;place-items:center;aspect-ratio:1.35;transition:transform .5s var(--ease),box-shadow .5s}
.aides__logos a:hover{transform:translateY(-6px) rotate(-1.5deg);box-shadow:var(--shadow-sm)}
.aides__logos img{max-height:60px;width:auto;object-fit:contain}
.check-list{list-style:none;padding:0;margin:0 0 28px;display:grid;gap:12px}
.check-list li{display:flex;gap:12px;align-items:flex-start;font-size:1rem;color:var(--ink-2);line-height:1.5}
.check-list li::before{content:"";flex:none;width:22px;height:22px;border-radius:50%;background:var(--lime) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230A1F17' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat;margin-top:2px}
.bg-dark .check-list li{color:rgba(255,255,255,.85)}

/* ---------- Process ---------- */
.process{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.process::before{content:"";position:absolute;left:0;right:0;top:46px;height:1px;background:var(--line-d)}
.process__bar{position:absolute;left:0;top:46px;height:2px;width:0;background:var(--lime);z-index:1;transition:width 1.4s var(--ease-3)}
.process.is-in .process__bar{width:100%}
@media (max-width:1000px){.process{grid-template-columns:repeat(2,1fr)}.process::before,.process__bar{display:none}}
@media (max-width:600px){.process{grid-template-columns:1fr}}
.step{position:relative;padding:0 0 10px}
.step__num{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 78;font-size:clamp(3.4rem,5vw,5rem);letter-spacing:-.05em;line-height:.9;color:transparent;-webkit-text-stroke:1.5px var(--lime);margin-bottom:26px;background:var(--dark);display:inline-block;padding-right:14px;position:relative;z-index:2}
.step h3{color:#fff;font-size:1.3rem;margin-bottom:10px;letter-spacing:-.02em}
.step p{color:rgba(255,255,255,.7);font-size:.94rem;margin:0}
.process--light .step h3{color:var(--ink)}.process--light .step p{color:var(--ink-2)}
.process--light .step__num{-webkit-text-stroke-color:var(--green-2);background:var(--cream)}
.process--light::before{background:var(--line)}.process--light .process__bar{background:var(--green-2)}
.bg-2 .process--light .step__num{background:var(--cream-2)}

/* ---------- Horizontal gallery ---------- */
.hgal{overflow:hidden}
.hgal__track{display:flex;gap:22px;will-change:transform;padding-inline:var(--gutter);align-items:flex-end}
.hgal__item{flex:none;width:clamp(260px,26vw,400px);aspect-ratio:3/4;border-radius:var(--r);overflow:hidden;position:relative;background:var(--cream-3)}
.hgal__item img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.hgal__item:hover img{transform:scale(1.06)}
.hgal__item span{position:absolute;left:16px;bottom:16px;padding:9px 14px;border-radius:999px;background:rgba(10,31,23,.75);color:#fff;font-size:.8rem;font-weight:600;backdrop-filter:blur(6px)}
.hgal__item.is-wide{width:clamp(340px,40vw,600px);aspect-ratio:4/3}
.hgal__end{flex:none;width:clamp(260px,26vw,400px);aspect-ratio:3/4;border-radius:var(--r);background:var(--dark);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:28px;gap:14px}
.hgal__end b{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 80;text-transform:uppercase;font-size:2rem;line-height:.95}
@media (max-width:1180px){.hgal{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding-bottom:8px;scrollbar-width:none}.hgal__item,.hgal__end{scroll-snap-align:start}}

/* ---------- Testimonials ---------- */
.testi{padding:38px;border-radius:var(--r);background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;gap:20px;transition:transform .5s var(--ease),box-shadow .5s;position:relative}
.testi::before{content:"“";position:absolute;right:28px;top:8px;font-family:var(--display);font-weight:800;font-size:6rem;line-height:1;color:var(--cream-3)}
.testi:hover{transform:translateY(-6px);box-shadow:var(--shadow-sm)}
.testi__stars{display:flex;gap:3px;color:var(--sun)}
.testi__stars svg{width:18px;height:18px}
.testi p{font-size:1.15rem;color:var(--ink);margin:0;font-family:var(--display);font-weight:600;line-height:1.35;letter-spacing:-.01em}
.testi__who{display:flex;align-items:center;gap:12px;margin-top:auto}
.testi__who i{width:44px;height:44px;border-radius:50%;background:var(--dark);color:var(--lime);display:grid;place-items:center;font-style:normal;font-weight:800;font-family:var(--display)}
.testi__who b{display:block;font-size:.95rem}.testi__who span{font-size:.82rem;color:var(--muted)}
.rating{display:inline-flex;align-items:center;gap:12px;font-weight:600}
.rating b{font-family:var(--display);font-size:2.2rem;letter-spacing:-.04em;font-weight:800}
.rating .testi__stars svg{width:16px;height:16px}

/* ---------- FAQ ---------- */
.faq{max-width:900px;margin-inline:auto}
.faq__item{border-bottom:1px solid var(--line)}
.faq__q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0;text-align:left;font-family:var(--display);font-weight:700;font-size:1.2rem;letter-spacing:-.01em;color:var(--ink);transition:color .3s}
.faq__q:hover{color:var(--green)}
.faq__q i{flex:none;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;transition:transform .4s var(--ease),background .3s,border-color .3s}
.faq__q svg{width:14px;height:14px}
.faq__item.is-open .faq__q i{transform:rotate(45deg);background:var(--lime);border-color:var(--lime)}
.faq__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.faq__item.is-open .faq__a{grid-template-rows:1fr}
.faq__a>div{overflow:hidden}
.faq__a p{color:var(--ink-2);padding-bottom:24px;margin:0;max-width:780px}
.bg-dark .faq__item{border-color:var(--line-d)}.bg-dark .faq__q{color:#fff}.bg-dark .faq__q i{border-color:rgba(255,255,255,.25)}.bg-dark .faq__a p{color:rgba(255,255,255,.75)}

/* ---------- Blog ---------- */
.post{display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;background:#fff;border:1px solid var(--line);transition:transform .5s var(--ease),box-shadow .5s}
.post:hover{transform:translateY(-6px);box-shadow:var(--shadow-sm)}
.post__img{aspect-ratio:16/10;overflow:hidden}
.post__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.post:hover .post__img img{transform:scale(1.06)}
.post__body{padding:26px;display:flex;flex-direction:column;gap:10px;flex:1}
.post__meta{font-size:.8rem;color:var(--muted);display:flex;gap:8px;align-items:center}
.post__meta b{color:var(--green);font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:.72rem}
.post h3{font-size:1.25rem;margin:0;letter-spacing:-.02em}
.post p{color:var(--ink-2);font-size:.93rem;margin:0}
.post .btn-link{margin-top:auto;padding-top:8px}

/* ---------- CTA band ---------- */
.cta-band{position:relative;overflow:hidden;background:var(--dark);color:#fff;border-radius:var(--r-xl);padding:clamp(40px,6vw,88px);display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;isolation:isolate}
@media (max-width:1000px){.cta-band{grid-template-columns:1fr}}
.cta-band::before{content:"";position:absolute;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(212,255,61,.32),transparent 62%);top:-320px;right:-200px;pointer-events:none;z-index:-1}
.cta-band::after{content:"";position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(255,179,71,.25),transparent 62%);bottom:-260px;left:-160px;pointer-events:none;z-index:-1}
.cta-band h2{color:#fff}

/* ---------- Devis form ---------- */
.form{background:var(--cream);color:var(--ink);border-radius:28px;padding:30px;box-shadow:var(--shadow)}
.form__progress{display:flex;gap:6px;margin-bottom:24px}
.form__progress i{flex:1;height:4px;border-radius:4px;background:var(--cream-3);transition:background .4s}
.form__progress i.is-done{background:var(--green-2)}
.form__step{display:none}
.form__step.is-active{display:block;animation:fadeUp .5s var(--ease)}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.form__step h3{font-size:1.4rem;margin-bottom:4px;letter-spacing:-.02em}
.form__step>p{font-size:.9rem;color:var(--muted);margin-bottom:18px}
.form__nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px}
.pick{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.pick label{position:relative;display:flex;align-items:center;gap:12px;padding:15px;border-radius:16px;border:1.5px solid var(--line);background:#fff;cursor:pointer;font-weight:600;font-size:.92rem;transition:border-color .3s,background .3s,transform .3s var(--ease)}
.pick label:hover{border-color:var(--green-2);transform:translateY(-2px)}
.pick input{position:absolute;opacity:0;pointer-events:none}
.pick label:has(input:checked){border-color:var(--dark);background:var(--lime)}
.pick svg{width:22px;height:22px;color:var(--green);flex:none}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field label{font-size:.82rem;font-weight:600;color:var(--ink-2)}
.field input,.field select,.field textarea{width:100%;padding:15px 16px;border-radius:14px;border:1.5px solid var(--line);font:inherit;font-size:.98rem;background:#fff;color:var(--ink);transition:border-color .3s,box-shadow .3s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--green-2);box-shadow:0 0 0 4px rgba(42,154,95,.14)}
.field textarea{min-height:110px;resize:vertical}
.field.error input,.field.error select{border-color:#D6453D}
.field__err{font-size:.78rem;color:#D6453D;display:none}
.field.error .field__err{display:block}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:560px){.field-row{grid-template-columns:1fr}}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:.8rem;color:var(--muted);margin:8px 0 0}
.consent input{margin-top:3px;accent-color:var(--green)}
.form__reassure{display:flex;flex-wrap:wrap;gap:14px;margin-top:16px;font-size:.78rem;color:var(--muted)}
.form__reassure span{display:inline-flex;align-items:center;gap:5px}
.form__reassure svg{width:14px;height:14px;color:var(--green-2)}

/* ---------- Page hero ---------- */
.phero{position:relative;background:var(--dark);color:#fff;overflow:hidden;padding:calc(var(--header-h) + clamp(56px,8vw,120px)) 0 clamp(56px,7vw,96px);min-height:70vh;display:flex;align-items:flex-end;isolation:isolate}
.phero__bg{position:absolute;inset:0;z-index:0}
.phero__bg img{width:100%;height:112%;object-fit:cover;opacity:.42}
.phero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,31,23,.95) 25%,rgba(10,31,23,.35)),linear-gradient(0deg,rgba(10,31,23,.95),transparent 55%)}
.phero .container{position:relative;z-index:1}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:.8rem;color:rgba(255,255,255,.55);margin:0 0 28px;list-style:none;padding:0}
.crumbs a:hover{color:var(--lime)}
.crumbs li+li::before{content:"/";margin-right:8px;opacity:.5}
.crumbs li:last-child{color:#fff}
.phero h1{color:#fff;max-width:16ch;font-size:clamp(2.8rem,6.8vw,6.4rem)}
.phero .lead{max-width:620px;color:rgba(255,255,255,.82)}
.phero__grid{display:grid;grid-template-columns:1.25fr .75fr;gap:40px;align-items:end}
@media (max-width:1000px){.phero__grid{grid-template-columns:1fr}}
.phero__kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.phero__kpis div{padding:20px 18px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);backdrop-filter:blur(10px)}
.phero__kpis b{display:block;font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 80;font-size:clamp(1.7rem,2.8vw,2.6rem);color:var(--lime);letter-spacing:-.03em;line-height:.95}
.phero__kpis span{font-size:.78rem;color:rgba(255,255,255,.7);display:block;margin-top:8px;line-height:1.35}
@media (max-width:640px){.phero__kpis{grid-template-columns:1fr 1fr}}
.tag{display:inline-block;padding:7px 13px;border-radius:999px;background:var(--cream-2);color:var(--dark);font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}

/* ---------- Content blocks ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,88px);align-items:center}
.split.rev>:first-child{order:2}
@media (max-width:900px){.split{grid-template-columns:1fr}.split.rev>:first-child{order:0}}
.split__media{border-radius:var(--r);overflow:hidden;position:relative;background:var(--cream-3)}
.split__media img{width:100%;height:100%;object-fit:cover}
.split__media.is-photo{aspect-ratio:4/3.2}
.split__media.is-schema{padding:28px;background:#fff;border:1px solid var(--line)}
.split__media.is-schema img{object-fit:contain}
.split__media .badge{position:absolute;left:20px;bottom:20px;padding:14px 20px;border-radius:16px;background:var(--dark);color:#fff;font-family:var(--display);font-weight:800;box-shadow:var(--shadow);display:flex;flex-direction:column;line-height:1.1;font-size:1.1rem;letter-spacing:-.02em}
.split__media .badge small{font-weight:500;font-size:.74rem;color:var(--lime);margin-top:5px;font-family:var(--body);letter-spacing:0}
.prose{color:var(--ink-2);font-size:1.03rem}
.prose h2,.prose h3{color:var(--ink)}
.prose h2{font-size:clamp(1.9rem,3.6vw,3rem);margin-top:1.4em}
.prose h2:first-child,.prose h2.mt-0{margin-top:0}
.prose h3{font-size:1.35rem;margin-top:1.4em;text-transform:none}
.prose ul li,.prose ol li{margin-bottom:.45em}
.prose a{color:var(--green);text-decoration:underline;text-underline-offset:3px}
.prose blockquote{margin:1.5em 0;padding:20px 24px;border-left:4px solid var(--lime);background:var(--cream-2);border-radius:0 14px 14px 0;font-style:italic}
.prose table{width:100%;border-collapse:collapse;font-size:.95rem;margin:1.2em 0;background:#fff;border-radius:16px;overflow:hidden}
.prose th,.prose td{padding:14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.prose th{font-family:var(--display);font-weight:700;color:#fff;background:var(--dark)}
.bg-dark .prose{color:rgba(255,255,255,.78)}.bg-dark .prose h2,.bg-dark .prose h3{color:#fff}
.article{max-width:800px;margin-inline:auto}
.callout{display:grid;grid-template-columns:auto 1fr;gap:18px;padding:26px;border-radius:20px;background:#fff;border:1px solid var(--line);align-items:start}
.callout svg{width:28px;height:28px;color:var(--green)}
.callout b{display:block;font-family:var(--display);margin-bottom:4px;font-size:1.1rem}
.callout p{margin:0;font-size:.95rem;color:var(--ink-2)}
.logos{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.logos div{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 24px;display:grid;place-items:center;height:82px;min-width:150px;transition:transform .4s var(--ease)}
.logos div:hover{transform:translateY(-4px)}
.logos img{max-height:40px;max-width:120px;width:auto;object-fit:contain}
.bg-dark .logos div{background:rgba(255,255,255,.92);border-color:transparent}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media (max-width:900px){.gallery{grid-template-columns:repeat(2,1fr)}}
.gallery a,.gallery div{aspect-ratio:9/10;border-radius:18px;overflow:hidden;background:var(--cream-3)}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.gallery a:hover img,.gallery div:hover img{transform:scale(1.06)}
.gallery.masonry{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.gallery.masonry{grid-template-columns:repeat(2,1fr)}}
.gallery.masonry div:nth-child(4n+1){grid-row:span 2;aspect-ratio:auto}
.pill-list{display:flex;flex-wrap:wrap;gap:10px;list-style:none;padding:0;margin:0}
.pill-list li{padding:10px 18px;border-radius:999px;background:var(--dark);color:#fff;font-weight:600;font-size:.88rem}
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:start}
@media (max-width:1000px){.contact-grid{grid-template-columns:1fr}}
.contact-card{padding:26px;border-radius:20px;background:#fff;border:1px solid var(--line);display:flex;gap:18px;align-items:flex-start;margin-bottom:14px}
.contact-card i{width:48px;height:48px;border-radius:14px;background:var(--dark);display:grid;place-items:center;color:var(--lime);flex:none}
.contact-card svg{width:22px;height:22px}
.contact-card b{display:block;font-family:var(--display);font-size:1.05rem;margin-bottom:4px}
.contact-card p{margin:0;color:var(--ink-2);font-size:.95rem}
.contact-card a:hover{color:var(--green)}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media (max-width:800px){.timeline{grid-template-columns:1fr 1fr}}
.timeline div{padding-top:24px;border-top:2px solid var(--line);position:relative}
.timeline div::before{content:"";position:absolute;top:-7px;left:0;width:12px;height:12px;border-radius:50%;background:var(--lime);border:2px solid var(--dark)}
.timeline b{display:block;font-family:var(--display);font-weight:800;font-size:2.4rem;letter-spacing:-.04em;color:var(--dark);line-height:1}
.timeline p{margin:8px 0 0;color:var(--ink-2);font-size:.93rem}
.big-quote{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 82;text-transform:uppercase;font-size:clamp(1.8rem,4.2vw,3.8rem);letter-spacing:-.02em;line-height:.98;max-width:1000px;margin:0}
.big-quote em{font-style:normal;color:var(--lime)}
.sticky-cta{display:none!important}
.notfound{min-height:70vh;display:grid;place-items:center;text-align:center;padding-top:var(--header-h)}
.notfound b{font-family:var(--display);font-weight:800;font-size:clamp(7rem,24vw,18rem);letter-spacing:-.06em;line-height:.9;color:transparent;-webkit-text-stroke:2px var(--dark);display:block}

/* ---------- Footer ---------- */
.footer{background:var(--dark);color:rgba(255,255,255,.7);padding:clamp(64px,8vw,110px) 0 0;position:relative;overflow:hidden;border-radius:var(--r-xl) var(--r-xl) 0 0;margin-top:-10px}
.footer__grid{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:40px;margin-bottom:64px}
@media (max-width:1000px){.footer__grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer__grid{grid-template-columns:1fr}}
.footer h4{color:#fff;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;margin-bottom:20px}
.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:11px;font-size:.93rem}
.footer a{transition:color .3s}.footer a:hover{color:var(--lime)}
.footer .logo{color:#fff;margin-bottom:18px}
.footer__brand p{font-size:.93rem;max-width:340px}
.footer__social{display:flex;gap:10px;margin-top:20px}
.footer__social a{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center;transition:background .3s,border-color .3s,color .3s}
.footer__social a:hover{background:var(--lime);border-color:var(--lime);color:var(--dark)}
.footer__social svg{width:18px;height:18px}
.footer__bottom{border-top:1px solid var(--line-d);padding:24px 0;display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;font-size:.78rem;color:rgba(255,255,255,.5)}
.footer__bottom ul{display:flex;flex-wrap:wrap;gap:18px}
.footer__big{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 75;text-transform:uppercase;font-size:clamp(4rem,15.5vw,15rem);letter-spacing:-.04em;line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(212,255,61,.35);text-align:center;white-space:nowrap;user-select:none;margin:0 auto;padding-top:10px;transform:translateY(.12em)}

/* ---------- Reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(36px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal="left"]{transform:translateX(-44px)}[data-reveal="right"]{transform:translateX(44px)}[data-reveal="scale"]{transform:scale(.94)}
[data-reveal-group]>*{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
[data-reveal-group].is-in>*{opacity:1;transform:none}
[data-reveal-group].is-in>*:nth-child(2){transition-delay:.08s}[data-reveal-group].is-in>*:nth-child(3){transition-delay:.16s}[data-reveal-group].is-in>*:nth-child(4){transition-delay:.24s}[data-reveal-group].is-in>*:nth-child(5){transition-delay:.32s}[data-reveal-group].is-in>*:nth-child(6){transition-delay:.4s}[data-reveal-group].is-in>*:nth-child(7){transition-delay:.48s}[data-reveal-group].is-in>*:nth-child(n+8){transition-delay:.56s}
.stack[data-reveal-group]>*{opacity:1;transform:none}
.no-js [data-reveal],.no-js [data-reveal-group]>*{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){[data-reveal],[data-reveal-group]>*{opacity:1;transform:none;transition:none}.marquee__track{animation:none}.hero__sun{animation:none}}
.split-words .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em;margin-bottom:-.08em}
.split-words .w>i{display:inline-block;font-style:normal;transform:translateY(110%);transition:transform 1s var(--ease)}
.split-words.is-in .w>i{transform:none}
.img-reveal img{clip-path:inset(0 100% 0 0);transition:clip-path 1.3s var(--ease-2)}
.img-reveal.is-in img{clip-path:inset(0 0 0 0)}

/* ---------- Utilities ---------- */
.mt-0{margin-top:0}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:40px}.mt-6{margin-top:64px}
.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.mb-4{margin-bottom:40px}
.flex{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.divider{height:1px;background:var(--line);margin:40px 0}

/* =====================================================================
   v3 — Langage de composants signature : chanfreins « panneau solaire »,
   boutons « spark », cartes fondues dans le fond (filets + gros chiffres)
   ===================================================================== */
:root{--cut:18px;--cut-sm:12px;--chamfer:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%);--chamfer-sm:polygon(0 0,calc(100% - var(--cut-sm)) 0,100% var(--cut-sm),100% 100%,0 100%);--chamfer-2:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut))}

/* ---- Boutons « spark » ---- */
.btn{border-radius:0;clip-path:var(--chamfer-sm);padding:0;gap:0;text-transform:uppercase;letter-spacing:.06em;font-size:.86rem;font-weight:800;font-variation-settings:"wdth" 88;overflow:visible;isolation:auto;background:transparent!important;color:inherit}
.btn::after{display:none}
.btn::before{content:"";position:absolute;inset:0;clip-path:var(--chamfer-sm);z-index:-1;transition:transform .55s var(--ease)}
.btn>*{position:relative;z-index:1}
.btn{position:relative;z-index:0}
.btn .btn__t{display:inline-flex;align-items:center;padding:19px 26px 19px 24px}
.btn .btn__i{display:inline-grid;place-items:center;width:52px;align-self:stretch;border-left:1px solid rgba(0,0,0,.14);transition:background .35s}
.btn svg{width:16px;height:16px;transform:rotate(-45deg);transition:transform .45s var(--ease)}
.btn:hover svg{transform:rotate(0)}
.btn-primary{color:var(--dark)}
.btn-primary::before{background:var(--lime)}
.btn-primary .btn__i{background:rgba(10,31,23,.1)}
.btn-primary:hover .btn__i{background:var(--dark);color:var(--lime)}
.btn-dark{color:#fff}
.btn-dark::before{background:var(--dark)}
.btn-dark .btn__i{border-left-color:rgba(255,255,255,.14);background:rgba(255,255,255,.06)}
.btn-dark:hover .btn__i{background:var(--lime);color:var(--dark)}
.btn-outline{color:#fff;border:0;backdrop-filter:none;background:transparent!important}
.btn-outline::before{background:transparent;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.5)}
.btn-outline .btn__i{border-left-color:rgba(255,255,255,.4)}
.btn-outline:hover::before{background:#fff}
.btn-outline:hover{color:var(--dark)}
.btn-outline:hover .btn__i{border-left-color:rgba(0,0,0,.15)}
.btn-outline-dark{color:var(--dark);border:0}
.btn-outline-dark::before{background:transparent;box-shadow:inset 0 0 0 1.5px var(--dark)}
.btn-outline-dark:hover::before{background:var(--dark)}
.btn-outline-dark:hover{color:#fff}
.btn-outline-dark:hover .btn__i{border-left-color:rgba(255,255,255,.2)}
.btn-sm .btn__t{padding:14px 18px 14px 18px;font-size:.78rem}.btn-sm .btn__i{width:42px}
.btn-lg .btn__t{padding:23px 30px 23px 28px;font-size:.95rem}.btn-lg .btn__i{width:60px}
.btn-link{text-transform:uppercase;letter-spacing:.08em;font-size:.82rem;font-weight:800}
.btn-link::after{height:1.5px;bottom:-6px}
.btn-link svg{transform:rotate(-45deg)}.btn-link:hover svg{transform:rotate(0)}

/* ---- Hero : panneau projet fondu ---- */
.hero__panel{background:transparent;border:0;backdrop-filter:none;padding:0;border-top:1px solid rgba(255,255,255,.25);padding-top:22px}
.hero__panel h3{font-variation-settings:"wdth" 82;text-transform:uppercase;font-size:1.6rem}
.hero__panel .choices{grid-template-columns:1fr;gap:0}
.choice{flex-direction:row;align-items:center;justify-content:space-between;gap:14px;padding:16px 4px;border:0;border-bottom:1px solid rgba(255,255,255,.18);border-radius:0;background:transparent;font-family:var(--display);font-weight:700;font-size:1.05rem;letter-spacing:-.01em;position:relative;overflow:hidden}
.choice svg{width:22px;height:22px;order:0}
.choice::after{content:"→";font-family:var(--display);font-weight:800;margin-left:auto;transition:transform .4s var(--ease);color:var(--lime)}
.choice::before{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:var(--lime);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.choice:hover{background:transparent;border-color:rgba(255,255,255,.18);transform:none;color:var(--lime)}
.choice:hover::before{transform:scaleX(1)}
.choice:hover::after{transform:translateX(6px)}
.hero__kicker{border-radius:0;clip-path:var(--chamfer-sm);border:0;background:rgba(212,255,61,.14);padding:9px 16px 9px 10px}
.hero__kicker i{border-radius:0}

/* ---- Chanfreins sur les médias ---- */
.stack__card{border-radius:0;clip-path:var(--chamfer);box-shadow:none}
.stack__card:nth-child(2),.stack__card:nth-child(3){clip-path:var(--chamfer)}
.split__media,.gallery a,.gallery div,.hgal__item,.hgal__end,.post__img,.mega__card,.article__hero,.scard{border-radius:0;clip-path:var(--chamfer)}
.split__media.is-schema{border:0;background:#fff}
.split__media .badge{border-radius:0;clip-path:var(--chamfer-sm);box-shadow:none;left:0;bottom:0;padding:16px 22px}
.stack__links a{border-radius:0;clip-path:var(--chamfer-sm);border:1px solid currentColor;padding:9px 16px}
.stack__body h3{font-size:clamp(2.2rem,4.2vw,4rem)}

/* ---- « Cartes » fondues : grille à filets ---- */
.grid.grid-3,.grid.grid-4,.grid.grid-2{gap:0}
.feature{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:32px 28px 40px 0;margin-right:28px;position:relative;transition:none}
.feature:hover{transform:none;box-shadow:none}
.feature::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:0;background:var(--green-2);transition:width .6s var(--ease)}
.feature:hover::before{width:100%}
.feature__icon{width:auto;height:auto;background:transparent;border-radius:0;color:var(--green);margin-bottom:28px;place-items:start}
.feature__icon svg{width:30px;height:30px;stroke-width:1.5}
.feature .num{font-size:clamp(3.2rem,5vw,4.6rem);-webkit-text-stroke:1.5px var(--green-2);margin-bottom:18px}
.feature h3{font-family:var(--display);font-variation-settings:"wdth" 85;text-transform:uppercase;font-size:1.35rem;letter-spacing:-.01em}
.bg-dark .feature{background:transparent;border-color:var(--line-d)}
.bg-dark .feature__icon{background:transparent;color:var(--lime)}
.bg-dark .feature::before{background:var(--lime)}

.testi{background:transparent;border:0;border-left:1px solid var(--line);border-radius:0;padding:8px 32px 8px 28px;transition:none}
.testi:hover{transform:none;box-shadow:none}
.testi::before{position:static;font-size:5rem;line-height:.6;color:var(--lime);height:.55em;display:block;margin-bottom:6px;-webkit-text-stroke:1px var(--dark)}
.testi p{font-size:clamp(1.15rem,1.5vw,1.45rem);font-weight:700;font-variation-settings:"wdth" 88;letter-spacing:-.02em}
.testi__who i{border-radius:0;clip-path:var(--chamfer-sm)}
.grid-3:has(.testi){gap:0}

.post{background:transparent;border:0;border-radius:0;transition:none;padding-right:28px}
.post:hover{transform:none;box-shadow:none}
.post__body{padding:22px 0 0}
.post h3{font-family:var(--display);font-variation-settings:"wdth" 85;text-transform:uppercase;font-size:1.3rem}

.stat{padding-left:0}
.stat b{-webkit-text-stroke:0}
.stat:nth-child(even) b{color:transparent;-webkit-text-stroke:1.5px var(--dark)}

/* aides : logos sur filet, sans boîtes */
.aides__logos{grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.aides__logos a,.aides__logos div{background:transparent;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;aspect-ratio:1.25;transition:background .35s}
.aides__logos a:hover{transform:none;box-shadow:none;background:#fff}
.logos{gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);justify-content:flex-start!important}
.logos div{background:transparent;border:0;border-right:1px solid var(--line);border-radius:0;min-width:0;flex:1 1 140px;height:96px}
.logos div:last-child{border-right:0}
.logos div:hover{transform:none;background:#fff}
.bg-dark .logos{border-color:var(--line-d)}.bg-dark .logos div{background:transparent;border-color:var(--line-d)}
.bg-dark .logos img{filter:brightness(0) invert(1);opacity:.85}
.bg-dark .logos div:hover{background:rgba(255,255,255,.06)}

/* page hero kpis : chiffres nus */
.phero__kpis{gap:0;border-top:1px solid rgba(255,255,255,.25)}
.phero__kpis div{background:transparent;border:0;backdrop-filter:none;border-right:1px solid rgba(255,255,255,.18);border-radius:0;padding:20px 18px 6px 0;margin-right:18px}
.phero__kpis div:last-child{border-right:0}
.phero__kpis b{font-size:clamp(2rem,3.4vw,3.2rem)}
.tag{border-radius:0;clip-path:var(--chamfer-sm);background:var(--lime);color:var(--dark)}
.phero .tag{background:var(--lime)!important;color:var(--dark)!important}

/* contact / callout / pills */
.contact-card{background:transparent;border:0;border-top:1px solid var(--line);border-radius:0;padding:22px 0;margin:0}
.contact-card i{background:transparent;border-radius:0;color:var(--green);width:auto;height:auto}
.contact-card svg{width:26px;height:26px;stroke-width:1.5}
.callout{background:transparent;border:0;border-left:3px solid var(--lime);border-radius:0;padding:8px 0 8px 24px}
.pill-list li{border-radius:0;clip-path:var(--chamfer-sm)}
.timeline div::before{border-radius:0;transform:rotate(45deg)}
.hgal__item span{border-radius:0;clip-path:var(--chamfer-sm)}
.scard__tag{border-radius:0;clip-path:var(--chamfer-sm)}
.scard__arrow{border-radius:0;clip-path:var(--chamfer-sm)}
.scard:hover .scard__arrow{transform:none;background:#fff}
.scard__body h3{font-variation-settings:"wdth" 85;text-transform:uppercase}
.testi__who i,.mega__icon{border-radius:0}
.mega__item{border-radius:0;border-bottom:1px solid var(--line);padding:14px 8px}
.mega__item:hover{background:transparent;transform:none}
.mega__item:hover b{color:var(--green)}
.mega__icon{background:transparent;color:var(--green);width:auto;height:auto;padding-top:2px}
.mega__icon svg{width:24px;height:24px;stroke-width:1.5}
.mega{border-radius:0}
.faq__q i{border-radius:0;clip-path:var(--chamfer-sm);border:0;background:var(--cream-2)}
.bg-dark .faq__q i{background:rgba(255,255,255,.08)}
.faq__item.is-open .faq__q i{transform:none;background:var(--lime)}
.faq__q{text-transform:uppercase;font-variation-settings:"wdth" 88;font-size:1.1rem;letter-spacing:.01em}

/* ---- Formulaire fondu dans la bande sombre ---- */
.cta-band{border-radius:0;clip-path:var(--chamfer);padding:clamp(40px,6vw,88px) clamp(32px,5vw,80px)}
.cta-band .form{background:transparent;color:#fff;border-radius:0;padding:0;box-shadow:none;border-left:1px solid rgba(255,255,255,.18);padding-left:clamp(24px,3vw,48px)}
@media (max-width:1000px){.cta-band .form{border-left:0;padding-left:0;border-top:1px solid rgba(255,255,255,.18);padding-top:28px}}
.cta-band .form__progress i{background:rgba(255,255,255,.15)}.cta-band .form__progress i.is-done{background:var(--lime)}
.cta-band .form__step h3{color:#fff;text-transform:uppercase;font-variation-settings:"wdth" 85}
.cta-band .form__step>p,.cta-band .field label,.cta-band .consent,.cta-band .form__reassure{color:rgba(255,255,255,.62)}
.cta-band .pick label{background:transparent;border:1px solid rgba(255,255,255,.22);border-radius:0;clip-path:var(--chamfer-sm);color:#fff}
.cta-band .pick label:hover{border-color:var(--lime)}
.cta-band .pick label:has(input:checked){background:var(--lime);color:var(--dark);border-color:var(--lime)}
.cta-band .pick label:has(input:checked) svg{color:var(--dark)}
.cta-band .pick svg{color:var(--lime)}
.cta-band .field input,.cta-band .field select,.cta-band .field textarea{background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.3);border-radius:0;color:#fff;padding:12px 0}
.cta-band .field select option{color:var(--dark)}
.cta-band .field input:focus,.cta-band .field select:focus,.cta-band .field textarea:focus{box-shadow:none;border-bottom-color:var(--lime)}
.cta-band .field input::placeholder,.cta-band .field textarea::placeholder{color:rgba(255,255,255,.35)}
.cta-band .form__reassure svg{color:var(--lime)}
.cta-band .consent a{color:var(--lime)}
/* formulaire sur fond clair (contact / devis) */
.form{border-radius:0;box-shadow:none;background:transparent;padding:0;border-left:1px solid var(--line);padding-left:clamp(24px,3vw,48px)}
@media (max-width:1000px){.form{border-left:0;padding-left:0}}
.form__progress i{background:var(--cream-3)}
.pick label{border-radius:0;clip-path:var(--chamfer-sm);background:transparent;border:1px solid var(--line)}
.pick label:hover{transform:none;border-color:var(--dark)}
.pick label:has(input:checked){background:var(--lime);border-color:var(--lime)}
.field input,.field select,.field textarea{background:transparent;border:0;border-bottom:1px solid rgba(14,26,20,.3);border-radius:0;padding:12px 0}
.field input:focus,.field select:focus,.field textarea:focus{box-shadow:none;border-bottom-color:var(--green-2)}
.form__step h3{text-transform:uppercase;font-variation-settings:"wdth" 85}
.form__nav .btn{clip-path:var(--chamfer-sm)}

/* header : bouton */
.header .btn{clip-path:var(--chamfer-sm)}
.burger{border-radius:0;clip-path:var(--chamfer-sm)}
.mcta__btn{border-radius:0;clip-path:var(--chamfer-sm)}
.logo img{border-radius:0;clip-path:var(--chamfer-sm)}
.footer__social a{border-radius:0;clip-path:var(--chamfer-sm);border:0;background:rgba(255,255,255,.06)}
.sticky-cta .btn{clip-path:var(--chamfer-sm)}
.notfound b{-webkit-text-stroke-color:var(--green-2)}
.hgal__end{background:var(--lime);color:var(--dark)}
.hgal__end .btn-link{color:var(--dark)!important}
.step__num{-webkit-text-stroke-width:1.5px}
.process{gap:32px}
.process .step{padding-right:16px}
.mnav__ctas .btn{width:100%;justify-content:space-between}
.mnav__ctas .btn .btn__t{flex:1}

/* ---- Hero : sans bouton ---- */
.hero .lead{margin-bottom:28px}
.hero__all{display:inline-flex;align-items:center;gap:10px;margin-top:18px;font-family:var(--display);font-weight:700;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.hero__all i{font-style:normal;color:var(--lime);transition:transform .4s var(--ease)}
.hero__all:hover{color:#fff}.hero__all:hover i{transform:translateX(6px)}
.hero__trust{margin-top:36px}

/* ---- Méga-menu « luxe » : épuré, typographique ---- */
.mega{background:var(--cream);box-shadow:0 40px 80px -40px rgba(10,31,23,.45);border-top:1px solid var(--line)}
.mega__inner{grid-template-columns:.9fr 1.35fr .75fr;gap:clamp(32px,5vw,96px);padding:56px 0 64px;align-items:stretch}
.mega__kicker{display:block;font-family:var(--display);font-weight:700;font-size:.68rem;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);margin-bottom:26px}
.mega__intro h4{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 82;text-transform:uppercase;font-size:clamp(1.9rem,2.6vw,2.7rem);line-height:.95;letter-spacing:-.02em;margin-bottom:16px;color:var(--ink)}
.mega__intro p{font-size:.92rem;color:var(--ink-2);max-width:32ch;line-height:1.6}
.mega__more{display:inline-flex;align-items:center;gap:10px;margin-top:26px;font-family:var(--display);font-weight:700;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:6px}
.mega__more i{font-style:normal;transition:transform .4s var(--ease)}
.mega__more:hover i{transform:translateX(6px)}
.mega__list{display:block;margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}
.mega__item{display:grid;grid-template-columns:44px 1fr auto;grid-template-areas:"n lbl arrow" "n desc arrow";align-items:center;column-gap:18px;row-gap:2px;padding:18px 6px;border-bottom:1px solid var(--line);border-radius:0;background:transparent;transition:padding .45s var(--ease)}
.mega__item:hover{background:transparent;transform:none;padding-left:16px}
.mega__n{grid-area:n;font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.14em;color:var(--muted)}
.mega__lbl{grid-area:lbl;font-family:var(--display);font-weight:600;font-size:1.32rem;letter-spacing:-.015em;color:var(--ink);line-height:1.1;transition:color .3s}
.mega__desc{grid-area:desc;font-size:.82rem;color:var(--muted)}
.mega__arrow{grid-area:arrow;font-family:var(--display);font-weight:700;color:var(--ink);opacity:0;transform:translateX(-8px);transition:opacity .35s,transform .45s var(--ease)}
.mega__item:hover .mega__lbl{color:var(--green)}
.mega__item:hover .mega__arrow{opacity:1;transform:none}
.mega__card{min-height:100%;padding:0;background:var(--dark);clip-path:var(--chamfer)}
.mega__card::before{background:linear-gradient(180deg,transparent 45%,rgba(10,31,23,.92))}
.mega__card img{opacity:.9}
.mega__cap{position:absolute;left:24px;right:24px;bottom:22px;display:flex;flex-direction:column;gap:8px;color:#fff}
.mega__cap b{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 85;text-transform:uppercase;font-size:1.25rem;line-height:1;letter-spacing:-.01em}
.mega__cap span{font-family:var(--display);font-weight:700;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--lime)}
.nav__link{font-family:var(--display);font-weight:600;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;padding:10px 11px;border-radius:0}
.nav>li:hover .nav__link,.nav>li.is-open .nav__link{background:transparent;box-shadow:inset 0 -2px 0 currentColor}
.header.on-dark:not(.is-scrolled) .nav>li:hover .nav__link{background:transparent}
.nav__link svg{display:none}
.header__phone{font-size:.85rem;letter-spacing:.04em}
.header .btn-sm .btn__t{padding:13px 16px;font-size:.72rem}
.mnav__toggle{font-weight:700;font-variation-settings:"wdth" 82;font-size:1.7rem}
.header .mega__inner{display:grid;height:auto;justify-content:stretch}

/* ===== v4 — palette sobre : crème / vert profond / sauge, un seul accent ===== */
:root{--lime:#CFE3C8;--lime-2:#B9D2B0;--sun:#CFE3C8;--sun-2:#B9D2B0;--green:#1F5C45;--green-2:#2E7A5C;--dark:#0F2A20;--dark-2:#133428;--dark-3:#1A3F31}
.hl{color:var(--green)}.bg-dark .hl,.hero .hl{color:var(--lime)}.hl-sun{color:var(--lime)}
.hero__sun{background:radial-gradient(circle,rgba(207,227,200,.28),rgba(207,227,200,.08) 40%,transparent 68%)}
.hero__canvas{display:none}
.marquee{background:var(--dark);color:var(--cream);transform:none;margin:0;font-weight:600;letter-spacing:.06em;font-size:clamp(.85rem,1.2vw,1rem);padding:14px 0}
.marquee__track span::after{background:var(--lime);width:6px;height:6px}
.btn-primary{color:var(--cream)}
.btn-primary::before{background:var(--green)}
.btn-primary .btn__i{background:rgba(255,255,255,.08);border-left-color:rgba(255,255,255,.18)}
.btn-primary:hover .btn__i{background:var(--cream);color:var(--green)}
.bg-dark .btn-primary,.cta-band .btn-primary{color:var(--dark)}
.bg-dark .btn-primary::before,.cta-band .btn-primary::before{background:var(--cream)}
.bg-dark .btn-primary .btn__i,.cta-band .btn-primary .btn__i{background:rgba(15,42,32,.08);border-left-color:rgba(15,42,32,.15)}
.bg-dark .btn-primary:hover .btn__i,.cta-band .btn-primary:hover .btn__i{background:var(--dark);color:var(--cream)}
.btn-dark:hover .btn__i{background:var(--cream);color:var(--dark)}
.header .btn-primary{color:var(--cream)}
.header .btn-primary::before{background:var(--green)}
.header.on-dark:not(.is-scrolled) .btn-primary{color:var(--dark)}
.header.on-dark:not(.is-scrolled) .btn-primary::before{background:var(--cream)}
.header.on-dark:not(.is-scrolled) .btn-primary .btn__i{background:rgba(15,42,32,.08)}
.hero__kicker{background:rgba(255,255,255,.08)}
.hero__kicker i{background:var(--cream);color:var(--dark)}
.hero__trust svg,.choice svg,.choice::after,.hero__all i{color:var(--lime)}
.choice:hover{color:var(--cream)}
.stat:nth-child(even) b{-webkit-text-stroke-color:var(--green)}
.stat b small{color:var(--green)}
.feature .num{-webkit-text-stroke-color:var(--green)}
.bg-dark .feature .num{-webkit-text-stroke-color:var(--lime)}
.testi::before{color:var(--green);-webkit-text-stroke:0}
.testi__stars{color:var(--green)}
.testi__who i{background:var(--green);color:var(--cream)}
.check-list li::before{background-color:var(--green);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F3F0E8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.bg-dark .check-list li::before{background-color:var(--lime);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F2A20' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.step__num{-webkit-text-stroke-color:var(--lime)}
.process__bar{background:var(--lime)}
.stack__card:nth-child(2){background:var(--dark-2)}.stack__card:nth-child(3){background:var(--green)}
.stack__card:nth-child(2) .stack__gain,.stack__card:nth-child(3) .stack__gain{color:var(--lime)}
.stack__card:nth-child(n+2) .stack__links a:hover{background:var(--cream);color:var(--dark);border-color:var(--cream)}
.hgal__end{background:var(--dark);color:var(--cream)}.hgal__end .btn-link{color:var(--lime)!important}
.cta-band::before{background:radial-gradient(circle,rgba(207,227,200,.18),transparent 62%)}
.cta-band::after{display:none}
.cta-band .pick label:has(input:checked){background:var(--cream);color:var(--dark);border-color:var(--cream)}
.cta-band .pick svg{color:var(--lime)}
.cta-band .form__progress i.is-done,.form__progress i.is-done{background:var(--green)}
.pick label:has(input:checked){background:var(--green);color:var(--cream);border-color:var(--green)}
.pick label:has(input:checked) svg{color:var(--cream)}
.faq__item.is-open .faq__q i{background:var(--green);color:var(--cream)}
.bg-dark .faq__item.is-open .faq__q i{background:var(--cream);color:var(--dark)}
.tag,.phero .tag{background:var(--cream)!important;color:var(--dark)!important}
.hero__kicker,.phero__kpis b{color:var(--cream)}
.phero__kpis b{color:var(--lime)}
.mega__cap span{color:var(--lime)}
.footer__big{-webkit-text-stroke-color:rgba(207,227,200,.28)}
.footer__social a:hover{background:var(--cream);color:var(--dark)}
.footer a:hover{color:var(--lime)}
.topbar a[style]{color:var(--lime)!important}
.preloader__big span,.preloader__num,.preloader__bar{color:var(--lime);background:transparent}
.preloader__bar{background:var(--lime)}
.split__media .badge small{color:var(--lime)}
.stack__gain svg,.scard__gain{color:inherit}
.scard__gain{color:var(--lime)}
.scard__arrow{background:var(--cream);color:var(--dark)}
.timeline div::before{background:var(--green);border-color:var(--green)}
.callout{border-left-color:var(--green)}
.eyebrow{color:var(--green)}.bg-dark .eyebrow{color:var(--lime)}
.sticky-cta .btn-primary{color:var(--cream)}
.mnav__toggle svg,.mnav__panel a:hover{color:var(--lime)}
.mnav__panel a{border-left-color:rgba(207,227,200,.35)}
/* curseur personnalisé retiré */
.cursor{display:none!important}

/* ===== v4.1 — typo : plus de contours (text-stroke), chiffres alignés ===== */
.stat:nth-child(even) b,.stat b{color:var(--dark);-webkit-text-stroke:0}
.stat:nth-child(even) b{color:var(--green)}
.stat{padding:clamp(28px,3vw,44px) clamp(20px,2.4vw,36px)}
.stat:first-child{padding-left:0}
.stat b{font-variation-settings:"wdth" 82;letter-spacing:-.03em;font-size:clamp(3rem,5.6vw,5.6rem)}
.stat b small{font-size:.45em;margin-left:2px}
.feature .num{color:var(--green);-webkit-text-stroke:0}
.bg-dark .feature .num{color:var(--lime);-webkit-text-stroke:0}
.step__num{color:var(--lime);-webkit-text-stroke:0;font-size:clamp(2.6rem,3.6vw,3.6rem)}
.process--light .step__num{color:var(--green)}
.notfound b{color:var(--green);-webkit-text-stroke:0}
.footer__big{-webkit-text-stroke:0;color:rgba(255,255,255,.05);font-variation-settings:"wdth" 80;letter-spacing:-.02em;font-size:clamp(3.5rem,13vw,12.5rem);line-height:.85;padding:24px 0 0;transform:translateY(.1em)}
.phero__kpis div{padding:22px 20px 8px 0;margin-right:20px}
.phero__kpis b{font-variation-settings:"wdth" 82;letter-spacing:-.02em}
.preloader__num{font-variation-settings:"wdth" 82}
h1,h2{font-variation-settings:"wdth" 82,"opsz" 96;letter-spacing:-.015em}
.hero h1{letter-spacing:-.01em}
.footer__big{transform:none;padding:32px 0 8px;line-height:1;color:rgba(255,255,255,.06);width:100%}

/* ===== v4.2 — responsive : plus de débordement horizontal ===== */
@media (max-width:900px){
  [data-reveal="left"],[data-reveal="right"]{transform:translateY(30px)}
  .hero__sun{display:none}
  .split{gap:32px}
  .stack__card{clip-path:var(--chamfer-sm)}
  .phero{min-height:0}
  .phero h1{font-size:clamp(2.3rem,10vw,3.4rem)}
  .hero h1{font-size:clamp(2.8rem,13vw,4.6rem)}
  h2{font-size:clamp(2rem,8.5vw,3.2rem)}
  .section{padding-block:64px}
  .bg-dark.section{padding-top:calc(64px + var(--r-xl))}
  .bg-dark.section + .section:not(.bg-dark){padding-top:calc(64px + var(--r-xl))}
  .feature{margin-right:0;padding-right:0}
  .testi{border-left:0;border-top:1px solid var(--line);padding:24px 0}
  .post{padding-right:0}
  .grid.grid-2,.grid.grid-3,.grid.grid-4{gap:0}
  .stats{grid-template-columns:1fr 1fr}
  .stat{padding:22px 16px}
  .stat:first-child{padding-left:0}.stat:nth-child(3){padding-left:0;border-right:1px solid var(--line)}
  .stat:nth-child(2),.stat:nth-child(4){border-right:0}
  .stat b{font-size:clamp(2.4rem,11vw,3.4rem)}
  .aides__logos{grid-template-columns:repeat(3,1fr)}
  .hgal__item{width:78vw}.hgal__item.is-wide{width:88vw}.hgal__end{width:70vw}
  .cta-band{clip-path:var(--chamfer-sm);padding:40px 22px}
  .logos div{flex:1 1 50%;border-bottom:1px solid var(--line)}
  .timeline{grid-template-columns:1fr 1fr}
  .footer__big{font-size:clamp(3rem,18vw,6rem)}
  .btn-lg .btn__t{padding:18px 20px;font-size:.85rem}.btn-lg .btn__i{width:50px}
  .btn-group .btn{width:100%;justify-content:space-between}.btn-group .btn .btn__t{flex:1}
  .mega{display:none}
}
.prose table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
.prose table thead,.prose table tbody{display:table;width:100%;min-width:560px}
.pick input{width:1px;height:1px;left:0;top:0}
.check-list li{display:block;position:relative;padding-left:34px}
.check-list li::before{position:absolute;left:0;top:2px}
.split__media img,.stack__media img,.gallery img,.post__img img,.hgal__item img,.phero__bg img,.hero__bg img{display:block;max-width:none;width:100%}
.split__media.is-photo{aspect-ratio:4/3.2;min-height:220px}
.phero__kpis b{white-space:nowrap}
.aides__logos{grid-template-columns:repeat(3,1fr)}
.aides__logos img{max-height:56px;max-width:80%}
.gallery.masonry div:nth-child(4n+1) img{object-position:center}

/* ===== v4.3 — vert plus clair, effets bannière et bandeau rétablis, kicker texte ===== */
:root{--green:#2F8F63;--green-2:#3AA574;--lime:#BFE3B4;--lime-2:#A9D69C;--sun:#BFE3B4}
.hero__canvas{display:block;opacity:.55}
.hero__sun{display:block;background:radial-gradient(circle,rgba(191,227,180,.22),rgba(191,227,180,.06) 40%,transparent 68%)}
@media (max-width:900px){.hero__sun{display:none}}
.marquee{background:var(--green);color:var(--cream);transform:rotate(-1.2deg) scale(1.03);margin:-10px 0 -10px;font-weight:800;font-variation-settings:"wdth" 80;letter-spacing:0;font-size:clamp(1.1rem,2vw,1.7rem);padding:18px 0}
.marquee__track span::after{background:var(--cream);width:10px;height:10px}
.hero__kicker{background:transparent;clip-path:none;padding:0 0 0 46px;margin:0 0 28px;position:relative;font-family:var(--display);font-weight:600;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.75);border:0;display:block}
.hero__kicker::before{content:"";position:absolute;left:0;top:50%;width:32px;height:1px;background:var(--lime)}
.eyebrow{color:var(--green)}
.stat:nth-child(even) b{color:var(--green)}
.btn-primary::before{background:var(--green)}
.header .btn-primary::before{background:var(--green)}
.mega__item:hover .mega__lbl{color:var(--green)}
.hero .lead{max-width:520px;margin-bottom:0}
.hero__panel h3{margin-bottom:14px}
.hero .container{align-items:end}
.hero .lead{margin-bottom:0}

/* ===== v4.5 — bannière plus lumineuse, panneau sans dépendance au scroll ===== */
.hero__bg img{opacity:1;object-position:center 60%}
.hero__bg::after{background:linear-gradient(180deg,rgba(15,42,32,.35) 0%,rgba(15,42,32,0) 28%,rgba(15,42,32,.12) 62%,rgba(15,42,32,.9) 100%),linear-gradient(90deg,rgba(15,42,32,.62) 0%,rgba(15,42,32,.22) 42%,transparent 66%)}
.hero h1,.hero .lead,.hero__kicker,.hero__trust,.hero__panel{text-shadow:0 2px 24px rgba(15,42,32,.45)}
.hero__canvas{opacity:.35}
.hero__panel{opacity:0;transform:translateY(24px);animation:heroPanel 1s var(--ease) .5s forwards}
@keyframes heroPanel{to{opacity:1;transform:none}}
.choice{background:rgba(15,42,32,.28);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding:16px 14px;margin-bottom:6px;border-bottom:0;clip-path:var(--chamfer-sm)}
.choice::before{display:none}
.choice:hover{background:rgba(15,42,32,.55)}
.hero__panel{border-top:0;padding-top:0}
.hero__panel p{text-shadow:none}
/* v4.6 — contenu de la bannière remonté */
.hero{align-items:center;min-height:min(100svh,860px);padding-top:calc(var(--header-h) + 24px);padding-bottom:clamp(48px,6vw,80px)}
.hero .container{align-items:center}
.hero__trust{margin-top:28px;padding-top:20px}
.hero .lead{margin-bottom:0}
/* v7.8 : l'ancien « .header{position:sticky;top:0} » a été retiré ici (il écrasait le position:fixed du bloc HEADER) */
/* v4.7 — galerie réalisations : défilement horizontal natif */
.hgal{overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;cursor:grab;padding-bottom:6px}
.hgal::-webkit-scrollbar{display:none}
.hgal.is-drag{cursor:grabbing;scroll-snap-type:none}
.hgal__track{transform:none!important;width:max-content}
.hgal__item,.hgal__end{scroll-snap-align:start}
.hgal__item img{pointer-events:none}
.hgal-section .section-head{margin-bottom:28px}
/* v4.8 — logo sans fond ; header mobile : texte centré */
.logo img{background:transparent;padding:0;clip-path:none;border-radius:0;width:48px;height:48px;object-fit:contain}
.footer .logo img{background:transparent;padding:0;border-radius:0}
@media (max-width:1180px){
  .header .container{position:relative;justify-content:center}
  .header .logo{position:absolute;left:50%;transform:translateX(-50%);gap:0}
  .header .logo img{display:none}
  .header .logo span{display:flex;align-items:center;text-align:center;font-size:1.25rem;font-variation-settings:"wdth" 88;letter-spacing:-.01em}
  .header .logo small{font-size:.6rem;letter-spacing:.2em}
  .header__cta{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%)}
  .header__cta .btn{display:none}
}
@media (max-width:560px){.header .logo span{display:flex;font-size:1.15rem}}
/* v4.9 — bouton clair sous les choix de la bannière */
.hero__cta{margin-top:18px;width:100%;justify-content:space-between;color:var(--dark)}
.hero__cta::before{background:var(--cream)}
.hero__cta .btn__t{flex:1;padding:18px 22px}
.hero__cta .btn__i{background:rgba(15,42,32,.08);border-left-color:rgba(15,42,32,.15)}
.hero__cta:hover .btn__i{background:var(--dark);color:var(--cream)}

/* ===== Page devis ===== */
.devis{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-height:calc(100svh - var(--header-h));padding-top:var(--header-h)}
.devis__side{position:relative;background:var(--dark);color:#fff;padding:clamp(40px,5vw,72px) clamp(24px,4vw,64px);overflow:hidden;isolation:isolate;display:flex;align-items:center}
.devis__side-in{position:relative;z-index:2;max-width:560px}
.devis__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.22;z-index:0}
.devis__side::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,42,32,.2),rgba(15,42,32,.85) 70%);z-index:1}
.devis__side h1{color:#fff;font-size:clamp(2.4rem,4.6vw,4.2rem);margin-bottom:18px}
.devis__side .lead{color:rgba(255,255,255,.8)}
.devis__steps{list-style:none;padding:0;margin:32px 0 0;display:grid;gap:0;border-top:1px solid var(--line-d)}
.devis__steps li{display:grid;grid-template-columns:52px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--line-d);align-items:start}
.devis__steps b{font-family:var(--display);font-weight:800;font-size:1.5rem;color:var(--lime);line-height:1.1}
.devis__steps strong{display:block;font-family:var(--display);font-weight:700;font-size:1.05rem;margin-bottom:2px}
.devis__steps span{font-size:.88rem;color:rgba(255,255,255,.65)}
.devis__contact{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:28px;font-weight:600;font-size:.95rem}
.devis__contact a,.devis__contact span{display:inline-flex;align-items:center;gap:8px}
.devis__contact svg{width:16px;height:16px;color:var(--lime)}
.devis__contact a:hover{color:var(--lime)}
.devis__trust{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:22px;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.6);font-family:var(--display);font-weight:600}
.devis__trust span{display:inline-flex;align-items:center;gap:6px}
.devis__trust svg{width:14px;height:14px;color:var(--lime)}
.devis__main{background:var(--cream);display:flex;align-items:center;justify-content:center;padding:clamp(40px,5vw,72px) clamp(20px,4vw,64px)}
.devis__form{width:min(640px,100%)}
.devis__head{margin-bottom:26px}
.devis__head h2{font-size:clamp(1.9rem,3vw,2.8rem);margin:14px 0 8px}
.devis__head p{color:var(--muted);margin:0;font-size:.92rem}
.devis__form .form{border-left:0;padding-left:0;background:transparent}
.devis__form .form__step h3{font-size:1.6rem}
.devis__form .pick{grid-template-columns:repeat(3,1fr)}
.devis__form .pick label{flex-direction:column;align-items:flex-start;gap:14px;padding:18px 16px;min-height:104px;background:#fff;border-color:transparent;font-size:.95rem}
.devis__form .pick label:hover{border-color:var(--green)}
.devis__form .pick svg{width:26px;height:26px}
.devis__form .field input,.devis__form .field select,.devis__form .field textarea{background:#fff;border:1px solid var(--line);padding:15px 16px;clip-path:var(--chamfer-sm)}
.devis__form .field input:focus,.devis__form .field select:focus,.devis__form .field textarea:focus{border-color:var(--green)}
.devis__form .form__nav .btn{clip-path:var(--chamfer-sm)}
.devis__form .form__progress{margin-bottom:28px}
.devis__form .form__progress i{height:6px}
@media (max-width:1000px){.devis{grid-template-columns:1fr}.devis__side{min-height:0;padding-bottom:48px}.devis__form .pick{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.devis__form .pick{grid-template-columns:1fr 1fr}.devis__form .pick label{min-height:90px;padding:14px}}
/* v5 — vrai logo détouré ; mobile : logo image centré, texte masqué */
.logo img{width:auto;height:46px;object-fit:contain}
.footer .logo img{height:48px;width:auto}
@media (max-width:1180px){
  .header .logo{position:absolute;left:50%;transform:translateX(-50%);gap:0;max-width:calc(100% - 150px);justify-content:center}
  .header .logo img{display:block;height:44px;width:auto}
  .header .logo span{display:none!important}
  .header__cta{right:var(--gutter)}
  .burger{width:58px;height:58px}
}
@media (max-width:560px){.header .logo img{height:40px}}
.mnav__row{display:flex;align-items:center;justify-content:space-between}
.mnav__row .mnav__lbl{flex:1;width:auto}
.mnav__row .mnav__plus{width:56px;justify-content:center;padding:20px 0}
.nav>li:hover .nav__link{box-shadow:inset 0 -2px 0 currentColor}
.logo__light{display:none}
.header.on-dark:not(.is-scrolled) .logo__dark,body.menu-open .logo__dark{display:none}
.header.on-dark:not(.is-scrolled) .logo__light,body.menu-open .logo__light{display:block}
@media (max-width:1180px){.header.on-dark:not(.is-scrolled) .logo__light,body.menu-open .logo__light{display:block;height:44px;width:auto}}
.footer .logo__light{display:block}
.header .logo span{display:none!important}.logo img{height:52px}.header .logo img{height:50px}
.hero{overflow:hidden}.hero__bg img{width:100%}.hero__cta{max-width:100%}
.marquee{transform:rotate(-1.2deg);width:100%;margin-inline:0}@media (max-width:900px){.marquee{transform:none}}
/* fix double logo */
.logo img.logo__light{display:none}
.logo img.logo__dark{display:block}
.header.on-dark:not(.is-scrolled) .logo img.logo__dark,body.menu-open .logo img.logo__dark{display:none}
.header.on-dark:not(.is-scrolled) .logo img.logo__light,body.menu-open .logo img.logo__light{display:block}
.footer .logo img.logo__light{display:block}
/* ===== Simulateur ===== */
.simu .devis__form{width:min(720px,100%)}
.pick--simu{grid-template-columns:repeat(2,1fr)}
.simu__form .pick label{flex-direction:row;align-items:center;min-height:0;padding:14px 16px;gap:12px}
.simu__form .pick svg{width:22px;height:22px}
.simu__result{margin-top:36px;padding:30px;background:var(--dark);color:#fff;clip-path:var(--chamfer)}
.simu__total{display:flex;flex-direction:column;gap:6px;padding-bottom:20px;border-bottom:1px solid var(--line-d);margin-bottom:8px}
.simu__total>span{font-family:var(--display);font-weight:700;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.simu__total b{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 82;font-size:clamp(2.6rem,5vw,4.4rem);line-height:1;color:var(--lime);letter-spacing:-.03em}
.simu__total small{font-size:.85rem;color:rgba(255,255,255,.65)}
.simu__lines{list-style:none;padding:0;margin:0}
.simu__lines li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line-d);font-size:.95rem}
.simu__lines b{font-family:var(--display);white-space:nowrap;color:var(--lime)}
.simu__note{margin:14px 0 0;font-size:.85rem;color:rgba(255,255,255,.7)}
.simu__legal{margin:18px 0 0;font-size:.72rem;color:rgba(255,255,255,.45);line-height:1.5}
.simu__result .btn-link{color:var(--lime)}
.simu__result .btn-primary{color:var(--dark)}.simu__result .btn-primary::before{background:var(--cream)}
@media (max-width:560px){.pick--simu{grid-template-columns:1fr}}
.why .logos{margin-top:56px;border-color:var(--line);background:#fff}
.why .logos div{border-color:var(--line);height:110px;padding:20px 28px}
.why .logos img{max-height:54px;max-width:150px;filter:none;opacity:1}
.why .split__media .badge{background:var(--green);color:#fff}

/* ===== v6 — mêmes effets sur mobile que sur PC ===== */
.page-wrap{overflow-x:clip}
@media (max-width:900px){
  .marquee{transform:rotate(-1.6deg) scale(1.04);margin:-6px 0 -6px}
  .hero__sun{display:block;width:120vw;right:-40vw;top:-10vh;opacity:.9}
  .hero__canvas{opacity:.5}
  [data-reveal="left"]{transform:translateX(-32px)}[data-reveal="right"]{transform:translateX(32px)}
  [data-reveal].is-in{transform:none}
}
/* Menu mobile : apparition en cascade */
.mnav__group,.mnav__ctas,.mnav__meta{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .7s var(--ease)}
body.menu-open .mnav__group,body.menu-open .mnav__ctas,body.menu-open .mnav__meta{opacity:1;transform:none}
body.menu-open .mnav__group:nth-child(1){transition-delay:.25s}body.menu-open .mnav__group:nth-child(2){transition-delay:.31s}body.menu-open .mnav__group:nth-child(3){transition-delay:.37s}body.menu-open .mnav__group:nth-child(4){transition-delay:.43s}body.menu-open .mnav__group:nth-child(5){transition-delay:.49s}body.menu-open .mnav__group:nth-child(6){transition-delay:.55s}body.menu-open .mnav__group:nth-child(7){transition-delay:.61s}
body.menu-open .mnav__ctas{transition-delay:.68s}body.menu-open .mnav__meta{transition-delay:.76s}
/* Tactile : retour visuel à la pression (remplace l'effet magnétique) */
@media (hover:none){
  .btn,.choice,.scard,.faq__q,.mnav__toggle{-webkit-tap-highlight-color:transparent}
  .btn{transition:transform .25s var(--ease)}
  .btn.is-press{transform:scale(.96)}
  .choice.is-press,.scard.is-press,.stack__card.is-press{transform:scale(.985)}
  .btn.is-press .btn__i{background:var(--green)}
  .tilt,.scard,.feature,.testi{transform-style:preserve-3d;will-change:transform}
}
@media (prefers-reduced-motion:reduce){.mnav__group,.mnav__ctas,.mnav__meta{opacity:1;transform:none;transition:none}}

/* ===== v6.1 — logos partenaires responsive (mobile/tablette) ===== */
.why .logos{display:grid;grid-template-columns:repeat(7,1fr);gap:0;border:1px solid var(--line);background:#fff}
.why .logos div{border:0;border-right:1px solid var(--line);height:104px;padding:18px 16px;min-width:0;width:auto;flex:none;display:flex;align-items:center;justify-content:center}
.why .logos div:last-child{border-right:0}
.why .logos img{max-height:46px;max-width:100%;width:auto;height:auto;object-fit:contain}
@media (max-width:1180px){
  .why .logos{grid-template-columns:repeat(4,1fr)}
  .why .logos div{border-bottom:1px solid var(--line);height:96px}
  .why .logos div:nth-child(4n){border-right:0}
  .why .logos div:nth-last-child(-n+3):nth-child(4n+1),.why .logos div:nth-last-child(-n+3):nth-child(4n+1) ~ div{border-bottom:0}
  .why .logos img{max-height:40px}
}
@media (max-width:640px){
  .why .logos{grid-template-columns:repeat(2,1fr);margin-top:36px}
  .why .logos div{height:84px;padding:14px 18px;border-right:1px solid var(--line)}
  .why .logos div:nth-child(4n){border-right:1px solid var(--line)}
  .why .logos div:nth-child(2n){border-right:0}
  .why .logos div:nth-last-child(-n+3){border-bottom:1px solid var(--line)}
  .why .logos div:nth-last-child(-n+2):nth-child(odd),.why .logos div:nth-last-child(-n+2):nth-child(odd) ~ div,.why .logos div:last-child{border-bottom:0}
  .why .logos img{max-height:34px}
}
@media (max-width:640px){.why .logos div:last-child:nth-child(odd){grid-column:1/-1;border-right:0}}
@media (max-width:1180px) and (min-width:641px){.why .logos div:last-child:nth-child(4n+1){grid-column:1/-1;border-right:0}.why .logos div:last-child:nth-child(4n+2){grid-column:2/4;border-right:0}.why .logos div:last-child:nth-child(4n+3){grid-column:3/-1;border-right:0}}

/* ===== v7.5 (20/09/2026) — barre CTA basse retirée : mini-CTA intégrée au header (gauche), cf. .header__mcta / .mcta__btn ===== */

/* ===== v6.5 — flèches de navigation galerie réalisations ===== */
.hgal-wrap{position:relative}
.hgal__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:52px;height:52px;border:1px solid rgba(15,42,32,.25);background:rgba(243,240,232,.92);color:var(--dark);display:grid;place-items:center;cursor:pointer;clip-path:var(--chamfer-sm);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:opacity .4s var(--ease),transform .4s var(--ease),background .3s,color .3s;padding:0}
.hgal__arrow svg{width:22px;height:22px}
.hgal__arrow--prev{left:var(--gutter)}.hgal__arrow--next{right:var(--gutter)}
.hgal__arrow:hover{background:var(--dark);color:var(--cream);border-color:var(--dark)}
.hgal__arrow[disabled]{opacity:.25!important;pointer-events:none}
@media (hover:hover){.hgal__arrow{opacity:0;transform:translateY(-50%) scale(.9)}.hgal-wrap:hover .hgal__arrow,.hgal-wrap:focus-within .hgal__arrow{opacity:1;transform:translateY(-50%) scale(1)}}
@media (max-width:900px){.hgal__arrow{width:44px;height:44px;opacity:1}.hgal__arrow--prev{left:10px}.hgal__arrow--next{right:10px}}

/* ===== v6.6 — Nos solutions : cartes qui s'empilent aussi sur mobile/tablette ===== */
@media (max-width:900px){
  .stack{gap:16px}
  .stack__card{position:sticky;top:calc(var(--header-h) + 10px)!important;min-height:0;max-height:calc(100vh - var(--header-h) - 20px);max-height:calc(100dvh - var(--header-h) - 20px);overflow:hidden}
  .stack__card:nth-child(2){top:calc(var(--header-h) + 26px)!important}
  .stack__card:nth-child(3){top:calc(var(--header-h) + 42px)!important}
  .stack__media{min-height:0;aspect-ratio:16/9;max-height:34vh;max-height:34dvh}
  .stack__media img{position:absolute;inset:0;height:100%}
  .stack__body{padding:22px 22px 26px;gap:12px}
  .stack__body h3{font-size:clamp(1.7rem,7.2vw,2.4rem)}
  .stack__body p{font-size:.95rem}
  .stack__links a{padding:7px 12px;font-size:.8rem}
  .stack::after{content:"";display:block;height:60px}
}

/* ===== v7 — Page Réalisations : galerie éditoriale + lightbox ===== */
.rea-hero{background:var(--cream);padding:calc(var(--header-h) + 28px) 0 0;color:var(--ink)}
.rea-hero__grid{display:grid;grid-template-columns:1.3fr .7fr;gap:48px;align-items:end;padding:28px 0 40px}
.rea-hero h1{font-family:var(--display);font-weight:800;font-variation-settings:"wdth" 78;text-transform:uppercase;font-size:clamp(2.6rem,6.4vw,6rem);line-height:.9;letter-spacing:-.03em;margin:14px 0 20px}
.rea-hero h1 .hl{color:var(--green)}
.rea-hero .lead{max-width:56ch}
.rea-hero__kpis{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);padding-top:18px}
.rea-hero__kpis div{padding:6px 18px 6px 0}
.rea-hero__kpis b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(1.6rem,2.6vw,2.4rem);letter-spacing:-.03em;line-height:1;color:var(--dark)}
.rea-hero__kpis b:nth-child(odd){color:var(--green)}
.rea-hero__kpis span{display:block;font-size:.78rem;color:var(--muted);margin-top:6px}
.rea-filters{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.rea-filter{appearance:none;background:transparent;border:0;border-right:1px solid var(--line);padding:18px 22px;font-family:var(--display);font-weight:700;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);cursor:pointer;display:inline-flex;align-items:center;gap:10px;white-space:nowrap;transition:color .3s,background .3s;position:relative}
.rea-filter i{font-style:normal;font-family:var(--body);font-weight:500;font-size:.72rem;letter-spacing:0;color:var(--muted);opacity:.7}
.rea-filter::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.rea-filter:hover{color:var(--dark)}
.rea-filter.is-active{color:var(--dark)}.rea-filter.is-active::after{transform:scaleX(1)}.rea-filter.is-active i{color:var(--green);opacity:1}
.rea-filter:last-child{border-right:0}

.rea{padding:40px 0 clamp(64px,8vw,120px);background:var(--cream)}
.rea-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,17vw,250px);grid-auto-flow:dense;gap:14px}
.rea-item{position:relative;margin:0;overflow:hidden;cursor:zoom-in;clip-path:var(--chamfer);background:var(--cream-3);opacity:0;transform:translateY(34px) scale(.98);transition:opacity .9s var(--ease),transform 1s var(--ease);outline:0}
.rea-item.is-in{opacity:1;transform:none}
.rea-item.is-hidden{display:none}
.rea-item.is-tall{grid-row:span 2}
.rea-item.is-wide{grid-column:span 2}
.rea-item__media{position:absolute;inset:0}
.rea-item__media img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.001);transition:transform 1.6s var(--ease),filter .8s}
.rea-item::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,31,23,.85) 0%,rgba(10,31,23,.35) 40%,transparent 70%);opacity:0;transition:opacity .6s var(--ease);z-index:1}
.rea-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:18px 20px;color:#fff;z-index:2;display:grid;gap:4px;transform:translateY(14px);opacity:0;transition:transform .7s var(--ease),opacity .6s var(--ease)}
.rea-item__cat{font-family:var(--display);font-weight:700;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--lime)}
.rea-item figcaption strong{font-family:var(--display);font-weight:700;font-size:1rem;line-height:1.2;letter-spacing:-.01em}
.rea-item__where{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:rgba(255,255,255,.75)}
.rea-item__where svg{width:13px;height:13px}
.rea-item__num{position:absolute;top:14px;left:16px;z-index:2;font-family:var(--display);font-weight:700;font-size:.7rem;letter-spacing:.2em;color:#fff;opacity:0;transition:opacity .6s;text-shadow:0 1px 8px rgba(0,0,0,.5)}
.rea-item:hover img,.rea-item:focus-visible img{transform:scale(1.06)}
.rea-item:hover::before,.rea-item:focus-visible::before{opacity:1}
.rea-item:hover figcaption,.rea-item:focus-visible figcaption,.rea-item:hover .rea-item__num,.rea-item:focus-visible .rea-item__num{opacity:1;transform:none}
@media (hover:none){.rea-item::before{opacity:1;background:linear-gradient(to top,rgba(10,31,23,.8) 0%,rgba(10,31,23,.2) 45%,transparent 70%)}.rea-item figcaption{opacity:1;transform:none;padding:14px 16px}.rea-item figcaption strong{font-size:.88rem}.rea-item__num{opacity:1}}
.rea-empty{text-align:center;color:var(--muted);padding:60px 0}
@media (max-width:1180px){.rea-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:clamp(150px,22vw,240px)}}
@media (max-width:900px){.rea-hero__grid{grid-template-columns:1fr;gap:24px;padding:20px 0 28px}.rea-hero__kpis{grid-template-columns:repeat(3,1fr)}.rea-filters{flex-wrap:nowrap;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter)}.rea-filter{padding:15px 16px;font-size:.68rem}}
@media (max-width:640px){.rea-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:42vw;gap:8px}.rea-item.is-wide{grid-column:span 2}.rea-item{clip-path:var(--chamfer-sm)}.rea{padding-top:24px}}

.rea-cta__inner{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.rea-cta h2{color:#fff;margin:12px 0 16px}.rea-cta .hl{color:var(--lime)}.rea-cta .lead{color:rgba(255,255,255,.75)}
.rea-cta .btn-group{justify-content:flex-end}
@media (max-width:900px){.rea-cta__inner{grid-template-columns:1fr}.rea-cta .btn-group{justify-content:flex-start}}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility 0s .5s}
.lightbox.is-open{opacity:1;visibility:visible;transition:opacity .5s var(--ease)}
.lightbox__bg{position:absolute;inset:0;background:rgba(10,31,23,.96);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.lightbox__fig{position:relative;margin:0;width:min(92vw,1240px);max-height:92vh;display:flex;flex-direction:column;gap:16px;transform:scale(.96);transition:transform .6s var(--ease)}
.lightbox.is-open .lightbox__fig{transform:none}
.lightbox__frame{position:relative;max-height:calc(92vh - 80px);display:flex;justify-content:center;clip-path:var(--chamfer)}
.lightbox__frame img{max-width:100%;max-height:calc(92vh - 80px);object-fit:contain;display:block;background:#0a1f17;transition:opacity .35s,transform .5s var(--ease)}
.lightbox__frame img.is-loading{opacity:.2}
.lightbox.slide-l .lightbox__frame img{animation:lbL .55s var(--ease)}.lightbox.slide-r .lightbox__frame img{animation:lbR .55s var(--ease)}
@keyframes lbL{from{transform:translateX(40px);opacity:0}to{transform:none;opacity:1}}@keyframes lbR{from{transform:translateX(-40px);opacity:0}to{transform:none;opacity:1}}
.lightbox__cap{display:flex;align-items:baseline;gap:18px;color:#fff;font-size:.9rem;flex-wrap:wrap}
.lightbox__count{font-family:var(--display);font-weight:700;font-size:.72rem;letter-spacing:.2em;color:var(--lime)}
.lightbox__cap strong{font-family:var(--display);font-weight:700;font-size:1.05rem}
.lightbox__cap span:last-child{color:rgba(255,255,255,.6)}
.lightbox__close,.lightbox__nav{position:absolute;z-index:3;width:56px;height:56px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.06);color:#fff;display:grid;place-items:center;cursor:pointer;clip-path:var(--chamfer-sm);transition:background .3s,color .3s,border-color .3s;padding:0}
.lightbox__close svg,.lightbox__nav svg{width:22px;height:22px}
.lightbox__close{top:22px;right:22px}
.lightbox__nav{top:50%;transform:translateY(-50%)}.lightbox__nav--prev{left:22px}.lightbox__nav--next{right:22px}
.lightbox__close:hover,.lightbox__nav:hover{background:var(--lime);color:var(--dark);border-color:var(--lime)}
body.lb-open{overflow:hidden}
@media (max-width:900px){.lightbox__nav{width:46px;height:46px;top:auto;bottom:18px;transform:none}.lightbox__nav--prev{left:18px}.lightbox__nav--next{right:18px}.lightbox__close{width:46px;height:46px;top:14px;right:14px}.lightbox__fig{width:100vw;padding:0 12px;max-height:none}.lightbox__frame,.lightbox__frame img{max-height:66vh}.lightbox__cap{padding-bottom:70px}}

/* ===== v7.1 — galeries homogènes : même format 4/5 partout ===== */
.hgal__item,.hgal__item.is-wide{width:clamp(250px,24vw,360px);aspect-ratio:4/5}
.hgal__end{width:clamp(250px,24vw,360px);aspect-ratio:4/5}
@media (max-width:900px){.hgal__item,.hgal__item.is-wide{width:66vw}.hgal__end{width:66vw}}
.rea-grid{grid-template-columns:repeat(4,1fr);grid-auto-rows:auto;gap:16px}
.rea-item,.rea-item.is-tall,.rea-item.is-wide{grid-row:auto;grid-column:auto;aspect-ratio:4/5}
@media (max-width:1180px){.rea-grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:auto}}
@media (max-width:640px){.rea-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:auto;gap:10px}.rea-item.is-wide{grid-column:auto}}

/* ===== v7.2 — Nos solutions : responsive robuste ===== */
@media (max-width:900px){
  .stack__card{grid-template-columns:1fr;grid-template-rows:auto auto;max-height:none;overflow:hidden}
  .stack__media{width:100%;aspect-ratio:auto;height:clamp(200px,32dvh,320px);max-height:none;min-height:0;position:relative}
  .stack__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .stack__body{padding:22px 22px 28px}
}
@media (min-width:901px) and (max-width:1180px){
  .stack__card{min-height:0}
  .stack__body{padding:32px}
  .stack__body h3{font-size:clamp(1.8rem,3.4vw,2.6rem)}
  .stack__body p{font-size:.96rem}
}
/* Écrans trop bas pour empiler proprement : défilement normal, sans chevauchement */
@media (max-height:640px){
  .stack__card,.stack__card:nth-child(2),.stack__card:nth-child(3){position:relative!important;top:auto!important;max-height:none}
  .stack::after{display:none}
}
@media (max-width:900px) and (max-height:760px){
  .stack__media{height:clamp(160px,26dvh,240px)}
}

/* ===== v7.3 — carrousel : carte finale centrée ===== */
.hgal__end{justify-content:center;align-items:center;text-align:center;gap:18px;padding:28px}
.hgal__end b{font-size:clamp(1.9rem,2.6vw,2.6rem)}
.hgal__end .btn-link{justify-content:center}

/* ===== v7.4 — menu mobile : bouton de fermeture (croix) ===== */
.mnav__close{
  position:absolute;
  top:calc((var(--header-h) - 46px) / 2);
  right:var(--gutter);
  width:46px;height:46px;
  display:none;place-items:center;
  background:var(--lime);color:var(--dark);
  clip-path:var(--chamfer-sm);
  border:0;cursor:pointer;
  z-index:5;
  opacity:0;transform:translateY(-8px);
  transition:opacity .35s var(--ease),transform .35s var(--ease),background .25s;
  -webkit-tap-highlight-color:transparent;
}
.mnav__close svg{width:22px;height:22px;stroke-width:2.4}
.mnav__close:hover,.mnav__close:focus-visible{background:#fff}
body.menu-open .mnav__close{display:grid;opacity:1;transform:none;transition-delay:.18s}
/* la croix du menu remplace le burger du header pendant l'ouverture */
body.menu-open .burger{display:none!important}
@media (max-width:560px){.mnav__close{width:42px;height:42px;top:calc((var(--header-h) - 42px) / 2)}}
/* v7.4b — le header ne doit pas intercepter le clic sur la croix (il est au-dessus du menu) */
body.menu-open .header,
body.menu-open .header .container,
body.menu-open .header__cta{pointer-events:none}
body.menu-open .logo{pointer-events:auto}
/* v8.4 (28/09) — menu mobile ouvert : le logo (version claire) reste affiché dans le header FIXE, au-dessus du
   menu ; il ne défile pas avec le contenu du menu (qui défile dans .mnav). Le header reste cliquable sur le logo. */
@media (max-width:1180px){body.menu-open .header .logo{display:flex}}
/* Bandeau sombre fixe en haut du menu (même hauteur que le header + marge) : les entrées du menu défilent
   dessous et disparaissent derrière lui, le logo (header) et la croix restent en place.
   position:fixed dans .mnav (qui a un transform) = calé sur la boîte du menu, ne défile pas. */
.mnav::before{content:"";position:absolute;top:0;left:0;right:0;height:calc(var(--header-h) + 14px);background:var(--dark);z-index:2;pointer-events:auto}
/* header transparent pendant l'ouverture : la croix reste lisible sur le fond sombre */
/* v8.3 : menu ouvert → le header reste transparent à l'œil (fond crème ::before éteint), mais sa
   background-color (clip:text, invisible) passe au sombre pour que Safari iOS 26 peigne la bande
   de la couleur du menu s'il relit la page. Pas de raccourci « background: » ici (garder clip:text). */
body.menu-open .header{background-color:var(--dark);box-shadow:none}
body.menu-open .header::before{opacity:0}

/* ===== v8.3b — très petits écrans (≤ 360 px : Galaxy Z Fold fermé, vieux Android 320 px) =====
   Sur ces largeurs, tel/€ (2×42 + 8) + logo centré (≈86 px) + burger 58 px ne tiennent plus : on réduit
   légèrement les trois. Aucun effet à partir de 375 px (iPhone SE et plus). */
@media (max-width:360px){
  .header__mcta{gap:6px}
  .mcta__btn{width:38px;height:38px}
  .mcta__btn svg{width:16px;height:16px}
  .burger{width:52px;height:52px}
  .header .logo img{height:36px!important}
  .header .logo{max-width:calc(100% - 2*var(--gutter) - 82px - 52px - 24px)}
}
/* v8.6 — le contenu du header est calé en absolu sur toute la boîte (le padding-top ne doit pas le décaler) */
/* « > » indispensable : le mega-menu contient lui aussi un .container (bug v27 : sous-menus PC écrasés à 1 px) */
.header > .container{position:absolute;top:0;bottom:0;left:0;right:0;height:auto}

/* ===== v8.7 (28/09/2026) — PERFORMANCE MOBILE / SAFARI iOS =====
   Vidéo du client : après descente → retour en haut → redescente, Safari iOS cesse de dessiner la page
   (zone vert sombre vide) et la page se fige. Cause : trop de calques GPU coûteux recalculés en continu
   (13 flous backdrop-filter dont certains au-dessus du canvas animé, soleil flouté animé, canvas en
   mix-blend-mode, cartes en 3D will-change, parallaxe). Chrome encaisse, Safari abandonne le rendu.
   Sur tactile / ≤ 1180 px : mêmes couleurs, sans ces effets. NE PAS réintroduire de backdrop-filter,
   de filter animé ni de will-change sur mobile. */
@media (hover:none),(max-width:1180px){
  *,*::before,*::after{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
  .hero__sun{animation:none;filter:none;opacity:.7}
  .hero__canvas{mix-blend-mode:normal;opacity:.55}
  .marquee__track,.hgal__track{will-change:auto}
  .tilt,.scard,.feature,.testi{transform-style:flat;will-change:auto;transform:none!important}
  /* compensation visuelle des flous retirés : fonds un peu plus opaques */
  .choice{background:rgba(15,42,32,.42)}
  .btn-outline{background:rgba(15,42,32,.35)}
  .scard__tag{background:rgba(10,31,23,.6)}
  .phero__kpis div{background:rgba(15,42,32,.55)}
  .hgal__arrow{background:rgba(243,240,232,.96)}
}
/* v8.8b — le mega-menu se positionne désormais par rapport à .header > .container (absolu, centré) :
   on le ré-étire sur toute la largeur de l'écran comme avant la v27. */
.header > .container .mega{left:calc(50% - 50vw);right:calc(50% - 50vw)}

/* ===== v9.0 (29/09/2026) — SCHÉMAS EXPLICATIFS (SVG inline, ecosmart-src/schemas.py) =====
   Carte crème chanfreinée : en-tête, dessin, clé des flux, légende numérotée (lisible sur mobile).
   Animations : couches qui se posent (.sch-step), pastilles (.sch-pin) à l'entrée dans l'écran ;
   flux (.sch-flow), ventilateurs, vapeurs : SEULEMENT quand le schéma est visible (.is-live, main.js). */
.split__media.is-svg{aspect-ratio:auto;background:none;clip-path:none;border-radius:0;overflow:visible;padding:0}
.schema{margin:0;background:var(--cream-2);clip-path:var(--chamfer);padding:clamp(16px,2.4vw,26px);display:flex;flex-direction:column;gap:14px}
.bg-2 .schema{background:#fff}
.schema__head{display:flex;justify-content:space-between;align-items:center;gap:12px;font-family:var(--display);font-weight:700;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--green)}
.schema__head span:first-child{display:inline-flex;align-items:center;gap:10px}
.schema__head span:first-child::before{content:"";width:22px;height:2px;background:currentColor}
.schema__head span:last-child{color:var(--muted);letter-spacing:.08em;text-transform:none;font-weight:600;font-size:.8rem;text-align:right}
.schema__canvas{background:var(--cream);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%)}
.bg-2 .schema__canvas{background:var(--cream)}
.schema svg{display:block;width:100%;height:auto;overflow:visible}
.schema__key{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:.78rem;color:var(--muted);font-weight:500}
.schema__key span{display:inline-flex;align-items:center;gap:8px}
.schema__key i{display:inline-block;width:22px;height:4px;border-radius:2px}
.schema__key .k-hot{background:#3AA574}.schema__key .k-cold{background:#9CCB8E}.schema__key .k-gas{height:6px;background:repeating-linear-gradient(90deg,#BFE3B4 0 4px,transparent 4px 8px) center/100% 2px no-repeat,#0F2A20}
.schema__legend{list-style:none;margin:0;padding:14px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 22px;counter-reset:none}
.schema__legend li{display:flex;gap:11px;align-items:flex-start;font-size:.86rem;line-height:1.4;color:var(--ink-2);margin:0}
.schema__legend b{display:block;color:var(--ink);font-family:var(--display);font-weight:700;font-size:.93rem;letter-spacing:-.01em;margin-bottom:1px}
.schema__n{flex:none;width:26px;height:26px;display:grid;place-items:center;background:var(--dark);color:var(--cream);font-family:var(--display);font-weight:800;font-size:.8rem;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%);margin-top:1px}
@media (max-width:560px){.schema__legend{grid-template-columns:1fr;gap:10px}.schema__head{flex-direction:column;align-items:flex-start;gap:4px}.schema__head span:last-child{text-align:left}}
/* animations */
/* (pas de transform CSS sur .sch-pin : il écraserait l'attribut transform SVG qui les positionne) */
.schema .sch-step,.schema .sch-pin{opacity:0;transition:opacity .7s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0s)}
.schema .sch-step{transform:translateY(10px);transform-box:fill-box}
.schema.is-in .sch-pin{opacity:1}
.schema.is-in .sch-step{opacity:1;transform:none}
.schema .sch-flow{stroke-dasharray:7 9;animation:schFlow 1.4s linear infinite;animation-play-state:paused}
.schema .sch-flow.sch-rev{animation-direction:normal}
.schema .sch-spin{animation:schSpin 2.4s linear infinite;animation-play-state:paused}
.schema .sch-rise{animation:schRise 2.2s ease-in-out infinite;animation-delay:var(--d,0s);animation-play-state:paused;opacity:.9}
.schema .sch-drop{animation:schDrop 1.1s linear infinite;animation-delay:var(--d,0s);animation-play-state:paused}
.schema .sch-charge{animation:schCharge 3.2s ease-in-out infinite;animation-delay:var(--d,0s);animation-play-state:paused}
.schema.is-live .sch-flow,.schema.is-live .sch-spin,.schema.is-live .sch-rise,.schema.is-live .sch-drop,.schema.is-live .sch-charge{animation-play-state:running}
@keyframes schFlow{to{stroke-dashoffset:-32}}
@keyframes schSpin{to{transform:rotate(360deg)}}
@keyframes schRise{0%{opacity:0;transform:translateY(6px)}40%{opacity:.9}100%{opacity:0;transform:translateY(-10px)}}
@keyframes schDrop{0%{opacity:0;transform:translateY(-4px)}30%{opacity:1}100%{opacity:0;transform:translateY(10px)}}
@keyframes schCharge{0%,15%{opacity:.18}45%,85%{opacity:1}100%{opacity:.18}}
@media (prefers-reduced-motion:reduce){.schema .sch-step{opacity:1;transform:none;transition:none}.schema .sch-pin{opacity:1;transition:none}.schema .sch-flow,.schema .sch-spin,.schema .sch-rise,.schema .sch-drop,.schema .sch-charge{animation:none;stroke-dasharray:none}}
.no-js .schema .sch-step{opacity:1;transform:none}.no-js .schema .sch-pin{opacity:1}
/* duo de photos (doublage / soufflage) */
.split__media.is-duo{aspect-ratio:auto;background:none;clip-path:none;overflow:visible;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.duo__item{position:relative;margin:0;clip-path:var(--chamfer);background:var(--cream-3);aspect-ratio:4/5;overflow:hidden}
.duo__item img{width:100%;height:100%;object-fit:cover}
.duo__item figcaption{position:absolute;left:0;bottom:0;background:var(--dark);color:#fff;padding:12px 16px;font-family:var(--display);font-weight:800;font-size:1rem;line-height:1.1;clip-path:var(--chamfer-sm)}
.duo__item figcaption small{display:block;font-family:var(--body);font-weight:500;font-size:.72rem;color:var(--lime);margin-top:4px}
@media (max-width:420px){.split__media.is-duo{gap:8px}.duo__item figcaption{padding:10px 12px;font-size:.88rem}}
/* v9.1 — bascule « Schéma / En vrai » : photo originale (matériaux réels) ou matériel posé, mêmes numéros */
.schema__tabs{display:inline-flex;gap:2px;padding:3px;background:var(--cream);clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%);flex:none}
.schema__tabs button{font-family:var(--display);font-weight:700;font-size:.74rem;letter-spacing:.02em;text-transform:none;padding:7px 12px;color:var(--ink-2);background:transparent;border:0;cursor:pointer;transition:background .25s,color .25s;white-space:nowrap}
.schema__tabs button:hover{color:var(--ink)}
.schema__tabs button.is-on{background:var(--dark);color:var(--cream)}
.schema__view[hidden]{display:none!important}
.schema__shot{position:relative}
.schema__shot img{display:block}
.schema__view--photo .schema__shot img{width:100%;height:auto}
.schema__view--product{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:28px 20px 16px;min-height:clamp(300px,34vw,440px)}
.schema__view--product .schema__shot{display:inline-block;max-width:78%}
.schema__view--product .schema__shot img{max-height:clamp(220px,26vw,340px);width:auto;max-width:100%;height:auto}
.schema__pin{position:absolute;transform:translate(-50%,-50%);width:28px;height:28px;display:grid;place-items:center;background:var(--dark);color:var(--cream);font-family:var(--display);font-weight:800;font-size:.84rem;clip-path:polygon(0 0,calc(100% - 7px) 0,100% 7px,100% 100%,0 100%);z-index:2}
.schema__chip{position:absolute;transform:translate(-50%,-50%);background:rgba(243,240,232,.94);color:var(--dark);font-family:var(--display);font-weight:700;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;padding:5px 9px;white-space:nowrap;z-index:2}
.schema__cap{display:block;font-size:.76rem;color:var(--muted);padding:10px 14px 12px;line-height:1.4}
.schema__view--product .schema__cap{padding:0;text-align:center}
.schema.show-alt .schema__key{display:none}
@media (max-width:560px){.schema__pin{width:24px;height:24px;font-size:.74rem}.schema__chip{font-size:.6rem;padding:4px 7px}.schema__tabs button{padding:6px 10px;font-size:.7rem}}
/* photo produit détourée (ex. micro-onduleur) dans une carte crème */
.split__media.is-product{aspect-ratio:auto;background:none;clip-path:none;overflow:visible}
.product-card{margin:0;background:var(--cream-2);clip-path:var(--chamfer);padding:clamp(24px,4vw,44px) clamp(20px,3vw,36px) 22px;display:flex;flex-direction:column;align-items:center;gap:18px;background-image:radial-gradient(circle at 50% 42%,#fff 0,rgba(255,255,255,0) 62%)}
.product-card img{max-height:clamp(240px,28vw,380px);width:auto;max-width:80%;height:auto}
.product-card figcaption{align-self:stretch;border-top:1px solid var(--line);padding-top:14px;font-size:.86rem;color:var(--ink-2);line-height:1.4}
.product-card figcaption b{display:block;font-family:var(--display);font-weight:700;color:var(--ink);font-size:.98rem;margin-bottom:2px}
.bg-2 .product-card{background-color:#fff}
.split__media img[src*="destrat-solutions"]{object-position:8% 20%}