/* Purpose: Legal / policy pages (Figma 113:802 "Disclaimer") — centered 980px prose column
   on #fafaf6. First heading is the lead intro (24px); the rest are section headings (20px).
   Mobile-first. */

.legal { background: #fafaf6; padding: 48px 0; }
.legal-content { max-width: 980px; margin-inline: auto; }

/* Section headings (Cormorant, navy). */
.legal-content h2,
.legal-content h3 {
    font-family: var(--font-display);
    font-weight: var(--weight-regular);
    font-size: 20px;
    line-height: 28px;
    color: var(--color-primary);
    text-transform: capitalize;
    margin: 44px 0 16px;
}

/* Lead intro = the first heading (larger). */
.legal-content > h2:first-child,
.legal-content > h3:first-child {
    font-size: 24px;
    line-height: 32px;
    margin-top: 0;
}

/* Body copy (Jost, muted). */
.legal-content p {
    font-family: var(--font-body);
    font-weight: var(--weight-regular);
    font-size: 16px;
    line-height: 24px;
    color: #7a7870;
    margin: 0 0 8px;
}
.legal-content p:last-child { margin-bottom: 0; }
.legal-content strong { font-weight: var(--weight-medium); color: var(--color-primary); }
.legal-content a { color: var(--color-primary); font-weight: var(--weight-medium); text-decoration: none; }
.legal-content a:hover { color: var(--color-gold); }

/* Lists, if a policy uses them. */
.legal-content ul,
.legal-content ol { margin: 0 0 8px; padding-left: 21px; }
.legal-content li {
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 24px;
    color: #7a7870;
    margin-bottom: 8px;
}

@media (min-width: 1024px) {
    .legal { padding: 80px 0; }
    .legal-content h2,
    .legal-content h3 { margin-top: 44px; }
}