/* ══════════════════════════════════════════════════════════════
   PICBOIS47 — PAGE CONFIDENTIALITÉ ET MENTIONS (23 sept. 2026).

   UNE VRAIE PAGE DE LECTURE. Pas de schéma, pas de révélation au
   défilement, pas de bande noire : le contenu juridique n'est pas un
   prétexte à effets. Le seul mouvement est celui de l'en-tête, partagé
   par toutes les pages, et le joint rouge du sommaire qui suit la
   lecture (pages.js, composant .sommaire déjà au dépôt).

   La colonne de texte est bornée à 68ch : au-delà, l'œil perd sa ligne.
   Le sommaire reste collant sous le rail, à gauche.
   ══════════════════════════════════════════════════════════════ */

.cf-hero { padding-bottom: var(--sp-5); }
.cf-date { grid-column: 2 / span 6; margin: var(--sp-2) 0 0; font-family: var(--f-mono); font-size: var(--t-small); color: var(--pg-sourdine); }
.cf-date .label { display: inline; margin-right: 0.5em; }

.cf-corps { padding: 0 0 var(--sp-8); border-top: 1px solid var(--pg-filet); }
.cf-corps > .cadre-section { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--sp-5); align-items: start; }

/* ── Le sommaire ─────────────────────────────────────────────── */
.cf-sommaire { grid-column: 1 / span 3; position: sticky; top: calc(84px + var(--sp-4)); padding-top: var(--sp-6); display: grid; gap: var(--sp-2); }
.cf-sommaire .sommaire { counter-reset: none; }

/* ── La colonne de lecture ───────────────────────────────────── */
.cf-texte { grid-column: 5 / -1; min-width: 0; padding-top: var(--sp-6); }
.cf-section { padding-bottom: var(--sp-7); }
.cf-section + .cf-section { padding-top: var(--sp-7); border-top: 1px solid var(--pg-filet); }
.cf-section > .label { margin: 0 0 var(--sp-2); }
.cf-section h2 { margin: 0 0 var(--sp-3); font-size: clamp(1.6rem, 2.6vw, 2.25rem); line-height: 1.1; letter-spacing: -0.03em; max-width: 22ch; }
.cf-section h3 { margin: var(--sp-5) 0 var(--sp-2); font-size: 1.125rem; font-weight: 600; letter-spacing: -0.015em; color: var(--pg-encre); }
.cf-section h3:first-of-type { margin-top: var(--sp-4); }
.cf-section p { margin: 0 0 var(--sp-3); font-size: 1.0625rem; line-height: 1.68; max-width: 68ch; }
.cf-section p:last-child { margin-bottom: 0; }
.cf-section b { color: var(--pg-encre); font-weight: 600; }
.cf-section a:not(.lien-mono) { color: var(--pg-encre); border-bottom: 1px solid var(--pg-filet-fort); transition: border-color var(--dur) var(--ease); }
.cf-section a:not(.lien-mono):hover { border-bottom-color: var(--pg-encre); }

/* ── Le résumé et les listes ─────────────────────────────────── */
.cf-resume, .cf-liste { margin: 0 0 var(--sp-3); padding: 0; list-style: none; display: grid; gap: 0; max-width: 68ch; }
.cf-resume li, .cf-liste li { position: relative; padding: 12px 0 12px 26px; font-size: 1.0625rem; line-height: 1.6; border-bottom: 1px solid var(--pg-filet); }
.cf-resume li { font-size: 1.125rem; }
.cf-resume li:first-child, .cf-liste li:first-child { border-top: 1px solid var(--pg-filet); }
.cf-resume li::before, .cf-liste li::before { content: ""; position: absolute; left: 0; top: 21px; width: 9px; height: 9px; }
.cf-resume li::before, .cf-liste-pleine li::before { background: var(--pg-encre); }
.cf-liste-creuse li::before { border: 1px solid var(--pg-filet-fort); }

