[data-animate] {
  opacity: 0;
  transform: translateY(28px);
  transition: transform 720ms cubic-bezier(0.2, 1, 0.3, 1), opacity 720ms ease;
}

[data-animate].is-visible {
  opacity: 1;
  transform: translateY(0);
}

[data-animate="left"] {
  transform: translateX(-26px);
}

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

[data-animate="right"] {
  transform: translateX(26px);
}

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

.grid > [data-animate]:nth-child(2),
.stat-row > [data-animate]:nth-child(2),
.trust-grid > [data-animate]:nth-child(2),
.process-grid > [data-animate]:nth-child(2) {
  transition-delay: 90ms;
}

.grid > [data-animate]:nth-child(3),
.stat-row > [data-animate]:nth-child(3),
.trust-grid > [data-animate]:nth-child(3),
.process-grid > [data-animate]:nth-child(3) {
  transition-delay: 160ms;
}

.grid > [data-animate]:nth-child(4),
.trust-grid > [data-animate]:nth-child(4),
.process-grid > [data-animate]:nth-child(4) {
  transition-delay: 220ms;
}

.float-in {
  animation: floatIn 0.9s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes floatIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

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

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }

  [data-animate] {
    opacity: 1;
    transform: none;
  }
}
