/* ==========================================================================
   Website Design Solutions - Keyframe Animations & Micro-Interactions
   ========================================================================== */

@keyframes pulseGlow {
  0%, 100% {
    opacity: 0.6;
    transform: scale(1);
  }
  50% {
    opacity: 1;
    transform: scale(1.04);
  }
}

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

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

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

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

.gradient-animated {
  background-size: 200% 200%;
  animation: gradientShift 6s ease infinite;
}

/* Subtle reveal on scroll support */
.reveal-on-scroll {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.reveal-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}