/* ---------------------------------------------------------------------------
   Card checkout — the Buy button and the demoted crypto link.
   Paired with js/checkout.js. Safe to delete both together.

   Note how little is here. The buy button carries the site's own .btn,
   .btn-primary and .btn-block classes and inherits everything from them —
   fill, radius, type, hover shimmer — so it matches every other button on
   the page and tracks the theme if the palette ever changes. An earlier
   version restated all of that here to out-specify Gumroad's injected
   stylesheet; dropping their class removed the need, and with it the risk of
   this file drifting out of step with the real button styling.
--------------------------------------------------------------------------- */

.plan .buy-card-btn {
  width: 100%;
}

.plan .buy-card-btn .ico {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

/* The crypto route, demoted to a quiet text link under the card button. */
.plan-alt-pay {
  display: block;
  margin-top: 12px;
  text-align: center;
  font-size: 0.92rem;
  color: var(--text-dim);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color 0.18s ease, border-color 0.18s ease;
}

.plan-alt-pay:hover,
.plan-alt-pay:focus-visible {
  color: var(--amber-bright);
  border-bottom-color: currentColor;
}

.plan-alt-pay:focus-visible {
  outline: 2px solid var(--amber-bright);
  outline-offset: 3px;
  border-radius: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .plan-alt-pay { transition: none; }
}