/* Maquette Alveotech, v2 du 2026-10-26 : direction A + B. Fond blanc, typographie géante, un objet héros, photos plein cadre, chiffres en géant, phrase orange. Aucune carte, aucune boîte. */
:root{
  --ink:#1d1d1f; --ink-2:#424245; --mut:#6e6e73;
  --bg:#fff; --sand:#F4EFE6; --black:#000;
  --accent:#F08810; --accent-ink:#B35F00;
  --line:rgba(0,0,0,.12); --line-2:rgba(0,0,0,.24);
  --wrap:1280px; --gut:clamp(20px,5vw,72px); --h:64px;
  font-family:Inter,-apple-system,"SF Pro Display",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01"}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
.prose p a,.rows p a,.lede a,.split__txt p a,.faq a,.rv>p a{font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px;text-decoration-color:var(--accent)}
.prose p a:hover,.rows p a:hover,.lede a:hover,.split__txt p a:hover,.faq a:hover,.rv>p a:hover{color:var(--accent-ink)}
p{margin:0}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.045em;line-height:1;text-wrap:balance}
h1{font-size:clamp(44px,7.2vw,104px);letter-spacing:-.055em;line-height:.95}
h2{font-size:clamp(34px,5vw,68px)}
h3{font-size:clamp(22px,2vw,28px);letter-spacing:-.025em;line-height:1.15}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.ico{width:18px;height:18px;flex:none}
.answer{font-size:clamp(19px,1.8vw,24px);line-height:1.4;color:var(--ink-2);max-width:62ch;margin-top:22px;letter-spacing:-.01em}
.lede{font-size:clamp(18px,1.6vw,22px);color:var(--ink-2);max-width:60ch;margin-top:14px;letter-spacing:-.01em}
.actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}
b,strong{font-weight:650}

/* boutons : pilule orange, pilule noire, lien */
.btn{display:inline-flex;align-items:center;gap:8px;padding:15px 24px;border-radius:999px;font-weight:600;font-size:16px;line-height:1;transition:transform .15s,background .15s;white-space:nowrap}
.btn .ico{width:17px;height:17px}
.btn:hover{transform:translateY(-1px)}
button.btn{appearance:none;border:0;font-family:inherit;cursor:pointer}
.btn--primary{background:var(--accent);color:#fff}
.btn--primary:hover{background:#e07c0b}
.btn--ghost{background:var(--ink);color:#fff}
.btn--light{background:#fff;color:var(--ink)}
.btn--link{background:none;color:var(--ink);padding:15px 4px;border-bottom:2px solid transparent;border-radius:0;transition:border-color .15s}
.btn--link:hover{transform:none;border-bottom-color:var(--ink)}
.lnk{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:18px;color:var(--ink);margin-top:22px;letter-spacing:-.01em;border-bottom:2px solid var(--ink);padding-bottom:2px}
.lnk .ico{width:18px;height:18px}
.iconbtn{appearance:none;background:transparent;border:0;width:44px;height:44px;display:inline-grid;place-items:center;color:var(--ink);cursor:pointer}
.iconbtn .ico{width:24px;height:24px}

/* logo */
.logo{display:inline-flex;align-items:baseline;letter-spacing:.04em;font-size:22px;line-height:1;white-space:nowrap}
.logo__a{color:var(--accent);font-weight:800}
.logo__b{color:var(--ink);font-weight:300}
.logo--ftr{font-size:30px}

/* en-tête minimal */
.hdr{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.72);backdrop-filter:saturate(1.6) blur(16px);-webkit-backdrop-filter:saturate(1.6) blur(16px)}
.hdr__in{height:var(--h);display:flex;align-items:center;gap:28px}
.nav{margin-left:auto}
.nav>ul{list-style:none;margin:0;padding:0;display:flex;gap:2px;align-items:center}
.nav li{position:relative}
.nav a,.nav button{appearance:none;background:none;border:0;font:inherit;font-weight:500;font-size:14px;color:var(--ink);padding:8px 12px;border-radius:999px;display:inline-flex;align-items:center;gap:4px;cursor:pointer;white-space:nowrap;opacity:.85}
.nav a:hover,.nav button:hover,.nav button[aria-expanded="true"],.nav a[aria-current="page"]{opacity:1;background:rgba(0,0,0,.05)}
.nav .ico{width:13px;height:13px;opacity:.6}
/* panneaux de menu : bandeau pleine largeur sous l'en-tête (variante A du 03/11), deux colonnes de liens et une photo ; aucun texte gris */
.menu{position:fixed;left:0;right:0;top:var(--h);background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:32px 0 36px;display:none;z-index:50}
.has-menu[data-open] .menu{display:block}
.menu__in{display:grid;grid-template-columns:1fr 1fr 280px;gap:48px;align-items:start}
.menu__h{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--ink);margin-bottom:10px}
.nav .menu a{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:600;letter-spacing:-.02em;padding:9px 0;border-top:1px solid var(--line);border-radius:0;color:var(--ink);opacity:1;white-space:normal}
.nav .menu a:first-of-type{border-top:0}
.nav .menu a:hover,.nav .menu a[aria-current="page"]{background:none;color:var(--accent-ink)}
.menu a .ico{width:16px;height:16px;opacity:0;margin-left:auto;transition:opacity .15s}
.menu a:hover .ico,.menu a:focus-visible .ico{opacity:1}
.nav .menu a.menu__all{font-size:15px;color:var(--accent-ink);border-top:0;margin-top:6px}
.menu figure{margin:0}
.menu figure img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px}
.menu figcaption{font-size:14px;margin-top:10px;line-height:1.35;color:var(--ink)}
.menu figcaption b{display:block;font-weight:600}
.menu__say p{font-size:22px;font-weight:600;letter-spacing:-.03em;line-height:1.2;max-width:22ch;color:var(--ink)}
.menu__say .lnk{font-size:16px;margin-top:16px}
.hdr__cta .btn{padding:10px 18px;font-size:14px}
.hdr__cta .btn--ghost{display:none}
.hdr__burger{display:none}
.only-campings{display:none}
body[data-public="campings"] .only-campings{display:block}

/* tiroir mobile */
.drawer{position:fixed;inset:0;z-index:60;display:none}
.drawer[aria-hidden="false"]{display:block}
.drawer__bg{position:absolute;inset:0;background:rgba(0,0,0,.3)}

/* fil d'Ariane */
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 10px;font-size:13px;color:var(--mut)}
.crumbs li+li::before{content:"/";margin-right:10px;opacity:.4}

