/* ===== Wayve : couche de design « éditorial » =====
   Courbes : ease-out fort pour les entrées, ease-in-out pour ce qui bouge à l'écran. */
:root{--e-out:cubic-bezier(.23,1,.32,1);--e-io:cubic-bezier(.77,0,.175,1)}

/* 1. Accueil : en défilant, la vidéo se referme en cadre arrondi */
.vhero{will-change:clip-path}
.vhero video{transform-origin:50% 40%}

/* 2. Titres : chaque mot monte depuis une ligne invisible */
.wsplit .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.wsplit .w > span{display:inline-block;transform:translateY(108%);transition:transform .9s var(--e-out);transition-delay:calc(var(--d,0) * 45ms)}
.wsplit.in .w > span{transform:none}
.js .wsplit.fx{opacity:1;transform:none}

/* 3. Photos : elles se dévoilent de bas en haut, et l'image se pose */
.js .h-res-card.fx,.js .h-coach-pic.fx{opacity:1;transform:none;clip-path:inset(100% 0 0 0 round 20px);transition:clip-path 1.1s var(--e-io);transition-delay:calc(var(--i,0) * 90ms)}
.js .h-res-card.fx.in,.js .h-coach-pic.fx.in{clip-path:inset(0 0 0 0 round 20px)}
.js .h-coach-pic.fx{clip-path:inset(100% 0 0 0 round 24px)}
.js .h-coach-pic.fx.in{clip-path:inset(0 0 0 0 round 24px)}
.js .h-res-card.fx img,.js .h-coach-pic.fx img{transform:scale(1.18);transition:transform 1.4s var(--e-out)}
.js .h-res-card.fx.in img,.js .h-coach-pic.fx.in img{transform:none}
@media (hover:hover) and (pointer:fine){
  .js .h-res-card.fx.in:hover img,.js .h-coach-pic.fx.in:hover img{transform:scale(1.05);transition-duration:.9s}
}

/* 4. Chiffres : très grands, avec une fine ligne orange qui se dessine dessous */
.h-stats > div{position:relative;padding-top:18px}
.h-stats > div::before{content:"";position:absolute;left:0;top:-1px;height:2px;width:100%;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform 1s var(--e-io);transition-delay:calc(var(--k,0) * 120ms + 200ms)}
.h-stats.in > div::before{transform:scaleX(1)}
.h-stats{border-top-color:transparent;gap:20px}
.h-stats b{font-size:clamp(40px,5vw,64px)}

/* 5. Boutons : le texte « roule » au survol (souris seulement) */
.roll{position:relative;display:inline-block;overflow:hidden;line-height:1.15;vertical-align:bottom}
.roll > span{display:block;transition:transform .45s var(--e-out)}
.roll > span::after{content:attr(data-t);position:absolute;left:0;top:100%}
@media (hover:hover) and (pointer:fine){
  .btn:hover .roll > span,.h-link:hover .roll > span{transform:translateY(-100%)}
}

/* 6. Formules de l'accueil : la carte suit légèrement la souris (ressort) */
.h-plan{transform-style:preserve-3d}

@media (prefers-reduced-motion:reduce){
  .wsplit .w > span,.js .h-res-card.fx img,.js .h-coach-pic.fx img{transform:none;transition:none}
  .js .h-res-card.fx,.js .h-coach-pic.fx{clip-path:none;transition:none}
  .h-stats > div::before{transform:none;transition:none}
}

/* ===== Toutes les pages ===== */

/* titres de page : les mots montent dès l'arrivée */
.wsplit.rise{animation:none}

/* photos génériques : rideau de bas en haut + image qui se pose */
.js .rv-img{clip-path:inset(100% 0 0 0 round var(--rr,24px));transition:clip-path 1.1s var(--e-io);transition-delay:calc(var(--i,0) * 90ms)}
.js .rv-img.in{clip-path:inset(0 0 0 0 round var(--rr,24px))}
.js .rv-img img{transform:scale(1.18);transition:transform 1.4s var(--e-out);transition-delay:calc(var(--i,0) * 90ms)}
.js .rv-img.in img{transform:none}
.js .rv-img.reveal{animation:none}

/* cartes : arrivée en cascade, légèrement à plat puis en place */
.js .rv-card{opacity:0;transform:translateY(28px) scale(.97);transition:opacity .7s var(--e-out),transform .9s var(--e-out);transition-delay:calc(var(--i,0) * 80ms)}
.js .rv-card.in{opacity:1;transform:none}

/* bandeau Coaching : grande image en parallaxe, phrase géante */
.band img{height:clamp(420px,62vw,760px);transform:scale(1.18);will-change:transform}
.band-in p{font-size:clamp(38px,6.4vw,92px);max-width:12ch;letter-spacing:-.035em;line-height:.98}

/* page Coaching : titre plus imposant */
.offers-head h1{font-size:clamp(44px,7vw,96px);letter-spacing:-.04em}

/* FAQ : la question ouverte prend un trait orange à gauche */
.faq-anim details{position:relative}
.faq-anim details::before{content:"";position:absolute;left:-18px;top:22px;bottom:22px;width:2px;border-radius:1px;background:var(--orange);transform:scaleY(0);transform-origin:top;transition:transform .5s var(--e-out)}
.faq-anim details.is-open::before{transform:scaleY(1)}
@media (max-width:720px){.faq-anim details::before{left:-12px}}

@media (prefers-reduced-motion:reduce){
  .js .rv-img,.js .rv-img img,.js .rv-card{clip-path:none;transform:none;opacity:1;transition:none}
  .band img{transform:none}
}
/* les mots découpés gardent la taille et la couleur de leur titre */
.wsplit .w,.wsplit .w > span{font-size:inherit;font-weight:inherit;line-height:inherit;color:inherit;letter-spacing:inherit}
