/**
 * ================================================================
 * FICHIER : Mentions_Legales.css
 * EMPLACEMENT : 2027_B2B/pages/Mentions_Legales/Mentions_Legales.css
 * SHORT_DESC : Styles de la page « Mentions légales »
 * DESCRIPTION : En-tête sobre, sommaire collant, colonne de lecture, fiches définition/valeur.
 *               Jetons de theme.css uniquement.
 *
 * SOMMAIRE :
 *   - MENTIONS_ENTETE
 *   - MENTIONS_SOMMAIRE
 *   - MENTIONS_ARTICLES
 *   - RESPONSIVE
 *
 * MODIFICATIONS :
 *   - 06/10/2026 13:44 : Création — A VALIDER PAR JaxX
 *
 * ================================================================
 */

/* MENTIONS_ENTETE ===================================================== */
.mentions_entete
{
    padding: clamp(56px, 9vw, 112px) 0 clamp(32px, 5vw, 56px);
    border-bottom: 1px solid var(--ligne);
}

.mentions_entete h1
{
    font-size: clamp(2rem, 4.5vw, 3.4rem);
}

.mentions_entete_texte
{
    max-width: 64ch;
    color: var(--encre_second);
    margin: 0;
}
/* MENTIONS_ENTETE ===================================================== */

/* MENTIONS_SOMMAIRE =================================================== */
.mentions_corps
{
    padding: clamp(40px, 6vw, 80px) 0 clamp(64px, 9vw, 120px);
}

.mentions_grille
{
    display: grid;
    grid-template-columns: minmax(0, 3fr) minmax(0, 8fr);
    gap: clamp(32px, 6vw, 96px);
    align-items: start;
}

.mentions_sommaire
{
    position: sticky;
    top: calc(var(--hauteur_header) + var(--espace_3));
}

.mentions_sommaire_titre
{
    display: block;
    font-size: var(--texte_xs, 0.75rem);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--encre_attenuee);
    margin-bottom: var(--espace_2);
}

.mentions_sommaire_liste
{
    list-style: none;
    margin: 0;
    padding: 0;
    counter-reset: mentions_sommaire;
    border-top: 1px solid var(--ligne);
}

.mentions_sommaire_liste li
{
    counter-increment: mentions_sommaire;
    border-bottom: 1px solid var(--ligne);
}

.mentions_sommaire_lien
{
    display: flex;
    gap: 10px;
    align-items: baseline;
    padding: 10px 0;
    min-height: 44px;
    font-size: var(--texte_sm, 0.92rem);
    color: var(--encre_second);
}

.mentions_sommaire_lien::before
{
    content: counter(mentions_sommaire, decimal-leading-zero);
    font-family: var(--police_mono);
    font-size: 0.75rem;
    color: var(--encre_attenuee);
}

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

.mentions_sommaire_liens
{
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: var(--espace_3);
    font-size: var(--texte_sm, 0.92rem);
}
/* MENTIONS_SOMMAIRE =================================================== */

/* MENTIONS_ARTICLES =================================================== */
.mentions_articles
{
    max-width: 72ch;
}

.mentions_article
{
    padding: var(--espace_4) 0;
    border-bottom: 1px solid var(--ligne);
    scroll-margin-top: calc(var(--hauteur_header) + var(--espace_3));
}

.mentions_article:first-child
{
    padding-top: 0;
}

.mentions_article:last-child
{
    border-bottom: 0;
}

.mentions_article h2
{
    font-size: clamp(1.3rem, 2.2vw, 1.7rem);
    margin-bottom: var(--espace_2);
}

.mentions_article p
{
    color: var(--encre_second);
}

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

.mentions_article strong
{
    color: var(--encre);
}

.mentions_fiche
{
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(0, 2fr);
    gap: 0;
    margin: var(--espace_3) 0;
    border: 1px solid var(--ligne);
    border-radius: 2px;
    background: var(--surface_carte);
}

.mentions_fiche dt,
.mentions_fiche dd
{
    margin: 0;
    padding: 10px 14px;
    border-bottom: 1px solid var(--ligne);
    font-size: var(--texte_sm, 0.95rem);
}

.mentions_fiche dt
{
    color: var(--encre_attenuee);
}

.mentions_fiche dd
{
    color: var(--encre);
}

.mentions_fiche dt:nth-last-of-type(1),
.mentions_fiche dd:nth-last-of-type(1)
{
    border-bottom: 0;
}

.mentions_note
{
    font-size: var(--texte_sm, 0.9rem);
    color: var(--encre_attenuee);
}
/* MENTIONS_ARTICLES =================================================== */

/* RESPONSIVE ========================================================== */
@media (max-width: 900px)
{
    .mentions_grille
    {
        grid-template-columns: 1fr;
    }

    .mentions_sommaire
    {
        position: static;
    }

    .mentions_sommaire_liste
    {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
        gap: 0 var(--espace_3);
    }
}

@media (max-width: 520px)
{
    .mentions_fiche
    {
        grid-template-columns: 1fr;
    }

    .mentions_fiche dt
    {
        padding-bottom: 2px;
        border-bottom: 0;
    }

    .mentions_fiche dd
    {
        padding-top: 0;
    }
}
/* RESPONSIVE ========================================================== */
