/* ══ Noël 2026 — le guide cadeau ═══════════════════════════════════
   Charte G du site : encre, rouge B.R.M, jaune, crème, Oswald.
   Ajouts de saison : vert sapin et or, en lumière plutôt qu'en aplat. */
@font-face{font-family:'Oswald';font-style:normal;font-weight:200 700;font-display:swap;src:url(polices/oswald-latin.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url(polices/inter-latin.woff2) format('woff2')}

:root{
  --encre:#111114; --noir:#0B0B0D; --charbon:#16161A;
  --rouge:#BD3238; --rouge-nuit:#E5585E; --jaune:#FFC414;
  --creme:#F4F2EF; --sable:#EBE8E3; --trait:#E3E0DB;
  --sapin:#0E3A2B; --sapin-clair:#1B5E46; --or:#C9A55C; --or-clair:#E9D3A0;
  --doux:#55585F; --doux-nuit:rgba(244,242,239,.66);
  --titre:'Oswald','Arial Narrow',sans-serif; --texte:'Inter',system-ui,-apple-system,sans-serif;
  --tete:64px; --ease:cubic-bezier(.2,.7,.1,1);
}
*{box-sizing:border-box;margin:0;padding:0}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--encre);color:var(--creme);font-family:var(--texte);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
em{font-style:normal;color:var(--jaune)}
/* 13/11 : plus de left:-999px, qui en arabe (RTL) élargissait la page à 1 389 px sur téléphone : guide invisible */
.evitement{position:absolute;inset-inline-start:8px;top:0;transform:translateY(-120%);background:#fff;color:#000;padding:8px 12px;z-index:100}
.evitement:focus{transform:none}
:focus-visible{outline:2px solid var(--jaune);outline-offset:3px}

/* ── En-tête ─────────────────────────────────────────────────── */
.tete{position:fixed;inset:0 0 auto 0;height:var(--tete);z-index:40;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 clamp(14px,3vw,36px);
  background:linear-gradient(to bottom,rgba(17,17,20,.86),rgba(17,17,20,0));transition:background .4s}
.tete.pleine{background:rgba(17,17,20,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.tete-g,.tete-d{display:flex;align-items:center;gap:clamp(14px,2.4vw,26px)}
.tete-d{justify-content:flex-end}
.tete-lien{font-family:var(--texte);text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:500;display:inline-flex;align-items:center;gap:10px;min-height:44px;transition:color .25s}
.tete-lien:hover{color:var(--rouge-nuit)}
.burger{display:inline-grid;gap:5px;width:22px}.burger i{height:1.5px;background:currentColor;display:block;transition:transform .3s}
.burger i:nth-child(2){width:70%}
.tete-lien:hover .burger i:first-child{transform:translateX(3px)}
.pastille{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--rouge);color:#fff;font-size:.72rem;letter-spacing:0}
@media(max-width:899px){.masq-md{display:none}}
.voile{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.55);backdrop-filter:blur(3px)}
.tiroir{position:fixed;top:0;bottom:0;left:0;z-index:71;width:min(380px,88vw);background:var(--encre);border-right:1px solid rgba(255,255,255,.08);padding:18px 26px 30px;display:flex;flex-direction:column;overflow-y:auto}
.tiroir-haut{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.tiroir-haut .logo img{height:34px}
.tiroir-fermer{font-size:2rem;line-height:1;width:44px;height:44px}
.tiroir a{font-family:var(--titre);text-transform:uppercase;font-size:1.35rem;letter-spacing:.03em;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.07);transition:color .2s,padding .3s var(--ease)}
.tiroir a:hover{color:var(--jaune);padding-left:6px}
.logo img{height:38px;width:auto}
@media(min-width:900px){.logo img{height:46px}}
@media(max-width:420px){.masq-xs{display:none}}
.fond-mot{position:absolute;left:0;top:calc(var(--tete) + 120px);z-index:1;display:flex;white-space:nowrap;pointer-events:none;font-family:var(--titre);font-weight:600;text-transform:uppercase;font-size:clamp(7rem,34vw,19rem);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(233,211,160,.13);will-change:transform;opacity:0}
.fond-mot span{padding-right:.3em}
@media(min-width:960px){.fond-mot{top:calc(50% - .5em)}}
body.fini .fond-mot{opacity:0!important;transition:opacity .6s}

/* ── Le guide plein écran ───────────────────────────────────── */
.guide{position:relative;min-height:100svh;overflow:hidden;isolation:isolate;
  background:
    radial-gradient(120% 70% at 50% -10%,rgba(233,211,160,.16),transparent 60%),
    radial-gradient(90% 60% at 50% 115%,rgba(31,107,79,.38),transparent 70%),
    radial-gradient(60% 40% at 85% 30%,rgba(189,50,56,.10),transparent 70%),
    var(--encre)}
.poussiere{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.lumiere{position:absolute;left:50%;top:-30vh;width:120vw;height:110vh;transform:translateX(-50%);z-index:0;pointer-events:none;
  background:conic-gradient(from 180deg at 50% 0%,transparent 160deg,rgba(255,236,190,.07) 172deg,rgba(255,236,190,.12) 180deg,rgba(255,236,190,.07) 188deg,transparent 200deg);
  filter:blur(6px);mix-blend-mode:screen}
.plateau{position:absolute;left:50%;width:min(130vw,1100px);aspect-ratio:3.2/1;transform:translateX(-50%);z-index:0;pointer-events:none;
  top:calc(var(--tete) + 44px + max(250px,calc(100svh - 520px)) * .62);
  background:radial-gradient(closest-side,rgba(255,240,210,.10),rgba(255,240,210,.03) 60%,transparent 100%)}
.plateau::after{content:"";position:absolute;inset:38% 12% auto;height:1px;background:linear-gradient(90deg,transparent,rgba(233,211,160,.35),transparent)}

/* l'ouverture */
.ouverture{position:absolute;inset:0;z-index:5;pointer-events:none;display:grid;place-items:center}
.ruban{position:absolute;display:block;transform-origin:left center}
.ruban-h{left:0;right:0;top:50%;height:3px;margin-top:-1.5px;background:linear-gradient(90deg,transparent,var(--rouge) 12%,var(--rouge) 88%,transparent);box-shadow:0 0 24px rgba(189,50,56,.8);transform:scaleX(0)}
.ruban-v{top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px;background:linear-gradient(180deg,transparent,var(--or) 14%,var(--or) 86%,transparent);box-shadow:0 0 22px rgba(201,165,92,.7);transform:scaleY(0);transform-origin:center top}
.mot-noel{position:relative;font-family:var(--titre);font-weight:600;line-height:.8;letter-spacing:-.01em;font-size:min(46vw,440px);display:flex;overflow:hidden;padding:.06em .02em;
  background:linear-gradient(100deg,#F4F2EF 0%,#F4F2EF 38%,#FFE7A8 47%,#fff 50%,#E9D3A0 53%,#F4F2EF 62%,#F4F2EF 100%);background-size:260% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent}
.mot-noel span{display:block;transform:translateY(105%)}
body:not(.intro-en-cours) .ouverture{display:none}

/* le manège */
.manege{position:absolute;left:0;right:0;top:calc(var(--tete) + 44px);height:max(250px,calc(100svh - 520px));z-index:2;pointer-events:none;touch-action:pan-y}
.manege-in{position:absolute;left:50%;top:50%;width:0;height:0}
.piece{position:absolute;left:0;top:0;width:var(--t,132px);height:var(--t,132px);margin:calc(var(--t,132px)/-2) 0 0 calc(var(--t,132px)/-2);will-change:transform,opacity}
.piece img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 14px 14px rgba(0,0,0,.55)) drop-shadow(0 2px 3px rgba(0,0,0,.4));transform-origin:50% 90%}
.piece::after{content:"";position:absolute;left:18%;right:18%;bottom:-6%;height:12%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.6),transparent);z-index:-1}
.manege.actif{pointer-events:auto;cursor:grab}
.manege.actif:active{cursor:grabbing}

/* la scène */
.scene{position:relative;z-index:6;min-height:100svh;padding:calc(var(--tete) + 8px) 18px 28px;display:flex;flex-direction:column}
.scene-haut{display:flex;align-items:center;gap:14px;position:relative;z-index:3}
.surtitre{font-family:var(--titre);text-transform:uppercase;letter-spacing:.22em;font-size:.76rem;color:var(--or-clair);display:inline-flex;align-items:center;gap:10px}
.surtitre.sombre{color:var(--rouge)}
.pastille-rouge{width:7px;height:7px;border-radius:50%;background:var(--rouge);box-shadow:0 0 0 4px rgba(189,50,56,.22)}
.boite{margin-left:auto;opacity:.92}
.boite svg{overflow:visible;display:block}
.grille{fill:none;stroke:rgba(244,242,239,.28);stroke-width:1.4;stroke-linecap:round}
.rap{font-family:var(--titre);font-size:8px;fill:rgba(244,242,239,.45);text-anchor:middle}
.rap.fait{fill:var(--jaune)}
.pommeau{fill:var(--rouge);stroke:#fff;stroke-width:1.2;filter:drop-shadow(0 0 5px rgba(189,50,56,.9))}
.compteur{font-family:var(--titre);font-size:1.5rem;line-height:1;min-width:2.2em;text-align:right}
.compteur .sur{font-size:.85rem;color:var(--doux-nuit)}
body.fini .boite,body.fini .compteur{opacity:.0;transition:opacity .4s}

.etape{margin-top:auto;padding-top:max(220px,calc(100svh - 600px));position:relative;z-index:3}
.q-num{font-family:var(--titre);text-transform:uppercase;letter-spacing:.2em;font-size:.74rem;color:var(--doux-nuit);margin-bottom:8px}
.q{font-family:var(--titre);font-weight:600;text-transform:uppercase;line-height:.94;letter-spacing:.005em;font-size:clamp(2.6rem,12.5vw,5.6rem);margin-bottom:18px;text-wrap:balance}
.q .m{display:inline-block;overflow:hidden;vertical-align:top;padding:.16em 0 .06em;margin:-.16em 0 -.06em}
.q .m>span{display:inline-block}
.q em{color:var(--jaune)}
.choix{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choix.six .c-lib{font-size:1.18rem}
.c{position:relative;overflow:hidden;text-align:left;min-height:84px;padding:14px 14px 13px;border:1px solid rgba(244,242,239,.16);border-radius:3px;
  background:linear-gradient(160deg,rgba(255,255,255,.075),rgba(255,255,255,.02));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 30px -18px rgba(0,0,0,.9);
  display:flex;flex-direction:column;justify-content:space-between;gap:6px;
  transition:transform .25s var(--ease),border-color .25s,background .25s;-webkit-tap-highlight-color:transparent;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.choix.six .c{min-height:70px}
.c-lib{font-family:var(--titre);text-transform:uppercase;font-weight:500;font-size:1.32rem;line-height:1.02;letter-spacing:.02em;position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:8px}
.c-lib svg{width:26px;height:26px;flex:none;fill:none;stroke:var(--or-clair);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;transition:stroke .3s}
.c-sous{font-size:.8rem;line-height:1.3;color:var(--doux-nuit);position:relative;z-index:2;transition:color .3s}
.c::before{content:"";position:absolute;inset:0;z-index:1;background:var(--rouge);clip-path:circle(0 at var(--x,50%) var(--y,50%));transition:clip-path .55s var(--ease)}
.c::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.14) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--ease)}
.c:active{transform:scale(.975)}
.c.choisi{border-color:var(--rouge)}
.c.choisi::before{clip-path:circle(150% at var(--x,50%) var(--y,50%))}
.c.choisi .c-sous{color:rgba(255,255,255,.86)}
.c.choisi .c-lib svg{stroke:#fff}
@media(hover:hover){
  .c:hover{border-color:rgba(244,242,239,.5);transform:translateY(-2px)}
  .c:hover::after{transform:translateX(120%)}
}
.retour{position:relative;z-index:3;align-self:flex-start;margin-top:14px;font-family:var(--titre);text-transform:uppercase;letter-spacing:.16em;font-size:.76rem;color:var(--doux-nuit);min-height:40px}
.retour:hover{color:var(--creme)}
.defiler{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:6;font-family:var(--titre);text-transform:uppercase;letter-spacing:.24em;font-size:.66rem;color:rgba(244,242,239,.45);display:none}

/* les résultats */
.resultats{position:relative;z-index:3;margin-top:8px}
.res-tete{margin-bottom:14px}
.res-titre{font-family:var(--titre);font-weight:600;text-transform:uppercase;line-height:.95;font-size:clamp(1.9rem,8.4vw,5rem);margin:6px 0 12px}
.res-titre .m{display:inline-block;overflow:hidden;vertical-align:top;padding:.16em 0 .06em;margin:-.16em 0 -.06em}
.res-titre .m>span{display:inline-block}
.res-puces{display:flex;flex-wrap:wrap;gap:8px}
.puce{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(244,242,239,.22);border-radius:99px;padding:6px 12px 6px 13px;font-size:.78rem;min-height:34px;transition:border-color .2s,background .2s}
.puce::after{content:"Modifier";font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--or-clair)}
.puce:hover{border-color:var(--or-clair);background:rgba(255,255,255,.05)}
.res-note{margin-top:12px;font-size:.88rem;color:var(--doux-nuit);max-width:52ch;border-left:2px solid var(--jaune);padding-left:12px}
.cartes{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -18px;padding:8px 18px 22px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.cartes::-webkit-scrollbar{display:none}
.carte{flex:0 0 76%;scroll-snap-align:center;position:relative;border-radius:4px;overflow:hidden;color:var(--encre);
  background:radial-gradient(120% 70% at 50% 18%,#fff 0%,#F7F5F1 45%,#E9E5DE 100%);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.9),0 2px 0 rgba(255,255,255,.6) inset;transform-style:preserve-3d;will-change:transform}
.carte-socle{position:relative;height:210px;overflow:hidden}
.carte-socle::before{content:"";position:absolute;left:50%;top:-40%;width:90%;height:120%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0));pointer-events:none}
.carte-socle img{position:absolute;left:8%;top:7%;width:84%;height:82%;object-fit:contain;filter:drop-shadow(0 18px 16px rgba(30,20,10,.28)) drop-shadow(0 3px 4px rgba(30,20,10,.25));transition:transform .6s var(--ease)}
.carte-ombre{position:absolute;bottom:6%;left:26%;right:26%;height:14px;border-radius:50%;background:radial-gradient(closest-side,rgba(40,30,20,.35),transparent)}
.carte-reflet{position:absolute;inset:0;pointer-events:none;background:radial-gradient(400px circle at var(--rx,50%) var(--ry,0%),rgba(255,255,255,.55),transparent 40%);mix-blend-mode:soft-light;opacity:0;transition:opacity .3s}
.carte:hover .carte-reflet{opacity:1}
.carte:hover .carte-socle img{transform:translateY(-6px) scale(1.03)}
.carte-txt{padding:14px 16px 16px;border-top:1px solid rgba(17,17,20,.08);background:rgba(255,255,255,.55)}
.carte-cat{font-family:var(--titre);text-transform:uppercase;letter-spacing:.18em;font-size:.68rem;color:var(--rouge)}
.carte h3{font-family:var(--titre);font-weight:500;text-transform:uppercase;font-size:1.3rem;line-height:1.08;margin:3px 0 4px;letter-spacing:.01em}
.carte-acc{font-size:.86rem;line-height:1.4;color:var(--doux);min-height:2.8em}
.carte-pied{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin-top:10px}
.carte-prix{font-family:var(--titre);font-size:1.25rem;font-weight:500}
.carte-prix small{font-family:var(--texte);font-size:.72rem;color:var(--doux);display:block;letter-spacing:.02em;font-weight:400}
.carte-lien{font-family:var(--titre);text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;border-bottom:1.5px solid var(--rouge);padding-bottom:2px;white-space:nowrap}
.carte-noel{display:flex;align-items:flex-start;gap:8px;line-height:1.4;margin-top:10px;padding-top:9px;border-top:1px dashed rgba(17,17,20,.14);font-size:.76rem;color:var(--sapin-clair);font-weight:500}
.carte-noel::before{content:"";width:8px;height:8px;flex:none;margin-top:.35em;transform:rotate(45deg);background:var(--sapin-clair)}
.carte-noel.neutre{color:var(--doux)}.carte-noel.neutre::before{background:var(--or)}
.cartes-bis{margin-top:4px}
.bis-titre{margin-bottom:2px}
.cartes-bis .carte{flex-basis:62%}
.cartes-bis .carte-socle{height:170px}
.res-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 22px;font-family:var(--titre);text-transform:uppercase;letter-spacing:.16em;font-size:.8rem;border-radius:2px;transition:background .25s,color .25s,border-color .25s}
.btn-plein{background:var(--rouge);color:#fff}
.btn-plein:hover{background:#A12A30}
.btn-ligne{border:1px solid rgba(244,242,239,.4)}
.btn-ligne:hover{border-color:var(--creme);background:rgba(255,255,255,.06)}
.btn-ligne-clair{border:1px solid rgba(244,242,239,.4);margin-top:26px}
.btn-ligne-clair:hover{background:var(--creme);color:var(--encre)}

/* ── Bandeau ─────────────────────────────────────────────────── */
.bandeau{background:var(--rouge);color:#fff;overflow:hidden;padding:14px 0;border-top:1px solid rgba(255,255,255,.12)}
.bandeau-in{display:flex;gap:28px;white-space:nowrap;width:max-content;font-family:var(--titre);text-transform:uppercase;font-size:clamp(1.3rem,4vw,2.3rem);letter-spacing:.04em;font-weight:500;will-change:transform}
.bandeau b{color:var(--jaune);font-weight:400}

/* ── Sections ───────────────────────────────────────────────── */
.enveloppe{width:min(1200px,100%);margin:0 auto;padding:0 20px}
.titre-section{font-family:var(--titre);font-weight:600;text-transform:uppercase;line-height:.96;font-size:clamp(2.2rem,9vw,4.6rem);margin:10px 0 26px;color:var(--encre);text-wrap:balance}
.titre-section em{color:var(--rouge)}
.titre-section.clair{color:var(--creme)}
.titre-section.clair em{color:var(--jaune)}

.dates{background:var(--creme);color:var(--encre);padding:76px 0 70px}
.piste{position:relative;margin-top:10px;padding-left:28px}
.piste-ligne{position:absolute;left:8px;top:4px;bottom:4px;width:3px;background:repeating-linear-gradient(180deg,var(--encre) 0 10px,#fff 10px 20px);border-radius:2px;overflow:hidden}
.piste-avance{position:absolute;inset:0;background:var(--rouge);transform-origin:top;transform:scaleY(0)}
.piste-auj{position:absolute;left:-2px;width:23px;height:23px;border-radius:50%;background:var(--rouge);border:3px solid var(--creme);box-shadow:0 0 0 1px var(--rouge),0 6px 14px rgba(189,50,56,.4);top:0;z-index:2}
.piste-auj span{position:absolute;left:30px;top:50%;transform:translateY(-50%);font-family:var(--titre);text-transform:uppercase;letter-spacing:.16em;font-size:.68rem;color:var(--rouge);white-space:nowrap;background:var(--creme);padding:2px 6px}
.jalons{list-style:none;display:grid;gap:34px;padding-top:44px}
.jalons li{position:relative;padding-left:14px}
.jalons li::before{content:"";position:absolute;left:-29px;top:10px;width:13px;height:13px;border-radius:50%;background:var(--encre);border:3px solid var(--creme);box-shadow:0 0 0 1px var(--encre)}
.jalons b{font-family:var(--titre);font-size:clamp(2.6rem,11vw,4.4rem);line-height:.9;font-weight:600;display:block;letter-spacing:-.005em}
.jalons strong{font-family:var(--titre);text-transform:uppercase;letter-spacing:.14em;font-size:.86rem;font-weight:500;display:block;margin:6px 0 2px;color:var(--rouge)}
.jalons p{color:var(--doux);max-width:36ch;font-size:.95rem}
.dates-note{margin-top:34px;font-size:.86rem;color:var(--doux);max-width:60ch}
@media(min-width:900px){
  .piste{padding:0;margin-top:30px}
  .piste-ligne{left:0;right:0;top:9px;bottom:auto;width:auto;height:3px;background:repeating-linear-gradient(90deg,var(--encre) 0 14px,#fff 14px 28px)}
  .piste-avance{transform-origin:left;transform:scaleX(0)}
  .piste-auj{top:-1px;left:0;margin-left:-11px}
  .piste-auj span{left:50%;top:auto;bottom:30px;transform:translateX(-50%)}
  .jalons{grid-template-columns:repeat(4,1fr);gap:32px;padding-top:44px}
  .jalons li{padding:0}
  .jalons li::before{left:0;top:-44px}
}

.offrir{background:linear-gradient(180deg,var(--sapin) 0%,#0B2A21 100%);padding:80px 0 70px;position:relative;overflow:hidden}
.offrir::before{content:"";position:absolute;inset:-20% -10% auto auto;width:70vw;height:70vw;max-width:700px;max-height:700px;border-radius:50%;background:radial-gradient(closest-side,rgba(233,211,160,.14),transparent);pointer-events:none}
.services{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px;position:relative}
.service{padding:20px 16px;border:1px solid rgba(233,211,160,.2);border-radius:3px;background:rgba(0,0,0,.14)}
.service svg{width:40px;height:40px;fill:none;stroke:var(--or-clair);stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round;margin-bottom:14px}
.service h3{font-family:var(--titre);font-weight:500;text-transform:uppercase;font-size:1.08rem;letter-spacing:.04em;line-height:1.1;margin-bottom:6px}
.service p{font-size:.86rem;color:var(--doux-nuit);line-height:1.45}
.garanties{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:26px;font-family:var(--titre);text-transform:uppercase;letter-spacing:.14em;font-size:.74rem;color:var(--or-clair)}
.garanties span::before{content:"✦ ";color:var(--jaune)}
@media(min-width:900px){.services{grid-template-columns:repeat(4,1fr);gap:18px}.service{padding:28px 22px}}

.univers{background:var(--creme);color:var(--encre);padding:76px 0 64px}
.univers-rail{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 20px 18px;scrollbar-width:none}
.univers-rail::-webkit-scrollbar{display:none}
.u-carte{flex:0 0 68%;max-width:330px;scroll-snap-align:start;position:relative;aspect-ratio:3/4;border-radius:3px;overflow:hidden;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:18px;
  background:radial-gradient(90% 60% at 50% 30%,color-mix(in srgb,var(--teinte) 55%,#fff 0%),color-mix(in srgb,var(--teinte) 60%,#000) 75%,#0B0B0D)}
.u-carte img{position:absolute;left:50%;top:7%;height:62%;width:auto;transform:translateX(-50%) rotate(-6deg);filter:drop-shadow(0 24px 20px rgba(0,0,0,.5));transition:transform .7s var(--ease)}
.u-carte:hover img{transform:translateX(-50%) rotate(0) scale(1.05)}
.u-carte::after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(to top,rgba(0,0,0,.72),transparent);z-index:0}
.u-nom{position:relative;z-index:1;font-family:var(--titre);text-transform:uppercase;font-size:1.9rem;line-height:1;font-weight:600}
.u-txt{position:relative;z-index:1;font-size:.86rem;opacity:.86;margin-top:6px}
@media(min-width:900px){.univers-rail{padding-left:max(20px,calc((100vw - 1200px)/2 + 20px))}.u-carte{flex-basis:300px}}

.maison{background:var(--encre);padding:84px 0 84px;position:relative;overflow:hidden}
.maison-grille{display:grid;gap:30px;align-items:center}
.maison-img{position:relative;display:grid;place-items:center;padding:20px}
.maison-img::before{content:"";position:absolute;inset:6% 6%;border-radius:50%;background:radial-gradient(closest-side,rgba(233,211,160,.2),transparent)}
.maison-img img{position:relative;width:min(78%,420px);filter:drop-shadow(0 40px 34px rgba(0,0,0,.7))}
.maison-txt{color:var(--doux-nuit);max-width:52ch}
.chiffres{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px;border-top:1px solid rgba(244,242,239,.14);padding-top:22px}
.chiffres b{display:block;font-family:var(--titre);font-size:clamp(1.8rem,7vw,2.8rem);line-height:1;font-weight:500;color:var(--creme)}
.chiffres span{font-size:.78rem;color:var(--doux-nuit);line-height:1.3;display:block;margin-top:6px}
@media(min-width:900px){.maison-grille{grid-template-columns:1fr 1fr;gap:60px}}

.pied{background:var(--noir);padding:clamp(48px,6vw,76px) 0 0;color:#fff;font-size:.88rem}
.pied-haut{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:22px;padding-bottom:30px;border-bottom:1px solid rgba(255,255,255,.1)}
.pied-haut .logo img{height:64px;width:auto}
.reseaux{display:flex;flex-wrap:wrap;gap:10px 24px;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}
.reseaux a:hover{color:var(--rouge-nuit)}
.pied-grille{display:grid;grid-template-columns:1fr 1fr;gap:30px 26px;padding:36px 0}
.pied-grille h4{font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;color:#fff;margin-bottom:14px;font-weight:600}
.pied-grille a{display:block;padding:5px 0;color:rgba(255,255,255,.62);font-size:.86rem;transition:color .2s}
.pied-grille a:hover{color:#fff}
.pied-bas{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:.74rem;color:rgba(255,255,255,.5);border-top:1px solid rgba(255,255,255,.1);padding:22px 0 26px}
.pied-bas a:hover{color:#fff}
@media(min-width:900px){.pied-grille{grid-template-columns:repeat(4,1fr)}}

/* ── Ordinateur : la question à gauche, le manège à droite ─── */
@media(min-width:960px){
  .scene{padding:calc(var(--tete) + 26px) clamp(30px,5vw,80px) 40px;max-width:1440px;margin:0 auto}
  .etape{margin-top:auto;margin-bottom:auto;padding-top:0;max-width:560px}
  .manege{left:46%;right:0;top:calc(var(--tete) + 20px);bottom:40px;height:auto}
  .plateau{left:73%;top:58%;width:820px}
  .choix{gap:12px}
  .c{min-height:104px;padding:18px 18px 16px}
  .choix.six .c{min-height:88px}
  .c-lib{font-size:1.55rem}
  .choix.six .c-lib{font-size:1.32rem}
  .c-sous{font-size:.86rem}
  .scene-haut{max-width:560px}
  .resultats{max-width:none;margin-top:30px}
  .res-tete{max-width:760px}
  .cartes{margin:0;padding:10px 0 26px;overflow:visible;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
  .carte{flex:none}
  .carte-socle{height:260px}
  .cartes-bis .carte-socle{height:190px}
  .defiler{display:block}
  .retour{margin-top:22px}
}
body.fini .manege{opacity:0!important;visibility:hidden;transition:opacity .6s,visibility 0s .6s}
body.fini .plateau{opacity:.3}
@media(min-width:960px){body.fini .scene{justify-content:flex-start}}

/* reveal léger des sections */
.revele{opacity:0;transform:translateY(26px)}
.sans-js .revele,.reduit .revele{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}
  .ouverture{display:none}
  .revele{opacity:1;transform:none}
}

/* avant le script : rien ne clignote */
.js .intro-en-cours .scene-haut>*,.js .intro-en-cours .manege{opacity:0}

.jalons li{transition:opacity .4s}
.jalons li.passe{opacity:.42}
@media(max-width:899px){.piste-auj span{display:none}}

/* ═══ Résultats du guide : 16 idées, puis « Voir plus » (François, 04/11/2026) ═══
   Grille : 2 colonnes sur téléphone (8 lignes de 2), 3 sur tablette, 4 sur grand écran. Le défilement horizontal est retiré. */
.resultats .cartes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;overflow:visible;scroll-snap-type:none;margin:0;padding:8px 0 18px}
.resultats .carte{flex:none;min-width:0;display:flex;flex-direction:column}
.resultats .carte-txt{flex:1;display:flex;flex-direction:column}
.resultats .carte-pied{margin-top:auto;padding-top:10px}
@media(max-width:599px){
  .resultats .carte-socle{height:150px}
  .resultats .carte-txt{padding:10px 10px 12px}
  .resultats .carte-cat{font-size:12px;letter-spacing:.06em;line-height:1.35}
  .resultats .carte h3{font-size:1.02rem;overflow-wrap:anywhere}
  .resultats .carte-acc{font-size:.8rem;min-height:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
  .resultats .carte-pied{flex-direction:column;align-items:flex-start;gap:6px}
  .resultats .carte-prix{font-size:1.08rem}
  .resultats .carte-lien{font-size:12px;letter-spacing:.08em}
  .resultats .carte-noel{font-size:12px}
}
@media(min-width:600px){.resultats .cartes{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.resultats .carte-socle{height:200px}}
@media(min-width:960px){.resultats .cartes{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;padding:10px 0 26px}.resultats .carte-socle{height:240px}}
.res-plus{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;max-width:520px;min-height:64px;margin:6px auto 22px;
  padding:12px 22px;border:1px solid var(--or-clair);border-radius:2px;background:rgba(255,255,255,.04);color:var(--creme);
  font-family:var(--titre);text-transform:uppercase;letter-spacing:.18em;font-size:.95rem;cursor:pointer;transition:background .25s,border-color .25s}
.res-plus small{font-family:var(--texte);text-transform:none;letter-spacing:.02em;font-size:.8rem;color:var(--or-clair)}
.res-plus:hover,.res-plus:focus-visible{background:rgba(233,211,160,.12);border-color:var(--creme)}
.res-plus[hidden]{display:none}