/* Checkout uses the store palette with a compact, readable type scale. */
.checkout-main { padding-top: 2rem; padding-bottom: 5rem; }
.checkout-breadcrumb { margin-bottom: 1.75rem; }
.checkout-heading { grid-template-columns: minmax(0, 1fr) minmax(18rem, .8fr); gap: 2rem; padding-bottom: 2rem; border-color: var(--order-line); }
.checkout-main .checkout-heading .kicker { margin-bottom: .75rem; font-size: .75rem; letter-spacing: .18em; }
.checkout-heading h1 { max-width: none; margin: 0; font-size: clamp(2rem, 3.2vw, 2.75rem); font-weight: 700; line-height: 1.3; letter-spacing: -.04em; text-shadow: none; }
.checkout-heading .accent-word { text-shadow: none; }
.checkout-heading > p { max-width: 30rem; font-size: 1rem; line-height: 1.75; }
.checkout-workspace { gap: 2rem; padding-top: 2rem; }
.checkout-section { padding-bottom: 2rem; margin-bottom: 2rem; border-color: var(--order-line); }
.checkout-section__head { display: block; margin-bottom: 1.25rem; }
.checkout-main .checkout-section__head .kicker, .checkout-main .checkout-summary__head .kicker { margin: 0 0 .4rem; font-size: .75rem; letter-spacing: .15em; }
.checkout-main .checkout-section__head h2, .checkout-main .checkout-summary h2 { font-size: 1.5rem; line-height: 1.4; letter-spacing: -.03em; }

/* Each method has its description above a consistently sized action. */
.checkout-methods > .checkout-method-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; padding: 0; border: 0; }
.checkout-method-card { min-width: 0; display: flex; flex-direction: column; align-items: start; gap: 1rem; padding: 1.25rem; border: 1px solid var(--order-line); border-radius: var(--radius-soft, 18px); background: var(--snow, #fff); }
.checkout-method-card[hidden] { display: none; }
.checkout-method-copy { min-height: 5.5rem; }
.checkout-methods h3 { margin: 0 0 .5rem; font-size: 1.125rem; font-weight: 700; line-height: 1.4; }
.checkout-methods .checkout-method-copy p { margin: 0; font-size: .9375rem; line-height: 1.65; word-break: keep-all; overflow-wrap: anywhere; }
.checkout-method-action { width: min(100%, 13rem); min-height: 68px; }
/* The official Npay template reserves 18px above its button. */
.checkout-method-action:not(#npay-checkout-button) { padding-top: 18px; }
.checkout-method-action > .order-primary-link { width: 100%; min-height: 50px; justify-content: center; padding: .5rem .65rem; font-size: .875rem; line-height: 1.4; box-shadow: none; }
.checkout-methods .checkout-method-status { margin: 0; font-size: .875rem; line-height: 1.65; color: var(--harbor, #4F6B58); overflow-wrap: anywhere; }
.checkout-method-status:empty { display: none; }
.checkout-methods .checkout-method-status.is-error { color: var(--order-danger); }
.checkout-method-action :is(a, button):focus-visible { outline: 3px solid var(--deep-wave, #3E6B52); outline-offset: 3px; }

.checkout-member-note { margin-bottom: 2rem; gap: 1rem; align-items: center; }
.checkout-member-note h2 { font-size: 1.25rem; line-height: 1.5; }
.checkout-main .checkout-member-note p { font-size: .9375rem; line-height: 1.7; }
.checkout-fields { gap: 1.25rem; }
.checkout-main .order-field label { font-size: .9375rem; }
.checkout-summary { top: 7rem; padding: 1.5rem; }
.checkout-summary__head { border-color: var(--order-line); }
.checkout-main .checkout-totals .checkout-total { font-size: 1.25rem; border-color: var(--order-line); }
.checkout-main .checkout-item__option { line-height: 1.5; }
.checkout-main .payment-pending-card p { font-size: .9375rem; line-height: 1.7; }
.checkout-submit-bar { border-color: var(--order-line); }
.order-complete h1 { font-size: clamp(1.75rem, 3.2vw, 2.5rem); line-height: 1.3; text-shadow: none; }
.order-discard-dialog h2 { font-size: 1.5rem; line-height: 1.4; text-shadow: none; }

@media (max-width: 1240px) {
  .checkout-workspace { grid-template-columns: minmax(0, 1fr); }
  .checkout-workspace > .checkout-methods { grid-column: 1; grid-row: 1; }
  .checkout-workspace > .checkout-summary { grid-column: 1; grid-row: 2; position: static; }
  .checkout-workspace > .checkout-form { grid-column: 1; grid-row: 3; }
  .checkout-methods { margin-bottom: 0; padding-bottom: 0; border: 0; }
}

@media (max-width: 820px) {
  .checkout-heading { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
}

@media (max-width: 900px) {
  .checkout-main { padding-top: 1.5rem; padding-bottom: 3rem; }
  .checkout-heading h1 { font-size: 2rem; }
  .checkout-heading { padding-bottom: 1.5rem; }
  .checkout-heading > p { font-size: .9375rem; }
  .checkout-workspace { padding-top: 1.5rem; gap: 1.5rem; }
  .checkout-methods > .checkout-method-grid { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
  .checkout-method-copy { min-height: 0; }
  .checkout-method-card { padding: 1.25rem; gap: .875rem; }
  .checkout-summary { padding: 1.25rem; }
}