/* InviteNoma — появления и скролл-эффекты.
   База: IntersectionObserver (работает везде, включая Firefox stable),
   поверх — нативный scroll-timeline там, где он есть. */

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

/* --- reveal --- */
.reveal {
  opacity: 0;
  transform: translateY(clamp(18px, 4vw, 34px));
  transition:
    opacity 1s var(--e-out),
    transform 1.15s var(--e-out);
  transition-delay: var(--d, 0ms);
  will-change: opacity, transform;
}
.reveal.is-in {
  opacity: 1;
  transform: none;
  /* слой больше не нужен: держать сотню промотированных элементов
     дорого по памяти на телефонах */
  will-change: auto;
}

.reveal--left  { transform: translateX(-32px); }
.reveal--right { transform: translateX(32px); }
.reveal--scale { transform: scale(.94); }
.reveal--blur  { filter: blur(10px); transition: opacity 1s var(--e-out), transform 1.15s var(--e-out), filter 1.2s var(--e-out); }
.reveal--left.is-in, .reveal--right.is-in, .reveal--scale.is-in { transform: none; }
.reveal--blur.is-in { filter: blur(0); }

/* каскад для списков */
.stagger > * {
  opacity: 0; transform: translateY(22px);
  transition: opacity .9s var(--e-out), transform 1s var(--e-out);
}
.stagger.is-in > * { opacity: 1; transform: none; }
.stagger.is-in > *:nth-child(1) { transition-delay: 60ms; }
.stagger.is-in > *:nth-child(2) { transition-delay: 140ms; }
.stagger.is-in > *:nth-child(3) { transition-delay: 220ms; }
.stagger.is-in > *:nth-child(4) { transition-delay: 300ms; }
.stagger.is-in > *:nth-child(5) { transition-delay: 380ms; }
.stagger.is-in > *:nth-child(6) { transition-delay: 460ms; }
.stagger.is-in > *:nth-child(n+7) { transition-delay: 540ms; }

/* --- параллакс: js кладёт --y --- */
.parallax { will-change: transform; transform: translate3d(0, var(--y, 0), 0); }

/* --- декоративные линии, рисующиеся при появлении --- */
.draw-line path, .draw-line circle {
  stroke-dasharray: var(--len, 400);
  stroke-dashoffset: var(--len, 400);
  transition: stroke-dashoffset 1.8s var(--e-out);
}
.draw-line.is-in path, .draw-line.is-in circle { stroke-dashoffset: 0; }

/* --- нативные scroll-driven анимации как прогрессивное улучшение --- */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .sd-fade {
      animation: sdFade linear both;
      animation-timeline: view();
      animation-range: entry 10% cover 32%;
    }
    @keyframes sdFade {
      from { opacity: 0; transform: translateY(30px); }
      to   { opacity: 1; transform: none; }
    }
    .sd-zoom img {
      animation: sdZoom linear both;
      animation-timeline: view();
      animation-range: entry 0% exit 100%;
    }
    @keyframes sdZoom {
      from { transform: scale(1.12); }
      to   { transform: scale(1); }
    }
  }
}

/* мягкое затухание фонового шума между секциями */
.grain::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: url("../img/noise.svg");
  opacity: .35; mix-blend-mode: multiply;
}
.section { isolation: isolate; }

@media (prefers-reduced-motion: reduce) {
  .reveal, .stagger > * {
    opacity: 1 !important; transform: none !important;
    filter: none !important; transition: none !important;
  }
  .parallax { transform: none !important; }
  .draw-line path, .draw-line circle { stroke-dashoffset: 0; transition: none; }
  html { scroll-behavior: auto; }
}