/* ---------- héros d'accueil (A) : titre géant centré, l'objet seul dessous, animé au défilement ---------- */
.hero{position:relative;height:420vh;height:420svh;--hp:0;--ht:0}
.hero__stage{position:sticky;top:var(--h);height:calc(100vh - var(--h));height:calc(100svh - var(--h));display:grid;grid-template-rows:auto 1fr;justify-items:center;text-align:center;padding:clamp(14px,2.4vh,30px) var(--gut) 0;max-width:var(--wrap);margin:0 auto}
.hero__txt{max-width:1180px;transform-origin:50% 0;transform:translateY(calc(var(--ht) * -36px)) scale(calc(1 - var(--ht) * .16));opacity:calc(1 - var(--ht));will-change:transform,opacity}
.hero__txt h1 .big{display:block;font-size:clamp(44px,6.3vw,92px);letter-spacing:-.05em;line-height:.95;text-wrap:balance}
.hero__txt .sub{display:block;margin-bottom:0;font-size:clamp(18px,2vw,27px);font-weight:500;letter-spacing:-.02em;color:var(--ink);margin-top:14px;line-height:1.25}
.hero__txt .answer{display:none}
.hero__txt .actions{justify-content:center;margin-top:18px;gap:8px 22px}
.hero__proof{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 0;margin:14px 0 0;font-size:14px;font-weight:500;color:var(--ink);letter-spacing:-.005em}
.hero__proof span{display:inline-flex;align-items:center}
.hero__proof span+span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);margin:0 12px}
.hero__anim{position:relative;width:min(100%,980px);height:100%;min-height:0;margin-top:6px;overflow:visible;transform:translateY(calc(var(--hp) * -140px))}
.hero__anim canvas,.hero__anim img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:scale(calc(1 + var(--hp) * .22))}
.hero__anim img{opacity:1;transition:opacity .3s}
.hero__anim.is-ready img{opacity:0}
.hero__lbl{position:absolute;inset:0;pointer-events:none}
.hero__lbl span{position:absolute;left:0;top:0;transform:translate(6px,-50%);opacity:0;transition:opacity .25s,transform .25s,top .35s cubic-bezier(.2,.7,.2,1);font-size:15px;font-weight:500;color:var(--ink);white-space:nowrap;text-align:left;line-height:1.2;padding-left:64px}
.hero__lbl span::before{content:"";position:absolute;left:0;top:50%;width:46px;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left center;transition:transform .28s cubic-bezier(.2,.7,.2,1)}
.hero__lbl span b{display:block;font-weight:500;opacity:0;transform:translateX(-6px);transition:opacity .25s,transform .25s}
.hero__lbl span i{opacity:0;transition:opacity .2s}
.hero__lbl span.on::before,.hero__lbl.all span::before{transform:scaleX(1)}
.hero__lbl span.on i,.hero__lbl.all span i{opacity:1;transition-delay:.18s}
.hero__lbl span.on b,.hero__lbl.all span b{opacity:1;transform:none;transition-delay:.22s}
.hero__lbl.all span:nth-child(2)::before{transition-delay:.07s}.hero__lbl.all span:nth-child(3)::before{transition-delay:.14s}.hero__lbl.all span:nth-child(4)::before{transition-delay:.21s}.hero__lbl.all span:nth-child(5)::before{transition-delay:.28s}
.hero__lbl span::after{content:"";position:absolute;left:-3px;top:50%;width:7px;height:7px;margin-top:-3px;border-radius:50%;background:var(--accent)}
.hero__lbl span.on,.hero__lbl.all span{opacity:1;transform:translate(0,-50%)}
.hero__lbl span i{display:block;font-style:normal;color:var(--accent-ink);font-weight:600;font-size:13px;font-variant-numeric:tabular-nums;margin-bottom:2px}
.hero__hint{display:none}
.hero__after{height:1px}
@keyframes heroIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes heroFade{from{opacity:0}to{opacity:1}}
.hero__txt h1 .big,.hero__txt .sub,.hero__txt .actions,.hero__proof{animation:heroIn .8s cubic-bezier(.2,.7,.2,1) both}
.hero__txt .sub{animation-delay:.08s}.hero__txt .actions{animation-delay:.16s}.hero__proof{animation-delay:.22s}
.hero__anim{animation:heroFade 1s .3s both}
body.has-hero .hdr__cta{opacity:0;pointer-events:none;transition:opacity .25s}
body.has-hero.cta-on .hdr__cta{opacity:1;pointer-events:auto}

