/* Static payment instructions. Bank authentication and payment entry stay off-site. */
.payment-page { padding: 30px 0 80px; background: var(--surface); }
.payment-page .breadcrumbs { margin-bottom: 30px; flex-wrap: wrap; }
.payment-heading { max-width: 720px; margin-bottom: 32px; }
.payment-kicker { color: var(--link); font-size: .75rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.payment-heading h1 { margin: 12px 0 16px; font-size: clamp(2.25rem, 4vw, 3.5rem); line-height: 1.12; letter-spacing: -.035em; }
.payment-heading > p { color: var(--muted); font-size: 1.05rem; }
.payment-page p { line-height: 1.65; }
.payment-page h2 { font-size: clamp(1.4rem, 2.2vw, 1.85rem); line-height: 1.3; letter-spacing: -.02em; }
.payment-page h3 { font-size: 1.125rem; line-height: 1.4; }
.payment-main-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.payment-card, .payment-help { min-width: 0; padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: #fff; }
.payment-card--online { border-color: #f1caab; }
.payment-icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 20px; border-radius: 14px; background: var(--orange-soft); color: var(--link); }
.payment-card__eyebrow { margin-bottom: 8px; font-size: .8125rem; color: var(--link); font-weight: 600; }
.payment-card h2, .payment-help h2 { margin-bottom: 14px; }
.payment-card > p { color: var(--muted); margin-bottom: 20px; }
.payment-unavailable { padding: 20px; background: var(--surface); border-radius: 14px; }
.payment-unavailable p { margin: 10px 0 18px; font-size: .875rem; }
.payment-unavailable .button { max-width: 100%; white-space: normal; text-align: center; }
.payment-help { display: grid; justify-items: start; gap: 14px; }
.payment-help .payment-icon, .payment-help h2, .payment-help p { margin: 0; }
.payment-help__phone { color: var(--link); font-size: clamp(1rem, 2vw, 1.35rem); font-weight: 600; }
.payment-small { font-size: .8125rem; color: var(--muted); line-height: 1.6; }
.payment-section { margin-top: 46px; }
.payment-section > h2 { margin-bottom: 14px; }
.payment-section > p { max-width: 780px; margin-bottom: 24px; color: var(--muted); }
.payment-bank-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.payment-bank { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.payment-bank .payment-icon, .payment-bank p { margin: 0; }
.payment-bank .button { margin-top: auto; max-width: 100%; white-space: normal; text-align: center; }
.payment-details-list { display: grid; gap: 12px; }
.payment-details { background: #fff; border: 1px solid var(--line); border-radius: 16px; }
.payment-details summary { position: relative; padding: 22px 56px 22px 24px; cursor: pointer; list-style: none; font-weight: 600; line-height: 1.45; }
.payment-details summary::-webkit-details-marker { display: none; }
.payment-details summary::after { content: "+"; position: absolute; right: 24px; top: 21px; color: var(--link); font-size: 1.4rem; line-height: 1; }
.payment-details[open] summary::after { content: "−"; }
.payment-details summary:hover { color: var(--link); }
.payment-details summary:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; border-radius: 14px; }
.payment-details > div { padding: 0 24px 24px; }
.payment-details p + p { margin-top: 12px; }
.payment-warning { padding: 16px 18px; margin-bottom: 20px; background: var(--orange-soft); border-radius: 12px; font-size: .875rem; }
.payment-terminal-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-bottom: 20px; }
.payment-terminal-grid article { min-width: 0; padding: 18px; border: 1px solid var(--line); border-radius: 12px; }
.payment-terminal-grid dl > div { margin: 16px 0; }
.payment-terminal-grid dt { font-size: .875rem; color: var(--muted); }
.payment-terminal-grid dd { margin: 5px 0 0; font-size: .875rem; }
.payment-refund { margin-top: 32px; padding: 28px; border: 1px solid #f1caab; border-radius: 20px; background: #fff8f1; }
.payment-refund p { margin: 14px 0; }
.payment-source-note { padding-top: 24px; margin-top: 36px; border-top: 1px solid var(--line); font-size: .8rem; color: var(--muted); }
@media (max-width: 900px) { .payment-main-grid { grid-template-columns: 1fr; } .payment-terminal-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .payment-bank-grid { grid-template-columns: 1fr; } .payment-card, .payment-help, .payment-refund { padding: 22px; } .payment-unavailable { padding: 16px; } .payment-details summary { padding-left: 20px; } .payment-details > div { padding: 0 20px 20px; } }