/*
 * Styles partagés par les pages légales (Mentions légales, Politique de
 * confidentialité) — page-mentions-legales.php et page-politique-confidentialite.php.
 * Typographie alignée sur la colonne de lecture de l'article (assets/css/article.css),
 * simplifiée : pas de TOC dynamique ni de blocs éditoriaux (brief, FAQ...).
 */

.oif-legal .head{max-width:680px;margin:0 auto;padding:56px 0 8px}
.oif-legal .head .kicker{
  font-family:'Caveat',cursive;font-size:20px;font-weight:700;color:var(--terracotta);display:block;margin-bottom:6px;
}
.oif-legal .head h1{font-family:'Fraunces',serif;font-weight:500;font-size:42px;line-height:1.1;letter-spacing:-.02em;margin:0 0 16px;color:var(--ink)}
.oif-legal .head .intro{font-size:17px;line-height:1.6;color:var(--ink-2);margin:0 0 14px;max-width:560px}
.oif-legal .head .updated{font-family:Inter,sans-serif;font-size:13px;color:var(--ink-2)}
.oif-legal .head .updated em{font-family:'Caveat',cursive;font-style:normal;color:var(--terracotta);font-weight:700}

/* ───── Sommaire ───── */
.oif-legal .toc{max-width:680px;margin:28px auto;background:var(--bg);border:1px solid var(--ink-2);border-radius:14px;padding:22px 26px}
.oif-legal .toc h4{font-family:Inter,sans-serif;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2);margin:0 0 14px}
.oif-legal .toc ol{list-style:none;counter-reset:toc;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.oif-legal .toc li{counter-increment:toc;font-size:15px;line-height:1.4}
.oif-legal .toc li::before{content:counter(toc) ".";font-family:'Caveat',cursive;font-size:19px;font-weight:700;color:var(--terracotta);margin-right:9px}
.oif-legal .toc a{color:var(--ink);text-decoration:none;border-bottom:1px solid transparent}
.oif-legal .toc a:hover{color:var(--terracotta);border-bottom-color:var(--terracotta)}

/* ───── Colonne de lecture ───── */
.oif-legal .body{display:grid;grid-template-columns:1fr 680px 1fr;padding:8px 48px 72px}
.oif-legal .body .col{grid-column:2}
.oif-legal .body .col > p{font-size:16px;line-height:1.7;color:var(--ink-2);margin:0 0 18px}
.oif-legal .body .col > h2{font-family:'Fraunces',serif;font-weight:500;font-size:26px;line-height:1.2;letter-spacing:-.02em;margin:40px 0 14px;color:var(--ink);scroll-margin-top:24px}
.oif-legal .body .col > h3{font-family:'Fraunces',serif;font-weight:600;font-size:18px;line-height:1.3;letter-spacing:-.01em;margin:24px 0 10px;color:var(--ink)}
.oif-legal .body .col p a,.oif-legal .body .col li a{color:var(--terracotta-d);text-decoration:none;border-bottom:1.5px solid rgba(193,122,90,.4);transition:.15s}
.oif-legal .body .col p a:hover,.oif-legal .body .col li a:hover{color:var(--terracotta);border-bottom-color:var(--terracotta)}
.oif-legal .body .col ul,.oif-legal .body .col ol{font-size:16px;line-height:1.7;color:var(--ink-2);margin:0 0 18px;padding-left:22px}
.oif-legal .body .col li{margin-bottom:6px}
.oif-legal .body .col strong{color:var(--ink)}

/* Encadré placeholder — signale un champ à compléter avant mise en ligne définitive. */
.oif-legal .body .col .todo{
  background:var(--cream);border:1.5px dashed var(--terracotta-d);border-radius:12px;
  padding:14px 18px;margin:0 0 22px;font-family:Inter,sans-serif;font-size:13px;line-height:1.55;color:var(--ink-2);
}
.oif-legal .body .col .todo b{color:var(--ink)}

@media (max-width:1000px){
  .oif-legal .head{padding:40px 24px 8px}
  .oif-legal .head h1{font-size:32px}
  .oif-legal .toc{margin:24px 24px}
  .oif-legal .body{grid-template-columns:1fr;padding:8px 24px 56px}
  .oif-legal .body .col{grid-column:1}
}
@media (max-width:640px){
  .oif-legal .head h1{font-size:26px}
  .oif-legal .body .col > h2{font-size:22px}
}