/* ========================================
   SCROLL ANIMATIONS CSS
   Fade-in animations for all website sections
   ======================================== */

/* Base scroll animation class */
.scroll-animate {
  opacity: 0;
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
  will-change: opacity, transform;
}

/* Animation visible state */
.scroll-animate.is-visible {
  opacity: 1;
}

/* Fade Up (Default) */
.scroll-animate[data-animation="fade-up"],
.scroll-animate:not([data-animation]) {
  transform: translateY(30px);
}

.scroll-animate[data-animation="fade-up"].is-visible,
.scroll-animate:not([data-animation]).is-visible {
  transform: translateY(0);
}

/* Fade Down */
.scroll-animate[data-animation="fade-down"] {
  transform: translateY(-30px);
}

.scroll-animate[data-animation="fade-down"].is-visible {
  transform: translateY(0);
}

/* Fade Left */
.scroll-animate[data-animation="fade-left"] {
  transform: translateX(30px);
}

.scroll-animate[data-animation="fade-left"].is-visible {
  transform: translateX(0);
}

/* Fade Right */
.scroll-animate[data-animation="fade-right"] {
  transform: translateX(-30px);
}

.scroll-animate[data-animation="fade-right"].is-visible {
  transform: translateX(0);
}

/* Fade Scale */
.scroll-animate[data-animation="fade-scale"] {
  transform: scale(0.9);
}

.scroll-animate[data-animation="fade-scale"].is-visible {
  transform: scale(1);
}

/* Fade Rotate */
.scroll-animate[data-animation="fade-rotate"] {
  transform: rotate(-5deg) scale(0.95);
}

.scroll-animate[data-animation="fade-rotate"].is-visible {
  transform: rotate(0) scale(1);
}

/* Fade Zoom */
.scroll-animate[data-animation="fade-zoom"] {
  transform: scale(0.7);
}

.scroll-animate[data-animation="fade-zoom"].is-visible {
  transform: scale(1);
}

