/* animations.css — fades, slides, subtle glow/hover effects */

.fade-in {
  opacity: 0;
  transform: translateY(6px);
  transition: opacity 600ms ease, transform 600ms ease;
}
.fade-in.visible {
  opacity: 1;
  transform: none;
}

.slide-up {
  opacity: 0;
  transform: translateY(16px);
  animation: slideUp 700ms ease forwards;
}
.delay-1 { animation-delay: 120ms; transition-delay: 120ms; }
.delay-2 { animation-delay: 240ms; transition-delay: 240ms; }
.delay-3 { animation-delay: 360ms; transition-delay: 360ms; }
.delay-4 { animation-delay: 480ms; transition-delay: 480ms; }
.delay-5 { animation-delay: 600ms; transition-delay: 600ms; }

@keyframes slideUp {
  to { opacity: 1; transform: translateY(0); }
}

/* Subtle animated border glow for hover-glow */
.hover-glow:hover {
  animation: pulseGlow 1.4s ease-in-out infinite alternate;
}
@keyframes pulseGlow {
  from { box-shadow: var(--glow); }
  to   { box-shadow: 0 0 0 1px rgba(59,130,246,0.35), 0 0 28px rgba(147,51,234,0.25); }
}
/* Respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  .fade-in, .slide-up { 
    transition: none !important; 
    animation: none !important; 
    opacity: 1 !important; 
    transform: none !important; 
  }
  .hover-glow:hover { animation: none !important; }
}