:root {
  --ncb-surface: #ffffff;
  --ncb-text: #202020;
  --ncb-muted: #565656;
  --ncb-border: #646464;
  --ncb-primary: #1f654b;
  --ncb-primary-text: #ffffff;
  --ncb-focus-light: #ffffff;
  --ncb-focus-dark: #111111;
  --ncb-error: #a32020;
  --ncb-error-surface: #fff4f4;
}

.ncb-checkout-page { box-sizing: border-box; inline-size: calc(100% - 48px); max-inline-size: var(--bricks-content-width, 1200px); margin-inline: auto; padding-block: 48px 72px; }
.ncb-checkout, .ncb-offer { color: var(--ncb-text); }
.ncb-checkout [hidden] { display: none; }
.ncb-checkout__header, .ncb-offer, .ncb-review { padding: clamp(1.25rem, 3vw, 2rem); background: var(--ncb-surface); border: 1px solid var(--ncb-border); border-radius: .5rem; }
.ncb-offer { display: flex; flex-direction: column; gap: 1rem; }
.ncb-offer > * { margin-block: 0; }
.ncb-offer > .ncb-button { align-self: flex-start; }
.ncb-eyebrow { color: var(--ncb-muted); font-weight: 700; }
.ncb-summary { display: grid; gap: .75rem; }
.ncb-summary div { display: grid; grid-template-columns: 7rem 1fr; gap: 1rem; }
.ncb-summary dt { font-weight: 700; }
.ncb-fieldset { margin-block: 2rem; padding: 0; border: 0; }
.ncb-fieldset legend { inline-size: 100%; margin-block-end: 1rem; padding-block-end: .5rem; border-block-end: 2px solid currentColor; font-size: 1.25rem; font-weight: 700; }
.ncb-field { margin-block-end: 1rem; }
.ncb-field label { display: block; margin-block-end: .35rem; font-weight: 700; }
.ncb-field input, .ncb-field select { box-sizing: border-box; inline-size: 100%; min-block-size: 2.75rem; padding: .65rem .75rem; color: var(--ncb-text); background: var(--ncb-surface); border: 2px solid var(--ncb-border); border-radius: .25rem; font: inherit; }
.ncb-field [aria-invalid="true"] { border: 3px solid var(--ncb-error); }
.ncb-hint { margin: 0 0 .35rem; color: var(--ncb-muted); }
.ncb-check { display: grid; grid-template-columns: 1.35rem minmax(0, 1fr); min-block-size: 2.75rem; gap: .75rem; align-items: start; margin-block: 1rem; padding-block: .35rem; }
.ncb-check input { inline-size: 1.35rem; block-size: 1.35rem; margin-block-start: .15rem; }
.ncb-button { display: inline-flex; min-block-size: 2.75rem; align-items: center; justify-content: center; padding: .7rem 1.15rem; color: var(--ncb-primary-text); background: var(--ncb-primary); border: 2px solid var(--ncb-primary); border-radius: .25rem; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.ncb-button--secondary { color: var(--ncb-text); background: var(--ncb-surface); border-color: var(--ncb-text); }
.ncb-button:focus-visible, .ncb-field input:focus-visible, .ncb-field select:focus-visible, .ncb-check input:focus-visible { outline: 3px solid var(--ncb-focus-light); outline-offset: 2px; box-shadow: 0 0 0 5px var(--ncb-focus-dark); }
.ncb-error-summary { margin-block: 1.5rem; padding: 1rem; color: var(--ncb-error); background: var(--ncb-error-surface); border: 3px solid var(--ncb-error); }
.ncb-error-summary a { color: inherit; text-decoration: underline; }
.ncb-field-error { margin-block: .4rem 0; color: var(--ncb-error); font-weight: 700; }
.ncb-admin-notice { padding: .75rem; border: 2px dashed currentColor; }
.ncb-legal { margin-block: .75rem; padding: .75rem; border: 1px solid var(--ncb-border); }
.ncb-legal summary { min-block-size: 2.75rem; font-weight: 700; cursor: pointer; }
.ncb-honeypot { position: absolute !important; inset-inline-start: -10000px !important; inline-size: 1px; block-size: 1px; overflow: hidden; }
.ncb-processing { margin-block: 1.5rem; padding: 1rem; border: 2px solid currentColor; }
.ncb-account__list { display: grid; gap: 1rem; padding: 0; list-style: none; }
.ncb-account__list li { padding: 1rem; border: 1px solid currentColor; }
.ncb-account a { text-decoration: underline; }
@media (forced-colors: active) {
  .ncb-button, [aria-invalid="true"], .ncb-error-summary { border-color: currentColor; }
  .ncb-button:focus-visible, .ncb-field input:focus-visible, .ncb-field select:focus-visible { outline-color: Highlight; box-shadow: none; }
}


/* Error text shares the full checkbox row and must reflow at 320 px. */
.ncb-check .ncb-field-error { grid-column:1 / -1; margin:0; }
.ncb-fieldset, .ncb-field, .ncb-review dd { min-width:0; }
.ncb-check span, .ncb-field-error, .ncb-error-summary, .ncb-review dd { overflow-wrap:anywhere; }
.ncb-checkout *, .ncb-checkout *::before, .ncb-checkout *::after { box-sizing:border-box; }

/* Checkout dimensions must not shrink with Bricks' 10px root font size. */
.ncb-checkout { --ncb-panel: #f3f7f4; --ncb-divider: #d8e2dc; font-size: 16px; line-height: 1.6; }
.ncb-checkout > * { margin-block: 0 28px; }
.ncb-checkout > :last-child { margin-block-end: 0; }
.ncb-checkout .ncb-admin-notice { padding: 16px 20px; border: 1px solid var(--ncb-border); border-inline-start: 4px solid var(--ncb-primary); border-radius: 6px; background: var(--ncb-panel); color: var(--ncb-text); font-size: 14px; }
.ncb-checkout__back .ncb-button { padding: 8px 16px; }
.ncb-checkout .ncb-checkout__header { padding: clamp(24px, 3vw, 40px); border: 1px solid var(--ncb-divider); border-inline-start: 6px solid var(--ncb-primary); border-radius: 10px; background: var(--ncb-panel); }
.ncb-checkout .ncb-eyebrow { margin: 0 0 12px; color: var(--ncb-primary); font-size: 16px; }
.ncb-checkout__header h1 { margin: 0 0 24px; color: var(--ncb-text); font-size: clamp(28px, 3vw, 40px); line-height: 1.2; overflow-wrap: anywhere; }
.ncb-checkout .ncb-summary { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 24px; margin: 0; }
.ncb-checkout .ncb-summary div { display: block; }
.ncb-checkout .ncb-summary dt { margin: 0 0 4px; color: var(--ncb-muted); font-size: 14px; font-weight: 400; }
.ncb-checkout .ncb-summary dd { margin: 0; font-size: 18px; font-weight: 700; }
.ncb-checkout .ncb-required-note { margin: 0 0 36px; color: var(--ncb-muted); font-size: 14px; }
.ncb-checkout .ncb-fieldset { margin: 0 0 40px; padding: 0; min-inline-size: 0; }
.ncb-checkout .ncb-fieldset legend { float: none; padding: 0 0 14px; margin: 0 0 24px; border-block-end: 1px solid var(--ncb-divider); color: var(--ncb-primary); font-size: 22px; line-height: 1.4; font-weight: 700; }
.ncb-fields-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 28px; align-items: end; }
.ncb-checkout .ncb-field { margin: 0; min-inline-size: 0; }
.ncb-checkout .ncb-field label { margin: 0 0 8px; color: var(--ncb-text); font-size: 16px; font-weight: 700; line-height: 1.5; }
.ncb-checkout .ncb-field input, .ncb-checkout .ncb-field select { min-block-size: 50px; padding: 12px 14px; border-width: 1px; border-radius: 6px; font-size: 16px; line-height: 1.5; }
.ncb-checkout .ncb-field [aria-invalid="true"] { border-width: 3px; }
.ncb-checkout .ncb-hint { margin: 0 0 8px; font-size: 14px; line-height: 1.5; }
.ncb-checkout .ncb-legal { margin: 0 0 12px; padding: 14px 18px; border-color: var(--ncb-divider); border-radius: 6px; }
.ncb-checkout .ncb-legal summary { min-block-size: 28px; color: var(--ncb-text); font-size: 16px; line-height: 1.6; }
.ncb-checkout .ncb-legal[open] > div { padding-block-start: 16px; }
.ncb-checkout .ncb-check { grid-template-columns: 22px minmax(0, 1fr); gap: 12px; min-block-size: 44px; margin: 12px 0; padding: 8px 0; color: var(--ncb-text); font-size: 16px; line-height: 1.6; }
.ncb-checkout .ncb-check input { inline-size: 22px; block-size: 22px; margin: 2px 0 0; accent-color: var(--ncb-primary); }
.ncb-form__actions { display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 24px; padding-block-start: 28px; border-block-start: 1px solid var(--ncb-divider); }
.ncb-form__actions > .ncb-field { flex: 0 1 360px; }
.ncb-checkout .ncb-button { min-block-size: 48px; padding: 12px 24px; border-radius: 6px; font-size: 16px; line-height: 1.5; }
.ncb-checkout .ncb-button:disabled { color: var(--ncb-muted); background: var(--ncb-panel); border-color: var(--ncb-border); cursor: not-allowed; }
.ncb-checkout .ncb-review { padding: 28px; }
.ncb-checkout .ncb-review h2 { margin: 0 0 16px; font-size: 26px; }
.ncb-checkout .ncb-review dl { display: grid; grid-template-columns: minmax(100px, 1fr) minmax(0, 3fr); gap: 12px 24px; margin-block: 24px; }
.ncb-checkout .ncb-review dd { margin: 0; }
.ncb-checkout .ncb-review p { margin-block: 0 20px; }
.ncb-preview-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 0; list-style: none; }
.ncb-preview-steps li { padding: 12px; border-block-end: 2px solid var(--ncb-divider); color: var(--ncb-muted); }
.ncb-preview-steps [aria-current="step"] { color: var(--ncb-primary); border-color: var(--ncb-primary); font-weight: 700; }
.ncb-preview-payment-choice { margin-block: 24px; padding: 24px; background: var(--ncb-panel); border: 1px solid var(--ncb-divider); border-radius: 8px; }
.ncb-preview-payment-choice h3 { margin: 0 0 12px; font-size: 22px; }
.ncb-preview-total { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: 20px; }
.ncb-checkout [tabindex="-1"], .ncb-checkout input, .ncb-checkout select { scroll-margin-block: 180px 32px; }
.ncb-checkout .ncb-review .ncb-button { margin: 0 12px 12px 0; }
.ncb-checkout .ncb-error-summary, .ncb-checkout .ncb-processing { padding: 20px; }
.ncb-checkout :is(input, select, summary, button, a):focus-visible { outline: 3px solid var(--ncb-primary); outline-offset: 3px; box-shadow: none; }
@media (min-width: 960px) {
  .ncb-fields-grid--address { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .ncb-fields-grid--address > .ncb-field { grid-column: span 2; }
  .ncb-fields-grid--address > .ncb-field--street { grid-column: span 4; }
}
@media (max-width: 639px) {
  .ncb-preview-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .ncb-checkout .ncb-review { padding: 20px; }
  .ncb-preview-payment-choice { padding: 16px; }
  .ncb-checkout-page { inline-size: calc(100% - 32px); padding-block: 28px 48px; }
  .ncb-fields-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .ncb-checkout .ncb-summary { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .ncb-checkout .ncb-fieldset { margin-block-end: 32px; }
  .ncb-checkout .ncb-fieldset legend { font-size: 20px; }
  .ncb-form__actions { align-items: stretch; flex-direction: column; }
  .ncb-form__actions > .ncb-field { flex-basis: auto; }
  .ncb-checkout .ncb-review dl { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .ncb-checkout .ncb-review dd { margin-block-end: 12px; }
}
@media (forced-colors: active) {
  .ncb-checkout :is(input, select, summary, button, a):focus-visible { outline-color: Highlight; }
}