@media (prefers-reduced-motion: reduce) {
  .motion-safe\:animate-fade-in {
    animation: none;
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in {
  animation: fade-in 0.5s ease-out forwards;
}

.counter-digit {
  font-variant-numeric: tabular-nums;
}

/* Hero animated gradient background */
.hero-animated {
  background-size: 200% 200%;
  animation: gradient-move 16s ease-in-out infinite;
}

@keyframes gradient-move {
  0% {
    background-position: 0% 0%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 0%;
  }
}

/* Card lift / hover effect */
.card-lift {
  transition:
    transform 220ms ease-out,
    box-shadow 220ms ease-out,
    background-color 180ms ease-out,
    border-color 180ms ease-out;
}

.card-lift:hover,
.card-lift:focus-within {
  transform: translateY(-6px) scale(1.01);
  box-shadow: 0 18px 40px rgba(15, 118, 110, 0.18);
  border-color: rgba(15, 118, 110, 0.4);
}

/* Button micro-interactions */
.btn-primary-glow {
  transition:
    transform 200ms ease-out,
    box-shadow 200ms ease-out,
    background-color 150ms ease-out;
}

.btn-primary-glow:hover {
  transform: translateY(-2px) scale(1.01);
  box-shadow: 0 14px 30px rgba(217, 119, 6, 0.45);
}

.btn-ghost-glow {
  transition:
    transform 200ms ease-out,
    box-shadow 200ms ease-out,
    background-color 150ms ease-out,
    border-color 150ms ease-out;
}

.btn-ghost-glow:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(15, 118, 110, 0.35);
  border-color: rgba(255, 255, 255, 0.8);
}
