/* animation.css - Core Keyframes & Transitions */

/* Keyframe Animations */
@keyframes spin {
  to { transform: rotate(360deg); }
}

@keyframes floatSlow {
  0% { transform: translateY(0px) rotate(0deg); }
  50% { transform: translateY(-12px) rotate(1deg); }
  100% { transform: translateY(0px) rotate(0deg); }
}

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

@keyframes pulseSubtle {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.85; transform: scale(0.98); }
}

@keyframes ripple {
  0% { transform: scale(0); opacity: 0.3; }
  100% { transform: scale(2.5); opacity: 0; }
}

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

@keyframes modalScaleUp {
  from { opacity: 0; transform: scale(0.95) translateY(20px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}

/* Floating Card Classes */
.float-slow {
  animation: floatSlow 8s ease-in-out infinite;
}

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

.pulse-subtle {
  animation: pulseSubtle 4s ease-in-out infinite;
}

/* Scroll Reveal Classes (Driven by IntersectionObserver in js/animation.js) */
.reveal-hidden {
  opacity: 0;
  transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, opacity;
}

.reveal-fade-in {
  opacity: 0;
  transition: opacity 0.8s ease-out;
}
.reveal-fade-in.reveal-visible {
  opacity: 1;
}

.reveal-slide-up {
  transform: translateY(40px);
}
.reveal-slide-up.reveal-visible {
  transform: translateY(0);
  opacity: 1;
}

.reveal-slide-left {
  transform: translateX(-40px);
}
.reveal-slide-left.reveal-visible {
  transform: translateX(0);
  opacity: 1;
}

.reveal-slide-right {
  transform: translateX(40px);
}
.reveal-slide-right.reveal-visible {
  transform: translateX(0);
  opacity: 1;
}

.reveal-scale-up {
  transform: scale(0.92);
}
.reveal-scale-up.reveal-visible {
  transform: scale(1);
  opacity: 1;
}

/* Delay modifiers for sequential list reveals */
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }
.delay-300 { transition-delay: 300ms; }
.delay-400 { transition-delay: 400ms; }
.delay-500 { transition-delay: 500ms; }
.delay-600 { transition-delay: 600ms; }

/* Micro-interactions & Buttons */
.btn-ripple {
  position: relative;
  overflow: hidden;
}
.btn-ripple .ripple-effect {
  position: absolute;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  transform: scale(0);
  animation: ripple 0.6s linear;
  pointer-events: none;
}

/* Hover effects */
.hover-lift {
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}
.hover-lift:hover {
  transform: translateY(-5px);
  box-shadow: 0 15px 30px -10px rgba(250, 85, 54, 0.15);
}

.hover-glow {
  transition: all var(--transition-normal);
}
.hover-glow:hover {
  box-shadow: 0 0 20px rgba(250, 85, 54, 0.25);
  border-color: rgba(250, 85, 54, 0.5);
}
