/* ═══════════════════════════════════════════════════════════════
   DIGIBROOD DESIGN SYSTEM — animations.css
   Keyframes + utility classes for entrance & ambient motion.
   ═══════════════════════════════════════════════════════════════ */

/* ── Keyframes ────────────────────────────────────────────── */
@keyframes dbFadeUp {
  from { opacity: 0; transform: translateY(26px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes dbFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-9px); }
}

@keyframes dbBarIn {
  from { opacity: 0; transform: scaleY(0); transform-origin: bottom; }
  to   { opacity: 1; transform: scaleY(1); transform-origin: bottom; }
}

@keyframes dbPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255, 106, 0, .55); }
  50%      { box-shadow: 0 0 0 5px rgba(255, 106, 0, 0); }
}

/* ── Fade-up entrance ─────────────────────────────────────── */
.db-animate-fadeup {
  animation: dbFadeUp .55s ease both;
}

/* Stagger delays (apply alongside db-animate-fadeup) */
.db-delay-1 { animation-delay: .10s; }
.db-delay-2 { animation-delay: .18s; }
.db-delay-3 { animation-delay: .26s; }
.db-delay-4 { animation-delay: .34s; }
.db-delay-5 { animation-delay: .42s; }
.db-delay-6 { animation-delay: .55s; }

/* ── Ambient float ────────────────────────────────────────── */
.db-animate-float {
  animation: dbFloat 6.5s ease-in-out infinite;
}

.db-animate-float--fast {
  animation: dbFloat 4.5s ease-in-out infinite .8s;
}

.db-animate-float--slow {
  animation: dbFloat 7s ease-in-out infinite 1.6s;
}

/* ── Pulse ────────────────────────────────────────────────── */
.db-animate-pulse {
  animation: dbPulse 2.2s ease-in-out infinite;
}

/* ── Bar chart entrance ───────────────────────────────────── */
.db-animate-bar {
  opacity: 0;
  transform: scaleY(0);
  transform-origin: bottom;
  animation: dbBarIn .45s ease forwards;
}

.db-animate-bar:nth-child(1)  { animation-delay: .10s; }
.db-animate-bar:nth-child(2)  { animation-delay: .17s; }
.db-animate-bar:nth-child(3)  { animation-delay: .24s; }
.db-animate-bar:nth-child(4)  { animation-delay: .31s; }
.db-animate-bar:nth-child(5)  { animation-delay: .38s; }
.db-animate-bar:nth-child(6)  { animation-delay: .45s; }
.db-animate-bar:nth-child(7)  { animation-delay: .52s; }
.db-animate-bar:nth-child(8)  { animation-delay: .59s; }
.db-animate-bar:nth-child(9)  { animation-delay: .66s; }
.db-animate-bar:nth-child(10) { animation-delay: .73s; }

.db-marquee {
  overflow: hidden;
}

.db-marquee__track {
  display: flex;
  gap: var(--db-space-md);
  animation: db-scroll 30s linear infinite;
}

.db-marquee--reverse .db-marquee__track {
  animation-direction: reverse;
}

@keyframes db-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}