/* 정책 문서 지면(policy-doc) — 조항 본문의 글꼴·목록·표는 support-prose.css의 .sc-md가 갖고, 여기는 지면 골격과 규모만 덮어쓴다. */

.policy-doc { padding: 56px 0 96px; background: var(--bg-section-muted); }
.policy-doc__inner {
    display: grid;
    grid-template-columns: 220px minmax(0, 1fr);
    grid-template-areas: "toc head" "toc body";
    gap: 28px 40px;
    max-width: 1080px;
}

.policy-doc__head { grid-area: head; display: flex; flex-direction: column; gap: 10px; }
.policy-doc__eyebrow { margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .04em; color: var(--primary); }
.policy-doc__title { margin: 0; font-size: 32px; font-weight: 800; line-height: 1.25; letter-spacing: -0.01em; color: var(--text-main); }
.policy-doc__lead { display: flex; flex-direction: column; gap: 4px; font-size: 15px; line-height: 1.75; color: var(--text-sub); }
.policy-doc__lead p { margin: 0; }

.policy-doc__toc { grid-area: toc; align-self: start; position: sticky; top: calc(var(--header-h) + 24px); display: flex; flex-direction: column; gap: 10px; max-height: calc(100vh - var(--header-h) - 48px); }
.policy-doc__toc-label { font-size: 12px; font-weight: 800; letter-spacing: .04em; color: var(--text-muted); }
.policy-doc__toc-heading { margin: 0; padding: 0 10px; }
.policy-doc__toc-toggle { display: none; }
.policy-doc__toc-list { display: flex; flex-direction: column; gap: 2px; min-height: 0; margin: 0; padding: 0; overflow-y: auto; }
.policy-doc__toc-list a { display: flex; gap: 8px; padding: 7px 10px; border-radius: var(--radius-md); font-size: 13.5px; line-height: 1.45; color: var(--text-sub); transition: background-color 140ms ease, color 140ms ease; }
.policy-doc__toc-list a span { flex: none; font-weight: 700; color: var(--text-muted); }
.policy-doc__toc-list a:hover, .policy-doc__toc-list a:focus-visible { background: #fff; color: var(--primary); }
.policy-doc__toc-list a.is-active { background: #fff; font-weight: 700; color: var(--primary); }
.policy-doc__toc-list a.is-active span { color: var(--primary); }

.policy-doc__body {
    grid-area: body;
    display: flex;
    flex-direction: column;
    gap: 36px;
    padding: 44px 48px 48px;
    border: 1px solid var(--gray-200);
    border-radius: var(--radius-xl);
    background: #fff;
    box-shadow: var(--shadow-card);
    font-size: 15px;
}
.policy-doc__article + .policy-doc__article { padding-top: 36px; border-top: 1px solid var(--gray-200); }
.policy-doc__article > :last-child { margin-bottom: 0; }
.policy-doc__body h2 { margin: 0 0 14px; font-size: 19px; }
.policy-doc__body h3 { margin: 22px 0 6px; font-size: 15.5px; }

/* 조 → 항(ol) → 호(ul): .sc-md의 "ol li = decimal"이 안쪽 ul까지 덮으므로 호 표지를 여기서 되돌린다 */
.policy-doc__body li > ul { margin: 6px 0 4px 18px; }
.policy-doc__body li > ul > li { list-style: circle; }

.policy-doc__body table { word-break: keep-all; }

.policy-doc__tiers { max-width: 520px; }
.policy-doc__tiers th small { display: block; font-size: 12px; font-weight: 600; color: var(--text-desc); }
.policy-doc__tiers th:last-child, .policy-doc__tiers td:last-child { width: 40%; text-align: right; font-variant-numeric: tabular-nums; }
.policy-doc__tiers td:last-child { font-weight: 700; color: var(--text-main); }

.policy-doc__formula { width: fit-content; padding: 8px 14px; border-radius: var(--radius-md); background: rgba(var(--primary-rgb), .06); font-weight: 700; color: var(--text-main); }

.policy-doc__contact { display: flex; flex-direction: column; gap: 10px; padding: 20px 24px; border-radius: var(--radius-lg); background: var(--gray-50); }
.policy-doc__contact p { margin: 0; }
.policy-doc__contact dl { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.policy-doc__contact dl div { display: flex; gap: 12px; }
.policy-doc__contact dt { flex: none; width: 64px; font-weight: 700; color: var(--text-main); }
.policy-doc__contact dd { margin: 0; }
.policy-doc__contact dd a { color: inherit; text-decoration: none; }

@media (max-width: 1024px) {
    .policy-doc__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "toc" "body"; }
    /* 폰·태블릿 목차 = 헤더 아래 붙는 막대 + 펼치는 목록. 막대 높이만큼 조항 앵커를 더 내린다(헤더 몫은 scroll-padding-top). */
    .policy-doc__toc { top: var(--header-h); z-index: 5; max-height: none; }
    .policy-doc__toc-heading { display: none; }
    .policy-doc__toc-toggle { display: flex; align-items: center; gap: 10px; width: 100%; height: 48px; padding: 0 16px; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow-card); font-size: 14px; font-weight: 700; color: var(--text-main); text-align: left; }
    .policy-doc__toc-current { flex: 1; display: flex; gap: 6px; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
    .policy-doc__toc-current span { flex: none; color: var(--primary); }
    .policy-doc__toc-toggle i { font-size: 12px; color: var(--text-muted); transition: transform 160ms ease; }
    .policy-doc__toc.is-open .policy-doc__toc-toggle i { transform: rotate(180deg); }
    .policy-doc__toc-list { display: none; position: absolute; top: calc(100% + 6px); left: 0; right: 0; max-height: 60vh; padding: 8px; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow-card); }
    .policy-doc__toc.is-open .policy-doc__toc-list { display: flex; }
    .policy-doc__toc-list a:hover, .policy-doc__toc-list a:focus-visible, .policy-doc__toc-list a.is-active { background: var(--gray-50); }
    .policy-doc__article { scroll-margin-top: 60px; }
}
@media (max-width: 640px) {
    .policy-doc { padding: 32px 0 64px; }
    .policy-doc__inner { gap: 20px; }
    .policy-doc__title { font-size: 26px; }
    .policy-doc__body { gap: 28px; padding: 24px 20px 28px; font-size: 14.5px; }
    .policy-doc__article + .policy-doc__article { padding-top: 28px; }
    .policy-doc__tiers { max-width: none; }
    .policy-doc__contact { padding: 16px 18px; }
}

/* 가입 모달 탭(embedded) — 모바일 지면 규칙보다 뒤에 둬야 덮는다 */
.policy-doc--embedded { padding: 0; background: none; }
.policy-doc--embedded .policy-doc__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "body"; gap: 20px; }
.policy-doc--embedded .policy-doc__body { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 14px; }
.policy-doc--embedded .policy-doc__lead { font-size: 14px; }
