/* ═══════════════════════════════════════════════════════════════
   LA TERRASSE — feuille de style
   Salle de séminaire et rooftop, 11 rue de l'Écu, 51100 Reims

   Polices auto-hébergées (sous-ensemble latin, les seules graisses
   réellement employées). Aucun appel à un service tiers : pas de
   transfert d'adresse IP, donc pas de consentement à recueillir.
   ═══════════════════════════════════════════════════════════════ */
@font-face{font-family:"Libre Bodoni";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/libre-bodoni-400-normal-m8bhOc5.woff2") format("woff2")}
@font-face{font-family:"Libre Bodoni";font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/libre-bodoni-400-italic-CW-BWdy.woff2") format("woff2")}
@font-face{font-family:"Libre Bodoni";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/libre-bodoni-500-normal-f5U60he.woff2") format("woff2")}
@font-face{font-family:"Libre Bodoni";font-style:italic;font-weight:500;font-display:swap;src:url("../fonts/libre-bodoni-500-italic-ySU9dno.woff2") format("woff2")}
@font-face{font-family:"Libre Bodoni";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/libre-bodoni-600-normal-3Ba-6zw.woff2") format("woff2")}
@font-face{font-family:"Libre Bodoni";font-style:italic;font-weight:600;font-display:swap;src:url("../fonts/libre-bodoni-600-italic-Xt4ArZ7.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:300;font-display:swap;src:url("../fonts/archivo-300-normal-zKWmZow.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/archivo-400-normal-6zzj1o8.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:italic;font-weight:400;font-display:swap;src:url("../fonts/archivo-400-italic-rBlnQf6.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/archivo-500-normal-5_5xWHz.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/archivo-600-normal-som1JOa.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/archivo-700-normal-NpNxM9d.woff2") format("woff2")}

/* ═══════════════════════════════════════════════════════════════
   1. TOKENS
   ═══════════════════════════════════════════════════════════════ */
:root{
    /* Neutres tirés du logo : blanc dominant, noir légèrement ocré */
    --paper:#ffffff;
    --paper-2:#f6f4ef;
    --paper-3:#ece8df;
    --ink:#15130e;
    --ink-2:#4c473c;
    --ink-3:#8a8375;
    --line:#ddd8cd;
    --line-soft:#eae6dd;

    /* Doré prélevé sur le logo : #D9A61C */
    --gold:#d9a61c;
    --gold-deep:#8a6410;      /* variante accessible pour petits textes sur blanc */
    --gold-tint:rgba(217,166,28,.13);
    --gold-glow:rgba(217,166,28,.30);

    --on-gold:#15130e;
    --shadow-lift:0 30px 70px -40px rgba(21,19,14,.45);
    --shadow-card:0 1px 0 var(--line-soft);

    --wrap:1260px;
    --gutter:clamp(1.15rem,5vw,4rem);
    --sec:clamp(4.5rem,11vh,8.5rem);
    --r:2px;

    --mark:var(--logo-mark);

    /* ── les quatre usages ── */
    --ph-reunir:url("../img/ph-reunir-znRKKuC.webp");
    --ph-former:url("../img/ph-former-PrdRF2r.webp");
    --ph-creer:url("../img/ph-creer-naXymlR.webp");
    --ph-celebrer:url("../img/ph-celebrer-9bBzZDe.webp");

    /* ── photographies du lieu ── */
    --ph-sunset:url("../img/ph-sunset-7mimX4V.webp");
    --ph-baie:url("../img/ph-baie-B72XVVQ.webp");
    --ph-codir:url("../img/ph-codir-jK87uIF.webp");
    --ph-travail:url("../img/ph-travail-5nCkgik.webp");
    --ph-reveil:url("../img/ph-reveil-7MFhhlb.webp");
    --ph-logo:url("../img/ph-logo-KL4Ml0o.webp");
    --ph-rideau:url("../img/ph-rideau--mLE97D.webp");
    --ph-escapade:url("../img/ph-escapade-tvO6cKI.webp");
    --ph-xp-oeno:url("../img/ph-xp-oeno-pZaONqR.webp");
    --ph-xp-magie:url("../img/ph-xp-magie-NmpEoXn.webp");
    --ph-xp-hypnose:url("../img/ph-xp-hypnose-Y5T1BlU.webp");
    --ph-xp-photobooth:url("../img/ph-xp-photobooth-zgdR0aI.webp");
    --ph-xp-reportage:url("../img/ph-xp-reportage-U1pZNdq.webp");
    --ph-bbq:url("../img/ph-bbq-cWdtZTP.webp");
    --ph-flip:url("../img/ph-flip-K90Wuaz.webp");

    --f-display:"Libre Bodoni","Bodoni Moda","Didot","Times New Roman",serif;
    --f-body:"Archivo","Helvetica Neue",Arial,sans-serif;

    --logo-mark:url("../img/logo-mark-E21mP6W.png");
    --logo-word:url("../img/logo-word-bDe14CQ.png");
    --ease:cubic-bezier(.22,.61,.36,1);
    --ease-glass:cubic-bezier(.65,0,.35,1);
}
@media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
        --paper:#100e0a;
        --paper-2:#171410;
        --paper-3:#211d16;
        --ink:#f4f1e9;
        --ink-2:#b8b1a1;
        --ink-3:#8b8477;
        --line:#2d2820;
        --line-soft:#241f19;
        --gold:#e8b830;
        --gold-deep:#e8b830;
        --gold-tint:rgba(232,184,48,.14);
        --gold-glow:rgba(232,184,48,.28);
        --on-gold:#15130e;
        --shadow-lift:0 30px 70px -40px rgba(0,0,0,.8);
        --shadow-card:0 1px 0 var(--line-soft);
    }
}
:root[data-theme="dark"]{
    --paper:#100e0a;
    --paper-2:#171410;
    --paper-3:#211d16;
    --ink:#f4f1e9;
    --ink-2:#b8b1a1;
    --ink-3:#8b8477;
    --line:#2d2820;
    --line-soft:#241f19;
    --gold:#e8b830;
    --gold-deep:#e8b830;
    --gold-tint:rgba(232,184,48,.14);
    --gold-glow:rgba(232,184,48,.28);
    --on-gold:#15130e;
    --shadow-lift:0 30px 70px -40px rgba(0,0,0,.8);
    --shadow-card:0 1px 0 var(--line-soft);
}

/* ═══════════════════════════════════════════════════════════════
   2. BASE
   ═══════════════════════════════════════════════════════════════ */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:var(--f-body);
    font-size:1.0425rem;
    line-height:1.72;
    font-weight:400;
    overflow-x:hidden;
    -webkit-font-smoothing:antialiased;
}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px;border-radius:1px}
[hidden]{display:none !important}

h1,h2,h3,h4{
    font-family:var(--f-display);
    font-weight:500;
    line-height:1.04;
    letter-spacing:0;
    word-spacing:.04em;
    text-wrap:balance;
    margin:0;
}
h1{font-size:clamp(2.9rem,8.4vw,6.6rem);font-weight:600}
h2{font-size:clamp(2.05rem,4.8vw,3.7rem);line-height:1.05;font-weight:600}
h3{font-size:clamp(1.18rem,1.9vw,1.5rem);line-height:1.2;letter-spacing:0}
p{margin:0}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.sec{padding-block:var(--sec);position:relative}
.sec--tint{background:var(--paper-2)}
.stack{display:flex;flex-direction:column}
.lede{font-size:clamp(1.1rem,1.7vw,1.34rem);line-height:1.62;color:var(--ink-2);max-width:36ch;font-weight:300}
.measure{max-width:58ch}

.eyebrow{
    font-size:.688rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
    color:var(--gold-deep);display:inline-flex;align-items:center;gap:.7em;
    font-family:var(--f-body);
}
.eyebrow::before{content:"";width:1.9rem;height:1px;background:var(--gold);opacity:.85}
.eyebrow--plain{color:var(--ink-3)}
.eyebrow--plain::before{background:var(--line)}

.skip{
    position:absolute;left:-9999px;top:0;z-index:200;
    background:var(--ink);color:var(--paper);padding:.8rem 1.2rem;font-size:.85rem;
}
.skip:focus{left:1rem;top:1rem}

/* ── boutons ─────────────────────────────────────────────── */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:.6em;
    font-family:var(--f-body);font-size:.815rem;font-weight:600;
    letter-spacing:.11em;text-transform:uppercase;
    padding:1.06em 1.85em;border-radius:var(--r);
    border:1px solid transparent;
    transition:background .4s var(--ease),color .4s var(--ease),border-color .4s var(--ease),transform .4s var(--ease);
    text-align:center;
}
.btn--gold{background:var(--gold);color:var(--on-gold)}
.btn--gold:hover{background:var(--ink);color:var(--paper)}
.btn--ghost{border-color:var(--line);color:var(--ink)}
.btn--ghost:hover{border-color:var(--ink);background:var(--ink);color:var(--paper)}
.btn--onvideo{border-color:rgba(255,255,255,.45);color:#fff}
.btn--onvideo:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn--sm{padding:.85em 1.4em;font-size:.72rem}
.btn:active{transform:translateY(1px)}

.link-arrow{
    display:inline-flex;align-items:center;gap:.55em;
    font-size:.75rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    color:var(--gold-deep);
}
.link-arrow svg{width:1.15em;height:1.15em;transition:transform .45s var(--ease)}
.link-arrow:hover svg{transform:translateX(5px)}

/* ── logo (masques PNG issus du logo fourni) ─────────────── */
.logo{display:flex;align-items:center;gap:.72rem;line-height:0}
.logo__mark,.logo__word{
    display:block;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
    -webkit-mask-size:contain;mask-size:contain;
    -webkit-mask-position:center;mask-position:center;
}
.logo__mark{
    width:2.05rem;aspect-ratio:1;background:var(--gold);
    -webkit-mask-image:var(--logo-mark);mask-image:var(--logo-mark);
    flex:none;
}
.logo__word{
    width:8.9rem;aspect-ratio:880/96;background:currentColor;
    -webkit-mask-image:var(--logo-word);mask-image:var(--logo-word);
    transition:width .5s var(--ease),opacity .35s var(--ease);
}
.logo--stacked{flex-direction:column;align-items:flex-start;gap:1.15rem}
.logo--stacked .logo__mark{width:3.4rem}
.logo--stacked .logo__word{width:11rem}

/* ── la marque comme ornement ──────────────────────────────
   .mk = la fleur du logo en masque : elle prend la couleur
   du texte courant, donc elle s'adapte à chaque fond.       */
.mk{
    display:block;flex:none;aspect-ratio:1;background:currentColor;
    -webkit-mask:var(--mark) center/contain no-repeat;
    mask:var(--mark) center/contain no-repeat;
}
/* filet ornemental de séparation */
.orn{
    display:flex;align-items:center;gap:clamp(.9rem,2.4vw,1.5rem);
    margin-block:clamp(2.4rem,5.5vw,3.8rem);
    grid-column:1/-1; /* traverse la grille quand la section en est une */
}
.orn::before,.orn::after{content:"";flex:1;height:1px;background:var(--line-soft)}
.orn .mk{width:1.4rem;color:var(--gold);opacity:.92}
.orn--light::before,.orn--light::after{background:rgba(255,255,255,.2)}
.orn--tight{margin-block:clamp(1.6rem,3.5vw,2.4rem)}
/* filigrane : très discret, jamais lisible comme un motif */
.wm{
    position:absolute;pointer-events:none;aspect-ratio:1;background:currentColor;
    -webkit-mask:var(--mark) center/contain no-repeat;
    mask:var(--mark) center/contain no-repeat;
}
/* garde-fou : sans support des masques, pas de carrés dorés */
@supports not ((-webkit-mask-image:url("#m")) or (mask-image:url("#m"))){
    .mk,.wm{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   3. HEADER
   ═══════════════════════════════════════════════════════════════ */
.hdr{
    position:fixed;inset:0 0 auto;z-index:90;
    color:#fff;
    transition:background .5s var(--ease),color .5s var(--ease),box-shadow .5s var(--ease),padding .5s var(--ease);
    padding-block:1.35rem;
}
.hdr__in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem}
.hdr__nav{display:flex;align-items:center;gap:clamp(1rem,2.4vw,2.1rem)}
.hdr__link{
    font-size:.782rem;font-weight:500;letter-spacing:.055em;
    position:relative;padding-block:.3rem;white-space:nowrap;
}
.hdr__link::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
    background:var(--gold);transform:scaleX(0);transform-origin:left;
    transition:transform .45s var(--ease);
}
.hdr__link:hover::after,.hdr__link[aria-current="true"]::after{transform:scaleX(1)}
.hdr__360{
    display:inline-flex;align-items:center;gap:.45em;
    font-size:.7rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
    padding-left:clamp(.6rem,1.6vw,1.4rem);
    border-left:1px solid currentColor;
    opacity:.72;transition:opacity .35s var(--ease);
}
.hdr__360:hover{opacity:1}
.hdr__360 .dot{width:.44em;height:.44em;border-radius:50%;background:var(--gold);flex:none}
.hdr__actions{display:flex;align-items:center;gap:1rem}

/* .hdr--solid : pages intérieures sans header sombre, le header y est
   d'emblée dans son état « collé » pour rester lisible sur fond clair. */
.hdr.is-stuck,.hdr--solid{
    background:color-mix(in srgb,var(--paper) 88%,transparent);
    -webkit-backdrop-filter:blur(16px) saturate(1.4);
    backdrop-filter:blur(16px) saturate(1.4);
    color:var(--ink);
    box-shadow:0 1px 0 var(--line-soft);
    padding-block:.78rem;
}
@supports not (background:color-mix(in srgb,#fff 50%,transparent)){
    .hdr.is-stuck,.hdr--solid{background:var(--paper)}
}
.hdr.is-stuck .logo__word{width:0;opacity:0}
.hdr.is-stuck .hdr__cta,.hdr--solid .hdr__cta{background:var(--gold);color:var(--on-gold)}

.hdr__burger{
    display:none;width:2.6rem;height:2.6rem;
    align-items:center;justify-content:center;flex:none;
}
.hdr__burger span{
    display:block;width:1.32rem;height:1px;background:currentColor;position:relative;
    transition:transform .4s var(--ease),background .4s var(--ease);
}
.hdr__burger span::before,.hdr__burger span::after{
    content:"";position:absolute;left:0;width:100%;height:1px;background:currentColor;
    transition:transform .4s var(--ease),opacity .3s var(--ease);
}
.hdr__burger span::before{top:-6px}
.hdr__burger span::after{top:6px}
.hdr__burger[aria-expanded="true"] span{background:transparent}
.hdr__burger[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.hdr__burger[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}

/* panneau mobile */
.mnav{
    position:fixed;inset:0;z-index:88;background:var(--paper);color:var(--ink);
    display:flex;flex-direction:column;justify-content:center;gap:.2rem;
    padding:5.5rem var(--gutter) 2.5rem;
    transform:translateY(-101%);visibility:hidden;
    transition:transform .62s var(--ease-glass),visibility .62s linear;
    overflow-y:auto;
}
.mnav.is-open{transform:none;visibility:visible}
.mnav > a{
    font-family:var(--f-display);font-size:clamp(1.75rem,7.4vw,2.7rem);font-weight:500;
    padding-block:.4em;border-bottom:1px solid var(--line-soft);
    display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
}
.mnav > a span{font-family:var(--f-body);font-size:.62rem;letter-spacing:.18em;color:var(--gold-deep);font-weight:600}
.mnav__cta{margin-top:2rem;display:grid;gap:.7rem}
.mnav__cta .btn{width:100%}

/* ═══════════════════════════════════════════════════════════════
   4. SCÈNES (emplacements médias — placeholders assumés)
   ═══════════════════════════════════════════════════════════════ */
.media{position:relative;margin:0;overflow:hidden;background:var(--paper-2);isolation:isolate}
.media__tag{
    position:absolute;left:0;bottom:0;z-index:3;
    display:inline-flex;align-items:center;gap:.55em;
    font-size:.605rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    background:var(--paper);color:var(--ink-3);
    padding:.62em .9em;border-top:1px solid var(--line-soft);border-right:1px solid var(--line-soft);
    max-width:100%;
}
.media__tag::before{content:"";width:.42em;height:.42em;background:var(--gold);border-radius:50%;flex:none}
.scene{position:absolute;inset:0;z-index:1}
.scene::before,.scene::after{content:"";position:absolute;inset:0;pointer-events:none}

/* intérieur : trame de menuiseries + lumière rasante */
.scene[data-scene="salle"]{
    background:
        linear-gradient(178deg,var(--paper) 0%,var(--paper-2) 46%,var(--paper-3) 100%);
}
.scene[data-scene="salle"]::before{
    background:repeating-linear-gradient(90deg,
    transparent 0 calc(14.2857% - 1px), var(--line) calc(14.2857% - 1px) 14.2857%);
    opacity:.75;
}
.scene[data-scene="salle"]::after{
    background:
        linear-gradient(180deg,transparent 69.4%,color-mix(in srgb,var(--ink) 22%,transparent) 69.4% 69.8%,transparent 69.8%),
        radial-gradient(120% 70% at 12% 108%,var(--gold-glow) 0%,transparent 62%),
        linear-gradient(100deg,transparent 40%,rgba(255,255,255,.5) 62%,transparent 78%);
    opacity:.62;
}

/* la baie : trois grands vantaux, celui du centre ouvert sur la lumière */
.scene[data-scene="baie"]{background:var(--paper-3)}
.scene[data-scene="baie"]::before{
    background:
        linear-gradient(90deg,
        var(--paper-3) 0 31%, var(--gold) 31% calc(31% + 1.5px),
        color-mix(in srgb,var(--paper) 92%,var(--gold)) calc(31% + 1.5px) 69%,
        var(--gold) 69% calc(69% + 1.5px), var(--paper-3) calc(69% + 1.5px) 100%);
}
.scene[data-scene="baie"]::after{
    background:
        radial-gradient(90% 120% at 50% 100%,var(--gold-glow) 0,transparent 60%),
        linear-gradient(180deg,rgba(0,0,0,.06) 0,transparent 30%);
}

/* rooftop : ciel, ligne de toits, sol de terrasse */
.scene[data-scene="rooftop"]{
    background:linear-gradient(180deg,
    color-mix(in srgb,var(--paper) 88%,var(--gold)) 0%,
    var(--paper-2) 44%,
    var(--paper-3) 62%,
    color-mix(in srgb,var(--paper-3) 82%,var(--ink)) 100%);
}
.scene[data-scene="rooftop"]::before{
    background:radial-gradient(46% 40% at 78% 24%,var(--gold-glow) 0,transparent 70%);
}
.scene[data-scene="rooftop"]::after{
    top:auto;height:34%;
    background:repeating-linear-gradient(90deg,
    transparent 0 calc(5% - 1px), color-mix(in srgb,var(--ink) 14%,transparent) calc(5% - 1px) 5%);
    opacity:.5;
}

/* détail matière : lumière diagonale, un filet doré */
.scene[data-scene="detail"]{
    background:linear-gradient(126deg,var(--paper) 0%,var(--paper-2) 52%,var(--paper-3) 100%);
}
.scene[data-scene="detail"]::before{
    background:linear-gradient(126deg,transparent 44%,var(--gold) 44% calc(44% + 1px),transparent calc(44% + 1px));
    opacity:.8;
}
.scene[data-scene="detail"]::after{
    background:radial-gradient(70% 70% at 80% 15%,var(--gold-glow) 0,transparent 65%);
}

/* table / convivialité : plan de table et lumière rasante */
.scene[data-scene="table"]{
    background:linear-gradient(178deg,var(--paper) 0%,var(--paper-2) 42%,var(--paper-3) 100%);
}
.scene[data-scene="table"]::before{
    background:
        linear-gradient(180deg,transparent 55%,color-mix(in srgb,var(--ink) 16%,transparent) 55% 55.5%,transparent 55.5%),
        radial-gradient(60% 30% at 50% 74%,color-mix(in srgb,var(--ink) 8%,transparent) 0,transparent 74%);
}
.scene[data-scene="table"]::after{
    background:
        radial-gradient(30% 22% at 24% 26%,var(--gold-glow) 0,transparent 72%),
        linear-gradient(96deg,transparent 28%,rgba(255,255,255,.42) 52%,transparent 72%);
    opacity:.75;
}

/* nuit / cocktail */
.scene[data-scene="nuit"]{
    background:linear-gradient(180deg,
    color-mix(in srgb,var(--ink) 88%,var(--gold)) 0%,
    color-mix(in srgb,var(--ink) 96%,transparent) 58%,
    var(--ink) 100%);
}
.scene[data-scene="nuit"]::before{
    background:
        radial-gradient(38% 30% at 22% 78%,var(--gold-glow) 0,transparent 70%),
        radial-gradient(30% 24% at 76% 30%,rgba(255,255,255,.14) 0,transparent 70%);
}
.scene[data-scene="nuit"]::after{
    background:repeating-linear-gradient(90deg,transparent 0 calc(9% - 1px),rgba(255,255,255,.08) calc(9% - 1px) 9%);
}

/* verre sombre : la baie vue de l'intérieur, fermée */
.scene[data-scene="glass"]{background:linear-gradient(178deg,#1e1a12 0%,#151108 56%,#0d0b07 100%)}
.scene[data-scene="glass"]::before{
    background:repeating-linear-gradient(90deg,transparent 0 calc(25% - 1.5px),rgba(217,166,28,.34) calc(25% - 1.5px) 25%);
}
.scene[data-scene="glass"]::after{
    background:
        linear-gradient(104deg,transparent 32%,rgba(255,255,255,.10) 50%,transparent 66%),
        radial-gradient(80% 55% at 50% 122%,rgba(217,166,28,.18) 0,transparent 70%);
}

/* crépuscule sur les toits : l'extérieur révélé */
.scene[data-scene="dusk"]{
    background:linear-gradient(180deg,#221c14 0%,#3b2a15 25%,#7d5a1e 45%,#2b2114 60%,#12100b 100%);
}
.scene[data-scene="dusk"]::before{
    background:radial-gradient(44% 34% at 72% 40%,rgba(255,216,116,.55) 0,transparent 66%);
}
.scene[data-scene="dusk"]::after{
    top:auto;height:24%;
    background:repeating-linear-gradient(90deg,transparent 0 calc(4% - 1px),rgba(255,255,255,.07) calc(4% - 1px) 4%);
}

/* silhouette de toits rémois */
.skyline{
    position:absolute;left:0;right:0;bottom:34%;z-index:2;width:100%;height:auto;
    color:color-mix(in srgb,var(--ink) 42%,transparent);
    pointer-events:none;
}
.scene[data-scene="nuit"] ~ .skyline,
.media--dark .skyline{color:rgba(255,255,255,.22)}

/* ── photographies réelles : elles remplacent les aplats de substitution.
   Chaque image n'est déclarée qu'une fois dans :root et réutilisée ici. ── */
.scene[data-scene]{background-position:center;background-size:cover;background-repeat:no-repeat}
/* le point de mire est bas sur la plupart des clichés (ciel en haut,
   mobilier et personnes en bas) : on recadre en conséquence */
.scene[data-scene="salle"]  {background-image:var(--ph-codir);  background-position:center 60%}
.scene[data-scene="baie"]   {background-image:var(--ph-baie);   background-position:center 52%}
.scene[data-scene="rooftop"]{background-image:var(--ph-travail);background-position:center 80%}
.scene[data-scene="table"]  {background-image:var(--ph-reveil); background-position:center 84%}
.scene[data-scene="detail"] {background-image:var(--ph-logo);   background-position:center 58%}
.scene[data-scene="nuit"]   {background-image:var(--ph-sunset); background-position:center 60%}
/* la photo révélée par le rideau n'est jamais rognée : elle s'affiche en
   entier (contain). L'espace restant est comblé par la même image agrandie
   et floutée (.thres__outside::before), donc aucune bande ni bordure nette. */
.scene[data-scene="dusk"]   {background-image:var(--ph-rideau); background-position:center 50%;
    background-size:contain; background-repeat:no-repeat}
.scene[data-scene="flip"]   {background-image:var(--ph-flip);   background-position:center 50%}
/* les trames et lumières dessinées cèdent la place à la photo
   (« glass » reste un aplat : ce sont les vantaux sombres qui s'écartent) */
.scene[data-scene]:not([data-scene="glass"])::before{background:none}
.scene[data-scene]:not([data-scene="glass"])::after{
    background:linear-gradient(180deg,rgba(10,8,6,.12) 0,transparent 34%,rgba(10,8,6,.16) 100%);
    opacity:1;
}
/* ── les quatre cartes « Vous venez pour quoi ? » ──────────
   Chaque usage a désormais sa propre photo. Le point de mire
   est réglé cliché par cliché : le cadre passe du portrait
   (0,86) au bandeau (2,08) selon la largeur d'écran. */
.scene[data-scene].scene--reunir  {background-image:var(--ph-reunir);  background-position:52% 42%}
.scene[data-scene].scene--former  {background-image:var(--ph-former);  background-position:58% 48%}
.scene[data-scene].scene--creer   {background-image:var(--ph-creer);   background-position:46% 44%}
.scene[data-scene].scene--celebrer{background-image:var(--ph-celebrer);background-position:40% 46%}

/* variantes ponctuelles */
.scene[data-scene].scene--bbq {background-image:var(--ph-bbq);   background-position:center 62%}
/* « L'Escapade » dans le fil de la journée : le déjeuner en salle,
   baie ouverte sur la terrasse */
.scene[data-scene].scene--escapade{background-image:var(--ph-escapade);background-position:55% 46%}
/* sur la carte Restauration, format plus haut : on cadre sur la table
   et les plateaux plutôt que sur la baie */
.meal .scene[data-scene].scene--escapade{background-position:40% 62%}
/* ── photos des cartes « Expériences » (1200×750, affichées à 17 % d'opacité) ── */
.scene[data-scene].scene--xp-oeno{background-image:var(--ph-xp-oeno);background-position:50% 46%}
.scene[data-scene].scene--xp-magie{background-image:var(--ph-xp-magie);background-position:50% 44%}
.scene[data-scene].scene--xp-hypnose{background-image:var(--ph-xp-hypnose);background-position:50% 46%}
.scene[data-scene].scene--xp-photobooth{background-image:var(--ph-xp-photobooth);background-position:76% 52%}
.scene[data-scene].scene--xp-reportage{background-image:var(--ph-xp-reportage);background-position:50% 52%}
.scene[data-scene].scene--flip{background-image:var(--ph-flip);  background-position:center 50%}
/* la silhouette de toits dessinée n'a plus lieu d'être : ils sont sur les photos */
.skyline{display:none}

/* ═══════════════════════════════════════════════════════════════
   5. header
   ═══════════════════════════════════════════════════════════════ */
.header{
    position:relative;min-height:100svh;display:flex;align-items:flex-end;
    color:#fff;overflow:hidden;background:#100e0a;
    padding-block:8rem 3.2rem;
}
.header__bg{
    position:absolute;inset:0;z-index:0;
    background:var(--ph-sunset) center 42%/cover no-repeat;
}
.header__bg::before{
    content:"";position:absolute;inset:0;
    background:
        radial-gradient(58% 52% at 68% 30%,rgba(217,166,28,.16) 0,transparent 66%),
        linear-gradient(168deg,rgba(20,16,11,.40) 0%,rgba(12,9,6,.50) 52%,rgba(8,6,4,.72) 100%);
}
.header__sweep{
    position:absolute;top:-20%;bottom:-20%;width:34%;z-index:1;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.11) 45%,rgba(255,255,255,.02) 60%,transparent);
    filter:blur(1px);
    animation:sweep 19s var(--ease) infinite;
}
@keyframes sweep{
    0%{transform:translateX(-60%) skewX(-9deg);opacity:0}
    12%{opacity:1}
    70%{opacity:1}
    100%{transform:translateX(340%) skewX(-9deg);opacity:0}
}
.header__grad{
    position:absolute;inset:0;z-index:2;
    background:linear-gradient(180deg,rgba(10,8,6,.62) 0%,transparent 26%,transparent 44%,rgba(10,8,6,.78) 100%);
}
.header__in{position:relative;z-index:3;width:100%}
.header h1{margin-block:.55rem .95rem;max-width:15ch}
.header h1 em{font-style:italic;color:var(--gold)}
.header__sub{
    font-size:clamp(1.02rem,1.55vw,1.25rem);line-height:1.55;font-weight:300;
    color:rgba(255,255,255,.82);max-width:34ch;
}
.header .eyebrow{color:var(--gold)}
.header .eyebrow::before{background:var(--gold)}
.header__cta{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2.3rem;align-items:center}
.header__foot{
    display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
    gap:1.4rem;margin-top:3.4rem;padding-top:1.5rem;
    border-top:1px solid rgba(255,255,255,.16);
}
.header__note{
    font-size:.63rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
    color:rgba(255,255,255,.5);display:inline-flex;align-items:center;gap:.6em;
}
.header__note::before{content:"";width:.42em;height:.42em;border-radius:50%;background:var(--gold)}
.header__scroll{
    display:inline-flex;align-items:center;gap:.7em;
    font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;
    color:rgba(255,255,255,.72);
}
.header__scroll i{
    width:1px;height:2.2rem;background:linear-gradient(180deg,var(--gold),transparent);
    display:block;animation:drop 2.6s var(--ease) infinite;transform-origin:top;
}
@keyframes drop{0%,100%{transform:scaleY(.35);opacity:.5}50%{transform:scaleY(1);opacity:1}}
/* ═══════════════════════════════════════════════════════════════
   6. LA PROMESSE
   ═══════════════════════════════════════════════════════════════ */
.promise{display:grid;gap:clamp(2.4rem,5vw,5rem);grid-template-columns:1fr}

.promise h2{max-width:19ch}
.promise__body{display:flex;flex-direction:column;gap:1.5rem}
.promise__body p{color:var(--ink-2);font-weight:300;font-size:clamp(1.04rem,1.5vw,1.2rem);line-height:1.68;max-width:44ch}
.promise__body strong{font-weight:500;color:var(--ink)}

/* diagramme intérieur → ouverture → extérieur */
.thres-diagram{display:flex;align-items:center;gap:clamp(.5rem,1.6vw,1.2rem);margin-top:.6rem;flex-wrap:wrap}
.thres-diagram__node{
    font-size:.658rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
    color:var(--ink-3);padding:.6em 0;
}
.thres-diagram__node.is-key{color:var(--gold-deep)}
.thres-diagram__bar{
    flex:1 1 2.2rem;min-width:2.2rem;height:1px;background:var(--line);position:relative;overflow:hidden;
}
.thres-diagram__bar::after{
    content:"";position:absolute;inset:0;background:var(--gold);
    transform:scaleX(0);transform-origin:left;
}
.is-in .thres-diagram__bar::after{animation:slide 1.5s var(--ease-glass) forwards}
.is-in .thres-diagram__bar:nth-of-type(2)::after{animation-delay:.5s}
@keyframes slide{0%{transform:scaleX(0)}55%{transform:scaleX(1)}100%{transform:scaleX(1)}}

/* ═══════════════════════════════════════════════════════════════
   7. « VOUS VENEZ POUR QUOI ? »
   ═══════════════════════════════════════════════════════════════ */
.usecases{
    display:grid;gap:1px;background:var(--line-soft);
    grid-template-columns:1fr;margin-top:clamp(2.6rem,5vw,4rem);
    border-block:1px solid var(--line-soft);
}

.uc{
    position:relative;background:var(--paper);overflow:hidden;
    padding:clamp(1.6rem,2.6vw,2.3rem);
    min-height:clamp(15rem,26vw,20rem);
    display:flex;flex-direction:column;justify-content:space-between;gap:2.6rem;
    transition:color .5s var(--ease);
}
.uc__scene{
    position:absolute;inset:0;z-index:0;
    /* --sc va de 0 à 1 au fil du défilement (voir le script en bas de page) */
    opacity:calc(.42 + .58 * var(--sc,0));
    transform:scale(1.06);
    transition:opacity .22s linear,transform .9s var(--ease);
}
/* la photo est en filigrane, et s'avance au survol ;
   le voile clair recule d'autant pour que le texte reste lisible */
.uc__scene::after{
    content:"";position:absolute;inset:0;z-index:1;
    background:linear-gradient(180deg,rgba(247,244,236,.58) 0,rgba(247,244,236,.80) 100%);
    /* le voile clair recule à mesure que la photo se révèle */
    opacity:calc(1 - .28 * var(--sc,0));
    transition:opacity .22s linear;
}
.uc:hover .uc__scene,.uc:focus-visible .uc__scene{opacity:1;transform:none}
.uc:hover .uc__scene::after,.uc:focus-visible .uc__scene::after{opacity:.72}
.uc__num{
    position:relative;z-index:2;
    font-family:var(--f-display);font-size:.95rem;font-style:italic;color:var(--gold-deep);
}
.uc__b{position:relative;z-index:2;display:flex;flex-direction:column;gap:.55rem}
.uc h3{font-size:clamp(1.5rem,2.5vw,2rem)}
.uc p{font-size:.875rem;color:var(--ink-2);line-height:1.55;max-width:26ch}
.uc__arrow{
    position:relative;z-index:2;width:1.6rem;height:1.6rem;margin-top:.5rem;
    color:var(--gold-deep);opacity:0;transform:translateX(-6px);
    transition:opacity .45s var(--ease),transform .45s var(--ease);
}
.uc:hover .uc__arrow,.uc:focus-visible .uc__arrow{opacity:1;transform:none}
.uc::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold);
    transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease);z-index:3;
}
.uc:hover::after,.uc:focus-visible::after{transform:scaleX(1)}

/* ═══════════════════════════════════════════════════════════════
   8. TIMELINE « UNE JOURNÉE ICI »
   ═══════════════════════════════════════════════════════════════ */
.day{display:grid;gap:clamp(2rem,4vw,3.4rem);grid-template-columns:1fr}

.day__media{position:relative;aspect-ratio:4/3.1;border:1px solid var(--line-soft)}

.day__slide{position:absolute;inset:0;opacity:0;transition:opacity .5s var(--ease);pointer-events:none}
.day__slide.is-on{opacity:1}
.day__caption{
    position:absolute;left:0;right:0;bottom:0;z-index:4;padding:1.4rem;
    background:linear-gradient(180deg,transparent,rgba(10,8,6,.72));
    color:#fff;display:flex;flex-direction:column;gap:.2rem;
}
.day__caption b{font-family:var(--f-display);font-size:1.35rem;font-weight:400}
.day__caption span{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.7);font-weight:600}

