/* Fonts embarquées en local pour garantir le rendu PDF */
@font-face {
  font-family: 'Cabinet Grotesk';
  src: url('fonts/cabinet-grotesk-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'Cabinet Grotesk';
  src: url('fonts/cabinet-grotesk-700.woff2') format('woff2');
  font-weight: 600 700;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'General Sans';
  src: url('fonts/general-sans-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'General Sans';
  src: url('fonts/general-sans-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'General Sans';
  src: url('fonts/general-sans-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'General Sans';
  src: url('fonts/general-sans-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('fonts/jetbrains-mono-400-500.woff2') format('woff2');
  font-weight: 400 500;
  font-style: normal;
  font-display: block;
}

:root {
  --black: #0A0A0A;
  --white: #FFFFFF;
  --off-white: #F7F4EE;
  --terra: #D94F1E;
  --horizon: #0B2A4A;
  --sand: #E8DCC8;
  --ash: #6B6B6B;
  --rule: rgba(10, 10, 10, 0.10);

  --ff-display: "Cabinet Grotesk", "Helvetica Neue", Arial, sans-serif;
  --ff-body: "General Sans", "Helvetica Neue", Arial, sans-serif;
  --ff-mono: "JetBrains Mono", ui-monospace, monospace;
}

@page {
  size: A4;
  margin: 18mm 18mm 18mm 18mm;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
  background: var(--white);
  color: var(--black);
  font-family: var(--ff-body);
  font-weight: 400;
  font-size: 11pt;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

body {
  max-width: 170mm;
  margin: 0 auto;
  padding: 0;
}

/* ----- Dot · cercle terra centré baseline ----- */
.dot {
  display: inline-block;
  width: 0.22em;
  height: 0.22em;
  border-radius: 50%;
  background: var(--terra);
  vertical-align: baseline;
  margin-left: 0.06em;
  position: relative;
  bottom: -0.10em;
  text-indent: -100em;
  overflow: hidden;
  line-height: 0;
}

/* ----- Header band — meta gauche · K. mark à droite ----- */
header.case-head {
  border-top: 2px solid var(--black);
  border-bottom: 1px solid var(--rule);
  padding: 12pt 0 14pt;
  margin-bottom: 18pt;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18pt;
}
header.case-head .meta {
  font-family: var(--ff-mono);
  font-size: 7.5pt;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ash);
}
header.case-head .meta .num {
  color: var(--terra);
  font-size: 9pt;
  font-weight: 500;
  margin-bottom: 2pt;
  display: block;
}
header.case-head .K-mark {
  font-family: var(--ff-display);
  font-weight: 700;
  font-size: 22pt;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--black);
  text-align: right;
}
header.case-head .K-mark .dot {
  width: 0.18em;
  height: 0.18em;
  bottom: -0.08em;
  margin-left: 0.06em;
}

/* ----- Title block ----- */
h1 {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: 28pt;
  line-height: 1.05;
  letter-spacing: -0.025em;
  margin-bottom: 14pt;
  max-width: 22ch;
  color: var(--black);
}

/* ----- Context box ----- */
.context {
  border-left: 2pt solid var(--terra);
  padding: 2pt 0 2pt 12pt;
  margin-bottom: 22pt;
  font-family: var(--ff-body);
  font-style: italic;
  font-weight: 400;
  font-size: 11pt;
  line-height: 1.5;
  color: var(--black);
}

/* ----- Section headings ----- */
h2 {
  font-family: var(--ff-display);
  font-weight: 600;
  font-size: 16pt;
  letter-spacing: -0.015em;
  line-height: 1.15;
  margin: 20pt 0 10pt;
  color: var(--black);
  page-break-after: avoid;
}
h2::before {
  content: "§ ";
  color: var(--terra);
  font-weight: 500;
}

h3 {
  font-family: var(--ff-body);
  font-weight: 600;
  font-size: 10pt;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 12pt 0 4pt;
  color: var(--black);
  page-break-after: avoid;
}

p {
  margin-bottom: 8pt;
  max-width: 75ch;
}

ul, ol {
  margin: 6pt 0 10pt 16pt;
}
ul li, ol li {
  margin-bottom: 4pt;
}

strong { font-weight: 600; color: var(--black); }
em {
  font-family: var(--ff-body);
  font-style: italic;
  font-weight: 500;
  color: var(--terra);
}

code {
  font-family: var(--ff-mono);
  font-size: 9pt;
  background: var(--off-white);
  padding: 1pt 4pt;
  border-radius: 2pt;
}

/* ----- Results grid ----- */
.results {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10pt;
  margin: 12pt 0 16pt;
  padding: 0;
}
.results .stat {
  border: 1px solid var(--rule);
  padding: 12pt 14pt;
  background: var(--white);
}
.results .stat .num {
  font-family: var(--ff-display);
  font-size: 22pt;
  font-weight: 600;
  line-height: 1;
  color: var(--terra);
  letter-spacing: -0.02em;
}
.results .stat .label {
  font-family: var(--ff-mono);
  font-size: 7pt;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--ash);
  margin-top: 6pt;
  line-height: 1.3;
}

/* ----- Stack line ----- */
.stack {
  font-family: var(--ff-mono);
  font-size: 8.5pt;
  color: var(--black);
  background: var(--off-white);
  padding: 8pt 12pt;
  border-left: 2pt solid var(--black);
  margin: 8pt 0 12pt;
  line-height: 1.6;
}

/* ----- Illustrates box ----- */
.illustrates {
  border-top: 1px solid var(--rule);
  padding-top: 14pt;
  margin-top: 20pt;
}
.illustrates h2 {
  font-size: 13pt;
  margin-top: 0;
}

/* ----- Footer ----- */
footer {
  margin-top: 24pt;
  padding-top: 10pt;
  border-top: 1px solid var(--rule);
  font-family: var(--ff-mono);
  font-size: 7.5pt;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--ash);
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12pt;
}
footer .footer-left {
  display: flex;
  flex-direction: column;
  gap: 2pt;
  text-align: left;
}
footer .footer-name {
  color: var(--black);
}
footer .footer-tagline {
  font-family: var(--ff-body);
  font-style: italic;
  font-weight: 400;
  font-size: 8pt;
  text-transform: none;
  letter-spacing: 0;
  color: var(--ash);
}
footer .footer-right {
  display: flex;
  flex-direction: column;
  gap: 2pt;
  text-align: right;
}
footer a { color: var(--ash); text-decoration: none; }

@media print {
  body { max-width: none; }
  .results { page-break-inside: avoid; }
  h2, h3 { page-break-after: avoid; }
}
