/* La Cicatrice : feuille de style unique
   Direction : bandes sombres (#0e1a21) et claires alternées, sarcelle pour l'action et la preuve,
   ambre pour la vigilance, illustrations de peau réalistes. Instrument Serif pour les titres,
   Instrument Sans pour le texte. Un seul look, volontairement ; pas de thème sombre séparé. */

:root {
  --ink: #101b22;
  --ink-2: #3d4c55;
  --ink-3: #5b6b75;
  --paper: #ffffff;
  --paper-2: #f3f6f7;
  --paper-3: #eef4f6;
  --line: #d9e1e5;
  --dark: #0e1a21;
  --dark-2: #16262f;
  --dark-line: #243640;
  --dark-line-2: #4a5d67;
  --on-dark: #f3f6f7;
  --on-dark-2: #c6d1d7;
  --on-dark-3: #a9b8c0;
  --teal: #35c4b2;
  --teal-ink: #0c7d73;
  --teal-deep: #085a53;
  --teal-pale: #bfe8e2;
  --amber: #e0a458;
  --amber-ink: #a8701f;
  --grey-badge: #8a98a0;
  --skin-1: #f4dccb;
  --skin-2: #cfa48a;
  --scar-red: #c4584a;
  --scar-pink: #d47f73;
  --scar-pale: #e3b9ab;
  --serif: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --sans: 'Instrument Sans', 'Segoe UI', Helvetica, Arial, sans-serif;
  --wrap: 1180px;
  --gutter: max(16px, env(safe-area-inset-left, 0px));
  --gutter-r: max(16px, env(safe-area-inset-right, 0px));
  --r-s: 10px;
  --r-m: 16px;
  --r-l: 20px;
  --t-xs: 13px;
  --t-s: 15px;
  --t-m: 17px;
  --t-b: 18px;
  --t-l: 19px;
  --t-lead: clamp(18px, 1.2vw + 12px, 22px);
  --t-h3: 22px;
  --t-h2: clamp(34px, 3.4vw + 10px, 54px);
  --t-h1: clamp(44px, 5.6vw + 10px, 82px);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition: none !important; animation: none !important; } }
body {
  margin: 0; background: var(--paper); color: var(--ink);
  font-family: var(--sans); font-size: var(--t-b); line-height: 1.55;
  -webkit-font-smoothing: antialiased; min-height: 100%; display: flex; flex-direction: column;
}
img, svg { max-width: 100%; }
svg { display: block; }
a { color: var(--teal-ink); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--teal-deep); }
:focus-visible { outline: 3px solid var(--teal); outline-offset: 3px; border-radius: 4px; }
h1, h2, h3, h4, p, ul, ol, figure { margin: 0; }
h1, h2 { font-family: var(--serif); font-weight: 400; letter-spacing: -0.012em; text-wrap: balance; }
h1 { font-size: var(--t-h1); line-height: 0.98; }
h2 { font-size: var(--t-h2); line-height: 1.04; }
h3 { font-size: var(--t-h3); font-weight: 600; line-height: 1.25; text-wrap: balance; }
h4 { font-size: var(--t-b); font-weight: 700; }
strong { font-weight: 700; }
sup { font-size: 0.68em; line-height: 0; color: var(--ink-3); margin-left: 2px; }
.band--dark sup, .band--dark2 sup, .card--dark sup { color: var(--on-dark-3); }
ul, ol { padding-left: 20px; }
li + li { margin-top: 6px; }
hr { border: 0; border-top: 1px solid var(--line); margin: 0; }
.skip { position: absolute; left: -9999px; top: 8px; background: var(--teal); color: var(--dark); padding: 10px 16px; border-radius: 999px; font-weight: 700; z-index: 100; }
.skip:focus { left: 16px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Bandes et gabarit ---------- */
.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter-r); }
.band { background: var(--paper); color: var(--ink); }
.band--soft { background: var(--paper-2); }
.band--dark { background: var(--dark); color: var(--on-dark); }
.band--dark2 { background: var(--dark-2); color: var(--on-dark); }
.band--dark a:not(.btn), .band--dark2 a:not(.btn) { color: var(--teal); }
.band--dark a:not(.btn):hover, .band--dark2 a:not(.btn):hover { color: var(--teal-pale); }
.band + .band--dark, .band--dark + .band--dark2, .band--dark2 + .band--dark { border-top: 1px solid var(--dark-line); }
.section { padding-block: clamp(48px, 7vw, 84px); }
.section--tight { padding-block: clamp(32px, 4vw, 56px); }
.section--hero { padding-block: clamp(44px, 6vw, 72px); }
.stack { display: flex; flex-direction: column; gap: 16px; }
.stack--l { gap: 28px; }
.stack--xl { gap: 40px; }
.stack--s { gap: 10px; }
.cluster { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; }
.split { display: flex; flex-wrap: wrap; gap: 40px 48px; align-items: flex-start; }
.split--center { align-items: center; }
.split > * { flex: 1 1 400px; min-width: 0; }
.split > .narrow { flex: 0 1 380px; }
.grid { display: grid; gap: 20px; }
.grid > * { min-width: 0; }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.grid--3 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
.grid--5 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); }
.grid--3s { grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }
.grid--tiles { grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: 12px; }
.measure { max-width: 68ch; }
.measure-s { max-width: 52ch; }
.head-row { display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: flex-end; justify-content: space-between; }
.head-row > p { max-width: 480px; }
.muted { color: var(--ink-2); }
.quiet { color: var(--ink-3); }
.band--dark .muted, .band--dark2 .muted, .card--dark .muted { color: var(--on-dark-2); }
.band--dark .quiet, .band--dark2 .quiet, .card--dark .quiet { color: var(--on-dark-3); }
.small { font-size: var(--t-s); }
.xs { font-size: var(--t-xs); }
.lead { font-size: var(--t-lead); line-height: 1.45; }
.serif { font-family: var(--serif); font-weight: 400; }
.kicker { font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; font-size: var(--t-xs); color: var(--teal-ink); }
.band--dark .kicker, .band--dark2 .kicker { color: var(--teal); }
.meta { display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: var(--t-s); font-weight: 500; color: var(--ink-3); }
.band--dark .meta, .band--dark2 .meta { color: var(--on-dark-3); }
.num { font-variant-numeric: tabular-nums; }