/* défilement automatique : jauge de progression et commande de pause */
.day__prog{
    position:absolute;left:0;right:0;bottom:0;z-index:6;height:2px;
    background:rgba(255,255,255,.22);overflow:hidden;
}
.day__prog i{
    display:block;height:100%;width:100%;background:var(--gold);
    transform:scaleX(0);transform-origin:left;
}
.day__media.is-playing .day__prog i{animation:dayprog var(--day-dur,3s) linear forwards}
.day__media.is-paused .day__prog i{animation-play-state:paused}
@keyframes dayprog{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.day__pause{
    position:absolute;right:1rem;bottom:1.15rem;z-index:7;
    display:inline-flex;align-items:center;gap:.5em;
    font-family:var(--f-body);font-size:.6rem;font-weight:600;
    letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.82);
    padding:.45em .7em;border:1px solid rgba(255,255,255,.3);
    -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
    transition:background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
}
.day__pause::before{content:"";width:.4rem;height:.4rem;background:var(--gold);flex:none}
.day__pause[aria-pressed="true"]::before{border-radius:50%}
.day__pause:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.55);color:#fff}
@media (prefers-reduced-motion:reduce){.day__prog,.day__pause{display:none}}

.tl{list-style:none;margin:0;padding:0;position:relative}
.tl::before{content:"";position:absolute;left:0;top:.9rem;bottom:.9rem;width:1px;background:var(--line)}
.tl__item{position:relative}
.tl__btn{
    width:100%;display:grid;grid-template-columns:auto 1fr;gap:0 1.5rem;
    padding:1.1rem 0 1.1rem 1.9rem;text-align:left;align-items:baseline;
    border-bottom:1px solid var(--line-soft);
    transition:padding-left .45s var(--ease);
}
.tl__btn::before{
    content:"";position:absolute;left:-4.5px;top:1.72rem;
    width:9px;height:9px;border-radius:50%;
    background:var(--paper);border:1px solid var(--line);
    transition:background .4s var(--ease),border-color .4s var(--ease),transform .4s var(--ease);
}
.tl__btn:hover{padding-left:2.3rem}
.tl__item.is-active .tl__btn::before{background:var(--gold);border-color:var(--gold);transform:scale(1.35)}
.tl__h{
    font-family:var(--f-display);font-size:clamp(1.28rem,2.1vw,1.7rem);font-weight:500;
    font-variant-numeric:tabular-nums;letter-spacing:-.01em;color:var(--ink-3);
    transition:color .4s var(--ease);
}
.tl__item.is-active .tl__h{color:var(--ink)}
.tl__t{display:flex;flex-direction:column;gap:.18rem}
.tl__t b{font-size:.95rem;font-weight:500}
.tl__t span{font-size:.85rem;color:var(--ink-2);line-height:1.5}

