/* ===== GEIST (validé user 2026-07-18) — titres SemiBold · corps 400/500. Les poids 300-500 des
   titres (var --serif) sont remappés sur la graisse 600 via la plage font-weight, zéro sweep.
   REVERT Stiebel: décommenter les 3 faces ci-dessous + re-swap les vars --serif/--sans. */
/* @font-face{font-display:swap;font-family:'F2FOCR';font-style:normal;font-weight:300 500;src:url(../fonts/F2F-regular.woff2) format('woff2')}
@font-face{font-display:swap;font-family:'STEInfoText';font-style:normal;font-weight:400 500;src:url(../fonts/STEInfoText-normal.woff2) format('woff2')}
@font-face{font-display:swap;font-family:'STEInfoText';font-style:normal;font-weight:600 800;src:url(../fonts/STEInfoText-bold.woff2) format('woff2')} */
@font-face{font-display:swap;font-family:'GeistTitre';font-style:normal;font-weight:600;src:url(../fonts/Geist-600.woff2) format('woff2')}
@font-face{font-display:swap;font-family:'GeistTitre';font-style:normal;font-weight:700 900;src:url(../fonts/Geist-700.woff2) format('woff2')}
@font-face{font-display:swap;font-family:'Geist';font-style:normal;font-weight:400;src:url(../fonts/Geist-400.woff2) format('woff2')}
@font-face{font-display:swap;font-family:'Geist';font-style:normal;font-weight:401 500;src:url(../fonts/Geist-500.woff2) format('woff2')}
@font-face{font-display:swap;font-family:'Geist';font-style:normal;font-weight:501 650;src:url(../fonts/Geist-600.woff2) format('woff2')}
@font-face{font-display:swap;font-family:'Geist';font-style:normal;font-weight:651 900;src:url(../fonts/Geist-700.woff2) format('woff2')}
:root{
  --paper:#fff;--paper2:#F7F5F1;--paper3:#F1EEE7;
  --ink:#141414;--ink2:#5b5b54;--ink3:#8a8a82;--line:#E9E6DF;
  --red:#BA0C2F;--red-deep:#8F0A24;--green:#55702F;--green-deep:#3E5322;
  /* Historique typo — v1: --serif:'Fraunces',Georgia,serif;--sans:'Inter',system-ui,sans-serif;
     v2 Stiebel: --serif:'F2FOCR',Verdana,sans-serif;--sans:'STEInfoText',Verdana,sans-serif; */
  --serif:'GeistTitre','Geist',system-ui,sans-serif;--sans:'Geist',system-ui,sans-serif;
  --maxw:1280px;--navh:70px;--ease:cubic-bezier(.22,1,.36,1);--shadow:0 30px 70px -40px rgba(20,20,15,.5);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip;font-size:17px}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:clip}
body.lock{overflow:hidden}
a{color:inherit;text-decoration:none}img,video{display:block;max-width:100%}
.eico{width:1.05em;height:1.05em;vertical-align:-0.15em;display:inline-block;flex:none}
.eyebrow{font-size:.68rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--red);display:flex;align-items:center;gap:9px}
.eyebrow::before{content:"";width:26px;height:1.5px;background:var(--red)}

/* ===== INTRO ===== */
#intro{position:fixed;inset:0;z-index:9999;background:#fff;display:flex;align-items:center;justify-content:center}
#intro .wrap{position:relative;display:flex;flex-direction:column;align-items:center;width:min(360px,66vw)}
#intro img{width:100%;opacity:0;transform:scale(.92);filter:blur(7px)}
#intro .line{position:absolute;left:0;bottom:-14px;height:2px;width:0;background:var(--red)}

/* ===== NAV (transparent over hero → white on scroll) ===== */
.header{position:fixed;top:0;left:0;right:0;z-index:200}
.header::before{content:"";position:absolute;top:0;left:0;right:0;height:120px;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,12,6,.42),rgba(8,12,6,0));opacity:1;transition:opacity .45s}
.header.scrolled::before,.header.mega-open::before{opacity:0}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;height:var(--navh);
  padding:0 clamp(16px,4vw,44px);background:transparent;border-bottom:1px solid transparent;
  transition:background .45s,border-color .45s,box-shadow .45s}
.header.scrolled .nav,.header.mega-open .nav{background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-color:var(--line);box-shadow:0 8px 30px -22px rgba(20,20,15,.4)}
.nav__logo{height:30px}
.header:not(.scrolled):not(.mega-open) .nav__logo{filter:brightness(0) invert(1)}
.nav__items{display:flex;align-items:center;gap:2px;height:100%}
.nav__item{position:relative;height:100%;display:flex;align-items:center}
.nav__item>button,.nav__item>a{font-family:var(--sans);font-size:.9rem;font-weight:450;color:rgba(255,255,255,.92);background:none;border:0;cursor:pointer;
  padding:10px 13px;border-radius:9px;display:flex;align-items:center;gap:6px;height:42px;transition:color .3s,background .3s}
