/* ── Анимационный кит (обычный скролл, без Lenis). Стили появляются только при .anim-on (ставит anim.js, если не reduced-motion) ── */

/* Reveal при скролле */
.anim-on [data-anim]{ opacity:0; transform:translateY(22px); transition:opacity .6s cubic-bezier(.2,.7,.2,1), transform .6s cubic-bezier(.2,.7,.2,1); }
.anim-on [data-anim].in{ opacity:1; transform:none; }

/* Раскрытие героя по словам */
.anim-on [data-hero-reveal] .hero-line{ display:block; overflow:hidden; }
.anim-on [data-hero-reveal] .hero-word{ display:inline-block; transform:translateY(112%); transition:transform .85s cubic-bezier(.2,.7,.2,1); }
.anim-on [data-hero-reveal].in .hero-word{ transform:none; }

/* Параллакс — базовый will-change */
.anim-on [data-parallax]{ will-change:transform; }

/* Marquee (CSS-only) */
.marquee{ overflow:hidden; white-space:nowrap; }
.marquee-track{ display:inline-flex; gap:2.5rem; will-change:transform; animation:marq 28s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
@keyframes marq{ to{ transform:translateX(-50%); } }

/* Магнитные кнопки — плавный возврат */
[data-magnetic]{ transition:transform .35s cubic-bezier(.2,.7,.2,1); }

/* Уважение к prefers-reduced-motion */
@media (prefers-reduced-motion: reduce){
  .anim-on [data-anim]{ opacity:1 !important; transform:none !important; transition:none !important; }
  .anim-on [data-hero-reveal] .hero-word{ transform:none !important; transition:none !important; }
  .marquee-track{ animation:none !important; }
  [data-parallax]{ transform:none !important; }
}