/* ==========================================================================
   Animation keyframes + scroll-reveal utilities
   ========================================================================== */

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

@keyframes floatSlow {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-22px) rotate(4deg); }
}

@keyframes pulseGlow {
  0%, 100% { opacity: 0.45; transform: scale(1); }
  50% { opacity: 0.7; transform: scale(1.08); }
}

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

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

@keyframes spin-slow {
  to { transform: rotate(360deg); }
}

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes dash {
  to { stroke-dashoffset: 0; }
}

.animate-float { animation: floatY 6s ease-in-out infinite; }
.animate-float-slow { animation: floatSlow 9s ease-in-out infinite; }
.animate-pulse-glow { animation: pulseGlow 5s ease-in-out infinite; }
.animate-spin-slow { animation: spin-slow 18s linear infinite; }

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

.blink-cursor {
  animation: blink 1s step-end infinite;
}

.marquee-track {
  animation: marquee 26s linear infinite;
}

/* ---------- scroll reveal ---------- */

.reveal {
  opacity: 0;
  transform: translateY(28px);
  filter: blur(6px);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease), filter 0.8s var(--ease);
}

.reveal.in-view {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

.reveal-scale {
  opacity: 0;
  transform: scale(0.92);
  transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}

.reveal-scale.in-view {
  opacity: 1;
  transform: scale(1);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-28px);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}
.reveal-left.in-view { opacity: 1; transform: translateX(0); }

.reveal-right {
  opacity: 0;
  transform: translateX(28px);
  transition: opacity 0.8s var(--ease), transform 0.8s var(--ease);
}
.reveal-right.in-view { opacity: 1; transform: translateX(0); }

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-scale, .reveal-left, .reveal-right {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
  .animate-float, .animate-float-slow, .animate-pulse-glow, .animate-spin-slow,
  .gradient-bg-animated, .blink-cursor, .marquee-track {
    animation: none !important;
  }
}