.fade-in-element {
  opacity: 0;
  transform: translateY(30px);
  filter: blur(4px);
  transition:
    opacity 850ms ease,
    transform 850ms ease,
    filter 850ms ease;
  will-change: opacity, transform, filter;
}

.fade-in-element.is-visible {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0);
}

/* Slight stagger inside common grids */

/* Natural stagger for What You Get cards */

.value-grid .fade-in-element:nth-child(1) {
  transition-delay: 80ms;
}

.value-grid .fade-in-element:nth-child(2) {
  transition-delay: 180ms;
}

.value-grid .fade-in-element:nth-child(3) {
  transition-delay: 280ms;
}

.value-grid .fade-in-element:nth-child(4) {
  transition-delay: 380ms;
}

/* Natural stagger for deep-dive cards */

.analyses-grid .fade-in-element:nth-child(1) {
  transition-delay: 80ms;
}

.analyses-grid .fade-in-element:nth-child(2) {
  transition-delay: 200ms;
}

.analyses-grid .fade-in-element:nth-child(3) {
  transition-delay: 320ms;
}

/* Natural stagger for portfolio summary cards */

.portfolio-summary .fade-in-element:nth-child(1) {
  transition-delay: 80ms;
}

.portfolio-summary .fade-in-element:nth-child(2) {
  transition-delay: 170ms;
}

.portfolio-summary .fade-in-element:nth-child(3) {
  transition-delay: 260ms;
}

.portfolio-summary .fade-in-element:nth-child(4) {
  transition-delay: 350ms;
}

.chart-section-container > .fade-in-element:nth-child(1) {
  transition-delay: 100ms;
}

.chart-section-container > .fade-in-element:nth-child(2) {
  transition-delay: 200ms;
}

.chart-section-container > .fade-in-element:nth-child(3) {
  transition-delay: 100ms;
}

.chart-section-container > .fade-in-element:nth-child(4) {
  transition-delay: 180ms;
}

.chart-section-container > .fade-in-element:nth-child(5) {
  transition-delay: 260ms;
}

@media (prefers-reduced-motion: reduce) {
  .fade-in-element,
  .hero-story-title,
  .hero-line-one,
  .hero-line-two,
  .hero-story-subtitle,
  .hero-story-buttons {
    opacity: 1;
    transform: none;
    transition: none;
    animation: none;
    filter: none;
  }

  * {
    scroll-behavior: auto !important;
  }
}
