/**
 * Scroll Fade-In Animation Styles
 * Works with scroll-fade-in.js
 */

.sfade {
  opacity: 0;
  transform: translateY(30px);
}

.sfade.sfade--visible {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
    transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  .sfade {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}