/* Accueil guidé Sam’Relaxe — généré par build-accueil.py depuis demo/accueil-guide/test. Ne pas éditer ici. */

/* ════════ guide.css ════════ */
/* Accueil guidé — test v2 (2026-10-08). Même page, même défilement ; on allège, pas de bordures, et les clics ouvrent le contenu sur place. */
:root{--gd-out:cubic-bezier(.23,1,.32,1);--gd-scene:cubic-bezier(.65,.05,.25,1);--gd-portail:cubic-bezier(.77,0,.175,1)}

/* ── Allègement ── */
html.gd .sr-first-steps,html.gd .sr-home-hubs,html.gd .sr-hero-links,
html.gd .sr-atelier-feature a.sr-btn:not(.sr-primary){display:none!important}

/* ── Pas de bordures : tout se fond dans le décor ── */
/* bas du hero : l'image (et l'ambiance) se dissolvent dans la page au lieu de s'arrêter net */
html.gd .sr-home-hero .sr-hero-art{-webkit-mask-image:linear-gradient(to bottom,#000 55%,rgba(0,0,0,.6) 75%,rgba(0,0,0,.18) 90%,transparent);mask-image:linear-gradient(to bottom,#000 55%,rgba(0,0,0,.6) 75%,rgba(0,0,0,.18) 90%,transparent)}
/* Atelier : plus de cadre ni de panneau ; l'image se fond sur ses quatre côtés */
html.gd .sr-atelier-feature{border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible}
html.gd .sr-atelier-feature .sr-feature-art{border:0!important;background:transparent!important;
  -webkit-mask-image:radial-gradient(ellipse 72% 70% at 50% 50%,#000 45%,transparent 100%);mask-image:radial-gradient(ellipse 72% 70% at 50% 50%,#000 45%,transparent 100%)}
html.gd .sr-atelier-feature .sr-feature-art img{border:0!important;border-radius:0!important}

/* ── Boutons de section plus visibles (« Ouvrir la carte », « Le catalogue complet ») ── */
html.gd .sr-section-heading .sr-text-link{min-height:0;padding:.7rem 1.25rem;border:1px solid rgba(216,181,113,.6);border-radius:999px;background:rgba(3,19,30,.45);
  color:var(--sr-gold-light,#f5db9e);font-size:.9rem;letter-spacing:.02em;text-decoration:none;backdrop-filter:blur(6px);
  transition:background-color .3s ease,border-color .3s ease,box-shadow .3s ease,transform .16s var(--gd-out)}
html.gd .sr-section-heading .sr-text-link:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){html.gd .sr-section-heading .sr-text-link:hover{background:rgba(216,181,113,.14);border-color:var(--sr-gold-light,#f5db9e);box-shadow:0 0 26px rgba(216,181,113,.22)}}

/* ── Hero : le texte se dissout, les envies montent ── */
html.gd .sr-home-hero .sr-hero-copy{transition:opacity .6s var(--gd-out),filter .6s var(--gd-out),transform .6s var(--gd-out)}
html.gd .sr-home-hero.gd-choix .sr-hero-copy,html.gd .sr-home-hero.gd-ecoute .sr-hero-copy{opacity:0;filter:blur(8px);transform:translateY(-10px) scale(.98);pointer-events:none}
html.gd .sr-home-hero .sr-hero-art img{transition:opacity 2s var(--gd-scene),filter 2s var(--gd-scene),transform 2.6s var(--gd-scene)}
html.gd .sr-home-hero.gd-choix .sr-hero-art img{filter:brightness(.62) blur(2px);transform:scale(1.04)}
html.gd .sr-home-hero.gd-ecoute .sr-hero-art img{opacity:0;filter:blur(12px);transform:scale(1.18)}
html.gd .sr-home-hero.gd-ecoute .sr-hero-fairy,html.gd .sr-home-hero.gd-ecoute .sr-celestial-orbit,html.gd .sr-home-hero.gd-ecoute #sr-depth-stars{opacity:0;transition:opacity 1.2s ease}
/* aperçu du lieu au survol d'une envie */
.gd-apercu{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;filter:blur(6px) brightness(.55);transform:scale(1.06);
  transition:opacity .7s var(--gd-out),transform 1.6s var(--gd-out);pointer-events:none}
.gd-apercu.visible{opacity:.75;transform:scale(1.02)}
/* l'ambiance : un portail qui s'ouvre depuis le point cliqué */
.gd-clip{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.08);
  clip-path:circle(0% at var(--px,50%) var(--py,50%));
  transition:clip-path 1.9s var(--gd-portail),opacity .5s ease,transform 3.2s var(--gd-out)}
.gd-clip.visible{opacity:1;transform:none;clip-path:circle(150% at var(--px,50%) var(--py,50%))}
.gd-anneau{position:absolute;left:var(--px,50%);top:var(--py,50%);width:18px;height:18px;margin:-9px 0 0 -9px;border-radius:50%;z-index:3;pointer-events:none;opacity:0;
  border:1px solid rgba(245,219,158,.9);box-shadow:0 0 24px rgba(245,219,158,.55),inset 0 0 18px rgba(245,219,158,.35)}
.gd-anneau.go{animation:gd-anneau 1.9s var(--gd-portail) forwards}
@keyframes gd-anneau{0%{opacity:.95;transform:scale(1)}70%{opacity:.35}100%{opacity:0;transform:scale(110)}}
.gd-voile-hero{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity 1.6s ease;
  background:linear-gradient(to top,rgba(3,19,30,.6) 0%,rgba(3,19,30,.5) 25%,rgba(3,19,30,.15) 60%,rgba(3,19,30,.35)),radial-gradient(80% 70% at 22% 78%,rgba(3,19,30,.6),transparent 65%);
  /* le voile se dissout lui aussi en bas : aucune bande nette entre le hero et la suite de la page */
  -webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent 100%);mask-image:linear-gradient(to bottom,#000 62%,transparent 100%)}
.gd-ecoute .gd-voile-hero{opacity:1}

.gd-envies,.gd-cartel{position:absolute;z-index:4;opacity:0;pointer-events:none;filter:blur(8px);transform:translateY(14px);
  transition:opacity .9s var(--gd-out),filter .9s var(--gd-out),transform .9s var(--gd-out)}
.gd-envies{inset:0;display:grid;place-content:center;justify-items:center;padding:0 var(--sr-pad,1.25rem);text-align:center}
.gd-choix .gd-envies,.gd-ecoute .gd-cartel{opacity:1;pointer-events:auto;filter:none;transform:none;transition-delay:.25s}
.gd-ecoute .gd-cartel{transition-delay:.9s}
.gd-surtitre{font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--sr-gold,#d8b571)}
.gd-titre{font-family:var(--font-display,Cormorant,serif);font-weight:400;line-height:1.04;color:var(--sr-ink,#eee6d7);font-size:clamp(2.2rem,4.6vw,3.6rem);margin:.3em 0 .55em}
.gd-titre em{font-style:italic;color:var(--sr-gold-light,#f5db9e)}
.gd-texte{color:var(--sr-ink,#eee6d7);opacity:.84;line-height:1.7}
.gd-liste{display:grid;grid-template-columns:repeat(3,minmax(0,15rem));gap:1rem}
.gd-envie{text-align:left;padding:1.3rem 1.25rem 1.15rem;border-radius:.8rem;border:1px solid rgba(167,139,74,.3);color:var(--sr-ink,#eee6d7);cursor:pointer;
  background:linear-gradient(160deg,rgba(9,33,45,.62),rgba(3,19,30,.48));backdrop-filter:blur(10px);font:inherit;
  opacity:0;transform:translateY(18px);transition:opacity .8s var(--gd-out),transform .8s var(--gd-out),border-color .35s ease,background-color .35s ease,box-shadow .35s ease;
  transition-delay:calc(var(--n)*90ms + 450ms),calc(var(--n)*90ms + 450ms),0s,0s,0s}
.gd-choix .gd-envie{opacity:1;transform:none}
.gd-envie:active{transform:scale(.98)}
@media (hover:hover) and (pointer:fine){.gd-choix .gd-envie:hover{border-color:rgba(245,219,158,.7);box-shadow:0 0 40px rgba(216,181,113,.18);transform:translateY(-3px)}}
.gd-envie b{display:block;font-family:var(--font-display,Cormorant,serif);font-weight:400;font-size:1.75rem;color:var(--sr-gold-light,#f5db9e);margin-bottom:.35rem}
.gd-envie span{display:block;font-size:.88rem;line-height:1.5;color:var(--sr-muted,#b3c1c2)}
.gd-envie small{display:block;margin-top:.8rem;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--sr-gold,#d8b571)}
.gd-lien{margin-top:1.4rem;background:none;border:0;color:var(--sr-muted,#b3c1c2);font:inherit;font-size:.86rem;cursor:pointer;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(238,230,215,.3)}
.gd-lien:hover{color:var(--sr-ink,#eee6d7)}
.gd-cartel{left:var(--sr-pad,1.25rem);bottom:clamp(5rem,13vh,8rem);max-width:34rem;text-align:left}
.gd-cartel p{color:var(--sr-ink,#eee6d7);opacity:.85;line-height:1.6;margin:0}
.gd-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;margin-top:1.4rem}
.gd-actions .gd-lien{margin:0}

/* ── Mots un par un, révélations au défilement ── */
.gd-mot{display:inline-block;opacity:0;filter:blur(10px);transform:translateY(.25em);
  transition:opacity .9s var(--gd-out),filter .9s var(--gd-out),transform .9s var(--gd-out);transition-delay:calc(var(--i)*65ms + var(--b,0ms))}
.gd-vu .gd-mot,.gd-choix .gd-envies .gd-mot,.gd-ecoute .gd-cartel .gd-mot,.gd-scene.ouvert .gd-mot{opacity:1;filter:none;transform:none}
html.gd main section .gd-revele{opacity:0;transform:translateY(14px);transition:opacity 1s var(--gd-out),transform 1s var(--gd-out);transition-delay:var(--d,0ms)}
html.gd main section.gd-vu .gd-revele{opacity:1;transform:none}
/* les cartes arrivent en cascade, leur image se pose doucement */
html.gd main section .gd-carte{opacity:0;transform:translateY(28px) scale(.985);filter:blur(6px);
  transition:opacity 1.1s var(--gd-out),transform 1.1s var(--gd-out),filter 1.1s var(--gd-out);transition-delay:var(--d,0ms)}
html.gd main section .gd-carte img{transform:scale(1.1);transition:transform 2.4s var(--gd-out);transition-delay:var(--d,0ms)}
html.gd main section.gd-vu .gd-carte{opacity:1;transform:none;filter:none}
html.gd main section.gd-vu .gd-carte img{transform:none}

/* ── La scène : s'ouvre comme un portail depuis le point cliqué ── */
html.gd-fige{overflow:hidden}
.gd-scene{position:fixed;inset:0;z-index:9000;display:grid;place-items:center;padding:5.5rem var(--sr-pad,1.25rem) 3rem;overflow-y:auto;
  clip-path:circle(0% at var(--px,50%) var(--py,50%));transition:clip-path 1.1s var(--gd-portail)}
.gd-scene.ouvert{clip-path:circle(150% at var(--px,50%) var(--py,50%))}
.gd-scene.ferme{clip-path:circle(0% at var(--px,50%) var(--py,50%));transition-duration:.5s}
.gd-scene[hidden]{display:none}
.gd-scene-fond{position:fixed;inset:0;background:var(--sr-bg,#03131e) center/cover no-repeat;transform:scale(1.12);filter:blur(16px) brightness(.4);
  transition:transform 2.4s var(--gd-out),filter 2.4s var(--gd-out)}
.gd-scene-fond::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 90% at 50% 40%,rgba(3,19,30,.3),rgba(3,19,30,.93))}
.gd-scene.ouvert .gd-scene-fond{transform:scale(1.02);filter:blur(5px) brightness(.55)}
.gd-scene-corps{position:relative;width:min(70rem,100%);opacity:0;filter:blur(8px);transform:translateY(18px) scale(.985);
  transition:opacity .4s var(--gd-out),filter .4s var(--gd-out),transform .4s var(--gd-out)}
.gd-scene.ouvert .gd-scene-corps{opacity:1;filter:none;transform:none;transition-duration:1s;transition-delay:.35s}
.gd-revenir{position:fixed;top:1.4rem;right:var(--sr-pad,1.25rem);z-index:2;background:rgba(3,19,30,.5);border:1px solid rgba(167,139,74,.45);border-radius:999px;
  color:var(--sr-ink,#eee6d7);font:inherit;font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;padding:.7rem 1.1rem;cursor:pointer;transition:transform .16s var(--gd-out),border-color .3s ease}
.gd-revenir:active{transform:scale(.96)}
.gd-revenir:hover{border-color:var(--sr-gold-light,#f5db9e)}
.gd-ecran{aspect-ratio:16/9;width:100%;border-radius:.7rem;overflow:hidden;background:#000;box-shadow:0 2rem 6rem rgba(0,0,0,.65),0 0 0 1px rgba(167,139,74,.25)}
.gd-ecran iframe{width:100%;height:100%;border:0;display:block}
.gd-tete{display:flex;justify-content:space-between;align-items:end;gap:1.5rem;margin-bottom:1.1rem;flex-wrap:wrap}
.gd-tete .gd-titre{margin:.25em 0 0;font-size:clamp(1.8rem,3.4vw,2.8rem)}
.gd-sortie{color:var(--sr-gold-light,#f5db9e);text-decoration:none;border-bottom:1px solid rgba(245,219,158,.4);padding-bottom:2px;font-size:.9rem;white-space:nowrap}
/* fiche royaume : image fondue, pas de cadre */
.gd-royaume{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.gd-royaume-img img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;
  -webkit-mask-image:radial-gradient(ellipse 70% 68% at 50% 50%,#000 48%,transparent 100%);mask-image:radial-gradient(ellipse 70% 68% at 50% 50%,#000 48%,transparent 100%);
  transform:scale(1.08);transition:transform 3s var(--gd-out)}
.gd-scene.ouvert .gd-royaume-img img{transform:none}
.gd-faits{margin:1rem 0 1.4rem;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sr-gold,#d8b571)}
.gd-trois{display:grid;gap:.7rem;margin-bottom:1.6rem}
.gd-trois button{display:flex;align-items:center;gap:.9rem;text-align:left;background:rgba(3,19,30,.42);border:1px solid rgba(167,139,74,.28);border-radius:.6rem;padding:.5rem;color:var(--sr-ink,#eee6d7);font:inherit;font-size:.9rem;cursor:pointer;
  opacity:0;transform:translateX(14px);transition:opacity .8s var(--gd-out),transform .8s var(--gd-out),border-color .3s ease;transition-delay:calc(var(--n)*100ms + 800ms),calc(var(--n)*100ms + 800ms),0s}
.gd-scene.ouvert .gd-trois button{opacity:1;transform:none}
.gd-trois button:hover{border-color:rgba(245,219,158,.6)}
.gd-trois img{width:5.5rem;aspect-ratio:16/9;object-fit:cover;border-radius:.35rem}
.gd-trois small{display:block;color:var(--sr-gold,#d8b571);font-size:.72rem;letter-spacing:.1em;margin-top:.2rem}
/* avant-goût de l'Atelier */
.gd-atelier{max-width:42rem;margin:0 auto;text-align:center}
.gd-pistes{display:grid;gap:.9rem;margin:1.8rem 0 2rem;text-align:left}
.gd-piste{display:grid;grid-template-columns:auto 12rem 1fr;align-items:center;gap:1.1rem;padding:1rem 1.2rem;border-radius:.8rem;
  background:linear-gradient(100deg,rgba(9,33,45,.6),rgba(3,19,30,.35));box-shadow:0 0 0 1px rgba(167,139,74,.22);
  opacity:0;transform:translateY(12px);transition:opacity .8s var(--gd-out),transform .8s var(--gd-out),box-shadow .4s ease;transition-delay:calc(var(--n)*120ms + 600ms),calc(var(--n)*120ms + 600ms),0s}
.gd-scene.ouvert .gd-piste{opacity:1;transform:none}
.gd-piste.on{box-shadow:0 0 0 1px rgba(245,219,158,.45),0 0 30px rgba(216,181,113,.1)}
.gd-piste button{width:2.4rem;height:2.4rem;border-radius:50%;border:1px solid rgba(216,181,113,.55);background:none;display:grid;place-items:center;cursor:pointer;transition:transform .16s var(--gd-out)}
.gd-piste button:active{transform:scale(.92)}
.gd-piste button i{width:.7rem;height:.7rem;border-radius:50%;transition:background-color .3s ease,box-shadow .3s ease}
.gd-piste.on button i{background:var(--sr-gold-light,#f5db9e);box-shadow:0 0 12px rgba(245,219,158,.7)}
.gd-piste-nom{display:flex;align-items:center;gap:.7rem;color:var(--sr-ink,#eee6d7);font-size:.95rem}
.gd-piste:not(.on) .gd-ondes i{animation:none;height:3px;opacity:.4}
.gd-piste:not(.on) .gd-piste-nom{opacity:.55}
.gd-scene .gd-piste input[type=range]{-webkit-appearance:none!important;appearance:none!important;width:100%!important;height:3px!important;min-height:0!important;padding:0!important;margin:0!important;
  border:0!important;border-radius:3px!important;box-shadow:none!important;cursor:pointer;
  background:linear-gradient(90deg,var(--sr-gold,#d8b571) var(--v,50%),rgba(238,230,215,.18) var(--v,50%))!important}
.gd-scene .gd-piste input[type=range]::-webkit-slider-runnable-track{height:3px;background:transparent;border:0}
.gd-scene .gd-piste input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-6.5px;border-radius:50%;background:var(--sr-gold-light,#f5db9e);box-shadow:0 0 12px rgba(245,219,158,.6);border:0}
.gd-scene .gd-piste input[type=range]::-moz-range-track{height:3px;background:transparent;border:0}
.gd-scene .gd-piste input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--sr-gold-light,#f5db9e);border:0}
.gd-note{margin-top:1rem;font-size:.8rem;color:var(--sr-muted,#b3c1c2)}

/* ── Mini-lecteur ── */
.gd-lecteur{position:fixed;left:var(--sr-pad,1.25rem);bottom:1.2rem;z-index:8500;display:flex;align-items:center;gap:.8rem;padding:.45rem 1rem .45rem .45rem;border-radius:999px;
  background:rgba(3,19,30,.78);backdrop-filter:blur(10px);box-shadow:0 0 0 1px rgba(167,139,74,.35);color:var(--sr-ink,#eee6d7);font-size:.84rem;
  opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .6s var(--gd-out),transform .6s var(--gd-out)}
.gd-lecteur.visible{opacity:1;transform:none;pointer-events:auto}
.gd-lecteur button{width:2.2rem;height:2.2rem;border-radius:50%;border:1px solid rgba(167,139,74,.45);background:none;color:inherit;display:grid;place-items:center;cursor:pointer}
.gd-ondes{display:inline-flex;gap:3px;align-items:end;height:13px}
.gd-ondes i{width:2px;height:4px;background:var(--sr-gold,#d8b571);animation:gd-onde 1.1s ease-in-out infinite}
.gd-ondes i:nth-child(2){animation-delay:.2s}.gd-ondes i:nth-child(3){animation-delay:.45s}
.gd-lecteur.pause .gd-ondes i{animation-play-state:paused}
@keyframes gd-onde{0%,100%{height:4px}50%{height:13px}}

@media (max-width:760px){
  .gd-liste{grid-template-columns:1fr;width:100%}
  .gd-envie{padding:1rem 1.1rem}.gd-envie b{font-size:1.45rem}.gd-envie small{margin-top:.5rem}
  .gd-royaume{grid-template-columns:1fr}
  .gd-piste{grid-template-columns:auto 1fr;gap:.8rem}
  .gd-piste input{grid-column:1/-1}
  .gd-cartel{bottom:5.5rem;right:var(--sr-pad,1.25rem)}
  .gd-lecteur{bottom:calc(4.9rem + env(safe-area-inset-bottom))}
}
@media (prefers-reduced-motion:reduce){
  .gd-mot,.gd-clip,.gd-scene-corps,.gd-scene-fond,.gd-envies,.gd-cartel,.gd-envie,.gd-trois button,.gd-piste,
  html.gd main section .gd-revele,html.gd main section .gd-carte,html.gd main section .gd-carte img{transform:none!important;filter:none!important}
  .gd-clip,.gd-scene{clip-path:none!important}
  .gd-anneau{display:none}
}

/* ── Nouvel ordre : sections masquées dans le test ── */
html.gd .gd-masque{display:none!important}

/* ── Bandeau de preuve : sobre, sans cadre, chiffres en or ── */
.gd-preuve{position:relative;padding:clamp(2.5rem,6vw,4.5rem) var(--sr-pad,1.25rem)}
.gd-preuve ul{list-style:none;margin:0 auto;padding:0;max-width:60rem;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.gd-preuve li{position:relative;text-align:center;padding:.4rem 1rem;opacity:0;transform:translateY(14px);transition:opacity 1s var(--gd-out),transform 1s var(--gd-out)}
.gd-preuve li:nth-child(2){transition-delay:.12s}.gd-preuve li:nth-child(3){transition-delay:.24s}.gd-preuve li:nth-child(4){transition-delay:.36s}
.gd-preuve.gd-vu li{opacity:1;transform:none}
.gd-preuve li+li::before{content:"";position:absolute;left:0;top:15%;bottom:15%;width:1px;background:linear-gradient(transparent,rgba(216,181,113,.45),transparent)}
.gd-preuve b{display:block;font-family:var(--font-display,Cormorant,serif);font-weight:500;font-size:clamp(2rem,3.6vw,3rem);line-height:1.05;color:var(--sr-gold-light,#f5db9e);font-variant-numeric:tabular-nums}
.gd-preuve span{display:block;margin-top:.4rem;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sr-muted,#b3c1c2)}

/* ── Le Cercle : l'offre, fondue dans un paysage, sans cadre ── */
.gd-cercle{position:relative;display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:30rem;margin:clamp(2rem,6vw,5rem) auto;max-width:90rem;padding:0 var(--sr-pad,1.25rem);isolation:isolate}
.gd-cercle-fond{position:absolute;inset:0 0 0 30%;z-index:-1;background:center/cover no-repeat;
  -webkit-mask-image:radial-gradient(ellipse 65% 70% at 60% 50%,#000 35%,transparent 100%);mask-image:radial-gradient(ellipse 65% 70% at 60% 50%,#000 35%,transparent 100%);
  opacity:0;transform:scale(1.08);transition:opacity 1.6s var(--gd-out),transform 3s var(--gd-out)}
.gd-cercle.gd-vu .gd-cercle-fond{opacity:.7;transform:none}
.gd-cercle-texte{max-width:32rem}
.gd-cercle-texte>*{opacity:0;transform:translateY(14px);transition:opacity 1s var(--gd-out),transform 1s var(--gd-out)}
.gd-cercle.gd-vu .gd-cercle-texte>*{opacity:1;transform:none}
.gd-cercle-texte>:nth-child(3){transition-delay:.5s}.gd-cercle-texte>:nth-child(4){transition-delay:.7s}.gd-cercle-texte>:nth-child(5){transition-delay:.85s}.gd-cercle-texte>:nth-child(6){transition-delay:1s}
.gd-cercle-texte>.gd-titre{opacity:1;transform:none}
.gd-avantages{list-style:none;padding:0;margin:0 0 1.6rem;display:grid;gap:.8rem}
.gd-avantages li{position:relative;padding-left:1.6rem;color:var(--sr-ink,#eee6d7);line-height:1.55}
.gd-avantages li::before{content:"";position:absolute;left:0;top:.55em;width:.5rem;height:.5rem;transform:rotate(45deg);background:var(--sr-gold,#d8b571);box-shadow:0 0 10px rgba(216,181,113,.6)}
.gd-prix{color:var(--sr-muted,#b3c1c2);margin:0 0 1.4rem}
.gd-prix b{font-family:var(--font-display,Cormorant,serif);font-weight:500;font-size:2.2rem;color:var(--sr-gold-light,#f5db9e);margin-right:.4rem}

@media (max-width:760px){
  .gd-preuve ul{grid-template-columns:1fr 1fr;row-gap:1.6rem}
  .gd-preuve li:nth-child(3)::before{display:none}
  .gd-cercle{grid-template-columns:1fr;min-height:0}
  .gd-cercle-fond{inset:0;opacity:.35}
  .gd-cercle.gd-vu .gd-cercle-fond{opacity:.35}
}

.sr-container .gd-cercle{padding:0}
.gd-boite-sorties{padding-top:clamp(1rem,3vw,2rem)}

/* moins de vide après le Cercle ; la lettre se fond aussi dans le décor (pas de cadre) */
.gd-cercle{margin-bottom:clamp(1rem,3vw,2.5rem)}
html.gd .sr-newsletter.sr-panel{border:0!important;box-shadow:none!important;background:radial-gradient(ellipse 70% 80% at 50% 50%,rgba(9,33,45,.7),transparent 75%)!important}

/* Lyrë qui traverse le bandeau de chiffres */
.gd-preuve{overflow:hidden}
.gd-lyre{position:absolute;left:0;top:0;width:clamp(3.4rem,5vw,4.6rem);height:auto;pointer-events:none;z-index:3;
  filter:drop-shadow(0 0 10px rgba(245,219,158,.45));will-change:transform}
.gd-etincelle{position:absolute;width:4px;height:4px;margin:-2px;border-radius:50%;pointer-events:none;z-index:2;
  background:#ffe7a8;box-shadow:0 0 8px 2px rgba(245,219,158,.75);animation:gd-etin 1.3s ease-out forwards}
.gd-etincelle.fort{width:5px;height:5px}
@keyframes gd-etin{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}
/* le chiffre « touché » par Lyrë s'illumine un instant */
.gd-preuve b.gd-touche{animation:gd-touche 1.6s ease-out}
@keyframes gd-touche{0%{text-shadow:0 0 0 rgba(245,219,158,0)}25%{text-shadow:0 0 26px rgba(245,219,158,.9)}100%{text-shadow:0 0 0 rgba(245,219,158,0)}}
@media (max-width:760px){.gd-preuve ul{grid-template-columns:repeat(3,1fr)}.gd-preuve li{padding:.4rem .3rem}.gd-preuve span{font-size:.62rem;letter-spacing:.1em}.gd-preuve li:nth-child(3)::before{display:block}}

/* fond du Cercle chargé seulement quand la section apparaît ; image 960 px sur mobile */
.gd-cercle.gd-vu .gd-cercle-fond{background-image:url(/wp-content/themes/samrelaxe-child/assets/universe/assets/crysolore.webp)}
@media (max-width:760px){.gd-cercle.gd-vu .gd-cercle-fond{background-image:url(/wp-content/themes/samrelaxe-child/assets/universe/assets/crysolore-960.webp)}}

/* ════════ parcours.css ════════ */
/* ═════════ Parcours inspiré de Limova (2026-10-09), avec la DA Sam'Relaxe ═════════ */
:root{--gd-out:cubic-bezier(.23,1,.32,1)}
/* bandeau d'actualité : une ligne fine, dorée, sous l'en-tête */
.gd-bandeau{position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;gap:.9rem;padding:.6rem var(--sr-pad,1.25rem);text-decoration:none;color:#1c1303;font-size:.84rem;font-weight:500;
  background:linear-gradient(90deg,#a9823d,#d8b571 22%,#f5db9e 50%,#d8b571 78%,#a9823d);box-shadow:inset 0 -1px 0 rgba(28,19,3,.25),0 6px 20px rgba(0,6,12,.35)}
/* reflet lent qui traverse le bandeau */
.gd-bandeau::after{content:"";position:absolute;top:0;bottom:0;left:-30%;width:25%;pointer-events:none;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,252,240,.55),transparent);animation:gd-bandeau-reflet 7s ease-in-out infinite 1.5s}
@keyframes gd-bandeau-reflet{0%,70%{left:-30%}100%{left:120%}}
.gd-bandeau>*{position:relative;z-index:1}
.gd-bandeau-tag{letter-spacing:.14em;text-transform:uppercase;font-size:.68rem;font-weight:700;padding:.22rem .6rem;border-radius:999px;background:rgba(28,19,3,.88);color:#f5db9e}
.gd-bandeau-txt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(42rem,60vw)}
.gd-bandeau-cta{white-space:nowrap;font-weight:700}
@media (hover:hover){.gd-bandeau:hover .gd-bandeau-cta{text-decoration:underline;text-underline-offset:4px}}
@media (prefers-reduced-motion:reduce){.gd-bandeau::after{animation:none;display:none}}
/* duo de boutons : principal doré + secondaire discret, partout identique */
.gd-duo{display:flex;flex-wrap:wrap;align-items:center;gap:1.1rem;margin-top:1.8rem}
.gd-duo.centre{justify-content:center}
.gd-btn-sec{color:var(--sr-gold-light,#f5db9e);text-decoration:none;padding:.75rem 1.25rem;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(216,181,113,.55);
  transition:background-color .3s ease,box-shadow .3s ease,transform .16s var(--gd-out)}
.gd-btn-sec:active{transform:scale(.97)}
@media (hover:hover){.gd-btn-sec:hover{background:rgba(216,181,113,.12);box-shadow:inset 0 0 0 1px var(--sr-gold-light,#f5db9e)}}
/* « Que voulez-vous ce soir ? » : onglets avec curseur doré qui glisse */
.gd-onglets{position:relative;display:inline-flex;flex-wrap:wrap;gap:.25rem;padding:.3rem;border-radius:999px;background:rgba(3,19,30,.55);box-shadow:inset 0 0 0 1px rgba(167,139,74,.3);margin:.4rem 0 1.6rem}
.gd-onglets button{position:relative;z-index:1;border:0;background:none;color:var(--sr-muted,#b3c1c2);font:inherit;font-size:.92rem;padding:.6rem 1.15rem;border-radius:999px;cursor:pointer;transition:color .3s ease}
.gd-onglets button[aria-selected=true]{color:#1c1303}
.gd-curseur{position:absolute;left:.3rem;top:.3rem;bottom:.3rem;width:0;border-radius:999px;background:linear-gradient(135deg,#f5db9e,#d8b571);box-shadow:0 0 18px rgba(216,181,113,.35);
  transition:transform .45s var(--gd-out),width .45s var(--gd-out)}
.gd-onglet-corps{transition:opacity .26s ease,transform .26s ease}
.gd-onglet-corps.change{opacity:0;transform:translateY(6px)}
.gd-onglet-phrase{color:var(--sr-ink,#eee6d7);opacity:.85;margin:0 0 1.2rem}
.gd-onglet-cartes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;margin-bottom:1.2rem}
.gd-carte-amb{text-decoration:none;color:var(--sr-ink,#eee6d7);animation:gd-carte-in .7s var(--gd-out) both;animation-delay:calc(var(--n)*80ms)}
@keyframes gd-carte-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.gd-carte-img{position:relative;display:block;aspect-ratio:16/9;border-radius:.6rem;overflow:hidden;margin-bottom:.7rem}
.gd-carte-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--gd-out)}
.gd-carte-img i{position:absolute;right:.5rem;bottom:.5rem;font-style:normal;font-size:.72rem;padding:.15rem .45rem;border-radius:.3rem;background:rgba(3,19,30,.8)}
@media (hover:hover){.gd-carte-amb:hover .gd-carte-img img{transform:scale(1.05)}}
.gd-carte-amb b{display:block;font-family:var(--font-display,Cormorant,serif);font-weight:400;font-size:1.3rem;line-height:1.2}
.gd-carte-amb small{color:var(--sr-gold,#d8b571);font-size:.75rem;letter-spacing:.1em}
/* Atelier : ses 3 avantages */
.gd-avantages-atelier{margin-top:1.4rem}
/* avis : cartes sombres, sans bord dur */
.gd-avis-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem}
.gd-avis-carte{margin:0;padding:1.5rem 1.4rem;border-radius:.9rem;background:linear-gradient(160deg,rgba(9,33,45,.7),rgba(3,19,30,.45));box-shadow:inset 0 0 0 1px rgba(167,139,74,.2);
  display:flex;flex-direction:column;justify-content:space-between;gap:1.2rem}
.gd-avis-carte blockquote{margin:0;padding:0;border:0;quotes:none;font-family:var(--font-display,Cormorant,serif);font-size:1.18rem;line-height:1.45;color:var(--sr-ink,#eee6d7)}
.gd-avis-carte b{display:block;color:var(--sr-gold-light,#f5db9e);font-weight:500;font-size:.9rem}
.gd-avis-carte span{font-size:.75rem;color:var(--sr-muted,#b3c1c2)}
/* 3 étapes */
.gd-etapes ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.gd-etapes li b{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;font-family:var(--font-display,Cormorant,serif);font-size:1.4rem;color:#1c1303;
  background:linear-gradient(135deg,#f5db9e,#d8b571);box-shadow:0 0 20px rgba(216,181,113,.3);margin-bottom:1rem}
.gd-etapes li h3{font-family:var(--font-display,Cormorant,serif);font-weight:400;font-size:1.6rem;margin:0 0 .4rem;color:var(--sr-ink,#eee6d7)}
.gd-etapes li p{margin:0;color:var(--sr-muted,#b3c1c2);line-height:1.6}
/* dernier appel */
.gd-appel{text-align:center;padding:clamp(3rem,8vw,6rem) var(--sr-pad,1.25rem);background:radial-gradient(ellipse 60% 70% at 50% 50%,rgba(216,181,113,.1),transparent 70%)}
.gd-appel h2{font-family:var(--font-display,Cormorant,serif);font-weight:400;font-size:clamp(2.4rem,5vw,4rem);margin:.3em 0;color:var(--sr-ink,#eee6d7)}
.gd-appel h2 em{color:var(--sr-gold-light,#f5db9e)}
.gd-appel>p:not(.gd-surtitre){color:var(--sr-muted,#b3c1c2)}
@media (max-width:760px){
  .gd-bandeau{font-size:.76rem;gap:.5rem}.gd-bandeau-txt{max-width:46vw}
  .gd-onglets{display:flex;flex-wrap:nowrap;overflow-x:auto;border-radius:1rem;scrollbar-width:none;max-width:100%}
  .gd-onglets button{white-space:nowrap;padding:.55rem .9rem}
  .gd-onglet-cartes{grid-template-columns:1fr 1fr}.gd-onglet-cartes .gd-carte-amb:nth-child(3){display:none}
  .gd-avis-grille{grid-template-columns:1fr}
  .gd-etapes ol{grid-template-columns:1fr;gap:1.4rem}
}
@media (prefers-reduced-motion:reduce){.gd-carte-amb{animation:none}.gd-curseur{transition:none}}

/* ════════ design.css ════════ */
/* ═════════ Passe de design inspirée de Limova, version féerique (2026-10-09) ═════════
   1. grands titres centrés + étiquette en pilule pour les sections clés (les autres restent à gauche : rythme varié)
   2. un halo doré/violet qui respire derrière chaque section clé (l'« aurore » remplace l'horizon orange de Limova)
   3. cartes en verre nuit avec liseré doré dégradé, plus d'air, textes plus grands
   4. contraste : le décor est adouci derrière le contenu */
:root{--gd-verre:linear-gradient(160deg,rgba(14,42,56,.72),rgba(3,19,30,.62));
  --gd-liseré:linear-gradient(180deg,rgba(245,219,158,.55),rgba(216,181,113,.12) 40%,rgba(216,181,113,.05));
  --gd-out:cubic-bezier(.23,1,.32,1)}

/* ── 1. Sections clés : titre centré, grand, avec étiquette en pilule ── */
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.sr-home-faq) .sr-section-heading{display:flex;flex-direction:column;align-items:center;text-align:center;border:0!important;padding-bottom:0;margin-bottom:clamp(1.6rem,3vw,2.6rem)}
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.sr-home-faq) .sr-section-heading::after,
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.sr-home-faq) .sr-section-heading::before{display:none!important}
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.sr-home-faq) .sr-section-heading>div{display:flex;flex-direction:column;align-items:center}
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.sr-home-faq) :is(.sr-section-caption,.sr-kicker){
  display:inline-block;font-family:var(--font-body,'DM Sans',sans-serif);font-style:normal;font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sr-gold-light,#f5db9e);
  padding:.45rem .95rem;border-radius:999px;background:rgba(216,181,113,.08);box-shadow:inset 0 0 0 1px rgba(216,181,113,.35);margin-bottom:1rem}
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.sr-home-faq) h2{font-size:clamp(2.3rem,4.4vw,3.7rem)!important;line-height:1.08;max-width:18ch;margin:0 auto;text-wrap:balance}
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.sr-home-faq) .sr-section-heading .sr-text-link{margin-top:1.2rem}
html.gd .gd-envies-sec{text-align:center}
html.gd .gd-envies-sec .gd-onglet-cartes{text-align:left}
html.gd .gd-envies-sec .gd-onglet-phrase{font-size:1.05rem}
html.gd .gd-envies-sec .gd-onglets{margin-left:auto;margin-right:auto}

/* ── 2. L'aurore : un halo doré/violet qui respire derrière les sections clés ── */
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.gd-cercle,.gd-appel,.gd-preuve){position:relative;isolation:isolate}
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.gd-appel,.gd-preuve)::before{content:"";position:absolute;z-index:-1;pointer-events:none;
  left:50%;top:-6%;width:min(78rem,120%);height:clamp(18rem,40vw,30rem);transform:translateX(-50%);
  background:radial-gradient(ellipse 50% 55% at 50% 40%,rgba(245,219,158,.16),transparent 70%),radial-gradient(ellipse 40% 45% at 30% 60%,rgba(140,110,230,.10),transparent 70%),radial-gradient(ellipse 40% 45% at 72% 55%,rgba(216,181,113,.10),transparent 70%);
  filter:blur(10px);animation:gd-aurore 11s ease-in-out infinite alternate}
html.gd .gd-avis::before{top:auto;bottom:-10%}
@keyframes gd-aurore{0%{opacity:.75;transform:translateX(-50%) scale(1)}100%{opacity:1;transform:translateX(-52%) scale(1.06)}}
/* le décor est adouci derrière le contenu pour que les sections clés ressortent */
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes)::after{content:"";position:absolute;inset:-2rem -50vw;z-index:-2;pointer-events:none;
  background:linear-gradient(180deg,transparent,rgba(3,19,30,.55) 18%,rgba(3,19,30,.55) 82%,transparent)}

/* ── 3. Cartes en verre nuit, liseré doré dégradé (le reflet clair en haut, comme Limova) ── */
.gd-verre,html.gd .gd-avis-carte,html.gd .gd-etapes li,html.gd .gd-onglets{position:relative;background:var(--gd-verre)!important;backdrop-filter:blur(14px);box-shadow:0 1.5rem 3rem rgba(0,6,12,.35)!important}
html.gd :is(.gd-avis-carte,.gd-etapes li)::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:var(--gd-liseré);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
html.gd .gd-onglets{box-shadow:inset 0 0 0 1px rgba(216,181,113,.28),0 1rem 2rem rgba(0,6,12,.3)!important}
html.gd .gd-avis-carte{padding:1.9rem 1.8rem;border-radius:1.25rem;transition:transform .5s var(--gd-out)}
@media (hover:hover){html.gd .gd-avis-carte:hover{transform:translateY(-4px)}}
html.gd .gd-avis-carte blockquote{font-size:1.32rem;line-height:1.42}
html.gd .gd-avis-carte figcaption{display:grid;grid-template-columns:auto 1fr;column-gap:.8rem;align-items:center}
html.gd .gd-avis-carte figcaption::before{content:attr(data-initiale);grid-row:span 2;display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:50%;
  font-family:var(--font-display,Cormorant,serif);font-size:1.2rem;color:#1c1303;background:linear-gradient(135deg,#f5db9e,#d8b571)}
html.gd .gd-avis-carte span{font-size:.8rem}
/* 3 étapes en cartes, numéro lumineux */
html.gd .gd-etapes ol{gap:1.3rem}
html.gd .gd-etapes li{padding:2rem 1.8rem 2.2rem;border-radius:1.25rem}
html.gd .gd-etapes li b{width:3rem;height:3rem;font-size:1.6rem;box-shadow:0 0 0 6px rgba(216,181,113,.1),0 0 28px rgba(216,181,113,.45)}
html.gd .gd-etapes li h3{font-size:1.75rem}
html.gd .gd-etapes li p{font-size:1rem}
html.gd .gd-etapes .gd-duo{justify-content:center}
/* cartes d'ambiance des onglets : un peu plus d'air et de lumière */
html.gd .gd-carte-img{border-radius:1rem;box-shadow:0 1rem 2.4rem rgba(0,6,12,.45)}
html.gd .gd-carte-amb b{font-size:1.45rem;margin-top:.2rem}

/* ── 4. Textes : plus grands et plus contrastés dans les sections du parcours ── */
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.gd-cercle,.gd-appel) p{font-size:max(1rem,1em)}
html.gd .sr-home-faq summary{font-size:1.05rem;padding:1.1rem 0}
html.gd .gd-preuve b{text-shadow:0 0 30px rgba(245,219,158,.25)}
html.gd .gd-preuve span{font-size:.78rem}

/* le Cercle : carte de prix en verre, comme un encart « offre » */
html.gd .gd-cercle-texte{padding:clamp(1.8rem,3vw,2.6rem);border-radius:1.5rem;background:var(--gd-verre);backdrop-filter:blur(14px);position:relative;box-shadow:0 1.5rem 3rem rgba(0,6,12,.4)}
html.gd .gd-cercle-texte::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;background:var(--gd-liseré);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
html.gd .gd-cercle-texte>*{position:relative}

@media (max-width:760px){
  html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.sr-home-faq) h2{font-size:2.1rem!important}
  html.gd .gd-avis-carte blockquote{font-size:1.18rem}
}
@media (prefers-reduced-motion:reduce){html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.gd-appel,.gd-preuve)::before{animation:none}}

/* ════════ vitrine.css ════════ */
/* ═════════ Vitrine inspirée de Limova (2026-10-09) : film encadré, Atelier sur téléphone, micro-interactions ═════════ */
:root{--gd-out:cubic-bezier(.23,1,.32,1);--gd-or:#d8b571;--gd-or-clair:#f5db9e}

/* étiquette en pilule (même famille que les sections clés) */
.gd-pilule{display:inline-block;font:500 .7rem/1 var(--font-body,'DM Sans',sans-serif);letter-spacing:.22em;text-transform:uppercase;color:var(--gd-or-clair);
  padding:.5rem 1rem;border-radius:999px;background:rgba(216,181,113,.08);box-shadow:inset 0 0 0 1px rgba(216,181,113,.35)}

/* ── 1. Le film de l'univers ── */
.gd-film{position:relative;isolation:isolate;text-align:center;padding-top:clamp(3rem,7vw,6rem)}
.gd-film::before{content:"";position:absolute;z-index:-1;left:50%;top:38%;width:min(90rem,130%);height:70%;transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(ellipse 45% 50% at 50% 50%,rgba(245,219,158,.13),transparent 70%),radial-gradient(ellipse 35% 40% at 25% 60%,rgba(140,110,230,.10),transparent 70%);filter:blur(12px)}
.gd-film-tete{max-width:46rem;margin:0 auto clamp(2rem,4vw,3.2rem)}
.gd-film-tete h2{font-family:var(--font-display,Cormorant,serif);font-weight:400;font-size:clamp(2.4rem,4.8vw,4rem);line-height:1.05;margin:1rem 0 .8rem;color:var(--sr-ink,#eee6d7);text-wrap:balance}
.gd-film-tete h2 em{color:var(--gd-or-clair);font-style:italic}
.gd-film-tete p{color:var(--sr-muted,#b3c1c2);font-size:1.08rem;line-height:1.6;margin:0 auto;max-width:36rem}
.gd-film-tete>*{opacity:0;transform:translateY(16px);transition:opacity 1s var(--gd-out),transform 1s var(--gd-out)}
.gd-film-tete>:nth-child(2){transition-delay:.12s}.gd-film-tete>:nth-child(3){transition-delay:.24s}
.gd-film.gd-vu .gd-film-tete>*{opacity:1;transform:none}

.gd-film-scene{perspective:1400px;perspective-origin:50% 0}
.gd-film-cadre{--lueur:1;position:relative;max-width:68rem;margin:0 auto;aspect-ratio:16/9;border-radius:1.6rem;padding:.55rem;transform-origin:50% 100%;will-change:transform;
  background:linear-gradient(160deg,rgba(245,219,158,.5),rgba(216,181,113,.08) 30%,rgba(9,33,45,.9) 60%,rgba(216,181,113,.25));
  box-shadow:0 2.5rem 6rem rgba(0,6,12,.6),0 0 calc(5rem * var(--lueur)) rgba(216,181,113,calc(.18 * var(--lueur)))}
.gd-film-video{display:block;width:100%;height:100%;object-fit:cover;border-radius:1.15rem;background:#03131e}
.gd-film-voile{position:absolute;inset:.55rem;border-radius:1.15rem;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,19,30,.1) 40%,rgba(3,19,30,.6));transition:opacity .6s ease}
.gd-film-son{position:absolute;left:50%;bottom:clamp(1.2rem,3vw,2.2rem);transform:translateX(-50%);display:inline-flex;align-items:center;gap:.6rem;
  border:0;cursor:pointer;font:500 .95rem/1 var(--font-body,'DM Sans',sans-serif);color:#1c1303;padding:.95rem 1.5rem;border-radius:999px;
  background:linear-gradient(135deg,#f5db9e,#d8b571);box-shadow:0 .8rem 2rem rgba(0,6,12,.45),0 0 0 0 rgba(245,219,158,.5);
  transition:transform .16s var(--gd-out),box-shadow .3s ease;animation:gd-appel-son 2.8s ease-out infinite}
.gd-film-son svg{width:1.15rem;height:1.15rem}
.gd-film-son:active{transform:translateX(-50%) scale(.97)}
@media (hover:hover){.gd-film-son:hover{box-shadow:0 .8rem 2rem rgba(0,6,12,.45),0 0 0 6px rgba(245,219,158,.18)}}
@keyframes gd-appel-son{0%{box-shadow:0 .8rem 2rem rgba(0,6,12,.45),0 0 0 0 rgba(245,219,158,.45)}70%,100%{box-shadow:0 .8rem 2rem rgba(0,6,12,.45),0 0 0 16px rgba(245,219,158,0)}}
.gd-film-coin{position:absolute;left:clamp(1.2rem,2.6vw,2rem);top:clamp(1rem,2.4vw,1.8rem);font-family:var(--font-display,Cormorant,serif);font-style:italic;font-size:clamp(1rem,1.6vw,1.3rem);
  color:var(--sr-ink,#eee6d7);text-shadow:0 2px 12px rgba(0,0,0,.6);transition:opacity .6s ease}
.gd-film-actif .gd-film-son,.gd-film-actif .gd-film-voile,.gd-film-actif .gd-film-coin{opacity:0;pointer-events:none;animation:none}

/* ── 2. L'Atelier sur un téléphone ── */
html.gd .sr-atelier-feature .sr-feature-art.gd-art-tel{-webkit-mask-image:none;mask-image:none;overflow:visible;min-height:clamp(30rem,46vw,40rem);display:grid;place-items:center}
.gd-tel-scene{--rx:0deg;--ry:0deg;--px:0px;--py:0px;position:relative;width:100%;height:100%;min-height:inherit;display:grid;place-items:center;perspective:1100px}
.gd-tel-aura{position:absolute;inset:6% 10%;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 50% 45%,rgba(245,219,158,.28),rgba(216,181,113,.08) 40%,transparent 68%),radial-gradient(circle at 30% 70%,rgba(140,110,230,.14),transparent 60%);
  filter:blur(18px);animation:gd-respire 7s ease-in-out infinite alternate}
@keyframes gd-respire{from{opacity:.7;transform:scale(.96)}to{opacity:1;transform:scale(1.05)}}
.gd-poussiere{position:absolute;inset:-10% -5%;width:110%;height:120%;pointer-events:none}
.gd-tel-flotte{position:relative;transform-style:preserve-3d;animation:gd-flotte 6s ease-in-out infinite}
@keyframes gd-flotte{0%,100%{translate:0 0}50%{translate:0 -10px}}
.gd-tel{position:relative;width:clamp(14.5rem,21vw,17.5rem);aspect-ratio:9/19;border-radius:2.7rem;padding:.6rem;cursor:pointer;transform-style:preserve-3d;
  transform:rotateX(var(--rx)) rotateY(calc(var(--ry) - 8deg)) rotateZ(2deg);
  background:linear-gradient(145deg,#2a2a2e,#0c0d10 45%,#1d1e22);
  box-shadow:inset 0 0 0 1.5px rgba(245,219,158,.45),inset 0 0 0 4px #050608,0 3rem 5rem rgba(0,6,12,.7),0 0 4rem rgba(216,181,113,.18);
  opacity:0;translate:0 40px;transition:opacity 1.1s var(--gd-out),translate 1.1s var(--gd-out),box-shadow .4s ease}
.gd-tel-vu .gd-tel{opacity:1;translate:0 0}
.gd-tel:focus-visible{outline:2px solid var(--gd-or-clair);outline-offset:6px}
.gd-tel::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.14),transparent 30%,transparent 70%,rgba(255,255,255,.05))}
.gd-tel-ecran{position:relative;height:100%;border-radius:2.15rem;overflow:hidden;background:#03131e;color:#f6efe2}
.gd-tel-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.04)}
.gd-tel-ecran::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(3,19,30,.55),transparent 22%,transparent 38%,rgba(3,19,30,.82) 62%,rgba(3,19,30,.96))}
.gd-tel-ilot{position:absolute;z-index:3;top:.55rem;left:50%;width:32%;height:1.35rem;transform:translateX(-50%);border-radius:999px;background:#000}
.gd-tel-haut{position:absolute;z-index:2;top:.75rem;left:1.25rem;right:1rem;display:flex;justify-content:space-between;font:600 .62rem/1 var(--font-body,'DM Sans',sans-serif)}
.gd-tel-marque{position:absolute;top:1.75rem;left:0;right:0;text-align:center;font-weight:500;letter-spacing:.18em;text-transform:uppercase;font-size:.5rem;color:var(--gd-or-clair)}
.gd-tel-bas{position:absolute;z-index:2;left:.95rem;right:.95rem;bottom:1.05rem;text-align:left}
.gd-tel-lieu{display:block;font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gd-or)}
.gd-tel-titre{display:block;font-family:var(--font-display,Cormorant,serif);font-weight:400;font-size:1.32rem;line-height:1.1;margin:.25rem 0 .75rem}
.gd-tel-pistes{list-style:none;margin:0 0 .8rem;padding:0;display:grid;gap:.5rem}
.gd-tel-pistes li{display:grid;grid-template-columns:1rem 3.6rem 1fr;align-items:center;gap:.45rem;font-size:.66rem;color:rgba(246,239,226,.85)}
.gd-tel-pistes svg{width:.95rem;height:.95rem;color:var(--gd-or-clair)}
.gd-tel-pistes i{position:relative;height:3px;border-radius:3px;background:rgba(246,239,226,.18)}
.gd-tel-pistes em{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(90deg,#d8b571,#f5db9e);transform-origin:0 50%;transform:scaleX(var(--v));
  animation:gd-curseur-vit 5.5s ease-in-out infinite alternate;animation-delay:calc(var(--n) * -1.7s)}
.gd-tel-pistes em::after{content:"";position:absolute;right:-5px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#f6efe2;box-shadow:0 0 10px rgba(245,219,158,.8);transform:scaleX(calc(1 / var(--v)))}
@keyframes gd-curseur-vit{from{transform:scaleX(calc(var(--v) - .14))}to{transform:scaleX(calc(var(--v) + .1))}}
.gd-tel-commandes{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.gd-tel-minuterie{display:inline-flex;align-items:center;gap:.35rem;font-size:.62rem;color:rgba(246,239,226,.8);padding:.4rem .6rem;border-radius:999px;background:rgba(246,239,226,.08);box-shadow:inset 0 0 0 1px rgba(246,239,226,.12)}
.gd-tel-minuterie svg{width:.8rem;height:.8rem;color:var(--gd-or-clair)}
.gd-tel-minuterie b{font-weight:600;color:#f6efe2}
.gd-tel-lire{position:relative;display:grid;place-items:center;width:2.6rem;height:2.6rem;border:0;border-radius:50%;cursor:pointer;color:#1c1303;
  background:linear-gradient(135deg,#f5db9e,#d8b571);box-shadow:0 0 18px rgba(216,181,113,.5);transition:transform .16s var(--gd-out)}
.gd-tel-lire svg{width:1.05rem;height:1.05rem;fill:currentColor}
.gd-tel-lire:active{transform:scale(.92)}
.gd-tel-lire::before{content:"";position:absolute;inset:-5px;border-radius:50%;box-shadow:0 0 0 1px rgba(245,219,158,.5);opacity:0}
.gd-joue .gd-tel-lire::before{animation:gd-onde-lire 1.8s ease-out infinite}
@keyframes gd-onde-lire{from{opacity:.9;transform:scale(.9)}to{opacity:0;transform:scale(1.6)}}
.gd-joue{box-shadow:inset 0 0 0 1.5px rgba(245,219,158,.65),inset 0 0 0 4px #050608,0 3rem 5rem rgba(0,6,12,.7),0 0 5.5rem rgba(216,181,113,.32)!important}

/* les sons flottent autour du téléphone, à des profondeurs différentes (parallaxe) */
html.gd .sr-atelier-feature .gd-art-tel::after,html.gd .sr-atelier-feature .gd-art-tel::before{display:none!important}
.gd-bulles{position:absolute;inset:0;pointer-events:none;transform-style:preserve-3d;transform:translateZ(70px)}
.gd-bulle{position:absolute;display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap;font:500 .82rem/1 var(--font-body,'DM Sans',sans-serif);color:var(--sr-ink,#eee6d7);
  padding:.7rem 1rem;border-radius:999px;background:linear-gradient(160deg,rgba(14,42,56,.82),rgba(3,19,30,.72));backdrop-filter:blur(12px);
  box-shadow:inset 0 0 0 1px rgba(216,181,113,.35),0 1rem 2rem rgba(0,6,12,.45);opacity:0;transition:opacity 1s var(--gd-out),translate 1s var(--gd-out)}
.gd-bulle svg,.gd-bulle .sr-icon{width:1rem;height:1rem;color:var(--gd-or-clair)}
.gd-bulle-1{right:calc(100% - 2.2rem);top:16%;translate:-20px 0;transform:translate(calc(var(--px) * 1.6),calc(var(--py) * 1.6));transition-delay:.35s}
.gd-bulle-2{left:calc(100% - 1.8rem);top:40%;translate:20px 0;transform:translate(calc(var(--px) * 2.2),calc(var(--py) * 2.2));transition-delay:.55s}
.gd-bulle-3{right:calc(100% - 3rem);top:47%;translate:-20px 0;transform:translate(calc(var(--px) * 1.2),calc(var(--py) * 1.2));transition-delay:.75s}
.gd-tel-vu .gd-bulle{opacity:1;translate:0 0}
.gd-tel-vu .gd-bulle-1{animation:gd-flotte 7s ease-in-out infinite .4s}
.gd-tel-vu .gd-bulle-2{animation:gd-flotte 8s ease-in-out infinite 1.2s}
.gd-tel-vu .gd-bulle-3{animation:gd-flotte 6.5s ease-in-out infinite 2s}

/* ── 3. Cartes qui s'inclinent sous le pointeur, reflet doré qui suit la lumière ── */
html.gd main .gd-incline{transform:perspective(900px) rotateX(var(--tx,0deg)) rotateY(var(--ty,0deg))!important;transition:transform .35s var(--gd-out),box-shadow .35s ease!important;transition-delay:0s!important;will-change:transform}
html.gd main :is(.gd-avis-carte,.gd-etapes li,.gd-cercle-texte).gd-incline::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(circle at var(--mx,50%) var(--my,50%),rgba(245,219,158,.13),transparent 45%)}

/* reflet qui passe sur les boutons dorés, de temps en temps */
html.gd main .sr-btn.sr-primary{position:relative;overflow:hidden}
html.gd main .sr-btn.sr-primary::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;pointer-events:none;transform:skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,250,235,.55),transparent);animation:gd-reflet 6s ease-in-out infinite 2s}
@keyframes gd-reflet{0%,78%{left:-60%}100%{left:130%}}

@media (max-width:760px){
  .gd-film-cadre{border-radius:1.1rem;padding:.35rem}
  .gd-film-video,.gd-film-voile{border-radius:.85rem}.gd-film-voile{inset:.35rem}
  .gd-film-son{font-size:.85rem;padding:.8rem 1.15rem}
  .gd-film-coin{display:none}
  html.gd .sr-atelier-feature .sr-feature-art.gd-art-tel{min-height:34rem}
  .gd-tel{width:15rem}
  .gd-bulle{font-size:.72rem;padding:.55rem .8rem}
  .gd-bulle-1{right:calc(100% - 5.5rem);top:9%}.gd-bulle-2{left:calc(100% - 5.5rem);top:30%}.gd-bulle-3{display:none}
}
@media (prefers-reduced-motion:reduce){
  .gd-film-cadre{transform:none!important}
  .gd-film-son,.gd-tel-aura,.gd-tel-flotte,.gd-tel-pistes em,.gd-bulle,html.gd main .sr-btn.sr-primary::after{animation:none!important}
  .gd-tel,.gd-bulle,.gd-film-tete>*{transition:none}
}

/* ═════════ Retour de Sam (2026-10-09) : mockup épuré façon Limova ═════════
   Téléphone droit (plus d'inclinaison ni de bulles ni de poussière), cadre bien visible,
   le bas du téléphone se fond dans la page. L'animation reste dans l'écran. */
.gd-bulles,.gd-poussiere{display:none!important}
.gd-tel-aura{inset:12% 6% 20%;background:radial-gradient(ellipse at 50% 40%,rgba(245,219,158,.16),transparent 65%);animation:none}
.gd-tel-flotte{animation:none;transform-style:flat;
  -webkit-mask-image:linear-gradient(to bottom,#000 62%,rgba(0,0,0,.55) 78%,transparent 94%);mask-image:linear-gradient(to bottom,#000 62%,rgba(0,0,0,.55) 78%,transparent 94%)}
.gd-tel{transform:none!important;width:clamp(17rem,23vw,20rem);aspect-ratio:9/19.5;border-radius:3.1rem;padding:.7rem;
  background:linear-gradient(160deg,#3a3b40,#16171a 30%,#0b0c0e 70%,#2a2b2f);
  box-shadow:inset 0 0 0 1.5px rgba(214,216,224,.38),inset 0 0 0 3px #08090b,inset 0 0 0 4.5px rgba(214,216,224,.08),0 2.5rem 5rem rgba(0,6,12,.55)!important}
.gd-tel::before{content:"";position:absolute;right:-3px;top:24%;width:3px;height:11%;border-radius:0 3px 3px 0;background:linear-gradient(90deg,#2a2b2f,#4a4b50);
  box-shadow:-0px 0 0 0 transparent}
.gd-tel::after{background:linear-gradient(120deg,rgba(255,255,255,.07),transparent 25%)}
.gd-joue{box-shadow:inset 0 0 0 1.5px rgba(245,219,158,.55),inset 0 0 0 3px #08090b,0 2.5rem 5rem rgba(0,6,12,.55),0 0 4rem rgba(216,181,113,.22)!important}
.gd-tel-ecran{border-radius:2.45rem}
.gd-tel-ilot{top:.7rem;height:1.55rem;width:34%}
.gd-tel-haut{top:1.05rem;left:1.6rem;right:1.4rem;font-size:.7rem;align-items:center}
.gd-tel-icones{display:inline-flex;gap:.3rem;align-items:center}
.gd-tel-icones svg{height:.62rem;width:auto;fill:currentColor}
.gd-tel-marque{top:2.3rem}
/* l'interface monte au milieu de l'écran : le bas, fondu, reste juste le décor */
.gd-tel-ecran::before{background:linear-gradient(180deg,rgba(3,19,30,.6),transparent 18%,transparent 30%,rgba(3,19,30,.78) 48%,rgba(3,19,30,.92) 75%)}
.gd-tel-bas{bottom:auto;top:44%;left:1.1rem;right:1.1rem}
.gd-tel-titre{font-size:1.5rem}
.gd-tel-pistes li{font-size:.72rem}
html.gd .sr-atelier-feature .sr-feature-art.gd-art-tel{min-height:0;height:auto!important;aspect-ratio:auto!important;max-height:none!important;padding:1rem 0 0;align-items:start}
.gd-tel-scene{min-height:0}
@media (max-width:760px){
  .gd-tel{width:16rem}
  .gd-tel-flotte{-webkit-mask-image:linear-gradient(to bottom,#000 60%,transparent 90%);mask-image:linear-gradient(to bottom,#000 60%,transparent 90%)}
  html.gd .sr-atelier-feature .sr-feature-art.gd-art-tel{margin-bottom:-4rem}
}

/* ═════════ Film plus immersif (2026-10-09) : cadre fin, lueur ambilight, lecteur maison, mode cinéma ═════════ */
.gd-film-scene{position:relative}
.gd-film-cadre{z-index:1;padding:1px;border-radius:1.3rem;
  background:linear-gradient(160deg,rgba(245,219,158,.75),rgba(216,181,113,.12) 35%,rgba(216,181,113,.06) 65%,rgba(245,219,158,.45));
  box-shadow:0 2.5rem 6rem rgba(0,6,12,.55)}
.gd-film-video{border-radius:calc(1.3rem - 1px);cursor:pointer}
.gd-film-voile{inset:1px;border-radius:calc(1.3rem - 1px)}
/* la lueur : 48×27 pixels du film, très floutés, derrière le cadre */
.gd-film-ambi{position:absolute;z-index:0;left:50%;top:50%;width:min(68rem,100%);aspect-ratio:16/9;height:auto;pointer-events:none;
  transform:translate(-50%,-46%) scale(1.14);filter:blur(56px) saturate(1.5);opacity:.45;transition:opacity 1.2s ease}
.gd-film-actif .gd-film-ambi{opacity:.75}
/* lecteur maison */
.gd-lect{position:absolute;z-index:3;left:1px;right:1px;bottom:1px;display:flex;align-items:center;gap:.8rem;padding:2.4rem 1.2rem 1rem;
  border-radius:0 0 calc(1.3rem - 1px) calc(1.3rem - 1px);background:linear-gradient(180deg,transparent,rgba(1,8,14,.78));
  font:500 .8rem/1 var(--font-body,'DM Sans',sans-serif);color:var(--sr-ink,#eee6d7);font-variant-numeric:tabular-nums;
  opacity:0;translate:0 8px;pointer-events:none;transition:opacity .35s ease,translate .35s var(--gd-out)}
.gd-film-actif .gd-lect{opacity:1;translate:0 0;pointer-events:auto}
.gd-calme .gd-lect{opacity:0;translate:0 8px}
.gd-calme,.gd-calme .gd-film-video{cursor:none}
.gd-lect button{display:grid;place-items:center;width:2.4rem;height:2.4rem;flex:none;border:0;border-radius:50%;cursor:pointer;color:var(--gd-or-clair);
  background:rgba(3,19,30,.55);backdrop-filter:blur(8px);box-shadow:inset 0 0 0 1px rgba(216,181,113,.35);transition:transform .16s var(--gd-out),background-color .2s ease}
.gd-lect button:active{transform:scale(.94)}
@media (hover:hover){.gd-lect button:hover{background:rgba(216,181,113,.18)}}
.gd-lect button svg{width:1.05rem;height:1.05rem}
.gd-lect .gd-lect-lire{width:2.8rem;height:2.8rem;color:#1c1303;background:linear-gradient(135deg,#f5db9e,#d8b571);box-shadow:0 0 18px rgba(216,181,113,.4)}
.gd-lect .gd-lect-lire svg{fill:currentColor}
.gd-lect-muet.coupe{opacity:.55}
.gd-lect-barre{position:relative;flex:1;height:4px;border-radius:4px;background:rgba(238,230,215,.18);cursor:pointer;transition:height .2s ease}
.gd-lect-barre::before{content:"";position:absolute;inset:-10px 0}
@media (hover:hover){.gd-lect-barre:hover{height:6px}}
.gd-lect-barre:focus-visible{outline:2px solid var(--gd-or-clair);outline-offset:4px}
.gd-lect-charge,.gd-lect-prog{position:absolute;inset:0;border-radius:inherit;transform-origin:0 50%;transform:scaleX(0)}
.gd-lect-charge{background:rgba(238,230,215,.22)}
.gd-lect-prog{background:linear-gradient(90deg,#d8b571,#f5db9e);box-shadow:0 0 12px rgba(245,219,158,.55)}
/* mode cinéma : tout s'éteint autour du film, l'en-tête compris */
.gd-cine-voile{position:fixed;inset:0;z-index:990;background:rgba(1,6,10,.9);opacity:0;pointer-events:none;transition:opacity .9s ease}
html.gd-cine-on .gd-cine-voile{opacity:1;pointer-events:auto}
.gd-film.gd-cinema{z-index:991}
.gd-film.gd-cinema .gd-film-tete{opacity:0;transition:opacity .9s ease}
/* plein écran */
.gd-film-cadre:fullscreen{padding:0;border-radius:0;transform:none!important;background:#000}
.gd-film-cadre:fullscreen .gd-film-video{object-fit:contain;border-radius:0}
.gd-film-cadre:fullscreen .gd-lect{border-radius:0}
@media (max-width:760px){
  .gd-lect{gap:.5rem;padding:1.6rem .7rem .6rem}
  .gd-lect button{width:2.1rem;height:2.1rem}.gd-lect .gd-lect-lire{width:2.4rem;height:2.4rem}
  .gd-lect-t[data-t=tot]{display:none}
  .gd-film-ambi{filter:blur(36px) saturate(1.4)}
}
@media (prefers-reduced-motion:reduce){.gd-cine-voile,.gd-lect,.gd-film-ambi{transition:none}}

/* ═════════ Retours de Sam (2026-10-09, suite) ═════════ */
/* bandeau au-dessus de l'en-tête ; le texte reste lisible au survol (le thème passait les liens en or) */
body>.gd-bandeau{z-index:61}
.gd-bandeau:hover,.gd-bandeau:hover .gd-bandeau-txt,.gd-bandeau:hover .gd-bandeau-cta,.gd-bandeau:focus-visible{color:#1c1303!important}
.gd-bandeau:hover .gd-bandeau-tag{color:#f5db9e!important}
.gd-bandeau:focus-visible{outline:2px solid #1c1303;outline-offset:-4px}

/* film : la lumière déborde du cadre, des éclats s'en échappent */
.gd-film-deborde{position:absolute;z-index:2;left:50%;top:0;width:min(68rem,100%);aspect-ratio:16/9;height:auto;pointer-events:none;
  transform:translateX(-50%) scale(1.28);filter:blur(26px) saturate(1.3);opacity:.55;transition:opacity 1s ease}
.gd-film-actif .gd-film-deborde{opacity:.7}
.gd-film-eclats{position:absolute;z-index:4;left:-12%;top:-20%;width:124%;height:140%;pointer-events:none}
.gd-film-son,.gd-lect{z-index:5}
@media (max-width:760px){.gd-film-deborde{transform:translateX(-50%) scale(1.18);filter:blur(16px)}.gd-film-eclats{left:-4%;width:108%}}
@media (prefers-reduced-motion:reduce){.gd-film-eclats{display:none}}

/* téléphone : plus grand, et vraiment utilisable */
.gd-tel{width:clamp(19rem,25vw,22.5rem);cursor:default}
.gd-tel-flotte{-webkit-mask-image:linear-gradient(to bottom,#000 72%,rgba(0,0,0,.5) 86%,transparent 97%);mask-image:linear-gradient(to bottom,#000 72%,rgba(0,0,0,.5) 86%,transparent 97%)}
.gd-tel-ecran{touch-action:pan-y;user-select:none}
.gd-tel-video{transition:opacity .4s ease}
.gd-glisse-g .gd-tel-video{animation:gd-glisse-g .55s var(--gd-out)}.gd-glisse-d .gd-tel-video{animation:gd-glisse-d .55s var(--gd-out)}
@keyframes gd-glisse-g{from{opacity:.2;translate:8% 0}to{opacity:1;translate:0 0}}
@keyframes gd-glisse-d{from{opacity:.2;translate:-8% 0}to{opacity:1;translate:0 0}}
.gd-tel-bas{top:40%;left:1.15rem;right:1.15rem}
.gd-tel-choix{display:grid;grid-template-columns:2rem 1fr 2rem;align-items:center;gap:.3rem;text-align:center}
.gd-tel-choix button{display:grid;place-items:center;width:2rem;height:2rem;border:0;border-radius:50%;cursor:pointer;color:#f6efe2;background:rgba(246,239,226,.1);
  box-shadow:inset 0 0 0 1px rgba(246,239,226,.15);transition:transform .16s var(--gd-out),background-color .2s ease}
.gd-tel-choix button:active{transform:scale(.9)}
@media (hover:hover){.gd-tel-choix button:hover{background:rgba(216,181,113,.25)}}
.gd-tel-choix svg{width:1rem;height:1rem}
.gd-tel-nom .gd-tel-titre{font-size:1.45rem;margin:.2rem 0 0}
.gd-tel-points{display:flex;justify-content:center;gap:.35rem;margin:.6rem 0 .9rem}
.gd-tel-points i{width:.35rem;height:.35rem;border-radius:999px;background:rgba(246,239,226,.3);transition:width .3s var(--gd-out),background-color .3s ease}
.gd-tel-points i.on{width:1.1rem;background:var(--gd-or-clair)}
.gd-tel-pistes{gap:.35rem;margin:0 0 .9rem}
.gd-tel-pistes li{display:grid;grid-template-columns:5.2rem 1fr;align-items:center;gap:.5rem;padding:.35rem .55rem;border-radius:.8rem;background:rgba(246,239,226,.06);font-size:.74rem;transition:opacity .25s ease}
.gd-tel-pistes li button{display:flex;align-items:center;gap:.4rem;border:0;background:none;padding:0;color:inherit;font:inherit;cursor:pointer;text-align:left}
.gd-tel-pistes li.coupe{opacity:.45}
.gd-tel-pistes li.coupe svg{color:rgba(246,239,226,.6)}
.gd-tel-pistes input{-webkit-appearance:none;appearance:none;width:100%;height:1.4rem;margin:0;background:transparent;cursor:pointer;
  --pc:calc(var(--v) * 100%)}
.gd-tel-pistes input::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,#d8b571,#f5db9e var(--pc),rgba(246,239,226,.2) var(--pc))}
.gd-tel-pistes input::-moz-range-track{height:4px;border-radius:4px;background:linear-gradient(90deg,#d8b571,#f5db9e var(--pc),rgba(246,239,226,.2) var(--pc))}
.gd-tel-pistes input::-webkit-slider-thumb{-webkit-appearance:none;width:1rem;height:1rem;margin-top:-6px;border-radius:50%;background:#f6efe2;box-shadow:0 0 10px rgba(245,219,158,.8);transition:transform .15s var(--gd-out)}
.gd-tel-pistes input::-moz-range-thumb{width:1rem;height:1rem;border:0;border-radius:50%;background:#f6efe2;box-shadow:0 0 10px rgba(245,219,158,.8)}
.gd-tel-pistes input:active::-webkit-slider-thumb{transform:scale(1.25)}
.gd-tel-pistes input:focus-visible{outline:2px solid var(--gd-or-clair);outline-offset:2px;border-radius:4px}
.gd-tel-minuterie{border:0;cursor:pointer;font:inherit;font-size:.68rem;padding:.5rem .75rem}
.gd-tel-lire{width:3rem;height:3rem}
.gd-tel-ouvrir{display:block;margin-top:.9rem;text-align:center;font-size:.72rem;color:var(--gd-or-clair);text-decoration:none;letter-spacing:.04em}
@media (hover:hover){.gd-tel-ouvrir:hover{text-decoration:underline;text-underline-offset:3px}}
@media (max-width:760px){.gd-tel{width:min(21rem,86vw)}}

/* les vraies lumières du film sortent du cadre (remplace les éclats en bulles) */
.gd-film-eclats{display:none!important}
.gd-film-deborde{left:50%;top:50%;width:auto;aspect-ratio:auto;transform:translate(-50%,-50%);transform-origin:50% 84.7%;
  filter:blur(1.2px) saturate(1.15) brightness(1.1);opacity:.95;z-index:2}
.gd-film-actif .gd-film-deborde{opacity:1}
@media (max-width:760px){.gd-film-deborde{transform:translate(-50%,-50%);filter:blur(1px)}}

/* le fondu du bas coupait l'ombre du téléphone en rectangle : la zone du fondu englobe maintenant l'ombre */
.gd-tel-flotte{padding:4rem 5rem 0;margin:-4rem -5rem 0;
  -webkit-mask-image:linear-gradient(to bottom,#000 74%,rgba(0,0,0,.5) 87%,transparent 97%);mask-image:linear-gradient(to bottom,#000 74%,rgba(0,0,0,.5) 87%,transparent 97%)}

/* ═════════ Ouverture du hero plus nette (retour de Sam : « pas premium ») ═════════
   Avant : un petit anneau agrandi 110 fois → une bande floue et épaisse. Maintenant : un liseré de lumière fin,
   dessiné au rayon exact du portail (même durée, même courbe), qui s'éteint quand le lieu est entièrement ouvert.
   Le texte du hero s'efface vite au lieu de traîner en flou. */
@property --gd-r{syntax:'<length>';inherits:false;initial-value:0px}
html.gd .gd-anneau{inset:0;left:0;top:0;width:auto;height:auto;margin:0;border:0;border-radius:0;box-shadow:none;transform:none;opacity:0;z-index:3;
  background:radial-gradient(circle at var(--px,50%) var(--py,50%),transparent calc(var(--gd-r) - 60px),rgba(245,219,158,.10) calc(var(--gd-r) - 8px),
    rgba(255,246,222,.95) var(--gd-r),rgba(245,219,158,.28) calc(var(--gd-r) + 4px),transparent calc(var(--gd-r) + 34px))}
html.gd .gd-anneau.go{animation:gd-liseré 1.4s var(--gd-portail) forwards}
@keyframes gd-liseré{0%{--gd-r:0px;opacity:1}72%{opacity:1}100%{--gd-r:var(--rmax,1600px);opacity:0}}
html.gd .gd-clip{transition:clip-path 1.4s var(--gd-portail),opacity .3s ease,transform 2.4s var(--gd-out)}
html.gd .sr-home-hero .sr-hero-copy{transition:opacity .28s ease,filter .28s ease,transform .4s var(--gd-out)}
html.gd .sr-home-hero.gd-choix .sr-hero-copy,html.gd .sr-home-hero.gd-ecoute .sr-hero-copy{filter:blur(4px);transform:scale(.985)}
html.gd .gd-envies,html.gd .gd-cartel{transition:opacity .7s var(--gd-out),filter .7s var(--gd-out),transform .7s var(--gd-out)}
html.gd .gd-ecoute .gd-cartel{transition-delay:.75s}
html.gd .gd-choix .gd-envies{transition-delay:.18s}
html.gd .gd-envie{transition:transform .5s var(--gd-out),box-shadow .3s ease,border-color .3s ease}
html.gd .gd-choix .gd-envie{animation:gd-envie-in .7s var(--gd-out) both;animation-delay:calc(.25s + var(--n) * 70ms)}
@keyframes gd-envie-in{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html.gd .gd-anneau{display:none}html.gd .gd-choix .gd-envie{animation:none}}
/* le débordement s'éteint avant les bords de sa zone (plus de rectangle visible) */
.gd-film-deborde{opacity:.88;
  -webkit-mask-image:linear-gradient(to right,transparent 0,#000 15.5%,#000 84.5%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 15.5%,#000 84.5%,transparent 100%);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent 0,#000 15.5%,#000 84.5%,transparent 100%),linear-gradient(to bottom,transparent 0,#000 15.5%,#000 84.5%,transparent 100%);mask-composite:intersect}
.gd-film-ambi{-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 55%,transparent 100%)}
.gd-film-deborde{
  -webkit-mask-image:linear-gradient(to right,transparent 7.5%,#000 15.6%,#000 84.4%,transparent 92.5%),linear-gradient(to bottom,transparent 7.5%,#000 15.6%,#000 84.4%,transparent 92.5%);
  mask-image:linear-gradient(to right,transparent 7.5%,#000 15.6%,#000 84.4%,transparent 92.5%),linear-gradient(to bottom,transparent 7.5%,#000 15.6%,#000 84.4%,transparent 92.5%)}

/* ═════════ Performance (2026-10-09) : les animations en boucle n'animent plus que transform et opacity ═════════
   (avant : « left » et « box-shadow » → recalcul et redessin de la page à chaque image) */
html.gd main .sr-btn.sr-primary::after{left:0;width:40%;transform:translateX(-160%) skewX(-20deg);animation:gd-reflet-t 6s ease-in-out infinite 2s;will-change:transform}
@keyframes gd-reflet-t{0%,78%{transform:translateX(-160%) skewX(-20deg)}100%{transform:translateX(330%) skewX(-20deg)}}
.gd-bandeau::after{left:0;width:25%;transform:translateX(-130%) skewX(-20deg);animation:gd-bandeau-reflet-t 7s ease-in-out infinite 1.5s;will-change:transform}
@keyframes gd-bandeau-reflet-t{0%,70%{transform:translateX(-130%) skewX(-20deg)}100%{transform:translateX(480%) skewX(-20deg)}}
.gd-film-son{animation:none}
.gd-film-son::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:0 0 0 2px rgba(245,219,158,.55);animation:gd-son-anneau 2.8s ease-out infinite}
@keyframes gd-son-anneau{0%{opacity:.9;transform:scale(1)}70%,100%{opacity:0;transform:scale(1.35,1.6)}}
/* ondes du mini-lecteur : hauteur fixe, on anime l'échelle ; à l'arrêt quand le lecteur est caché */
.gd-ondes i{height:13px;transform-origin:50% 100%;transform:scaleY(.3);animation:gd-ondes-h 1.1s ease-in-out infinite}
@keyframes gd-ondes-h{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
.gd-lecteur:not(.visible) .gd-ondes i{animation-play-state:paused}
.gd-piste:not(.on) .gd-ondes i{animation:none;transform:scaleY(.23)}
@media (prefers-reduced-motion:reduce){.gd-film-son::before,.gd-ondes i{animation:none}}

/* ═════════ Retours mobile de Sam (2026-10-09, iPhone) ═════════ */
@media (max-width:760px){
  /* 1. bandeau sur une seule ligne fine */
  body>.gd-bandeau{gap:.55rem;padding:.42rem .75rem;font-size:.74rem;justify-content:space-between}
  .gd-bandeau-tag{white-space:nowrap;flex:none;font-size:.56rem;letter-spacing:.12em;padding:.2rem .5rem}
  .gd-bandeau-txt{flex:1;min-width:0;max-width:none}
  .gd-bandeau-cta{flex:none;font-size:.72rem}
  /* 2-3. choix des envies : tout tient entre l'en-tête et la barre du bas */
  html.gd .gd-envies{place-content:center;padding-top:.5rem;padding-bottom:5.5rem}
  html.gd .gd-envies .gd-surtitre{letter-spacing:.18em;font-size:.64rem;margin:0}
  html.gd .gd-envies .gd-titre{font-size:1.9rem;margin:.25em 0 .7em}
  html.gd .gd-liste{gap:.55rem}
  html.gd .gd-envie{display:grid;grid-template-columns:1fr auto;align-items:baseline;column-gap:.8rem;padding:.8rem 1rem}
  html.gd .gd-envie b{font-size:1.35rem;margin:0}
  html.gd .gd-envie small{margin:0;font-size:.6rem;letter-spacing:.1em;text-align:right}
  html.gd .gd-envie span{grid-column:1 / -1;font-size:.8rem;line-height:1.4;margin-top:.25rem}
  html.gd .gd-envies .gd-lien{margin-top:.6rem}
  /* 4. onglets : tous visibles (plus petits) ; s'ils débordent encore, un fondu à droite montre qu'on peut faire glisser */
  html.gd .gd-onglets{gap:0;padding:.25rem;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent)}
  html.gd .gd-onglets.gd-fin{-webkit-mask-image:none;mask-image:none}
  html.gd .gd-onglets button{font-size:.8rem;padding:.5rem .62rem}
  html.gd .gd-curseur{top:.25rem;bottom:.25rem}
  /* 5. mini-lecteur compact, à droite, pour ne plus couvrir le contenu */
  .gd-lecteur{left:auto;right:.75rem;gap:.5rem;padding:.3rem .8rem .3rem .3rem;max-width:62vw}
  .gd-lecteur button{width:1.9rem;height:1.9rem}
  .gd-lecteur .gd-nom{font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
}

/* iPhone : seule l'image (moitié haute) capte le glissement ; les curseurs et boutons restent libres */
.gd-tel-ecran{touch-action:auto!important}
.gd-tel-glisse{position:absolute;z-index:1;left:0;right:0;top:3rem;height:calc(40% - 3rem);touch-action:pan-y;cursor:grab}
.gd-tel-pistes input{touch-action:pan-x}
/* plus rien ne dépasse de l'écran sur mobile (la page ne dézoome plus) */
html.gd .gd-boite-atelier,html.gd .gd-boite-film,html.gd .gd-film{overflow-x:clip}
@media (max-width:760px){.gd-tel-flotte{padding:3rem 0 0;margin:-3rem 0 0}}
/* curseurs plus faciles au doigt : zone tactile haute, rond plus gros, piste plus épaisse */
@media (pointer:coarse){
  .gd-tel-pistes li{padding:.45rem .6rem}
  .gd-tel-pistes input{height:2.2rem;touch-action:none}
  .gd-tel-pistes input::-webkit-slider-runnable-track{height:6px}
  .gd-tel-pistes input::-webkit-slider-thumb{width:1.45rem;height:1.45rem;margin-top:-.47rem}
}
/* mobile : le halo et le voile des sections clés restaient plus larges que l'écran (la page dézoomait) */
@media (max-width:760px){
  html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes)::after{left:calc(var(--sr-pad,1.25rem) * -1);right:calc(var(--sr-pad,1.25rem) * -1)}
  html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes,.gd-appel,.gd-preuve,.gd-film)::before{width:90vw;max-width:90vw}
}

/* ═════════ Avis repliés + carrousel des sorties (2026-10-09) ═════════ */
html.gd .gd-avis-vedette{max-width:46rem;margin:0 auto 1.6rem;text-align:center;padding:clamp(1.8rem,4vw,2.8rem)!important}
html.gd .gd-avis-vedette blockquote{font-size:clamp(1.35rem,2.4vw,1.75rem)!important;line-height:1.38}
html.gd .gd-avis-vedette figcaption{grid-template-columns:auto auto!important;text-align:left;width:max-content;max-width:100%;margin:0 auto}
.gd-avis-pli{position:relative;max-height:17rem;overflow:hidden;transition:max-height .7s var(--gd-out)}
.gd-avis-pli::after{content:"";position:absolute;left:0;right:0;bottom:0;height:11rem;pointer-events:none;background:linear-gradient(to bottom,transparent,var(--sr-bg,#03131e) 88%);transition:opacity .5s ease}
.gd-avis-pli.ouvert::after{opacity:0}
.gd-avis-plus{position:absolute;z-index:2;left:50%;bottom:1.2rem;transform:translateX(-50%);border:0;cursor:pointer;font:500 .9rem/1 var(--font-body,'DM Sans',sans-serif);color:var(--gd-or-clair);
  padding:.8rem 1.3rem;border-radius:999px;background:rgba(3,19,30,.85);backdrop-filter:blur(8px);box-shadow:inset 0 0 0 1px rgba(216,181,113,.45),0 .6rem 1.5rem rgba(0,6,12,.5);transition:transform .16s var(--gd-out),opacity .3s ease}
.gd-avis-plus:active{transform:translateX(-50%) scale(.97)}
.gd-avis-pli.ouvert .gd-avis-plus{opacity:0;pointer-events:none}
@media (max-width:760px){.gd-avis-pli{max-height:15rem}.gd-avis-pli::after{height:9rem}}

.gd-carrousel-points{display:none}
@media (max-width:760px){
  html.gd .gd-carrousel{display:flex!important;gap:.9rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
    margin:0 calc(var(--sr-pad,1.25rem) * -1);padding:0 var(--sr-pad,1.25rem) .4rem;scroll-padding:0 var(--sr-pad,1.25rem)}
  html.gd .gd-carrousel::-webkit-scrollbar{display:none}
  html.gd .gd-carrousel>*{flex:0 0 84%;scroll-snap-align:center;min-width:0}
  .gd-carrousel-points{display:flex;justify-content:center;gap:.4rem;margin-top:.9rem}
  .gd-carrousel-points i{width:.4rem;height:.4rem;border-radius:999px;background:rgba(238,230,215,.25);transition:width .3s var(--gd-out),background-color .3s ease}
  .gd-carrousel-points i.on{width:1.2rem;background:var(--gd-or-clair)}
}

/* voile pleine largeur sans élargir la page : border-image peint au-delà des bords (débordement visuel, pas de défilement) */
html.gd :is(.gd-envies-sec,.gd-avis,.gd-etapes)::after{top:-2rem;bottom:-2rem;left:0!important;right:0!important;background:none;
  border-image:linear-gradient(180deg,transparent,rgba(3,19,30,.55) 18%,rgba(3,19,30,.55) 82%,transparent) fill 0 / / 0 100vw}

/* fondu des avis en transparence (le décor reste visible) ; le bouton est sous le pli, non masqué */
.gd-avis-pli::after{display:none}
.gd-avis-pli{-webkit-mask-image:linear-gradient(to bottom,#000 35%,transparent 96%);mask-image:linear-gradient(to bottom,#000 35%,transparent 96%)}
.gd-avis-pli.ouvert{-webkit-mask-image:none;mask-image:none}
.gd-avis-plus{position:relative;left:auto;bottom:auto;transform:none;display:block;margin:-3.2rem auto 0}
.gd-avis-plus:active{transform:scale(.97)}
.gd-avis-plus.ouvert{display:none}

/* scène vidéo sans accord YouTube : image + bouton, YouTube chargé seulement au clic */
.gd-yt-lancer{position:relative;display:grid;place-items:center;align-content:center;gap:.7rem;width:100%;height:100%;padding:0;border:0;cursor:pointer;background:#03131e;color:var(--sr-ink,#eee6d7);overflow:hidden}
.gd-yt-lancer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.gd-yt-bouton{position:relative;font:600 1rem/1 var(--font-body,"DM Sans",sans-serif);color:#1c1303;padding:.95rem 1.5rem;border-radius:999px;background:linear-gradient(135deg,#f5db9e,#d8b571);box-shadow:0 .8rem 2rem rgba(0,6,12,.45);transition:transform .16s cubic-bezier(.23,1,.32,1)}
.gd-yt-lancer:active .gd-yt-bouton{transform:scale(.97)}
.gd-yt-lancer small{position:relative;font-size:.75rem;color:rgba(238,230,215,.85);text-shadow:0 1px 6px rgba(0,0,0,.8)}

/* 5 avis : la dernière rangée est centrée (plus de trou à droite) */
@media (min-width:761px){html.gd .gd-avis-grille{display:flex!important;flex-wrap:wrap;justify-content:center}
  html.gd .gd-avis-grille>.gd-avis-carte{flex:0 1 calc((100% - 2.4rem) / 3)}}

/* halo des compteurs : il s'éteint avant les bords du bandeau (plus de ligne nette en bas) */
html.gd .gd-preuve::before{top:0;bottom:0;height:auto;
  -webkit-mask-image:radial-gradient(ellipse 60% 50% at 50% 50%,#000 35%,transparent 100%);mask-image:radial-gradient(ellipse 60% 50% at 50% 50%,#000 35%,transparent 100%)}

/* v17.21 : texte d'accroche et 10 liens à mots-clés sous les onglets « par envie » */
.gd-envies-intro{color:var(--sr-muted,#b3c1c2);margin:-.6rem auto 1.4rem;max-width:36rem}
html.gd .gd-envies-sec .gd-envies-liens{display:flex!important;flex-wrap:wrap;justify-content:center;gap:.4rem .5rem;margin:1.8rem auto 0;max-width:52rem}
html.gd .gd-envies-liens a{font-size:.82rem;color:var(--sr-gold-light,#f5db9e);text-decoration:none;padding:.45rem .8rem;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(216,181,113,.28);background:rgba(3,19,30,.45);transition:background-color .25s ease,box-shadow .25s ease}
@media (hover:hover){html.gd .gd-envies-liens a:hover{background:rgba(216,181,113,.14);box-shadow:inset 0 0 0 1px rgba(245,219,158,.6)}}
@media (max-width:760px){html.gd .gd-envies-liens a{font-size:.74rem;padding:.4rem .65rem}}

/* v17.21 : « Qui compose ces ambiances ? » — carte centrée, même famille que les sections clés */
html.gd .sr-home-auteur{max-width:46rem;margin:0 auto;text-align:center;padding-top:clamp(2.5rem,6vw,4.5rem);padding-bottom:clamp(2.5rem,6vw,4.5rem)}
html.gd .sr-home-auteur .sr-section-heading{display:flex;flex-direction:column;align-items:center;border:0!important;padding-bottom:0;margin-bottom:1.2rem}
html.gd .sr-home-auteur .sr-section-heading::after,html.gd .sr-home-auteur .sr-section-heading::before{display:none!important}
html.gd .sr-home-auteur .sr-kicker{display:inline-block;font-size:.7rem;letter-spacing:.22em;color:var(--sr-gold-light,#f5db9e);padding:.45rem .95rem;border-radius:999px;background:rgba(216,181,113,.08);box-shadow:inset 0 0 0 1px rgba(216,181,113,.35);margin-bottom:1rem}
html.gd .sr-home-auteur h2{font-size:clamp(2.1rem,4vw,3.2rem)!important;margin:0}
html.gd .sr-home-auteur .sr-section-intro{margin:0 auto 1.4rem;padding:clamp(1.4rem,3vw,2rem);border-radius:1.25rem;font-size:1.05rem;line-height:1.75;color:var(--sr-ink,#eee6d7);
  background:linear-gradient(160deg,rgba(14,42,56,.72),rgba(3,19,30,.62));backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px rgba(216,181,113,.22),0 1.5rem 3rem rgba(0,6,12,.35)}

/* v17.21.4 : les 10 liens « par envie » en ligne éditoriale (plus de pastilles encadrées) */
html.gd .gd-envies-sec .gd-envies-liens{gap:.35rem 0;margin-top:2.2rem;max-width:58rem}
html.gd .gd-envies-sec .gd-envies-liens::before{content:"Toutes les envies";flex:0 0 100%;text-align:center;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--sr-muted,#b3c1c2);margin-bottom:.6rem}
html.gd .gd-envies-liens a{box-shadow:none!important;background:none!important;border-radius:0;padding:.2rem .1rem;font-size:.9rem;color:var(--sr-ink,#eee6d7);
  text-decoration:underline;text-decoration-color:rgba(216,181,113,0);text-underline-offset:5px;transition:color .25s ease,text-decoration-color .25s ease}
html.gd .gd-envies-liens a+a::before{content:"·";display:inline-block;margin:0 .75rem;color:var(--sr-gold,#d8b571);text-decoration:none}
@media (hover:hover){html.gd .gd-envies-liens a:hover{color:var(--sr-gold-light,#f5db9e);text-decoration-color:rgba(216,181,113,.7)}}
@media (max-width:760px){html.gd .gd-envies-liens a{font-size:.8rem}html.gd .gd-envies-liens a+a::before{margin:0 .45rem}
  html.gd .sr-home-hero h1.sr-hero-h1 .sr-hero-category{font-size:.58rem;letter-spacing:.12em;max-width:19rem;margin-inline:auto}}
html.gd .gd-envies-sec .gd-envies-liens a{border:0!important;outline:0;min-height:0}