/* =============================================
   LEGAL PAGES — Terms, Privacy, Cookies
   Minimal, rule-divided layout (no boxes)
   ============================================= */

:root {
    --lg-bg: #ffffff;
    --lg-text: #1a1f2e;
    --lg-muted: #616a7d;
    --lg-faint: #8b93a5;
    --lg-rule: #e6e9f0;
    --lg-rule-soft: #f0f2f7;
    --lg-blue: #4B96CF;
    --lg-purple: #7B65D4;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body.legal-body {
    font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: var(--lg-bg);
    color: var(--lg-text);
    line-height: 1.72;
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* ── Header ─────────────────────────────── */
.lg-header {
    border-bottom: 1px solid var(--lg-rule);
    background: var(--lg-bg);
    position: sticky;
    top: 0;
    z-index: 20;
}
.lg-header-inner {
    max-width: 1160px;
    margin: 0 auto;
    padding: 18px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.lg-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--lg-text);
}
.lg-logo img { width: 30px; height: 30px; border-radius: 8px; display: block; }
.lg-logo span {
    font-family: 'Space Grotesk', sans-serif;
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: -0.01em;
}

/* ── Page shell ─────────────────────────── */
.lg-wrap {
    max-width: 1160px;
    margin: 0 auto;
    padding: 72px 32px 120px;
}

/* ── Title block ────────────────────────── */
.lg-eyebrow {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lg-faint);
    margin-bottom: 14px;
}
.lg-wrap h1 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: clamp(2.1rem, 4.5vw, 3rem);
    font-weight: 600;
    letter-spacing: -0.025em;
    line-height: 1.1;
    margin-bottom: 16px;
    max-width: 760px;
}
.lg-updated {
    font-size: 0.88rem;
    color: var(--lg-faint);
    margin-bottom: 28px;
}
.lg-intro {
    font-size: 1.08rem;
    line-height: 1.68;
    color: var(--lg-muted);
    max-width: 720px;
    padding-bottom: 40px;
    border-bottom: 1px solid var(--lg-rule);
    margin-bottom: 0;
}
.lg-intro strong { color: var(--lg-text); font-weight: 600; }
.lg-intro p + p { margin-top: 12px; }

/* ── Two-column layout ──────────────────── */
.lg-layout {
    display: flex;
    gap: 80px;
    align-items: flex-start;
}
.lg-content {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 720px;
}

/* ── Contents (sticky, no box, no scrollbar) ── */
.lg-toc {
    flex: 0 0 236px;
    width: 236px;
    position: sticky;
    top: 96px;
    padding-top: 44px;
}
.lg-toc-title {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--lg-faint);
    padding-bottom: 12px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--lg-rule);
}
.lg-toc ol {
    list-style: none;
    counter-reset: toc;
}
.lg-toc li { counter-increment: toc; }
.lg-toc a {
    display: flex;
    gap: 10px;
    padding: 6px 0;
    font-size: 0.855rem;
    line-height: 1.45;
    color: var(--lg-muted);
    text-decoration: none;
    transition: color 0.15s ease;
}
.lg-toc a::before {
    content: counter(toc);
    flex: 0 0 16px;
    color: var(--lg-faint);
    font-variant-numeric: tabular-nums;
}
.lg-toc a:hover { color: var(--lg-blue); }
.lg-toc a:hover::before { color: var(--lg-blue); }

/* ── Sections divided by rules ──────────── */
.lg-content section {
    padding: 44px 0;
    border-bottom: 1px solid var(--lg-rule);
    scroll-margin-top: 92px;
}
.lg-content section:first-child { padding-top: 44px; }
.lg-content section:last-child { border-bottom: none; }

