/* =====================================================================
   MOTION POLISH · titres, parallaxe, vie des sections · motion-polish.css
   Tout est sous html.mk-gsap (classe posee par motion-core.js quand GSAP est
   charge ET que le mouvement est permis) : sans JS ou en mouvement reduit,
   rien de ce fichier ne s'applique et la page est deja a son etat final.
   Les etats de depart sont poses par classe JS (.mkp-pre), jamais en CSS nu.
   Tous les calques decoratifs sont en pointer-events:none.
   ===================================================================== */

/* ---------- A. TITRES : revelation par masque, ligne par ligne + filet or ---------- */
/* site.js enveloppe deja chaque h2 de section dans .kin (masque a 112 %), declenche
   trop tot (3000 px d'avance) : on le met a plat, SplitText prend le relais. */
html.mk-gsap section h2 .kin{overflow:visible}
html.mk-gsap section h2 .kin>span{transform:none;transition:none}
html.mk-gsap h2.mkp-pre{opacity:0}
.mkp-mask{padding-block:.14em;margin-block:-.14em}
html.mk-gsap h2.mkp{position:relative}
html.mk-gsap h2.mkp::after{content:"";position:absolute;top:calc(100% + 14px);left:0;width:clamp(56px,9vw,104px);height:2px;
  border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,rgba(184,149,90,0),#b8955a 22%,#b8955a 78%,rgba(184,149,90,0));
  transform:scaleX(var(--mkp-r,1));transform-origin:0 50%}
html.mk-gsap h2.mkp.mkp-c::after{left:50%;margin-left:calc(clamp(56px,9vw,104px) / -2);transform-origin:50% 50%}
html.mk-gsap h2.mkp.mkp-dk::after{background:linear-gradient(90deg,rgba(217,185,124,0),#d9b97c 22%,#d9b97c 78%,rgba(217,185,124,0))}

/* ---------- B. PARALLAXE : l'image est agrandie, jamais plus que sa marge de course ---------- */
html.mk-gsap .fin-room img{scale:var(--mkp-s,1)}

/* ---------- C. VIE DES SECTIONS ---------- */
/* c1. temoignages : profondeur 3D et reflet or au survol (pointeur fin) */
html.mk-gsap #temoignages .rev-card{position:relative;will-change:transform}
html.mk-gsap #temoignages .rev-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  opacity:var(--mkp-ga,0);transition:opacity .35s ease;
  background:radial-gradient(420px circle at var(--mkp-gx,50%) var(--mkp-gy,0%),rgba(217,185,124,.20),rgba(217,185,124,0) 62%)}

/* c2. garanties : site.js cachait les cartes (opacite 0 + gbIn), GSAP prend le relais */
html.mk-gsap .gb-zone .gb-js .gb-card,html.mk-gsap .gb-zone .gb-js .gb-card.is-in{opacity:1;animation:none}
html.mk-gsap .gb-zone .gb-card.mkp-sheen::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:2;
  background:linear-gradient(105deg,rgba(255,244,214,0) 42%,rgba(255,244,214,.42) 50%,rgba(255,244,214,0) 58%) 130% 0/260% 100% no-repeat;
  animation:mkpSheen 1.6s cubic-bezier(.4,0,.2,1) both}
html.mk-gsap .gb-zone .gb-card{position:relative}
@keyframes mkpSheen{to{background-position:-30% 0}}

/* c3. carte : pins qui tombent, ondes dorees depuis l'Eure */
.mkp-ring{position:absolute;z-index:3;left:65.6%;top:61.3%;width:46%;aspect-ratio:1;border-radius:50%;pointer-events:none;
  margin:-23% 0 0 -23%;border:2px solid rgba(255,232,170,.95);
  box-shadow:0 0 22px 2px rgba(255,214,120,.55),inset 0 0 26px 2px rgba(255,214,120,.35);opacity:0;transform:scale(0)}
.mkp-pt{position:absolute;z-index:4;width:2.3923%;line-height:0;pointer-events:none;opacity:0}
.mkp-pt svg{display:block;width:100%;height:auto;filter:drop-shadow(0 0 7px rgba(238,178,43,.55)) drop-shadow(0 2px 3px rgba(60,40,10,.3))}
.mkp-shadow{position:absolute;z-index:3;width:2.4%;height:.9%;border-radius:50%;pointer-events:none;opacity:0;
  background:radial-gradient(closest-side,rgba(60,40,10,.38),rgba(60,40,10,0))}
.mkp-glow{position:absolute;z-index:3;width:14%;aspect-ratio:1;border-radius:50%;pointer-events:none;opacity:0;mix-blend-mode:screen;
  background:radial-gradient(circle closest-side,rgba(234,162,76,.8),rgba(234,162,76,.32) 45%,rgba(234,162,76,0))}

/* c4. FAQ : un filet or marque la reponse ouverte */
html.mk-gsap #faq details{position:relative}
html.mk-gsap #faq details::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:3px;pointer-events:none;
  background:linear-gradient(180deg,#d9b97c,#b8955a);transform:scaleY(0);transform-origin:50% 0;transition:transform .6s var(--mk-out,cubic-bezier(.16,1,.3,1))}
html.mk-gsap #faq details[open]::before{transform:scaleY(1)}

/* c5. section finale : halo de lumiere derriere le numero, pulsation unique du bouton */
.mkp-halo{position:absolute;z-index:-1;left:50%;top:var(--mkp-hy,50%);width:min(1100px,170vw);aspect-ratio:1;border-radius:50%;
  pointer-events:none;opacity:0;
  background:radial-gradient(circle closest-side,rgba(246,220,160,.42) 0,rgba(224,190,120,.22) 34%,rgba(217,185,124,.07) 62%,rgba(217,185,124,0) 100%)}
html.mk-gsap .final .final-cta{position:relative}
.mkp-pulse{position:absolute;pointer-events:none;opacity:0;z-index:0}

/* mouvement reduit : jamais rien d'anime ici (le JS ne tourne pas, ceci est un filet) */
@media (prefers-reduced-motion:reduce){
  .mkp-halo,.mkp-ring,.mkp-pt,.mkp-shadow,.mkp-glow,.mkp-pulse{display:none}
  html.mk-gsap h2.mkp-pre{opacity:1}
}

/* ================= DUO CLAUDE + CHATGPT 04/10/2026 ================= */
/* Instagram : une preuve secondaire, pas une sortie du parcours */
.vids-insta{margin-top:18px}
.vids-insta a{min-height:0;padding:6px 4px;border:0;background:none;font-size:.82rem;opacity:.68;text-decoration:underline;text-underline-offset:4px}
.vids-insta a:hover{background:none;opacity:1}

/* Mobile : tant que les deux boutons du hero sont visibles, la barre fixe se retire (une seule interface d'appel) */
@media (max-width:820px){
  .wa-fab{transition:transform .38s cubic-bezier(.16,1,.3,1),opacity .3s ease}
  .wa-fab.fab-calm{transform:translateY(105%);opacity:0;pointer-events:none}
}
@media (prefers-reduced-motion:reduce){.wa-fab{transition:none!important}}