.fade-in-up {
  opacity: 0;
  transform: translateY(24px);
  animation: fadeInUp 800ms var(--transition) forwards;
}

.fade-in {
  opacity: 0;
  animation: fadeIn 600ms var(--transition) forwards;
}

.stagger {
  animation-delay: 160ms;
}

.stagger-2 {
  animation-delay: 320ms;
}

.stagger-3 {
  animation-delay: 480ms;
}

.accent-glow {
  position: relative;
}

.accent-glow::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(97, 218, 251, 0.3), rgba(85, 240, 166, 0.2));
  z-index: -1;
  opacity: 0;
  transition: opacity var(--transition);
  filter: blur(18px);
}

.accent-glow:hover::after,
.accent-glow:focus-visible::after {
  opacity: 1;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(24px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes pulseAccent {
  0% {
    box-shadow: 0 0 0 0 rgba(97, 218, 251, 0.35);
  }

  70% {
    box-shadow: 0 0 0 12px rgba(97, 218, 251, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(97, 218, 251, 0);
  }
}