/* ==========================================================================
   AVM Psicologia · estados das animações
   Só é carregado na home com "Animações cinematográficas" ligado.
   Tudo fica escopado em html.has-motion, que NÃO é adicionado quando o
   sistema pede movimento reduzido (o conteúdo aparece estático e completo).

   .m-gsap  → GSAP + ScrollTrigger controlam os movimentos (motion.js)
   .m-css   → fallback com IntersectionObserver + transições CSS
   ========================================================================== */

/* Antes do motion.js rodar: abertura escondida sob a "luz" branca. */
html.has-motion .hero__flash { display: block; position: absolute; inset: 0; z-index: 30; background: #fff; pointer-events: none; }
html.has-motion:not(.m-ready) .hero__portrait,
html.has-motion:not(.m-ready) .hero__title,
html.has-motion:not(.m-ready) [data-hero-fade],
html.has-motion:not(.m-ready) .hero__card { opacity: 0; }

/* Palavras do título (máscara de baixo para cima). */
.w { display: inline-block; overflow: hidden; vertical-align: top; padding: .12em .06em .16em; margin: -.12em -.06em -.16em; }
.wi { display: inline-block; will-change: transform; }
.ww { display: inline-block; }

/* Cortina de nuvens: só no modo GSAP. */
html.has-motion.m-gsap .cortina { display: block; position: relative; height: 0; z-index: 15; pointer-events: none; }
.cortina__inner { position: absolute; left: 0; right: 0; top: -65vh; height: 130vh; will-change: transform; }
.cortina__inner .img, .cortina__inner .ph { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 767px) { .cortina__inner { top: -55vh; height: 110vh; } }

/* Etapas do processo e marcadores da ajuda "acendem". */
html.has-motion .step:not(.is-lit) .step__num { opacity: .14; transform: translateY(16px); }
html.has-motion .step:not(.is-lit) .step__text { opacity: 0; transform: translateY(10px); }
html.has-motion .step:not(.is-lit)::after { transform: scaleY(0); }
html.has-motion .ajuda__list li:not(.is-lit) .ajuda__dot::after { opacity: 0; transform: scale(.3); }
html.has-motion .ajuda__list li.is-lit .ajuda__dot::before { animation: avm-glow 1.6s var(--ease) 1; }
@keyframes avm-glow { 0% { opacity: 0; } 35% { opacity: 1; } 100% { opacity: 0; } }

/* Pontinho dos balões pulsa uma vez ao chegar. */
.bubble.is-pulse .bubble__dot { animation: avm-pulse 1.2s var(--ease) 1; }
@keyframes avm-pulse { 0% { transform: scale(1); } 40% { transform: scale(1.7); } 100% { transform: scale(1); } }

/* Cards de formato: sombra cresce ao "pousar". */
html.has-motion .fcard { filter: drop-shadow(0 4px 6px rgba(30,63,90,.06)); }
html.has-motion .fcard.is-landed { filter: drop-shadow(0 22px 30px rgba(30,63,90,.13)); }

/* ---------------------------------------------------------------------------
   Fallback CSS (sem GSAP)
   ------------------------------------------------------------------------ */
html.m-css .hero__flash { opacity: 1; transition: opacity 1.2s var(--ease); }
html.m-css.m-ready .hero__flash { opacity: 0; }
html.m-css .hero__bg-img { filter: blur(8px); transform: scale(1.1); transition: filter 1.6s var(--ease), transform 1.6s var(--ease); }
html.m-css.m-ready .hero__bg-img { filter: blur(0); transform: none; }
html.m-css .hero__portrait { transform: translateY(40px); transition: opacity 1.4s var(--ease) .3s, transform 1.4s var(--ease) .3s; }
html.m-css.m-ready .hero__portrait { opacity: 1; transform: none; }
html.m-css .hero__title { transition: opacity 1.2s var(--ease) .5s; }
html.m-css.m-ready .hero__title { opacity: 1; }
html.m-css [data-hero-fade], html.m-css .hero__card { transform: translateY(24px); transition: opacity 1.2s var(--ease) .9s, transform 1.2s var(--ease) .9s; }
html.m-css.m-ready [data-hero-fade], html.m-css.m-ready .hero__card { opacity: 1; transform: none; }

html.m-css [data-m] { transition: opacity 1.2s var(--ease), transform 1.2s var(--ease), filter 1.2s var(--ease), clip-path 1.4s var(--ease); transition-delay: calc(var(--i, 0) * 120ms); }
html.m-css [data-m="up"]:not(.is-in) { opacity: 0; transform: translateY(32px); }
html.m-css [data-m="left"]:not(.is-in) { opacity: 0; transform: translateX(-60px); filter: blur(8px); }
html.m-css [data-m="right"]:not(.is-in) { opacity: 0; clip-path: inset(0 0 0 100%); }
html.m-css [data-m="zoom"]:not(.is-in) { opacity: 0; transform: scale(1.08); }
html.m-css [data-m="iris"]:not(.is-in) { clip-path: circle(0% at 50% 50%); }
html.m-css [data-m="land"]:not(.is-in) { opacity: 0; transform: translateY(60px) rotateX(8deg); }
html.m-css [data-m="fan"]:not(.is-in) { opacity: 0; transform: translateX(120px) rotate(4deg); }
html.m-css [data-m="clip"]:not(.is-in) { clip-path: inset(0 0 100% 0); }
html.m-css .step { transition-delay: calc(var(--i, 0) * 220ms); }
html.m-css .step .step__num, html.m-css .step .step__text { transition-delay: inherit; }