/* ===== KEYFRAME ANIMATIONS ===== */

/* Slide In Up */
@keyframes slideInUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Fade In */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Float / Floating */
@keyframes float {
  0%, 100% {
    transform: translateY(0px) rotate(0deg);
  }
  50% {
    transform: translateY(-30px) rotate(2deg);
  }
}

/* Bounce */
@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}

/* Gradient Shift */
@keyframes gradientShift {
  0%, 100% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
}

/* Scale Pulse */
@keyframes scalePulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

/* Glow Pulse */
@keyframes glowPulse {
  0%, 100% {
    box-shadow: 0 0 20px rgba(0, 102, 255, 0.3);
  }
  50% {
    box-shadow: 0 0 40px rgba(0, 102, 255, 0.6);
  }
}

/* Border Glow */
@keyframes borderGlow {
  0%, 100% {
    border-color: rgba(0, 102, 255, 0.3);
    box-shadow: 0 0 10px rgba(0, 102, 255, 0.1);
  }
  50% {
    border-color: rgba(0, 102, 255, 0.8);
    box-shadow: 0 0 20px rgba(0, 102, 255, 0.3);
  }
}

/* Shimmer */
@keyframes shimmer {
  0% {
    background-position: -1000px 0;
  }
  100% {
    background-position: 1000px 0;
  }
}

