/* =========================================================
   LEGAL PAGES
   Shared by /privacy and /terms. Deliberately plain: these are
   documents people scan for a specific answer, not marketing pages.
   Wide line-height, a fixed max width for comfortable reading, and
   clear heading hierarchy so the browser's find-in-page and a
   screen reader's heading list both work as navigation.
   ========================================================= */

.legal-page{
    max-width:760px;
    margin:0 auto;
    padding:36px 22px 80px;
}

.legal-page .legal-head{
    padding-bottom:22px;
    border-bottom:1px solid var(--border);
    margin-bottom:30px;
}

.legal-page h1{
    font-size:26px;
    font-weight:800;
    letter-spacing:-.02em;
    margin-bottom:8px;
}

.legal-page .updated{
    font-size:12px;
    color:var(--muted);
}

.legal-page .intro{
    font-size:14px;
    line-height:1.75;
    color:var(--soft);
    margin-top:14px;
}

/* Contents list — these documents are long enough that jumping is
   genuinely useful on a phone. */
.legal-toc{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:11px;
    padding:16px 18px;
    margin-bottom:34px;
}
.legal-toc h2{
    font-size:11px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.06em;
    color:var(--muted);
    margin-bottom:10px;
}
.legal-toc ol{margin:0;padding-left:19px}
.legal-toc li{margin-bottom:5px}
.legal-toc a{
    font-size:13px;
    color:var(--text);
    text-decoration:none;
}
.legal-toc a:hover{color:var(--accent);text-decoration:underline}

.legal-page section{margin-bottom:34px;scroll-margin-top:20px}

.legal-page h2{
    font-size:16px;
    font-weight:700;
    letter-spacing:-.01em;
    margin-bottom:12px;
}

.legal-page h3{
    font-size:13px;
    font-weight:700;
    margin:20px 0 8px;
}

.legal-page p{
    font-size:14px;
    line-height:1.75;
    color:var(--soft);
    margin-bottom:13px;
}

.legal-page ul{
    margin:0 0 15px;
    padding-left:20px;
}
.legal-page li{
    font-size:14px;
    line-height:1.75;
    color:var(--soft);
    margin-bottom:7px;
}

.legal-page strong{color:var(--text);font-weight:600}

.legal-page a{color:var(--accent);font-weight:500}

/* Callout for the things people most need to notice — used sparingly,
   or it stops meaning anything. */
.legal-note{
    background:var(--surface);
    border:1px solid var(--border);
    border-left:3px solid var(--accent);
    border-radius:9px;
    padding:15px 17px;
    margin:18px 0;
}
.legal-note p{margin:0;font-size:13px}
.legal-note p + p{margin-top:9px}

.legal-page table{
    width:100%;
    border-collapse:collapse;
    margin:14px 0 18px;
    font-size:13px;
}
.legal-page th,
.legal-page td{
    text-align:left;
    padding:9px 11px;
    border-bottom:1px solid var(--border);
    line-height:1.6;
}
.legal-page th{
    font-weight:700;
    color:var(--text);
    font-size:12px;
}
.legal-page td{color:var(--soft)}

.legal-contact{
    margin-top:44px;
    padding-top:24px;
    border-top:1px solid var(--border);
}

@media (max-width:640px){
    .legal-page{padding:26px 18px 60px}
    .legal-page h1{font-size:22px}
    .legal-page table{font-size:12px}
    .legal-page th,.legal-page td{padding:8px 8px}
}