/* ============================================================
   FEATHERWORK INVOICING — LEGAL DOCUMENT PAGES (Terms, Privacy)
   Loaded alongside base.css + home.css: reuses the shared header,
   footer, .container, and design tokens from those files. Prose
   typography here is intentionally the same shape as
   guide-article.css's .guide-article__body — same kind of
   long-form reading content — kept as its own stylesheet since
   this site's convention is one CSS file per page.
   ============================================================ */

.legal-doc { padding-block: var(--space-12) var(--space-16); }
.legal-doc__container {
    max-width: 700px;
    margin-inline: auto;
}

.legal-doc__head { margin-bottom: var(--space-8); }
.legal-doc__head h1 {
    font-size: clamp(1.7rem, 4vw, 2.35rem);
    font-weight: 700;
    line-height: 1.2;
}
.legal-doc__effective-date {
    margin-top: var(--space-3);
    font-size: var(--text-sm);
    color: var(--color-text-tertiary);
}

.legal-doc__body {
    font-size: var(--text-base);
    line-height: var(--leading-loose);
    color: var(--color-text-secondary);
}

.legal-doc__body h2 {
    font-size: var(--text-xl);
    font-weight: 700;
    color: var(--color-text-primary);
    margin-top: var(--space-10);
    margin-bottom: var(--space-4);
}
.legal-doc__body h2:first-child { margin-top: 0; }

.legal-doc__body p { margin: 0 0 var(--space-5); }

.legal-doc__body ul,
.legal-doc__body ol {
    margin: 0 0 var(--space-5);
    padding-left: 1.3em;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}
.legal-doc__body li { padding-left: 0.2em; }
.legal-doc__body li strong { color: var(--color-text-primary); }

.legal-doc__body a {
    color: var(--color-accent);
    font-weight: 600;
    border-bottom: 1px solid var(--color-accent);
}
.legal-doc__body a:hover { color: var(--color-accent-hover); border-color: var(--color-accent-hover); }

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

.legal-doc__body hr {
    border: none;
    border-top: 1px solid var(--color-border);
    margin: var(--space-8) 0;
}