/* ---------- En-tête et pied ---------- */
.site-header { background: var(--dark); color: var(--on-dark); position: relative; z-index: 20; }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 14px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--on-dark) !important; font-family: var(--serif); font-size: 27px; letter-spacing: -0.01em; white-space: nowrap; }
.brand svg { width: 34px; height: 34px; flex: none; }
.nav { display: flex; flex-wrap: wrap; gap: 4px 22px; align-items: center; font-weight: 500; font-size: 16px; }
.nav a { color: var(--on-dark) !important; text-decoration: none; padding: 6px 0; border-bottom: 2px solid transparent; }
.nav a:hover { border-bottom-color: var(--dark-line-2); }
.nav a[aria-current="page"] { border-bottom-color: var(--teal); }
.nav .btn { margin-left: 6px; }
.nav a.btn { padding: 0 16px; border-bottom: 0; color: var(--dark) !important; }
.nav-toggle { display: none; background: none; border: 1.5px solid var(--dark-line-2); color: var(--on-dark); border-radius: 999px; min-height: 44px; padding: 0 16px; font: inherit; font-weight: 600; }
@media (max-width: 900px) {
  .nav-toggle { display: inline-flex; align-items: center; gap: 8px; }
  .nav { display: none; width: 100%; flex-direction: column; align-items: flex-start; gap: 2px; padding-top: 8px; border-top: 1px solid var(--dark-line); }
  .nav a { padding: 10px 0; width: 100%; border-bottom: 1px solid var(--dark-line); }
  .nav a[aria-current="page"] { border-bottom-color: var(--teal); }
  .nav .btn { margin: 12px 0 4px; }
  .site-header .wrap { flex-wrap: wrap; }
  .site-header.is-open .nav { display: flex; }
}
.site-footer { background: var(--dark); color: var(--on-dark-3); border-top: 1px solid var(--dark-line); margin-top: auto; font-size: var(--t-s); }
.site-footer .wrap { padding-block: 36px; display: flex; flex-direction: column; gap: 24px; }
.site-footer .foot-top { display: flex; flex-wrap: wrap; gap: 24px 48px; justify-content: space-between; align-items: flex-start; }
.site-footer .foot-links { display: flex; flex-wrap: wrap; gap: 10px 24px; }
.site-footer a { color: var(--on-dark-2); }
.site-footer a:hover { color: var(--on-dark); }
.site-footer .brand { font-size: 24px; }
.foot-note { max-width: 62ch; }

