/*
 * Scoped styles for the static legal pages (mentions légales, politique de
 * confidentialité). Kept intentionally minimal: the global look-and-feel and
 * design tokens live in app.css (owned by the UX/UI work). This file only
 * provides a readable, constrained typographic column for long-form text.
 */
.legal {
    max-width: 46rem;
    margin: 0 auto;
    padding: clamp(2rem, 5vw, 4rem) 1.5rem clamp(3rem, 8vw, 6rem);
    line-height: 1.65;
}

.legal__title {
    font-size: clamp(1.9rem, 4vw, 2.75rem);
    margin: 0 0 0.5rem;
}

.legal__updated {
    color: var(--vo-muted);
    font-size: 0.9rem;
    margin: 0 0 2.5rem;
}

.legal h2 {
    font-size: clamp(1.3rem, 2.6vw, 1.6rem);
    margin: 2.5rem 0 0.75rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--vo-cream-deep);
}

.legal h3 {
    font-size: 1.1rem;
    margin: 1.75rem 0 0.5rem;
}

.legal p,
.legal ul {
    margin: 0 0 1rem;
}

.legal ul {
    padding-left: 1.25rem;
}

.legal li {
    margin-bottom: 0.4rem;
}

.legal a {
    color: var(--vo-terracotta);
}

/* Highlights the data the client still has to provide before going live. */
.legal__todo {
    background: var(--vo-cream-alt);
    border-left: 3px solid var(--vo-gold);
    padding: 0.15rem 0.4rem;
    border-radius: 3px;
    font-style: normal;
    white-space: nowrap;
}