/* ==========================================================================
   Cup'D — система появления и скролл-анимаций
   Блоки собираются при входе во вьюпорт; всё на трансформах.
   ========================================================================== */

/* Базовое появление: снизу вверх с лёгким масштабом */
/* Используем независимые свойства translate/scale, а не transform:
   иначе появление затирает собственный поворот элемента (наклонные карточки). */
.reveal {
  opacity: 0;
  translate: 0 34px;
  transition: opacity 0.75s var(--ease-out), translate 0.75s var(--ease-out),
              scale 0.75s var(--ease-out);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, translate;
}

.reveal.is-in { opacity: 1; translate: none; }

/* Появление слева / справа — для парных блоков */
.reveal--left  { translate: -48px 0; }
.reveal--right { translate: 48px 0; }
.reveal--scale { translate: none; scale: 0.94; }
.reveal--scale.is-in { scale: none; }

/* Каскад для списков и сеток: задержка по индексу задаётся из JS */
.reveal-stagger > * {
  opacity: 0;
  translate: 0 28px;
  transition: opacity 0.7s var(--ease-out), translate 0.7s var(--ease-out);
}

.reveal-stagger.is-in > * { opacity: 1; translate: none; }

/* Заголовок, собирающийся по словам */
.split-word {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.6em) rotate(3deg);
  transition: opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out);
}

.is-in .split-word { opacity: 1; transform: none; }

/* Прочерчивание SVG-линий (стрелки-завитки из макета) */
.draw-path {
  stroke-dasharray: var(--len, 1000);
  stroke-dashoffset: var(--len, 1000);
  transition: stroke-dashoffset 1.6s var(--ease-in-out);
}

.is-in .draw-path { stroke-dashoffset: 0; }

/* Параллакс — сдвиг задаётся переменной из JS */
.parallax { transform: translate3d(0, var(--py, 0px), 0); will-change: transform; }

/* Бегущая строка */
.marquee {
  display: flex;
  overflow: hidden;
  user-select: none;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.marquee__row {
  display: flex;
  flex-shrink: 0;
  gap: 40px;
  padding-right: 40px;
  animation: marquee-scroll 38s linear infinite;
}

.marquee:hover .marquee__row { animation-play-state: paused; }

@keyframes marquee-scroll {
  to { transform: translateX(-100%); }
}

/* Счётчики и живые числа не мигают при пересчёте */
.tabular { font-variant-numeric: tabular-nums; }

/* --- Уважение к системной настройке ------------------------------------- */

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

  .reveal,
  .reveal-stagger > *,
  .split-word {
    opacity: 1 !important;
    translate: none !important;
    scale: none !important;
    transform: none !important;
  }

  .draw-path { stroke-dashoffset: 0 !important; }
  .parallax { transform: none !important; }
}