/* Text Gradient Animation */
@keyframes textGradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/* Rotate */
@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/* Slide In Left */
@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-60px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Slide In Right */
@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(60px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Zoom In */
@keyframes zoomIn {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Count Up */
@keyframes countUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Blink */
@keyframes blink {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}

/* Pulse */
@keyframes pulse {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0.7;
  }
}

/* Swing */
@keyframes swing {
  20% {
    transform: rotate(15deg);
  }
  40% {
    transform: rotate(-10deg);
  }
  60% {
    transform: rotate(5deg);
  }
  80% {
    transform: rotate(-5deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

/* Wobble */
@keyframes wobble {
  0%, 100% {
    transform: translateX(0);
  }
  15% {
    transform: translateX(-5px) rotate(-5deg);
  }
  30% {
    transform: translateX(5px) rotate(3deg);
  }
  45% {
    transform: translateX(-5px) rotate(-3deg);
  }
  60% {
    transform: translateX(3px) rotate(2deg);
  }
  75% {
    transform: translateX(-2px) rotate(-1deg);
  }
}

/* Flip */
@keyframes flip {
  from {
    transform: perspective(400px) rotateY(0);
  }
  to {
    transform: perspective(400px) rotateY(360deg);
  }
}

/* Heartbeat */
@keyframes heartbeat {
  0% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.3);
  }
  50% {
    transform: scale(1);
  }
  75% {
    transform: scale(1.3);
  }
  100% {
    transform: scale(1);
  }
}

/* Lightning Bolt Effect */
@keyframes lightning {
  0%, 100% {
    opacity: 1;
    text-shadow: 0 0 10px rgba(0, 102, 255, 0.5);
  }
  50% {
    opacity: 0.8;
    text-shadow: 0 0 30px rgba(0, 102, 255, 1);
  }
}

/* Morphing */
@keyframes morph {
  0%, 100% {
    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
  }
  50% {
    border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%;
  }
}

/* Neon Glow */
@keyframes neonGlow {
  0%, 100% {
    text-shadow: 
      0 0 7px rgba(0, 102, 255, 0.5),
      0 0 10px rgba(0, 102, 255, 0.3),
      0 0 20px rgba(0, 102, 255, 0.2);
  }
  50% {
    text-shadow: 
      0 0 10px rgba(0, 102, 255, 1),
      0 0 20px rgba(0, 102, 255, 0.8),
      0 0 30px rgba(0, 102, 255, 0.5),
      0 0 40px rgba(0, 102, 255, 0.3);
  }
}

/* Typewriter Effect */
@keyframes typewriter {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}

/* Cursor Blink */
@keyframes blink-cursor {
  50% {
    border-right-color: transparent;
  }
}

/* Floating Text */
@keyframes floatingText {
  0%, 100% {
    transform: translateY(0px);
  }
  25% {
    transform: translateY(-10px);
  }
  75% {
    transform: translateY(10px);
  }
}

/* Slide Down */
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-60px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Slide Up */
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(60px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Rotation Animation */
@keyframes rotateIn {
  from {
    opacity: 0;
    transform: rotate(-200deg);
  }
  to {
    opacity: 1;
    transform: rotate(0);
  }
}

/* Parallax Scroll */
@keyframes parallax {
  0% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(50px);
  }
}

/* Rainbow Text */
@keyframes rainbow {
  0% { color: red; }
  16% { color: orange; }
  33% { color: yellow; }
  50% { color: green; }
  66% { color: blue; }
  83% { color: indigo; }
  100% { color: violet; }
}

/* Skew Spin */
@keyframes skewSpin {
  0% {
    transform: skewY(0deg) rotate(0deg);
  }
  50% {
    transform: skewY(10deg) rotate(180deg);
  }
  100% {
    transform: skewY(0deg) rotate(360deg);
  }
}

/* ===== ANIMATION CLASSES ===== */

.animate-fade {
  animation: fadeIn 1s ease-out;
}

.animate-slide-up {
  animation: slideInUp 0.6s ease-out;
}

.animate-slide-down {
  animation: slideDown 0.6s ease-out;
}

.animate-slide-left {
  animation: slideInLeft 0.6s ease-out;
}

.animate-slide-right {
  animation: slideInRight 0.6s ease-out;
}

.animate-float {
  animation: float 3s ease-in-out infinite;
}

.animate-bounce {
  animation: bounce 2s ease-in-out infinite;
}

.animate-pulse {
  animation: pulse 2s ease-in-out infinite;
}

.animate-rotate {
  animation: rotate 8s linear infinite;
}

.animate-zoom {
  animation: zoomIn 0.6s ease-out;
}

.animate-glow {
  animation: glowPulse 3s ease-in-out infinite;
}

.animate-shimmer {
  animation: shimmer 2s infinite;
}

.animate-heartbeat {
  animation: heartbeat 1.3s ease-in-out infinite;
}

.animate-neon {
  animation: neonGlow 2s ease-in-out infinite;
}

.animate-morph {
  animation: morph 6s ease-in-out infinite;
}

.animate-lightning {
  animation: lightning 1.5s ease-in-out infinite;
}

.animate-wobble {
  animation: wobble 0.8s ease-in-out;
}

.animate-swing {
  animation: swing 1s ease-in-out;
}

.animate-flip {
  animation: flip 2s linear infinite;
}

.animate-count {
  animation: countUp 1s ease-out;
}

.animate-typewriter {
  animation: typewriter 3s steps(40, end), blink-cursor 0.5s step-end infinite;
}

.animate-floating-text {
  animation: floatingText 3s ease-in-out infinite;
}

/* Staggered Animations */
.animate-stagger > * {
  animation: slideInUp 0.6s ease-out;
}

.animate-stagger > *:nth-child(1) { animation-delay: 0s; }
.animate-stagger > *:nth-child(2) { animation-delay: 0.1s; }
.animate-stagger > *:nth-child(3) { animation-delay: 0.2s; }
.animate-stagger > *:nth-child(4) { animation-delay: 0.3s; }
.animate-stagger > *:nth-child(5) { animation-delay: 0.4s; }
.animate-stagger > *:nth-child(n+6) { animation-delay: 0.5s; }

/* Intersection Observer Animations */
.animate-in {
  opacity: 0;
  animation: slideInUp 0.8s ease-out forwards;
}

/* Title Animation */
.animate-title {
  animation: slideInUp 0.8s ease-out;
}

.animate-title .word {
  animation: slideInUp 0.6s ease-out;
}

.animate-title .word:nth-child(1) { animation-delay: 0s; }
.animate-title .word:nth-child(2) { animation-delay: 0.1s; }
.animate-title .word:nth-child(3) { animation-delay: 0.2s; }

/* Custom Hover Effects */
.hover-lift:hover {
  transform: translateY(-5px);
  transition: all 0.3s ease;
}

.hover-scale:hover {
  transform: scale(1.05);
  transition: all 0.3s ease;
}

.hover-glow:hover {
  box-shadow: 0 0 20px rgba(0, 102, 255, 0.5);
  transition: all 0.3s ease;
}

.hover-spin:hover {
  transform: rotate(5deg);
  transition: all 0.3s ease;
}

/* Gradient Text Animation */
.animate-gradient-text {
  background: linear-gradient(90deg, #0066ff, #ff9900, #0066ff);
  background-size: 200% auto;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  animation: gradientShift 4s linear infinite;
}

/* Delay Utilities */
.delay-100 { animation-delay: 0.1s; }
.delay-200 { animation-delay: 0.2s; }
.delay-300 { animation-delay: 0.3s; }
.delay-400 { animation-delay: 0.4s; }
.delay-500 { animation-delay: 0.5s; }

/* Duration Utilities */
.duration-fast { animation-duration: 0.3s; }
.duration-normal { animation-duration: 0.6s; }
.duration-slow { animation-duration: 1s; }
.duration-slower { animation-duration: 1.5s; }