/* ============================================
   LEGAL PAGES (Privacy Policy, Offer)
   Minimal styles for legal document content
   ============================================ */

.legal-page {
    padding-top: calc(var(--header-height-mobile, 60px) + 40px);
    padding-bottom: 60px;
}

@media (min-width: 768px) {
    .legal-page {
        padding-top: calc(var(--header-height-desktop, 80px) + 60px);
        padding-bottom: 80px;
    }
}

.legal-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 var(--container-padding, 20px);
}

/* Page title */
.legal-title {
    font-family: var(--font-heading);
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    font-weight: 500;
    color: var(--color-text, #1a1a1a);
    margin-bottom: 0.5rem;
    letter-spacing: var(--letter-spacing-tight);
    line-height: var(--line-height-tight);
}

.legal-updated {
    font-family: var(--font-primary);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted, #8a8a8a);
    margin-bottom: 2.5rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

/* Section headings */
.legal-container h2 {
    font-family: var(--font-heading);
    font-size: clamp(1.25rem, 3vw, 1.5rem);
    font-weight: 500;
    color: var(--color-text, #1a1a1a);
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    letter-spacing: -0.01em;
    line-height: var(--line-height-snug);
}

/* Body text */
.legal-container p {
    font-family: var(--font-primary);
    font-size: clamp(0.9375rem, 2vw, 1rem);
    line-height: 1.85;
    color: var(--color-text-light, #4a4a4a);
    margin-bottom: 1rem;
}

/* Lists inside legal content */
.legal-container ul,
.legal-container ol {
    font-family: var(--font-primary);
    font-size: clamp(0.9375rem, 2vw, 1rem);
    line-height: 1.85;
    color: var(--color-text-light, #4a4a4a);
    margin-bottom: 1rem;
    padding-left: 1.25rem;
}

.legal-container li {
    margin-bottom: 0.5rem;
}

/* Back link */
.legal-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--font-primary);
    font-size: var(--font-size-sm);
    font-weight: 400;
    color: var(--color-text-muted, #8a8a8a);
    margin-bottom: 2rem;
    transition: color var(--transition-fast);
}

.legal-back:hover {
    color: var(--color-accent);
}

/* Preamble / intro text (before first section) */
.legal-preamble {
    font-size: clamp(0.9375rem, 2vw, 1.0625rem);
    line-height: 1.85;
    color: var(--color-text, #1a1a1a);
    margin-bottom: 2rem;
}