/* Scroll-triggered animations for sections */
/* Respects prefers-reduced-motion for accessibility */

/* Auto-animate all sections by default */
section:not(.no-animate):not(.home-hero-compact) {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), 
              transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

section:not(.no-animate):not(.home-hero-compact).animate-in {
  opacity: 1;
  transform: translateY(0);
}

/* Auto-animate containers and content wrappers */
.container:not(.no-animate),
.content-wrapper:not(.no-animate),
.page-content:not(.no-animate) {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.container:not(.no-animate).animate-in,
.content-wrapper:not(.no-animate).animate-in,
.page-content:not(.no-animate).animate-in {
  opacity: 1;
  transform: translateY(0);
}

/* Base animation classes */
.scroll-animate {
  opacity: 0;
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.scroll-animate.animate-in {
  opacity: 1;
  transform: translateY(0) translateX(0);
}

/* Fade in from bottom */
.scroll-fade-up {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), 
              transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.scroll-fade-up.animate-in {
  opacity: 1;
  transform: translateY(0);
}

/* Fade in from top */
.scroll-fade-down {
  opacity: 0;
  transform: translateY(-40px);
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), 
              transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.scroll-fade-down.animate-in {
  opacity: 1;
  transform: translateY(0);
}

/* Slide in from left */
.scroll-slide-left {
  opacity: 0;
  transform: translateX(-60px);
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), 
              transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.scroll-slide-left.animate-in {
  opacity: 1;
  transform: translateX(0);
}

/* Slide in from right */
.scroll-slide-right {
  opacity: 0;
  transform: translateX(60px);
  transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), 
              transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.scroll-slide-right.animate-in {
  opacity: 1;
  transform: translateX(0);
}

/* Scale in */
.scroll-scale {
  opacity: 0;
  transform: scale(0.9);
  transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), 
              transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.scroll-scale.animate-in {
  opacity: 1;
  transform: scale(1);
}

/* Fade in only (no transform) */
.scroll-fade {
  opacity: 0;
  transition: opacity 0.8s ease-out;
}

.scroll-fade.animate-in {
  opacity: 1;
}

/* Staggered animations for children */
.scroll-stagger > * {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* When parent has animate-in, animate children */
.animate-in .scroll-stagger > *:nth-child(1) {
  transition-delay: 0.1s;
  opacity: 1;
  transform: translateY(0);
}

.animate-in .scroll-stagger > *:nth-child(2) {
  transition-delay: 0.2s;
  opacity: 1;
  transform: translateY(0);
}

.animate-in .scroll-stagger > *:nth-child(3) {
  transition-delay: 0.3s;
  opacity: 1;
  transform: translateY(0);
}

.animate-in .scroll-stagger > *:nth-child(4) {
  transition-delay: 0.4s;
  opacity: 1;
  transform: translateY(0);
}

.animate-in .scroll-stagger > *:nth-child(5) {
  transition-delay: 0.5s;
  opacity: 1;
  transform: translateY(0);
}

.animate-in .scroll-stagger > *:nth-child(6) {
  transition-delay: 0.6s;
  opacity: 1;
  transform: translateY(0);
}

.animate-in .scroll-stagger > *:nth-child(n+7) {
  transition-delay: 0.7s;
  opacity: 1;
  transform: translateY(0);
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  section:not(.no-animate),
  .container:not(.no-animate),
  .content-wrapper:not(.no-animate),
  .page-content:not(.no-animate),
  .scroll-animate,
  .scroll-fade-up,
  .scroll-fade-down,
  .scroll-slide-left,
  .scroll-slide-right,
  .scroll-scale,
  .scroll-fade,
  .scroll-stagger > * {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
  
  .scroll-stagger.animate-in > * {
    transition-delay: 0s !important;
  }
}

/* Animation delays for sequential sections */
.animate-delay-100 {
  transition-delay: 0.1s;
}

.animate-delay-200 {
  transition-delay: 0.2s;
}

.animate-delay-300 {
  transition-delay: 0.3s;
}

.animate-delay-400 {
  transition-delay: 0.4s;
}

.animate-delay-500 {
  transition-delay: 0.5s;
}