/* ─────────────────────────────────────────────────────────────
   Gleegleam — legal & document pages (privacy, terms, child safety,
   account/data deletion). Loaded after site.css; uses its tokens.
   ───────────────────────────────────────────────────────────── */

.doc-page {
    /* Legacy token names still referenced by inline style="" attributes in the policy bodies */
    --primary: var(--ink);
    --text-dark: var(--ink);
    --text-light: var(--ink-soft);
}

.doc-page .notebook-bg {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    --margin-x: 60px;
    --rule-gap: 28px;
    --rule-y: 80px;
}

.page-wrapper {
    max-width: 760px;
    margin: 0 auto;
    padding: calc(var(--nav-h) + 72px) 24px 80px;
}

.page-wrapper h1 {
    font-family: var(--display);
    font-weight: normal;
    font-size: clamp(40px, 7vw, 56px);
    line-height: 1.05;
    margin-bottom: 12px;
}

.privacy-effective,
.tos-effective,
.page-subtitle {
    color: var(--ink-soft);
    font-size: 14px;
    margin-bottom: 48px;
}
.page-subtitle { font-size: 15px; }

.privacy-section,
.tos-section { margin-bottom: 36px; }

.privacy-section h2,
.tos-section h2 {
    font-family: var(--hand);
    font-weight: normal;
    font-size: 22px;
    margin-bottom: 10px;
}

.privacy-section p,
.tos-section p,
.privacy-section li,
.tos-section li {
    font-size: 15px;
    color: var(--ink-soft);
    line-height: 1.75;
    margin-bottom: 10px;
}

.privacy-section ol { margin-top: 10px; padding-left: 20px; }

.privacy-section ul,
.tos-section ul { list-style: none; margin-top: 10px; padding-left: 0; }

.privacy-section ul li,
.tos-section ul li { position: relative; padding-left: 18px; margin-bottom: 14px; }

.privacy-section ul li::before,
.tos-section ul li::before {
    content: '•';
    color: var(--ink);
    font-weight: 700;
    position: absolute;
    left: 0;
    top: 0;
}

.privacy-section ul li strong,
.tos-section ul li strong {
    display: block;
    color: var(--ink);
    font-weight: 600;
    margin-bottom: 2px;
}

.page-wrapper a { color: var(--ink); }

/* Callouts on the deletion pages */
.callout,
.note {
    border: 1.5px solid var(--ink);
    border-radius: 14px;
    padding: 16px 20px;
    margin: 8px 0 10px;
}
.callout { background: #FDECEC; }
.note { background: var(--paper-white); }
.callout p,
.note p { color: var(--ink); margin-bottom: 0; font-size: 14px; }

.page-wrapper .cta {
    display: inline-block;
    margin-top: 6px;
    padding: 13px 22px;
    background: var(--ink);
    color: var(--paper);
    border-radius: 999px;
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
    box-shadow: 0 4px 0 #000;
}
