/* ==========================================================================
   WOW-ПАКЕТ — премиум-моушн (без GSAP в критическом пути)
   1) Masked text-reveal hero на загрузке — ЧИСТЫЙ CSS
   2) Magnetic CTA — vanilla JS (js/wow.js), здесь только will-change
   3) Усиленный scroll-reveal секций (.fade-up)
   Дисциплина: transform/opacity, ease-out, reduced-motion respected.
   ========================================================================== */

/* --- 1. Hero intro (CSS, играет один раз на загрузке при включённом JS) --- */
.has-js .hero__content--intro > * {
  opacity: 0;
  animation: introUp 0.7s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.has-js .hero__content--intro > *:nth-child(1) { animation-delay: 0.05s; }
.has-js .hero__content--intro > *:nth-child(2) { animation-delay: 0.13s; }
.has-js .hero__content--intro > *:nth-child(4) { animation-delay: 0.21s; }
.has-js .hero__content--intro > *:nth-child(5) { animation-delay: 0.29s; }
.has-js .hero__content--intro > *:nth-child(6) { animation-delay: 0.37s; }
.has-js .hero__content--intro > *:nth-child(7) { animation-delay: 0.45s; }

@keyframes introUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* H1 — не сдвигаем целиком: маскированный reveal внутренней строки */
.has-js .hero__content--intro > h1 { opacity: 1; animation: none; }

.rv-mask { overflow: hidden; }
.rv-inner { display: inline-block; will-change: transform; }
.has-js .hero__content--intro .rv-inner {
  transform: translateY(112%);
  animation: rvUp 1s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both;
}
@keyframes rvUp {
  from { transform: translateY(112%); }
  to   { transform: translateY(0); }
}

/* Правая карточка hero — мягкий вход (float-анимация на .hero__art не задета) */
.has-js .hero__visual--intro {
  opacity: 0;
  animation: introUp 0.9s cubic-bezier(0.16, 1, 0.3, 1) 0.25s both;
}

/* --- 2. Magnetic CTA --- */
@media (hover: hover) and (pointer: fine) {
  .btn--primary { will-change: transform; }
}

/* --- 3. Усиленный scroll-reveal --- */
.fade-up {
  opacity: 0;
  transform: translateY(40px);
  filter: blur(6px);
  transition:
    opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.7s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.7s ease;
  will-change: opacity, transform;
}
.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

/* --- Доступность: без движения --- */
@media (prefers-reduced-motion: reduce) {
  .has-js .hero__content--intro > *,
  .has-js .hero__content--intro > h1,
  .has-js .hero__visual--intro {
    opacity: 1 !important;
    animation: none !important;
    transform: none !important;
  }
  .has-js .hero__content--intro .rv-inner { transform: none !important; animation: none !important; }

  .fade-up {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}