/* Pages légales d'Élévation (18 septembre 2026).
   Une mise en page de lecture : colonne étroite, interligne large, tableaux qui
   défilent sur téléphone au lieu de déborder. Les couleurs de marque viennent
   des variables de styles.css ; les quatre teintes propres à ces pages sont ici. */

.legal {
    --legal-doux: #5b6470;
    --legal-lien: #1f6fb2;
    --legal-trait: #d9dee5;
    --legal-carte: #ffffff;
    background: var(--light-bg);
    padding: 56px 0 72px;
}

.legal-article {
    max-width: 46em;
    margin: 0 auto;
    padding: 0 20px;
    color: var(--text-color);
}

.legal-article h1 {
    font-size: clamp(2rem, 5vw, 2.8rem);
    color: var(--primary-color);
    margin: 0 0 .3em;
}

.legal-article h2 {
    font-size: clamp(1.35rem, 3vw, 1.7rem);
    color: var(--primary-color);
    margin: 2em 0 .5em;
    scroll-margin-top: 110px;
}

.legal-article h3 {
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    font-size: 1.05rem;
    color: var(--primary-color);
    margin: 1.4em 0 .4em;
}

.legal-maj {
    color: var(--legal-doux);
    font-size: .95rem;
    margin: 0 0 2em;
}

.legal-article p,
.legal-article li {
    font-size: 1rem;
    line-height: 1.7;
}

.legal-article p {
    margin: 0 0 1em;
}

.legal-article ul {
    list-style: disc;
    padding-left: 1.3em;
    margin: 0 0 1em;
}

.legal-article ul ul {
    list-style: circle;
    margin: .3em 0 0;
}

.legal-article li {
    margin: .3em 0;
}

.legal-article a {
    color: var(--legal-lien);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.legal-tableau {
    overflow-x: auto;
    margin: .5em 0 1.5em;
}

.legal-article table {
    width: 100%;
    min-width: 34em;
    border-collapse: collapse;
    font-size: .95rem;
    background: var(--legal-carte);
}

.legal-article th,
.legal-article td {
    text-align: left;
    vertical-align: top;
    padding: .6em .75em;
    border-bottom: 1px solid var(--legal-trait);
}

.legal-article th {
    color: var(--primary-color);
    font-weight: 600;
}

.legal-article code {
    font-size: .9em;
    overflow-wrap: anywhere;
}

.legal-encadre {
    background: var(--legal-carte);
    border-left: 4px solid var(--secondary-color);
    border-radius: var(--border-radius);
    padding: 1em 1.2em;
    margin: 1.5em 0;
}

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

.legal-autre-langue {
    margin-top: 4em;
    padding-top: 2em;
    border-top: 1px solid var(--legal-trait);
}

@media (max-width: 640px) {
    .legal {
        padding: 36px 0 56px;
    }
}
