@keyframes fade-up {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes line-grow {
  from {
    transform: scaleX(0);
  }
  to {
    transform: scaleX(1);
  }
}

@keyframes pulse-ring {
  0% {
    transform: scale(0.85);
    opacity: 0.5;
  }
  70% {
    transform: scale(1.15);
    opacity: 0;
  }
  100% {
    transform: scale(1.15);
    opacity: 0;
  }
}

@keyframes shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}

@keyframes float-y {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}

/* Scroll reveal — простое и надёжное появление через CSS transition */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity 0.8s ease,
    transform 0.8s ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

/* вариант: появление с лёгким зумом */
.reveal--scale { transform: scale(0.92); }

/* вариант: выезд слева */
.reveal--left { transform: translateX(-40px); }

/* задержки для каскадного появления */
.reveal--delay-1 { transition-delay: 0.15s; }
.reveal--delay-2 { transition-delay: 0.3s; }
.reveal--delay-3 { transition-delay: 0.45s; }

.hero__mesh {
  position: absolute;
  inset: -20%;
  background:
    radial-gradient(ellipse 50% 40% at 20% 20%, rgba(255, 255, 255, 0.07), transparent 55%),
    radial-gradient(ellipse 40% 35% at 85% 30%, rgba(255, 255, 255, 0.05), transparent 50%),
    radial-gradient(ellipse 60% 50% at 50% 100%, rgba(255, 255, 255, 0.04), transparent 45%);
  pointer-events: none;
  animation: float-y 18s ease-in-out infinite;
  will-change: transform;
}

.noise-overlay {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9998;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── Page-load entrance ─────────────────────────────────── */
@keyframes header-slide-down {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ── Modal entrance ─────────────────────────────────────── */
@keyframes modal-enter {
  from {
    opacity: 0;
    transform: scale(0.93) translateY(14px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

/* ── Hero background subtle zoom-out on load ────────────── */
@keyframes hero-zoom-out {
  from {
    transform: scale(1.07);
  }
  to {
    transform: scale(1);
  }
}