/* ===== KAIROX - Animations ===== */

@keyframes pulse-glow {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.05); opacity: 0.8; }
}

@keyframes load-bar {
  0% { width: 0; }
  100% { width: 100%; }
}

@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.5; transform: scale(1.5); }
}

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

@keyframes scroll-wheel {
  0% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(12px); }
}

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

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

@keyframes toast-in {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes toast-out {
  from { opacity: 1; }
  to { opacity: 0; transform: translateY(-10px); }
}

@keyframes shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

@keyframes gradient-shift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

@keyframes rotate-slow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes slide-up {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes scale-in {
  from { opacity: 0; transform: scale(0.8); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes border-dance {
  0%, 100% { border-color: rgba(0,240,255,0.3); }
  50% { border-color: rgba(168,85,247,0.3); }
}

.reveal-up {
  opacity: 0; transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1),
              transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
.reveal-up.visible { opacity: 1; transform: translateY(0); }
.reveal-up.delay-1 { transition-delay: 0.1s; }
.reveal-up.delay-2 { transition-delay: 0.2s; }
.reveal-up.delay-3 { transition-delay: 0.3s; }

@keyframes flip-in-3d {
  from { opacity: 0; transform: perspective(800px) rotateY(-90deg); }
  to { opacity: 1; transform: perspective(800px) rotateY(0); }
}

@keyframes depth-pulse {
  0%, 100% { transform: translateZ(0); }
  50% { transform: translateZ(20px); }
}

@keyframes orbit-3d {
  from { transform: rotateY(0deg) translateZ(30px); }
  to { transform: rotateY(360deg) translateZ(30px); }
}

.page-enter {
  animation: slide-up 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.tilt-card { transform-style: preserve-3d; }
.magnetic { transform-style: preserve-3d; transition: transform 0.2s ease; }

.shimmer-text {
  background: linear-gradient(90deg, var(--text-primary) 0%, var(--accent-cyan) 50%, var(--text-primary) 100%);
  background-size: 200% auto;
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
  animation: shimmer 3s linear infinite;
}

.gradient-border { position: relative; }
.gradient-border::before {
  content: ''; position: absolute; inset: -1px; border-radius: inherit; z-index: -1;
  background: linear-gradient(135deg, var(--accent-cyan), var(--accent-purple), var(--accent-pink), var(--accent-cyan));
  background-size: 300% 300%; animation: gradient-shift 4s ease infinite;
}

.hover-lift { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.hover-lift:hover { transform: translateY(-6px); box-shadow: var(--shadow-glow); }

.spinner {
  width: 24px; height: 24px; border: 3px solid var(--border);
  border-top-color: var(--accent-cyan); border-radius: 50%;
  animation: rotate-slow 0.8s linear infinite;
}