/* 5단계 돈 — 구독 · 응원 · 결제 결과 */
.pay { padding: 48px var(--gutter) 96px; display: grid; gap: 24px; max-width: 960px; }
.pay--narrow { max-width: 640px; }
.pay__hero { display: grid; gap: 8px; text-align: center; justify-items: center; }
.pay__hero p { margin: 0; }
.pay__region { display: flex; gap: 4px; justify-content: center; }
.pay__region a { padding: 6px 14px; border: 1px solid var(--border-default); border-radius: 999px; font-size: var(--fs-ui); }
.pay__region a[aria-current] { background: var(--brand-navy); color: var(--text-on-dark); border-color: var(--brand-navy); }
.pay__region a:hover { text-decoration: none; }
.pay__form { display: grid; gap: 20px; }
.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; border: 0; padding: 0; margin: 0; }
.plan-card { position: relative; cursor: pointer; }
.plan-card input { position: absolute; opacity: 0; }
.plan-card__body { display: grid; gap: 6px; padding: 24px; border: 1px solid var(--border-strong); border-radius: var(--radius); height: 100%; }
.plan-card input:checked + .plan-card__body { border-color: var(--brand-navy); box-shadow: 0 0 0 2px var(--brand-navy); }
.plan-card input:focus-visible + .plan-card__body { outline: 2px solid var(--brand-gold); outline-offset: 2px; }
.plan-card__price { font-size: 32px; font-weight: 700; font-variant-numeric: tabular-nums; }
.methods { display: grid; gap: 8px; }
.method { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border: 1px solid var(--border-default); border-radius: var(--radius); cursor: pointer; }
.method:has(input:checked) { border-color: var(--brand-navy); }
.method.is-off { opacity: .55; cursor: not-allowed; }
.method small { color: var(--text-secondary); margin-left: 6px; }
.pay__faq { display: grid; gap: 8px; border-top: 1px solid var(--border-default); padding-top: 24px; }
.pay__faq details { border-bottom: 1px solid var(--border-default); padding: 12px 0; }
.pay__faq summary { cursor: pointer; font-weight: 700; }
.pay__faq p { margin: 8px 0 0; color: var(--text-secondary); }
.test-pg { display: grid; gap: 12px; justify-items: center; text-align: center; padding: 40px; border: 2px dashed var(--brand-gold); border-radius: var(--radius); }
.test-pg__btns { display: grid; gap: 8px; width: 100%; max-width: 360px; }
.done { display: grid; gap: 8px; justify-items: center; text-align: center; padding: 40px 0; }
.done p { margin: 0; }
.done__icon { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; font-size: 32px; font-weight: 700; background: var(--state-danger-soft); color: var(--state-danger); }
.done.is-ok .done__icon { background: var(--state-success-soft); color: var(--state-success); }
.done__btns { display: flex; gap: 8px; margin-top: 16px; }
/* 마이페이지 구독 탭 */
.billing { display: grid; gap: 16px; }
.billing .box { gap: 10px; }
.billing form.inline-form { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.pay__resume{margin:-8px 0 24px;display:flex;flex-wrap:wrap;gap:12px;align-items:center}.pay__resume p{margin:0;flex:1 1 280px}