/* ===== Animations ACF : discrètes, cohérentes, désactivées si « réduire les animations » ===== */
:root{--ease:cubic-bezier(.2,.7,.2,1)}
/* barre de progression de lecture */
#progress{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:linear-gradient(90deg,var(--cyan),#7B5CFF);z-index:200;pointer-events:none}
/* en-tête qui se cache en descendant, revient en remontant */
header.top{transition:transform .45s var(--ease),background .3s,box-shadow .3s}
header.top.hide{transform:translateY(-100%)}
/* apparition en cascade des grilles */
.stg{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0ms)}
.stg.in{opacity:1;transform:none}
/* titre du haut : mots qui montent */
.hero h1 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.06em;margin-bottom:-.06em}
.hero h1 .w>span{display:inline-block;transform:translateY(105%);transition:transform 1s var(--ease);transition-delay:var(--d,0ms)}
.hero.go h1 .w>span{transform:none}
.hero .eyebrow,.hero .lead,.hero .ctas,.hero .dateblock,.phero .eyebrow,.phero h1,.phero .lead,.phero .ctas,.phero .crumbs,.phero-side{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.hero.go .eyebrow{opacity:1;transform:none;transition-delay:.05s}
.hero.go .lead{opacity:1;transform:none;transition-delay:.55s}
.hero.go .ctas{opacity:1;transform:none;transition-delay:.7s}
.hero.go .dateblock{opacity:1;transform:none;transition-delay:.85s}
.phero.go .crumbs,.phero.go .eyebrow{opacity:1;transform:none;transition-delay:.05s}
.phero.go h1{opacity:1;transform:none;transition-delay:.15s}
.phero.go .lead{opacity:1;transform:none;transition-delay:.3s}
.phero.go .ctas{opacity:1;transform:none;transition-delay:.45s}
.phero.go .phero-side{opacity:1;transform:none;transition-delay:.4s}
.phero .rv{opacity:1;transform:none}
/* légère respiration de l'image du haut */
.hero .poster{animation:kb 22s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.08)}}
/* photos qui se dévoilent */
.mosaic figure.rv,.mz figure.stg,.summit.rv,.stack.rv img,.banner.rv{clip-path:inset(14% 0 0 0 round 18px);transition:clip-path 1.2s var(--ease),opacity .9s var(--ease),transform .9s var(--ease)}
.mosaic figure.rv.in,.mz figure.stg.in,.summit.rv.in,.stack.rv.in img,.banner.rv.in{clip-path:inset(0 0 0 0 round 18px)}
.mosaic figure.rv img,.mz figure.stg img,.summit.rv img,.banner.rv img{transform:scale(1.14);transition:transform 1.6s var(--ease)}
.mosaic figure.rv.in img,.mz figure.stg.in img,.summit.rv.in img,.banner.rv.in img{transform:scale(1)}
.mosaic figure.rv.in:hover img,.mz figure.stg.in:hover img,.summit.rv.in:hover img{transform:scale(1.05)}
.stack.rv img{transition-delay:.15s}
.stack.rv img.b{transition-delay:.4s}
/* mots fantômes en parallaxe */
.head .ghost{will-change:translate}
/* chiffres clés : soulignement qui se trace */
.stats>div,.kpis>div{position:relative}
.stats>div::before,.kpis>div::before{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:var(--cyan);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.2s var(--ease) .2s;opacity:.85}
.rv.in .stats>div::before,.stats.rv.in>div::before,.kpis.rv.in>div::before{transform:scaleX(1)}
.stats.rv.in>div:nth-child(2)::before,.kpis.rv.in>div:nth-child(2)::before{transition-delay:.35s}
.stats.rv.in>div:nth-child(3)::before,.kpis.rv.in>div:nth-child(3)::before{transition-delay:.5s}
.stats.rv.in>div:nth-child(4)::before,.kpis.rv.in>div:nth-child(4)::before{transition-delay:.65s}
/* survols : cartes qui se soulèvent, flèches qui avancent */
.card,.summit,.extra,.explore a,.kc,.ytc .ytt,.pc .gi,.ed,.days a{transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .25s,background .25s}
.card:hover,.extra:hover,.explore a:hover,.ed:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(15,11,30,.14)}
.summit:hover,.kc:hover{transform:translateY(-5px);box-shadow:0 26px 60px rgba(0,0,0,.35)}
.btn svg,.explore a svg,.kc i svg{transition:transform .3s var(--ease)}
.btn:hover svg,.explore a:hover svg,.kc:hover i svg{transform:translate(3px,-3px)}
/* reflet sur les boutons principaux */
.btn-cyan{position:relative;overflow:hidden;isolation:isolate}
.btn-cyan::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);z-index:-1;transition:left .7s var(--ease)}
.btn-cyan:hover::after{left:120%}
/* bouton lecture qui pulse */
.vid button,.pl-screen .rp{animation:pulse 2.4s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(0,177,229,.55)}70%{box-shadow:0 0 0 22px rgba(0,177,229,0)}100%{box-shadow:0 0 0 0 rgba(0,177,229,0)}}
/* compte à rebours : les secondes basculent */
.countdown .tk{animation:tk .45s var(--ease)}
@keyframes tk{from{transform:translateY(-35%);opacity:.2}to{transform:none;opacity:1}}
/* lueur qui dérive doucement dans les sections sombres */
.glow{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.glow::before{content:"";position:absolute;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(0,177,229,.16),rgba(0,177,229,0) 65%);top:-160px;left:-120px;animation:drift 18s ease-in-out infinite alternate}
@keyframes drift{0%{transform:translate(0,0)}50%{transform:translate(55vw,30%)}100%{transform:translate(20vw,60%)}}
.has-glow{position:relative;isolation:isolate}
.has-glow>.wrap{position:relative;z-index:1}
/* respect des préférences d'accessibilité */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .stg,.hero .eyebrow,.hero .lead,.hero .ctas,.hero .dateblock,.phero .eyebrow,.phero h1,.phero .lead,.phero .ctas,.phero .crumbs,.phero-side{opacity:1!important;transform:none!important}
  .hero h1 .w>span{transform:none!important}
  .mosaic figure.rv,.mz figure.stg,.summit.rv,.stack.rv img,.banner.rv{clip-path:none!important}
  .mosaic figure.rv img,.mz figure.stg img,.summit.rv img,.banner.rv img{transform:none!important}
  #progress,.glow{display:none}
}
/* aucun débordement horizontal (mots fantômes, parallaxe) — clip garde le sticky */
main,footer{overflow-x:clip}
.subnav{transition:top .45s var(--ease)}
body:has(header.top.hide) .subnav{top:0}
/* ===== Correctifs smartphone ===== */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:hidden}               /* repli pour les navigateurs sans overflow:clip (iOS < 16) */
.hero,.phero,section{max-width:100vw}
@media (max-width:1080px){
  header.top.hide{transform:none}     /* le menu reste toujours visible sur mobile et tablette */
  header.top{position:fixed}
  body.menu-open{overflow:hidden}
  body.menu-open header.top{background:var(--night)}
  .drawer{max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  .subnav{top:72px}
  body:has(header.top.hide) .subnav{top:72px}
}
@media (max-width:480px){
  .top .actions .btn-cyan{display:none} /* l'en-tête garde le logo et le menu ; « Réserver » reste dans la page */
  .top .actions .lang-btn{display:none}
  .sec{padding:64px 0}
  .head{margin-bottom:40px}
  .head h2{font-size:clamp(28px,8vw,36px);line-height:1.12}
  .head .ghost{font-size:clamp(44px,15vw,64px);letter-spacing:.06em}
  .phero h1{font-size:clamp(40px,12vw,56px)}
  .hero h1{font-size:clamp(46px,14vw,64px)}
  .hero .ctas .btn,.phero .ctas .btn{width:100%;justify-content:center}
  .dateblock .year{font-size:60px}
  .dateblock .countdown{gap:16px}
  .toc a{white-space:normal}
  .summit .in h3{font-size:26px}
  .summit .in{padding:20px}
  .days b{font-size:28px}
  .mtiles{gap:8px}
  .mtile b{font-size:15px}
  .mtile small{display:none}
  .pl-th{width:96px}
  .ytg,.pcs,.kit{grid-template-columns:1fr}
  .pcs{grid-template-columns:1fr 1fr}
  .reels{grid-template-columns:1fr 1fr}
  .spn{grid-template-columns:1fr 1fr}
  .tl{grid-template-columns:1fr 1fr}
  .kpis{gap:24px 16px}
}
