/* Cadence — pages légales.
   S'appuie sur landing.css (polices auto-hébergées + reset) et ajoute la mise
   en forme « prose » commune aux quatre documents. */

.legal-page{min-height:100vh;background:#efece0;color:#23271d;font-family:'DM Sans','Helvetica Neue',sans-serif;-webkit-font-smoothing:antialiased}

.legal-header{position:sticky;top:0;z-index:50;background:rgba(239,236,224,.88);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #e3dfd0}
.legal-header .inner{max-width:860px;margin:0 auto;padding:0 24px;height:62px;display:flex;align-items:center;gap:26px}
.legal-header a{color:#23271d;text-decoration:none}
.legal-header .back{margin-left:auto;font-size:13px;color:#4c5140}
.legal-header .back:hover{color:#20241b;text-decoration:underline}

.legal-main{max-width:860px;margin:0 auto;padding:64px 24px 96px}

.legal-kicker{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.2em;color:#8a6d1f}
.legal-main h1{margin:14px 0 0;font-family:'EB Garamond',serif;font-weight:600;font-size:clamp(30px,4.6vw,44px);line-height:1.1;color:#20241b;text-wrap:balance}
.legal-updated{margin-top:12px;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.12em;color:#8b8f7d}

.legal-main h2{margin:44px 0 0;font-family:'EB Garamond',serif;font-weight:600;font-size:24px;line-height:1.2;color:#20241b}
.legal-main h3{margin:26px 0 0;font-size:15px;font-weight:600;color:#20241b}
.legal-main p{margin:14px 0 0;font-size:14.5px;line-height:1.7;color:#4c5140;text-wrap:pretty}
.legal-main ul,.legal-main ol{margin:14px 0 0;padding-left:22px;display:flex;flex-direction:column;gap:8px}
.legal-main li{font-size:14.5px;line-height:1.65;color:#4c5140}
.legal-main li b,.legal-main p b{font-weight:600;color:#2b2f24}
.legal-main a{color:#2e5a44;text-decoration:underline;text-underline-offset:2px}

.legal-callout{margin-top:20px;background:#fdfcf8;border:1px solid #e6e1d1;border-left:3px solid #2e5a44;border-radius:10px;padding:16px 20px}
.legal-callout p{margin:0;font-size:14px}
.legal-callout p + p{margin-top:10px}

.legal-todo{background:#f6e9c8;border:1px solid #eadfb6;border-radius:5px;padding:1px 7px;font-family:'IBM Plex Mono',monospace;font-size:12px;color:#8a6d1f;white-space:nowrap}

.legal-table{margin-top:16px;width:100%;border-collapse:collapse;background:#fdfcf8;border:1px solid #e6e1d1;border-radius:12px;overflow:hidden;font-size:13.5px}
.legal-table-wrap{margin-top:16px;overflow-x:auto}
.legal-table th{background:#f4f1e7;text-align:left;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;color:#6d7261;padding:11px 14px;border-bottom:1px solid #e3dfd0}
.legal-table td{padding:12px 14px;border-bottom:1px solid #efece0;color:#4c5140;line-height:1.55;vertical-align:top}
.legal-table tr:last-child td{border-bottom:none}

.legal-footer{border-top:1px solid #e3dfd0}
.legal-footer .inner{max-width:860px;margin:0 auto;padding:30px 24px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;font-size:12.5px;color:#6d7261}
.legal-footer a{color:#6d7261;text-decoration:none}
.legal-footer a:hover{color:#20241b;text-decoration:underline}
.legal-footer .copy{margin-left:auto;font-family:'IBM Plex Mono',monospace;font-size:10px;color:#8b8f7d}

/* Sélecteur de langue : chaque document légal pointe vers ses traductions
   (FR/EN/ES). La langue courante est marquée par aria-current. */
.legal-langs{display:flex;align-items:center;gap:1px;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.1em}
.legal-langs a{padding:4px 8px;border:1px solid #e3dfd0;color:#8b8f7d;background:#fdfcf8}
.legal-langs a:first-child{border-radius:999px 0 0 999px}
.legal-langs a:last-child{border-radius:0 999px 999px 0}
.legal-langs a[aria-current]{background:#20241b;border-color:#20241b;color:#f2efe4}
.legal-langs a:hover{color:#20241b;text-decoration:none}
.legal-langs a[aria-current]:hover{color:#f2efe4}

/* ── Mobile / tablette ─────────────────────────────────────────────────
   Les documents légaux sont en flux simple : il suffit de resserrer les
   marges, d'autoriser le retour à la ligne de l'en-tête et de garantir que
   les tableaux larges défilent au lieu de déborder de la page. */
@media (max-width:640px){
  .legal-header .inner{height:auto;min-height:58px;padding:10px 18px;gap:12px}
  .legal-header .back{font-size:12px}
  .legal-main{padding:40px 18px 64px}
  .legal-main h2{margin-top:34px;font-size:21px}
  .legal-main p,.legal-main li{font-size:14px}
  .legal-callout{padding:14px 16px}
  .legal-table{font-size:12.5px}
  .legal-table th,.legal-table td{padding:10px 11px}
  .legal-table-wrap{-webkit-overflow-scrolling:touch}
  .legal-table-wrap .legal-table{min-width:520px}
  .legal-todo{white-space:normal}
  .legal-footer .inner{padding:24px 18px;gap:12px}
  .legal-footer .copy{margin-left:0;width:100%}
}