/* ================================================================
   animations.css — Keyframes & utility animations
   Reveal is handled in base.css + main.js (IntersectionObserver)
   ================================================================ */

/* ── Counter (JS-driven) ── */
[data-counter] { transition: none }

/* ── Staggered children ── */
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px) }
  to   { opacity: 1; transform: translateY(0) }
}
.stagger-children > * {
  opacity: 0;
  animation: fadeInUp .6s cubic-bezier(.16,1,.3,1) forwards;
}
.stagger-children > *:nth-child(1) { animation-delay: .1s }
.stagger-children > *:nth-child(2) { animation-delay: .18s }
.stagger-children > *:nth-child(3) { animation-delay: .26s }
.stagger-children > *:nth-child(4) { animation-delay: .34s }
.stagger-children > *:nth-child(5) { animation-delay: .42s }
.stagger-children > *:nth-child(6) { animation-delay: .50s }

/* ── Utility animations ── */
@keyframes pulse {
  0%, 100% { opacity: 1 }
  50%       { opacity: .6 }
}
.pulse { animation: pulse 2s var(--ease-in-out) infinite }

@keyframes float {
  0%, 100% { transform: translateY(0) }
  50%       { transform: translateY(-6px) }
}
.float { animation: float 3.5s var(--ease-in-out) infinite }

@keyframes spin {
  to { transform: rotate(360deg) }
}
.spin { animation: spin 1s linear infinite }

/* ── Gradient text (NOT used in this design — kept for legacy compat) ── */
.gradient-text {
  background: linear-gradient(135deg, var(--text-900) 0%, var(--orange-500) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .reveal               { opacity: 1; transform: none; transition: none }
  .stagger-children > * { opacity: 1; animation: none }
  .float, .pulse        { animation: none }
  *                     { transition-duration: .01ms !important; animation-duration: .01ms !important }
}