/* Stagger Children Animation */
.scroll-animate-stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.scroll-animate-stagger.is-visible > * {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger delays for children */
.scroll-animate-stagger.is-visible > *:nth-child(1) { transition-delay: 0.1s; }
.scroll-animate-stagger.is-visible > *:nth-child(2) { transition-delay: 0.2s; }
.scroll-animate-stagger.is-visible > *:nth-child(3) { transition-delay: 0.3s; }
.scroll-animate-stagger.is-visible > *:nth-child(4) { transition-delay: 0.4s; }
.scroll-animate-stagger.is-visible > *:nth-child(5) { transition-delay: 0.5s; }
.scroll-animate-stagger.is-visible > *:nth-child(6) { transition-delay: 0.6s; }
.scroll-animate-stagger.is-visible > *:nth-child(7) { transition-delay: 0.7s; }
.scroll-animate-stagger.is-visible > *:nth-child(8) { transition-delay: 0.8s; }
.scroll-animate-stagger.is-visible > *:nth-child(9) { transition-delay: 0.9s; }
.scroll-animate-stagger.is-visible > *:nth-child(10) { transition-delay: 1.0s; }

/* For more than 10 children, use CSS custom properties */
.scroll-animate-stagger.is-visible > *:nth-child(n+11) {
  transition-delay: calc(0.1s * var(--stagger-index, 11));
}

/* Custom duration support */
.scroll-animate[data-duration="400"] {
  transition-duration: 0.4s;
}

.scroll-animate[data-duration="600"] {
  transition-duration: 0.6s;
}

.scroll-animate[data-duration="1000"] {
  transition-duration: 1s;
}

.scroll-animate[data-duration="1200"] {
  transition-duration: 1.2s;
}

.scroll-animate[data-duration="1500"] {
  transition-duration: 1.5s;
}

.scroll-animate[data-duration="2000"] {
  transition-duration: 2s;
}

/* Custom delay support */
.scroll-animate[data-delay="100"] {
  transition-delay: 0.1s;
}

.scroll-animate[data-delay="200"] {
  transition-delay: 0.2s;
}

.scroll-animate[data-delay="300"] {
  transition-delay: 0.3s;
}

.scroll-animate[data-delay="400"] {
  transition-delay: 0.4s;
}

.scroll-animate[data-delay="500"] {
  transition-delay: 0.5s;
}

.scroll-animate[data-delay="600"] {
  transition-delay: 0.6s;
}

.scroll-animate[data-delay="800"] {
  transition-delay: 0.8s;
}

.scroll-animate[data-delay="1000"] {
  transition-delay: 1s;
}

/* Parallax fade effect */
.scroll-animate-parallax {
  opacity: 0;
  transform: translateY(50px);
  transition: opacity 1.2s ease-out, transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

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

/* Special animations for specific sections */

/* Hero animations */
.hero-badge.scroll-animate {
  transform: translateY(20px) scale(0.9);
}

.hero-badge.scroll-animate.is-visible {
  transform: translateY(0) scale(1);
}

/* Card hover prevention during animation */
.scroll-animate:not(.is-visible) {
  pointer-events: none;
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
  .scroll-animate,
  .scroll-animate-stagger > *,
  .scroll-animate-parallax {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Mobile optimizations */
@media (max-width: 768px) {
  /* Reduce transform distance on mobile */
  .scroll-animate[data-animation="fade-up"],
  .scroll-animate:not([data-animation]) {
    transform: translateY(20px);
  }
  
  .scroll-animate[data-animation="fade-down"] {
    transform: translateY(-20px);
  }
  
  .scroll-animate[data-animation="fade-left"] {
    transform: translateX(20px);
  }
  
  .scroll-animate[data-animation="fade-right"] {
    transform: translateX(-20px);
  }
  
  /* Faster animations on mobile */
  .scroll-animate {
    transition-duration: 0.6s !important;
  }
  
  /* Reduce stagger delay on mobile */
  .scroll-animate-stagger.is-visible > *:nth-child(n) {
    transition-delay: calc(0.05s * var(--mobile-index, 1)) !important;
  }
}

/* Loading state for images */
.scroll-animate img {
  transition: filter 0.3s ease-out;
  filter: blur(5px);
}

.scroll-animate.is-visible img {
  filter: blur(0);
}

/* Special effects for FATE cards */
.fate-card.scroll-animate {
  transform: translateY(40px) rotateX(-10deg);
  transform-origin: center bottom;
  perspective: 1000px;
}

.fate-card.scroll-animate.is-visible {
  transform: translateY(0) rotateX(0);
}

/* Timeline special animation */
.timeline-item.scroll-animate {
  transform: translateX(-50px);
  opacity: 0;
}

.timeline-item.scroll-animate.is-visible {
  transform: translateX(0);
  opacity: 1;
}

/* Progress line animation for timeline */
.timeline-item.scroll-animate::before {
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 0.8s ease-out;
}

.timeline-item.scroll-animate.is-visible::before {
  transform: scaleY(1);
  transition-delay: 0.3s;
}

/* Stats counter animation prep */
.stat-number.scroll-animate {
  display: inline-block;
}

/* Trust items special hover during animation */
.trust-item.scroll-animate {
  transform: translateY(30px) scale(0.95);
}

.trust-item.scroll-animate.is-visible {
  transform: translateY(0) scale(1);
}

/* Report cards cascade effect */
.report-card.scroll-animate:nth-child(1) { transition-delay: 0.1s; }
.report-card.scroll-animate:nth-child(2) { transition-delay: 0.2s; }
.report-card.scroll-animate:nth-child(3) { transition-delay: 0.3s; }

/* Section headers emphasis */
.section-header.scroll-animate {
  transform: scale(0.9);
  opacity: 0;
}

.section-header.scroll-animate.is-visible {
  transform: scale(1);
  opacity: 1;
}