/*
|--------------------------------------------------------------------------
|   public/css/pages-legales.css
|--------------------------------------------------------------------------
|
|   Mentions légales et politique de confidentialité.
|
|   Ces pages ne vendent rien : elles se consultent, souvent en cherchant
|   une information précise. La mise en forme vise donc la LISIBILITÉ et
|   le repérage rapide, pas l'impact visuel.
*/

.page-legale { max-width: 46rem; }

/* L'en-tête des pages légales : un bandeau clair, plus sobre que
   l'accueil, mais dans la même famille. */
.page-legale h1 { font-size: clamp(2rem, 4vw, 2.75rem); }

.page-legale h1 { margin-bottom: 2rem; }

/* Titres sans le filet rouge de l'accueil : sur une page qui enchaîne
   dix sections courtes, dix filets deviennent du bruit. Un simple trait
   de séparation au-dessus suffit à marquer la coupure. */
.page-legale h2 {
    font-size: 1.125rem;
    padding-bottom: 0;
    margin: 2.5rem 0 .75rem;
    padding-top: 1.75rem;
    border-top: 1px solid var(--bordure);
    letter-spacing: -0.01em;
}
.page-legale h2::after { display: none; }
.page-legale h2:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }

/* Le contenu de ces pages n'est pas « discret » : c'est le contenu
   principal. On le remet en couleur d'encre normale, seule la taille
   reste modeste. */
.page-legale .discret { color: #2c3245; font-size: .9688rem; }

.page-legale p { margin: 0 0 .875rem; }

.retour-accueil {
    display: inline-block; margin-top: 3rem;
    padding-top: 1.5rem; border-top: 1px solid var(--bordure);
    width: 100%;
}
/* --- Gestion des cookies ---
   Un vrai tableau : on y cherche UNE ligne (« c'est quoi ce cookie ? »),
   les colonnes alignées rendent la recherche immédiate. */
.tableau-cookies-cadre { margin: 1.5rem 0 2rem; }

.tableau-cookies {
    width: 100%; border-collapse: collapse;
    font-size: .9375rem; color: #2c3245;
}
.tableau-cookies th {
    text-align: left; padding: .75rem 1rem;
    background: var(--nuit); color: #fff;
    font-family: var(--police-titre); font-weight: 600;
}
.tableau-cookies th:first-child { border-top-left-radius: .5rem; }
.tableau-cookies th:last-child  { border-top-right-radius: .5rem; }
.tableau-cookies td {
    padding: .875rem 1rem; vertical-align: top;
    border-bottom: 1px solid var(--bordure);
}
.tableau-cookies code {
    font-family: var(--police-code); font-size: .8125rem;
    color: var(--marque-sombre); white-space: nowrap;
}
.tableau-cookies .sans-coupure { white-space: nowrap; }

/* --- Plan du site --- */
.plan-liste { margin: 0 0 1rem; padding-left: 1.25rem; line-height: 1.9; }
.plan-liste ul { padding-left: 1.25rem; margin: .125rem 0; font-size: .9375rem; }
.plan-liste li::marker { color: var(--teal); }

/* Sur écran étroit, quatre colonnes ne tiennent pas : chaque cookie
   devient une petite fiche, l'intitulé de colonne passant devant la
   valeur grâce à data-libelle. */
@media (max-width: 40rem) {
    .tableau-cookies thead { display: none; }
    .tableau-cookies tr { display: block; padding: .75rem 0; border-bottom: 1px solid var(--bordure); }
    .tableau-cookies td { display: grid; grid-template-columns: 6.5rem 1fr; gap: .75rem; padding: .25rem 0; border: 0; }
    .tableau-cookies td::before {
        content: attr(data-libelle);
        font-weight: 600; color: var(--encre);
    }
}