:root {
    --legal-ink: #24343a;
    --legal-muted: #60747b;
    --legal-brand: #123f4a;
    --legal-line: #dce5e8;
    --legal-soft: #f3f7f8;
}

* { box-sizing: border-box; }

.legal-page {
    width: min(920px, calc(100% - 32px));
    margin: 32px auto 48px;
    color: var(--legal-ink);
    font: 16px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

.legal-page h1, .legal-page h2, .legal-page h3 { color: var(--legal-brand); line-height: 1.25; }
.legal-page h1 { margin: 0 0 12px; font-size: clamp(2rem, 5vw, 2.7rem); letter-spacing: -.03em; }
.legal-page h2 { margin: 34px 0 10px; font-size: 1.4rem; }
.legal-page h3 { margin: 22px 0 8px; font-size: 1.08rem; }
.legal-page p, .legal-page ul { margin: 10px 0; }
.legal-page li + li { margin-top: 6px; }
.legal-page a { color: #17627a; text-underline-offset: 3px; overflow-wrap: anywhere; }
.legal-page .legal-eyebrow { margin: 0 0 8px; color: var(--legal-muted); font-size: .8rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.legal-page .legal-updated { color: var(--legal-muted); font-size: .9rem; }
.legal-page .legal-notice { margin: 22px 0; padding: 16px 18px; border: 1px solid #e9c77b; border-radius: 12px; background: #fff9e9; color: #553d0d; }
.legal-page .legal-notice strong { display: block; margin-bottom: 4px; }
.legal-page .legal-card { margin: 16px 0; padding: 16px 18px; border: 1px solid var(--legal-line); border-radius: 12px; background: var(--legal-soft); }
.legal-page .legal-table-wrap { width: 100%; overflow-x: auto; margin: 14px 0; border: 1px solid var(--legal-line); border-radius: 10px; }
.legal-page table { width: 100%; border-collapse: collapse; min-width: 650px; }
.legal-page th, .legal-page td { padding: 11px 12px; border-bottom: 1px solid var(--legal-line); text-align: left; vertical-align: top; }
.legal-page th { background: var(--legal-soft); color: var(--legal-brand); font-size: .9rem; }
.legal-page tr:last-child td { border-bottom: 0; }
.legal-page .legal-pending { font-weight: 700; }

@media (max-width: 600px) {
    .legal-page { width: min(100% - 24px, 920px); margin: 22px auto 34px; font-size: 15px; }
    .legal-page h2 { margin-top: 28px; font-size: 1.25rem; }
    .legal-page .legal-notice, .legal-page .legal-card { padding: 13px 14px; }
    .legal-page th, .legal-page td { padding: 9px; }
}
