/* Motion TIIX PRO — linguagem derivada de site-tiix/docs/MOTION-SPEC.md */
@media (prefers-reduced-motion: no-preference) {
  .mo-reveal {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition:
      opacity .72s cubic-bezier(.22, 1, .36, 1),
      transform .72s cubic-bezier(.22, 1, .36, 1);
    transition-delay: var(--mo-delay, 0ms);
    will-change: opacity, transform;
  }

  .mo-reveal.mo-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  .mo-curtain {
    clip-path: inset(100% 0 0 0);
    transition: clip-path 1s cubic-bezier(.22, 1, .36, 1);
    will-change: clip-path;
  }

  .mo-curtain.mo-visible { clip-path: inset(0); }

  .mo-parallax {
    transform: translate3d(0, var(--mo-parallax-y, 0), 0) scale(1.1);
    transform-origin: center;
    will-change: transform;
  }

  .site-header,
  .page-header {
    transition: transform .35s cubic-bezier(.22, 1, .36, 1);
    will-change: transform;
  }

  .site-header.mo-nav-hidden,
  .page-header.mo-nav-hidden {
    transform: translate3d(0, -105%, 0);
  }

  .home-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(circle at center, transparent 42%, rgba(24, 4, 4, var(--mo-vignette, 0)) 100%);
  }

  .value.mo-reveal {
    transform: translate3d(40px, 0, 0);
  }

  .strategy-card.mo-reveal {
    transform: translate3d(120px, 0, 0);
    transition-duration: .72s;
    transition-timing-function: cubic-bezier(.22, 1, .36, 1);
  }
  .strategy-card.mo-reveal:nth-child(1) { transition-delay: 0ms; }
  .strategy-card.mo-reveal:nth-child(2) { transition-delay: 160ms; }
  .strategy-card.mo-reveal:nth-child(3) { transition-delay: 320ms; }
  .strategy-card.mo-reveal:nth-child(4) { transition-delay: 480ms; }

  .value.mo-reveal.mo-visible,
  .strategy-card.mo-reveal.mo-visible {
    transform: translate3d(0, 0, 0);
  }

  /* Variante de entrada de cima pra baixo (o padrão .mo-reveal entra de
     baixo pra cima). Usada no CTA de download, que é um bloco muito alto
     (500-800px) — nele o fade de opacidade herdado de .mo-reveal deixava
     um vazio branco antes de revelar, dando sensação de scroll travado.
     Aqui é só deslocamento, sem opacity, pra ler como slide suave. */
  .mo-reveal--down {
    opacity: 1;
    transform: translate3d(0, -56px, 0);
    transition: transform .6s cubic-bezier(.22, 1, .36, 1);
    transition-delay: 0ms;
  }

  .mo-reveal--down.mo-visible {
    transform: translate3d(0, 0, 0);
  }

  .form-card {
    transition:
      transform .72s cubic-bezier(.22, 1, .36, 1),
      box-shadow .72s cubic-bezier(.22, 1, .36, 1);
  }

  .form-card.mo-visible {
    box-shadow: 0 18px 58px rgba(0, 0, 0, .16);
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }

  .schedule-journey { height: auto !important; }
  .schedule-stage { position: relative !important; height: auto !important; overflow: visible !important; }
  .schedule-hero { position: relative !important; height: auto !important; min-height: 100vh; }
  .schedule-hero__title--steps { display: none !important; }
  .journey-steps { position: relative !important; height: auto !important; transform: none !important; }
  .journey-track { width: 100% !important; display: block !important; transform: none !important; }
  .journey-step { width: 100% !important; min-height: 520px; }
  .journey-step__number,
  .journey-step > div { opacity: 1 !important; transform: none !important; }
}