/* ============================================
   LEGAL PAGES — privacy / terms
   Aligned with the new design language (utility-pages.css pattern):
   - Soft #F1F1F1 hero, no image-bg, no red overlay
   - Tighter section padding clamp(2.5rem, 4vw, 4rem)
   - Readable measure ~760px, line-height 1.7
   - h2 uses display font, weight 500, letter-spacing -0.01em, no red border
   ============================================ */

/* --- Hero (soft, no image bg) --- */
.legal-page .page-header,
.legal-page .page-header--bg {
    background: #F1F1F1 !important;
    background-image: none !important;
    color: #0A0A0A;
    padding: clamp(4rem, 8vw, 6rem) 0 clamp(2rem, 4vw, 3rem);
    text-align: left;
    min-height: 0;
    border-bottom: 1px solid #E5E5E5;
}
.legal-page .page-header .page-overlay { display: none; }
.legal-page .page-header .container {
    max-width: 1180px;
    position: relative;
    z-index: 1;
    color: #0A0A0A;
}
.legal-page .page-header h1 {
    font-family: var(--font-display);
    font-weight: 400;
    color: #0A0A0A;
    font-size: clamp(2.2rem, 4.6vw, 3.4rem);
    line-height: 1.05;
    letter-spacing: -0.01em;
    margin: 0 0 0.85rem;
    text-shadow: none;
    text-transform: none;
    max-width: 24ch;
}
.legal-page .page-header p {
    font-family: var(--font-body);
    color: #5A5A5A;
    font-size: 1.05rem;
    line-height: 1.55;
    max-width: 58ch;
    margin: 0;
    text-shadow: none;
    opacity: 1;
}

/* --- Content section (override double-pad) --- */
.legal-page .content-section {
    padding: clamp(2.5rem, 4vw, 4rem) 0;
    background: #FFFFFF;
}
.legal-page .content-section .container { max-width: 1180px; }

/* --- Legal content body --- */
.legal-content {
    max-width: 760px;
    margin: 0 auto;
    line-height: 1.7;
    font-family: var(--font-body);
    color: #1A1A1A;
}

.legal-content .last-updated {
    text-align: left;
    color: #8A8A8A;
    font-size: 0.78rem;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    margin-bottom: 2.5rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid #E5E5E5;
}

.legal-section {
    margin-bottom: 2.25rem;
}

.legal-section h2 {
    font-family: var(--font-display);
    font-weight: 500;
    color: #0A0A0A;
    font-size: clamp(1.25rem, 2vw, 1.5rem);
    line-height: 1.2;
    letter-spacing: -0.01em;
    margin: 0 0 0.85rem;
    padding: 0;
    border: 0;
    text-transform: none;
}

.legal-section h3 {
    font-family: var(--font-body);
    font-weight: 600;
    color: #0A0A0A;
    font-size: 1rem;
    letter-spacing: 0.02em;
    margin: 1.5rem 0 0.5rem;
}

.legal-section p {
    color: #1A1A1A;
    font-size: 1rem;
    line-height: 1.7;
    margin: 0 0 1rem;
}

.legal-section p:last-child { margin-bottom: 0; }

.legal-section .lead {
    font-size: 1.1rem;
    color: #5A5A5A;
    line-height: 1.6;
    margin-bottom: 1.75rem;
}

.legal-section a {
    color: #E50914;
    text-decoration: none;
    border-bottom: 1px solid currentColor;
    padding-bottom: 1px;
}
.legal-section a:hover { color: #B3060F; }

/* --- Contact list — minimal, no FA icons --- */
.legal-content .contact-list {
    list-style: none;
    padding: 0;
    margin: 1.25rem 0 0;
    border-top: 1px solid #E5E5E5;
}

.legal-content .contact-list li {
    padding: 0.95rem 0;
    border-bottom: 1px solid #E5E5E5;
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #1A1A1A;
}

/* Hide the FontAwesome icons — they read out of place with the minimal aesthetic.
   Content still makes sense (mailto:, tel:, address are self-evident). */
.legal-content .contact-list li i {
    display: none;
}

.legal-content .contact-list li a {
    color: #1A1A1A;
    text-decoration: none;
    border-bottom: 1px solid #E5E5E5;
    padding-bottom: 1px;
}
.legal-content .contact-list li a:hover {
    color: #E50914;
    border-bottom-color: #E50914;
}

/* --- Mobile --- */
@media (max-width: 768px) {
    .legal-page .page-header,
    .legal-page .page-header--bg {
        padding: 3rem 0 1.75rem;
    }
    .legal-page .page-header h1 { font-size: 1.85rem; }
    .legal-page .page-header p { font-size: 0.98rem; }
    .legal-page .content-section { padding: 2rem 0; }
    .legal-section { margin-bottom: 1.75rem; }
    .legal-section h2 { font-size: 1.2rem; }
    .legal-content { font-size: 0.98rem; }
}