/* ============================================================
   ANIMAÇÕES - entrada, revelação por scroll, split de palavras
   ============================================================ */

/* ------------------------------------------------------------
   Entrada do hero (staggered)
   Aplicado por [data-appear]; a classe .is-in é dada pelo JS
   depois do load, para não animar antes das fontes.
   ------------------------------------------------------------ */
[data-appear] {
  opacity: 0;
  transform: translate3d(0, 28px, 0);
  will-change: opacity, transform;
}
.is-ready [data-appear] {
  transition: opacity .9s var(--e-out), transform 1s var(--e-out);
  opacity: 1;
  transform: none;
}
.is-ready [data-appear="1"] { transition-delay: .10s; }
.is-ready [data-appear="2"] { transition-delay: .20s; }
.is-ready [data-appear="3"] { transition-delay: .34s; }
.is-ready [data-appear="4"] { transition-delay: .46s; }

/* ------------------------------------------------------------
   Revelação por scroll
   ------------------------------------------------------------ */
[data-reveal] {
  opacity: 0;
  transform: translate3d(0, 40px, 0);
  transition: opacity .9s var(--e-out), transform 1s var(--e-out);
  will-change: opacity, transform;
}
[data-reveal].is-visible {
  opacity: 1;
  transform: none;
}

/* ------------------------------------------------------------
   Títulos com split por palavra (blur + subida)
   ------------------------------------------------------------ */
.split-word {
  display: inline-block;
  opacity: 0;
  filter: blur(10px);
  transform: translate3d(0, .5em, 0);
  transition: opacity .8s var(--e-out), filter .8s var(--e-out), transform .8s var(--e-out);
  will-change: opacity, filter, transform;
}
.is-split-in .split-word {
  opacity: 1;
  filter: blur(0);
  transform: none;
}

/* ------------------------------------------------------------
   Divisores das estatísticas - crescem ao entrar
   ------------------------------------------------------------ */
.stat__divider {
  transform: scaleY(0);
  transition: transform .8s var(--e-out);
}
[data-reveal].is-visible .stat__divider { transform: scaleY(1); }
[data-reveal].is-visible .stat__divider:nth-of-type(2) { transition-delay: .1s; }
[data-reveal].is-visible .stat__divider:nth-of-type(3) { transition-delay: .2s; }

/* ------------------------------------------------------------
   Parallax da galeria (definido pelo JS via --py)
   ------------------------------------------------------------ */
.gallery__col { transform: translate3d(0, var(--py, 0px), 0); }

/* ------------------------------------------------------------
   Sugestão "continue a deslizar"
   ------------------------------------------------------------ */
@keyframes pulse-hint {
  0%, 100% { opacity: .55; transform: translate3d(0, 0, 0); }
  50%      { opacity: 1;   transform: translate3d(0, 4px, 0); }
}

/* ------------------------------------------------------------
   Nav mobile - fade, nunca translateX (duplicaria a largura
   do documento e criaria overflow horizontal)
   ------------------------------------------------------------ */
@media (max-width: 1023.98px) {
  .header__nav {
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s var(--e-out), visibility 0s linear .35s;
  }
  .header__nav.is-open {
    opacity: 1;
    visibility: visible;
    transition: opacity .35s var(--e-out), visibility 0s linear 0s;
  }
  .header__nav.is-open .header__menu > li,
  .header__nav.is-open .header__nav-cta {
    animation: nav-item-in .5s var(--e-out) both;
  }
  .header__nav.is-open .header__menu > li:nth-child(1) { animation-delay: .06s; }
  .header__nav.is-open .header__menu > li:nth-child(2) { animation-delay: .12s; }
  .header__nav.is-open .header__menu > li:nth-child(3) { animation-delay: .18s; }
  .header__nav.is-open .header__menu > li:nth-child(4) { animation-delay: .24s; }
  .header__nav.is-open .header__menu > li:nth-child(5) { animation-delay: .30s; }
  .header__nav.is-open .header__nav-cta                { animation-delay: .36s; }
}

@keyframes nav-item-in {
  from { opacity: 0; transform: translate3d(0, 16px, 0); }
  to   { opacity: 1; transform: none; }
}

/* ------------------------------------------------------------
   Acessibilidade - respeitar redução de movimento
   ------------------------------------------------------------ */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }

  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }

  [data-appear],
  [data-reveal],
  .split-word {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
  }
  .stat__divider { transform: scaleY(1) !important; }
  .gallery__col  { transform: none !important; }
}