.day__foot{
    margin-top:1.6rem;font-size:.87rem;color:var(--ink-2);font-style:italic;
    font-family:var(--f-display);font-size:1.05rem;
}

/* ═══════════════════════════════════════════════════════════════
   9. LA SALLE — chiffres, équipements, galerie
   ═══════════════════════════════════════════════════════════════ */
.room__head{display:grid;gap:clamp(1.6rem,4vw,4rem);grid-template-columns:1fr;align-items:end}

.room__head h2{max-width:16ch}
.room__head p{color:var(--ink-2);font-weight:300;max-width:40ch}

.stats{
    display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line-soft);
    margin-block:clamp(2.6rem,5vw,4rem);border:1px solid var(--line-soft);
}

.stat{background:var(--paper);padding:clamp(1.3rem,2.4vw,2.1rem);display:flex;flex-direction:column;gap:.5rem}
.stat__v{
    font-family:var(--f-display);font-size:clamp(2rem,4vw,3rem);line-height:1;
    font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.stat__v i{font-style:normal;font-size:.42em;color:var(--gold-deep);margin-left:.15em;vertical-align:.65em}
.stat__k{font-size:.7rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}
.stat--gold .stat__v{color:var(--gold-deep);font-size:clamp(1.35rem,2.4vw,1.85rem);line-height:1.15}

.equip{display:grid;gap:clamp(1.6rem,4vw,3.6rem);grid-template-columns:1fr}

.equip__list{
    list-style:none;margin:0;padding:0;
    display:grid;grid-template-columns:1fr;gap:1px;background:var(--line-soft);
    border-block:1px solid var(--line-soft);
}

.equip__list li{
    background:var(--paper);padding:1.05rem 1.15rem;
    display:flex;align-items:center;gap:.85rem;font-size:.9rem;
    transition:background .4s var(--ease);
}
.equip__list li:hover{background:var(--paper-2)}
.equip__list svg{width:1.15rem;height:1.15rem;color:var(--gold-deep);flex:none}
/* une case peut porter deux pictos (borne d'arcade et flipper) */
.equip__duo{display:inline-flex;align-items:center;gap:.42rem;flex:none}
.equip__kicker{
    margin-top:2rem;font-family:var(--f-display);font-size:clamp(1.3rem,2.4vw,1.85rem);
    line-height:1.22;max-width:24ch;
}
.equip__kicker em{font-style:italic;color:var(--gold-deep)}

/* galerie */
.gal{
    display:grid;gap:1px;background:var(--line-soft);
    grid-template-columns:repeat(2,1fr);
    margin-top:clamp(2.6rem,5vw,4rem);border:1px solid var(--line-soft);
}

.gal__cell{
    position:relative;aspect-ratio:1;background:var(--paper);overflow:hidden;
    display:block;width:100%;padding:0;border:0;
}
.gal__cell .scene{transition:transform 1s var(--ease)}
.gal__cell:hover .scene,.gal__cell:focus-visible .scene{transform:scale(1.05)}
.gal__cap{
    position:absolute;inset:auto 0 0 0;z-index:4;padding:.9rem 1rem;
    font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
    color:var(--ink-2);background:linear-gradient(180deg,transparent,var(--paper) 70%);
    text-align:left;
}
.gal__zoom{
    position:absolute;top:.75rem;right:.75rem;z-index:4;
    width:2rem;height:2rem;border-radius:50%;background:var(--paper);color:var(--gold-deep);
    display:grid;place-items:center;opacity:0;transform:scale(.8);
    transition:opacity .4s var(--ease),transform .4s var(--ease);
}
.gal__cell:hover .gal__zoom,.gal__cell:focus-visible .gal__zoom{opacity:1;transform:none}
.gal__zoom svg{width:.95rem;height:.95rem}

/* ═══════════════════════════════════════════════════════════════
   10. VISITE 360°
   ═══════════════════════════════════════════════════════════════ */
/* section volontairement toujours sombre (immersion) */
.tour{background:#0f0d09;color:#f4f1e9;position:relative;overflow:hidden}
.tour__head{display:grid;gap:clamp(1.4rem,3vw,3rem);grid-template-columns:1fr;align-items:end;margin-bottom:clamp(2rem,4vw,3rem)}

.tour__head h2{color:#fff;max-width:18ch}
.tour__head p{color:rgba(255,255,255,.68);font-weight:300;max-width:40ch}
.tour .eyebrow{color:var(--gold)}
.tour .eyebrow::before{background:var(--gold)}

.pano{
    position:relative;border:1px solid rgba(255,255,255,.16);
    aspect-ratio:16/8.4;overflow:hidden;background:#0c0a07;cursor:grab;
    touch-action:pan-y;
}
.pano.is-grabbing{cursor:grabbing}
.pano__strip{
    position:absolute;top:0;bottom:0;left:0;width:300%;display:flex;
    will-change:transform;
}
.pano__seg{flex:1 1 0;position:relative;overflow:hidden}
.pano__seg::after{
    content:attr(data-label);
    position:absolute;left:1.1rem;top:1.1rem;z-index:5;
    font-size:.63rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
    color:#fff;background:rgba(12,10,7,.62);padding:.5em .85em;
    -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.pano__seg + .pano__seg{box-shadow:inset 2px 0 0 var(--gold)}
.pano__veil{
    position:absolute;inset:0;z-index:6;pointer-events:none;
    background:radial-gradient(120% 90% at 50% 50%,transparent 50%,rgba(0,0,0,.55) 100%);
}
.pano__hint{
    position:absolute;left:50%;bottom:1.1rem;transform:translateX(-50%);z-index:7;
    display:inline-flex;align-items:center;gap:.7em;
    font-size:.63rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;
    color:rgba(255,255,255,.8);background:rgba(12,10,7,.55);
    -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
    padding:.6em 1em;border:1px solid rgba(255,255,255,.14);
    transition:opacity .5s var(--ease);
}
.pano.is-touched .pano__hint{opacity:0}
.pano__hint svg{width:1.1em;height:1.1em;animation:nudge 2.4s var(--ease) infinite}
@keyframes nudge{0%,100%{transform:translateX(-3px)}50%{transform:translateX(3px)}}
.pano__cta{
    position:absolute;inset:auto 1.1rem 1.1rem auto;z-index:7;
}
/* ── visite 360° indisponible ─────────────────────────────────
   Écran posé au-dessus de l'aperçu, qui reste visible en fond mais
   figé et assombri. Le panneau garde la typographie et l'or de la
   charte : c'est une information, pas un message d'erreur système. */
.pano--off{cursor:default;touch-action:auto}
/* sans le script, la bande de 300 % resterait calée sur le premier
   segment : on la ramène à la largeur du cadre pour montrer les trois
   vues d'un coup — salle, baie, rooftop. */
.pano--off .pano__strip{width:100%}
.pano--off .pano__seg::after{opacity:.4;font-size:.56rem;left:.8rem;top:.8rem}

.pano--off .pano__veil{
    background:
        radial-gradient(120% 90% at 50% 45%,rgba(10,8,6,.34) 0,rgba(8,6,4,.86) 100%),
        linear-gradient(180deg,rgba(8,6,4,.5) 0,rgba(8,6,4,.62) 100%);
}
.tour__off{
    position:absolute;inset:0;z-index:8;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:.55rem;text-align:center;padding:clamp(1.4rem,4vw,2.6rem);
    color:#fff;
}
.tour__off-mk{width:2.35rem;color:var(--gold);opacity:.95;margin-bottom:.15rem}
.tour__off-kick{
    margin:0;font-size:.63rem;font-weight:600;letter-spacing:.24em;
    text-transform:uppercase;color:rgba(255,255,255,.62);
}
.tour__off-t{
    margin:0;font-family:var(--f-display);font-weight:600;
    font-size:clamp(1.65rem,4.4vw,2.9rem);line-height:1.08;
    text-shadow:0 2px 26px rgba(8,6,4,.6);
}
.tour__off-p{
    margin:.35rem 0 0;max-width:46ch;font-weight:300;
    font-size:clamp(.82rem,1.35vw,.95rem);line-height:1.6;
    color:rgba(255,255,255,.82);text-shadow:0 1px 14px rgba(8,6,4,.6);
}
.tour__off-cta{
    display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-top:1.15rem;
}

.tour__note{
    margin-top:1.2rem;font-size:.72rem;letter-spacing:.04em;color:rgba(255,255,255,.45);
    display:flex;align-items:center;gap:.6em;flex-wrap:wrap;
}
.tour__note::before{content:"";width:.4em;height:.4em;border-radius:50%;background:var(--gold);flex:none}

/* dock flottant réseaux sociaux */
.fab{
    position:fixed;right:clamp(.9rem,2.5vw,1.6rem);bottom:clamp(.9rem,2.5vw,1.6rem);z-index:80;
    display:flex;align-items:center;gap:.5rem;
    opacity:0;transform:translateY(14px) scale(.96);pointer-events:none;
    transition:opacity .5s var(--ease),transform .5s var(--ease);
}
.fab.is-on{opacity:1;transform:none;pointer-events:auto}
.fab__soc{
    display:inline-flex;align-items:center;justify-content:center;
    width:2.85rem;height:2.85rem;border-radius:50%;
    background:var(--ink);color:var(--paper);
    box-shadow:var(--shadow-lift);
    transition:background .4s var(--ease),color .4s var(--ease),transform .4s var(--ease);
}
:root[data-theme="dark"] .fab__soc,:root:not([data-theme="light"]) .fab__soc{box-shadow:0 20px 50px -25px rgba(0,0,0,.9)}
.fab__soc:hover{background:var(--gold);color:var(--on-gold);transform:translateY(-3px)}
.fab__soc svg{width:1.15rem;height:1.15rem;fill:currentColor;display:block}
/* retour en haut : la marque du logo comme bouton */
.fab__top{color:var(--gold);margin-right:.35rem}
.fab__top .mk{width:1.35rem}
.fab__top:hover{color:var(--on-gold)}

@keyframes pulse{0%{transform:scale(.7);opacity:.9}70%{transform:scale(1.45);opacity:0}100%{opacity:0}}

/* réseaux sociaux — fiche contact / footer */
.soc{display:flex;flex-direction:row;align-items:center;gap:.55rem;margin-top:.25rem}
.soc a{
    display:inline-flex;align-items:center;justify-content:center;
    width:2.2rem;height:2.2rem;border-radius:50%;
    border:1px solid rgba(255,255,255,.28);color:#fff;
    transition:background .35s var(--ease),color .35s var(--ease),border-color .35s var(--ease);
}
.soc a:hover{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.soc svg{width:1rem;height:1rem;fill:currentColor;display:block}
.ftr .soc a{border-color:var(--line);color:var(--ink-2)}
.ftr .soc a:hover{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}

/* ═══════════════════════════════════════════════════════════════
   11. SECTION SIGNATURE — LA BAIE S'OUVRE
   ═══════════════════════════════════════════════════════════════ */
.thres{position:relative;height:290vh;background:#0f0d09}

.thres__stage{
    position:sticky;top:0;height:100svh;overflow:hidden;
    display:grid;place-items:center;
}
.thres__outside{position:absolute;inset:0;z-index:0}
/* prolongement flouté de la photo : remplit les côtés (ou le haut et le bas)
   sans créer de bande nette. inset négatif pour masquer les bords du flou. */
.thres__outside::before{
    content:"";position:absolute;inset:-10%;z-index:-1;
    background:var(--ph-rideau) center/cover no-repeat;
    transform:scale(1.35);
    filter:blur(52px) saturate(.85) brightness(1.28);
}
.thres__panes{position:absolute;inset:0;z-index:1;display:flex}
.thres__pane{
    flex:1 1 50%;position:relative;overflow:hidden;
    will-change:transform;
}
/* pas de liseré ni d'arête nette sur les côtés : les vantaux se fondent
   dans la photo par un dégradé, l'ouverture n'a plus de bordure visible */
.thres__pane--l{
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 86%,transparent 100%);
    mask-image:linear-gradient(90deg,#000 0,#000 86%,transparent 100%);
}
.thres__pane--r{
    -webkit-mask-image:linear-gradient(270deg,#000 0,#000 86%,transparent 100%);
    mask-image:linear-gradient(270deg,#000 0,#000 86%,transparent 100%);
}
.thres__pane .scene{transform:scale(1.02)}
.thres__mullion{
    position:absolute;top:0;bottom:0;width:1.5px;opacity:.42;
    background:linear-gradient(180deg,rgba(217,166,28,.25),var(--gold) 45%,rgba(217,166,28,.3));
}
.thres__copy{
    position:relative;z-index:3;text-align:center;color:#fff;
    padding-inline:var(--gutter);max-width:44rem;
    display:flex;flex-direction:column;align-items:center;gap:1.15rem;
}
.thres__copy h2{color:#fff;font-size:clamp(2.3rem,7vw,5.2rem);text-shadow:0 2px 26px rgba(8,6,4,.55)}
.thres__copy h2 em{font-style:italic;color:var(--gold)}
.thres__copy p{color:rgba(255,255,255,.9);font-weight:300;max-width:40ch;font-size:clamp(1rem,1.5vw,1.18rem);text-shadow:0 1px 16px rgba(8,6,4,.6)}
.thres__copy .eyebrow{color:var(--gold)}
.thres__copy .eyebrow::before{background:var(--gold)}
.thres__scrim{position:absolute;inset:0;z-index:2;background:rgba(10,8,6,.92);opacity:.44;transition:opacity .4s linear}
.thres__chips{
    display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-top:.6rem;
}
.thres__chips span{
    font-size:.665rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
    color:#fff;border:1px solid rgba(255,255,255,.32);padding:.5em .85em;border-radius:100px;
}
.thres__prog{
    position:absolute;left:50%;bottom:1.6rem;transform:translateX(-50%);z-index:4;
    width:min(16rem,44vw);height:1px;background:rgba(255,255,255,.24);
}
.thres__prog i{display:block;height:100%;background:var(--gold);transform-origin:left;transform:scaleX(0)}
.thres__prog em{
    position:absolute;left:0;top:-1.6rem;font-style:normal;
    font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;font-weight:600;
    color:rgba(255,255,255,.6);white-space:nowrap;
}
.thres__kicker{
    text-align:center;padding-block:clamp(3rem,7vw,5.5rem);
    font-family:var(--f-display);font-size:clamp(1.4rem,3.4vw,2.5rem);font-weight:500;
    line-height:1.28;max-width:30ch;margin-inline:auto;color:#f4f1e9;
}
.thres__kicker em{font-style:italic;color:var(--gold)}
.thres__outside .skyline{bottom:4%;height:clamp(56px,10vh,120px);color:rgba(10,8,6,.9)}

/* ═══════════════════════════════════════════════════════════════
   12. EXPÉRIENCES
   ═══════════════════════════════════════════════════════════════ */
.xp{
    display:grid;gap:1px;background:var(--line-soft);grid-template-columns:1fr;
    margin-top:clamp(2.4rem,5vw,3.6rem);border:1px solid var(--line-soft);
}

.xp__card{
    position:relative;background:var(--paper);overflow:hidden;
    min-height:clamp(13rem,20vw,16rem);
    padding:clamp(1.4rem,2.4vw,2rem);
    display:flex;flex-direction:column;justify-content:flex-end;gap:.45rem;
}
.xp__card .scene{opacity:calc(.17 + .21 * var(--sc,0));transition:opacity .22s linear,transform 1s var(--ease)}
.xp__card:hover .scene{opacity:.38;transform:scale(1.05)}
.xp__ico,.xp__card h3,.xp__card p{position:relative;z-index:2}
.xp__ico{
    align-self:flex-start;margin-bottom:auto;
    width:2.8rem;height:2.8rem;display:grid;place-items:center;
    border:1px solid var(--line);border-radius:50%;color:var(--gold-deep);
    background:var(--paper);
    transition:background .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease);
}
.xp__card:hover .xp__ico{background:var(--gold);color:var(--on-gold);border-color:var(--gold)}
.xp__ico svg{width:1.25rem;height:1.25rem}
.xp__card h3{font-size:clamp(1.22rem,1.9vw,1.45rem)}
.xp__card p{font-size:.855rem;color:var(--ink-2);line-height:1.5;max-width:28ch}
.xp__kicker{
    margin-top:clamp(2rem,4vw,2.8rem);font-family:var(--f-display);font-style:italic;
    font-size:clamp(1.05rem,2.25vw,1.7rem);color:var(--ink-2);
}
/* d'un seul tenant dès qu'il y a la place ; elle se replie sur mobile */

/* ═══════════════════════════════════════════════════════════════
   13. CONFIGURATEUR
   ═══════════════════════════════════════════════════════════════ */
.cfg{background:var(--paper-2)}
.cfg__head{display:grid;gap:1.6rem;grid-template-columns:1fr;align-items:end;margin-bottom:clamp(2rem,4vw,3rem)}

.cfg__head h2{max-width:17ch}
.cfg__head p{color:var(--ink-2);font-weight:300;max-width:38ch}

.cfg__grid{display:grid;gap:1px;background:var(--line);grid-template-columns:1fr;border:1px solid var(--line)}

.cfg__panel{background:var(--paper);padding:clamp(1.4rem,3vw,2.6rem)}

.cfg__steps{display:flex;align-items:center;gap:.55rem;margin-bottom:2rem;flex-wrap:wrap}
.cfg__dot{
    display:inline-flex;align-items:center;gap:.45em;
    font-size:.63rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
    color:var(--ink-3);
}
.cfg__dot i{
    width:1.5rem;height:1.5rem;border-radius:50%;border:1px solid var(--line);
    display:grid;place-items:center;font-style:normal;font-size:.66rem;
    font-family:var(--f-body);font-variant-numeric:tabular-nums;
    transition:background .4s var(--ease),border-color .4s var(--ease),color .4s var(--ease);
}
.cfg__dot.is-done i{background:var(--gold-tint);border-color:var(--gold);color:var(--gold-deep)}
.cfg__dot.is-now{color:var(--ink)}
.cfg__dot.is-now i{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.cfg__sep{flex:1 1 .8rem;min-width:.6rem;height:1px;background:var(--line)}

.cfg__q{font-family:var(--f-display);font-size:clamp(1.5rem,2.8vw,2.1rem);margin-bottom:.4rem}
.cfg__hint{font-size:.79rem;color:var(--ink-3);margin-bottom:1.6rem}
.cfg__opts{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fit,minmax(8.5rem,1fr))}
.opt{
    position:relative;border:1px solid var(--line);background:var(--paper);
    padding:1.05rem 1.1rem;text-align:left;border-radius:var(--r);
    display:flex;flex-direction:column;gap:.22rem;cursor:pointer;
    transition:border-color .35s var(--ease),background .35s var(--ease),transform .35s var(--ease);
}
.opt:hover{border-color:var(--ink-3);transform:translateY(-2px)}
/* .opt est maintenant un <label> englobant un vrai <input type="radio|checkbox">,
   masqué visuellement (l'état coché piloté par Stimulus reste sur [aria-pressed]) */
.opt__input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.opt__input:focus-visible ~ *{outline:2px solid var(--gold-deep);outline-offset:2px}
.opt b{font-size:.94rem;font-weight:500}
.opt span{font-size:.74rem;color:var(--ink-3);line-height:1.4}
.opt[aria-pressed="true"]{border-color:var(--gold);background:var(--gold-tint)}
.opt[aria-pressed="true"]::after{
    content:"";position:absolute;top:.6rem;right:.6rem;width:.5rem;height:.5rem;
    border-radius:50%;background:var(--gold);
}
/* options illustrées — configuration de salle */
/* quatre dispositions en 2 × 2 : assez grand pour juger d'un plan de salle */
.cfg__opts--img{grid-template-columns:repeat(2,1fr)}

.opt--img{padding:0;gap:0;overflow:hidden}
.opt__ph{
    display:block;width:100%;aspect-ratio:3/2;object-fit:cover;
    border-bottom:1px solid var(--line-soft);
    filter:saturate(.9);transition:transform .6s var(--ease),filter .45s var(--ease);
}
.opt--img:hover .opt__ph{transform:scale(1.045)}
.opt--img[aria-pressed="true"] .opt__ph{filter:none}
.opt--img .opt__txt{
    display:flex;flex-direction:column;gap:.24rem;
    padding:.85rem 1rem 1.05rem;color:var(--ink);font-size:1rem;
}
.opt--wide{grid-column:1/-1}
.opt--img[aria-pressed="true"]::after{
    top:.7rem;right:.7rem;box-shadow:0 0 0 3px rgba(255,255,255,.9);
}

.cfg__nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:2rem;flex-wrap:wrap}
.cfg__back{
    font-size:.72rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);
}
.cfg__back:hover{color:var(--ink)}
.cfg__back[hidden]{display:none}

/* récapitulatif */
.cfg__side{background:var(--paper);padding:clamp(1.4rem,3vw,2.6rem);display:flex;flex-direction:column}
.cfg__side[hidden]{display:none}
.cfg__sideh{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}
.cfg__sideh b{font-family:var(--f-display);font-size:1.4rem;font-weight:400;white-space:nowrap}
.cfg__sideh span{font-size:.65rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);text-align:right}
.prog{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.prog li{
    display:grid;grid-template-columns:3.6rem 1fr;gap:1rem;align-items:baseline;
    padding-block:.72rem;border-bottom:1px solid var(--line-soft);
    animation:fadeUp .5s var(--ease) backwards;
}
.prog li time{
    font-family:var(--f-display);font-size:1.02rem;font-variant-numeric:tabular-nums;color:var(--gold-deep);
}
.prog li span{font-size:.9rem}
.prog li em{display:block;font-style:normal;font-size:.75rem;color:var(--ink-3)}
.prog li.prog__h{
    display:block;padding-block:1.1rem .3rem;
    font-size:.65rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-deep);
}
.prog li.prog__opt{grid-template-columns:1fr}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.cfg__emptybox{display:flex;flex-direction:column;gap:.8rem;padding-block:1.1rem}
.cfg__emptybox .mk{width:1.55rem;color:var(--gold);opacity:.3}
.cfg__empty{font-size:.87rem;color:var(--ink-3);font-style:italic}
.cfg__side .btn{margin-top:auto}
.cfg__sidefoot{margin-top:1.6rem;display:flex;flex-direction:column;gap:.7rem}
.cfg__sidefoot small{font-size:.7rem;color:var(--ink-3);line-height:1.5}
/* rappel du programme en tête de l'étape des coordonnées */
.cfg__recap{margin-bottom:1.8rem;padding:1.1rem 1.2rem;border:1px solid var(--line-soft);border-radius:var(--r);background:var(--gold-tint)}
.cfg__recaph{display:block;font-family:var(--f-display);font-size:1.15rem;font-weight:400;margin-bottom:.4rem}
.cfg__recap .prog li:last-child{border-bottom:0}
.cfg__recap:has(.prog:empty){display:none}

/* formulaire */
.form{display:grid;gap:.95rem;grid-template-columns:1fr}
form ul {list-style:none;margin:0;padding:0}
.field{display:flex;flex-direction:column;gap:.4rem}
.field--full{grid-column:1/-1}
.field label{font-size:.66rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3)}
.field input,.field textarea{
    font:inherit;font-size:.94rem;color:var(--ink);background:var(--paper);
    border:1px solid var(--line);border-radius:var(--r);padding:.82rem .9rem;
    transition:border-color .35s var(--ease);width:100%;
}
textarea{
    field-sizing: content;
    max-height: 51h;
}
.field input:focus,.field textarea:focus{border-color:var(--gold);outline-offset:1px}
.field textarea{resize:vertical;min-height:5.5rem}
.form__foot{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:1rem;justify-content:space-between}
.form__foot small{font-size:.7rem;color:var(--ink-3);max-width:34ch;line-height:1.5}
.cfg__done{
    border:1px solid var(--gold);background:var(--gold-tint);padding:1.6rem;
    display:flex;flex-direction:column;gap:.5rem;
}
.cfg__done b{font-family:var(--f-display);font-size:1.5rem;font-weight:400}
.cfg__done p{font-size:.9rem;color:var(--ink-2)}
.cfg__done .mk{width:1.8rem;color:var(--gold-deep);margin-bottom:.3rem}

/* ═══════════════════════════════════════════════════════════════
   13b. NOS PARTENAIRES
   ═══════════════════════════════════════════════════════════════ */
.part{
    display:grid;gap:1px;background:var(--line-soft);grid-template-columns:1fr;
    border:1px solid var(--line-soft);margin-top:clamp(2.4rem,5vw,3.6rem);
}

.part__c{
    background:var(--paper);padding:clamp(1.5rem,2.8vw,2.1rem);
    display:flex;flex-direction:column;align-items:center;gap:1.15rem;text-align:center;
    transition:background .45s var(--ease);
}
.part__c:hover{background:var(--paper-2)}
.part__logo{height:6rem;width:100%;max-width:13.5rem;margin-inline:auto}
.part__logo img{
    width:100%;height:100%;display:block;
    object-fit:contain;object-position:center;
}
.part__b{
    width:100%;padding-top:1.05rem;border-top:1px solid var(--line-soft);
    display:flex;flex-direction:column;gap:.35rem;
}
.part__n{font-family:var(--f-display);font-size:1.1rem;font-weight:500;line-height:1.25}
.part__r{
    font-size:.615rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3);
}
/* le logo monochrome doit s'inverser sur fond sombre */
@media (prefers-color-scheme:dark){
    :root:not([data-theme="light"]) .part__logo--mono img{filter:invert(1) brightness(1.7)}
}
:root[data-theme="dark"] .part__logo--mono img{filter:invert(1) brightness(1.7)}

/* ═══════════════════════════════════════════════════════════════
   14. FORMULES
   ═══════════════════════════════════════════════════════════════ */
.plans{display:grid;gap:1px;background:var(--line-soft);grid-template-columns:1fr;margin-top:clamp(2.4rem,5vw,3.6rem);border:1px solid var(--line-soft)}

.plan{
    background:var(--paper);padding:clamp(1.6rem,3vw,2.4rem);
    display:flex;flex-direction:column;gap:1.1rem;position:relative;
    transition:background .45s var(--ease);
}
.plan:hover{background:var(--paper-2)}
.plan--star{background:var(--paper-2)}
.plan--star:hover{background:var(--paper-3)}
.plan__flag{
    position:absolute;top:0;right:0;
    font-size:.6rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    background:var(--gold);color:var(--on-gold);padding:.5em .8em;
}
.plan__mk{width:1.45rem;color:var(--gold-deep);opacity:.72;margin-bottom:-.55rem}
.plan--star .plan__mk{opacity:1;color:var(--gold-deep)}
.plan h3{font-family:var(--f-display);font-size:clamp(1.5rem,2.6vw,1.95rem)}
.plan__desc{font-size:.88rem;color:var(--ink-2);line-height:1.55}
.plan__inc{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem;font-size:.855rem}
.plan__inc li{display:flex;gap:.65rem;align-items:flex-start;color:var(--ink-2)}
.plan__inc li::before{
    content:"";width:.4rem;height:.4rem;margin-top:.52rem;flex:none;
    border-radius:50%;background:var(--gold);
}
.plan__act{
    margin-top:auto;padding-top:1.35rem;border-top:1px solid var(--line-soft);
    display:flex;flex-direction:column;align-items:flex-start;
}
.plans__note{margin-top:1.4rem;font-size:.78rem;color:var(--ink-3);max-width:60ch}

/* ═══════════════════════════════════════════════════════════════
   14b. AVIS
   ═══════════════════════════════════════════════════════════════ */
.avis{
    display:grid;gap:1px;background:var(--line-soft);grid-template-columns:1fr;
    border:1px solid var(--line-soft);margin-top:clamp(2.4rem,5vw,3.6rem);
}

.avis__c{
    margin:0;background:var(--paper);padding:clamp(1.6rem,3vw,2.3rem);
    display:flex;flex-direction:column;gap:1.1rem;
    transition:background .45s var(--ease);
}
.avis__c:hover{background:var(--paper-2)}
.avis__c .mk{width:1.2rem;color:var(--gold);opacity:.8}
.avis__q{
    margin:0;   /* le navigateur en met 40px de côté par défaut */
    font-family:var(--f-display);font-weight:500;
    font-size:clamp(1.04rem,1.65vw,1.26rem);line-height:1.52;color:var(--ink);
}
.avis__f{
    margin-top:auto;padding-top:1.05rem;border-top:1px solid var(--line-soft);
    display:flex;flex-direction:column;gap:.28rem;
}
.avis__n{font-size:.895rem;font-weight:500;color:var(--ink)}
.avis__m{
    font-size:.65rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);
}

/* ═══════════════════════════════════════════════════════════════
   15. ACCÈS
   ═══════════════════════════════════════════════════════════════ */
.acc{display:grid;gap:clamp(2rem,4vw,3.4rem);grid-template-columns:1fr;align-items:start}

.acc h2{max-width:14ch}
.acc__p{color:var(--ink-2);font-weight:300;margin-top:1.1rem;max-width:38ch}
.times{list-style:none;margin:1.8rem 0 0;padding:0;display:flex;flex-direction:column}
.times li{
    display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
    padding-block:.78rem;border-bottom:1px solid var(--line-soft);
}
.times li b{font-weight:500;font-size:.94rem}
.times li b .times__x{
    font-family:var(--f-body);font-size:.56rem;font-weight:600;
    letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);
    border:1px solid var(--line);padding:.22em .5em;margin-left:.6rem;
    white-space:nowrap;vertical-align:.12em;
}
.times li i{
    flex:1 1 auto;height:1px;background:var(--line);align-self:center;margin-inline:.4rem;
}
.times li span{
    font-family:var(--f-display);font-size:1.08rem;font-variant-numeric:tabular-nums;
    color:var(--gold-deep);white-space:nowrap;
}
.map{
    position:relative;border:1px solid var(--line-soft);background:var(--paper);
    aspect-ratio:16/12;overflow:hidden;
}

.map{display:block;color:inherit;text-decoration:none}
.map > svg,.map__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* harmonise une capture de carte réelle avec la palette crème et or du
   site : désature le vert des parcs et le bleu des axes, réchauffe le fond.
   À retirer si la capture est déjà stylée aux couleurs de la marque. */
/*.map__img{filter:sepia(.22) saturate(.62) hue-rotate(-6deg) brightness(1.04) contrast(.96)} */
.map:hover{border-color:var(--line)}
.map:hover .map__pin b{background:var(--gold);color:var(--on-gold)}
.map:hover .link-arrow{color:var(--gold-deep)}
.map:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px}
.map .link-arrow{
    font-size:.72rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
    display:inline-flex;align-items:center;gap:.5em;color:var(--gold-deep);
    transition:color .35s var(--ease);
}
.map .link-arrow svg{width:.7rem;height:.7rem}
.map__pin{
    position:absolute;left:50%;top:53%;z-index:3;transform:translate(-50%,-100%);
    display:flex;flex-direction:column;align-items:center;gap:.35rem;
}
.map__pin b{
    font-size:.63rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
    background:var(--ink);color:var(--paper);padding:.45em .75em;white-space:nowrap;
}
.map__pin i{
    width:.7rem;height:.7rem;border-radius:50%;background:var(--gold);
    box-shadow:0 0 0 5px var(--gold-tint);position:relative;
}
.map__pin i::after{
    content:"";position:absolute;inset:-5px;border-radius:50%;border:1px solid var(--gold);
    animation:pulse 3s var(--ease) infinite;
}
.map__lbl{
    position:absolute;z-index:2;font-size:.6rem;font-weight:600;letter-spacing:.1em;
    text-transform:uppercase;color:var(--ink-3);
}
/* la gare, le Boulingrin et la cathédrale sont hors cadre :
   on donne la direction plutôt qu'une position fausse */
