/* documents.css : pages de documents (contrat, conditions générales, formulaire
   d'information) et leur impression. Chargée avec ?v= : bumper à chaque modification. */

.docpage { padding: calc(76px + clamp(1.3rem, 3.4vw, 2.4rem)) 0 clamp(3rem, 7vw, 5.5rem); }
.docpage__wrap { width: min(860px, 100% - 2rem); margin-inline: auto; display: grid; gap: clamp(1rem, 2.4vw, 1.5rem); }
.docpage__intro { max-width: 62ch; }
.docpage__title { font-size: clamp(1.7rem, 1.35rem + 1.2vw, 2.25rem); margin: .5rem 0 .6rem; text-wrap: balance; }
.docpage__lead { color: var(--ink-soft); line-height: 1.6; margin: 0; }
.docpage__actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1rem; }

.dcard { background: #fbfcf8; border: 1px solid rgba(24, 32, 26, .08); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); padding: clamp(1.1rem, 3vw, 1.8rem); min-width: 0; }
.dcard > h2 { font-size: 1.3rem; margin: 0 0 .35rem; }
.dcard__sub { color: var(--muted); font-size: .92rem; margin: 0 0 1.1rem; line-height: 1.5; }

.banner { border-radius: var(--radius); padding: .95rem 1.15rem; font-size: .95rem; line-height: 1.5; }
.banner--ok { background: #e3efe4; color: #1f3d27; border: 1px solid #b9d3bd; }
.banner--err { background: #f8e4df; color: #6f2318; border: 1px solid #e6bdb3; }
.banner--info { background: #e6eff0; color: #1d3a40; border: 1px solid #bfd5d8; }

/* ---- Le document ---------------------------------------------------------- */
.doc { font-size: .97rem; line-height: 1.62; color: var(--ink); overflow-wrap: anywhere; }
.doc h2, .doc h3, .doc h4, .doc h5 { font-family: var(--font-display); color: var(--ink); }
.doc-head { border-bottom: 2px solid var(--ink); padding-bottom: .8rem; margin-bottom: 1rem; }
.doc-kicker { font-size: .72rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--forest); margin: 0 0 .3rem; }
.doc-title { font-size: clamp(1.3rem, 1.1rem + .8vw, 1.7rem); margin: 0 0 .25rem; text-wrap: balance; }
.doc-sub { color: var(--muted); font-size: .88rem; margin: 0; }
.doc--contract h3 { font-size: 1.08rem; margin: 1.5rem 0 .55rem; padding-bottom: .3rem; border-bottom: 1px solid var(--line); }
.doc-table { width: 100%; border-collapse: collapse; font-size: .92rem; margin: .2rem 0 .5rem; }
.doc-table th, .doc-table td { text-align: left; vertical-align: top; padding: .5rem .6rem; border-bottom: 1px solid var(--line); }
.doc-table th { width: 38%; font-weight: 600; color: var(--ink-soft); }
.doc-table--list th { width: auto; font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.doc-table--money td { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.doc-table--money th { width: auto; }
.doc-strong th, .doc-strong td { font-weight: 700; color: var(--ink); background: #eef2ea; }
.doc-muted { color: var(--muted); font-weight: 400; font-size: .86rem; }
.doc-note { font-size: .86rem; color: var(--ink-soft); margin: .4rem 0 0; }
.doc-todo { color: #8a5a10; font-style: normal; background: #f6ecd6; padding: .05em .45em; border-radius: 4px; font-size: .88em; }
.doc-list { padding-left: 1.2rem; margin: .3rem 0 .8rem; }
.doc-list li { margin-bottom: .3rem; }
.doc-sign { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; margin-top: 1rem; }
.doc-sign__box { border: 1px solid var(--line); border-radius: 12px; padding: .9rem 1rem; background: #fff; }
.doc-sign__who { font-weight: 700; margin: 0 0 .4rem; }
.doc-sign__img { display: block; max-width: 100%; height: auto; max-height: 120px; margin: .2rem 0 .4rem; }
.doc-sign__meta { font-size: .84rem; color: var(--ink-soft); margin: 0; line-height: 1.5; }
.doc-foot { font-size: .78rem; color: var(--muted); margin-top: 1rem; }

/* Conditions générales et formulaire (balisage repris du document validé). */
.doc--cgv .art { margin-top: 1.6rem; }
.doc--cgv .art h4 { font-size: 1.08rem; margin: 0 0 .5rem; padding-bottom: .3rem; border-bottom: 1px solid var(--line); scroll-margin-top: 90px; }
.doc--cgv .art h4 .num { color: var(--forest); }
.doc--cgv .art h5 { font-family: inherit; font-size: .95rem; font-weight: 700; margin: 1rem 0 .3rem; }
.doc--cgv .art p { margin: 0 0 .6rem; }
.doc--cgv .art ul { padding-left: 1.2rem; margin: 0 0 .6rem; }
.doc--cgv .art li { margin-bottom: .25rem; }
.doc--cgv .idcard { background: #eef2ea; border-radius: 10px; padding: .8rem 1rem; margin-bottom: .6rem; font-size: .92rem; line-height: 1.7; }
.doc--cgv .tw { overflow-x: auto; }
.doc--cgv table { width: 100%; border-collapse: collapse; font-size: .92rem; margin: .3rem 0 .6rem; }
.doc--cgv caption { text-align: left; font-size: .84rem; color: var(--muted); padding-bottom: .4rem; }
.doc--cgv th, .doc--cgv td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--line); }
.doc--cgv th { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }
.doc--cgv td.pct { font-weight: 700; white-space: nowrap; }
.doc--form h2 { font-size: 1.35rem; margin: 0 0 .8rem; }
.doc--form h3 { font-family: inherit; font-size: 1rem; font-weight: 700; margin: 1.2rem 0 .5rem; }
.doc--form ul { padding-left: 1.2rem; }
.doc--form li { margin-bottom: .45rem; }
.doc--form .src { font-size: .82rem; color: var(--muted); }

.toc { columns: 2 240px; gap: 1.5rem; padding: 0; margin: 0; list-style: none; font-size: .9rem; }
.toc li { break-inside: avoid; margin-bottom: .3rem; }
.toc a { color: var(--ink-soft); text-decoration: none; }
.toc a:hover { color: var(--forest); text-decoration: underline; }

@media print {
  @page { size: A4; margin: 15mm 14mm; }
  html, body { background: #fff !important; }
  .site-header, .no-print, .docpage__actions { display: none !important; }
  .docpage { padding: 0; }
  .docpage__wrap { width: 100%; gap: 0; }
  .dcard { box-shadow: none; border: none; padding: 0; background: none; }
  .doc { font-size: 10.5pt; }
  .doc-table, .doc-sign, .doc--cgv table, .doc--cgv .idcard { break-inside: avoid; }
  .doc--contract h3, .doc--cgv .art h4, .doc--cgv .art h5 { break-after: avoid; }
  .doc-strong th, .doc-strong td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  a { color: inherit; text-decoration: none; }
}
