/* ============================================================
   Pages légales (Mentions légales, CGV, Confidentialité)
   Partagées par le site des démos et la page d'agence ; complètent offre.css.
   Pages générées par outils_pages.py à partir de legal/.
   ============================================================ */
body.page-legale { margin: 0; font-family: Poppins, 'Segoe UI', system-ui, sans-serif; background: #FFFFFF; }
.page-legale *, .page-legale *::before, .page-legale *::after { box-sizing: border-box; }
.page-legale img { display: block; max-width: 100%; }
.page-legale .a-entete { display: flex; align-items: center; justify-content: space-between; gap: var(--e2); }
.page-legale .a-logo { display: inline-flex; }

.l-legal {
  max-width: calc(820px + 2 * var(--marge)); margin: 0 auto; padding: var(--e6) var(--marge) var(--e8);
  color: var(--encre-2); font-size: 15px; line-height: 1.7; overflow-wrap: break-word;
}
.l-legal h1 { color: var(--encre); font-size: 32px; line-height: 1.2; margin: 0; }
.l-date { margin: var(--e1) 0 0; font-size: 13px; color: var(--encre-4); }
.l-legal h2 { color: var(--encre); font-size: 20px; line-height: 1.3; margin: var(--e6) 0 var(--e2); }
.l-legal p { margin: 0 0 var(--e2); }
.l-legal ul { margin: 0 0 var(--e2); padding-left: 22px; }
.l-legal li { margin-bottom: var(--e1); }
.l-legal strong { color: var(--encre); font-weight: 600; }

/* Tableaux : défilement horizontal sur petit écran plutôt que débordement de la page */
.l-tableau { margin: 0 0 var(--e3); overflow-x: auto; border: 1px solid var(--bord); border-radius: 12px; }
.l-legal table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.5; }
.l-legal th, .l-legal td { text-align: left; vertical-align: top; padding: 12px var(--e2); border-bottom: 1px solid var(--bord); }
.l-legal tr:last-child td { border-bottom: 0; }
.l-legal th { background: var(--lavande); color: var(--encre); font-weight: 600; white-space: nowrap; }
.l-legal td:first-child { font-weight: 500; color: var(--encre); }
.l-legal td a { overflow-wrap: anywhere; } /* adresse email longue : coupée plutôt que de dépasser */

@media (max-width: 767px) {
  .l-legal h1 { font-size: 28px; }
  .l-legal table.l-large { min-width: 640px; }
}
@media (min-width: 1024px) {
  .l-legal { padding-top: var(--e8); padding-bottom: var(--e12); font-size: 16px; }
  .l-legal h1 { font-size: 40px; }
  .l-legal h2 { font-size: 22px; }
}