.fade-in,
.slide-up {
  opacity: 0;
  will-change: transform, opacity;
}

.fade-in {
  transform: translateY(22px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}

.slide-up {
  transform: translateY(34px);
  transition: opacity 0.95s ease, transform 0.95s cubic-bezier(0.22, 1, 0.36, 1);
}

.visible {
  opacity: 1;
  transform: translateY(0);
}

.service-card,
.stat-card {
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease,
    border-color 0.3s ease;
}

.service-card:hover,
.service-card:focus-within,
.stat-card:hover,
.stat-card:focus-within {
  box-shadow: 0 22px 42px rgba(31, 39, 64, 0.16);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  .fade-in,
  .slide-up,
  .service-card,
  .stat-card,
  .btn {
    opacity: 1;
    transform: none;
    transition: none;
  }
}