/* ============================================
   ANIMATIONS.CSS - Keyframes & Scroll Effects
   Enhanced with smoother curves and staggering
   ============================================ */

/* ----------------------------------------
   Keyframes
   ---------------------------------------- */
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

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

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

@keyframes zoomIn {
  from { opacity: 0; transform: scale(0.92); }
  to   { opacity: 1; transform: scale(1); }
}

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

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

/* Floating animation for decorative elements */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}

/* Pulse glow for CTAs */
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(65, 117, 114, 0.3); }
  50%      { box-shadow: 0 0 20px 4px rgba(65, 117, 114, 0.15); }
}

/* ----------------------------------------
   Scroll Animation Base
   ---------------------------------------- */
[data-animate] {
  opacity: 0;
  will-change: opacity, transform;
}

[data-animate].is-visible {
  opacity: 1;
}

/* Animation types */
[data-animate="fadeIn"].is-visible {
  animation: fadeIn 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

[data-animate="fadeInUp"].is-visible {
  animation: fadeInUp 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

[data-animate="slideInUp"].is-visible {
  animation: slideInUp 0.9s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

[data-animate="zoomIn"].is-visible {
  animation: zoomIn 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

[data-animate="slideInLeft"].is-visible {
  animation: slideInLeft 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

[data-animate="slideInRight"].is-visible {
  animation: slideInRight 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

/* ----------------------------------------
   Stagger Delays
   ---------------------------------------- */
[data-delay="100"].is-visible { animation-delay: 0.1s; }
[data-delay="200"].is-visible { animation-delay: 0.2s; }
[data-delay="300"].is-visible { animation-delay: 0.3s; }
[data-delay="400"].is-visible { animation-delay: 0.4s; }
[data-delay="500"].is-visible { animation-delay: 0.5s; }
[data-delay="600"].is-visible { animation-delay: 0.6s; }

/* ----------------------------------------
   Utility Animation Classes (always-on)
   ---------------------------------------- */
.animate-float {
  animation: float 4s ease-in-out infinite;
}

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

/* ----------------------------------------
   Image reveal effect
   ---------------------------------------- */
.img-reveal {
  overflow: hidden;
  border-radius: var(--radius-lg);
}

.img-reveal img {
  transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.img-reveal:hover img {
  transform: scale(1.05);
}
