/* ═══════════════════════════════════════════════════════════════ */
/* SAKDU WEBSITE — ANIMATIONS & KEYFRAMES                        */
/* ═══════════════════════════════════════════════════════════════ */

/* ─── FADE UP ─── */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(32px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ─── FADE IN ─── */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ─── SCROLL DROP ─── */
@keyframes scrollDrop {
  0%, 100% { transform: scaleY(0); transform-origin: top; }
  50% { transform: scaleY(1); transform-origin: top; }
}

/* ─── PULSE GLOW ─── */
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 var(--clr-orange-glow); }
  50% { box-shadow: 0 0 0 12px rgba(255, 107, 0, 0); }
}

/* ─── LIVE DOT PULSE ─── */
@keyframes livePulse {
  0% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(0.8); }
  100% { opacity: 1; transform: scale(1); }
}

/* ─── FLOAT SLOW ─── */
@keyframes floatSlow {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

/* ─── ORANGE GLOW PULSE BTN ─── */
@keyframes btnGlow {
  0%, 100% { box-shadow: 0 0 20px var(--clr-orange-glow-strong); }
  50% { box-shadow: 0 0 40px var(--clr-orange-glow-strong); }
}

/* ─── SLIDE IN RIGHT ─── */
@keyframes slideInRight {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}

/* ─── SLIDE IN LEFT ─── */
@keyframes slideInLeft {
  from { transform: translateX(-100%); }
  to { transform: translateX(0); }
}

/* ─── SLIDE DOWN ─── */
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ─── SCALE IN ─── */
@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.92);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* ─── SHAKE (for form error) ─── */
@keyframes shake {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(-4px); }
  40%, 80% { transform: translateX(4px); }
}

/* ─── GRADIENT SHIFT ─── */
@keyframes gradientShift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ─── AURORA ─── */
@keyframes aurora {
  from { background-position: 50% 50%, 50% 50%; }
  to { background-position: 350% 50%, 350% 50%; }
}

/* ─── HEART PULSE ─── */
@keyframes heartPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.25); }
}

/* ─── SLIDE LEFT INFINITE ─── */
@keyframes slideLeftInfinite {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

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