.sv-btn-atlas,
.sv-link-card,
.nav__cta {
  transition:
    transform 0.55s var(--sv-ease-smooth, cubic-bezier(0.16, 1, 0.3, 1)),
    box-shadow 0.55s var(--sv-ease-smooth, ease),
    border-color 0.55s var(--sv-ease-smooth, ease),
    background 0.55s var(--sv-ease-smooth, ease),
    color 0.45s var(--sv-ease-smooth, ease),
    filter 0.45s var(--sv-ease-smooth, ease);
}

@media (prefers-reduced-motion: no-preference) {
  .sv-btn-animate {
    animation: sv-btn-fly-in 0.75s var(--sv-ease-smooth, cubic-bezier(0.16, 1, 0.3, 1)) both;
    animation-delay: calc(var(--btn-i, 0) * 0.07s);
  }

  .sv-link-card.sv-btn-animate {
    animation-name: sv-card-fly-in;
  }
}

@keyframes sv-btn-fly-in {
  0% {
    opacity: 0;
    transform: translateY(18px) scale(0.96);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes sv-card-fly-in {
  0% {
    opacity: 0;
    transform: translateY(14px) translateX(-6px);
  }
  100% {
    opacity: 1;
    transform: translateY(0) translateX(0);
  }
}

.sv-btn-atlas--primary:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 10px 28px rgba(6, 182, 212, 0.35);
  filter: brightness(1.06);
}

.sv-btn-atlas--primary:active {
  transform: translateY(0) scale(0.98);
  transition-duration: 0.15s;
}

.sv-btn-atlas--secondary:hover,
.sv-btn-atlas--ghost:hover {
  transform: translateY(-2px);
}

.sv-btn-atlas--secondary:active,
.sv-btn-atlas--ghost:active {
  transform: translateY(0) scale(0.99);
}

.sv-link-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 36px rgba(6, 182, 212, 0.14);
}

.sv-link-card:active {
  transform: translateY(-1px) scale(0.99);
  transition-duration: 0.2s;
}

.sv-btn-atlas .sv-btn-atlas__chev {
  display: inline-block;
  transition: transform 0.45s var(--sv-ease-smooth, ease);
}

.sv-btn-atlas:hover .sv-btn-atlas__chev {
  transform: translateX(4px);
}

.sv-link-card:hover .sv-link-card__arrow {
  background: rgba(6, 182, 212, 0.25);
  border-color: rgba(6, 182, 212, 0.6);
}

.sv-link-card:hover .sv-link-card__arrow::after {
  transform: rotate(45deg) translate(1px, -1px);
  transition: transform 0.45s var(--sv-ease-smooth, ease);
}

@media (prefers-reduced-motion: reduce) {
  .sv-btn-animate {
    animation: none !important;
  }

  .sv-btn-atlas:hover,
  .sv-link-card:hover {
    transform: none;
  }
}