/* ── Deux cas côte à côte ────────────────────────────────────── */
.cf-deux { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--sp-4); row-gap: var(--sp-4); margin: var(--sp-4) 0 var(--sp-3); }
.cf-cas { padding-top: var(--sp-2); border-top: 1px solid var(--pg-filet-fort); }
.cf-cas .label { display: block; margin-bottom: var(--sp-2); }
.cf-cas p, .cf-cas .cf-liste { max-width: none; }
.cf-cas p:last-child { margin-bottom: 0; }

/* ── Le tableau des fournisseurs ─────────────────────────────── */
.cf-tableau { max-width: 100%; margin: var(--sp-4) 0 var(--sp-4); overflow-x: auto; }
.cf-tableau table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.cf-tableau caption { text-align: left; padding-bottom: var(--sp-2); color: var(--pg-sourdine); }
.cf-tableau th, .cf-tableau td { text-align: left; vertical-align: top; padding: 14px 16px 14px 0; border-bottom: 1px solid var(--pg-filet); line-height: 1.5; }
.cf-tableau thead th { border-bottom: 1px solid var(--pg-encre); font-family: var(--f-mono); font-size: var(--t-label); letter-spacing: 0.1em; text-transform: uppercase; color: var(--pg-sourdine); font-weight: 400; }
.cf-tableau tbody th { font-weight: 600; color: var(--pg-encre); white-space: nowrap; }
/* Un fait non établi est écrit comme tel, jamais inventé : le repère
   rouge marque ici la seule chose qui reste à confirmer sur la page. */
.cf-aconfirmer { display: inline-block; padding-left: 16px; position: relative; color: var(--pg-texte); }
.cf-aconfirmer::before { content: ""; position: absolute; left: 0; top: 7px; width: 8px; height: 8px; background: var(--red); }

/* ── Les mentions légales ────────────────────────────────────── */
.cf-mentions { margin: var(--sp-4) 0 0; display: grid; gap: 0; }
.cf-mentions > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: var(--sp-3); padding: 14px 0; border-bottom: 1px solid var(--pg-filet); }
.cf-mentions > div:first-child { border-top: 1px solid var(--pg-filet-fort); }
.cf-mentions dt { font-family: var(--f-mono); font-size: var(--t-label); letter-spacing: 0.1em; text-transform: uppercase; color: var(--pg-sourdine); line-height: 1.5; }
.cf-mentions dd { margin: 0; font-size: 1.0625rem; line-height: 1.5; color: var(--pg-encre); }
.cf-responsable { line-height: 1.7 !important; }

/* ── Le retour en haut ───────────────────────────────────────── */
.cf-haut { margin-top: var(--sp-5) !important; }


/* ═══ TABLETTE ═════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  .cf-sommaire { grid-column: 1 / span 4; }
  .cf-texte { grid-column: 6 / -1; }
  .cf-deux { grid-template-columns: 1fr; }
}

/* ═══ TÉLÉPHONE ════════════════════════════════════════════════ */
@media (max-width: 860px) {
  .cf-corps > .cadre-section { grid-template-columns: 1fr; }
  .cf-date { grid-column: auto; }
  /* le sommaire cesse de coller : il devient l'index d'ouverture */
  .cf-sommaire { grid-column: auto; position: static; padding-top: var(--sp-5); }
  .cf-texte { grid-column: auto; padding-top: var(--sp-5); }
  .cf-section { padding-bottom: var(--sp-6); }
  .cf-section + .cf-section { padding-top: var(--sp-6); }
  .cf-section p, .cf-resume, .cf-liste { max-width: none; }
  .cf-mentions > div { grid-template-columns: 1fr; gap: 6px; }
  .cf-tableau table { min-width: 560px; }   /* défilement horizontal assumé, contenu dans son cadre */
  .cf-sommaire, .cf-texte { min-width: 0; }
}
