/* ── Visigol motion layer — styles ────────────────────────────────────
   Marqueurs : [data-rv] [data-mv-hero] [data-mv-title] [data-marquee]
   [data-tilt] [data-mv-underline]. Complète style.css, ne le remplace pas. */

/* Lignes de hero masquées (clip) */
[data-mv-hero] [data-mv-line]{display:block;overflow:hidden}
.mv-w{display:inline-block;overflow:hidden;vertical-align:bottom}
.mv-wi{display:inline-block;will-change:transform}

/* Marquee */
[data-marquee]{overflow:hidden;white-space:nowrap}
.mv-marquee-track{display:inline-flex;align-items:center;gap:56px;will-change:transform;padding-right:56px}

/* Tilt */
[data-tilt]{transform-style:preserve-3d;will-change:transform}
[data-tilt]>*{transform:translateZ(24px)}

/* Reveal maison — état initial géré par GSAP ; sans JS rien ne casse */
[data-rv]{will-change:transform,opacity}

/* Soulignement dessiné */
[data-mv-underline]{--mv-u:0%;position:relative}
[data-mv-underline]::after{
  content:"";position:absolute;left:0;bottom:-3px;height:2px;width:var(--mv-u);
  background:currentColor;opacity:.85;
}

/* Grain cinéma très léger sur les sections sombres (motion = profondeur) */
.mv-grain{position:relative}
.mv-grain::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}

/* Halo doré animé derrière le hero (léger, GPU-friendly) */
@keyframes mvHalo{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(40px,-30px) scale(1.08)}66%{transform:translate(-30px,24px) scale(.96)}}
.mv-halo{position:absolute;border-radius:50%;filter:blur(90px);opacity:.35;pointer-events:none;animation:mvHalo 18s ease-in-out infinite}

/* Images en parallax dans un cadre overflow:hidden : marge de sécurité.
   Longhand `scale`, indépendante du transform (y) écrit par GSAP. */
.founder-img img[data-parallax],.af-img img[data-parallax]{scale:1.12}

/* ── Wave 17/10 — effets signature ───────────────────────────────────── */

/* 14. View Transitions entre pages : le MPA navigue comme une app.
   L'opt-in doit exister des DEUX côtés de la navigation — ce fichier est
   chargé par toutes les pages, c'est le bon endroit. La nav, la barre CTA
   mobile et le bouton WhatsApp sont des groupes nommés : identiques d'une
   page à l'autre, ils restent posés pendant que le contenu glisse. */
@view-transition{navigation:auto}
#nav{view-transition-name:mv-nav}
.sticky{view-transition-name:mv-stickybar}
.wa{view-transition-name:mv-wa}
::view-transition-old(root){animation:mv-vt-out .26s cubic-bezier(.22,1,.36,1) both}
::view-transition-new(root){animation:mv-vt-in .48s .05s cubic-bezier(.22,1,.36,1) both}
@keyframes mv-vt-out{to{opacity:0;translate:0 -10px}}
@keyframes mv-vt-in{from{opacity:0;translate:0 14px}}

/* 15. Hero : glyphes de la ligne serif. Le masque est la ligne elle-même
   ([data-mv-line] est déjà overflow:hidden). Mots insécables pour que le
   split ne change pas les retours à la ligne. */
.mv-cw{display:inline-block;white-space:nowrap}
.mv-ci{display:inline-block;will-change:transform}

/* 16. Nav roll-over : deux calques du même libellé, celui du dessous monte
   au survol. Copy strictement identique, le chevron .nla ne bouge pas. */
.mv-roll{display:inline-block;position:relative;overflow:hidden;vertical-align:bottom}
.mv-roll-i{display:block;transition:transform .42s cubic-bezier(.22,1,.36,1)}
.mv-roll-b{position:absolute;left:0;top:100%;width:100%}
.nl:hover .mv-roll-i,.nl:focus-visible .mv-roll-i{transform:translateY(-100%)}

@media (prefers-reduced-motion:reduce){
  .mv-halo{animation:none}
  [data-marquee] .mv-marquee-track{transform:none!important}
  .founder-img img[data-parallax],.af-img img[data-parallax]{scale:1}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .mv-roll-i{transition:none}
}

/* 17. Spotlight du quadrillage (module 1d) : un calque enfant du .hero-grid
   porte les MÊMES lignes, plus marquées, révélées par un cercle masque suivi
   du curseur (--gx/--gy écrits par motion.js, sans amorti). Le calque hérite
   du masque elliptique et du `translate` de profondeur du parent — rien à
   resynchroniser. .mv-gridjs coupe la dérive CSS des deux calques : UN tween
   GSAP anime background-position des deux cibles, phase identique garantie. */
#hero .hero-grid.mv-gridjs,.pagehero .hero-grid.mv-gridjs{animation:none}
.mv-grid-hl{position:absolute;inset:0;pointer-events:none;opacity:0;
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(260px circle at var(--gx,-999px) var(--gy,-999px),#000 0%,rgba(0,0,0,.4) 55%,transparent 78%);
  mask-image:radial-gradient(260px circle at var(--gx,-999px) var(--gy,-999px),#000 0%,rgba(0,0,0,.4) 55%,transparent 78%)}
#hero .mv-grid-hl{
  background-image:linear-gradient(rgba(12,43,35,.26) 1px,transparent 1px),
    linear-gradient(90deg,rgba(12,43,35,.26) 1px,transparent 1px)}
.pagehero .mv-grid-hl{
  background-image:linear-gradient(rgba(198,161,91,.34) 1px,transparent 1px),
    linear-gradient(90deg,rgba(198,161,91,.34) 1px,transparent 1px)}

/* 18. Cascade de cartes — remplace le card-stack collant (RETIRÉ le 17/10,
   ordre Goat « ça affiche ultra mal »). La grille reste une grille : tout
   visible, scroll libre. La signature : un trait d'or se trace en tête de
   chaque carte, l'une APRÈS l'autre (transition-delay par nth-child), au
   moment où motion.js pose .mv-casc-on sur la grille. Le trait vit dans un
   ::after — il n'écrit jamais sur la carte, donc zéro conflit avec le tilt,
   le reveal ou le :hover. Sans JS il reste invisible (décor pur). */
[data-mv-cascade]>*{position:relative}
[data-mv-cascade]>*::after{
  content:"";position:absolute;top:0;left:18px;right:18px;height:2px;
  border-radius:0 0 2px 2px;pointer-events:none;
  background:linear-gradient(90deg,var(--gold,#C6A15B),rgba(198,161,91,.12));
  transform:scaleX(0);transform-origin:left center;
  transition:transform 1s cubic-bezier(.22,1,.36,1)}
.mv-casc-on>*::after{transform:scaleX(1)}
.mv-casc-on>*:nth-child(2)::after{transition-delay:.22s}
.mv-casc-on>*:nth-child(3)::after{transition-delay:.44s}
.mv-casc-on>*:nth-child(4)::after{transition-delay:.66s}
.mv-casc-on>*:nth-child(5)::after{transition-delay:.88s}
.mv-casc-on>*:nth-child(6)::after{transition-delay:1.1s}
@media (prefers-reduced-motion:reduce){
  [data-mv-cascade]>*::after{transition:none;transform:scaleX(1)}
}