/* ═══════════════════════════════════════════════════════════════════
   SW Finance — animations.css
   @keyframes and scroll-reveal stagger delays ONLY
   ═══════════════════════════════════════════════════════════════════ */

/* ── Scroll reveal initial states ───────────────────────────────── */
[data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition:
    opacity var(--t-slow) var(--ease-out),
    transform var(--t-slow) var(--ease-out);
}

[data-reveal="clip"] {
  opacity: 1;
  transform: none;
  overflow: hidden;
}
[data-reveal="clip"] .reveal-inner {
  display: block;
  transform: translateY(110%);
  transition: transform var(--t-slow) var(--ease-out);
}

[data-reveal="left"] {
  opacity: 0;
  transform: translateX(-24px);
  transition:
    opacity var(--t-slow) var(--ease-out),
    transform var(--t-slow) var(--ease-out);
}

[data-reveal="line"] {
  opacity: 0;
  transform: scaleX(0);
  transform-origin: left center;
  transition:
    opacity var(--t-slow) var(--ease-out),
    transform var(--t-slow) var(--ease-out);
}

/* ── Revealed state ─────────────────────────────────────────────── */
[data-reveal].is-revealed {
  opacity: 1;
  transform: none;
}
[data-reveal="clip"].is-revealed .reveal-inner {
  transform: translateY(0);
}
[data-reveal="left"].is-revealed {
  opacity: 1;
  transform: none;
}
[data-reveal="line"].is-revealed {
  opacity: 1;
  transform: scaleX(1);
}

/* ── Stagger delays ─────────────────────────────────────────────── */
[data-delay="1"] { transition-delay: var(--stagger-1); }
[data-delay="2"] { transition-delay: var(--stagger-2); }
[data-delay="3"] { transition-delay: var(--stagger-3); }
[data-delay="4"] { transition-delay: var(--stagger-4); }
[data-delay="5"] { transition-delay: var(--stagger-5); }

/* ── @keyframes ─────────────────────────────────────────────────── */
@keyframes ticker {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

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

@keyframes pulse-ring {
  0%   { transform: scale(1); opacity: 0.6; }
  100% { transform: scale(1.8); opacity: 0; }
}

@keyframes stat-count {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: none; }
}

/* ── Hero above-fold immediate reveal ───────────────────────────── */
.hero-immediate {
  animation: fadeIn var(--t-slow) var(--ease-out) both;
}
.hero-immediate--delay-1 { animation-delay: var(--hero-delay-1); }
.hero-immediate--delay-2 { animation-delay: var(--hero-delay-2); }
.hero-immediate--delay-3 { animation-delay: var(--hero-delay-3); }
.hero-immediate--delay-4 { animation-delay: var(--hero-delay-4); }