.lg-content h2 {
    font-family: 'Space Grotesk', sans-serif;
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: -0.018em;
    line-height: 1.3;
    margin-bottom: 18px;
}
.lg-content h3 {
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: -0.005em;
    margin: 28px 0 10px;
}
.lg-content p { margin-bottom: 16px; color: #333a4a; }
.lg-content p:last-child { margin-bottom: 0; }
.lg-content ul, .lg-content ol { margin: 0 0 16px 20px; }
.lg-content li { margin-bottom: 9px; color: #333a4a; padding-left: 4px; }
.lg-content li:last-child { margin-bottom: 0; }
.lg-content a { color: var(--lg-blue); text-decoration: none; border-bottom: 1px solid rgba(75,150,207,0.3); }
.lg-content a:hover { border-bottom-color: var(--lg-blue); }
.lg-content strong { font-weight: 600; color: var(--lg-text); }
.lg-content code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 0.85em;
    color: var(--lg-purple);
    word-break: break-word;
}

/* ── Tables: horizontal rules only ──────── */
.lg-table-wrap { overflow-x: auto; margin: 4px 0 20px; }
.lg-table {
    width: 100%;
    min-width: 540px;
    border-collapse: collapse;
    font-size: 0.9rem;
}
.lg-table th {
    text-align: left;
    font-weight: 600;
    font-size: 0.78rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--lg-faint);
    padding: 0 20px 10px 0;
    border-bottom: 1px solid var(--lg-rule);
    white-space: nowrap;
}
.lg-table th:last-child, .lg-table td:last-child { padding-right: 0; }
.lg-table td {
    padding: 14px 20px 14px 0;
    border-bottom: 1px solid var(--lg-rule-soft);
    vertical-align: top;
    line-height: 1.6;
    color: #333a4a;
}
.lg-table tr:last-child td { border-bottom: none; }

/* ── Callout: a rule, not a box ─────────── */
.lg-note {
    border-left: 2px solid var(--lg-purple);
    padding: 2px 0 2px 20px;
    margin: 22px 0;
    font-size: 0.94rem;
    color: var(--lg-muted);
}
.lg-note p:last-child { margin-bottom: 0; }

/* ── Click-to-copy email ────────────────── */
.lg-email {
    color: var(--lg-blue);
    border-bottom: 1px solid rgba(75,150,207,0.3);
    cursor: pointer;
    position: relative;
    white-space: nowrap;
}
.lg-email:hover { border-bottom-color: var(--lg-blue); }
.lg-email.copied::after {
    content: 'Copied';
    position: absolute;
    left: 50%;
    bottom: calc(100% + 7px);
    transform: translateX(-50%);
    background: var(--lg-text);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    padding: 4px 9px;
    border-radius: 5px;
    white-space: nowrap;
    pointer-events: none;
}

/* ── Footer ─────────────────────────────── */
.lg-footer {
    border-top: 1px solid var(--lg-rule);
    padding: 32px;
    font-size: 0.85rem;
    color: var(--lg-faint);
}
.lg-footer-inner {
    max-width: 1160px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.lg-footer a { color: var(--lg-muted); text-decoration: none; margin-left: 24px; }
.lg-footer a:first-child { margin-left: 0; }
.lg-footer a:hover { color: var(--lg-text); }

/* ── Tablet / mobile ────────────────────── */
@media (max-width: 980px) {
    .lg-wrap { padding: 48px 24px 90px; }
    .lg-layout { flex-direction: column; gap: 0; }
    .lg-content { max-width: 100%; }
    .lg-toc {
        position: static;
        width: 100%;
        flex-basis: auto;
        padding-top: 36px;
    }
    .lg-toc ol { columns: 2; column-gap: 40px; }
    .lg-toc li { break-inside: avoid; }
    .lg-content section:first-child { border-top: 1px solid var(--lg-rule); margin-top: 36px; }
}

@media (max-width: 640px) {
    body.legal-body { font-size: 15.5px; }
    .lg-wrap { padding: 36px 20px 72px; }
    .lg-header-inner { padding: 14px 20px; }
    .lg-toc ol { columns: 1; }
    .lg-footer { padding: 24px 20px; }
    .lg-footer-inner { flex-direction: column; align-items: flex-start; gap: 10px; }
    .lg-footer a { margin-left: 0; margin-right: 20px; }
}