/* Animation Utility Classes */
.fade-in {
  opacity: 0;
  transform: translateY(30px);
  animation: fadeIn 0.8s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

.delay-1 { animation-delay: 0.2s; }
.delay-2 { animation-delay: 0.4s; }
.delay-3 { animation-delay: 0.6s; }

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

.pulse-glow {
  animation: pulseGlow 4s infinite alternate;
}

@keyframes fadeIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

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

@keyframes pulseGlow {
  0% { box-shadow: 0 0 20px rgba(139, 92, 246, 0.1); }
  100% { box-shadow: 0 0 50px rgba(244, 114, 182, 0.3); }
}

/* Page Transition Overlay (Optional) */
body::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--primary-bg);
  z-index: 9999;
  pointer-events: none;
  animation: pageReveal 0.8s ease-out forwards;
}

@keyframes pageReveal {
  0% { opacity: 1; }
  100% { opacity: 0; visibility: hidden; }
}