/* Legal document pages — readability layer over site.css tokens.
   Works in both themes (uses CSS vars only). */

/* The marketing pages center-align text globally (site.css centers .container
   and h1-h4 explicitly); legal text must be left-aligned for readability, so
   the headings need explicit overrides, not just inheritance. */
.legal-page-section { padding: 7rem 0 5rem !important; } /* clear the fixed nav */
.legal-wrap, .legal-switcher,
.legal-doc h1, .legal-doc h2, .legal-doc h3, .legal-doc h4 {
    text-align: left;
}
.legal-wrap {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 3rem;
    max-width: 1100px;
    margin: 0 auto;
}

/* ---- Table of contents ---- */
.legal-toc {
    position: sticky;
    top: 6rem;
    align-self: start;
    font-size: .85rem;
    max-height: calc(100vh - 8rem);
    overflow-y: auto;
    /* Content still scrolls by wheel/touch; the bar itself is visual noise. */
    scrollbar-width: none;
}
.legal-toc::-webkit-scrollbar { display: none; }
.legal-toc-title {
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--text-muted);
    margin: 0 0 .75rem;
}
.legal-toc ol {
    list-style: none;
    margin: 0;
    padding: 0;
    border-left: 1px solid var(--border-color);
}
.legal-toc li a {
    display: block;
    padding: .3rem 0 .3rem .9rem;
    margin-left: -1px;
    color: var(--text-muted);
    text-decoration: none;
    border-left: 2px solid transparent;
    line-height: 1.4;
}
.legal-toc li a:hover { color: inherit; }
.legal-toc li a.active {
    color: var(--primary);
    border-left-color: var(--primary);
    font-weight: 600;
}

/* ---- Document switcher (pill nav) ---- */
.legal-switcher {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: 2.5rem;
}
.legal-switcher a {
    display: inline-block;
    padding: .35rem .85rem;
    border: 1px solid var(--border-color);
    border-radius: 999px;
    font-size: .8rem;
    color: var(--text-muted);
    text-decoration: none;
    white-space: nowrap;
}
.legal-switcher a:hover { border-color: var(--primary); color: inherit; }
.legal-switcher a.current {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
    font-weight: 600;
}

/* ---- Article typography ---- */
.legal-doc {
    max-width: 72ch;
    line-height: 1.75;
}
.legal-doc h1 {
    font-size: 2.1rem;
    font-weight: 800;
    letter-spacing: -.02em;
    margin: 0 0 .35rem;
}
.legal-updated {
    display: inline-block;
    font-size: .8rem;
    color: var(--text-muted);
    border: 1px solid var(--border-color);
    border-radius: 999px;
    padding: .2rem .8rem;
    margin: 0 0 2.25rem;
}
.legal-doc h2 {
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -.01em;
    margin: 2.75rem 0 1rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--border-color);
    scroll-margin-top: 6rem;
    position: relative;
}
.legal-doc h2:first-of-type { border-top: 0; padding-top: 0; }
.legal-doc h2 .anchor {
    position: absolute;
    left: -1.1em;
    opacity: 0;
    color: var(--text-muted);
    text-decoration: none;
    font-weight: 400;
}
.legal-doc h2:hover .anchor { opacity: 1; }
.legal-doc h3 {
    font-size: 1rem;
    font-weight: 700;
    margin: 1.75rem 0 .5rem;
}
.legal-doc p { margin: 0 0 1rem; }
.legal-doc ul { list-style: disc; }
.legal-doc ol { list-style: decimal; }
.legal-doc ul, .legal-doc ol { margin: 0 0 1.25rem; padding-left: 1.4rem; }
.legal-doc li { margin-bottom: .55rem; }
.legal-doc li::marker { color: var(--primary); }
.legal-doc a { color: var(--primary); }
.legal-doc strong { font-weight: 700; }
.legal-doc code {
    font-family: 'JetBrains Mono', monospace;
    font-size: .85em;
    background: var(--bg-surface-hover);
    border: 1px solid var(--border-color);
    border-radius: 4px;
    padding: .1em .4em;
}

/* ---- Key-clause callout ---- */
.legal-callout {
    border: 1px solid var(--border-color);
    border-left: 4px solid var(--primary);
    border-radius: 8px;
    background: var(--bg-surface-hover);
    padding: 1rem 1.25rem;
    margin: 0 0 1.25rem;
}
.legal-callout p:last-child { margin-bottom: 0; }

/* ---- Tables ---- */
.legal-doc .table-scroll { overflow-x: auto; margin: 0 0 1.25rem; }
.legal-doc table {
    width: 100%;
    border-collapse: collapse;
    font-size: .88rem;
    line-height: 1.5;
}
.legal-doc th {
    text-align: left;
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--text-muted);
    border-bottom: 2px solid var(--border-color);
    padding: .5rem .75rem .5rem 0;
}
.legal-doc td {
    vertical-align: top;
    border-bottom: 1px solid var(--border-color);
    padding: .6rem .75rem .6rem 0;
}

/* ---- Responsive ---- */
@media (max-width: 900px) {
    .legal-wrap { display: block; }
    .legal-toc {
        position: static;
        max-height: none;
        margin-bottom: 2rem;
        border: 1px solid var(--border-color);
        border-radius: 8px;
        padding: 1rem 1.25rem;
    }
    .legal-toc ol { border-left: 0; }
    .legal-toc li a { padding-left: 0; border-left: 0; }
}

/* ---- Print ---- */
@media print {
    nav, .legal-toc, .legal-switcher, footer, #cookieBanner { display: none !important; }
    .legal-wrap { display: block; max-width: none; }
    .legal-doc { max-width: none; color: #000; }
    .legal-doc a { color: #000; text-decoration: none; }
    .legal-doc h2 { break-after: avoid; }
}