.map__lbl--nw{left:.9rem;top:.9rem}
.map__lbl--sw{left:.9rem;bottom:3.6rem}

.map__foot{
    position:absolute;left:0;right:0;bottom:0;z-index:4;
    display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
    padding:.85rem 1rem;background:var(--paper);border-top:1px solid var(--line-soft);
}
.map__foot small{font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;font-weight:600;color:var(--ink-3)}

/* ═══════════════════════════════════════════════════════════════
   LE FIL D'OR
   Une courbe dorée qui descend la page, tracée au défilement.
   Elle s'accroche à --jour (0 en haut, 1 en bas), posée par le
   script en bas de page.
   ═══════════════════════════════════════════════════════════════ */
/* ── le fil d'or ────────────────────────────────────────────── */
.fil{
    position:fixed;left:.1rem;top:0;bottom:0;width:1.1rem;z-index:6;
    pointer-events:none;
}

/* sur téléphone le fil se glisse dans la marge : trait plus fin,
   pastilles plus petites, pour ne jamais mordre sur le contenu */

.fil svg{width:100%;height:100%;display:block;overflow:visible}
.fil__rail{fill:none;stroke:var(--gold);stroke-width:1.1;opacity:.3}
.fil__draw{
    fill:none;stroke:url(#filGrad);stroke-width:3.2;stroke-linecap:round;
    stroke-dasharray:var(--L,1000);
    stroke-dashoffset:calc(var(--L,1000) * (1 - clamp(0,var(--jour,0),1)));
    filter:drop-shadow(0 0 3px rgba(217,166,28,.75)) drop-shadow(0 0 9px rgba(217,166,28,.35));
}
.fil__node{
    position:absolute;width:.6rem;height:.6rem;margin:-.3rem 0 0 -.3rem;
    background:var(--gold);transform:rotate(45deg) scale(.5);opacity:.3;
    transition:opacity .55s var(--ease),transform .55s var(--ease),box-shadow .55s var(--ease);
}
.fil__node.is-on{
    opacity:1;transform:rotate(45deg) scale(1);
    box-shadow:0 0 0 .3rem rgba(217,166,28,.2),0 0 1rem .1rem rgba(217,166,28,.55);
}
.fil__head{
    position:absolute;width:.55rem;height:.55rem;margin:-.275rem 0 0 -.275rem;border-radius:50%;
    background:#fffaf0;
    box-shadow:0 0 .55rem .16rem rgba(255,226,140,.95),0 0 1.5rem .4rem rgba(217,166,28,.55);
    opacity:.95;
}

@media (prefers-reduced-motion:reduce){
    .fil__head{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   16. CTA FINAL + FOOTER
   ═══════════════════════════════════════════════════════════════ */
.final{position:relative;min-height:88svh;display:flex;align-items:flex-end;overflow:hidden;color:#fff;background:#100e0a}
.final__scrim{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(10,8,6,.35) 0,rgba(10,8,6,.2) 40%,rgba(10,8,6,.88) 100%)}
.final__in{position:relative;z-index:3;width:100%;padding-block:clamp(3rem,8vh,5.5rem)}
.final__wm{
    z-index:2;color:#fff;opacity:.055;
    width:min(48vw,27rem);right:-6%;bottom:-16%;
}

.final h2{color:#fff;font-size:clamp(2.4rem,7vw,5rem);max-width:16ch}
.final h2 em{font-style:italic;color:var(--gold)}
.final__sub{margin-top:1rem;color:rgba(255,255,255,.78);font-weight:300;max-width:34ch;font-size:clamp(1rem,1.5vw,1.18rem)}
.final .eyebrow{color:var(--gold)}
.final .eyebrow::before{background:var(--gold)}
.final__row{
    display:flex;flex-wrap:wrap;gap:2rem;align-items:flex-end;justify-content:space-between;
    margin-top:2.6rem;padding-top:1.8rem;border-top:1px solid rgba(255,255,255,.18);
}
.final__contact{display:grid;gap:.7rem;grid-template-columns:1fr}

.final__contact>div{display:flex;flex-direction:column;gap:.15rem}
.final__contact dt,.final__contact span:first-child{
    font-size:.62rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.5);
}
.final__contact a,.final__contact p{font-size:.98rem;color:#fff}
.final__contact a:hover{color:var(--gold)}

.ftr{background:var(--paper);border-top:1px solid var(--line-soft);padding-block:clamp(2.6rem,6vw,4rem) 1.6rem}
.ftr__top{display:grid;gap:clamp(2rem,4vw,3rem);grid-template-columns:1fr}

.ftr__brand{display:flex;flex-direction:column;gap:1.3rem}
.ftr__brand p{font-size:.85rem;color:var(--ink-3);max-width:30ch;line-height:1.6}
.ftr__col{display:flex;flex-direction:column;gap:.65rem}
.ftr__col b{font-size:.65rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3)}
.ftr__col a,.ftr__col p{font-size:.885rem;color:var(--ink-2)}
.ftr__col a:hover{color:var(--gold-deep)}
.ftr__bot{
    margin-top:clamp(2.2rem,5vw,3.2rem);padding-top:1.3rem;border-top:1px solid var(--line-soft);
    display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;align-items:center;justify-content:space-between;
}
.ftr__legal{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem}
.ftr__legal a,.ftr__bot small{font-size:.735rem;color:var(--ink-3)}
.ftr__legal a:hover{color:var(--ink)}
.ftr__seo{
    margin-top:1.4rem;font-size:.7rem;line-height:1.7;color:var(--ink-3);max-width:96ch;
}
.ftr__seo a{color:var(--ink-3);text-decoration:underline;text-decoration-color:var(--line)}
.ftr__seo a:hover{color:var(--gold-deep)}

/* ═══════════════════════════════════════════════════════════════
   18b. ILS NOUS ONT FAIT CONFIANCE — banderole défilante
   ═══════════════════════════════════════════════════════════════ */
.trust{background:#fff;border-block:1px solid var(--line-soft);padding-block:clamp(2.1rem,4.5vw,3rem)}
.trust__head{
    display:flex;align-items:center;justify-content:space-between;
    gap:1rem;flex-wrap:wrap;margin-bottom:clamp(1.3rem,2.8vw,1.9rem);
}
.trust__t{
    font-family:var(--f-body);font-size:.655rem;font-weight:600;
    letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);
    display:inline-flex;align-items:center;gap:.75em;margin:0;
}
.trust__t .mk{width:.95rem;color:var(--gold)}
.trust__pause{
    font-family:var(--f-body);font-size:.6rem;font-weight:600;
    letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);
    display:inline-flex;align-items:center;gap:.55em;
    transition:color .3s var(--ease);
}
.trust__pause::before{content:"";width:.42rem;height:.42rem;background:var(--gold);flex:none}
.trust__pause[aria-pressed="true"]::before{border-radius:50%}
.trust__pause:hover{color:var(--gold-deep)}

/* la piste contient 4 copies : on translate de 2 copies,
   toujours plus large que le conteneur, donc la boucle ne se voit pas */
.mq{
    position:relative;overflow:hidden;
    -webkit-mask:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
    mask:linear-gradient(90deg,transparent 0,#000 6%,#000 94%,transparent 100%);
}
.mq__track{display:flex;width:max-content;animation:mq 46s linear infinite}
.mq:hover .mq__track,.mq.is-paused .mq__track{animation-play-state:paused}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.mq__row{display:flex;align-items:center;flex:none}
.mq__i{
    flex:none;width:clamp(9rem,15vw,12rem);height:3.75rem;
    background-repeat:no-repeat;background-position:center;background-size:contain;
    opacity:.78;
    transition:opacity .45s var(--ease),transform .45s var(--ease);
}
.mq__i:hover,.mq__i:focus-visible{opacity:1;transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){
    .mq{overflow-x:auto;-webkit-mask:none;mask:none}
    .mq__track{animation:none}
    .mq__row + .mq__row{display:none}
}

/* ═══════════════════════════════════════════════════════════════
   19. OFFRE DE LANCEMENT — pop-up et code de réduction
   ═══════════════════════════════════════════════════════════════ */
.pop{
    position:fixed;inset:0;z-index:120;
    display:grid;place-items:center;padding:clamp(1rem,4vw,2rem);
    background:rgba(10,8,6,.74);
    -webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
    opacity:0;pointer-events:none;
    transition:opacity .45s var(--ease);
}
.pop.is-open{opacity:1;pointer-events:auto}
.pop[hidden]{display:none}
.pop__box{
    position:relative;width:min(30rem,100%);
    background:var(--paper);border:1px solid var(--line);
    box-shadow:0 48px 100px -45px rgba(10,8,6,.75);
    padding:clamp(2rem,4.5vw,2.8rem) clamp(1.5rem,4vw,2.6rem);
    display:flex;flex-direction:column;align-items:center;gap:1.05rem;text-align:center;
    transform:translateY(16px) scale(.985);
    transition:transform .5s var(--ease);
}
.pop.is-open .pop__box{transform:none}
.pop__close{
    position:absolute;top:.7rem;right:.7rem;
    width:2.2rem;height:2.2rem;border-radius:50%;
    display:grid;place-items:center;color:var(--ink-3);
    transition:background .3s var(--ease),color .3s var(--ease);
}
.pop__close:hover{background:var(--paper-3);color:var(--ink)}
.pop__close svg{width:.85rem;height:.85rem}
.pop .mk{width:2.1rem;color:var(--gold)}
.pop__eyebrow{
    font-family:var(--f-body);font-size:.63rem;font-weight:600;
    letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep);
}
.pop__t{
    font-family:var(--f-display);font-weight:600;
    font-size:clamp(1.7rem,4.6vw,2.3rem);line-height:1.08;letter-spacing:0;
    text-wrap:balance;
}
.pop__t em{font-style:italic;color:var(--gold-deep)}
.pop__p{font-size:.875rem;color:var(--ink-2);line-height:1.6;max-width:32ch}
.pop__code{
    display:inline-flex;align-items:center;gap:.85em;
    border:1px dashed var(--gold);background:var(--gold-tint);
    padding:.7em 1.05em;border-radius:var(--r);cursor:copy;
    font-family:var(--f-body);font-size:1.02rem;font-weight:600;
    letter-spacing:.22em;color:var(--ink);
    transition:background .3s var(--ease),border-color .3s var(--ease);
}
.pop__code:hover{background:color-mix(in srgb,var(--gold) 22%,transparent)}
.pop__code small{
    font-size:.58rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    color:var(--gold-deep);border-left:1px solid var(--gold);padding-left:.85em;
}
.pop__code.is-copied{border-style:solid}
.pop__limit{
    display:inline-flex;align-items:center;gap:.55em;
    font-size:.63rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--ink-3);
}
.pop__limit::before{
    content:"";width:.42rem;height:.42rem;border-radius:50%;background:var(--gold);flex:none;
}
.pop .btn{margin-top:.35rem}
.pop__later{
    font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
    color:var(--ink-3);text-decoration:underline;text-decoration-color:var(--line);
}
.pop__later:hover{color:var(--ink)}
@media (prefers-reduced-motion:reduce){
    .pop,.pop__box{transition:none}
    .pop__box{transform:none}
}

/* le champ code dans le configurateur */
.field--code{grid-column:1/-1}
.field--code input{
    max-width:14rem;text-transform:uppercase;letter-spacing:.16em;font-weight:600;
}
.field--code input.is-ok{border-color:var(--gold);background:var(--gold-tint)}
.field__msg{font-size:.715rem;line-height:1.4;letter-spacing:.01em;color:var(--ink-3)}
.field__msg.is-ok{color:var(--gold-deep);font-weight:600}
.field__msg.is-ko{color:#9d3b26}
.field__hint{font-size:.7rem;color:var(--ink-3);line-height:1.45}
/* consentements : cases à cocher aux couleurs du site */
.consent{grid-column:1/-1;display:flex;flex-direction:column;gap:.85rem;padding-top:.35rem}
.chk{
    display:grid;grid-template-columns:auto 1fr;gap:.75rem;align-items:start;
    cursor:pointer;text-transform:none;letter-spacing:normal;position:relative;
}
.chk input{
    /* case native masquée, mais toujours atteignable au clavier */
    position:absolute;left:0;top:.1rem;width:1.15rem;height:1.15rem;margin:0;
    opacity:0;cursor:pointer;
}
.chk__box{
    width:1.15rem;height:1.15rem;flex:none;margin-top:.12rem;
    pointer-events:none;   /* le clic traverse jusqu'à la case native */
    border:1px solid var(--line);border-radius:var(--r);background:var(--paper);
    display:grid;place-items:center;
    transition:background .25s var(--ease),border-color .25s var(--ease);
}
.chk__box::after{
    content:"";width:.58rem;height:.3rem;margin-top:-.12rem;
    border-left:1.7px solid var(--on-gold);border-bottom:1.7px solid var(--on-gold);
    transform:rotate(-45deg) scale(.5);opacity:0;
    transition:opacity .2s var(--ease),transform .25s var(--ease);
}
.chk input:checked ~ .chk__box{background:var(--gold);border-color:var(--gold)}
.chk input:checked ~ .chk__box::after{opacity:1;transform:rotate(-45deg) scale(1)}
.chk input:focus-visible ~ .chk__box{outline:2px solid var(--gold-deep);outline-offset:2px}
.chk:hover .chk__box{border-color:var(--ink-3)}
.chk__txt{
    font-size:.815rem;line-height:1.55;color:var(--ink-2);
    font-weight:400;letter-spacing:normal;text-transform:none;
}
.chk__txt a{color:var(--gold-deep);text-decoration:underline;text-decoration-color:var(--line)}
.chk__txt a:hover{text-decoration-color:var(--gold)}
.chk__tag{
    display:inline-block;font-size:.575rem;font-weight:600;letter-spacing:.14em;
    text-transform:uppercase;color:var(--ink-3);border:1px solid var(--line);
    padding:.16em .45em;margin-left:.4rem;white-space:nowrap;vertical-align:.12em;
}
.chk__tag--req{color:var(--gold-deep);border-color:var(--gold)}
.chk.is-missing .chk__box{border-color:#9d3b26;background:rgba(157,59,38,.07)}
.form__err, form ul li{
    grid-column:1/-1;margin:0;padding:.8em 1em;
    border:1px solid #b3261e;background:rgba(179,38,30,.07);
    color:#8c1d18;font-size:.8rem;line-height:1.5;
}
.form__err[hidden]{display:none}
.consent__err{
   /* display:none;*/
    font-size:.78rem;line-height:1.5;color:#9d3b26;font-weight:600;
    padding-left:1.9rem;
}
.consent__err.is-on{display:block}

.field__hint b{font-weight:600;letter-spacing:.12em;color:var(--gold-deep)}

/* le rappel de la remise dans le récapitulatif */
.cfg__promo{
    display:flex;align-items:center;gap:.65em;
    border:1px solid var(--gold);background:var(--gold-tint);
    padding:.72em .85em;font-size:.735rem;line-height:1.45;color:var(--ink);
}
.cfg__promo[hidden]{display:none}
.cfg__promo .mk{width:1.05rem;color:var(--gold-deep);flex:none}
.cfg__promo b{font-weight:600;letter-spacing:.12em}
.cfg__donecode{font-size:.8rem;color:var(--ink-2);line-height:1.55}
.cfg__donecode[hidden]{display:none}
.cfg__donecode b{font-family:var(--f-body);font-size:.8rem;font-weight:600;letter-spacing:.12em;color:var(--gold-deep)}

/* ═══════════════════════════════════════════════════════════════
   17. LIGHTBOX
   ═══════════════════════════════════════════════════════════════ */
.lb{
    position:fixed;inset:0;z-index:120;display:none;
    background:rgba(10,8,6,.94);
    -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
    padding:clamp(1rem,4vw,3rem);
    overflow-y:auto;
}
.lb.is-open{display:grid;place-items:center;animation:lbIn .35s var(--ease)}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
.lb__box{width:100%;max-width:60rem;color:#f4f1e9}
.lb__close{
    position:fixed;top:clamp(.8rem,3vw,1.6rem);right:clamp(.8rem,3vw,1.6rem);z-index:2;
    width:2.8rem;height:2.8rem;border:1px solid rgba(255,255,255,.28);border-radius:50%;
    display:grid;place-items:center;color:#fff;
    transition:background .35s var(--ease),color .35s var(--ease);
}
.lb__close:hover{background:#fff;color:var(--on-gold)}
.lb__close svg{width:1rem;height:1rem}
.lb__frame{position:relative;aspect-ratio:16/9;border:1px solid rgba(255,255,255,.18);overflow:hidden;background:#0c0a07}
.lb__cap{margin-top:1.1rem;display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;align-items:baseline;justify-content:space-between}
.lb__cap b{font-family:var(--f-display);font-size:1.35rem;font-weight:400}
.lb__cap small{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;color:rgba(255,255,255,.5)}
.board{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;gap:1px;background:rgba(255,255,255,.14);grid-template-columns:1fr}

.board li{background:#0f0d09;padding:.95rem 1rem;display:flex;gap:.85rem;align-items:baseline}
.board li i{
    font-family:var(--f-display);font-style:normal;font-size:.9rem;color:var(--gold);
    font-variant-numeric:tabular-nums;flex:none;
}
.board li span{font-size:.83rem;line-height:1.5;color:rgba(244,241,233,.86)}
.board li.is-key{background:#161208;box-shadow:inset 2px 0 0 var(--gold)}
.board li.is-key span{color:#fff}

/* ═══════════════════════════════════════════════════════════════
   11b. RESTAURATION — inclus + trois pauses
   ═══════════════════════════════════════════════════════════════ */
.incl{
    display:grid;gap:1px;background:var(--line-soft);grid-template-columns:1fr;
    border:1px solid var(--line-soft);margin-top:clamp(2.2rem,4.5vw,3.2rem);
}

.incl__i{
    background:var(--paper);padding:clamp(1.15rem,2.2vw,1.7rem);
    padding-right:5.4rem;
    display:flex;gap:1.1rem;align-items:center;position:relative;
}
.incl__i > svg{width:1.7rem;height:1.7rem;color:var(--gold-deep);flex:none}
.incl__i div{display:flex;flex-direction:column;gap:.12rem}
.incl__i b{font-size:.98rem;font-weight:500}
.incl__i span{font-size:.8rem;color:var(--ink-3);line-height:1.45}
.incl__tag{
    position:absolute;top:0;right:0;
    font-size:.6rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
    background:var(--gold);color:var(--on-gold);padding:.45em .7em;
}

.meals{
    display:grid;gap:1px;background:var(--line-soft);grid-template-columns:1fr;
    border:1px solid var(--line-soft);border-top:0;
}

.meal{
    position:relative;background:var(--paper);overflow:hidden;
    padding:clamp(1.5rem,2.8vw,2.2rem);
    display:flex;flex-direction:column;gap:.8rem;
}
.meal .scene{opacity:calc(.14 + .20 * var(--sc,0));transition:opacity .22s linear,transform 1s var(--ease)}
.meal:hover .scene{opacity:.34;transform:scale(1.04)}
.meal__ico,.meal__moment,.meal h3,.meal__d,.meal__list,.meal__p{position:relative;z-index:2}
.meal__ico{
    align-self:flex-start;width:2.8rem;height:2.8rem;display:grid;place-items:center;
    border:1px solid var(--line);border-radius:50%;color:var(--gold-deep);background:var(--paper);
    transition:background .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease);
}
.meal:hover .meal__ico{background:var(--gold);color:var(--on-gold);border-color:var(--gold)}
.meal__ico svg{width:1.3rem;height:1.3rem}
.meal__moment{
    font-size:.655rem;font-weight:600;letter-spacing:.17em;text-transform:uppercase;color:var(--ink-3);
    display:flex;align-items:center;gap:.6em;
}
.meal__moment i{font-style:normal;color:var(--gold-deep);font-variant-numeric:tabular-nums}
.meal h3{font-family:var(--f-display);font-size:clamp(1.65rem,3vw,2.15rem);letter-spacing:0}
.meal__d{font-size:.9rem;color:var(--ink-2);line-height:1.55;max-width:30ch}
.meal__list{
    list-style:none;margin:.15rem 0 0;padding:0;
    display:flex;flex-wrap:wrap;gap:.4rem;
}
.meal__list li{
    font-size:.735rem;font-weight:500;letter-spacing:.02em;
    border:1px solid var(--line);border-radius:100px;padding:.42em .8em;color:var(--ink-2);
}
.meal__p{
    margin-top:auto;padding-top:1.1rem;border-top:1px solid var(--line-soft);
    font-size:.665rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-3);
}
.meals__foot{
    margin-top:1.3rem;display:flex;flex-wrap:wrap;gap:.8rem 1.6rem;
    align-items:baseline;justify-content:space-between;
}
.meals__foot p{font-size:.78rem;color:var(--ink-3);max-width:62ch;line-height:1.6}

/* ── option navette / chauffeurs privés ───────────────────── */
.shuttle{
    display:grid;gap:1px;background:var(--line-soft);grid-template-columns:1fr;
    border:1px solid var(--line-soft);margin-top:clamp(2.4rem,5vw,3.6rem);
}

.shuttle > div{
    background:var(--paper);padding:clamp(1.4rem,2.6vw,2.2rem);
    display:flex;flex-direction:column;gap:.7rem;
}
/* le bandeau traverse les trois colonnes */
.shuttle__media{grid-column:1/-1;margin:0;background:var(--paper-3);overflow:hidden;line-height:0}
.shuttle__media img{
    width:100%;height:auto;display:block;
    aspect-ratio:1983/793;   /* ratio natif du cliché : aucun recadrage */
}

.shuttle__ico{
    width:2.8rem;height:2.8rem;border:1px solid var(--line);border-radius:50%;
    display:grid;place-items:center;color:var(--gold-deep);margin-bottom:.5rem;
    transition:background .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease);
}
.shuttle:hover .shuttle__ico{background:var(--gold);color:var(--on-gold);border-color:var(--gold)}
.shuttle__ico svg{width:1.35rem;height:1.35rem}
.shuttle h3{font-family:var(--f-display);font-size:clamp(1.35rem,2.3vw,1.75rem)}
.shuttle__txt{font-size:.9rem;color:var(--ink-2);line-height:1.62;max-width:42ch}
.shuttle__list{list-style:none;margin:.2rem 0 0;padding:0;display:flex;flex-direction:column;gap:.6rem;font-size:.9rem}
.shuttle__list li{display:flex;gap:.7rem;align-items:flex-start;color:var(--ink-2)}
.shuttle__list li::before{
    content:"";width:.4rem;height:.4rem;margin-top:.55rem;flex:none;border-radius:50%;background:var(--gold);
}
/* les deux colonnes de droite sont plus courtes que le texte de gauche :
   on les centre verticalement au lieu de les coller en haut et en bas */
.shuttle > div:not(:first-of-type){justify-content:center}
.shuttle__cta{gap:.35rem}
.shuttle__cta small{
    font-size:.7rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase;
    color:var(--ink-3);line-height:1.55;
}
.shuttle__cta .link-arrow{margin-top:.9rem}

/* ── correctifs de superposition ──────────────────────────── */
.day__media .media__tag{bottom:auto;top:0;border-top:0;border-bottom:1px solid var(--line-soft)}
.lb__frame .skyline{bottom:32%}
.gal__cell .skyline{bottom:38%}

/* ═══════════════════════════════════════════════════════════════
   17b. FAQ
   ═══════════════════════════════════════════════════════════════ */
.faq{display:grid;gap:clamp(1.8rem,4vw,3.4rem);grid-template-columns:1fr;align-items:start}

.faq__list{border-top:1px solid var(--line-soft)}
.faq__item{border-bottom:1px solid var(--line-soft)}
.faq__item summary{
    cursor:pointer;list-style:none;padding-block:1.15rem;
    display:flex;align-items:baseline;justify-content:space-between;gap:1.5rem;
    font-family:var(--f-display);font-size:clamp(1.08rem,1.8vw,1.32rem);line-height:1.3;
    transition:color .35s var(--ease);
}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary::after{
    content:"+";font-family:var(--f-body);font-size:1.15rem;color:var(--gold-deep);
    flex:none;transition:transform .4s var(--ease);line-height:1;
}
.faq__item[open] summary::after{transform:rotate(45deg)}
.faq__item summary:hover{color:var(--gold-deep)}
.faq__item p{
    padding-bottom:1.25rem;font-size:.92rem;color:var(--ink-2);line-height:1.65;max-width:60ch;
}

/* ═══════════════════════════════════════════════════════════════
   17 bis. PAGES INTÉRIEURES (plan du site…)
   ═══════════════════════════════════════════════════════════════ */
.page{padding-top:calc(var(--sec) + 4rem)}
.page__head{gap:1.1rem;margin-bottom:clamp(2.4rem,5vw,3.6rem)}
.page__head h1{font-size:clamp(2.4rem,6vw,4.4rem)}
.sitemap{display:grid;gap:clamp(2rem,4vw,3rem);grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}
.sitemap__group{display:flex;flex-direction:column;gap:.9rem}
.sitemap__group h2{font-size:clamp(1.3rem,2.2vw,1.65rem);padding-bottom:.8rem;border-bottom:1px solid var(--line-soft)}
.sitemap__group ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem}
.sitemap__group a{font-size:.95rem;color:var(--ink-2);transition:color .3s var(--ease)}
.sitemap__group a:hover{color:var(--gold-deep)}
.sitemap__group ul ul{padding-left:1rem;margin-top:.6rem;border-left:1px solid var(--line-soft)}
.sitemap__group ul ul a{font-size:.88rem;color:var(--ink-3)}

.legal{display:flex;flex-direction:column;gap:clamp(2rem,4vw,2.8rem);max-width:68ch}
.legal section{display:flex;flex-direction:column;gap:.8rem}
.legal h2{font-size:clamp(1.3rem,2.2vw,1.65rem);padding-bottom:.8rem;border-bottom:1px solid var(--line-soft)}
.legal p,.legal li{font-size:.95rem;color:var(--ink-2);line-height:1.65}
.legal ul{margin:0;padding-left:1.1rem;display:flex;flex-direction:column;gap:.35rem}
.legal a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:.18em}
.legal__updated{font-size:.82rem;color:var(--ink-3)}
/* Champ à renseigner avant la mise en ligne : volontairement voyant. */
.todo{background:var(--gold-tint);color:var(--ink);padding:0 .3em;border-radius:2px;font-style:normal}

/* ═══════════════════════════════════════════════════════════════
   18. RÉVÉLATIONS AU SCROLL
   ═══════════════════════════════════════════════════════════════ */
.rv{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.is-in{opacity:1;transform:none}
.rv--d1{transition-delay:.09s}
.rv--d2{transition-delay:.18s}
.rv--d3{transition-delay:.27s}

@media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{
        animation-duration:.001ms !important;animation-iteration-count:1 !important;
        transition-duration:.001ms !important;
    }
    .rv{opacity:1;transform:none}
    .header__sweep{display:none}
    .thres{height:auto}
    .thres__stage{position:static;height:auto;min-height:70svh;padding-block:5rem}
    .thres__scrim{opacity:.44}
    .thres__panes{display:none}
    .thres__prog{display:none}
}