/* ---------- photo plein cadre (B) ---------- */
.bleed{position:relative;margin:0;width:100%}
.bleed img{width:100%;height:min(86vh,900px);object-fit:cover}
.bleed figcaption{position:absolute;left:var(--gut);bottom:28px;color:#fff;font-size:15px;font-weight:500;text-shadow:0 1px 12px rgba(0,0,0,.5)}
.bleed figcaption b{display:block;font-size:clamp(28px,4vw,56px);letter-spacing:-.04em;line-height:1;margin-bottom:8px;font-weight:700}

/* ---------- section noire, chiffre géant (A) ---------- */
.black{background:var(--black);color:#fff;padding:clamp(80px,12vw,160px) 0;text-align:center}
.black .num{font-size:clamp(72px,15vw,220px);font-weight:800;letter-spacing:-.06em;line-height:.9}
.black .num small{font-size:.5em;font-weight:700;letter-spacing:-.04em}
.black .sub{font-size:clamp(17px,1.6vw,22px);color:#a1a1a6;margin-top:18px;letter-spacing:-.01em}
.black .trio{list-style:none;margin:clamp(40px,6vw,72px) auto 0;padding:0;display:flex;justify-content:center;gap:clamp(28px,6vw,96px);flex-wrap:wrap}
.black .trio li{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#a1a1a6;font-weight:600}
.black .trio li b{display:block;color:#fff;font-size:clamp(26px,2.6vw,36px);letter-spacing:-.04em;text-transform:none;font-weight:700;margin-bottom:8px}

/* ---------- éditorial (B) : chiffre + deux colonnes ---------- */
.sec{padding:clamp(72px,10vw,140px) 0}
.sec--sand{background:var(--sand)}
.sec--tight{padding:clamp(40px,6vw,72px) 0}
.ed{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(32px,6vw,96px);align-items:start}
.ed__num{font-size:clamp(88px,14vw,200px);font-weight:300;letter-spacing:-.06em;line-height:.85}
.ed__num small{display:block;font-size:15px;font-weight:500;letter-spacing:0;color:var(--mut);margin-top:18px}
.ed__cols{columns:2;column-gap:40px;font-size:15.5px;color:var(--ink-2);line-height:1.6}
.ed__cols p{margin-bottom:14px;break-inside:avoid}
.ed__cols b{color:var(--ink);display:block;margin-bottom:2px;font-size:17px;letter-spacing:-.02em}
.ed__cols .lnk{margin-top:8px;font-size:16px}

/* ---------- bande de photos qui déborde (B) ---------- */
.strip{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 calc(-1 * var(--gut)) 0;padding:0 0 0 var(--gut);width:calc(100% + 2 * var(--gut))}
.strip figure{margin:0}
.strip img{width:100%;aspect-ratio:4/3;object-fit:cover}
.strip figcaption{font-size:13px;color:var(--mut);margin-top:12px;letter-spacing:-.005em}
.strip figcaption b{color:var(--ink);font-weight:600;display:block;font-size:15px;margin-bottom:2px}
.strip--4{grid-template-columns:1.6fr 1fr 1fr 1fr}
.strip--4 figure:first-child img{aspect-ratio:16/10}

/* ---------- phrase géante orange (B) ---------- */
.statement{padding:clamp(72px,10vw,140px) 0}
.statement p{font-size:clamp(40px,7.5vw,112px);font-weight:700;letter-spacing:-.055em;line-height:.95;color:var(--accent);text-wrap:balance}
.statement .actions{margin-top:40px}

/* ---------- lignes géantes (usages) ---------- */
.lines{list-style:none;margin:40px 0 0;padding:0;border-top:1px solid var(--line-2)}
.lines li a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:24px;padding:26px 0;border-bottom:1px solid var(--line);font-size:clamp(28px,4.4vw,64px);font-weight:700;letter-spacing:-.045em;line-height:1;transition:padding-left .25s,color .2s}
.lines li a:hover{padding-left:16px;color:var(--accent-ink)}
.lines li a span{font-size:15px;font-weight:500;letter-spacing:0;color:var(--mut);text-align:right;max-width:32ch;line-height:1.4}
.lines .ico{display:none}
.lines img{display:none}

/* ---------- frise des couches : rangée de chiffres ---------- */
.frz{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:28px}
.frz--3{grid-template-columns:repeat(3,1fr)}.frz--4{grid-template-columns:repeat(4,1fr)}
.frz li{border-top:2px solid var(--ink);padding-top:18px}
.frz__k{display:block;font-size:clamp(32px,3.6vw,52px);font-weight:700;letter-spacing:-.05em;line-height:1}
.frz b{display:block;font-size:17px;letter-spacing:-.02em;margin:14px 0 6px}
.frz p{font-size:14.5px;color:var(--mut);line-height:1.5}

/* ---------- texte + mini-tableau sans boîte ---------- */
.two{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,6vw,96px);align-items:start}
.two>div:first-child{position:sticky;top:calc(var(--h) + 24px);align-self:start}
.rows{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-2)}
.rows li{display:grid;grid-template-columns:56px 1fr;gap:16px;padding:26px 0;border-bottom:1px solid var(--line)}
.rows__n{font-variant-numeric:tabular-nums;font-weight:600;color:var(--accent-ink);font-size:14px;padding-top:6px}
.rows b{display:block;font-size:clamp(20px,1.8vw,24px);letter-spacing:-.03em;margin-bottom:8px}
.rows p{color:var(--ink-2);max-width:60ch}
.rows--plain li{grid-template-columns:1fr}
.rows--plain .rows__n{display:none}
.proof{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.proof li b{display:block;font-size:clamp(36px,4.4vw,64px);letter-spacing:-.05em;font-weight:700;line-height:.95}
.proof li span{display:block;margin-top:10px;font-size:14.5px;color:var(--mut)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,96px);align-items:center}
.split--rev .split__txt{order:2}
.split__txt p{color:var(--ink-2);margin-top:18px;max-width:52ch;font-size:18px}
.split__fig{margin:0}
.split__fig img{aspect-ratio:4/3;object-fit:cover;width:100%}
.split__fig figcaption{font-size:13px;color:var(--mut);margin-top:12px}
.split--top{align-items:start}.split--top .split__fig{position:sticky;top:calc(var(--h) + 24px)}
.tints{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 32px;border-top:1px solid var(--line-2)}
.tints li{display:grid;grid-template-columns:28px 1fr;gap:4px 14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.tint__c{width:28px;height:28px;border-radius:50%;grid-row:1/3;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.tints b{font-size:16px;letter-spacing:-.01em}.tints li>span:last-child{font-size:14px;color:var(--ink-2);grid-column:2}
.tints__note{font-size:13px!important;color:var(--mut)!important;margin-top:12px!important}
@media (max-width:600px){.tints{grid-template-columns:1fr}}
@media (max-width:600px){.tbl--wide table{min-width:520px}.tbl--wide::after{content:"Faites glisser le tableau pour voir toutes les colonnes";display:block;font-size:12px;color:var(--mut);margin-top:8px}.tbl--refs table{min-width:0}.tbl--refs td:nth-child(3),.tbl td:last-child:not(:first-child){white-space:normal}.tbl--refs td:nth-child(3){white-space:nowrap}}
.idx{list-style:none;margin:40px 0 0;padding:0;border-top:1px solid var(--line-2)}
.idx li a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:24px;padding:26px 0;border-bottom:1px solid var(--line)}
.idx li a img{display:none}
.idx b{display:block;font-size:clamp(28px,4.4vw,64px);letter-spacing:-.045em;line-height:1}
.idx p{font-size:17px;color:var(--ink-2);margin-top:10px;max-width:56ch;line-height:1.4}
.idx .ico{width:28px;height:28px;color:var(--ink)}
/* liste éditoriale à vignettes (page Guides, choix de Tim 03/11 : variante B) */
.idx--thumb li a{grid-template-columns:200px 1fr auto;gap:28px;padding:22px 0;align-items:center}
.idx--thumb li a img{display:block;width:200px;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.idx--thumb b{font-size:28px;letter-spacing:-.03em;line-height:1.1}
.idx--thumb p{font-size:17px;margin-top:8px}
@media (max-width:600px){.idx--thumb li a{grid-template-columns:1fr;gap:12px}.idx--thumb li a img{width:100%}.idx--thumb .ico{display:none}}
.gal{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:40px}
.gal__f{margin:0;grid-column:span 2}
.gal__f.w3{grid-column:span 3}
.gal__f.w4{grid-column:span 4}
.gal__f img{width:100%;aspect-ratio:3/2;object-fit:cover}
.gal__f.w4 img{aspect-ratio:2/1}
.gal__f figcaption{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--mut);margin-top:12px}
.gal__f figcaption b{color:var(--ink);font-weight:600}
.gal__f.is-off{display:none}
.filters{display:flex;flex-wrap:wrap;gap:6px;margin-top:28px}
.filters button{appearance:none;font:inherit;font-size:14px;font-weight:500;border:0;background:transparent;border-radius:999px;padding:9px 16px;cursor:pointer;color:var(--ink);opacity:.7}
.filters button[aria-pressed="true"]{background:var(--ink);color:#fff;opacity:1}

/* tableau citable : filets fins, pas de boîte */
.tbl{overflow:auto;margin:28px 0 0}
table{border-collapse:collapse;width:100%;font-size:15.5px}
caption{text-align:left;padding:0 0 14px;font-weight:600;font-size:15px;caption-side:top;letter-spacing:-.01em}
th,td{padding:14px 20px 14px 0;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
thead th{border-bottom:1px solid var(--ink);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);font-weight:600}
td:first-child{font-weight:600}
.tbl__src{font-size:13.5px;line-height:1.5;margin-top:14px;max-width:none}
.tbl__src a{font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px;text-decoration-color:var(--accent)}
.tbl--refs td:nth-child(3),.tbl--refs th:nth-child(3){text-align:right;padding-right:0;font-variant-numeric:tabular-nums}
.chk{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:12px}
.chk li{display:flex;gap:12px;align-items:flex-start;color:var(--ink-2);font-size:17px}
.chk .ico{color:var(--accent);margin-top:4px}
.toc{margin-top:26px;font-size:14px}
.toc ol{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:6px 20px;counter-reset:t}
.toc li{counter-increment:t}
.toc li::before{content:counter(t,decimal-leading-zero) " ";color:var(--accent-ink);font-weight:600;font-variant-numeric:tabular-nums}
.toc a{border-bottom:1px solid var(--line-2)}
.vid{margin:40px 0 0;position:relative;overflow:hidden}
.vid img{aspect-ratio:16/9;object-fit:cover;width:100%}
.vid figcaption{position:absolute;left:0;right:0;bottom:0;padding:28px;background:linear-gradient(transparent,rgba(0,0,0,.65));color:#fff;display:grid;grid-template-columns:auto 1fr;gap:4px 18px;align-items:center}
.vid__play{grid-row:span 2;width:56px;height:56px;border-radius:999px;background:#fff;color:var(--ink);display:grid;place-items:center}
.vid__play .ico{width:22px;height:22px;fill:currentColor}
.vid figcaption b{font-size:20px;letter-spacing:-.02em}
.vid figcaption span:last-child{font-size:14px;opacity:.85}
.note{font-size:14px;color:var(--mut);margin-top:16px;max-width:60ch}

/* ---------- héros de page : titre géant, réponse, photo plein cadre juste dessous ---------- */
.hero-p{padding:clamp(24px,4vw,48px) 0 clamp(40px,6vw,72px)}
.hero-p__grid{display:block;margin-top:18px}
.hero-p__txt{max-width:980px}
.hero-p__fig{margin:clamp(40px,6vw,72px) calc(-1 * var(--gut)) 0;width:calc(100% + 2 * var(--gut))}
.hero-p__fig img{width:100%;height:min(80vh,820px);object-fit:cover}
.hero-p__side{margin-top:28px}

/* prose */
.prose{max-width:820px}
.prose h2{margin-bottom:26px}
.prose h3{margin:36px 0 10px}
.prose p{margin-bottom:16px;color:var(--ink-2);font-size:18px;line-height:1.55}
.prose p:last-child{margin-bottom:0}
.prose ul{margin:0 0 16px;padding-left:20px;color:var(--ink-2)}
.prose li{margin-bottom:6px}
.prose .tbl{margin:28px 0}

/* FAQ */
.faq{max-width:900px}
.faq__l{margin-top:32px;border-top:1px solid var(--ink)}
details{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font-weight:600;font-size:clamp(18px,1.7vw,22px);letter-spacing:-.025em}
summary::-webkit-details-marker{display:none}
summary .ico{color:var(--ink);transition:transform .2s;width:22px;height:22px}
details[open] summary .ico{transform:rotate(45deg)}
.faq__a{padding:0 0 24px;color:var(--ink-2);max-width:66ch;font-size:17px}
.faq__a p{margin-bottom:10px}

/* appel final : statement orange sur blanc + photo plein cadre au-dessus */
.cta{position:relative;overflow:hidden;margin:0;background:#fff}
.cta>img{width:100%;height:min(70vh,720px);object-fit:cover}
.cta__in{padding:clamp(56px,8vw,112px) var(--gut) clamp(56px,7vw,96px);max-width:var(--wrap);margin:0 auto}
.cta h2{font-size:clamp(40px,7.5vw,112px);letter-spacing:-.055em;line-height:.95;color:var(--accent);max-width:16ch}
.cta p{margin-top:22px;max-width:52ch;font-size:clamp(18px,1.6vw,22px);color:var(--ink-2)}
.cta .btn--light{background:var(--ink);color:#fff}
.cta__tel{margin-top:18px;font-size:17px;color:var(--ink)}.cta__tel a{font-weight:600;border-bottom:2px solid var(--accent);padding-bottom:1px}

/* pages liées */
.rel ul{list-style:none;margin:32px 0 0;padding:0;border-top:1px solid var(--ink)}
.rel li a{display:grid;grid-template-columns:1fr auto;gap:4px 24px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}
.rel li a b{font-size:clamp(22px,2.4vw,32px);letter-spacing:-.035em;line-height:1.05}
.rel li a span{font-size:15px;color:var(--mut);grid-column:1;margin-top:4px}
.rel .ico{grid-column:2;grid-row:1/3;width:26px;height:26px}

/* formulaires : champs du site, listes déroulantes maison */
.form{display:grid;grid-template-columns:1fr 1fr;gap:20px 24px;max-width:820px;margin-top:8px}
.form .full{grid-column:1/-1}
.fld{display:grid;gap:8px;font-size:14px;font-weight:500;color:var(--mut)}
.fld input,.fld textarea,.fld .sel__btn{appearance:none;font:inherit;font-size:17px;font-weight:400;padding:14px 0;border:0;border-bottom:1px solid var(--line-2);border-radius:0;background:transparent;color:var(--ink);width:100%}
.fld input:focus,.fld textarea:focus,.fld .sel__btn:focus{outline:0;border-bottom-color:var(--ink)}
.fld textarea{min-height:110px;resize:vertical}
.sel{position:relative}
.sel__btn{display:flex;justify-content:space-between;align-items:center;cursor:pointer;text-align:left}
.sel__btn .ico{width:16px;height:16px;opacity:.6}
.sel__list{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border-radius:14px;box-shadow:0 20px 60px -20px rgba(0,0,0,.35),0 0 0 1px var(--line);padding:6px;margin:0;list-style:none;display:none;z-index:20;max-height:260px;overflow:auto}
.sel[data-open] .sel__list{display:block}
.sel__list li{padding:10px 12px;border-radius:9px;cursor:pointer;font-size:15px;color:var(--ink)}
.sel__list li:hover,.sel__list li[aria-selected="true"]{background:rgba(0,0,0,.05)}
.seg{display:flex;flex-wrap:wrap;gap:8px}
.seg label{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid var(--line-2);border-radius:999px;cursor:pointer;font-weight:500;font-size:15px;color:var(--ink)}
.seg input{appearance:none;width:0;height:0;margin:0}
.seg label:has(input:checked){background:var(--ink);color:#fff;border-color:var(--ink)}
.form .btn{justify-self:start;margin-top:8px}
.nap{list-style:none;margin:32px 0 0;padding:0;border-top:1px solid var(--ink)}
.nap li{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);font-size:16px}
.nap li span:first-child{font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);font-weight:600;padding-top:4px}

/* pied de page */
.ftr{background:#fff;color:var(--ink);border-top:1px solid var(--line)}
.ftr__in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:40px;padding-top:48px;padding-bottom:40px}
.ftr__brand p{margin-top:16px;max-width:36ch;font-size:14.5px;line-height:1.5}
.ftr__grp a{font-weight:600;text-decoration:underline;text-underline-offset:3px}
.ftr address{font-style:normal;font-size:14.5px;display:grid;gap:8px;margin-bottom:20px}
.ftr address span{display:flex;align-items:center;gap:9px}
.ftr address .ico{width:15px;height:15px;flex:none;color:var(--accent-ink)}
.ftr .btn{display:inline-flex}
.ftr__h{color:var(--ink);font-weight:600;margin-bottom:12px;font-size:11.5px;letter-spacing:.1em;text-transform:uppercase}
.ftr a:not(.btn){color:var(--ink)}
.ftr__in>div>a:not(.btn){display:block;padding:5px 0;font-size:14.5px}
.ftr a:not(.btn):hover{color:var(--accent-ink)}
.ftr__bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-top:18px;padding-bottom:28px;border-top:1px solid var(--line);font-size:13px;color:var(--mut)}
.ftr__bot a{display:inline;padding:0;text-decoration:underline;text-underline-offset:3px}

.rv{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.rv.in{opacity:1;transform:none}

/* ---------- mobile ---------- */
@media (max-width:1040px){
  .nav,.hdr__cta{display:none}
  .hdr__burger{display:inline-grid;margin-left:auto}
  .hero{height:auto}
  .hero__stage{position:static;height:auto;padding-top:28px;padding-bottom:24px}
  .hero__txt{transform:none;opacity:1}
  .hero__anim{height:auto;max-height:none;aspect-ratio:1080/891;width:min(100%,440px);transform:none}
  .hero__anim img{position:absolute;left:0;top:0;width:100%;height:100%;transform:none;object-fit:contain}
  .hero__anim canvas{display:none}
  .hero__lbl{display:none}
  .ed,.two,.split{grid-template-columns:1fr}
  .split--rev .split__txt{order:0}
  .two>div:first-child{position:static}
  .proof{grid-template-columns:1fr 1fr}
  .frz{grid-template-columns:1fr 1fr}
  .strip,.strip--4{grid-template-columns:1fr 1fr;gap:12px}
  .strip--4 figure:first-child{grid-column:1/-1}
  .gal{grid-template-columns:1fr 1fr}
  .gal__f,.gal__f.w3,.gal__f.w4{grid-column:span 2}
  .ftr__in{grid-template-columns:1fr 1fr}
  .form{grid-template-columns:1fr}
  .nap li{grid-template-columns:1fr;gap:4px}
  .ed__cols{columns:1}
}
@media (max-width:600px){
  body{font-size:16px}
  .proof{grid-template-columns:1fr 1fr;gap:20px}
  .frz{grid-template-columns:1fr}
  .strip,.strip--4{grid-template-columns:1fr}
  .ftr__in{grid-template-columns:1fr;gap:28px}
  .rows li{grid-template-columns:40px 1fr;gap:12px}
  .lines li a,.idx li a{grid-template-columns:1fr}
  .lines li a span,.idx p{text-align:left;max-width:none}
  .bleed img{height:60vh}
}
@media (prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  .hero__txt h1 .big,.hero__txt .sub,.hero__txt .actions,.hero__proof,.hero__anim{animation:none}
  .hero__txt{transform:none;opacity:1}
  .hero__anim{transform:none}
  .hero__anim img{transform:none}
  .hero{height:auto}
  .hero__stage{position:static;height:auto}
}
/* pages légales : articles compacts dans une seule section */
.legal h2{font-size:clamp(22px,2.2vw,28px);letter-spacing:-.02em;margin-top:44px}
.legal h2:first-child{margin-top:0}
.legal .nap{margin-top:14px}
.legal .nap li{padding:12px 0;font-size:15px}
.legal .actions{margin-top:48px}
/* plan du site : quatre colonnes de liens, même style que le pied de page */
.plan{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
.plan a{display:block;padding:6px 0;font-size:16px;color:var(--ink)}
.plan a:hover{color:var(--accent-ink)}
@media (max-width:900px){.plan{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.plan{grid-template-columns:1fr}}
/* accueil, les surfaces (variante B du 04/11) : lignes numérotées, flèche au survol */
.surf{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-2)}
.surf li a{display:grid;grid-template-columns:48px 1fr 28px;gap:0 20px;align-items:start;padding:24px 0;border-bottom:1px solid var(--line);color:var(--ink)}
.surf__n{font-variant-numeric:tabular-nums;font-weight:600;color:var(--accent-ink);font-size:14px;padding-top:9px}
.surf b{display:block;font-size:clamp(24px,2.3vw,30px);letter-spacing:-.035em;line-height:1.05}
.surf p{margin-top:8px;font-size:17px;color:var(--ink-2);max-width:48ch;line-height:1.4}
.surf .ico{width:28px;height:28px;margin-top:6px;opacity:0;transition:opacity .2s}
.surf li a:hover b{color:var(--accent-ink)}.surf li a:hover .ico{opacity:1}
.two .lede{margin-top:14px;font-size:19px;color:var(--ink-2);max-width:40ch}
/* bloc « couche par couche » du pilier : scène collante, pile à gauche, fiches à droite */
.lay{position:relative;height:340vh;height:340svh;--hp:0;margin:clamp(40px,6vw,72px) 0 0}
.lay__stage{position:sticky;top:var(--h);height:calc(100vh - var(--h));height:calc(100svh - var(--h));display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,4vw,64px);align-items:center;max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.lay__anim{position:relative;height:min(78vh,700px);transform:translateY(calc(var(--hp) * -24px))}
.lay__anim canvas,.lay__anim img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:scale(calc(1 + var(--hp) * .1))}
.lay__anim img{opacity:1;transition:opacity .3s}.lay__anim.is-ready img{opacity:0}
.lay__cards{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-2)}
.lay__cards li{padding:16px 0;border-bottom:1px solid var(--line);opacity:.3;transition:opacity .35s}
.lay__cards li.on{opacity:1}
.lay__k{display:block;font-size:13px;font-weight:600;color:var(--accent-ink);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.lay__cards b{display:block;font-size:clamp(18px,1.6vw,22px);letter-spacing:-.025em;line-height:1.1;margin-top:3px}
.lay__cards p{margin-top:6px;font-size:14.5px;line-height:1.45;color:var(--ink-2);max-width:52ch}
.lay.is-static{height:auto}.lay.is-static .lay__stage{position:static;height:auto;grid-template-columns:1fr}.lay.is-static .lay__anim{height:auto;aspect-ratio:1080/891;transform:none}
.lay.is-static .lay__anim canvas{display:none}.lay.is-static .lay__cards li{opacity:1}
@media (max-width:1040px){.lay{height:auto}.lay__stage{position:static;height:auto;grid-template-columns:1fr}.lay__anim{height:auto;aspect-ratio:1080/891;transform:none}.lay__anim canvas{display:none}.lay__cards li{opacity:1}}


/* formulaires : message d'erreur (champ nom et moyen de réponse manquants) */
.form__err{color:#B42318;font-weight:600;font-size:15px;margin:0}
.form__done{color:var(--ink);font-weight:600;font-size:16px}

/* page Contact (retour de Tim du 04/11 : « mal scindé, formulaire trop bas ») : sur ordinateur, présentation et coordonnées à gauche, formulaire à droite ;
   sur téléphone, présentation, formulaire, puis les coordonnées sous leur intertitre */
.ct{grid-template-areas:"intro form" "nap form";grid-template-rows:min-content 1fr;row-gap:0}
.ct>div:first-child{position:static}
.ct__intro{grid-area:intro}.ct__nap{grid-area:nap}.ct__form{grid-area:form}
.ct__h{display:none}
@media (max-width:1040px){
  .ct{grid-template-areas:"intro" "form" "nap";grid-template-rows:none;gap:28px}
  .ct__nap{margin-top:24px}
  .ct__h{display:block;font-size:clamp(26px,6vw,34px);font-weight:700;letter-spacing:-.035em;line-height:1.05;color:var(--ink)}
  .ct .nap{margin-top:18px}
  .ct__form{margin-top:0}
}
@media (max-width:600px){
  .hero-p--ct{padding-bottom:8px}
  .hero-p--ct h1{font-size:36px}
  .hero-p--ct .answer{font-size:17px;margin-top:14px}
  .sec--ct{padding-top:28px}
  .ct .lede{font-size:17px;margin-top:8px}
  .ct{gap:20px}
  .ct__form{gap:14px}
  .ct__form .fld input,.ct__form .fld .sel__btn{padding:10px 0}
  .ct__form .btn{justify-self:stretch;justify-content:center}
}

/* pied de page téléphone : bloc à part, aéré, blanc jusqu'au bas de l'écran */
html{background:#fff}
.ftr__m{display:none}
@media (max-width:600px){
  .ftr__in{display:none}
  .ftr__m{display:flex;flex-direction:column;align-items:flex-start;padding-top:40px;padding-bottom:28px}
  .ftr__m>p{margin-top:12px;font-size:16px;line-height:1.45;color:var(--ink)}
  .ftr__m>.btn{align-self:stretch;justify-content:center;margin-top:24px}
  .ftr__mc{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-self:stretch;margin-top:10px}
  .ftr__mc a{display:flex;align-items:center;justify-content:center;gap:8px;height:52px;border:1px solid var(--line-2);border-radius:999px;font-weight:600;font-size:16px}
  .ftr__mc .ico{width:18px;height:18px;color:var(--accent-ink)}
  .ftr__ml{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;align-self:stretch;margin-top:32px;border-top:1px solid var(--line)}
  .ftr__ml a{padding:14px 0;border-bottom:1px solid var(--line);font-size:15.5px;font-weight:500}
  .ftr__bot{flex-direction:column;gap:10px;padding-top:4px;border-top:0;padding-bottom:calc(32px + env(safe-area-inset-bottom))}
  .ftr__bot span:last-child{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px}
}

/* tiroir mobile : plein écran, cinq entrées dépliables, actions fixées en bas */
.drawer__panel{position:absolute;top:0;right:0;bottom:0;width:min(440px,100vw);background:#fff;display:flex;flex-direction:column}
.drawer__top{display:flex;justify-content:space-between;align-items:center;flex:none;height:var(--h);padding:0 var(--gut);border-bottom:1px solid var(--line)}
.drawer__top .iconbtn{margin-right:-10px}
.drawer__nav{flex:1;padding:8px var(--gut) 24px;overflow:auto}
.drawer__g{border-bottom:1px solid var(--line)}
.drawer__g summary{display:flex;justify-content:space-between;align-items:center;padding:18px 0;font-size:24px;font-weight:600;letter-spacing:-.03em;cursor:pointer;list-style:none}
.drawer__g summary::-webkit-details-marker{display:none}
.drawer__g summary .ico{width:22px;height:22px;transition:transform .2s}
.drawer__g[open] summary .ico{transform:rotate(180deg)}
.drawer__sub{display:grid;padding:0 0 14px}
.drawer__sub a{padding:9px 0;font-size:17px;color:var(--ink)}
.drawer__sub a[aria-current],.drawer__l[aria-current]{color:var(--accent-ink)}
.drawer__l{display:block;padding:18px 0;border-bottom:1px solid var(--line);font-size:24px;font-weight:600;letter-spacing:-.03em}
.drawer__foot{flex:none;display:grid;gap:10px;padding:14px var(--gut) calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff}
.drawer .drawer__foot .btn{margin-top:0;justify-content:center}

/* ---------- téléphone, revue complète du 04/11 (retour de Tim : « continue à vérifier ») ---------- */
@media (max-width:600px){
  /* tableaux : une fiche par ligne (titre = première cellule, puis intitulé de colonne + valeur), plus de défilement latéral */
  .tbl{overflow:visible}
  .tbl table,.tbl--wide table{min-width:0;display:block;font-size:15.5px}
  .tbl--wide::after{content:none}
  .tbl caption{display:block;white-space:normal;padding-bottom:12px}
  .tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .tbl tbody{display:block;border-top:1px solid var(--ink)}
  .tbl tr{display:block;padding:14px 0;border-bottom:1px solid var(--line)}
  .tbl td,.tbl--refs td:nth-child(3){display:grid;grid-template-columns:118px 1fr;gap:12px;padding:3px 0;border:0;text-align:left;white-space:normal}
  .tbl td::before{content:attr(data-label);font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--ink-2);padding-top:3px}
  .tbl td:first-child{display:block;font-size:17px;letter-spacing:-.015em;padding:0 0 6px}
  .tbl td:first-child::before{content:none}
  .tbl td[data-label=""]{display:block}.tbl td[data-label=""]::before{content:none}

  /* photo sous le titre des pages intérieures : un cadre 4/3, plus un écran entier */
  .hero-p__fig img{height:auto;aspect-ratio:4/3}
  .bleed img{height:auto;aspect-ratio:1/1}
  .bleed figcaption{left:0;right:0;bottom:0;padding:48px var(--gut) 20px;background:linear-gradient(transparent,rgba(0,0,0,.6))}

  /* rangées de photos : même marge des deux côtés ; légendes l'une sous l'autre */
  .strip,.strip--4{margin:0;padding:0;width:100%}
  .gal__f figcaption{flex-direction:column;gap:2px}

  /* respiration entre sections : 56 px au lieu de 72 */
  .sec{padding:56px 0}
  .sec--tight{padding:40px 0}

  /* boutons d'appel de fin de page : même largeur, l'un sous l'autre */
  .cta .actions,.sec .actions{flex-direction:column;align-items:stretch}
  .cta .actions .btn,.sec .actions .btn{justify-content:center}

  /* cibles tactiles : 44 px au moins */
  .lnk{padding:10px 0 6px}
  .ftr__bot a{display:inline-block;padding:10px 0}
  .plan a{padding:10px 0}
  .toc ol{gap:2px 18px}.toc a{display:inline-block;padding:7px 0}
  .filters{gap:8px}
  .filters button{border:1px solid var(--line-2);opacity:1;padding:12px 16px}
  .filters button[aria-pressed="true"]{border-color:var(--ink)}
}
/* ligne de preuves du héros : la pastille suit chaque élément, jamais seule en début de ligne */
@media (max-width:600px){
  .hero__proof{gap:6px 18px}
  .hero__proof span::before,.hero__proof span+span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent);margin:0 8px 0 0}
}
/* héros sans boutons (contact, estimation, pages légales) : pas de rangée vide de 32 px sous le texte */
@media (max-width:600px){.hero-p .actions:empty{display:none}.hero-p:has(.actions:empty){padding-bottom:8px}}

/* bandeau de consentement (assets/mesure.js, seulement quand GA4 est branché) : deux boutons de même poids, texte en encre */
.ck{position:fixed;z-index:70;left:20px;bottom:20px;width:min(420px,calc(100vw - 40px));background:var(--bg);border:1px solid var(--line-2);border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.16);padding:18px 20px}
.ck[hidden]{display:none}
.ck p{margin:0 0 14px;font-size:14px;line-height:1.5;color:var(--ink)}
.ck p a{font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--accent)}
.ck__b{display:flex;gap:10px}
.ck__b button{flex:1;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--ink);background:var(--bg);color:var(--ink);font:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s,color .15s}
.ck__b button:hover,.ck__b button:focus-visible{background:var(--ink);color:#fff}
.ck__b button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:600px){.ck{left:12px;bottom:calc(12px + env(safe-area-inset-bottom));width:calc(100vw - 24px);padding:14px 16px}.ck p{font-size:13px;margin-bottom:10px}}