.nav__item>button:hover,.nav__item>a:hover,.nav__item.active>button,.nav__item.active>a{color:#fff;background:rgba(255,255,255,.15)}
.header.scrolled .nav__item>button,.header.scrolled .nav__item>a,.header.mega-open .nav__item>button,.header.mega-open .nav__item>a{color:#33332e}
.header.scrolled .nav__item>button:hover,.header.scrolled .nav__item>a:hover,.header.scrolled .nav__item.active>button,.header.scrolled .nav__item.active>a,.header.mega-open .nav__item>button:hover,.header.mega-open .nav__item>a:hover,.header.mega-open .nav__item.active>button,.header.mega-open .nav__item.active>a{color:var(--ink);background:var(--paper2)}
.nav__item>button svg,.nav__item>a svg{width:10px;height:10px;opacity:.6;transition:transform .25s}
.nav__item.active>button svg,.nav__item.active>a svg{transform:rotate(180deg)}
.nav__right{display:flex;align-items:center;gap:13px}
.pro{font-size:.82rem;font-weight:500;color:#fff;display:flex;align-items:center;gap:5px;transition:color .3s}
.header.scrolled .pro,.header.mega-open .pro{color:#33332e}.pro:hover{color:var(--red)!important}
/* compte : Espace Client / Espace Pro */
.account{position:relative}
.account__btn{display:flex;align-items:center;gap:6px;background:none;border:0;cursor:pointer;font:500 .82rem var(--sans);color:#fff;padding:6px 2px;transition:color .3s}
.header.scrolled .account__btn,.header.mega-open .account__btn{color:#33332e}
.account__btn:hover{color:var(--red)!important}
.account__panel{position:absolute;top:calc(100% + 10px);right:0;min-width:280px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 70px -30px rgba(0,0,0,.35);padding:8px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.28s var(--ease);z-index:60}
.account:hover .account__panel,.account:focus-within .account__panel{opacity:1;visibility:visible;transform:none}
.account__panel::before{content:"";position:absolute;top:-12px;left:0;right:0;height:12px}
.account__panel a{display:block;padding:13px 15px;border-radius:11px;transition:background .25s}
.account__panel a:hover{background:var(--paper2)}
.account__panel b{display:block;font-size:.92rem;color:var(--ink);font-weight:600}
.account__panel b::after{content:"→";float:right;color:var(--red);opacity:0;transition:.25s}
.account__panel a:hover b::after{opacity:1}
.account__panel span{display:block;font-size:.78rem;color:var(--ink3);margin-top:2px}
.drawer__login{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 4px}
.drawer__login a{display:flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);border-radius:12px;padding:12px;font-size:.88rem;font-weight:600;color:var(--ink)}
@media(max-width:1230px){.account__btn span{display:none}}
.lang{display:flex;gap:2px;font-size:.72rem;font-weight:600;color:rgba(255,255,255,.75);border:1px solid rgba(255,255,255,.4);border-radius:100px;padding:4px;transition:.3s}
.lang b{color:#111;background:#fff;border-radius:100px;padding:2px 7px}.lang span{padding:2px 6px;cursor:pointer}
.header.scrolled .lang,.header.mega-open .lang{color:var(--ink3);border-color:var(--line)}
.btn-devis{background:#55702F;color:#fff;font-size:.84rem;font-weight:600;padding:.62em 1.25em;border-radius:100px;transition:background .3s}
.btn-devis:hover{background:#465d26}
.nav-pin{display:inline-flex;align-items:center;gap:6px;font:600 .78rem var(--sans);color:rgba(255,255,255,.92);padding:6px 10px;border:1px solid rgba(255,255,255,.35);border-radius:100px;transition:.3s}
.nav-pin svg{width:14px;height:14px}
.nav-pin:hover{background:rgba(255,255,255,.14)}
.header.scrolled .nav-pin,.header.mega-open .nav-pin{color:var(--ink);border-color:var(--line)}
.header.scrolled .nav-pin:hover,.header.mega-open .nav-pin:hover{background:var(--paper2)}
.nav.scrolled .nav-pin, body.subpage .nav-pin{color:var(--ink2);border-color:var(--line)}
.nav.scrolled .nav-pin:hover, body.subpage .nav-pin:hover{background:var(--paper2)}
@media(max-width:1520px){.nav-pin span{display:none}}
@media(max-width:640px){.nav-pin{display:none}}
.burger{display:none;flex-direction:column;gap:5px;width:26px;background:none;border:0;cursor:pointer;padding:4px}
.burger span{height:2px;width:100%;background:#fff;border-radius:2px;transition:.3s}
.header.scrolled .burger span,.header.mega-open .burger span{background:var(--ink)}

/* ===== MEGA (Figma-grade) ===== */
.mega-dim{position:fixed;inset:0;z-index:150;background:rgba(15,14,10,.32);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .35s ease}
.mega-dim.on{opacity:1}
.mega-stage{position:absolute;left:0;right:0;top:var(--navh);pointer-events:none}
.mega{display:none;pointer-events:auto;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 40px 80px -40px rgba(20,20,15,.35);border-radius:0 0 26px 26px}
.mega.show{display:block;animation:drop .4s var(--ease)}
@keyframes drop{from{opacity:0;transform:translateY(-12px) scale(.995)}to{opacity:1;transform:none}}
.mega__in{max-width:var(--maxw);margin:0 auto;padding:38px clamp(16px,4vw,44px) 8px}
.top{display:grid;gap:30px}
.mega.show .col,.mega.show .feat{animation:colin .5s var(--ease) both}
.mega.show .col:nth-child(2){animation-delay:.05s}.mega.show .col:nth-child(3){animation-delay:.1s}
.mega.show .col:nth-child(4){animation-delay:.15s}.mega.show .feat{animation-delay:.18s}
@keyframes colin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.col h4{font-size:.66rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--ink3);margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.col.men h4{color:var(--green)}.col.sti h4{color:var(--red)}
.col ul{list-style:none;display:grid;gap:2px}
.col li a{display:flex;align-items:baseline;gap:9px;padding:8px 10px;margin-left:-10px;border-radius:10px;font-size:.92rem;font-weight:450;color:#3a3a34;transition:background .2s,color .2s;position:relative}
.col li a:hover{background:var(--paper2);color:var(--ink)}
.col li a .dot{width:5px;height:5px;border-radius:50%;background:var(--red);opacity:.5;flex:none;transform:translateY(-2px);transition:transform .25s,opacity .25s}
.col li a:hover .dot{opacity:1;transform:translateY(-2px) scale(1.5)}
.col.men li a .dot{background:var(--green)}
.col li a .mini{display:block;font-size:.7rem;color:var(--ink3);font-style:normal;font-weight:400;margin-top:1px}
.col li a em.mini{margin-left:2px}
/* featured card */
.feat{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:var(--paper2);border:1px solid var(--line);min-height:230px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .3s}
.feat:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:transparent}
.feat__im{display:block;height:140px;overflow:hidden;background:#fff}
.feat__im img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.feat:hover .feat__im img{transform:scale(1.06)}
.feat__b{display:flex;flex-direction:column;gap:5px;padding:15px 17px 17px}
.feat__b .k{font-size:.62rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--red)}
.feat__b .t{font-family:var(--serif);font-weight:600;font-size:1.12rem;line-height:1.15;color:var(--ink)}
.feat__b .mini2{font-size:.8rem;color:var(--ink2);line-height:1.45}
.feat__b .go{font-size:.82rem;font-weight:600;color:var(--red);margin-top:3px;transition:gap .25s;display:inline-flex;gap:6px}
.feat:hover .feat__b .go{gap:10px}
.feat--tool{justify-content:center;background:linear-gradient(150deg,#FDF3F5,#fff)}
.feat--tool .feat__b{padding:22px}
.mega__foot{border-top:1px solid var(--line);margin-top:26px;padding:15px 0 18px;display:flex;flex-wrap:wrap;gap:8px 26px}
.mega__foot a{font-size:.84rem;font-weight:500;color:var(--ink2);transition:color .2s}.mega__foot a:hover{color:var(--red)}
.mega__foot a.strong{color:var(--red);font-weight:600}
#m-produits .top{grid-template-columns:1.05fr 1.15fr 1.1fr .85fr 1.1fr}
#m-guide .top{grid-template-columns:1.2fr 1.2fr .82fr 1.1fr}
.guidecard{background:linear-gradient(162deg,#FDF3F5,#fff);border:1px solid var(--line);border-radius:16px;padding:16px 16px 14px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.guidecard h4{border-bottom:0;margin-bottom:4px;color:var(--ink)}
.guidecard:hover{transform:translateY(-3px);box-shadow:0 22px 46px -30px rgba(20,20,15,.5);border-color:#F1C9D1}
.colsub{font-size:.8rem;color:var(--ink2);margin:0 0 10px;line-height:1.4}
.colgo{display:inline-block;margin-top:10px;font-size:.84rem;font-weight:600;color:var(--red)}
.colgo:hover{text-decoration:underline}
/* switcher des deux guides (comprendre <-> guide-instantane) */
.grn1000{color:var(--green)!important;font-style:normal;display:inline-block;min-width:3.35em;white-space:nowrap;font-variant-numeric:tabular-nums;text-align:left}
.gsw{display:inline-flex;background:#fff;border:1px solid var(--line);border-radius:100px;padding:5px;gap:4px;margin:2px 0 22px;box-shadow:0 16px 40px -30px rgba(20,20,15,.55)}
.gsw__t{font:600 .9rem var(--sans);padding:.62em 1.2em;border-radius:100px;color:var(--ink2);transition:color .25s,background .25s,transform .25s var(--ease)}
.gsw__t:hover{color:var(--ink);transform:translateY(-1px)}
.gsw__t.on{background:var(--ink);color:#fff}
@media(max-width:640px){.gsw{width:100%;justify-content:stretch}.gsw__t{flex:1;text-align:center;font-size:.8rem;padding:.62em .5em}}
#m-outils .top{grid-template-columns:1fr 1.05fr 1.15fr 1fr}
#m-real .top{grid-template-columns:1fr 1.05fr 1fr 1.1fr}
#m-sav .top{grid-template-columns:1.1fr 1fr 1fr 1.1fr}
#m-entreprise .top{grid-template-columns:1fr 1fr 1fr 1.1fr}
/* colonnes badgées (mega Outils : public / client / pro) */
.colbadge{display:inline-block;font:700 .56rem var(--sans);letter-spacing:.1em;text-transform:uppercase;border-radius:100px;padding:3px 9px;margin-right:8px;vertical-align:1px}
.colbadge.pub{background:var(--paper2);color:var(--ink2)}
.colbadge.cli{background:#EDF3E4;color:var(--green-deep,#3F5322)}
.colbadge.prb{background:#FDF3F5;color:var(--red)}
.col.colcard{background:var(--paper2);border:1px solid var(--line);border-radius:16px;padding:16px 18px 12px;margin:-16px -18px -12px 0}
.col.colcard.prox{background:linear-gradient(160deg,#FDF6F7,#fff)}
.col.colcard h4{border-bottom-color:rgba(0,0,0,.06)}
/* — carrousel catégories (mega Produits) — */
.catswip{position:relative;border-radius:18px;overflow:hidden;background:var(--paper2);border:1px solid var(--line);min-height:264px;display:block}
.cs__slide{position:absolute;inset:0;display:flex;flex-direction:column;opacity:0;transform:translateX(26px);transition:opacity .55s var(--ease),transform .55s var(--ease);pointer-events:none}
.cs__slide.on{opacity:1;transform:none;pointer-events:auto}
.cs__slide.out{opacity:0;transform:translateX(-26px)}
.cs__im{display:flex;align-items:center;justify-content:center;height:128px;flex:none;background:radial-gradient(90% 90% at 50% 40%,#fff 55%,var(--paper2));padding:10px}
.cs__im img{max-height:104px;max-width:70%;object-fit:contain;filter:drop-shadow(0 14px 18px rgba(0,0,0,.14));transition:transform .6s var(--ease)}
.cs__slide:hover .cs__im img{transform:scale(1.07)}
.cs__b{display:flex;flex-direction:column;gap:4px;padding:13px 17px 15px}
.cs__b .k{font-size:.6rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--red)}
.cs__b .t{font-family:var(--serif);font-weight:600;font-size:1.14rem;line-height:1.12;color:var(--ink)}
.cs__b .go{font-size:.8rem;font-weight:600;color:var(--red);margin-top:2px}
.cs__dots{position:absolute;bottom:12px;right:14px;display:flex;gap:5px;z-index:2}
.cs__dots i{width:6px;height:6px;border-radius:50%;background:rgba(20,20,15,.18);cursor:pointer;transition:.3s}
.cs__dots i.on{background:var(--red);transform:scale(1.25)}
/* — bouton recherche header — */
.searchbtn{width:36px;height:36px;border-radius:50%;border:0;background:transparent;color:rgba(255,255,255,.92);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .3s,color .3s}
.searchbtn:hover{background:rgba(255,255,255,.15)}
.header.scrolled .searchbtn,.header.mega-open .searchbtn{color:#33332e}
.header.scrolled .searchbtn:hover,.header.mega-open .searchbtn:hover{background:var(--paper2);color:var(--ink)}
/* — recherche globale (overlay) — */
#gsearch{position:fixed;inset:0;z-index:300;display:none;align-items:flex-start;justify-content:center;padding:min(10vh,96px) 18px 30px;background:rgba(15,14,10,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#gsearch.open{display:flex;animation:gsin .25s ease}
@keyframes gsin{from{opacity:0}to{opacity:1}}
.gs__panel{position:relative;width:min(720px,100%);max-height:calc(100dvh - min(10vh,96px) - 30px);display:flex;flex-direction:column;background:#fff;border-radius:24px;box-shadow:0 60px 120px -40px rgba(0,0,0,.55);overflow:hidden;animation:gsup .35s var(--ease)}
.gs__panel::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--red);z-index:2}
@keyframes gsup{from{opacity:0;transform:translateY(-14px) scale(.985)}to{opacity:1;transform:none}}
.gs__bar{display:flex;align-items:center;gap:10px;padding:18px 18px 14px;flex:none}
.gs__field{flex:1;display:flex;align-items:center;gap:10px;height:50px;padding:0 16px;border-radius:100px;background:var(--paper2);border:1.5px solid transparent;transition:border-color .2s,background .2s;cursor:text}
.gs__field:focus-within{border-color:var(--red);background:#fff;box-shadow:0 0 0 4px rgba(186,12,47,.08)}
.gs__field svg{color:var(--red);flex:none}
.gs__bar input{flex:1;min-width:0;border:0;outline:none;font:500 1rem var(--sans);color:var(--ink);background:none;-webkit-appearance:none;appearance:none}
.gs__bar input::-webkit-search-cancel-button{display:none}
.gs__bar input::placeholder{color:var(--ink3);font-weight:400}
.gs__x{flex:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:#fff;color:var(--ink);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,transform .2s}
.gs__x:hover{background:var(--paper2)}.gs__x:active{transform:scale(.92)}
.gs__res{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 18px 18px}
.gs__grp{display:flex;align-items:center;gap:10px;font:700 .64rem var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--red);padding:16px 2px 10px}
.gs__grp::before{content:"";width:18px;height:2px;background:var(--red);border-radius:2px}
.gs__cats{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -18px;padding:0 18px 2px}
.gs__cats::-webkit-scrollbar{display:none}
.gs__cat{flex:none;display:flex;align-items:center;gap:8px;height:44px;padding:0 16px 0 5px;border-radius:100px;border:1px solid var(--line);background:#fff;font:600 .84rem var(--sans);color:var(--ink);text-decoration:none;transition:border-color .2s,color .2s}
.gs__cat img{width:34px;height:34px;border-radius:50%;object-fit:contain;background:var(--paper2);padding:3px}
.gs__cat:hover{border-color:var(--red);color:var(--red)}
.gs__tops{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gs__top{display:flex;flex-direction:column;gap:3px;padding:8px 8px 11px;border-radius:16px;border:1px solid var(--line);background:#fff;text-decoration:none;color:var(--ink);transition:border-color .2s,transform .25s var(--ease),box-shadow .25s}
.gs__top:hover{border-color:#e7d4d8;transform:translateY(-2px);box-shadow:0 16px 30px -20px rgba(0,0,0,.35)}
.gs__top .ti{display:flex;align-items:center;justify-content:center;aspect-ratio:1;border-radius:11px;background:radial-gradient(120% 100% at 50% 20%,#fff 30%,var(--paper2));margin-bottom:6px;overflow:hidden}
.gs__top .ti img{width:80%;height:80%;object-fit:contain}
.gs__top b{font-size:.8rem;font-weight:600;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gs__top>span:last-child{font-size:.68rem;color:var(--ink3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs__quick{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gs__it{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:14px;cursor:pointer;transition:background .15s,border-color .15s}
.gs__it:hover,.gs__it.sel{background:var(--paper2)}
.gs__q{border:1px solid var(--line);padding:10px}
.gs__q:hover{border-color:#e7d4d8;background:#fdf8f8}
.gs__it .gim{width:40px;height:40px;flex:none;border-radius:12px;background:#FBF1F3;display:flex;align-items:center;justify-content:center;overflow:hidden;color:var(--red);transition:.25s}
.gs__it .gim svg{width:19px;height:19px}
.gs__it:hover .gim{background:var(--red);color:#fff}
.gs__it .gim img{max-width:36px;max-height:36px;object-fit:contain}
.gs__it:not(.gs__q) .gim:has(img){background:var(--paper2)}
.gs__it>div{min-width:0}
.gs__it b{display:block;font-size:.9rem;font-weight:600;color:var(--ink);line-height:1.25}
.gs__it b mark{background:none;color:var(--red)}
.gs__it span{display:block;font-size:.73rem;color:var(--ink3);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gs__it .garr{margin-left:auto;color:var(--red);opacity:0;transition:.2s;flex:none}
.gs__it:hover .garr,.gs__it.sel .garr{opacity:1}
.gs__foot{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:18px;padding:14px;border-radius:16px;background:var(--paper2)}
.gs__wa{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 18px;border-radius:100px;background:#25D366;color:#fff;font:600 .86rem var(--sans);text-decoration:none}
.gs__foot>span{font-size:.78rem;color:var(--ink3)}
.gs__empty{text-align:center;color:var(--ink2);padding:34px 20px;font-size:.95rem}
.gs__ai{display:flex;align-items:center;gap:11px;margin:12px 0 4px;padding:12px 14px;border:1px dashed var(--line);border-radius:14px;cursor:pointer;transition:border-color .2s,background .2s;font-size:.88rem;color:var(--ink2)}
.gs__ai:hover{border-color:var(--red);background:#FDF6F7}
.gs__ai b{color:var(--red)}
@media(max-width:760px){#gsearch{padding:0;align-items:stretch;background:#fff;backdrop-filter:none}
.gs__panel{width:100%;max-height:none;height:100dvh;border-radius:0;box-shadow:none;animation:gsupm .3s var(--ease)}
@keyframes gsupm{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.gs__bar{padding:max(14px,env(safe-area-inset-top)) 16px 10px;border-bottom:1px solid var(--line)}
.gs__field{height:46px}
.gs__bar input{font-size:16px}
.gs__res{padding:0 16px max(24px,env(safe-area-inset-bottom))}
.gs__cats{margin:0 -16px;padding:0 16px 2px}
.gs__tops{grid-template-columns:1fr 1fr}
.gs__quick{grid-template-columns:1fr}
.gs__foot{flex-direction:column;align-items:stretch;text-align:center}.gs__wa{justify-content:center}}
/* active page indicator */
.nav__item.cur>button::after,.nav__item.cur>a::after{content:"";position:absolute;left:13px;right:13px;bottom:4px;height:2px;border-radius:2px;background:var(--red)}
.nav__item{position:relative}
.nav__item.cur>button,.nav__item.cur>a{font-weight:600}
/* ===== HERO (pure cinematic video) ===== */
.hero{position:relative;min-height:100svh;overflow:hidden;background:#0a0e08}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__scrim{position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,12,6,.32),transparent 24%)}
.scrollcue{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);color:#fff;opacity:.85;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  display:flex;flex-direction:column;align-items:center;gap:8px;text-shadow:0 1px 10px rgba(0,0,0,.4);animation:bob 2.4s ease-in-out infinite}
.scrollcue span{width:1px;height:26px;background:linear-gradient(#fff,transparent)}
@keyframes bob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,7px)}}
.sound{position:absolute;bottom:22px;right:24px;z-index:6;width:44px;height:44px;border-radius:50%;
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.4);color:#fff;font-size:1rem;cursor:pointer;backdrop-filter:blur(6px);transition:.3s}
.sound:hover{background:rgba(255,255,255,.26)}

/* ===== MESSAGE (light) ===== */
.msg{background:var(--paper);padding:clamp(76px,12vw,150px) 0}
.msg__in{max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,5vw,64px)}
.msg h2{font-family:var(--serif);font-weight:600;font-size:clamp(2.3rem,5.6vw,4.3rem);line-height:1.02;letter-spacing:-.02em;color:var(--ink);max-width:17ch;margin:.34em 0 0}
.msg p{font-size:clamp(1.02rem,1.5vw,1.26rem);color:var(--ink2);max-width:52ch;line-height:1.6;margin-top:22px}
.msg__cta{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.6em;font-weight:600;font-size:.98rem;padding:.95em 1.7em;border-radius:100px;cursor:pointer;transition:transform .3s,background .3s,border-color .3s,color .3s;border:1.5px solid transparent}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--red);color:#fff}.btn-primary:hover{background:var(--red-deep)}
.btn-ghost{border-color:var(--line);color:var(--ink)}.btn-ghost:hover{border-color:var(--red);color:var(--red)}
.msg__meta{display:flex;gap:40px;margin-top:52px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:30px}
.msg__meta b{font-family:var(--serif);font-weight:600;font-size:2.1rem;display:block;line-height:1;color:var(--ink)}
.msg__meta span{font-size:.8rem;color:var(--ink3);letter-spacing:.02em}
.up{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.up.in{opacity:1;transform:none}
.spacer{height:120vh;background:linear-gradient(var(--paper),var(--paper2));display:flex;align-items:center;justify-content:center;color:var(--ink3);font-size:.9rem}

/* ===== MOBILE DRAWER ===== */
.drawer{position:fixed;inset:0;z-index:300;background:#fff;transform:translateX(100%);transition:transform .4s var(--ease);display:flex;flex-direction:column;padding:18px clamp(18px,6vw,30px) 34px;overflow-y:auto}
.drawer.open{transform:none}
.drawer__top{display:flex;align-items:center;justify-content:space-between;height:var(--navh)}
.drawer__x{background:none;border:0;font-size:1.6rem;line-height:1;cursor:pointer;color:var(--ink)}
.acc{border-top:1px solid var(--line)}
.acc>button{width:100%;background:none;border:0;text-align:left;font-family:var(--serif);font-weight:600;font-size:1.5rem;color:var(--ink);padding:18px 0;display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.acc>button i{font-style:normal;color:var(--red);font-size:1.3rem;transition:transform .3s}
.acc.open>button i{transform:rotate(45deg)}
.acc__body{max-height:0;overflow:hidden;transition:max-height .4s ease}.acc.open .acc__body{max-height:520px}
.acc__body ul{list-style:none;padding:2px 0 16px}.acc__body a{display:block;padding:9px 0 9px 2px;color:var(--ink2);font-size:1rem}
.drawer__foot{margin-top:26px;display:flex;flex-direction:column;gap:14px}
.drawer__foot .btn-devis{text-align:center;font-size:1rem;padding:.9em}.drawer__foot .pro{justify-content:center;font-size:.95rem;color:#33332e}.drawer .lang{align-self:center;color:var(--ink3);border-color:var(--line)}

/* ===== TRUST BAND ===== */
.trust{background:var(--paper2);border-block:1px solid var(--line);padding:32px 0;overflow:hidden}
.trust__lab{font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ink3);text-align:center;margin-bottom:24px}
.marquee-wrap{width:100%;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee{display:flex;align-items:center;width:max-content;animation:scrollx 62s linear infinite;will-change:transform}
.trust:hover .marquee{animation-play-state:paused}
.marquee img{height:90px;width:auto;margin:0 12px;border:1px solid var(--line);border-radius:14px;background:#fff;flex:none;box-shadow:0 14px 32px -22px rgba(0,0,0,.3)}
@keyframes scrollx{to{transform:translateX(-50%)}}
@media(max-width:640px){.marquee img{height:66px;margin:0 8px}.marquee{animation-duration:48s}}
/* ===== SECTIONS ===== */
.section{padding-block:clamp(74px,11vw,140px)}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,5vw,64px)}
.head2 .eyebrow{margin-bottom:15px}
.head2 h2{font-family:var(--serif);font-weight:600;font-size:clamp(2rem,4.6vw,3.5rem);line-height:1.04;letter-spacing:-.02em;color:var(--ink);max-width:20ch}
.head2 p{color:var(--ink2);max-width:54ch;margin-top:16px;font-size:1.06rem;line-height:1.55}
.needs{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px}
.need{border:1px solid var(--line);border-radius:20px;padding:34px 30px;background:var(--paper);transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.need:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
.need__ic{width:54px;height:54px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--paper2);color:var(--red);margin-bottom:24px}
.need__ic svg{width:27px;height:27px}
.need h3{font-family:var(--serif);font-weight:600;font-size:1.55rem;margin-bottom:9px}
.need p{color:var(--ink2);font-size:.98rem;line-height:1.55}
.need__go{margin-top:20px;font-size:.86rem;font-weight:600;color:var(--red);display:inline-flex;gap:6px}
.feat-pac{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:24px;overflow:hidden;margin-top:52px;background:var(--paper)}
.feat-pac__txt{padding:clamp(30px,4vw,58px);display:flex;flex-direction:column;justify-content:center}
.feat-pac__txt .k{font-size:.64rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--red)}
.feat-pac__txt h3{font-family:var(--serif);font-weight:600;font-size:clamp(1.8rem,2.7vw,2.6rem);line-height:1.08;margin:11px 0 13px}
.feat-pac__txt p{color:var(--ink2);font-size:1.02rem;line-height:1.55;max-width:42ch}
.feat-pac__txt .go{margin-top:24px;font-weight:600;color:var(--red);display:inline-flex;gap:7px;font-size:.95rem}
.feat-pac__img{background:radial-gradient(120% 120% at 70% 30%,#fff,var(--paper2));display:flex;align-items:center;justify-content:center;padding:34px;min-height:330px}
.feat-pac__img img{max-height:330px;width:auto;filter:drop-shadow(0 26px 34px rgba(0,0,0,.16))}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}
.card3{border:1px solid var(--line);border-radius:20px;padding:30px 28px;background:var(--paper);transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s}
.card3:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
.card3__ic{width:48px;height:48px;border-radius:12px;background:var(--paper2);color:var(--red);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.card3__ic svg{width:24px;height:24px}
.card3 h3{font-family:var(--serif);font-weight:600;font-size:1.35rem;margin-bottom:7px}
.card3 p{color:var(--ink2);font-size:.94rem;line-height:1.5}
.card3 .sub{margin-top:14px;font-size:.8rem;color:var(--ink3);letter-spacing:.01em}
@media(max-width:900px){.needs,.cards3{grid-template-columns:1fr}.feat-pac{grid-template-columns:1fr}.feat-pac__img{min-height:240px;order:2}}

/* ===== PRODUIT PHARE ===== */
.subnav{position:sticky;top:var(--navh);z-index:90;background:rgba(255,255,255,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.subnav__in{max-width:var(--maxw);margin:0 auto;padding:0 clamp(18px,5vw,64px);height:56px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.subnav__name{font-family:var(--serif);font-size:1.05rem;white-space:nowrap}
.subnav__links{display:flex;gap:24px}
.subnav__links a{font-size:.85rem;color:var(--ink2);font-weight:500}.subnav__links a:hover{color:var(--red)}
.subnav__cta{background:var(--red);color:#fff;font-size:.8rem;font-weight:600;padding:.55em 1.15em;border-radius:100px;white-space:nowrap}
.phare__hero{max-width:960px;margin:0 auto;padding:clamp(52px,7vw,88px) clamp(18px,5vw,64px) 0;text-align:center}
.phare__hero .k{font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--red)}
.phare__hero h2{font-family:var(--serif);font-weight:600;font-size:clamp(2.3rem,5.4vw,4rem);line-height:1.03;letter-spacing:-.02em;margin:14px 0 12px}
.phare__hero p{color:var(--ink2);max-width:48ch;margin:0 auto;font-size:1.08rem;line-height:1.55}
.phare__img{max-width:520px;margin:26px auto 0}.phare__img img{width:100%;filter:drop-shadow(0 40px 46px rgba(0,0,0,.17))}
.specs{max-width:var(--maxw);margin:0 auto;padding:clamp(40px,6vw,68px) clamp(18px,5vw,64px) clamp(70px,9vw,120px);display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.spec{border:1px solid var(--line);border-radius:18px;padding:26px 24px;background:var(--paper)}
.spec b{font-family:var(--serif);font-weight:600;font-size:2.2rem;color:var(--ink);display:block;line-height:1}
.spec b i{font-style:normal;color:var(--red);font-size:1.1rem}
.spec span{color:var(--ink2);font-size:.88rem;display:block;margin-top:10px;line-height:1.42}
/* ===== REALISATIONS / TEMOIGNAGES bg ===== */
.tint{background:var(--paper2)}
.projs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:50px}
.proj{border:1px solid var(--line);border-top:3px solid var(--red);border-radius:16px;padding:26px 24px;background:var(--paper);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.proj:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.proj .sect{font-size:.64rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red)}
.proj h3{font-family:var(--serif);font-weight:600;font-size:1.5rem;margin:10px 0 6px;line-height:1.1}
.proj .loc{color:var(--ink2);font-size:.9rem}
/* ===== HISTOIRES ===== */
.stories{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:52px}
.story{border:1px solid var(--line);border-radius:22px;padding:clamp(30px,3.4vw,48px);background:var(--paper)}
.story.men{border-top:3px solid var(--green)}.story.sti{border-top:3px solid var(--red)}
.story .yr{font-family:var(--serif);font-weight:600;font-size:3.2rem;line-height:1;color:var(--ink3);opacity:.45}
.story .lab{font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin:16px 0 10px}
.story.men .lab{color:var(--green)}.story.sti .lab{color:var(--red)}
.story h3{font-family:var(--serif);font-weight:600;font-size:1.6rem;line-height:1.14;margin-bottom:12px}
.story p{color:var(--ink2);font-size:1rem;line-height:1.58;max-width:44ch}
.story .go{margin-top:22px;font-weight:600;display:inline-flex;gap:7px;font-size:.9rem}
.story.men .go{color:var(--green-deep)}.story.sti .go{color:var(--red)}
.tour{position:relative;border-radius:24px;overflow:hidden;margin-top:22px;min-height:340px;display:flex;align-items:flex-end;justify-content:flex-end;padding:clamp(28px,4vw,50px);color:#fff;isolation:isolate}
.tour img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.tour::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(250deg,rgba(18,20,14,.74),rgba(18,20,14,.22))}
.tour__b{max-width:46ch}
.tour .badge{display:inline-flex;gap:6px;align-items:center;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);backdrop-filter:blur(6px);font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:6px 12px;border-radius:100px;margin-bottom:16px}
.tour h3{font-family:var(--serif);font-weight:600;font-size:clamp(1.7rem,3vw,2.4rem);line-height:1.08;margin-bottom:10px}
.tour p{opacity:.9;font-size:1rem;margin-bottom:22px}
.btn-white{background:#fff;color:var(--ink);font-weight:600;font-size:.95rem;padding:.9em 1.6em;border-radius:100px;display:inline-flex;gap:8px;align-items:center;transition:transform .3s}.btn-white:hover{transform:translateY(-2px)}
/* ===== TEMOIGNAGES ===== */
.tmz{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px}
.tm{border:1px solid var(--line);border-radius:20px;padding:32px 28px;background:var(--paper);display:flex;flex-direction:column}
.tm .stars{color:var(--red);letter-spacing:3px;font-size:.95rem;margin-bottom:16px}
.tm p{color:var(--ink);font-size:1rem;line-height:1.6;font-style:italic;flex:1}
.tm .who{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.tm .who b{font-weight:600;display:block}.tm .who span{color:var(--ink3);font-size:.85rem}
/* ===== CONTACT ===== */
.contact__grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:48px;align-items:stretch}
.contact__info{display:flex;flex-direction:column;gap:16px}
.cinfo{display:flex;gap:14px;align-items:center}
.cinfo .ic{width:46px;height:46px;border-radius:12px;background:var(--paper2);color:var(--red);display:flex;align-items:center;justify-content:center;flex:none}
.cinfo .ic svg{width:22px;height:22px}
.cinfo b{display:block;font-weight:600}.cinfo em{color:var(--ink2);font-size:.94rem;font-style:normal}
.contact__map{border-radius:20px;overflow:hidden;border:1px solid var(--line);min-height:380px}
.contact__map iframe{width:100%;height:100%;min-height:380px;border:0;display:block;filter:grayscale(.15)}
/* ===== FOOTER (premium) ===== */
.footer{background:var(--paper3);border-top:1px solid var(--line)}
.foot__cta{max-width:var(--maxw);margin:0 auto;padding:clamp(56px,7vw,92px) clamp(18px,5vw,64px);display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.foot__cta h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.9rem,3.6vw,2.9rem);line-height:1.06;letter-spacing:-.015em}
.foot__cta .acts{display:flex;gap:14px;flex-wrap:wrap}
.btn-wa{display:inline-flex;align-items:center;gap:.6em;font-weight:600;font-size:.98rem;padding:.95em 1.7em;border-radius:100px;background:#1FBE59;color:#fff;transition:transform .3s,background .3s}
.btn-wa:hover{transform:translateY(-2px);background:#17A94D}
.foot__main{max-width:var(--maxw);margin:0 auto;padding:clamp(44px,6vw,72px) clamp(18px,5vw,64px);display:grid;grid-template-columns:1.45fr .9fr .9fr 1.15fr;gap:38px}
.foot__brand img{height:34px;margin-bottom:18px}
.foot__brand p{color:var(--ink2);font-size:.92rem;max-width:36ch;line-height:1.6}
.foot__badge{display:inline-flex;align-items:center;gap:7px;margin-top:16px;border:1px solid #D8E4C4;background:#F6F9F0;color:var(--green-deep);font-size:.78rem;font-weight:600;border-radius:100px;padding:7px 14px}
.foot__socials{display:flex;gap:10px;margin-top:20px}
.foot__socials a{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:#fff;display:flex;align-items:center;justify-content:center;color:var(--ink2);transition:.3s}
.foot__socials a svg{width:18px;height:18px}
.foot__socials a:hover{border-color:var(--green);color:var(--green);transform:translateY(-3px);box-shadow:0 10px 24px -14px rgba(85,112,47,.5)}
.foot__col h5{font-size:.68rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--ink3);margin-bottom:16px}
.foot__col a{display:block;color:var(--ink2);font-size:.92rem;padding:6px 0;transition:color .2s,transform .2s}
.foot__col a:hover{color:var(--green);transform:translateX(3px)}
.foot__contact a,.foot__contact .hrs{display:flex;align-items:center;gap:10px}
.foot__contact svg{width:16px;height:16px;flex:none;color:var(--red)}
.foot__contact .hrs{color:var(--ink3);font-size:.85rem;padding:6px 0}
.foot__certs{border-top:1px solid var(--line)}
.foot__certs{max-width:var(--maxw);margin:0 auto;padding:22px clamp(18px,5vw,64px);display:flex;align-items:center;gap:clamp(14px,3vw,30px);flex-wrap:wrap}
.foot__certs .lab2{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.certmarq{flex:1;min-width:200px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.certmarq__t{display:flex;gap:26px;align-items:center;width:max-content;animation:certslide 40s linear infinite}
.certmarq:hover .certmarq__t{animation-play-state:paused}
@keyframes certslide{to{transform:translateX(-50%)}}
.certmarq__t img{height:36px;width:auto;opacity:.85;transition:opacity .25s,transform .25s;background:#fff;border-radius:6px;flex:none}
.certmarq__t img:hover{opacity:1;transform:scale(1.14)}
.foot__certs .sti-logo{height:16px;margin-left:auto;opacity:.9}
.foot__legal{border-top:1px solid var(--line)}
.foot__legal div{max-width:var(--maxw);margin:0 auto;padding:20px clamp(18px,5vw,64px);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--ink3);font-size:.8rem}
@media(max-width:900px){.foot__main{grid-template-columns:1fr 1fr}.foot__certs .sti-logo{margin-left:0}}
@media(max-width:560px){.foot__main{grid-template-columns:1fr;gap:30px}.foot__cta .acts{width:100%}.foot__cta .acts .btn,.foot__cta .acts .btn-wa{flex:1;justify-content:center}}
/* ===== FLOATING ===== */
.fab{position:fixed;right:18px;bottom:18px;z-index:150;display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.fab a{display:inline-flex;align-items:center;gap:9px;padding:12px 17px;border-radius:100px;font-weight:600;font-size:.9rem;box-shadow:0 16px 40px -14px rgba(0,0,0,.45);transition:transform .3s}
.fab a:hover{transform:translateY(-3px)}
.fab .wa{background:#25D366;color:#fff}
.fab .ai{position:relative;width:62px;height:62px;border-radius:50%;padding:0;background:none;box-shadow:none;justify-content:center}
.fab .ai .ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,var(--red),#FF7A93,#5E0716,var(--red));animation:airot 4.5s linear infinite;box-shadow:0 18px 44px -14px rgba(186,12,47,.65)}
@keyframes airot{to{transform:rotate(360deg)}}
.fab .ai .core{position:absolute;inset:4px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--red)}
.fab .ai .core svg{width:25px;height:25px;animation:aibreath 2.6s ease-in-out infinite}
@keyframes aibreath{50%{transform:scale(1.18)}}
.fab .ai:hover .ring{animation-duration:1.4s}
.fab .ai .txt{position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(8px);background:#161613;color:#fff;font-size:.78rem;font-weight:600;padding:8px 14px;border-radius:100px;opacity:0;white-space:nowrap;transition:.3s var(--ease);pointer-events:none;box-shadow:0 14px 34px -14px rgba(0,0,0,.5)}
.fab .ai:hover .txt{opacity:1;transform:translateY(-50%)}
@media(max-width:900px){
  .specs{grid-template-columns:repeat(2,1fr)}
  .projs,.stories,.tmz,.contact__grid{grid-template-columns:1fr}
  .subnav__links{display:none}
  .fab a span.txt{display:none}
}
@media(max-width:560px){.specs{grid-template-columns:1fr}}
/* ===== AVIS GOOGLE ===== */
.gwrap{text-align:center;max-width:720px;margin:0 auto}
.gbadge{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);border-radius:100px;padding:9px 18px;font-weight:600;font-size:.9rem;box-shadow:0 10px 30px -20px rgba(0,0,0,.28)}
.gbadge svg{width:22px;height:22px}
.grate{margin-top:24px;display:flex;flex-direction:column;align-items:center;gap:12px}
.grate .num{font-family:var(--serif);font-weight:600;font-size:4.2rem;line-height:1;color:var(--ink)}
.gstars{display:inline-flex;gap:6px}
.gstar{width:34px;height:34px;color:#e6e3dc;transform:scale(.4);opacity:0}
.gstar svg{width:100%;height:100%;fill:currentColor;display:block}
.up.in .gstar{animation:starpop .6s cubic-bezier(.34,1.56,.64,1) forwards;animation-delay:calc(var(--i)*.13s)}
@keyframes starpop{0%{transform:scale(.4);opacity:0;color:#e6e3dc}60%{transform:scale(1.32);color:#FBBC04}100%{transform:scale(1);opacity:1;color:#FBBC04}}
.grate .cnt{color:var(--ink2);font-size:.96rem}
.revs{margin-top:50px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.rev-track{display:flex;gap:20px;width:max-content;animation:scrollx 72s linear infinite}
.revs:hover .rev-track{animation-play-state:paused}
@media(max-width:760px){
  /* mobile : marquee → carrousel swipe (le clone est désactivé dans site.js) */
  .revs{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scroll-padding:0 18px;scrollbar-width:none;
    -webkit-mask-image:none;mask-image:none;margin-left:-18px;margin-right:-18px;padding:0 18px}
  .revs::-webkit-scrollbar{display:none}
  .rev-track{animation:none;padding-right:18px}
  .rev{scroll-snap-align:start;width:min(340px,82vw)}
}
.rev{flex:none;width:min(384px,85vw);min-height:236px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:20px;padding:26px 26px;background:var(--paper)}
.rev.ar p{direction:rtl;text-align:right}
.rev__top{display:flex;align-items:center;gap:12px}
.rev__av{width:46px;height:46px;border-radius:50%;color:#fff;font-weight:600;font-size:1.15rem;display:flex;align-items:center;justify-content:center;flex:none}
.rev__nm{font-weight:600;line-height:1.25}.rev__nm span{display:block;color:var(--ink3);font-size:.8rem;font-weight:400}
.rev__g{margin-left:auto;width:22px;height:22px;flex:none}
.rev__stars{display:flex;gap:2px;color:#FBBC04;margin:16px 0 12px}.rev__stars svg{width:18px;height:18px;fill:currentColor}
.rev p{color:var(--ink);font-size:.97rem;line-height:1.6;flex:1;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.grev-cta{margin-top:46px}
.gcta{max-width:760px;margin:0 auto;background:var(--paper);border:1px solid var(--line);border-radius:24px;padding:clamp(22px,3vw,34px);display:flex;align-items:center;gap:clamp(22px,4vw,42px);box-shadow:var(--shadow)}
.gcta__qr{flex:none;width:150px;height:150px;border-radius:14px;padding:9px;background:#fff;border:1px solid var(--line)}
.gcta__qr img{width:100%;height:100%;display:block}
.gcta__b{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.gcta__b .lab{color:var(--ink);font-weight:600;font-size:1.32rem;font-family:var(--serif);line-height:1.14}
.gcta__b .sub{color:var(--ink3);font-size:.86rem;margin-top:-6px}
@media(max-width:600px){.gcta{flex-direction:column;text-align:center}.gcta__b{align-items:center}}
.rate{position:relative;display:inline-flex}
.rate .row{display:flex;gap:6px}
.rate .base{color:#ded9cf}
.rate .fill{position:absolute;inset:0;color:#FBBC04;overflow:hidden;width:0;white-space:nowrap;animation:fillstars 2.8s ease-in-out infinite}
.rate svg{width:30px;height:30px;fill:currentColor;display:block;flex:none}
@keyframes fillstars{0%,6%{width:0}46%{width:100%}80%{width:100%}100%{width:0}}
.btn-google{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:100px;padding:.85em 1.5em;font-weight:600;font-size:.95rem;box-shadow:0 12px 30px -20px rgba(0,0,0,.3);transition:transform .3s}
.btn-google:hover{transform:translateY(-2px)}.btn-google svg{width:20px;height:20px}
@media(max-width:900px){.grate .num{font-size:3.3rem}}

/* ===== RESPONSIVE ===== */
@media(max-width:1080px){
  .nav__items,.mega-stage,.nav__right .pro,.nav__right .lang,.nav__right .btn-devis{display:none}
  .burger{display:flex}
}
@media(min-width:1081px){.drawer{display:none}}
@media(max-width:640px){
  :root{--navh:62px}
  .msg{padding:64px 0 72px}
  .msg h2{font-size:clamp(2.1rem,9vw,2.8rem);max-width:15ch}
  .msg p{font-size:1.04rem}
  .msg__cta{margin-top:28px;gap:11px}.btn{width:100%;justify-content:center;padding:1em 1.4em}
  .msg__meta{gap:26px;margin-top:40px;padding-top:24px}.msg__meta b{font-size:1.7rem}
  .scrollcue{bottom:18px}
}

/* ============================================================
   SHARED SUBPAGE COMPONENTS (site-wide)
   ============================================================ */
/* Page hero (standard subpage opening) */
.phero{padding:calc(var(--navh) + clamp(46px,7vw,96px)) 0 clamp(42px,6vw,74px);background:linear-gradient(180deg,var(--paper2),var(--paper))}
.phero .crumbs{margin-bottom:20px}
.phero h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.4rem,5.6vw,4.2rem);line-height:1.02;letter-spacing:-.02em;color:var(--ink);max-width:18ch}
.phero .lede{font-size:clamp(1.02rem,1.4vw,1.2rem);color:var(--ink2);max-width:56ch;line-height:1.6;margin-top:18px}
.crumbs{font-size:.78rem;color:var(--ink3);display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.crumbs a{color:var(--ink3);transition:color .25s}.crumbs a:hover{color:var(--red)}
.crumbs .sep{opacity:.55}.crumbs b{color:var(--ink2);font-weight:500}
/* Forms */
.lab{font-size:.78rem;font-weight:600;color:var(--ink2);margin-bottom:7px;display:block;letter-spacing:.02em}
.inp{width:100%;padding:13px 16px;border:1px solid var(--line);border-radius:12px;font:inherit;font-size:.95rem;background:#fff;color:var(--ink);transition:border-color .3s,box-shadow .3s;-webkit-appearance:none;appearance:none}
.inp:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(186,12,47,.08)}
select.inp{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%238a8a82' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;padding-right:38px}
textarea.inp{min-height:120px;resize:vertical}
/* Range slider */
input[type=range].rng{-webkit-appearance:none;appearance:none;width:100%;height:5px;border-radius:5px;background:var(--paper3);outline:none}
input[type=range].rng::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--red);cursor:pointer;border:3px solid #fff;box-shadow:0 3px 10px rgba(0,0,0,.25);transition:transform .2s}
input[type=range].rng::-webkit-slider-thumb:hover{transform:scale(1.15)}
/* Segmented control */
.seg{display:inline-flex;background:var(--paper2);border:1px solid var(--line);border-radius:100px;padding:4px;gap:2px;flex-wrap:wrap}
.seg button{font:600 .84rem var(--sans);color:var(--ink2);background:none;border:0;border-radius:100px;padding:.55em 1.15em;cursor:pointer;transition:.25s;white-space:nowrap}
.seg button:hover{color:var(--ink)}
.seg button.on{background:var(--red);color:#fff;box-shadow:0 6px 18px -8px rgba(186,12,47,.45)}
/* Chip filters */
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{font:600 .82rem var(--sans);color:var(--ink2);background:#fff;border:1px solid var(--line);border-radius:100px;padding:.5em 1.05em;cursor:pointer;transition:.25s}
.chip:hover{border-color:var(--ink3);color:var(--ink)}
.chip.on{background:var(--red);border-color:var(--red);color:#fff}
.chip.on.green{background:var(--green);border-color:var(--green)}
/* Spec tables */
.ttab{width:100%;border-collapse:collapse;font-size:.92rem}
.ttab td{padding:11px 4px;border-bottom:1px solid var(--line);color:var(--ink2);vertical-align:top}
.ttab td:last-child{text-align:right;font-weight:600;color:var(--ink);white-space:nowrap;padding-left:18px}
/* Accordion (generic) */
.facc{border:1px solid var(--line);border-radius:16px;background:#fff;overflow:hidden}
.facc+.facc{margin-top:12px}
.facc>button{width:100%;background:none;border:0;text-align:left;font:500 1.02rem var(--sans);color:var(--ink);padding:19px 22px;display:flex;justify-content:space-between;align-items:center;gap:14px;cursor:pointer}
.facc>button i{font-style:normal;color:var(--red);font-size:1.25rem;line-height:1;transition:transform .3s;flex:none}
.facc.open>button i{transform:rotate(45deg)}
.facc__body{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.facc.open .facc__body{max-height:3000px}
.facc__in{padding:0 22px 20px}
/* Big animated number */
.bignum{font-family:var(--serif);font-weight:600;line-height:1;color:var(--ink)}
/* Result cards (calculators) */
.rescard{border:1px solid var(--line);border-radius:18px;padding:24px 22px;background:#fff;text-align:center}
.rescard b{font-family:var(--serif);font-weight:600;font-size:clamp(1.7rem,2.6vw,2.4rem);display:block;line-height:1.05;color:var(--ink)}
.rescard b i{font-style:normal;font-size:.55em;color:var(--ink3)}
.rescard span{color:var(--ink2);font-size:.84rem;display:block;margin-top:8px;line-height:1.4}
.rescard.hot{border-color:transparent;background:linear-gradient(150deg,#FDF3F5,#fff);box-shadow:var(--shadow)}
.rescard.hot b{color:var(--red)}
/* Assistant IA chat panel */
.chat{position:fixed;right:18px;bottom:88px;z-index:390;width:min(392px,calc(100vw - 24px));max-height:min(600px,72vh);background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 40px 90px -26px rgba(0,0,0,.5);display:none;flex-direction:column;overflow:hidden}
.chat.open{display:flex;animation:chatin .38s var(--ease)}
@keyframes chatin{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
.chat__head{background:var(--red);color:#fff;padding:16px 18px;display:flex;align-items:center;gap:11px}
.chat__head .av{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex:none}
.chat__head b{font-size:.95rem;display:block;line-height:1.2}
.chat__head span{font-size:.72rem;opacity:.85;display:flex;align-items:center;gap:5px}
.chat__head span::before{content:"";width:7px;height:7px;border-radius:50%;background:#7CF29A}
.chat__x{margin-left:auto;background:none;border:0;color:#fff;font-size:1.25rem;cursor:pointer;opacity:.85;padding:4px}
.chat__msgs{padding:18px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;background:var(--paper2);flex:1;min-height:180px}
.chat__msgs .m{max-width:86%;padding:11px 14px;border-radius:16px;font-size:.9rem;line-height:1.5}
.chat__msgs .m.bot{background:#fff;border:1px solid var(--line);border-bottom-left-radius:6px;align-self:flex-start}
.chat__msgs .m.me{background:var(--ink);color:#fff;border-bottom-right-radius:6px;align-self:flex-end}
.chat__quick{display:flex;gap:7px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--line);background:#fff}
.chat__quick button,.chat__quick a{font:600 .78rem var(--sans);color:var(--red);background:#fff;border:1px solid var(--line);border-radius:100px;padding:.5em 1em;cursor:pointer;transition:.25s}
.chat__quick button:hover,.chat__quick a:hover{border-color:var(--red)}
.chat__bar{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--line);background:#fff}
.chat__bar input{flex:1;border:1px solid var(--line);border-radius:100px;padding:10px 16px;font:inherit;font-size:.9rem;outline:none}
.chat__bar input:focus{border-color:var(--red)}
.chat__bar button{width:42px;height:42px;border-radius:50%;background:var(--red);color:#fff;border:0;cursor:pointer;font-size:1rem;flex:none;transition:background .25s}
.chat__bar button:hover{background:var(--red-deep)}
/* Page transition veil */
#veil{position:fixed;inset:0;z-index:9998;background:var(--paper);opacity:0;pointer-events:none;transition:opacity .34s ease}
#veil.on{opacity:1;pointer-events:auto}
/* Scroll progress bar */
#sprog{position:fixed;top:0;left:0;height:2.5px;width:0;background:var(--red);z-index:500;transition:width .1s linear}
@media(max-width:640px){.chat{bottom:78px;right:12px}}
.grate .cnt2{color:var(--ink2);font-size:.96rem}

/* ===== PRODUCT CARD (shared produits/produit) ===== */
.pcard{position:relative;border:1px solid var(--line);border-radius:20px;background:#fff;overflow:hidden;display:flex;flex-direction:column;transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .4s}
.pcard:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:transparent}
.pcard__img{position:relative;background:radial-gradient(130% 130% at 60% 20%,#fff 40%,var(--paper2));height:210px;display:flex;align-items:center;justify-content:center;padding:22px}
.pcard__img img{max-height:170px;max-width:78%;object-fit:contain;transition:transform .55s var(--ease);filter:drop-shadow(0 18px 22px rgba(0,0,0,.13))}
.pcard:hover .pcard__img img{transform:scale(1.08)}
.pcard__badges{position:absolute;top:12px;left:12px;display:flex;gap:6px;flex-wrap:wrap;max-width:70%}
.bdg{font-size:.62rem;font-weight:700;letter-spacing:.06em;padding:4px 9px;border-radius:100px;background:#fff;border:1px solid var(--line);color:var(--ink2)}
.bdg.red{background:var(--red);border-color:var(--red);color:#fff}
.bdg.grn{background:#EDF3E4;border-color:#D8E4C4;color:var(--green-deep)}
.bdg.dark{background:var(--ink);border-color:var(--ink);color:#fff}
.pcard__b{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
.pcard__cat{font-size:.64rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--red)}
.pcard__b h3{font-family:var(--serif);font-weight:600;font-size:1.3rem;line-height:1.12;margin:7px 0 6px}
.pcard__b p{color:var(--ink2);font-size:.87rem;line-height:1.5;flex:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pcard__foot{display:flex;align-items:center;justify-content:space-between;margin-top:15px;padding-top:13px;border-top:1px solid var(--line)}
.pcard__foot .ref{font-size:.72rem;color:var(--ink3)}
.pcard__foot .go{font-size:.84rem;font-weight:600;color:var(--red);display:inline-flex;gap:5px;align-items:center}


/* ===== AR/CTA BAND (shared) ===== */

.arband{margin-top:40px;border-radius:22px;border:1px solid var(--line);background:linear-gradient(120deg,#F7F5F1,#fff 60%);padding:clamp(24px,3.4vw,40px);display:flex;align-items:center;gap:clamp(18px,3vw,36px);flex-wrap:wrap}
.arband .em{font-size:2.2rem}
.arband h3{font-family:var(--serif);font-weight:600;font-size:1.5rem;line-height:1.12;margin-bottom:6px}
.arband p{color:var(--ink2);font-size:.95rem;max-width:52ch}
.arband .acts{margin-left:auto;display:flex;gap:11px;flex-wrap:wrap}

@media(max-width:700px){.arband .acts{margin-left:0}}
/* drawer premium extras */
.drawer .acc>button{transition:color .25s}
.drawer.open .acc{animation:din .5s var(--ease) both}
.drawer.open .acc:nth-child(2){animation-delay:.04s}.drawer.open .acc:nth-child(3){animation-delay:.08s}
.drawer.open .acc:nth-child(4){animation-delay:.12s}.drawer.open .acc:nth-child(5){animation-delay:.16s}
.drawer.open .acc:nth-child(6){animation-delay:.2s}.drawer.open .drawer__foot{animation:din .5s .26s var(--ease) both}
@keyframes din{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.drawer .acc__body a.all{color:var(--red);font-weight:600}
.drawer__soc{display:flex;gap:10px;justify-content:center;margin-top:4px}
.drawer__soc a{width:42px;height:42px;border-radius:50%;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--ink2)}
.drawer__soc a svg{width:18px;height:18px}

/* ===== 2026 : transitions fluides entre pages (View Transitions API) ===== */
@view-transition{navigation:auto}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}
::view-transition-old(root){animation:vtout .28s ease both}
::view-transition-new(root){animation:vtin .34s ease both}
@keyframes vtout{to{opacity:0;transform:translateY(-6px)}}
@keyframes vtin{from{opacity:0;transform:translateY(8px)}}
.icx{width:1.06em;height:1.06em;display:inline-block;vertical-align:-.16em;flex:none}
/* ===== FX thermiques (ambient) ===== */
.fxwrap{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:inherit;z-index:1}
.fx-ember{position:absolute;bottom:-10px;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#FFC46B,#E8710A 62%,transparent 75%);filter:blur(.4px);opacity:0;animation:fxember var(--d,4.4s) linear var(--dl,0s) infinite}
@keyframes fxember{0%{opacity:0;transform:translateY(0) scale(.7)}12%{opacity:.85}60%{opacity:.55}100%{opacity:0;transform:translateY(-250px) translateX(20px) scale(1.2)}}
.fx-flake{position:absolute;top:-14px;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#fff,#BFD9EE 55%,transparent 72%);box-shadow:0 0 6px rgba(143,187,222,.7);opacity:0;color:#8FBBDE;animation:fxflake var(--d,7s) linear var(--dl,0s) infinite;font-size:11px;line-height:1}
@keyframes fxflake{0%{opacity:0;transform:translateY(0) rotate(0deg)}10%{opacity:.9}88%{opacity:.6}100%{opacity:0;transform:translateY(260px) translateX(-24px) rotate(200deg)}}
.fx-heat{position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(180deg,transparent,rgba(232,113,10,.07));animation:fxheat 3.4s ease-in-out infinite}
@keyframes fxheat{0%,100%{opacity:.5}50%{opacity:1}}
/* villa : particules pilotées par la saison */
.mais .fx-flake{display:none}.mais.ete .fx-flake{display:block}
.mais.ete .fx-ember{display:none}
.maislive{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:100px;font:600 .76rem var(--sans);color:var(--ink2);padding:.45em 1em;flex:none}
.maislive .pulse2{width:8px;height:8px;border-radius:50%;background:#3BB661;box-shadow:0 0 0 0 rgba(59,182,97,.5);animation:lpulse 2s infinite;flex:none}
.hs.pop circle{animation:hspop .45s var(--ease)}
@keyframes hspop{40%{r:16}}

/* ============================================================
   MOBILE APP FRAMEWORK (≤760px) — navigation basse, carrousels
   à balayage, contrôles tactiles. Ne touche pas au desktop.
   ============================================================ */
/* — Barre de navigation basse (type app) — */
.tabbar{display:none}
@media(max-width:760px){
  .tabbar{position:fixed;left:0;right:0;bottom:0;z-index:240;display:grid;grid-template-columns:repeat(5,1fr);
    align-items:end;background:rgba(255,255,255,.88);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));
    box-shadow:0 -12px 40px -22px rgba(20,20,15,.35);transition:transform .35s var(--ease)}
  .tabbar.hide{transform:translateY(calc(100% + 40px))}
  .tabbar a,.tabbar button{display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:0;
    font:600 .58rem var(--sans);letter-spacing:.02em;color:var(--ink3);padding:6px 2px 4px;cursor:pointer;
    -webkit-tap-highlight-color:transparent;transition:color .25s;min-height:48px;justify-content:flex-end}
  .tabbar svg{width:22px;height:22px}
  .tabbar a.on{color:var(--red)}
  .tabbar .tb-wa{position:relative;justify-content:flex-end}
  .tabbar .tb-wa i{position:absolute;bottom:26px;width:52px;height:52px;border-radius:50%;
    background:linear-gradient(150deg,#2BDE6E,#17A94D);display:flex;align-items:center;justify-content:center;
    box-shadow:0 12px 28px -8px rgba(23,169,77,.55),0 0 0 5px rgba(255,255,255,.9);transition:transform .3s}
  .tabbar .tb-wa:active i{transform:scale(.92)}
  .tabbar .tb-wa svg{width:26px;height:26px;color:#fff}
  .tabbar .tb-wa span{color:#17A94D}
  /* le contenu ne se cache plus derrière la barre */
  body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}
  /* flottants remontés au-dessus de la barre ; WhatsApp doublon masqué */
  /* conseiller = onglet de la barre ; plus aucun bouton flottant sur le contenu */
  .fab{position:fixed;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;bottom:0;right:0}
  .chat{left:10px;right:10px;width:auto;bottom:calc(78px + env(safe-area-inset-bottom));max-height:68vh}
}
/* — Carrousels à balayage (cartes) — */
@media(max-width:760px){
  .needs,.cards3,.tmz,.projs{display:flex;grid-template-columns:none;gap:14px;overflow-x:auto;
    scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
    margin-inline:-18px;padding:6px 18px 22px;scroll-padding-inline:18px;scrollbar-width:none}
  .needs::-webkit-scrollbar,.cards3::-webkit-scrollbar,.tmz::-webkit-scrollbar,.projs::-webkit-scrollbar{display:none}
  .need,.card3,.tm,.proj{flex:0 0 82%;scroll-snap-align:start}
  .needs{margin-top:34px}.cards3{margin-top:14px}.tmz{margin-top:34px}.projs{margin-top:34px}
  .need{padding:28px 24px}.need__ic{margin-bottom:18px}
}
/* — Rythme, titres, confort tactile — */
@media(max-width:760px){
  /* — règles téléphone : échelle RÉDUITE, rythme compact, presse tactile — */
  .section{padding-block:clamp(50px,13vw,64px)}
  .head2 h2{font-size:clamp(1.5rem,6.4vw,1.78rem);letter-spacing:-.02em;line-height:1.12}
  .head2 p,.lede{font-size:16px;line-height:1.55}
  .eyebrow{font-size:.6rem}
  h3{letter-spacing:-.01em}
  .btn,.btn-primary,.btn-ghost{min-height:46px}
  .btn,.btn-primary,.btn-ghost,.chip{transition:transform .18s cubic-bezier(.32,1.36,.44,1)}
  .btn:active,.chip:active,.card3:active,.rcard:active,.projcard:active{transform:scale(.97)}
  .head2 p{font-size:.98rem}
  .phero{padding-bottom:clamp(34px,8vw,52px)}
  .foot__col a{padding:9px 0}
  .acc__body a{padding:12px 0 12px 2px}
  .facc>button{padding:17px 18px;font-size:.98rem}
  .facc__in{padding:0 18px 18px}
  .subnav__in{height:52px}
  .gcta__qr{display:none}   /* on EST déjà sur le téléphone : le QR n'a pas de sens, gros bouton direct */
  .gcta__b .btn-google{width:100%;justify-content:center;min-height:48px}
  .arband{flex-direction:column;align-items:flex-start;gap:14px}
  .arband .acts{width:100%}.arband .acts .btn{flex:1;justify-content:center}
}
/* — Outils & formulaires : vrais contrôles de téléphone — */
@media(max-width:760px){
  .inp,select.inp,textarea.inp,.chat__bar input,.bom .qty{font-size:16px}   /* stop zoom iOS */
  input[type=range].rng{height:7px}
  input[type=range].rng::-webkit-slider-thumb{width:27px;height:27px;border-width:4px}
  /* formulaires : toutes les options visibles (retour à la ligne) */
  .seg{width:100%;flex-wrap:wrap;overflow:visible;border-radius:16px;padding:5px}
  .seg button{flex:1 1 auto;min-width:0;white-space:normal;padding:.62em .9em;font-size:.84rem;text-align:center}
  /* filtre catalogue (beaucoup d'options) : reste une ligne qui défile */
  #segCat{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  #segCat::-webkit-scrollbar{display:none}
  #segCat button{flex:1 0 auto;white-space:nowrap;padding:.72em 1.05em;font-size:.86rem}
  /* toggle saison (2 options) : tient sans scroll, réparti 50/50 */
  #segSaison{overflow:visible;padding:4px}
  #segSaison button{flex:1 1 0;min-width:0;padding:.64em .5em;font-size:.74rem;text-align:center}
  .chips,.toolnav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
    margin-inline:-18px;padding-inline:18px;scroll-padding-inline:18px}
  .chips::-webkit-scrollbar,.toolnav::-webkit-scrollbar{display:none}
  .chip{padding:.68em 1.15em;flex:none}
  .toolnav a{flex:none}
  .bom{overflow-x:auto;margin-inline:-18px;padding-inline:18px}
  .bom table{min-width:530px}
  .tres{border-radius:18px;box-shadow:0 24px 50px -34px rgba(0,0,0,.4)}
  .rescard b{font-size:1.9rem}
}
/* hero mobile : indices remontés au-dessus de la tabbar */
@media(max-width:760px){
  .scrollcue{bottom:calc(86px + env(safe-area-inset-bottom))}
  .sound{right:auto;left:14px;bottom:calc(86px + env(safe-area-inset-bottom));width:42px;height:42px}
}
/* garde-fou grilles : les colonnes ne peuvent plus exploser sous la
   largeur de l'écran à cause d'un contenu non-wrap (seg, slider, table) */
@media(max-width:920px){
  .sim>*,.sim__form>*,.tgrid>*,.tform>*,.wopts>*,.cmp>*,.pdgrid>*,.eclgrid>*,.fgroup{min-width:0}
  .seg{max-width:100%}
}
/* login mobile : la rangée téléphone s'empile proprement */
@media(max-width:640px){
  .lgphone{flex-direction:column}
  .lgphone .btn,.lgphone .btn-primary{width:100%}
}

/* ===== i18n — arabe RTL ===== */
html[dir=rtl]{direction:rtl}
html[lang=ar] h1,html[lang=ar] h2,html[lang=ar] h3,html[lang=ar] h4,html[lang=ar] .msg h2,html[lang=ar] .head2 h2{letter-spacing:0!important}
html[lang=ar] .eyebrow{letter-spacing:.03em}
html[lang=ar] body,html[lang=ar] input,html[lang=ar] button{font-family:'Geist','Segoe UI',Tahoma,system-ui,sans-serif}
html[dir=rtl] .eyebrow::before{margin-left:0}
html[dir=rtl] .crumbs .sep{transform:scaleX(-1);display:inline-block}

/* mode capture (?shot=1) : heros svh plafonnés pour les captures pleine page */
html.shot .hero{min-height:640px!important;height:640px!important}
html.shot .vband{height:520px!important}

/* CTA pré-footer cinématique (vidéo de fond) */
.footcine{position:relative;overflow:hidden;isolation:isolate;background:#0c0f0a}
.footcine__v{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.footcine__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,11,8,.86) 20%,rgba(9,11,8,.5));z-index:1}
.footcine .foot__cta{position:relative;z-index:2;border-bottom:0}
.footcine .foot__cta h2{color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.45)}
.footcine .eyebrow{color:#ffd7de}

/* — icônes pro (remplacent les emojis, trait rouge) — */
.pic{width:1.05em;height:1.05em;display:inline-block;vertical-align:-0.13em;fill:none;stroke:var(--red);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:none}
.eyebrow .pic,.cgband .pic,[class*="--dark"] .pic{stroke:currentColor}
.em>.pic,.usage .pic,.vscard .pic{width:1.6em;height:1.6em;vertical-align:middle}
/* couleurs sémantiques : l'icône prend la couleur de sa chose (règle user 30 juil) */
.pic.pic--sun{stroke:#E8A020}
.pic.pic--ice{stroke:#4E93CE}
.pic.pic--water{stroke:#2F7FC6}
.pic.pic--air{stroke:#7FA3BF}
/* HDB-E : rendu officiel sur fond blanc (pas de version détourée chez Stiebel) → le blanc se fond dans le fond de page */
img[src*="products/204208"],img[src*="products/204209"],img[src*="products/204210"],img[src*="products/hd/204208"],img[src*="products/hd/204209"],img[src*="products/hd/204210"]{mix-blend-mode:multiply}

/* drapeau allemand dessiné (remplace l'emoji) */
.flagde{display:inline-block;width:1.25em;height:.75em;border-radius:3px;vertical-align:middle;box-shadow:0 0 0 1px rgba(0,0,0,.06)}

/* ===== 2026-10 · finitions globales (header, boutons, footer, barre mobile) ===== */
/* header : jamais de libellé sur deux lignes (1280–1520) */
.nav__item>button,.nav__item>a,.btn-devis,.account__btn{white-space:nowrap}
@media(max-width:1520px){.nav__item>button,.nav__item>a{padding:10px 10px}.nav__right{gap:10px}.nav{gap:16px}}
@media(max-width:1480px){.account__btn span{display:none}}
@media(max-width:1340px){.nav__item>button,.nav__item>a{padding:10px 8px;font-size:.86rem}.nav-pin{display:none}}
.btn-devis{box-shadow:0 10px 24px -14px rgba(85,112,47,.7);transition:background .3s,transform .3s var(--ease),box-shadow .3s}
.btn-devis:hover{transform:translateY(-1px);box-shadow:0 14px 30px -14px rgba(85,112,47,.8)}
/* boutons : reflet qui traverse le bouton principal + flèche qui avance (desktop) */
.btn-primary{position:relative;overflow:hidden;isolation:isolate;box-shadow:0 14px 30px -18px rgba(186,12,47,.75)}
@media(hover:hover) and (pointer:fine){
  .btn-primary::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:45%;z-index:-1;pointer-events:none;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-18deg);transition:none}
  .btn-primary:hover::after{left:120%;transition:left .75s var(--ease)}
  .btn-primary:hover{box-shadow:0 20px 38px -18px rgba(186,12,47,.85)}
}
.btn:active,.btn-wa:active,.btn-devis:active{transform:scale(.97)}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:6px}
/* footer : bouton haut de page + colonnes repliables sur téléphone */
.foot__legal div{align-items:center}
.foot__top{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:100px;padding:7px 14px 7px 10px;font:600 .78rem var(--sans);color:var(--ink2);cursor:pointer;transition:border-color .3s,color .3s,transform .3s var(--ease)}
.foot__top svg{width:16px;height:16px;transition:transform .3s var(--ease)}
.foot__top:hover{border-color:var(--green);color:var(--green)}
.foot__top:hover svg{transform:translateY(-3px)}
@media(max-width:560px){
  .foot__main{gap:0}
  .foot__brand{padding-bottom:26px}
  .foot__acc{border-top:1px solid rgba(20,20,15,.09)}
  .foot__acc h5{display:flex;align-items:center;justify-content:space-between;margin:0;padding:18px 0;cursor:pointer;font-size:.74rem;color:var(--ink);-webkit-tap-highlight-color:transparent}
  .foot__acc h5::after{content:"";width:9px;height:9px;border-right:1.6px solid var(--ink3);border-bottom:1.6px solid var(--ink3);transform:rotate(45deg) translateY(-3px);transition:transform .35s var(--ease)}
  .foot__acc.open h5::after{transform:rotate(225deg) translateY(-1px)}
  .foot__acc .foot__links{max-height:0;overflow:hidden;opacity:0;transition:max-height .5s var(--ease),opacity .4s,padding .4s}
  .foot__acc.open .foot__links{max-height:460px;opacity:1}
  .foot__acc .foot__links a{padding:10px 0}
  .foot__acc.open .foot__links{padding-bottom:14px}
  .foot__contact{border-top:1px solid rgba(20,20,15,.09);padding-top:22px;margin-top:0}
  .foot__legal div{flex-direction:column;align-items:flex-start;gap:10px}
}
/* tiroir mobile : accès directs illustrés */
.drawer__quick{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:6px 0 10px}
.drawer__quick a{position:relative;display:flex;align-items:flex-end;aspect-ratio:3/4;border-radius:16px;overflow:hidden;color:#fff;padding:10px;isolation:isolate;background:#2b2b2b;-webkit-tap-highlight-color:transparent;transition:transform .2s var(--ease)}
.drawer__quick a:active{transform:scale(.96)}
.drawer__quick img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.drawer__quick a::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 40%,rgba(8,8,6,.78))}
.drawer__quick span{font-size:.78rem;font-weight:600;line-height:1.2}
.drawer.open .drawer__quick a{animation:din .5s var(--ease) both}
.drawer.open .drawer__quick a:nth-child(2){animation-delay:.05s}.drawer.open .drawer__quick a:nth-child(3){animation-delay:.1s}
.drawer .acc>button{font-size:1.32rem}
.drawer.open .acc:nth-child(7){animation-delay:.24s}
/* barre basse : pastille de l'onglet actif */
@media(max-width:760px){
  .tabbar a,.tabbar button{position:relative}
  .tabbar a:not(.tb-wa)::before,.tabbar button::before{content:"";position:absolute;top:2px;left:50%;width:34px;height:3px;border-radius:3px;background:var(--red);transform:translateX(-50%) scaleX(0);transition:transform .35s var(--ease)}
  .tabbar a.on::before{transform:translateX(-50%) scaleX(1)}
  .tabbar a:active svg,.tabbar button:active svg{transform:scale(.88)}
  .tabbar svg{transition:transform .2s var(--ease)}
}
/* passe mobile 8 oct : boutons à taille téléphone, une seule ligne, empilés quand ils ne tiennent pas côte à côte */
@media(max-width:600px){
  .btn,.btn-wa,.btn-white,.btn-google{font-size:.9rem;padding:.72em 1.2em;min-height:46px;line-height:1.2;white-space:nowrap;justify-content:center}
  .btn svg,.btn-wa svg{flex:none}
  .foot__cta{padding-block:44px;gap:22px}
  .foot__cta .acts{flex-direction:column;gap:10px}
  .foot__cta .acts .btn,.foot__cta .acts .btn-wa{width:100%;flex:none}
}