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

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

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

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

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 20px rgba(255, 118, 117, 0.3); }
  50% { box-shadow: 0 0 40px rgba(255, 118, 117, 0.6), 0 0 60px rgba(255, 118, 117, 0.2); }
}

@keyframes tiltIn {
  from { opacity: 0; transform: perspective(600px) rotateX(12deg) translateY(40px); }
  to { opacity: 1; transform: perspective(600px) rotateX(0) translateY(0); }
}

@keyframes slideLeft {
  from { opacity: 0; transform: translateX(-60px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes slideRight {
  from { opacity: 0; transform: translateX(60px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes zoomPop {
  0% { opacity: 0; transform: scale(0.5); }
  70% { transform: scale(1.08); }
  100% { opacity: 1; transform: scale(1); }
}

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

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

@keyframes revealUp {
  from { clip-path: inset(100% 0 0 0); opacity: 0; }
  to { clip-path: inset(0 0 0 0); opacity: 1; }
}

@keyframes spinIn {
  from { opacity: 0; transform: rotate(-180deg) scale(0); }
  to { opacity: 1; transform: rotate(0) scale(1); }
}

.animate-float { animation: float 4s ease-in-out infinite; }
.animate-float-slow { animation: float 6s ease-in-out infinite; }
.animate-pulse-glow { animation: pulseGlow 2s ease-in-out infinite; }
.animate-shimmer { background-size: 200% auto; animation: shimmer 2s linear infinite; }
.animate-gradient { background-size: 200% 200%; animation: gradientShift 4s ease infinite; }

[data-animate] { opacity: 0; }

[data-animate].visible-fade-up { animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
[data-animate].visible-tilt { animation: tiltIn 0.9s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
[data-animate].visible-scale { animation: scaleIn 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; }
[data-animate].visible-slide-left { animation: slideLeft 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
[data-animate].visible-slide-right { animation: slideRight 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
[data-animate].visible-zoom { animation: zoomPop 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) forwards; }
[data-animate].visible-reveal { animation: revealUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

html { scroll-behavior: smooth; }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #1A1E20; }
::-webkit-scrollbar-thumb { background: #40474A; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #FF7675; }