/* assets/css/animations.css */

/* ── FADE IN ON SCROLL ──────────────────────────────── */
.fade-up {
  opacity: 0; transform: translateY(28px);
  transition: opacity 0.65s var(--ease), transform 0.65s var(--ease);
}
.fade-up.visible { opacity: 1; transform: translateY(0); }

.fade-in {
  opacity: 0; transition: opacity 0.65s var(--ease);
}
.fade-in.visible { opacity: 1; }

/* Delay helpers */
.delay-1 { transition-delay: 0.1s; }
.delay-2 { transition-delay: 0.2s; }
.delay-3 { transition-delay: 0.3s; }
.delay-4 { transition-delay: 0.4s; }
.delay-5 { transition-delay: 0.5s; }

/* ── HERO PARALLAX ──────────────────────────────────── */
.hero__bg {
  position: absolute; inset: -20%;
  background-size: cover; background-position: center;
  will-change: transform;
}

/* ── COUNTER (stats) ────────────────────────────────── */
.stat__number[data-target] { transition: none; }

/* ── REDUCED MOTION ─────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .fade-up, .fade-in {
    opacity: 1; transform: none; transition: none;
  }
  .hero__bg { transform: none !important; }
  .navbar__live-dot { animation: none; }
  .delay-1, .delay-2, .delay-3, .delay-4, .delay-5 { transition-delay: 0s; }
}