/* ==========================================================================
   Compléments ÉDITORIAUX pour les pages guide (100 % informationnel).
   Réutilise design-system.css (tokens + .prose-pb). Ajoute uniquement :
   - le sommaire ancré (.toc-pb)
   - les encadrés "Ce que dit la loi" (.loi-box)
   Scopé à body[data-pb] pour rester cohérent avec le design system.
   ========================================================================== */

/* -------- Sommaire ancré -------- */
body[data-pb] .toc-pb {
  max-width: 720px;
  border: 1px solid var(--cream-200);
  border-radius: var(--radius-md);
  background: var(--cream-100);
  padding: 22px 26px;
  margin: 0 0 8px;
}
body[data-pb] .toc-pb__title {
  font-family: var(--font-mono, "Space Mono", monospace);
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--gold-ink);
  margin: 0 0 12px;
}
body[data-pb] .toc-pb ol {
  columns: 2;
  column-gap: 32px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: toc;
}
body[data-pb] .toc-pb li {
  break-inside: avoid;
  margin: 0 0 8px;
  counter-increment: toc;
}
body[data-pb] .toc-pb a {
  color: var(--ink-900);
  text-decoration: none;
  font-size: 15px;
  line-height: 1.5;
  display: inline-flex;
  gap: 8px;
}
body[data-pb] .toc-pb a::before {
  content: counter(toc, decimal-leading-zero);
  color: var(--gold-ink);
  font-family: var(--font-mono, "Space Mono", monospace);
  font-size: 12px;
}
body[data-pb] .toc-pb a:hover { color: var(--navy-700); text-decoration: underline; }

/* -------- Encadré "Ce que dit la loi" -------- */
body[data-pb] .loi-box {
  max-width: 720px;
  border: 1px solid var(--cream-200);
  border-left: 3px solid var(--gold-500);
  border-radius: var(--radius-md);
  background: #fff;
  padding: 16px 20px;
  margin: 22px 0;
}
body[data-pb] .loi-box__label {
  font-family: var(--font-mono, "Space Mono", monospace);
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold-ink);
  margin: 0 0 6px;
}
body[data-pb] .loi-box p {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--ink-600);
}

/* -------- CTA éditorial inline (renvoi vers un calculateur) -------- */
body[data-pb] .prose-cta {
  max-width: 720px;
  margin: 26px 0;
}

@media (max-width: 640px) {
  body[data-pb] .toc-pb ol { columns: 1; }
}