/* ---------- Boutons, puces, badges ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 22px; border-radius: 999px; text-decoration: none; font-weight: 700; font-size: 17px; border: 1.5px solid transparent; cursor: pointer; font-family: inherit; line-height: 1.2; }
.btn--primary { background: var(--teal); color: var(--dark) !important; }
.btn--primary:hover { background: #2fb3a2; color: var(--dark) !important; }
.btn--ghost { background: transparent; color: inherit !important; border-color: var(--dark-line-2); }
.band:not(.band--dark):not(.band--dark2) .btn--ghost { border-color: var(--ink); color: var(--ink) !important; }
.btn--ghost:hover { border-color: var(--teal); }
.btn--l { min-height: 54px; padding: 0 26px; font-size: 18px; }
.btn--s { min-height: 40px; padding: 0 16px; font-size: 15px; }
.chip { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1.5px solid var(--dark-line-2); border-radius: 999px; text-decoration: none; color: inherit !important; font-weight: 500; font-size: 16px; }
.chip:hover { border-color: var(--teal); }
.band:not(.band--dark):not(.band--dark2) .chip { border-color: var(--line); }
.chip--static { min-height: 36px; font-size: 15px; }
.badge { display: inline-flex; align-items: center; align-self: flex-start; border: 1px solid currentColor; border-radius: 999px; padding: 3px 10px; font-size: var(--t-xs); font-weight: 700; line-height: 1.4; max-width: 100%; }
.badge--first { color: var(--teal-ink); }
.badge--consensus { color: var(--consensus); }
.badge--none { color: var(--ink-3); }
.band--dark .badge--first, .band--dark2 .badge--first, .card--dark .badge--first { color: var(--teal); }
.band--dark .badge--consensus, .band--dark2 .badge--consensus, .card--dark .badge--consensus { color: var(--amber); }
.band--dark .badge--none, .band--dark2 .badge--none, .card--dark .badge--none { color: var(--on-dark-3); border-color: var(--grey-badge); }
.legend { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; font-size: var(--t-s); }

/* ---------- Cartes et encadrés ---------- */
.card { border: 1px solid var(--line); border-radius: var(--r-m); padding: 24px; display: flex; flex-direction: column; gap: 12px; background: var(--paper); }
.card--pad-s { padding: 18px 20px; }
.card--dark { background: var(--dark); border-color: var(--dark-line); color: var(--on-dark); }
.card--dark2 { background: var(--dark-2); border-color: var(--dark-line); color: var(--on-dark); }
.card--soft { background: var(--paper-2); border-color: transparent; }
.card--media { padding: 0; overflow: hidden; gap: 0; }
.card--media .card-body { padding: 18px 20px 22px; display: flex; flex-direction: column; gap: 8px; }
a.card { text-decoration: none; color: inherit; }
a.card:hover { border-color: var(--teal-ink); }
.card--link-row { flex-direction: row; justify-content: space-between; align-items: center; padding: 16px 18px; font-weight: 600; border-radius: 12px; }
.card--link-row .arrow { color: var(--teal-ink); }
.callout { border-radius: var(--r-m); padding: 22px 24px; display: flex; flex-direction: column; gap: 10px; }
.callout--alert { border: 2px solid var(--amber); }
.callout--alert h2, .callout--alert h3 { color: var(--amber-ink); }
.band--dark .callout--alert h3, .band--dark2 .callout--alert h3 { color: var(--amber); }
.callout--ok { border: 2px solid var(--teal); }
.callout--ok h3 { color: var(--teal-ink); }
.band--dark .callout--ok h3, .band--dark2 .callout--ok h3 { color: var(--teal); }
.callout--soft { background: var(--paper-2); }
.callout--outline { border: 1px solid var(--line); }
.callout--dark { background: var(--dark-2); border: 1px solid var(--dark-line); color: var(--on-dark); }
.callout h3 { font-size: 20px; }
.note-bar { border-left: 3px solid var(--amber); padding-left: 14px; }
.numeral { font-family: var(--serif); font-size: 44px; line-height: 1; color: var(--teal-ink); }
.band--dark .numeral, .band--dark2 .numeral, .card--dark .numeral, .card--dark2 .numeral { color: var(--teal); }
.stat { display: flex; flex-direction: column; gap: 4px; }
.stat b { font-family: var(--serif); font-weight: 400; font-size: clamp(44px, 4.6vw, 64px); line-height: 1; color: var(--teal); }
.stat span { font-size: 16px; color: var(--on-dark-2); }
.steps { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.step { border: 1px solid var(--line); border-radius: 18px; padding: 26px; display: flex; flex-direction: column; gap: 12px; }
.step .numeral { font-size: 48px; }
.step h3 { font-size: 24px; }
.myth { border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; }
.myth strong { display: inline; }
.list-cards { display: flex; flex-direction: column; gap: 10px; }
.ill { border-radius: 14px; overflow: hidden; }
.ill svg { width: 100%; height: auto; }

/* ---------- Tableaux ---------- */
.table-scroll { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-m); }
table.table { border-collapse: collapse; width: 100%; min-width: 640px; font-size: var(--t-m); }
.table th { text-align: left; background: var(--paper-3); padding: 12px 16px; border-bottom: 2px solid #c9d4db; font-weight: 700; }
.table td { padding: 13px 16px; border-bottom: 1px solid var(--line); color: var(--ink-2); vertical-align: top; }
.table tr:last-child td { border-bottom: 0; }
.table td:first-child { font-weight: 700; color: var(--ink); white-space: nowrap; }
.rows { border: 1px solid var(--line); border-radius: var(--r-m); overflow: hidden; }
.rows > div { display: grid; grid-template-columns: minmax(140px, 200px) minmax(0, 1fr); gap: 8px 16px; padding: 14px 20px; border-bottom: 1px solid var(--line); }
.rows > div:last-child { border-bottom: 0; }
.rows strong { color: var(--ink); }
.rows span { color: var(--ink-2); }
.compare { border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.compare > div { display: grid; grid-template-columns: minmax(120px, 200px) minmax(0, 1fr) minmax(0, 1fr); border-top: 1px solid var(--line); color: var(--ink-2); }
.compare > div:first-child { border-top: 0; background: var(--paper-3); font-weight: 700; color: var(--ink); }
.compare > div > div { padding: 14px 20px; }
.compare > div > div:first-child { font-weight: 700; color: var(--ink); }
.compare .head-cell { display: flex; align-items: center; gap: 12px; }
.compare .head-cell svg { width: 84px; border-radius: 10px; flex: none; }
@media (max-width: 640px) {
  .rows > div { grid-template-columns: 1fr; gap: 2px; }
  .compare > div { grid-template-columns: 1fr; }
  .compare > div > div:first-child { padding-bottom: 4px; }
  .compare > div:first-child > div:first-child { display: none; }
}

/* ---------- FAQ, sources ---------- */
.faq details { border-bottom: 1px solid var(--line); padding: 12px 0; }
.faq summary { font-weight: 700; font-size: 19px; cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 16px; align-items: baseline; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: var(--serif); font-size: 28px; line-height: 1; color: var(--teal-ink); flex: none; }
.faq details[open] summary::after { content: "–"; }
.faq details p { margin-top: 10px; color: var(--ink-2); }
.sources { font-size: var(--t-s); color: var(--ink-3); border-top: 1px solid var(--line); padding-top: 28px; display: flex; flex-direction: column; gap: 10px; }
.sources h2 { font-size: 28px; color: var(--ink); }
.sources ol { display: flex; flex-direction: column; gap: 4px; }
.sources li + li { margin-top: 0; }

/* ---------- Formulaires ---------- */
.field { display: flex; flex-direction: column; gap: 6px; font-weight: 600; font-size: 16px; }
.field > span { color: inherit; }
input[type="text"], input[type="email"], input[type="date"], select {
  font: inherit; font-size: 17px; min-height: 50px; padding: 0 14px; border-radius: 12px; border: 1.5px solid var(--line); background: var(--paper); color: var(--ink); width: 100%;
}
.band--dark input, .band--dark select, .band--dark2 input, .band--dark2 select, .card--dark input, .card--dark select, .card--dark2 input, .card--dark2 select { background: var(--dark-2); border-color: var(--dark-line-2); color: var(--on-dark); }
input[type="range"] { width: 100%; accent-color: var(--teal); min-height: 32px; }
button { font-family: inherit; }
fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.radios { display: flex; flex-wrap: wrap; gap: 8px; }
.radios label { display: inline-flex; align-items: center; gap: 8px; border: 1.5px solid var(--line); border-radius: 999px; min-height: 44px; padding: 0 14px 0 10px; font-weight: 500; cursor: pointer; }
.band--dark .radios label, .card--dark .radios label, .card--dark2 .radios label { border-color: var(--dark-line-2); }
.radios input { accent-color: var(--teal); width: 18px; height: 18px; margin: 0; }
.radios label:has(input:checked) { border-color: var(--teal); }
.form-row { display: flex; flex-wrap: wrap; gap: 10px; }
.form-row input { flex: 1 1 220px; border-radius: 999px; }
.form-row .btn { flex: none; }
.progress { height: 10px; background: var(--dark-line); border-radius: 999px; overflow: hidden; }
.progress > i { display: block; height: 100%; background: var(--teal); border-radius: 999px; }

/* ---------- Hero accueil : curseur ---------- */
.hero-panel { background: var(--dark-2); border: 1px solid var(--dark-line); border-radius: var(--r-l); padding: 22px; display: flex; flex-direction: column; gap: 14px; }
.hero-panel .top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.hero-panel .month { font-family: var(--serif); font-size: 30px; }
.hero-panel .ticks { position: relative; height: 18px; font-size: var(--t-xs); color: var(--on-dark-3); font-weight: 600; }
.hero-panel .ticks span { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; }
.hero-panel .ticks span:first-child { transform: none; }
.hero-panel .ticks span:last-child { transform: translateX(-100%); }
.hero-panel .month-text { font-size: 16px; color: var(--on-dark-2); min-height: 3.2em; }

/* ---------- Carte du corps ---------- */
.body-map { position: relative; max-width: 360px; margin-inline: auto; }
.hotspot { position: absolute; transform: translate(-50%, -50%); display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 12px; border-radius: 999px; background: var(--dark); color: #fff !important; font-weight: 700; font-size: 14px; text-decoration: none; border: 3px solid var(--teal); }
.hotspot:hover { background: var(--teal-deep); }

/* ---------- Plan de soins ---------- */
.timeline { display: flex; flex-direction: column; gap: 0; }
.timeline > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 6px 20px; padding: 16px 0; border-top: 1px solid var(--line); }
.timeline > div:first-child { border-top: 0; }
.timeline .when { font-weight: 700; }
.timeline .date { font-size: var(--t-s); color: var(--ink-3); }
@media (max-width: 560px) { .timeline > div { grid-template-columns: 1fr; gap: 2px; } }

/* ---------- Divers ---------- */
.swatches { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.swatches > div { display: flex; flex-direction: column; gap: 8px; align-items: center; text-align: center; font-size: 14px; font-weight: 700; color: var(--ink-2); }
.swatches svg { border-radius: 12px; width: 100%; height: auto; }
@media (max-width: 560px) { .swatches { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.article-list { display: flex; flex-direction: column; }
.toc { display: flex; flex-direction: column; gap: 6px; font-size: 16px; }
.toc a { text-decoration: none; }
.aside-col { position: sticky; top: 24px; }
.verified { border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; display: flex; flex-wrap: wrap; gap: 8px 28px; font-size: var(--t-s); color: var(--ink-2); }
.verified strong { color: var(--ink); }
.print-only { display: none; }
@media print {
  .site-header, .site-footer, .nav, .btn, .hero-panel input { display: none !important; }
  .band--dark, .band--dark2 { background: #fff !important; color: #000 !important; }
  a { color: #000; text-decoration: none; }
}

[hidden] { display: none !important; }

/* ---------- Palette Ivoire et laiton, sans bande sombre ---------- */
:root{
  --paper:#f8f5ef; --paper-2:#f1ece3; --paper-3:#ebe4d8; --line:#dcd4c6; --line-2:#c9bda9;
  --sand:#efe8dc; --sand-2:#f3eee5;
  --ink:#1b1d1f; --ink-2:#4a4d50; --ink-3:#6d7073;
  --dark:#efe8dc; --dark-2:#f3eee5; --dark-line:#dcd4c6; --dark-line-2:#c9bda9;
  --on-dark:#1b1d1f; --on-dark-2:#4a4d50; --on-dark-3:#6d7073;
  --teal:#c9a96e; --teal-ink:#8a6d3b; --teal-deep:#6e5530; --teal-pale:#e8dcc2;
  --amber:#c57b5a; --amber-ink:#9a5a3e; --consensus:#85566a; --grey-badge:#8a8f93;
}
h1,h2{font-weight:500;letter-spacing:-0.004em}
h1{line-height:1.02}
.brand{font-weight:600;font-size:29px}
.stat b,.numeral,.step .numeral{font-weight:500}
.site-header{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line)}
.brand,.nav a{color:var(--ink) !important}
.nav a:hover{border-bottom-color:var(--line-2)}
.nav a.btn,.btn--primary,.btn--primary:hover,.skip{color:var(--ink) !important}
.nav-toggle{border-color:var(--line-2);color:var(--ink)}
@media (max-width:900px){.nav{border-top-color:var(--line)}.nav a{border-bottom-color:var(--line)}}
.band + .band--dark,.band--dark + .band--dark2,.band--dark2 + .band--dark,.band--dark + .band,.band--dark2 + .band{border-top:1px solid var(--line)}
.band--dark a:not(.btn),.band--dark2 a:not(.btn){color:var(--teal-ink)}
.band--dark a:not(.btn):hover,.band--dark2 a:not(.btn):hover{color:var(--teal-deep)}
.band--dark .kicker,.band--dark2 .kicker{color:var(--teal-ink)}
.band--dark .badge--first,.band--dark2 .badge--first,.card--dark .badge--first{color:var(--teal-ink)}
.band--dark .badge--consensus,.band--dark2 .badge--consensus,.card--dark .badge--consensus{color:var(--consensus)}
.band--dark .badge--none,.band--dark2 .badge--none,.card--dark .badge--none{color:var(--ink-3);border-color:var(--grey-badge)}
.band--dark .callout--alert h3,.band--dark2 .callout--alert h3{color:var(--amber-ink)}
.band--dark .callout--ok h3,.band--dark2 .callout--ok h3{color:var(--teal-ink)}
.band--dark .numeral,.band--dark2 .numeral,.card--dark .numeral,.card--dark2 .numeral{color:var(--teal-ink)}
.stat b{color:var(--teal-ink)}
.stat span{color:var(--ink-2)}
.card--dark{background:var(--paper);border-color:var(--line);color:var(--ink)}
.card--dark2{background:var(--sand-2);border-color:var(--line);color:var(--ink)}
.callout--dark{background:var(--paper);border-color:var(--line);color:var(--ink)}
.hero-panel{background:var(--paper);border-color:var(--line)}
.hero-panel .ticks{color:var(--ink-3)}
.hero-panel .month-text{color:var(--ink-2)}
.btn--ghost{border-color:var(--ink);color:var(--ink) !important}
.btn--ghost:hover{border-color:var(--teal-ink)}
.chip{border-color:var(--line-2)}
.chip:hover{border-color:var(--teal-ink)}
.site-footer{background:var(--sand);color:var(--ink-2);border-top-color:var(--line)}
.site-footer a{color:var(--ink)}
.site-footer a:hover{color:var(--teal-ink)}
.hotspot{background:var(--teal);color:var(--ink) !important;border-color:#ffffff;box-shadow:0 2px 10px rgba(27,29,31,.18)}
.hotspot:hover{background:#bb9a60}
.progress{background:var(--line)}
.progress > i{background:var(--teal-ink)}
.band--dark input,.band--dark select,.band--dark2 input,.band--dark2 select,.card--dark input,.card--dark select,.card--dark2 input,.card--dark2 select{background:#ffffff;border-color:var(--line-2);color:var(--ink)}
.band--dark .radios label,.card--dark .radios label,.card--dark2 .radios label{border-color:var(--line-2)}
.radios label:has(input:checked){border-color:var(--teal-ink)}
input[type="range"]{accent-color:var(--teal-ink)}
.radios input{accent-color:var(--teal-ink)}
.faq summary::after{color:var(--teal-ink)}
:focus-visible{outline-color:var(--teal-ink)}
.table th{background:var(--paper-3);border-bottom-color:var(--line-2)}
.compare > div:first-child{background:var(--paper-3)}
.band--dark sup,.band--dark2 sup,.card--dark sup{color:var(--ink-3)}

/* ---------- Finition « maison » : vide, filets, typographie ---------- */
:root{ --r-s:6px; --r-m:8px; --r-l:10px; --t-h1: clamp(46px, 6vw + 8px, 88px); --t-h2: clamp(34px, 3.6vw + 8px, 56px); --t-lead: clamp(18px, 1.1vw + 12px, 21px); }
h1,h2{font-weight:400;letter-spacing:-0.015em}
h1{line-height:0.98}
h1 em,h2 em{font-style:italic;font-weight:400}
.brand{font-weight:400;font-size:30px;letter-spacing:-0.01em}
.section{padding-block:clamp(64px, 9vw, 120px)}
.section--hero{padding-block:clamp(56px, 8vw, 104px)}
.kicker{font-weight:500;font-size:12px;letter-spacing:0.14em;color:var(--teal-ink)}
a{color:var(--ink);text-decoration-color:var(--teal);text-decoration-thickness:1px;text-underline-offset:4px}
a:hover{color:var(--teal-ink)}
.band--dark a:not(.btn),.band--dark2 a:not(.btn){color:var(--ink)}
.band--dark a:not(.btn):hover,.band--dark2 a:not(.btn):hover{color:var(--teal-ink)}
.site-header .wrap{padding-block:20px}
.nav{font-weight:500;font-size:15px;gap:4px 26px}
.nav a{border-bottom-width:1px;padding:4px 0}
.nav a[aria-current="page"]{border-bottom-color:var(--ink)}
.btn{border-radius:6px;font-weight:600;font-size:16px;letter-spacing:0.01em;min-height:50px;padding:0 24px}
.btn--l{min-height:56px;padding:0 30px;font-size:17px}
.btn--s{min-height:42px;padding:0 18px;font-size:15px}
.nav a.btn{border-radius:6px;background:var(--ink);color:var(--paper) !important}
.nav a.btn:hover{background:#2a2d30}
.btn--primary{background:var(--ink);color:var(--paper) !important}
.btn--primary:hover{background:#2a2d30;color:var(--paper) !important}
.btn--ghost{border:1px solid var(--ink);color:var(--ink) !important;background:transparent}
.btn--ghost:hover{background:var(--ink);color:var(--paper) !important}
.chip{border:1px solid var(--line-2);border-radius:6px;min-height:40px;font-size:15px;font-weight:500;padding:0 14px}
.chip:hover{border-color:var(--ink)}
.badge{border:0;padding:0;font-size:11px;letter-spacing:0.12em;text-transform:uppercase;font-weight:600;border-radius:0}
.badge::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:8px;position:relative;top:-1px}
.card{border:0;background:var(--paper);border-radius:var(--r-m);padding:28px;box-shadow:0 0 0 1px rgba(27,29,31,0.04)}
.band:not(.band--dark):not(.band--dark2) .card:not(.card--dark):not(.card--dark2):not(.card--soft){background:var(--sand-2)}
.card--dark{background:var(--paper)}
.card--dark2{background:var(--sand-2)}
.card--link-row{background:transparent !important;box-shadow:none;border-bottom:1px solid var(--line);border-radius:0;padding:18px 4px;font-weight:500}
.card--link-row:hover{border-bottom-color:var(--ink)}
.card--link-row .arrow{color:var(--teal-ink)}
a.card:hover{box-shadow:0 0 0 1px var(--line-2)}
.card--media{box-shadow:0 0 0 1px rgba(27,29,31,0.06)}
.card--media svg{border-radius:0}
.callout{border-radius:var(--r-m)}
.callout--alert{border:1px solid var(--amber);background:#fbf3ec}
.callout--ok{border:1px solid var(--teal);background:#f7f1e4}
.callout--soft,.callout--dark{background:var(--sand-2);border:0}
.callout--outline{border:1px solid var(--line)}
.myth{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:16px 2px}
.list-cards{gap:0}
.hero-panel{background:transparent;border:0;padding:0;gap:16px}
.hero-panel svg{border-radius:var(--r-l) !important;box-shadow:0 18px 40px -24px rgba(27,29,31,0.35)}
.hero-panel .month{font-size:34px}
.stat b{font-size:clamp(48px, 5vw, 72px)}
.stat span{font-size:15px;letter-spacing:0.01em}
.step{border:0;background:var(--sand-2);border-radius:var(--r-m);padding:30px}
.step .numeral,.numeral{font-size:40px}
.table-scroll{border:0;border-top:1px solid var(--ink);border-radius:0}
.table th{background:transparent;border-bottom:1px solid var(--line-2);font-size:12px;letter-spacing:0.1em;text-transform:uppercase;font-weight:600;color:var(--ink-3);padding:14px 16px}
.table td{padding:16px;border-bottom-color:var(--line)}
.rows{border:0;border-top:1px solid var(--ink);border-radius:0}
.rows > div{padding:16px 4px}
.compare{border:0;border-top:1px solid var(--ink);border-radius:0}
.compare > div:first-child{background:transparent}
.compare > div > div{padding:16px 12px}
.faq summary{font-size:20px;font-weight:600}
.faq details{padding:16px 0}
.sources{border-top:1px solid var(--line)}
.site-footer{background:var(--paper);border-top:1px solid var(--line)}
.site-footer .wrap{padding-block:48px}
.verified{border:0;background:var(--sand-2);border-radius:var(--r-m)}
.hotspot{border-radius:6px;min-height:36px;font-size:13px;letter-spacing:0.04em;background:var(--paper);color:var(--ink) !important;border:1px solid var(--ink);box-shadow:none}
.hotspot:hover{background:var(--ink);color:var(--paper) !important}
input[type="text"],input[type="email"],input[type="date"],select{border-radius:6px;background:#fff;border-color:var(--line-2)}
.form-row input{border-radius:6px}
.radios label{border-radius:6px;border-color:var(--line-2)}
.radios label:has(input:checked){border-color:var(--ink);background:var(--paper)}
.head-row > p{max-width:440px}
.swatches svg{border-radius:var(--r-m)}
.ill,.ill svg{border-radius:var(--r-l)}

/* Sources plus discrètes */
.sources{font-size:13px;line-height:1.5;color:var(--ink-3)}
.sources h2{font-size:22px}
.sources ol{gap:3px;padding-left:18px}
sup{font-size:0.62em}
.hero-photo img{aspect-ratio:3/2;object-fit:cover}
#financement ~ * .small, ol.muted.small{font-size:13px}

/* ---------- Couche « maison » : barre haute, manifeste, bande d'image, pied, CTA mobile ---------- */
.topbar{background:var(--paper);border-bottom:1px solid var(--line);font-size:11.5px;letter-spacing:0.08em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.topbar .wrap{display:flex;flex-wrap:wrap;gap:6px 28px;justify-content:center;padding-block:9px}
.topbar span+span::before{content:"";display:inline-block;width:3px;height:3px;border-radius:50%;background:var(--line-2);margin:0 14px 3px -14px}
@media (max-width:640px){.topbar span:nth-child(n+2){display:none}}
.nav a{position:relative;border-bottom:0 !important}
.nav a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.nav a:not(.btn):hover::after,.nav a[aria-current="page"]:not(.btn)::after{transform:scaleX(1)}
.manifesto-text{font-family:var(--serif);font-size:clamp(30px, 3.4vw + 8px, 52px);line-height:1.12;letter-spacing:-0.01em;max-width:22ch;text-wrap:balance}
.manifesto-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:28px 40px;margin-top:28px;text-align:left;max-width:1000px;border-top:1px solid var(--line);padding-top:32px}
.manifesto-cols > div{display:flex;flex-direction:column;gap:6px}
.manifesto-cols strong{font-size:17px}
.manifesto-cols span{color:var(--ink-2);font-size:15px}
.art-band{line-height:0;background:var(--paper)}
.art-band img{width:100%;height:clamp(220px,36vw,520px);object-fit:cover;display:block}
.site-footer .wrap{padding-block:56px 28px;gap:36px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px 40px}
.foot-grid > div{min-width:0}
.foot-col{display:flex;flex-direction:column;gap:10px;font-size:15px}
.foot-col h4{font-size:11.5px;letter-spacing:0.1em;text-transform:uppercase;color:var(--ink-3);font-weight:600;margin-bottom:4px}
.foot-col a{text-decoration:none;color:var(--ink)}
.foot-col a:hover{color:var(--teal-ink)}
.foot-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;border-top:1px solid var(--line);padding-top:20px;font-size:13px;color:var(--ink-3)}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}
.sticky-cta{display:none}
@media (max-width:900px){
  .sticky-cta{display:flex;position:fixed;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:30;align-items:center;justify-content:center;min-height:52px;background:var(--ink);color:var(--paper) !important;text-decoration:none;font-weight:600;border-radius:8px;box-shadow:0 12px 30px -12px rgba(27,29,31,.5)}
  body{padding-bottom:84px}
}
@media (prefers-reduced-motion: no-preference){
  .section--hero > *{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
  .section--hero > *:nth-child(2){animation-delay:.12s}
  @keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}

/* ---- Typographie v1.8 : grotesque plus calme sous les titres en serif ---- */
:root{--sans:'Hanken Grotesk','Instrument Sans','Segoe UI',Helvetica,Arial,sans-serif;--t-b:17.5px}
body{line-height:1.6}
h3{font-family:var(--serif);font-weight:400;font-size:25px;line-height:1.15;letter-spacing:-0.005em}
h4{font-weight:600}
strong{font-weight:600}
.lead{letter-spacing:-0.004em}
.btn{font-weight:500;letter-spacing:0.02em}
.kicker{font-weight:500;letter-spacing:0.16em}
.nav a{font-weight:500}
.faq summary{font-weight:500;font-size:19px}
.table th{font-weight:500}
.table td:first-child{font-weight:500}
.compare > div:first-child,.compare > div > div:first-child{font-weight:500}
.timeline .when{font-weight:500}
.card--link-row{font-weight:500}
.rows strong{font-weight:500}
.step h2{font-family:var(--serif) !important;font-weight:400 !important;font-size:30px !important}
.callout h2{font-family:var(--serif) !important;font-weight:400 !important}
.myth strong{font-weight:500}
.hotspot{font-weight:500}
.verified strong,.verified span{font-weight:500}
p[style*="font-weight: 700"],span[style*="font-weight: 700"],strong[style*="font-size: 18px"]{font-weight:600 !important}
a[style*="font-weight: 700"]{font-weight:500 !important}
.aside-col h3{font-size:20px !important}
sup{white-space:nowrap}

/* ---- v2.0 : direction éditoriale ---- */
.swatches--v2{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.swatches--v2 figure{margin:0}
.swatches--v2 svg{width:100%;height:auto;display:block;border-radius:0}
.swatches--v2 figcaption{font-family:var(--serif);font-size:18px;margin-top:8px;color:var(--ink)}
@media (max-width:560px){.swatches--v2{gap:6px}.swatches--v2 figcaption{font-size:14px}}
.body-map--v2{max-width:420px;margin:auto}
.body-map--v2 svg{width:100%;height:auto;overflow:visible}
.body-map--v2 text{font-family:var(--sans);font-size:8.5px;letter-spacing:1.4px;fill:var(--ink)}
.body-map--v2 .bm-pt{cursor:pointer}
.body-map--v2 .bm-pt:hover text,.body-map--v2 .bm-pt:focus text{fill:#8a6d3b}
.body-map--v2 .bm-pt:hover .bm-ring{opacity:1;stroke-width:1}
.ed-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
@media (max-width:900px){.ed-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ed-grid{grid-template-columns:1fr;gap:28px}}
.ed-col{border-top:1px solid var(--ink);padding-top:18px;display:flex;flex-direction:column;gap:10px}
.ed-num{font-family:var(--serif);font-size:56px;line-height:1;color:#8a6d3b}
.ed-col h3{font-size:28px}
.ed-col p{font-size:16px}
.ill svg{border-radius:2px}
.schema{margin:0;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:24px 32px;align-items:center;background:var(--paper-2);padding:24px}
.schema svg{width:100%;height:auto;display:block}
.schema text{font-family:var(--sans);font-size:5.2px;letter-spacing:0.9px;fill:var(--ink)}
.schema ul{margin:0 0 12px;padding-left:18px;display:flex;flex-direction:column;gap:8px;font-size:16px;color:var(--ink-2)}
@media (max-width:700px){.schema{grid-template-columns:1fr;padding:16px}.schema text{font-size:6.5px}}

/* ---- v2.1 : logo plus présent, surtitres en serif italique ---- */
.site-header .brand{font-size:40px;gap:12px;letter-spacing:-0.015em}
.site-header .brand svg{width:46px;height:46px}
.site-footer .brand{font-size:34px}
.site-footer .brand svg{width:40px;height:40px}
@media (max-width:560px){.site-header .brand{font-size:32px}.site-header .brand svg{width:38px;height:38px}}
.kicker{font-family:var(--serif);font-style:italic;font-weight:400;text-transform:none;letter-spacing:0;font-size:22px;line-height:1.2;color:var(--teal-ink)}
.ed-col .ed-num + h3{margin-top:2px}
.stats-v2{display:grid;grid-template-columns:repeat(4,1fr);row-gap:40px}
.stats-v2 .stat--hero{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 40px;border-bottom:1px solid var(--line-2);padding-bottom:36px}
.stats-v2 .stat--hero b{font-size:clamp(64px,9vw,136px);letter-spacing:-0.02em;color:var(--ink)}
.stats-v2 .stat--hero span{font-size:19px;max-width:34ch;color:var(--ink-2)}
@media (max-width:700px){.stats-v2{grid-template-columns:1fr 1fr}}

/* ---- v2.3 : texte en serif de lecture, noir et blanc ---- */
:root{--sans:'Newsreader',Georgia,'Times New Roman',serif;--ui:'Hanken Grotesk','Segoe UI',Helvetica,Arial,sans-serif;
  --paper:#ffffff;--paper-2:#f6f6f5;--paper-3:#f6f6f5;--sand:#f6f6f5;--sand-2:#fafafa;--line:#e6e6e4;--line-2:#d0d0cd;--teal-ink:#1b1d1f;--teal:#1b1d1f}
body{background:#fff;font-size:19px;line-height:1.55}
.btn,.nav a,.nav-toggle,.topbar,.table th,.chip,.hotspot,.sticky-cta,.form-row input,.foot-col h4,.foot-bottom,.swatches span,label,input,select,button{font-family:var(--ui)}
.band,.band--dark,.band--dark2,.band--soft,.topbar,.site-header,.site-footer{background:#fff !important}
.band + .band{border-top:1px solid var(--line)}
.card,.card--dark,.card--dark2,.card--soft,.callout--soft,.verified,.schema{background:#f6f6f5}
.ed-num,.stat b,.numeral,.kicker{color:#1b1d1f !important}
.kicker{opacity:.62}
a{color:#1b1d1f}

/* ---- v2.4 ---- */
.body-map--v2 text{font-family:var(--serif);font-size:13px;letter-spacing:0;fill:var(--ink)}
.schema text{font-family:var(--serif);font-size:7.5px;letter-spacing:0}
.site-header .brand{font-size:46px;gap:12px}
.site-header .brand svg{width:52px;height:52px}
@media (max-width:900px){.site-header .brand{font-size:40px}.site-header .brand svg{width:44px;height:44px}
  .nav-toggle{font-size:14px;min-height:36px;padding:0 14px}}
.op-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.rows > div > .op-list{color:var(--ink-2)}
.foot-bottom{font-family:var(--serif);font-size:16px;letter-spacing:0}
.disclaimer{font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.4;color:var(--ink-2);border-left:1px solid var(--ink);padding:2px 0 2px 16px;max-width:60ch}
.disclaimer--end{margin:32px 0 8px}

/* ---- v3.3 : mise en page éditoriale (polices inchangées) ---- */
/* 4. Pages intérieures : filets fins au lieu de cartes */
main .card:not(.card--link-row):not(.card--media):not(.toc),.step,.verified{
  background:transparent !important;border:0 !important;border-top:1px solid var(--ink) !important;border-radius:0 !important;box-shadow:none !important;padding:20px 0 0 !important}
.aside-col .card{border-top:1px solid var(--line-2) !important}
.aside-col .card.toc{background:transparent !important;border:0 !important;border-top:1px solid var(--line-2) !important;border-radius:0 !important;padding:20px 0 0 !important;box-shadow:none !important}
.verified{border-bottom:1px solid var(--line) !important;padding-bottom:14px !important}
.numeral,.step .numeral{font-family:var(--serif);font-size:56px;line-height:1;color:var(--ink) !important;font-weight:400}
.callout:not(.callout--alert){background:transparent !important;border:0 !important;border-left:1px solid var(--ink) !important;border-radius:0 !important;padding:4px 0 4px 22px !important}
.callout--alert{background:#fbfaf9 !important;border:1px solid var(--ink) !important;border-radius:0 !important}
.schema{background:#f7f7f6 !important;border-radius:0}
.myth{border-bottom:1px solid var(--line)}
.card--link-row{border-radius:0 !important}
/* puces « Ma cicatrice… » : liens éditoriaux */
.chip{border:0 !important;border-bottom:1px solid var(--line-2) !important;border-radius:0 !important;background:none !important;min-height:0 !important;padding:2px 0 !important;font-size:15px !important;font-weight:500 !important;color:var(--ink) !important}
.chip:hover{border-bottom-color:var(--ink) !important}
.cluster:has(> .chip){gap:10px 26px}
.btn{border-radius:2px}

/* 5. Illustrations à bords droits */
.card--media,.card--media svg,.ill,.ill svg,.hero-panel svg,main figure svg{border-radius:0 !important}
.card--media{border:0 !important;background:none !important}
.card--media .card-body{padding:16px 0 0 !important}
.hero-panel{border-radius:0;border:0;background:none;padding:0}

/* 6. Apparition douce au défilement */
@media (prefers-reduced-motion: no-preference){
  .reveal{opacity:0;transform:translateY(18px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
  .reveal.in{opacity:1;transform:none}
}
.card--media,.card--link-row{box-shadow:none !important}
#types svg{border-radius:0 !important}
@media (max-width:700px){#types .grid--5{grid-template-columns:1fr 1fr !important;gap:20px 14px}}

main > section.band:first-child + .wrap.section{padding-top:40px}
picture{display:block}
/* impression des fiches */
@media print{
  .topbar,.site-header,.site-footer,.sticky-cta,.aside-col,.nav-toggle,.skip,.disclaimer--end{display:none !important}
  body{font-size:11.5pt;background:#fff;color:#000}
  .section,.section--hero{padding-block:12pt !important}
  h1{font-size:28pt}h2{font-size:18pt;break-after:avoid}
  .swatches--v2,.schema,.table-scroll,.callout,.faq details{break-inside:avoid}
  .faq details{display:block}.faq details > *{display:block}
  a{color:#000;text-decoration:none}
  .reveal{opacity:1 !important;transform:none !important}
  .section--hero .ill{display:none !important}
  .stack--xl,.stack--l,.split,.stack{gap:10pt !important}
  .section{padding-block:6pt !important}
  .verified,.disclaimer{margin:0 !important}
  .swatches--v2 svg{max-height:90pt}
  .schema svg{max-height:200pt}
}

.ed-grid--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:900px){.ed-grid--3{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.ed-grid--3{grid-template-columns:1fr}}
.chrono-pick{display:flex;flex-wrap:wrap;gap:20px 48px;align-items:flex-end;border-top:1px solid var(--ink);padding-top:22px;max-width:900px}
.chrono-pick .field{margin:0}

/* ---- v5 : frise des soins (v6.1 : polices du texte courant, repères numérotés) ---- */
.frise{margin:4px 0 8px;border-top:1px solid var(--ink);padding-top:16px}
.frise__scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.frise__in{display:flex;flex-direction:column;min-width:600px}
.frise__row{display:grid;grid-template-columns:150px 1fr;align-items:center;min-height:42px}
.frise__label{font-family:var(--sans);font-size:16px;line-height:1.2;color:var(--ink);padding-right:14px}
.frise__label--q{font-style:italic;color:var(--ink-3)}
.frise__track{position:relative;height:42px}
.frise__track > i{position:absolute;top:0;bottom:0;width:1px;background:var(--line)}
.frise__track > i.frise__vl{background:none;border-left:1px dotted #b49a6a;width:0}
.frise__bar{position:absolute;top:15px;height:6px;background:#8a6d3b;border-radius:3px}
.frise__bar--opt{background:repeating-linear-gradient(90deg,#8a6d3b 0 6px,transparent 6px 10px);opacity:.85}
.frise__bar--fade{background:linear-gradient(90deg,#8a6d3b 0 70%,rgba(138,109,59,0))}
.frise__track > em{position:absolute;top:24px;font-family:var(--sans);font-style:italic;font-size:13.5px;line-height:1.2;color:var(--ink-3);white-space:nowrap;padding-top:1px}
.frise__row--marks{min-height:44px}
.frise__row--marks .frise__track{height:44px}
.frise__badge{position:absolute;top:19px;transform:translateX(-50%);width:19px;height:19px;border-radius:50%;border:1px solid #8a6d3b;background:#fff;color:#6f5730;font-family:var(--sans);font-size:12px;line-height:17px;text-align:center}
.frise__badge--l1{top:0}
.frise__row--scale{min-height:30px;border-top:1px solid var(--ink)}
.frise__row--scale .frise__track{height:30px}
.frise__row--scale .frise__track span{position:absolute;top:6px;transform:translateX(-50%);font-family:var(--sans);font-size:13px;color:var(--ink-3);white-space:nowrap}
.frise__row--scale .frise__track span:first-child{transform:none}
.frise__row--scale .frise__track span:last-child{transform:translateX(-100%)}
.frise__legend{list-style:none;margin:14px 0 0;padding:14px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:8px 28px;font-family:var(--sans);font-size:16px;color:var(--ink)}
.frise__legend li{display:flex;gap:10px;align-items:baseline}
.frise__legend b{flex:none;width:19px;height:19px;border-radius:50%;border:1px solid #8a6d3b;color:#6f5730;font-weight:400;font-size:12px;line-height:17px;text-align:center;transform:translateY(-1px)}
.frise__legend em{color:var(--ink-3)}
.frise figcaption{font-family:var(--sans);font-style:italic;font-size:14px;color:var(--ink-3);margin-top:10px}
.frise__hint{display:none}
@media (max-width:700px){.frise__hint{display:inline}.frise__row{grid-template-columns:104px 1fr}.frise__label{font-size:15px}.frise__in{min-width:660px}}
@media print{.frise__scroll{overflow:visible}.frise__in{min-width:0}}
/* ---- v5 : schéma à deux temps ---- */
.schema--pair{align-items:start}
.schema__main{position:relative}
.schema__when{display:block;font-family:var(--serif);font-style:italic;font-size:16px;line-height:1.25;color:var(--ink-3);margin-top:8px}
.schema__late{border-bottom:1px solid var(--line-2);padding-bottom:14px;margin-bottom:16px}
.schema__late svg{max-width:260px}
.schema--pair .schema__main svg path[stroke="#94603f"]{stroke:#9b4a3c}

/* ---- v5 : bandeaux de peau ---- */
.skin-band{position:relative;line-height:0;background:#f6f6f5;overflow:hidden}
.skin-band img{width:100%;height:clamp(240px,30vw,440px);object-fit:cover;display:block;filter:grayscale(1) contrast(.92) brightness(1.06)}
.skin-band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.88) 0%,rgba(255,255,255,.62) 38%,rgba(255,255,255,0) 72%)}
.skin-band__text{position:absolute;z-index:1;left:max(var(--gutter),calc((100vw - var(--wrap)) / 2 + 24px));top:50%;transform:translateY(-50%);max-width:min(600px,80vw);line-height:1.12;display:flex;flex-direction:column;gap:14px}
.skin-band__text p{font-family:var(--serif);font-size:clamp(30px,3.2vw + 8px,50px);letter-spacing:-0.01em;color:var(--ink);margin:0;text-wrap:balance}
.skin-band__text span{font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.35;color:var(--ink-2)}
@media (max-width:700px){.skin-band::after{background:linear-gradient(90deg,rgba(255,255,255,.9),rgba(255,255,255,.55))}}
.ill--skin svg{background:#efe9df}
@media print{.skin-band{display:none}}
.schema--wide{grid-template-columns:1fr}
.schema--wide .schema__late{display:flex;gap:20px;align-items:center}
.schema--wide .schema__late svg{max-width:340px}
@media (max-width:700px){.schema--wide .schema__late{flex-direction:column;align-items:flex-start}}
.schema--wide text{font-size:10.5px}

/* ---- v5.1 : opérations groupées, pied de page à deux colonnes ---- */
.op-groups{display:grid;grid-template-columns:1fr 1fr;gap:28px 32px}
.op-group{display:flex;flex-direction:column;gap:0}
.op-group h3{font-family:var(--serif);font-weight:400;font-style:italic;font-size:21px;color:var(--ink-3);margin-bottom:6px}
.op-group .card--link-row{padding:11px 0 !important;font-size:17px}
@media (max-width:560px){.op-groups{grid-template-columns:1fr}}
.foot-grid{grid-template-columns:1.15fr .95fr 2.1fr .8fr}
.foot-col--ops{display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;align-content:start}
.foot-col--ops h4{grid-column:1 / -1}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}.foot-col--ops{grid-column:1 / -1}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}.foot-col--ops{grid-template-columns:1fr 1fr}}

/* ---- v6 : schémas au trait et lavis ---- */
.schema6{margin:0;display:flex;flex-direction:column;gap:18px;border-top:1px solid var(--ink);padding-top:20px}
.schema6__main svg{width:100%;height:auto;display:block}
.schema6 .lbl{font-family:var(--sans);font-style:italic;font-size:17px;fill:var(--ink)}
.schema6 .cap{font-family:var(--sans);font-style:italic;font-size:15px;fill:var(--ink-3)}
.schema6__cap{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:20px 32px;align-items:start;border-top:1px solid var(--line);padding-top:18px}
.schema6__late svg{width:100%;height:auto;display:block}
.schema6__when{display:block;font-family:var(--sans);font-style:italic;font-size:15px;line-height:1.3;color:var(--ink-3);margin-top:6px}
.schema6__cap ul{margin:0 0 10px;padding-left:18px;display:flex;flex-direction:column;gap:8px;font-size:16px;color:var(--ink-2)}
.schema6--wide .schema6__cap{grid-template-columns:minmax(0,340px) minmax(0,1fr)}
@media (max-width:700px){.schema6__cap,.schema6--wide .schema6__cap{grid-template-columns:1fr}.schema6__late{max-width:240px}.schema6 .lbl{font-size:23px}.schema6--wide .lbl{font-size:26px}.schema6 .cap{font-size:22px}}
@media print{.schema6__main svg{max-height:200pt}}

/* ---- v6.1 : petites légendes dans la police du texte courant ---- */
.schema6 .lbl,.schema6 .cap{font-family:var(--sans) !important;font-style:italic}
.schema6__when{font-family:var(--sans) !important;font-size:15px}
.swatches--v2 figcaption{font-family:var(--sans) !important;font-size:15px}
.table th{font-family:var(--sans) !important;font-size:13px;letter-spacing:.06em}

/* ---- v7 : en-tête au trait, fiches aérées, pied de page resserré ---- */
.ill--line{background:none;padding:0}
.ill--line svg{width:100%;height:auto;max-height:440px;display:block;margin:0 auto}
.hero-note{font-family:var(--sans);font-style:italic;font-size:15px;color:var(--ink-3);margin:0;max-width:52ch}
article.stack--xl{gap:72px}
article.stack--xl > .card:first-child{margin-top:4px}
article.stack--xl section > h2{margin-bottom:6px}
@media (max-width:700px){article.stack--xl{gap:52px}}
.foot-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}
.foot-more{font-style:italic;color:var(--ink-3) !important;margin-top:4px}
.ill--line .cap{display:none}
@media (max-width:700px){.ill--line svg{max-height:260px}}