:root {
  --btn-pop-scale: 1.04;
  --btn-pop-translate: -6px;
  --btn-shadow: 0 18px 40px rgba(99,102,241,0.08), 0 6px 18px rgba(236,72,153,0.06);
  --btn-transition: transform .28s cubic-bezier(.2,.9,.3,1), box-shadow .28s cubic-bezier(.2,.9,.3,1);
}

/* Apply to common button-like elements across the site */
button,
.btn,
.btn-view,
a.btn,
input[type="button"],
input[type="submit"],
.inline-button {
  transition: var(--btn-transition);
  transform-origin: center;
  will-change: transform, box-shadow;
}

/* Hover / focus - AAA smooth pop with radiant shadow */
button:hover,
.btn:hover,
.btn-view:hover,
a.btn:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.inline-button:hover,
button:focus-visible,
.btn:focus-visible,
.btn-view:focus-visible,
a.btn:focus-visible,
input[type="button"]:focus-visible,
input[type="submit"]:focus-visible {
  transform: translateY(var(--btn-pop-translate)) scale(var(--btn-pop-scale));
  box-shadow: var(--btn-shadow);
  outline: none;
}

/* Active press state */
button:active,
.btn:active,
.btn-view:active {
  transform: translateY(calc(var(--btn-pop-translate) + 2px)) scale(calc(var(--btn-pop-scale) - 0.02));
  transition-duration: .14s;
}

/* Accessible focus ring */
:focus-visible {
  box-shadow: 0 0 0 3px rgba(99,102,241,0.12), var(--btn-shadow);
}

/* Disabled button variant: allow using the .btn visual without interactive transforms */
.btn[aria-disabled="true"] {
  pointer-events: none; /* fully non-interactive */
  cursor: not-allowed;
  opacity: 0.95;
  transform: none !important; /* prevent any pop/translate */
  box-shadow: none !important; /* keep flat */
}
.btn[aria-disabled="true"]:hover,
.btn[aria-disabled="true"]:focus,
.btn[aria-disabled="true"]:focus-visible {
  transform: none !important;
  box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
  button,
  .btn,
  .btn-view,
  a.btn,
  input[type="button"],
  input[type="submit"],
  .inline-button {
    transition: none !important;
    transform: none !important;
    box-shadow: none !important;
  }
}
