/* =====================================================================
   chapters.css — Composants de récit détaillé (thème sombre Figma)
   Gabarit établi sur le Ch.2 « Surveillance » (OMTDR).
   Réutilisable pour Ch.1 / 3 / 4 / 5.
   ===================================================================== */

/* ---- Bande / mouvement narratif ---- */
.movement { position: relative; padding-block: clamp(2.6rem, 6vw, 5.5rem); }
#surveillance .chapter-head + .movement { padding-top: 0; }
#surveillance .context-keyword { color: var(--neon); }
#surveillance .chapter-head + .movement :is(p, .prose) { max-width: none; }
#pronostic .chapter-head .movement .movement__lead { max-width: none; }
.sm-lock { fill: none; stroke: var(--neon); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.sm-lock-bg { fill: var(--charcoal-2); stroke: var(--neon); stroke-width: 1.6; }
#surveillance .chapter-head + .movement .synthese__ans li { font-size: 1.25rem; }
#surveillance .chapter-head + .movement .foot-note {
  font-size: 1.25rem;
  color: var(--neon);
}
.movement + .movement { border-top: 1px solid var(--line); }
.movement__eyebrow {
  display: inline-flex; align-items: center; gap: 0.6rem;
  font-family: var(--font-mono); font-size: 1.25rem;
  letter-spacing: 0; text-transform: uppercase; color: var(--neon);
  margin-bottom: 1.1rem;
}
.movement__eyebrow::before { content: ""; width: 26px; height: 1.5px; background: var(--neon); border-radius: 2px; }
.movement__title {
  font-family: var(--font-display); font-weight: 300; text-transform: uppercase;
  font-size: var(--t-h2); line-height: 1.02; letter-spacing: -0.02em; color: #fff;
  margin: 0 0 1rem; max-width: 22ch;
}
.movement__title em { font-style: normal; color: var(--neon); }
.movement__lead { font-size: var(--t-lead); color: var(--ink-soft); line-height: 1.6; max-width: 60ch; }
.contribution-icon { display: inline-block; width: 1.2em; height: 1.2em; margin-right: 0.4em; vertical-align: -0.2em; color: var(--neon); }
.prose { color: var(--muted); line-height: 1.7; max-width: 62ch; }
p:has(.contribution-icon) { font-size: var(--t-lead); }
.prose + .prose { margin-top: 1rem; }
.prose strong, .prose b { color: #fff; font-weight: 600; }
.prose em { color: var(--neon-2); font-style: normal; }

/* Disposition 2 colonnes (texte + média collant) */
.movement__grid { display: grid; gap: clamp(1.75rem, 4vw, 3.5rem); align-items: start; }
@media (min-width: 960px) {
  .movement__grid { grid-template-columns: 1.05fr 0.95fr; }
  .movement__grid--sticky .movement__aside { position: sticky; top: 12vh; }
}

/* ---- Équations KaTeX ---- */
.eqs { display: grid; gap: 0.7rem; margin: 1.4rem 0; }
.eq {
  position: relative; display: flex; align-items: center; gap: 1rem;
  padding: 0.85rem 1.1rem 0.85rem 1.2rem;
  background: var(--glass); border: 1px solid var(--line);
  border-left: 2px solid var(--neon); border-radius: 8px; overflow-x: auto;
}
.eq__body { flex: 1 1 auto; color: #fff; min-width: 0; }
.eq__body .katex { font-size: 1.05em; }
.eq__num { flex: 0 0 auto; font-family: var(--font-mono); font-size: var(--t-micro); color: var(--faint); letter-spacing: 0.08em; }
.eq-note { font-size: var(--t-small); color: var(--muted); margin: 0.4rem 0 0; }

.info-note { min-width: 0; }
.info-note__toggle {
  position: relative; display: grid; place-items: center; width: 44px; height: 44px;
  padding: 0; border: 1px solid var(--neon); border-radius: 8px; list-style: none;
  background: var(--charcoal-2); color: #fff; cursor: pointer;
  transition: background-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.info-note__toggle::-webkit-details-marker { display: none; }
.info-note__toggle > svg { width: 20px; height: 20px; pointer-events: none; }
.info-note[open] > .info-note__toggle { background: var(--neon); }
.info-note__toggle:hover { background: var(--neon-2); box-shadow: 0 0 0 3px var(--neon-soft); }
.info-note__toggle:active { transform: scale(.95); }
.info-note__toggle:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.info-note__tooltip {
  position: absolute; bottom: calc(100% + .6rem); left: 0; z-index: 2;
  width: max-content; max-width: min(18rem, calc(100vw - 3rem)); padding: .45rem .65rem;
  border: 1px solid var(--line); border-radius: 6px; background: var(--charcoal-3); color: #fff;
  font-size: .75rem; line-height: 1.4; text-align: center; pointer-events: none;
  opacity: 0; transition: opacity var(--dur) var(--ease-out);
}
.info-note__toggle:hover .info-note__tooltip,
.info-note__toggle:focus-visible .info-note__tooltip { opacity: 1; }
.info-note__body { display: grid; gap: 1rem; margin-top: 1rem; padding-left: 1rem; border-left: 2px solid var(--line); }
.info-note__body > .eq-note { margin: 0; }
@media (prefers-reduced-motion: reduce) {
  .info-note__toggle, .info-note__tooltip { transition: none; }
  .info-note__toggle:active { transform: none; }
}

/* Bloc équations dépliable (formalisme OMTDR) */
.eqbox { margin: 1.6rem 0; border: 1px solid var(--line); border-radius: 12px; background: var(--charcoal-2); overflow: hidden; }
.eqbox[open] { border-color: color-mix(in srgb, var(--neon) 30%, var(--line)); }
#pr-exemples-litterature {
  --literature-padding: clamp(1rem, 2.5vw, 1.5rem);
  background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3));
}
#pr-exemples-litterature > .eqbox__summary { padding-inline: var(--literature-padding); }
#pr-exemples-litterature > .eqbox__body { padding: var(--literature-padding); }
#pr-exemples-litterature > .eqbox__body > .eq-note { margin-top: 0; }
#pr-exemples-litterature > .eqbox__body > .metric-row { margin-bottom: 0; }
.eqbox__summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 0.8rem; padding: 0.95rem 1.15rem; user-select: none; }
.eqbox__summary::-webkit-details-marker { display: none; }
.eqbox__summary::before { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--neon); border-bottom: 2px solid var(--neon); transform: rotate(-45deg); transition: transform var(--dur) var(--ease-out); flex: none; }
.eqbox[open] .eqbox__summary::before { transform: rotate(45deg); }
.eqbox__summary:hover .eqbox__title { color: var(--neon); }
.eqbox__title { font-family: var(--font-body); font-weight: 600; color: #fff; font-size: var(--t-body); transition: color var(--dur) var(--ease-out); }
.eqbox__hint { margin-left: auto; font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.eqbox__hint::after { content: "Déplier"; }
.eqbox[open] .eqbox__hint::after { content: "Replier"; }
.eqbox[open] .eqbox__hint { color: var(--neon); }
.eqbox__body { padding: 0.2rem 1.15rem 1.2rem; border-top: 1px solid var(--line); }
.eqbox__lead { color: var(--muted); font-size: var(--t-small); line-height: 1.6; margin: 0.85rem 0 0.4rem; }
#su-omtdr .eqbox__lead { max-width: none; }
.eqrow { padding: 0.85rem 0; border-top: 1px dashed var(--line); }
.eqrow:first-of-type { border-top: none; }
.eqrow__step { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.1em; text-transform: uppercase; color: var(--neon-2); margin-bottom: 0.4rem; }
.eqrow__eq { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; color: #fff; flex-wrap: wrap; }
.eqrow__eq .katex { font-size: 1.05em; }
@media (max-width: 560px) { .eqrow__eq > span:first-child { max-width: 100%; overflow-x: auto; } }
.eqrow__num { flex: 0 0 auto; font-family: var(--font-mono); font-size: var(--t-micro); color: var(--faint); letter-spacing: 0.08em; }
.eqrow__gloss { color: var(--ink-soft); font-size: var(--t-small); line-height: 1.6; margin: 0.45rem 0 0; max-width: 74ch; }
.eqrow__gloss b { color: #fff; font-weight: 600; }
.eqbox__foot { margin: 1rem 0 0; padding-top: 0.85rem; border-top: 1px solid var(--line); color: var(--muted); font-size: var(--t-small); line-height: 1.6; }
.eqbox__foot b { color: #fff; font-weight: 600; }

/* Timeline verticale des productions (chronologique, icônes cerclées par type) */
.timeline { position: relative; margin: 1.6rem 0 0; padding: 0; }
.timeline::before { content: ""; position: absolute; left: 24px; top: 12px; bottom: 12px; width: 2px;
  background: linear-gradient(var(--neon), color-mix(in srgb, var(--neon) 12%, transparent)); }
.tl-item { position: relative; display: grid; grid-template-columns: 50px 1fr; gap: 1.1rem; padding-bottom: 1.6rem; }
.tl-item:last-child { padding-bottom: 0; }
.tl-node { position: relative; z-index: 1; width: 50px; height: 50px; border-radius: 50%;
  display: grid; place-items: center; color: var(--neon); background: var(--charcoal-2);
  border: 1.5px solid color-mix(in srgb, var(--neon) 55%, var(--line));
  box-shadow: 0 0 0 5px var(--paper), 0 0 16px var(--neon-soft); }
.tl-node svg { width: 22px; height: 22px; }
.tl-card { padding-top: 2px; min-width: 0; }
.tl-head { display: flex; align-items: baseline; gap: .7rem; flex-wrap: wrap; margin-bottom: .35rem; }
.tl-year { font-family: var(--font-display); font-weight: 500; color: #fff; font-size: 1.15rem; line-height: 1; }
.tl-type { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .12em; text-transform: uppercase; color: var(--neon-2); }
.tl-badge { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .05em; text-transform: uppercase;
  color: var(--neon); border: 1px solid color-mix(in srgb, var(--neon) 40%, transparent); border-radius: 20px; padding: .05rem .5rem; }
.tl-ref { color: var(--ink-soft); font-size: var(--t-small); line-height: 1.55; max-width: 72ch; }
.tl-ref .ref__auth { color: var(--muted); }
.ref__auth b { color: #fff; font-weight: 700; }
.tl-ref i { color: #fff; }
.tl-ref a { color: var(--neon); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--neon) 40%, transparent); }
.tl-ref a:hover { border-bottom-color: var(--neon); }
@media (max-width: 640px) {
  .tl-item { grid-template-columns: 40px 1fr; gap: .8rem; }
  .tl-node { width: 40px; height: 40px; }
  .tl-node svg { width: 18px; height: 18px; }
  .timeline::before { left: 19px; }
}

/* ---- Chaîne de traitement (pipeline OMTDR) ---- */
.pipeline { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: stretch; margin: 1.6rem 0; }
.pipeline__step {
  position: relative; flex: 1 1 130px; min-width: 116px;
  padding: 0.9rem 0.9rem 1rem; border: 1px solid var(--line);
  border-radius: 10px; background: var(--glass);
  display: grid; gap: 0.3rem; align-content: start;
  transition: opacity .5s var(--ease-out), border-color .5s, background .5s;
}
.pipeline__step .s { font-family: var(--font-mono); font-size: var(--t-micro); color: var(--neon); letter-spacing: 0.1em; }
.pipeline__step .t { font-family: var(--font-body); font-weight: 600; font-size: var(--t-small); color: #fff; line-height: 1.25; }
.pipeline__step .d { font-size: var(--t-micro); color: var(--muted); line-height: 1.4; }
.pipeline__step:not(:last-child)::after {
  content: "\2192"; position: absolute; right: -0.52rem; top: 50%; transform: translateY(-50%);
  color: var(--faint); font-size: 0.9rem; z-index: 2;
}
@media (prefers-reduced-motion: no-preference) {
  .pipeline.is-lit .pipeline__step { opacity: 0.38; }
  .pipeline.is-lit .pipeline__step.lit { opacity: 1; border-color: var(--neon); background: var(--neon-soft); }
}

/* ---- Chiffres clés ---- */
.metric-row {
  display: grid; gap: 1px; background: var(--line);
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  border: 1px solid var(--line); border-radius: 10px; overflow: hidden; margin: 1.6rem 0;
}
.metric { background: var(--surface); padding: 1.1rem 1.2rem; display: grid; gap: 0.25rem; }
.metric .v {
  font-family: var(--font-display); font-weight: 300;
  font-size: clamp(1.5rem, 1rem + 2vw, 2.3rem); color: #fff; line-height: 1;
  font-variant-numeric: tabular-nums;
}
.metric .v .u { color: var(--neon); font-size: 0.5em; margin-left: 0.12em; }
.metric .k { font-size: var(--t-micro); color: var(--muted); letter-spacing: 0.04em; line-height: 1.35; }

/* ---- Positionnement stratégique du CEA-LIST ---- */
.cea-strategy { margin-top: clamp(3.5rem, 8vw, 7rem); padding-top: clamp(2.6rem, 6vw, 5rem); border-top: 1px solid var(--line); }
.cea-strategy__head strong, .research-return strong { color: #fff; }
.cea-cases { margin-top: 2rem; }
.cea-cases__tabs { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; }
.cea-case {
  min-width: 0; min-height: 190px; padding: 1.2rem; text-align: left; cursor: pointer;
  display: flex; flex-direction: column; align-items: flex-start; gap: .35rem;
  color: var(--ink-soft); background: var(--glass); border: 1px solid var(--line); border-radius: 8px;
  transition: border-color var(--dur), background var(--dur), translate var(--dur);
}
.cea-case:hover { border-color: var(--line-strong); translate: 0 -2px; }
.cea-case:focus-visible, .platform__node:focus-visible { outline: 2px solid var(--neon); outline-offset: 3px; }
.cea-case.is-active { color: #fff; border-color: var(--neon); background: var(--neon-soft); }
.cea-case svg { width: 44px; height: 44px; margin-bottom: .45rem; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cea-case.is-active svg { color: var(--neon); }
.cea-case__index { font: 600 var(--t-micro)/1.2 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--neon); }
.cea-case strong { color: #fff; font-size: var(--t-card); line-height: 1.2; }
.cea-case small { color: var(--muted); font-size: var(--t-small); line-height: 1.4; }
.cea-case-detail { display: grid; grid-template-columns: minmax(180px, .34fr) 1fr; border: 1px solid var(--line); border-top: 0; background: var(--charcoal-2); }
.cea-case-detail__proof { padding: 1.4rem; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid var(--line); }
.cea-case-detail__proof span, .cea-case-detail__status, .platform__kicker, .platform__detail-index { font: var(--t-micro)/1.3 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--neon); }
.cea-case-detail__proof strong { margin: .45rem 0; color: #fff; font: 300 clamp(2.3rem, 5vw, 4.2rem)/.9 var(--font-display); }
.cea-case-detail__proof strong.is-compact { font-size: clamp(1.9rem, 3.2vw, 2.65rem); }
.cea-case-detail__proof small { color: var(--muted); font-size: var(--t-micro); line-height: 1.4; }
.cea-case-detail__body { padding: 1.4rem clamp(1.4rem, 4vw, 2.5rem); }
.cea-case-detail__body h4 { margin: .55rem 0; color: #fff; font: 400 var(--t-h3)/1.12 var(--font-display); }
.cea-case-detail__body p { margin: 0; max-width: 68ch; color: var(--ink-soft); line-height: 1.6; }
.cea-case-detail__meta { margin-top: .8rem; }
.cea-case-detail__meta.refs { margin-top: 1rem; }
.cea-case-detail__link { color: var(--neon-2, var(--neon)); font: var(--t-small)/1.4 var(--font-mono); text-decoration: none; }
.cea-case-detail__link:hover { text-decoration: underline; }

.platform { margin-top: 2.4rem; padding-block: 2rem; border-top: 1px solid var(--line); }
.platform__head { display: grid; grid-template-columns: .85fr 1.15fr; gap: 2rem; align-items: end; padding-bottom: 1.4rem; border-bottom: 1px solid var(--line); }
.platform__head h4 { margin: .5rem 0 0; color: #fff; font: 400 var(--t-h3)/1.08 var(--font-display); }
.platform__head p { margin: 0; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.6; }
.platform__head b, .platform__caption b { color: #fff; }
.platform__flow { display: grid; grid-template-columns: repeat(6, 1fr); gap: .5rem; padding: 1.5rem 0 1rem; }
.platform__node { position: relative; min-width: 0; min-height: 108px; padding: .85rem .65rem; cursor: pointer; color: var(--muted); background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 6px; text-align: left; }
.platform__node:not(:last-child)::after { content: "→"; position: absolute; z-index: 2; right: -.57rem; top: 50%; translate: 0 -50%; color: var(--faint); }
.platform__node span { display: block; margin-bottom: .65rem; color: var(--neon); font: var(--t-micro)/1 var(--font-mono); }
.platform__node strong { color: inherit; font-size: var(--t-small); line-height: 1.3; }
.platform__node:hover, .platform__node.is-active { color: #fff; border-color: var(--neon); background: var(--neon-soft); }
.platform__node--decision { background: rgba(255,51,35,.08); }
.platform__detail { display: grid; grid-template-columns: 90px minmax(150px, .7fr) 1.5fr; gap: 1rem; align-items: center; min-height: 86px; padding: 1rem 1.15rem; border-left: 2px solid var(--neon); background: var(--glass); }
.platform__detail strong { color: #fff; font-size: var(--t-body); }
.platform__detail p { margin: 0; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.5; }
.platform__capabilities { grid-column: 2 / -1; list-style: none; display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .15rem; }
.platform__capabilities li { padding: .25rem .6rem; border: 1px solid color-mix(in srgb, var(--neon) 28%, var(--line)); border-radius: 999px; color: var(--ink-soft); background: var(--neon-soft); font: var(--t-micro)/1.35 var(--font-mono); }
.platform__media { grid-column: 2 / -1; display: grid; grid-template-columns: minmax(220px, .7fr) 1fr; gap: 1rem; align-items: center; margin-top: .45rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.platform__media[hidden] { display: none; }
.platform__media img { display: block; width: 100%; height: 150px; object-fit: contain; object-position: left center; background: #f5f5f2; border-radius: 5px; }
.platform__media figcaption { color: var(--muted); font-size: var(--t-small); line-height: 1.5; }
.platform__caption { margin: 1rem 0 0; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
.platform__cards {
  --platform-card-width: min(360px, 86%);
  display: grid; grid-auto-flow: column; grid-auto-columns: var(--platform-card-width);
  gap: 2rem; list-style: none; padding: 1.5rem 0; margin: 0;
  overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--neon) transparent;
}
.platform__cards.is-fan {
  position: relative; isolation: isolate; grid-template-columns: minmax(0, 1fr);
  grid-auto-flow: row; grid-auto-columns: auto; gap: 0;
  padding: 3rem 0 var(--platform-fan-bottom, 7rem); overflow: clip;
  scroll-snap-type: none; touch-action: pan-y;
}
.platform__toolbar { position: relative; display: flex; justify-content: center; align-items: center; gap: .75rem; padding: .5rem 0 2rem; }
.platform__position { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.platform__nav {
  position: relative; display: grid; place-items: center; flex: 0 0 48px; width: 48px; height: 48px;
  border: 1px solid var(--line-strong); border-radius: 50%; background: var(--glass); color: var(--ink-soft);
  box-shadow: 0 4px 20px rgba(0, 0, 0, .3); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); cursor: pointer;
  transition: color .25s, border-color .25s, background .25s;
}
.platform__nav::before { content: ""; position: absolute; inset: 3px; border: 1px solid var(--line); border-radius: 50%; pointer-events: none; }
.platform__nav svg { width: 20px; height: 20px; }
.platform__nav:hover { color: var(--ink); border-color: var(--ink-soft); background: var(--neon-soft); }
.platform__nav:active { opacity: .7; }
.platform__dots { display: flex; justify-content: center; }
.platform__dot { display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; cursor: pointer; }
.platform__dot::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--muted); transition: transform .25s, background .25s; }
.platform__dot:hover::after { background: var(--ink); }
.platform__dot[aria-current="true"]::after { background: var(--neon); transform: scale(1.3); }
.platform__nav:focus-visible, .platform__dot:focus-visible, .platform__cards:focus-visible { outline: 2px solid var(--neon); outline-offset: 3px; }
.platform__card {
  position: relative; display: grid; grid-template-rows: auto auto auto 1fr; min-width: 0; padding: 1.5rem;
  border: 0; border-radius: 8px;
  background: var(--charcoal-3);
  background: linear-gradient(to top, var(--charcoal-3), color-mix(in srgb, var(--neon) 28%, var(--charcoal-3)) 58%, color-mix(in srgb, var(--neon) 82%, var(--charcoal-3)));
  overflow-wrap: anywhere; hyphens: auto; scroll-snap-align: start;
  box-shadow: 0 16px 40px rgba(0, 0, 0, .28);
}
.is-fan > .platform__card {
  grid-area: 1 / 1; justify-self: center; width: var(--platform-card-width); cursor: pointer;
  transform: translate3d(var(--fan-x, 0px), calc(var(--fan-y, 0px) + var(--fan-lift, 0px)), 0) rotate(var(--fan-rotation, 0deg)) scale(var(--fan-scale, 1));
  transition: transform .55s cubic-bezier(.22, 1, .36, 1);
}
.is-fan > .platform__card.is-current { cursor: default; box-shadow: 0 24px 48px rgba(0, 0, 0, .45); }
.platform__card-top { position: relative; container-type: inline-size; margin: -1.5rem -1.5rem .75rem; }
.platform__art { display: block; width: 100%; height: auto; }
/* Pastille proportionnelle à la carte : à taille fixe, elle mordrait sur le
   câble qui entre par la gauche de l'illustration 01 dès que la carte rétrécit. */
.platform__number { position: absolute; top: 4.5cqi; left: 4.5cqi; display: grid; place-items: center; width: 15.5cqi; height: 15.5cqi; border-radius: 50%; border: 1px solid var(--line-strong); background: rgba(0, 0, 0, .18); color: var(--ink); font: 600 6.7cqi/1 var(--font-mono); }
.platform__card h5 { min-height: 2.5em; font: 700 1.5rem/1.25 var(--font-body); color: var(--ink); margin: 0 0 .75rem; letter-spacing: 0; text-align: center; }
.platform__card > p { min-height: 4.8em; margin: 0; font-size: .875rem; line-height: 1.6; color: var(--ink); }
.platform__points { display: grid; align-content: start; gap: .6rem; list-style: none; padding: 1.25rem 0 0; margin: 1.25rem 0 0; border-top: 1px solid var(--line-strong); font-size: .875rem; line-height: 1.6; color: var(--ink); }
.platform__points li { position: relative; padding-left: 1.25rem; }
.platform__points li::before { content: ""; position: absolute; top: .5em; left: 0; width: 8px; height: 8px; border-radius: 50%; background: var(--neon); box-shadow: 0 0 0 3px var(--neon-soft); }
.platform__image { display: block; margin-top: auto; padding-top: 1rem; }
.platform__image img { display: block; width: 100%; height: 160px; object-fit: contain; background: #f5f5f2; border-radius: 4px; }
.platform__image:focus-visible { outline: 2px solid var(--neon); outline-offset: 4px; }
.platform__outcome { display: grid; grid-template-columns: 1fr 2fr; gap: 1.5rem; padding-block: 1.5rem; border-block: 1px solid var(--neon); }
.platform__outcome h5 { font: 600 1.125rem/1.4 var(--font-body); color: var(--neon); margin: 0; }
.platform__outcome p { margin: 0; font-size: .95rem; color: var(--ink-soft); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .is-fan > .platform__card:hover { --fan-lift: -8px; }
}
@media (prefers-reduced-motion: reduce) {
  .is-fan > .platform__card, .platform__dot::after { transition: none; }
}
@media (max-width: 600px) {
  .platform__outcome { grid-template-columns: minmax(0, 1fr); }
  .platform__card { padding: 1.125rem; }
  .platform__card-top { margin: -1.125rem -1.125rem .75rem; }
  .platform__toolbar { gap: .5rem; }
  .platform__nav { flex-basis: 44px; width: 44px; height: 44px; }
}
.research-return { margin-top: clamp(3.5rem, 8vw, 7rem); padding-top: clamp(2.6rem, 6vw, 5rem); border-top: 1px solid var(--line); }

@media (max-width: 820px) {
  .cea-cases__tabs { grid-template-columns: 1fr; }
  .cea-case { min-height: 0; display: grid; grid-template-columns: 46px 1fr; column-gap: 1rem; }
  .cea-case svg { grid-row: 1 / 4; }
  .cea-case-detail, .platform__head { grid-template-columns: 1fr; }
  .cea-case-detail__proof { border-right: 0; border-bottom: 1px solid var(--line); }
  .platform__flow { grid-template-columns: repeat(3, 1fr); }
  .platform__node:nth-child(3n)::after { display: none; }
  .platform__detail { grid-template-columns: 1fr; gap: .4rem; }
  .platform__capabilities, .platform__media { grid-column: auto; }
}
@media (max-width: 520px) {
  .platform__flow { grid-template-columns: repeat(2, 1fr); }
  .platform__node:nth-child(3n)::after { display: block; }
  .platform__node:nth-child(even)::after { display: none; }
  .platform__media { grid-template-columns: 1fr; }
  .platform__media img { height: 180px; object-position: center; }
}

/* Figure d'appoint : image (trace matplotlib) sur fond clair dans un encart. */
.eqfig { margin: .2rem 0 .8rem; }
.eqfig img { display: block; width: 100%; height: auto; border-radius: 10px; background: #fff; border: 1px solid var(--line); cursor: zoom-in; }
.eqfig figcaption { margin-top: .5rem; color: var(--muted); font-size: var(--t-micro); line-height: 1.45; }
.eqfig figcaption b { color: #fff; }

/* ---- Réflectogramme interactif ---- */
.reflecto {
  border: 1px solid var(--line); border-radius: 14px; overflow: hidden;
  background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3));
}
#su-omtdr > .reflecto { margin-top: 1.5rem; }
.reflecto__stage { display: block; width: 100%; height: auto; }
.reflecto__grid line { stroke: rgba(255,255,255,0.06); stroke-width: 1; }
.reflecto__base { stroke: rgba(255,255,255,0.18); stroke-width: 1; stroke-dasharray: 4 4; }
.reflecto__trace { fill: none; stroke: var(--neon); stroke-width: 2.2; filter: drop-shadow(0 0 6px var(--neon-glow)); }
.reflecto__envelope { fill: none; stroke: var(--neon-2); stroke-width: 1; stroke-dasharray: 2 5; opacity: 0.32; }
.reflecto__envelope-lbl { fill: var(--faint); font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.04em; }
.reflecto__marker circle { fill: #fff; }
.reflecto__marker--fault circle { fill: var(--neon); }
.reflecto__marker--ghost { opacity: 0.72; }
.reflecto__marker--ghost circle { fill: var(--neon-2); }
.reflecto__marker--ghost text { font-style: italic; }
.reflecto__marker text { fill: var(--ink-soft); font-family: var(--font-mono); font-size: 12px; }
.reflecto__axis { fill: rgba(255, 255, 255, 0.42); font-family: var(--font-mono); font-size: 11px; }

/* Animations du réflectogramme (mise en valeur du signal et du défaut) */
.reflecto__fault-guide { stroke: var(--neon); stroke-width: 1; stroke-dasharray: 3 4; opacity: 0.42; }
.reflecto__scan {
  fill: #fff; pointer-events: none;
  filter: drop-shadow(0 0 5px var(--neon)) drop-shadow(0 0 11px var(--neon-glow));
}
.reflecto__ping {
  fill: none; stroke: var(--neon); stroke-width: 2; pointer-events: none;
  transform-box: fill-box; transform-origin: center;
  animation: reflectoPing 1.9s var(--ease-out) infinite;
}
@keyframes reflectoPing {
  0%   { transform: scale(0.3); opacity: 0.85; }
  70%  { opacity: 0; }
  100% { transform: scale(2.6); opacity: 0; }
}
.reflecto__marker--fault circle {
  transform-box: fill-box; transform-origin: center;
  animation: reflectoFaultPulse 1.9s var(--ease-in-out) infinite;
}
@keyframes reflectoFaultPulse {
  0%, 100% { transform: scale(1); }
  50%      { transform: scale(1.4); }
}
@media (prefers-reduced-motion: reduce) {
  .reflecto__ping, .reflecto__scan { display: none !important; }
  .reflecto__marker--fault circle { animation: none; }
}

/* Loupes de zoom (détail technique injection / défaut) */
.reflecto__lens { fill: rgba(12, 13, 15, 0.86); stroke: rgba(255, 255, 255, 0.14); stroke-width: 1; }
.reflecto__lens-rim { fill: none; stroke: var(--neon); stroke-width: 1.4; opacity: 0.7; }
.reflecto__lens-leader { stroke: rgba(255, 255, 255, 0.32); stroke-width: 1; stroke-dasharray: 2 3; }
.reflecto__lens-anchor { fill: #fff; }
.reflecto__lens-label { fill: var(--ink-soft); font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.02em; }
.reflecto__lens-axis { stroke: rgba(255, 255, 255, 0.3); stroke-width: 1; }
.reflecto__lens-bar { stroke: #fff; stroke-width: 2; }
.reflecto__lens-bardot { fill: var(--neon-2); }
.reflecto__lens-cable { stroke: rgba(255, 255, 255, 0.85); stroke-width: 2; fill: none; }
.reflecto__lens-step { stroke: var(--neon); stroke-width: 2; }
.reflecto__lens-inc { stroke: rgba(255, 255, 255, 0.85); stroke-width: 1.3; fill: none; }
.reflecto__lens-inc-head { fill: rgba(255, 255, 255, 0.85); }
.reflecto__lens-refl { stroke: var(--neon); stroke-width: 1.5; fill: none; }
.reflecto__lens-refl-head { fill: var(--neon); }
.reflecto__lens-sub { fill: var(--ink-soft); font-family: var(--font-mono); font-size: 9px; }
.reflecto__lens-sub--neon { fill: var(--neon-2); }
.reflecto__cap b { color: #fff; }
.reflecto__controls { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.4rem; padding: 1rem 1.2rem; border-top: 1px solid var(--line); }
.reflecto__field { display: grid; gap: 0.4rem; flex: 1 1 220px; }
.reflecto__field label { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.reflecto__range { width: 100%; accent-color: var(--neon); cursor: pointer; }
.reflecto__readout { font-family: var(--font-mono); font-size: var(--t-small); color: #fff; white-space: nowrap; }
.reflecto__readout b { color: var(--neon); }
.reflecto__btn {
  font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.1em; text-transform: uppercase;
  color: #fff; background: var(--neon-soft); border: 1px solid var(--neon);
  padding: 0.6rem 1rem; border-radius: 999px; cursor: pointer;
  transition: background var(--dur), color var(--dur);
}
.reflecto__btn:hover { background: rgba(255, 51, 35, 0.22); }
.reflecto__btn[aria-pressed="true"] { background: var(--neon); color: #000; }
.reflecto__btn:disabled { opacity: 0.4; cursor: not-allowed; }
.reflecto__cap { font-size: var(--t-small); color: var(--muted); margin: 0.8rem 0 0; }
#su-omtdr > .reflecto__cap { max-width: none; font-size: 1rem; }

/* ---- Galerie démonstrateur ---- */
.gallery { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); margin: 1.4rem 0; }
figure.plate--dark { margin: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
figure.plate--dark img { width: 100%; height: 210px; object-fit: cover; display: block; background: var(--charcoal-3); }
figure.plate--dark figcaption { font-size: var(--t-small); color: var(--muted); padding: 0.75rem 0.95rem 0.9rem; border-top: 1px solid var(--line); line-height: 1.45; }
figure.plate--dark figcaption b { color: #fff; }

/* ---- Synthèse verrous → réponses ---- */
.synthese { display: grid; gap: 0; margin: 1.2rem 0; border-top: 1px solid var(--line); }
.synthese__row {
  display: grid; gap: 0.5rem 1.2rem; align-items: start; grid-template-columns: 1fr;
  padding: 0.95rem 0; border-bottom: 1px solid var(--line);
}
@media (min-width: 720px) { .synthese__row { grid-template-columns: 0.85fr 1.15fr; } }
.synthese__lock { color: #fff; font-weight: 600; line-height: 1.4; }
.synthese__ans { color: var(--muted); }
.synthese__row--head { border-bottom-color: var(--line-strong); padding-bottom: 0.6rem; }
.synthese__row--head .synthese__lock,
.synthese__row--head .synthese__ans {
  font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--faint); font-weight: 500;
}
.synthese__ans ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; }
.synthese__ans li { position: relative; padding-left: 1.15rem; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.5; }
.synthese__ans li::before { content: "\2014"; position: absolute; left: 0; color: var(--neon); }

/* Accordeon "verrous -> reponses" (synthese aeree) */
.vlock__hint { color: var(--muted); font-size: var(--t-small); margin: 1.1rem 0 1rem; }
.vlock { display: grid; gap: .7rem; margin: 0 0 1.2rem; }
.vlock__item { border: 1px solid var(--line); border-radius: 12px; background: var(--charcoal-2); overflow: hidden; transition: border-color .16s var(--ease-out); }
.vlock__item[open] { border-color: color-mix(in srgb, var(--neon) 42%, var(--line)); }
.vlock__head { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 1rem; padding: 1.05rem 1.25rem; }
.vlock__head::-webkit-details-marker { display: none; }
.vlock__n { flex: none; font-family: var(--font-mono); font-size: var(--t-small); font-weight: 700; letter-spacing: .04em; color: var(--neon); }
.vlock__title { flex: 1; color: #fff; font-weight: 600; line-height: 1.4; transition: color .16s var(--ease-out); }
.vlock__head:hover .vlock__title, .vlock__head:focus-visible .vlock__title { color: var(--neon-2); }
.vlock__badge { flex: none; font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .04em; color: var(--muted); border: 1px solid var(--line); border-radius: 999px; padding: .22rem .62rem; white-space: nowrap; }
.vlock__chev { flex: none; width: 14px; height: 14px; fill: none; stroke: var(--muted); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s var(--ease-out), stroke .2s var(--ease-out); }
.vlock__item[open] .vlock__chev { transform: rotate(180deg); stroke: var(--neon); }
.vlock__head:focus-visible { outline: 2px solid var(--neon); outline-offset: -2px; }
.vlock__list { list-style: none; margin: 0; padding: 0 1.4rem 1.2rem 1.4rem; display: grid; gap: .6rem; }
.vlock__list li { position: relative; padding-left: 1.7rem; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.5; }
.vlock__list li::before { content: "\2713"; position: absolute; left: .1rem; top: 0; color: var(--neon); font-weight: 700; }
.vlock__list li b { color: #fff; }

/* Tendance scientifique du diagnostic filaire — figure 3.2 */
.wire-trend { margin: 2.4rem 0; }
.wire-trend__intro { max-width: 76ch; margin-bottom: 1.2rem; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.55; }
.wire-trend__intro span { display: block; margin-bottom: .35rem; color: var(--neon); font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .14em; text-transform: uppercase; }
.wire-trend__intro b { color: #fff; }
.wire-trend__frame {
  display: grid; grid-template-columns: minmax(0, 1fr); overflow: hidden;
  border: 1px solid var(--line); border-radius: 12px;
  background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3));
}
.wire-trend__scroll { min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; }
.wire-trend__scroll:focus-visible { outline: 2px solid var(--ink); outline-offset: -3px; }
.wire-trend__chart { position: relative; width: 100%; min-width: 1048px; height: 760px; }
.wire-trend__chart.echart { box-sizing: border-box; padding-top: 0; }
.wire-trend__chart > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.wire-trend__chart.echart > img { display: none; }
.wire-trend__bubble-control { position: absolute; z-index: 2; transform: translate(-50%, -50%); margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; pointer-events: none; }
.wire-trend__bubble-control:focus-visible { outline: 3px solid var(--ink); outline-offset: 4px; }
.wire-trend__legend { position: absolute; right: 32px; bottom: 128px; z-index: 1; display: none; align-items: center; gap: 1rem; color: var(--ink-soft); font-size: .75rem; pointer-events: none; }
.wire-trend__chart.echart > .wire-trend__legend { display: flex; }
.wire-trend__range, .wire-trend__zero { display: inline-flex; align-items: center; gap: .5rem; }
.wire-trend__range > i { display: block; width: 96px; height: 10px; background: linear-gradient(90deg, rgba(255,255,255,.24), var(--ink)); }
.wire-trend__zero > i { width: 10px; height: 10px; border-radius: 50%; background: var(--neon); }
.wire-trend__detail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .85fr); grid-template-areas: "status impact" "title impact" "text impact" "source impact"; column-gap: 3rem; align-content: center; min-width: 0; padding: 2rem 2.5rem; border-top: 1px solid var(--line); background: var(--charcoal-2); }
.wire-trend__detail-status { grid-area: status; color: var(--ink-soft); font-family: var(--font-mono); font-size: .75rem; letter-spacing: 0; }
.wire-trend__detail.is-gap .wire-trend__detail-status { color: var(--neon); }
.wire-trend__detail h4 { grid-area: title; margin: .5rem 0 .8rem; color: #fff; font-family: var(--font-display); font-size: 1.55rem; font-weight: 400; line-height: 1.08; }
.wire-trend__detail-text { grid-area: text; margin: 0; color: var(--ink-soft); font-size: .82rem; line-height: 1.55; }
.wire-trend__detail-source { grid-area: source; margin: .8rem 0 0; color: var(--ink-soft); font-size: .75rem; line-height: 1.5; }
.wire-trend__detail-impact { grid-area: impact; align-self: center; padding: .25rem 0 .25rem 2.25rem; border-left: 1px solid var(--line); }
.wire-trend__detail-impact span { color: var(--neon); font-family: var(--font-mono); font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; }
.wire-trend__detail-impact strong { display: block; margin: .4rem 0; color: #fff; font-size: .86rem; line-height: 1.35; }
.wire-trend__detail-impact p { margin: 0; color: var(--muted); font-size: .72rem; line-height: 1.45; }
.wire-trend__guide { position: relative; padding: 64px 24px 0; }
.wire-trend__guide > .info-note__body { margin: 0 0 1rem; }
.wire-trend__conclusion { margin: 0; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.5; }
.wire-trend__conclusion b { color: #fff; }
.research-axes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 2rem; margin-top: 2.5rem; }
.research-axes > * { grid-column: 1 / -1; min-width: 0; }
.research-axes > .research-triptych__axis { grid-column: auto; grid-row: 2; }
.research-axes > .research-axis { margin-top: 2rem; }
.research-axes__head { max-width: 76ch; margin-bottom: 1.5rem; }
.research-axes__head h4 { font-size: 1.6rem; line-height: 1.2; letter-spacing: 0; }
.research-axes__head p { margin-top: .8rem; color: var(--ink-soft); line-height: 1.6; }
.research-triptych__axis { position: relative; display: grid; grid-template-rows: auto 1fr; width: 100%; min-width: 0; padding: 0; overflow: hidden; color: var(--ink); font: inherit; text-align: left; cursor: pointer; border: 0; border-radius: var(--radius-lg) var(--radius-lg) var(--radius) var(--radius); background: var(--charcoal-3); box-shadow: var(--shadow-md); transform-origin: center; transition: transform var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out); }
.research-triptych__visual { position: relative; display: block; aspect-ratio: 240 / 161; overflow: hidden; }
.research-triptych__visual::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(0deg, var(--charcoal-3), transparent 44%, color-mix(in srgb, var(--black) 12%, transparent)), linear-gradient(90deg, color-mix(in srgb, var(--black) 30%, transparent), transparent 18%, transparent 82%, color-mix(in srgb, var(--black) 30%, transparent)); }
.research-triptych__image { display: block; width: 100%; height: 100%; object-fit: contain; transition: transform var(--dur) var(--ease-out); }
.research-triptych__copy { position: relative; display: grid; grid-template-rows: 1fr auto; gap: .85rem; min-width: 0; padding: 1.25rem 1.5rem 1.75rem; }
.research-triptych__index { position: absolute; top: 1.25rem; left: 1.25rem; z-index: 1; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; color: var(--ink); background: color-mix(in srgb, var(--charcoal-3) 85%, transparent); box-shadow: var(--shadow-sm); font: 600 1.5rem/1 var(--font-mono); }
.research-triptych__axis strong { color: var(--ink); font: 500 1.25rem/1.4 var(--font-display); text-wrap: balance; }
.research-triptych__intent { color: var(--ink-soft); font-size: .9375rem; line-height: 1.5; }
.research-axes[data-active] .research-triptych__axis:not(.is-active) { opacity: .76; }
.research-triptych__axis.is-active, .research-triptych__axis:focus-visible { z-index: 1; transform: translateY(-6px) scale(1.015); }
.research-triptych__axis.is-active .research-triptych__image, .research-triptych__axis:focus-visible .research-triptych__image { transform: scale(1.045); }
.research-triptych__axis.is-active .research-triptych__index { background: var(--neon); }
.research-axes[data-active] .research-triptych__axis:focus-visible { opacity: 1; }
.research-triptych__axis:focus-visible { outline: 2px solid var(--ink); outline-offset: 6px; }
@media (hover: hover) and (pointer: fine) {
  .research-triptych__axis:hover { z-index: 1; transform: translateY(-6px) scale(1.015); }
  .research-triptych__axis:hover .research-triptych__image { transform: scale(1.045); }
  .research-axes[data-active] .research-triptych__axis:hover { opacity: 1; }
}
@media (max-width: 1100px) {
  .research-axes { column-gap: 1.5rem; }
  .research-triptych__copy { padding: 1rem 1.25rem 1.5rem; }
  .research-triptych__axis strong { font-size: 1.125rem; }
}
@media (max-width: 900px) {
  .research-axes { display: flex; flex-direction: column; gap: 2rem; }
  .research-axes > *, .research-axes > .research-axis { margin-block: 0; }
  .research-axes > .research-triptych__axis { align-self: center; width: min(100%, 480px); }
  .research-triptych__intent { font-size: .875rem; }
}
@media (prefers-reduced-motion: reduce) {
  .research-triptych__axis, .research-triptych__image { transition: none; transform: none !important; }
}
.research-map__scene { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 2rem; }
.research-map__network { order: 1; align-self: center; display: block; width: min(100%, 360px); height: auto; margin: 0 auto; color: var(--ink-soft); pointer-events: none; }
.research-map__choices { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3rem; }
.research-map__axis { --axis-color: #4FA3E3; position: relative; display: flex; flex-direction: column; gap: .5rem; padding: .5rem 0; min-width: 0; color: var(--ink-soft); border-bottom: 2px solid transparent; }
.research-map__axis + .research-map__axis::before { content: ""; position: absolute; left: -2.3rem; top: 2rem; width: 1.5rem; height: 1rem; background: var(--ink-soft); clip-path: polygon(0 40%, 65% 40%, 65% 0, 100% 50%, 65% 100%, 65% 60%, 0 60%); }
.research-map__axis--fiabilite { --axis-color: #FF3323; }
.research-map__axis--pronostic { --axis-color: #5FCB8A; }
.research-map__verb { color: var(--ink); font: 500 1rem/1.3 var(--font-display); }
.research-map__axis strong { min-height: 3.9em; font: 500 1.375rem/1.3 var(--font-display); color: var(--axis-color); text-wrap: balance; }
.research-map__axis > .research-map__method { min-height: 2.8em; color: var(--ink); }
.research-map__axis > span:not(.research-map__verb) { font-size: .875rem; line-height: 1.4; }
.research-map__axis > .research-map__domain { font-size: .75rem; }
.research-map__axis small { font-size: .75rem; line-height: 1.5; color: var(--axis-color); }
.research-map__axis svg { width: 100%; max-width: 220px; height: 64px; margin: .15rem auto; overflow: visible; }
.research-map__axis svg path { fill: none; stroke: var(--axis-color); stroke-width: 2; }
.research-map__axis svg .research-map__band { fill: var(--axis-color); fill-opacity: .16; stroke: none; }
.research-map__axis svg .research-map__baseline { stroke: var(--ink-soft); stroke-width: 1; stroke-dasharray: 3 5; }
.research-map__axis:hover, .research-map__axis.is-active { color: var(--ink); border-bottom-color: var(--axis-color); }
.research-map__axis:focus-visible { outline: 2px solid var(--axis-color); outline-offset: 5px; }
.research-map[data-active="surveillance"] .research-map__measure { stroke: #4FA3E3; stroke-width: 8; stroke-opacity: .3; }
.research-map[data-active="fiabilite"] .research-map__confidence { stroke-width: 3; }
.research-map[data-active="pronostic"] .research-map__network > g:first-of-type { color: #5FCB8A; }
.research-map__interactions { order: 1; min-width: 0; }
.research-map__interactions h5 { color: var(--ink); font: 500 1rem/1.4 var(--font-display); margin-bottom: 1rem; }
.research-map__interactions dl > div { padding-block: .75rem; border-top: 1px solid var(--line); }
.research-map__interactions dt { font-size: .95rem; font-weight: 600; margin-bottom: .5rem; }
.research-map__interactions dd { margin: .35rem 0 0; font-size: .875rem; line-height: 1.5; color: var(--ink-soft); }
.research-map__interactions dd b { font-weight: 500; color: var(--ink); }
.research-map__surveillance { color: #4FA3E3; }
.research-map__fiabilite { color: #FF3323; }
.research-map__pronostic { color: #5FCB8A; }
.research-map[data-active="surveillance"] [data-interaction~="surveillance"],
.research-map[data-active="fiabilite"] [data-interaction~="fiabilite"],
.research-map[data-active="pronostic"] [data-interaction~="pronostic"] { border-top-color: var(--ink-soft); }
.research-axes__foundation { grid-row: 3; max-width: none; margin-top: 1.5rem; text-align: center; color: var(--ink-soft); font-size: .875rem; }
.research-axes__foundation b { color: var(--ink); margin-right: .75rem; }
.research-map figcaption { margin-top: .85rem; color: var(--muted); font-size: .75rem; line-height: 1.5; }
.research-axis[hidden] { display: none; }
@media (max-width: 640px) {
  .research-map__scene { grid-template-columns: minmax(0, 1fr); }
  .research-map__interactions { order: 1; }
  .research-map__network { order: 2; }
  .research-map__choices { grid-template-columns: minmax(0, 1fr); gap: 3rem; }
  .research-map__axis + .research-map__axis::before { top: -2rem; left: calc(50% - .75rem); transform: rotate(90deg); }
  .research-map__axis strong { min-height: 0; }
  .research-map__axis > .research-map__method { min-height: 0; }
}
.research-roadmap { margin: 2rem 0; padding: 1.5rem 0; border-block: 1px solid var(--line); }
.research-roadmap figcaption { font: 500 1.1rem/1.5 var(--font-display); color: var(--ink); }
.research-roadmap__foundation { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; margin: 1.25rem 0; padding: .8rem 0; color: var(--ink-soft); border-bottom: 1px solid var(--line); font-size: .9rem; }
.research-roadmap__foundation b { color: var(--ink); }
.research-roadmap__flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; list-style: none; padding: 0; }
.research-roadmap__flow li { position: relative; --axis-color: #4FA3E3; }
.research-roadmap__flow li:nth-child(2) { --axis-color: #5FCB8A; }
.research-roadmap__flow li:nth-child(3) { --axis-color: #FF3323; }
.research-roadmap__flow li + li::before { content: "→"; position: absolute; left: -1.6rem; top: 2.8rem; color: var(--ink-soft); }
.research-roadmap__flow a { display: flex; flex-direction: column; gap: .8rem; height: 100%; padding: 1rem 0; color: var(--ink-soft); border-top: 3px solid var(--axis-color); font-size: .9rem; line-height: 1.5; }
.research-roadmap__flow a:hover strong { color: var(--axis-color); }
.research-roadmap__flow a:focus-visible { outline: 2px solid var(--axis-color); outline-offset: 5px; }
.research-roadmap__index { color: var(--axis-color); font: .8rem/1.4 var(--font-mono); }
.research-roadmap__flow strong { color: var(--ink); font: 500 1.05rem/1.4 var(--font-display); }
.research-roadmap__flow b { margin-top: auto; padding-top: .8rem; border-top: 1px solid var(--line); color: var(--axis-color); font-weight: 500; }
.research-roadmap__feedback { border-left: 2px solid #5FCB8A; padding-left: 1rem; margin-top: 1rem; color: var(--ink-soft); font-size: .95rem; }
.research-roadmap__feedback b { color: var(--ink); }
.research-roadmap__note { margin-top: 1rem; color: var(--ink-soft); font-size: .8rem; }
.research-axis { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 2rem; padding: 1.7rem 0; border-top: 1px solid var(--line); }
.research-axis[id] { scroll-margin-top: 5.5rem; }
.research-axis__question { margin-top: 1rem; color: var(--ink-soft); font-size: 1rem; line-height: 1.6; }
.research-axis__steps { list-style: decimal-leading-zero; padding-left: 1.8rem; margin: 1.5rem 0; }
.research-axis__steps li { padding-left: .5rem; }
.research-axis__steps li + li { margin-top: 1.4rem; }
.research-axis__steps li::marker { color: #4FA3E3; font: .8rem var(--font-mono); }
.research-axis__steps h6 { font: 600 1rem/1.5 var(--font-body); color: var(--ink); margin-bottom: .4rem; }
.research-axis__validation { border-top: 1px solid var(--line); padding-top: 1rem; }
.research-axis h5 { color: #fff; font: 500 1.15rem/1.35 var(--font-display); letter-spacing: 0; }
.research-axis__body { min-width: 0; color: var(--ink-soft); font-size: .95rem; line-height: 1.6; }
.research-axis__body p + p { margin-top: .75rem; }
.research-axis__body b { color: #fff; }
.research-axis:has(.axis-infographic) { --axis-accent: #4FA3E3; display: block; }
.research-axis[hidden]:has(.axis-infographic) { display: none; }
#axe-fiabilite:has(.axis-infographic) { --axis-accent: #FF3323; }
#axe-surveillance:has(.axis-infographic) { --axis-accent: var(--neon); }
#axe-pronostic:has(.axis-infographic) { --axis-accent: var(--neon); }
.axis-status { margin-top: .75rem; color: var(--axis-accent); font-size: .875rem; }
.axis-infographic { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: 1.5rem 2rem; margin-block: 1.5rem; color: var(--ink-soft); font-size: .95rem; line-height: 1.5; }
.axis-infographic__barrier h6 { font: 500 1rem/1.4 var(--font-display); margin-bottom: .75rem; color: var(--axis-accent); }
.axis-infographic p { max-width: 65ch; }
.axis-infographic p + p { margin-top: .75rem; }
.axis-infographic b { font-weight: 600; color: var(--ink); }
.axis-infographic__barrier { border-top: 2px solid var(--axis-accent); padding-top: 1rem; }
.axis-infographic__solutions { min-width: 0; }
.axis-infographic .original { margin: 0; font-size: var(--t-body); line-height: 1.7; }
.axis-infographic .original__copy > * + * { margin-top: .75rem; }
.axis-infographic__barrier ul { padding-left: 1.2rem; }
.axis-infographic__barrier li + li { margin-top: .65rem; }
.axis-flow { display: flex; flex-direction: column; text-align: center; gap: .25rem; padding-block: .5rem; }
.axis-flow__sources { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.axis-flow__sources--three { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; font-size: .875rem; }
.axis-flow__sources b { display: block; }
.axis-flow > svg { width: 100%; height: 32px; fill: none; stroke: var(--axis-accent); stroke-width: 2; }
.axis-flow > strong { color: var(--axis-accent); font-size: 1rem; }
.axis-infographic .axis-infographic__prospective { margin-top: 1rem; padding-top: .75rem; border-top: 1px dashed var(--line); font-size: .875rem; }
.axis-infographic__prospective b { display: block; }
.axis-infographic__means { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 1rem; }
.axis-infographic__means ul { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; }
.axis-infographic__means li { font-size: .875rem; }
.axis-infographic__means li b { display: block; margin-bottom: .25rem; }
.axis-infographic .axis-infographic__caveat { font-size: .875rem; margin-top: 1rem; max-width: none; }
.axis-trajectory { margin: .5rem 0 0; }
.axis-trajectory__stages { display: flex; justify-content: space-between; gap: .5rem; font-size: .875rem; }
.axis-trajectory svg { display: block; width: 100%; height: 100px; margin-block: .5rem; fill: none; stroke: var(--axis-accent); stroke-width: 2; }
.axis-trajectory__prediction { stroke-dasharray: 6 5; }
.axis-trajectory__threshold, .axis-trajectory__divider { stroke: var(--ink-soft); stroke-width: 1; stroke-dasharray: 3 6; }
.axis-trajectory figcaption { display: flex; justify-content: space-between; gap: 1rem; color: var(--ink-soft); font-size: .8rem; }
.axis-details { border-top: 1px solid var(--line); padding-block: .25rem; }
.axis-details--static { padding-bottom: 1.25rem; }
.axis-details__title { padding-block: .75rem; color: var(--ink); font: 600 1rem/1.5 var(--font-body); }
.axis-details > summary { cursor: pointer; padding: .75rem 0; min-height: 44px; color: var(--ink); font-size: .95rem; }
.axis-details > summary::marker { color: var(--axis-accent); }
.axis-details > summary:focus-visible { outline: 2px solid var(--axis-accent); outline-offset: 2px; }
.axis-details[open] { padding-bottom: 1.25rem; }
.axis-details > p, .axis-details > ul, .axis-details > ol { max-width: 75ch; }
.axis-details > .axis-proposals { max-width: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; list-style: none; padding: .75rem 0 1.25rem; margin: 0; }
.axis-proposals li { min-width: 0; padding-top: .75rem; border-top: 2px solid var(--axis-accent); }
.axis-proposals h6 { font: 600 1rem/1.4 var(--font-body); color: var(--axis-accent); margin-bottom: .75rem; }
.axis-proposals p { font-size: .875rem; line-height: 1.5; }
.axis-proposals dl { font-size: .875rem; line-height: 1.5; }
.axis-proposals dt { color: var(--ink); font-weight: 600; margin-top: .75rem; }
.axis-proposals dd { margin: .15rem 0 0; }
.axis-details--source > summary { color: var(--ink-soft); font-size: .875rem; }
.surveillance-strategy { padding-bottom: 1.75rem; }
.axis-banner { position: relative; display: grid; align-items: center; min-height: clamp(16rem, 24vw, 21rem); margin: 1rem 0 1.75rem; overflow: hidden; border-radius: var(--radius-lg); background: var(--charcoal-3); }
.axis-banner__image { position: absolute; inset: 0 0 0 auto; width: 62%; height: 100%; object-fit: cover; -webkit-mask-image: linear-gradient(90deg, transparent, rgba(0, 0, 0, .2) 18%, rgba(0, 0, 0, .75) 42%, #000 62%); mask-image: linear-gradient(90deg, transparent, rgba(0, 0, 0, .2) 18%, rgba(0, 0, 0, .75) 42%, #000 62%); }
.axis-banner::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, var(--charcoal-3) 28%, color-mix(in srgb, var(--charcoal-3) 60%, transparent) 46%, transparent 62%), linear-gradient(0deg, color-mix(in srgb, var(--black) 55%, transparent), transparent 32%), linear-gradient(180deg, color-mix(in srgb, var(--black) 35%, transparent), transparent 22%); }
.axis-banner__copy { position: relative; z-index: 1; display: grid; gap: .8rem; width: min(54%, 34rem); padding: clamp(1.25rem, 2.5vw, 2rem); }
.axis-banner__label { color: var(--neon-2); font: 400 var(--t-micro)/1.4 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.axis-banner__title { max-width: none; color: var(--ink-soft); font: 300 clamp(1.05rem, .75rem + .6vw, 1.25rem)/1.5 var(--font-display); text-align: justify; hyphens: auto; }
.axis-banner__title strong { color: #fff; font-weight: 400; }
.surveillance-strategy > .surveillance-strategy__levers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; max-width: none; padding: 0; margin: 0; list-style: none; }
.surveillance-strategy__levers > li { --lever-color: var(--axis-accent); position: relative; min-width: 0; padding: 1.5rem; border: 1px solid color-mix(in srgb, var(--lever-color) 35%, var(--paper)); border-radius: 8px; background: color-mix(in srgb, var(--ink) 3%, var(--paper)); transition: transform .3s ease-in-out, border-color .3s ease-in-out, background-color .3s ease-in-out, box-shadow .3s ease-in-out; }
.surveillance-strategy__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; margin-bottom: 1.25rem; border-radius: 8px; background: color-mix(in srgb, var(--lever-color) 15%, var(--paper)); }
.surveillance-strategy__icon img { display: block; width: 24px; height: 24px; filter: invert(1); }
.surveillance-strategy__levers h6 { min-height: 5.5rem; margin: 0; color: var(--ink); font: 600 1rem/1.4 var(--font-body); }
.surveillance-strategy__levers h6 span { display: block; margin-bottom: .6rem; color: var(--lever-color); font-size: 1.25rem; }
.surveillance-strategy__levers p { margin: .75rem 0 0; font-size: .875rem; line-height: 1.6; }
.surveillance-strategy__levers .surveillance-strategy__status { margin-top: .25rem; color: var(--lever-color); font-weight: 600; }
.surveillance-strategy__benefits { display: grid; gap: .75rem; margin: 1.25rem 0 0; padding: 1rem 0 0; border-top: 1px solid var(--line); list-style: none; font-size: .875rem; line-height: 1.6; }
.surveillance-strategy__benefits li { position: relative; padding-left: 1.5rem; }
.surveillance-strategy__benefits li::before { content: ""; position: absolute; top: .45em; left: 0; width: 12px; height: 12px; border: 3px solid color-mix(in srgb, var(--lever-color) 20%, var(--paper)); border-radius: 50%; background: var(--lever-color); }
.surveillance-strategy__levers > li > p:not(.surveillance-strategy__status) { min-height: 7em; }
@media (hover: hover) {
  .surveillance-strategy__levers > li:hover { z-index: 1; transform: scale(1.05); border-color: var(--lever-color); background: color-mix(in srgb, var(--lever-color) 7%, var(--paper)); box-shadow: 0 12px 28px rgba(0, 0, 0, .5); }
}
.surveillance-strategy__levers > li:active { z-index: 1; transform: scale(1.05); border-color: var(--lever-color); background: color-mix(in srgb, var(--lever-color) 7%, var(--paper)); box-shadow: 0 12px 28px rgba(0, 0, 0, .5); }
@media (prefers-reduced-motion: reduce) {
  .surveillance-strategy__levers > li,
  .surveillance-strategy__levers > li:hover,
  .surveillance-strategy__levers > li:active { transition: none; transform: none; }
}
.surveillance-strategy__validation { margin-top: 1.75rem; padding-top: 1rem; border-top: 1px solid var(--ink-soft); }
.surveillance-strategy__validation b { color: var(--ink); font-size: .875rem; }
.surveillance-strategy__validation p { margin-top: .35rem; font-size: .875rem; }
@media (max-width: 700px) {
  .axis-banner { display: block; min-height: 0; }
  .axis-banner__image { position: static; width: 100%; height: auto; aspect-ratio: 16 / 9; -webkit-mask-image: linear-gradient(180deg, #000 55%, transparent); mask-image: linear-gradient(180deg, #000 55%, transparent); }
  .axis-banner::after { content: none; }
  .axis-banner__copy { width: auto; margin-top: -2rem; padding: 0 1.25rem 1.5rem; }
  .surveillance-strategy > .surveillance-strategy__levers { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .surveillance-strategy__levers > li { padding: 1.25rem; }
  .surveillance-strategy__levers > li > p:not(.surveillance-strategy__status) { min-height: 0; }
  .surveillance-strategy__levers h6 { min-height: 0; }
  .surveillance-strategy__levers h6 span { margin-bottom: .25rem; }
  .axis-details > .axis-proposals { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .axis-infographic { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .axis-infographic__means ul { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
}
.research-axis__anchor { padding-left: 1rem; border-left: 2px solid var(--axis-accent); }
#axe-pronostic .axis-details--static > .research-axis__anchor { font-size: .875rem; }
.bayes-thesis { margin: 1.25rem 0; }
.bayes-thesis a { display: block; }
.bayes-thesis a:focus-visible { outline: 2px solid #4FA3E3; outline-offset: 4px; }
.bayes-thesis img { width: 100%; height: auto; background: #fff; }
.bayes-net__svg { display: block; width: 100%; height: auto; font-family: var(--font-body); }
.bayes-net__box { fill: none; stroke: rgba(255,255,255,.14); stroke-dasharray: 4 4; }
.bayes-net__head { fill: rgba(255,255,255,.04); stroke: var(--accent); stroke-opacity: .55; }
.bayes-net__head-label { font-family: var(--font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; text-anchor: middle; }
.bayes-net__edge { stroke: rgba(255,255,255,.4); stroke-width: 1.1; transition: opacity var(--dur), stroke var(--dur); }
.bayes-net__node { cursor: pointer; outline: none; transition: opacity var(--dur); }
.bayes-net__dot { stroke: var(--charcoal-3, #0C0D0F); stroke-width: 2; }
.bayes-net__label { font-size: 9.5px; font-weight: 600; fill: rgba(255,255,255,.82); text-anchor: middle; }
.bayes-net__node:focus-visible .bayes-net__dot { stroke: #fff; stroke-width: 3; }
.bayes-net__svg.is-focus .bayes-net__edge:not(.is-on) { opacity: .1; }
.bayes-net__svg.is-focus .bayes-net__node:not(.is-on) { opacity: .25; }
.bayes-net__edge.is-on { stroke: #fff; stroke-width: 1.8; }
.bayes-net__node.is-on .bayes-net__label { fill: #fff; }
.bayes-net__info { margin: .6rem 0 0; min-height: 3em; font-size: .85rem; line-height: 1.5; color: var(--ink-soft); }
.bayes-net__info b { color: #fff; }
.bayes-thesis figcaption { margin-top: .65rem; font-size: .85rem; line-height: 1.5; color: var(--ink-soft); }
.surveillance-constraints { margin: .65rem 0 1rem; padding-left: 1.2rem; }
.surveillance-constraints li + li { margin-top: .5rem; }
.surveillance-constraints li::marker { color: #4FA3E3; }
.tasting-method { padding: .75rem 0; border-block: 1px solid var(--line); }
.gnn-principle { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.gnn-principle figcaption { font-size: .9rem; }
.gnn-principle__scroll { max-width: 100%; overflow-x: auto; margin: .5rem 0; }
.gnn-principle__scroll:focus-visible { outline: 2px solid #4FA3E3; outline-offset: 2px; }
.gnn-principle svg { display: block; width: 100%; min-width: 500px; max-width: 560px; height: auto; margin: 0 auto; font-family: var(--font-body); }
.gnn-mapping { margin: .75rem 0; font-size: .9rem; }
.gnn-mapping > div { padding: .65rem 0; border-top: 1px solid var(--line); }
.gnn-mapping dt { color: #4FA3E3; font-weight: 600; }
.gnn-mapping dd { margin: .25rem 0 0; }
.gnn-principle p { font-size: .9rem; }
.gnn-principle__messages { color: #5FCB8A; }
@media (max-width: 820px) {
  .research-axis { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .research-roadmap__flow { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .research-roadmap__flow li + li::before { content: "↓"; left: auto; right: 1rem; top: -1.6rem; }
}
@media (max-width: 700px) {
  .wire-trend__detail { display: flex; flex-direction: column; padding: 1.5rem; }
  .wire-trend__detail-impact { align-self: stretch; margin-top: 1.25rem; padding: 1.25rem 0 0; border-left: 0; border-top: 1px solid var(--line); }
}

/* ---- Puces / réfs ---- */
.tag {
  display: inline-block; font-family: var(--font-mono); font-size: var(--t-micro);
  letter-spacing: 0.04em; color: var(--ink-soft);
  border: 1px solid var(--line); border-radius: 999px; padding: 0.25rem 0.7rem;
  background: var(--glass); margin: 0.2rem 0.3rem 0 0;
}
.tag--accent { color: #fff; border-color: var(--neon); background: var(--neon-soft); }
.refs { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.3rem; align-items: center; }
.refs .k { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.12em; text-transform: uppercase; color: var(--faint); margin-right: 0.2rem; }

/* ---- Note de bas de mouvement ---- */
.foot-note { font-size: var(--t-small); color: var(--faint); margin-top: 1rem; }

/* ---- Responsive ---- */
@media (max-width: 640px) {
  .reflecto__controls { gap: 0.8rem; }
  .movement__title { font-size: clamp(1.5rem, 8vw, 2rem); }
}

/* =====================================================================
   Couche « lecture HDR » — rendre visibles : démarche originale,
   encadrement, responsabilité/pilotage, rayonnement/transfert, pivot.
   ===================================================================== */

/* Posture : bandeau sous l'en-tête de chapitre */
.chapter-posture {
  display: flex; align-items: baseline; gap: 0.8rem; flex-wrap: wrap;
  margin-top: 1.1rem; padding-top: 1.1rem; border-top: 1px solid var(--line);
  font-size: var(--t-small); color: var(--ink-soft); line-height: 1.5; max-width: 70ch;
}
.chapter-posture .role {
  flex: 0 0 auto; font-family: var(--font-mono); font-size: var(--t-micro);
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--neon);
  border: 1px solid var(--neon); border-radius: 999px; padding: 0.2rem 0.6rem;
}

/* Contribution originale (démarche originale) */
.original {
  margin: 1.6rem 0; padding: 1.2rem 1.3rem 1.3rem 1.4rem;
  background: var(--neon-soft); border: 1px solid var(--neon); border-radius: 12px;
}
.original .lbl {
  display: inline-block; font-family: var(--font-mono); font-size: var(--t-micro); font-weight: 400;
  letter-spacing: 0.14em; text-transform: uppercase; color: var(--neon-2); margin-bottom: 0.55rem;
}
.original p { color: #fff; line-height: 1.6; margin: 0; max-width: 62ch; }
.original__photo { margin: 1rem 0 0; }
.original__photo img { display: block; width: 100%; height: auto; border-radius: 8px; cursor: zoom-in; }
.original__photo figcaption { margin-top: .45rem; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.45; }
.original strong { color: #fff; }
.original__copy ul { display: grid; gap: .45rem; margin: 0; padding: 0; list-style: none; }
.original__copy li { position: relative; padding-left: 1.15rem; color: #fff; line-height: 1.6; }
.original__copy li::before { content: ""; position: absolute; left: 0; top: .8em; width: .6rem; height: 1.5px; background: var(--neon-2); }
.original--illustrated { container: original / inline-size; }
.original__layout {
  display: grid; grid-template-columns: minmax(0, 1fr) 2.5rem;
  gap: .55rem 1rem; align-items: center;
}
.original__layout > .lbl { grid-column: 1; grid-row: 1; margin-bottom: 0; }
.original__copy { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
.original__icon {
  display: block; grid-column: 2; grid-row: 1; justify-self: center;
  width: 2.5rem; height: 2.5rem; color: var(--ink); stroke-opacity: .22;
  pointer-events: none;
}
.original__icon-accent { stroke: var(--neon); stroke-opacity: .45; }
@container original (min-width: 54rem) {
  .original__layout { grid-template-columns: minmax(0, 62ch) minmax(10rem, 1fr); column-gap: 2rem; }
  .original__copy { grid-column: 1; }
  .original__icon { grid-row: 1 / span 2; width: 10rem; height: 10rem; }
}

/* ===== Médaillons du verrou — 3 états, style unique, fondu, highlight à la demande ===== */
.verrou-fig { margin: 0; }
.movement__aside > .verrou-fig { margin-bottom: 1.5rem; }

.verrou-fig__disc {
  display: block; position: relative; width: 100%; max-width: 220px; aspect-ratio: 1;
  margin-inline: auto; border-radius: 50%; overflow: hidden; isolation: isolate;
  background: radial-gradient(circle at 50% 42%, #1b1e22, #0C0D0F 72%);
  border: 1px solid var(--line); box-shadow: 0 14px 34px rgba(0,0,0,.5);
}
.verrou-fig__img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 1;
  opacity: .82; filter: saturate(.85) contrast(1.03);
  transition: opacity var(--dur) var(--ease-out), filter var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.verrou-fig__disc::after {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; border-radius: 50%;
  box-shadow: inset 0 0 30px 12px var(--charcoal-3);
}
.verrou-fig__ring {
  position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: 50%;
  border: 1px solid color-mix(in srgb, var(--neon) 28%, transparent);
  transition: box-shadow var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.verrou-fig__idx {
  position: absolute; z-index: 4; left: 10px; top: 10px; min-width: 26px; height: 22px; padding: 0 7px;
  display: grid; place-items: center; border-radius: 20px;
  font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .06em; color: #fff;
  background: color-mix(in srgb, var(--charcoal-3) 66%, transparent); border: 1px solid var(--line-strong);
}
.verrou-fig__cap { display: block; text-align: center; }
.verrou-fig__state {
  display: block; margin-top: .75rem;
  font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .14em; text-transform: uppercase;
  color: var(--muted); transition: color var(--dur) var(--ease-out);
}
.verrou-fig__note {
  display: block; margin: .55rem auto 0; max-width: 32ch; max-height: 0; opacity: 0; overflow: hidden;
  text-align: center; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.62;
  transition: max-height var(--dur) var(--ease-out), opacity var(--dur) var(--ease-out);
}
.verrou-fig__note b { color: #fff; }
.verrou-fig__note em { color: var(--neon-2); font-style: normal; }

/* Highlight à la demande : survol ou focus clavier */
.verrou-fig:hover .verrou-fig__img,
.verrou-fig:focus-within .verrou-fig__img { opacity: 1; filter: none; transform: scale(1.03); }
.verrou-fig:hover .verrou-fig__ring,
.verrou-fig:focus-within .verrou-fig__ring { border-color: var(--neon); box-shadow: 0 0 0 4px var(--neon-soft), 0 0 24px var(--neon-glow); }
.verrou-fig:hover .verrou-fig__state,
.verrou-fig:focus-within .verrou-fig__state { color: var(--neon); }
.verrou-fig:hover .verrou-fig__note,
.verrou-fig:focus-within .verrou-fig__note { max-height: 15rem; opacity: 1; }
.verrou-fig:focus { outline: none; }

@media (prefers-reduced-motion: reduce) {
  .verrou-fig__img, .verrou-fig__ring, .verrou-fig__note, .verrou-fig__state { transition: none; }
  .verrou-fig:hover .verrou-fig__img, .verrou-fig:focus-within .verrou-fig__img { transform: none; }
}

/* ===== Figures « allocation distribuée » (mouvement 2.2) ===== */
.distrib-fig { margin: 2rem auto 0; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.8rem; background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3)); border: 1px solid var(--line); border-radius: 16px; padding: 14px; }
#su-communication > .distrib-fig + .prose { margin-top: 2rem; }
.distrib-fig img { display: block; width: 100%; height: auto; }
/* hauteur resolue indispensable : ECharts lit clientHeight a l'initialisation */
.distrib-fig__alloc { width: 100%; aspect-ratio: 970 / 324; min-height: 240px; }
.distrib-fig__plots { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.5rem; }
.distrib-plot { margin: 0; display: grid; gap: 0.25rem; }
.distrib-plot img { border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.distrib-plot figcaption {
  text-align: center; font-family: var(--font-mono); font-size: var(--t-micro);
  letter-spacing: 0.04em; color: var(--muted);
}
.distrib-fig__cap { font-size: var(--t-small); color: var(--muted); line-height: 1.6; }
.distrib-fig__cap b { color: #fff; }

/* ===== Réseau en Y interactif (mouvement 2.2) ===== */
.ynet { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 1.1rem; align-items: center; }
.ynet__map {
  display: block; width: 100%; height: auto; border-radius: 12px;
}
.ynet__node[data-r="1"] { --ynet-color: #FFFFFF; }
.ynet__node[data-r="2"] { --ynet-color: #6E747B; }
.ynet__node[data-r="3"] { --ynet-color: #FF3323; }
.ynet__cable { stroke: rgba(255, 255, 255, 0.26); stroke-width: 3; stroke-linecap: round; }
.ynet__junction { fill: var(--charcoal-3); stroke: rgba(255, 255, 255, 0.55); stroke-width: 2; }
.ynet__jlabel { fill: var(--faint); font-family: var(--font-mono); font-size: 11px; }
.ynet__fault path { stroke: var(--neon-2); stroke-width: 2.4; stroke-linecap: round; }
.ynet__fault text { fill: var(--neon-2); font-family: var(--font-mono); font-size: 11px; }
.ynet__node { cursor: pointer; }
.ynet__node rect { fill: color-mix(in srgb, var(--ynet-color) 24%, var(--surface)); stroke: var(--ynet-color); stroke-width: 1.5; }
.ynet__node text { text-anchor: middle; dominant-baseline: middle; fill: var(--ink-soft); font-family: var(--font-display); font-weight: 300; font-size: 21px; }
.ynet__node:hover rect, .ynet__node:focus-visible rect { stroke-width: 3; }
.ynet__node.is-active rect { fill: color-mix(in srgb, var(--ynet-color) 40%, var(--surface)); stroke-width: 2.5; }
.ynet__node.is-active text { fill: #fff; }
.ynet__node:focus { outline: none; }
.ynet__view { margin: 0; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.45rem; }
/* hauteur resolue indispensable : ECharts lit clientHeight a l'initialisation.
   Pas de cadre : le contenant .distrib-fig porte deja la surface. */
.ynet__refl { width: 100%; aspect-ratio: 720 / 460; min-height: 280px; border-radius: 8px; transition: opacity 0.18s var(--ease-out); }
.ynet__refl img { width: 100%; height: auto; border-radius: 7px; background: #fff; }
.ynet__refl.is-swapping { opacity: 0; }

/* Réflectogrammes du réseau en Y, tracés au thème (cf. distrib-chart.js) */
.dchart { display: block; width: 100%; height: auto; }
.dchart__grid line { stroke: rgba(255, 255, 255, 0.06); stroke-width: 1; }
.dchart__base { stroke: rgba(255, 255, 255, 0.18); stroke-width: 1; stroke-dasharray: 4 4; }
.dchart__axis { fill: rgba(255, 255, 255, 0.42); font-family: var(--font-mono); font-size: 11px; }
.dchart__title { fill: var(--muted); font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.04em; }
.dchart__adj { fill: none; stroke: rgba(255, 255, 255, 0.55); stroke-width: 1.4; stroke-dasharray: 5 3; }
.dchart__dist { fill: none; stroke: var(--neon); stroke-width: 2.2; filter: drop-shadow(0 0 6px var(--neon-glow)); }
.dchart__mark circle { fill: #fff; }
.dchart__mark text { fill: var(--ink-soft); font-family: var(--font-mono); font-size: 11px; }
.dchart__legend text { fill: var(--ink-soft); font-family: var(--font-mono); font-size: 11px; }
.ynet__cap { font-size: 1rem; color: var(--muted); text-align: center; line-height: 1.4; }
@media (max-width: 720px) { .ynet { grid-template-columns: minmax(0, 1fr); } }

/* ===== Bus CAN interactif (mouvement 2.2) ===== */
.canfig { margin: 2rem auto 0; width: 100%; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3)); border: 1px solid var(--line); border-radius: 16px; padding: clamp(1rem, 2.5vw, 1.5rem); }
#su-communication > .canfig + .prose { margin-block: 2rem; }
#su-communication > .canfig + .prose + .contrib-frame > .eqs > .eq:first-child,
.contrib-frame > .eqs:first-child > .eq:first-child { margin-top: 0; }
#su-communication .contrib-frame > .eq-note + .prose { margin-top: 2rem; font-size: var(--t-lead); }
.contrib-frame { margin-top: 1rem; background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3)); border: 1px solid var(--line); border-radius: 16px; padding: clamp(1rem, 2.5vw, 1.5rem); }
.contrib-frame > figure.poc-fig--pair { background: none; border: 0; padding: 0; }
.canfig__severity { width: 100%; max-width: 720px; min-height: 320px; aspect-ratio: 16 / 9; margin-inline: auto; border-radius: 8px; }
.canfig__severity img { width: 100%; height: auto; border-radius: 7px; background: #fff; filter: brightness(0.8) contrast(1.03); }
.canfig__cap { font-size: var(--t-small); color: var(--muted); line-height: 1.5; text-align: center; }
.canfig__cap b, .canbus__cap b { color: #fff; }
.canbus { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 1.1rem; align-items: start; }
.canbus__net { margin: 0; display: grid; gap: 0.45rem; }
.canbus__net:has(> .echart__replay) { position: relative; padding-top: 64px; }
.canbus__map { position: relative; }
.canbus__map > .busd { width: 100%; height: auto; }
.canbus__overlay { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.cb-link { fill: none; stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 2000; stroke-dashoffset: 2000; }
.cb-link--r1 { stroke: rgba(255, 255, 255, 0.95); }
.cb-link--r2 { stroke: rgba(110, 116, 123, 0.95); }
.cb-link--x { stroke: var(--neon); filter: drop-shadow(0 0 7px var(--neon-glow)); }
.canbus__hot {
  position: absolute; z-index: 1; transform: translate(-50%, -50%);
  min-width: 30px; height: 26px; padding: 0 8px; border-radius: 20px;
  font-family: var(--font-display); font-weight: 300; font-size: 14px; color: #fff;
  background: color-mix(in srgb, var(--neon) 80%, transparent); border: 1.5px solid #fff; cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4); transition: transform var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out);
}
.canbus__hot:hover, .canbus__hot:focus-visible { box-shadow: 0 0 0 4px var(--neon-soft); }
.canbus__hot.is-active { transform: translate(-50%, -50%) scale(1.15); box-shadow: 0 0 0 4px var(--neon-soft), 0 0 16px var(--neon-glow); }
.canbus__hot:focus { outline: none; }
.canbus__view { margin: 0; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.45rem; }
.canbus__plot { position: relative; }
.canbus__ber { display: block; width: 100%; aspect-ratio: 4 / 3; min-height: 260px; border-radius: 8px; transition: opacity 0.18s var(--ease-out); }
.canbus__ber img { width: 100%; height: auto; border-radius: 7px; background: #fff; filter: brightness(0.8) contrast(1.03); }
.canbus__ber.is-swapping { opacity: 0; }
.canbus__cap { font-size: var(--t-micro); color: var(--muted); line-height: 1.5; text-align: center; }
@media (max-width: 720px) { .canbus { grid-template-columns: minmax(0, 1fr); } }

/* Figures MATLAB : fond blanc adouci en gris (couleurs et courbes préservées) */
.canbus__map img, .ynet__refl img, .distrib-fig__alloc img {
  filter: brightness(0.8) contrast(1.03);
}

/* ===== Diagramme OMTDR (schéma transcepteur sur-mesure, animé) ===== */
.omtdr { margin: 1.7rem 0 0.5rem; }
.omtdr__scroll { overflow-x: auto; overflow-y: hidden; }
.omtdr--scenario { position: relative; padding-top: 64px; }
.omtdr__svg {
  display: block; width: 100%; min-width: 760px; height: auto;
  background: radial-gradient(120% 150% at 50% 0%, rgba(255,51,35,.06), transparent 58%), var(--charcoal-3);
  border: 1px solid var(--line); border-radius: 14px;
}
.omtdr__cap { margin-top: .75rem; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
.omtdr__cap b { color: #fff; font-weight: 600; }
.omtdr__cap i { color: var(--neon-2); font-style: normal; }

.omtdr[data-raw-noise] { position: relative; }
.raw-noise__controls:not([hidden]) { position: absolute; top: .75rem; right: .75rem; z-index: 1; display: flex; }
:is(.raw-noise__toggle, .echart__replay, .poc-fig__zoom, .wire-trend__guide-toggle) {
  position: relative; display: inline-grid; place-items: center; flex: none;
  width: 44px; height: 44px; padding: 0; border: 1px solid var(--neon); border-radius: 8px;
  background: var(--charcoal-2); color: #fff; font: inherit; line-height: 1; cursor: pointer;
  transition: background-color var(--dur) var(--ease-out), box-shadow var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.raw-noise__toggle[aria-pressed="true"] { background: var(--neon); }
.echart { position: relative; }
.echart__replay, .poc-fig__zoom, .wire-trend__guide-toggle { position: absolute; top: 12px; right: 12px; z-index: 2; background: var(--neon); }
.echart__replay[hidden] { display: none; }
:is(.raw-noise__toggle, .echart__replay, .poc-fig__zoom, .wire-trend__guide-toggle):not(:disabled):hover { background: var(--neon-2); box-shadow: 0 0 0 3px var(--neon-soft); transform: translateY(-1px); }
:is(.raw-noise__toggle, .echart__replay, .poc-fig__zoom, .wire-trend__guide-toggle):not(:disabled):active { box-shadow: 0 0 0 2px var(--neon-soft); transform: translateY(1px) scale(.95); }
:is(.raw-noise__toggle, .echart__replay, .poc-fig__zoom, .wire-trend__guide-toggle):focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
:is(.raw-noise__toggle, .echart__replay, .poc-fig__zoom, .wire-trend__guide-toggle):disabled { background: var(--charcoal-2); border-color: var(--line); color: var(--muted); cursor: not-allowed; }
.raw-noise__icon, .echart__replay-icon, .poc-fig__zoom-icon, .wire-trend__guide-icon { grid-area: 1 / 1; width: 20px; height: 20px; pointer-events: none; }
.raw-noise__toggle[aria-pressed="true"] .raw-noise__icon--play,
.raw-noise__toggle[aria-pressed="false"] .raw-noise__icon--pause { display: none; }
.raw-noise__tooltip, .echart__replay-tooltip, .poc-fig__zoom-tooltip, .wire-trend__guide-tooltip {
  position: absolute; bottom: calc(100% + .6rem); right: 0; z-index: 2;
  width: max-content; max-width: min(18rem, calc(100vw - 3rem)); padding: .45rem .65rem;
  border: 1px solid var(--line); border-radius: 6px; background: var(--charcoal-3); color: #fff;
  font-size: .75rem; line-height: 1.4; text-align: center; pointer-events: none;
  opacity: 0; transform: translateY(3px); transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.raw-noise__toggle:hover .raw-noise__tooltip,
.raw-noise__toggle:focus-visible .raw-noise__tooltip,
.echart__replay:hover .echart__replay-tooltip,
.echart__replay:focus-visible .echart__replay-tooltip,
.poc-fig__zoom:hover .poc-fig__zoom-tooltip,
.poc-fig__zoom:focus-visible .poc-fig__zoom-tooltip,
.wire-trend__guide-toggle:hover .wire-trend__guide-tooltip,
.wire-trend__guide-toggle:focus-visible .wire-trend__guide-tooltip { opacity: 1; transform: translateY(0); }
.echart__replay-tooltip { top: calc(100% + .6rem); bottom: auto; }
.poc-fig__zoom-tooltip, .wire-trend__guide-tooltip { top: 0; bottom: auto; right: calc(100% + .6rem); }
@media (prefers-reduced-motion: reduce) {
  :is(.raw-noise__toggle, .raw-noise__tooltip, .echart__replay, .echart__replay-tooltip, .poc-fig__zoom, .poc-fig__zoom-tooltip, .wire-trend__guide-toggle, .wire-trend__guide-tooltip) { transition: none; transform: none; }
  :is(.poc-fig__zoom, .wire-trend__guide-toggle):not(:disabled):is(:hover, :active),
  .poc-fig__zoom:is(:hover, :focus-visible) .poc-fig__zoom-tooltip,
  .wire-trend__guide-toggle:is(:hover, :focus-visible) .wire-trend__guide-tooltip { transform: none; }
}
@media (max-width: 720px) {
  .echart { box-sizing: content-box; padding-top: 64px; }
  .choix-grid .reflo__chart.echart { width: auto; }
  .omtdr[data-raw-noise] > .omtdr__scroll {
    padding-top: 3.5rem; border: 1px solid rgba(255,255,255,.12); border-radius: 12px;
    background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3));
  }
  .raw-noise__panel { fill: none; stroke: none; }
}

.omd-block { fill: var(--charcoal-2); stroke: var(--line-strong); stroke-width: 1.2; }
.omd-block--accent { stroke: var(--neon); }
.omd-lane-band { fill: rgba(255,255,255,0.022); stroke: rgba(255,255,255,0.05); stroke-width: 1; }
.omd-lane-tag { fill: var(--slate); font-family: var(--font-mono); font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
.omd-btext { fill: #fff; font-family: var(--font-body); font-size: 13px; font-weight: 600; text-anchor: middle; }
.omd-wire { fill: none; stroke: var(--line-strong); stroke-width: 1.5; }
.omd-wire--dash { stroke-dasharray: 5 5; stroke: color-mix(in srgb, var(--neon) 55%, transparent); }
.omd-arrow { fill: var(--line-strong); }
.omd-arrow--hot { fill: var(--neon); }
.omd-lane { fill: none; stroke: var(--line); stroke-width: 1; }
.omd-lanelbl { fill: var(--muted); font-family: var(--font-mono); font-size: 11px; text-anchor: middle; }
.omd-edge { fill: var(--neon-2); font-family: var(--font-mono); font-size: 13px; text-anchor: middle; }
.omd-eq2 { fill: var(--neon-2); font-family: var(--font-mono); font-size: 11px; text-anchor: middle; font-style: italic; }
.omd-net { fill: none; stroke: var(--neon); stroke-width: 1.6; }
.omd-netnode { fill: var(--neon); }
.omd-netlbl { fill: #fff; font-family: var(--font-mono); font-size: 12px; letter-spacing: .1em; text-transform: uppercase; text-anchor: middle; }
.omd-flow { fill: var(--neon); }
.omd-flow-halo { fill: var(--neon); opacity: .22; }
.omd-net-pulse { fill: none; stroke: var(--neon); stroke-width: 1.4; transform-box: fill-box; transform-origin: center; animation: omdPulse 2.6s var(--ease-out) infinite; }
@keyframes omdPulse { 0% { transform: scale(.5); opacity: .85; } 70% { transform: scale(1.7); opacity: 0; } 100% { opacity: 0; } }
.omd-net-ring { fill: none; stroke: var(--neon); stroke-width: 1.6; }
.omd-net-glow { fill: none; stroke: var(--neon); stroke-width: 6; opacity: .1; animation: omdGlow 2.8s ease-in-out infinite; }
@keyframes omdGlow { 0%, 100% { opacity: .06; } 50% { opacity: .2; } }
@media (prefers-reduced-motion: reduce) {
  .omd-flowgrp { display: none; }
  .omd-net-pulse { display: none; animation: none; }
  .omd-net-glow { animation: none; }
}

/* Diagramme stratégie de pronostic (fig. 2.30) — réutilise les classes omd-* */
.omd-zone { fill: rgba(255,255,255,0.02); stroke: rgba(255,255,255,0.09); stroke-width: 1; stroke-dasharray: 5 4; }
.omd-zone--prog { fill: var(--neon-soft); stroke: color-mix(in srgb, var(--neon) 32%, transparent); }
.omd-zone-tag { fill: var(--slate); font-family: var(--font-display); font-weight: 500; font-size: 14px; letter-spacing: .14em; text-transform: uppercase; }
.omd-zone-tag--prog { fill: color-mix(in srgb, var(--neon) 78%, #fff); }
.omd-zone--diag { fill: rgba(255,255,255,0.15); stroke: rgba(255,255,255,0.26); }
.omd-zone-tag--diag { fill: rgba(255,255,255,0.85); }
.omd-block--out { fill: var(--neon-soft); stroke: var(--neon); stroke-width: 1.7; }
.omd-out-glow { fill: none; stroke: var(--neon); stroke-width: 7; opacity: .12; }
.omd-btext--sm { font-size: 11px; }

/* Architecture OMTDR distribuée (maître / esclaves sur canal partagé) */
.omd-node-id { fill: #fff; font-family: var(--font-display); font-size: 22px; font-weight: 600; text-anchor: middle; }
.omd-node-sub { fill: var(--slate); font-family: var(--font-mono); font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; text-anchor: middle; }
.omd-tag { fill: var(--neon-soft); stroke: var(--neon); stroke-width: 1; }
.omd-tag-txt { fill: color-mix(in srgb, var(--neon) 80%, #fff); font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .16em; text-anchor: middle; }
.omd-rail { fill: none; stroke: color-mix(in srgb, var(--neon) 40%, var(--line-strong)); stroke-width: 4; stroke-linecap: round; }
.omd-defect { fill: var(--neon); filter: drop-shadow(0 0 6px var(--neon-glow)); }
.omd-defect-lbl { fill: color-mix(in srgb, var(--neon) 85%, #fff); font-family: var(--font-mono); font-size: 11px; letter-spacing: .06em; text-anchor: middle; }

/* Communication OMTDR maître/esclave — palette du site : maître rouge, esclave blanc, câble gris */
.omd-block--green { stroke: #6E747B; fill: color-mix(in srgb, #ffffff 6%, var(--charcoal-2)); }
.omd-green { fill: #8A9097; font-family: var(--font-mono); font-size: 12px; font-style: italic; text-anchor: middle; }
.omd-wire--green { stroke: #6E747B; }
.omd-arrow--grn { fill: #6E747B; }
.omd-wire--red { stroke: var(--neon); }
.omd-flow--grn { fill: #6E747B; }
.omd-flow-halo--grn { fill: #6E747B; opacity: .22; }
.omd-flow--mst { fill: var(--neon); }
.omd-flow-halo--mst { fill: var(--neon); opacity: .25; }
.omd-flow--slv { fill: #ffffff; }
.omd-flow-halo--slv { fill: #ffffff; opacity: .25; }

/* POC OMTDR distribué — figure claire (chart haute résolution + netteté) */
figure.poc-fig { margin: 1.7rem 0 0.5rem; }
figure.poc-fig--sm { max-width: 480px; margin-left: auto; margin-right: auto; }
figure.poc-fig .poc-fig__frame { position: relative; background: #f6f7f8; border: 1px solid var(--line); border-radius: 14px; padding: 12px; overflow: hidden; }
/* Le cadre du graphe reste sombre : c'est un rendu au theme, pas une photo */
.poc-fig__chart { width: 100%; aspect-ratio: 16 / 9; min-height: 320px; }
/* Deux cadres empiles. Largeur bridee : le cadre d'origine est presque carre
   (282x222 px) et, etale sur toute la colonne, il ecrase les pics. */
.poc-fig__chart--stack { max-width: 640px; margin-inline: auto; aspect-ratio: 4 / 5; min-height: 700px; }
/* Trois cadres empiles — voir plus bas. */
/* Dix categories en barres horizontales : la hauteur suit le nombre de lignes. */
.poc-fig__chart--themes { aspect-ratio: auto; min-height: 430px; height: 430px; }
/* Quinze periodes en abscisse, libelles inclines. */
.poc-fig__chart img { width: 100%; height: auto; border-radius: 8px; background: #fff; }

/* Réflectogrammes différentiels ECharts (chapitre 3) */
.reflo__chart { width: 100%; height: 340px; }
.reflo__chart img { width: 100%; height: auto; border-radius: 8px; }

/* Choix du réflectomètre : rappel du réseau + graphe de contribution côte à côte */
.choix-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; align-items: start; }
.choix-recall { margin: 0; height: 205px; display: grid; place-items: center; padding: 8px 12px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,0.02); }
.choix-grid .reflo__chart { height: 205px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,0.02); overflow: hidden; }

/* Réseau de bus + réflectomètres — schéma vectoriel (rappel §3.1) */
.busd { display: block; width: 100%; height: auto; max-height: 100%; }
.busd text { font-family: var(--font-mono); }
.busd__term, .busd__box { fill: var(--charcoal-2); stroke: var(--line-strong); stroke-width: 1.2; }
.busd__bus { fill: none; stroke: rgba(255,255,255,0.5); stroke-width: 2.4; }
.busd__wire { fill: none; stroke: var(--line-strong); stroke-width: 1.4; }
.busd__node { fill: rgba(255,255,255,0.6); }
.busd__ecu { fill: #d9dbde; stroke: #9AA0A6; stroke-width: 1.4; }
.busd__ecu--sel { fill: var(--neon); stroke: #fff; stroke-width: 1.8; }
.busd__r { fill: #0C0D0F; font-size: 15px; font-weight: 700; }
.busd__r--sel { fill: #fff; }
.busd__fn { fill: rgba(255,255,255,0.74); font-size: 14px; }
.busd__can { fill: rgba(255,255,255,0.42); font-size: 12px; letter-spacing: 0.12em; }
.busd__seg { fill: rgba(255,255,255,0.5); font-size: 13px; }
.busd__bp { fill: rgba(255,255,255,0.45); font-size: 13px; }
.busd__ohm { fill: rgba(255,255,255,0.8); font-size: 13px; }
.busd__fault { fill: none; stroke: var(--neon); stroke-width: 3.4; stroke-linecap: round; }
.busd__flt { fill: color-mix(in srgb, var(--neon) 85%, #fff); font-size: 13px; font-weight: 600; }
.busd__arrow { fill: var(--line-strong); }
@media (max-width: 760px) { .choix-grid { grid-template-columns: 1fr; } }

/* Méthodologie de post-traitement par fusion — flowchart vectoriel interactif (chapitre 3) */
.methodo { margin: 1.8rem 0 0.5rem; }
.methodo__grid { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr); gap: 1.4rem; align-items: start; }
.methodo__flow { background: radial-gradient(120% 120% at 50% 0%, rgba(255,51,35,.05), transparent 60%), var(--charcoal-3); border: 1px solid var(--line); border-radius: 14px; padding: 10px 12px; }
.methodo__flow svg { display: block; width: 100%; height: auto; max-height: 80vh; }
.methodo__panel { position: sticky; top: 5rem; min-width: 0; }
[data-caract-panel] { min-width: 0; }
.methodo__hint { color: var(--muted); font-size: var(--t-small); line-height: 1.55; padding: 1.1rem; border: 1px dashed var(--line-strong); border-radius: 12px; text-align: center; }
.methodo__hint b { color: color-mix(in srgb, var(--neon) 82%, #fff); }
.methodo__item { margin: 0; }
.methodo__item img { width: 100%; height: auto; border-radius: 10px; background: #fff; border: 1px solid var(--line); cursor: zoom-in; }
.methodo__item .methodo__chart { width: 100%; height: 300px; }
.methodo__item figcaption { margin-top: .6rem; color: var(--muted); font-size: var(--t-small); line-height: 1.5; }
.methodo__cap { margin-top: .9rem; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
.methodo__cap b { color: #fff; }
@media (max-width: 900px) { .methodo__grid { grid-template-columns: minmax(0, 1fr); } .methodo__panel { position: static; } }
.mf-box { fill: var(--charcoal-2); stroke: var(--line-strong); stroke-width: 1.2; }
#pr-detection .mf-io, #pr-caract .mf-io { fill: rgba(110,116,123,0.16); stroke: #8A9097; }
.mf-fusion { fill: var(--neon-soft); stroke: var(--neon); stroke-width: 1.6; }
.mf-stack { fill: var(--charcoal-2); stroke: var(--line); stroke-width: 1; opacity: .5; }
.mf-txt { fill: #fff; font-family: var(--font-body); font-size: 12px; font-weight: 600; text-anchor: middle; dominant-baseline: middle; }
.mf-wire { fill: none; stroke: var(--line-strong); stroke-width: 1.4; }
.mf-arrow { fill: var(--line-strong); }
.mf-phase { fill: var(--muted); font-family: var(--font-mono); font-size: 9.5px; }
.mf-note { fill: color-mix(in srgb, var(--neon) 70%, transparent); font-family: var(--font-mono); font-size: 10px; }
.mf-hot { cursor: pointer; }
.mf-hot .mf-box, .mf-hot .mf-stack { transition: fill .16s var(--ease-out), stroke .16s var(--ease-out); }
.mf-hot:hover .mf-box, .mf-hot:focus-visible .mf-box, .mf-hot.is-active .mf-box { fill: var(--neon-soft); stroke: var(--neon); }
.mf-hot.is-active .mf-box { stroke-width: 2; }
.mf-hot:focus { outline: none; }
/* Diagramme methode ACP (3.1) : zones colorees pointillees + losange, theme du site */
.pca-zone { fill: none; stroke-width: 1.4; stroke-dasharray: 6 5; }
.pca-zone--learn { stroke: #8A9097; }
.pca-zone--watch { stroke: rgba(255,255,255,0.7); }
.pca-zone--sel { stroke: var(--neon); }
.pca-zlbl { font-family: var(--font-mono); font-size: 13px; font-weight: 600; }
.pca-zlbl--learn { fill: #8A9097; }
.pca-zlbl--watch { fill: #fff; }
.pca-zlbl--sel { fill: var(--neon); }
.pca-diamond { fill: var(--charcoal-2); stroke: var(--line-strong); stroke-width: 1.2; }
.pca-wire-bold { fill: none; stroke: color-mix(in srgb, var(--neon) 72%, #fff); stroke-width: 3; }
.pca-arrow-bold { fill: color-mix(in srgb, var(--neon) 72%, #fff); }
#pr-optim .mf-io { fill: var(--neon-soft); stroke: var(--neon); }
#pr-optim .methodo__flow .mf-txt { font-size: 14px; }
#pr-optim .pca-zlbl { font-size: 14px; }
#pr-optim .pca-elbl { font-size: 14px; }
#pr-optim .prose { max-width: none; }
#pr-caract > .prose { max-width: none; }
#pr-caract > .movement__grid { align-items: stretch; }
#pr-caract > .movement__grid > .methodo { margin: 0; }
#pr-caract > .movement__grid > .movement__aside { display: flex; flex-direction: column; }
#pr-caract > .movement__grid > .movement__aside > .metric-row { margin-top: auto; margin-bottom: 0; grid-template-columns: repeat(4, minmax(0, 1fr)); }
#pr-caract > .movement__grid > .movement__aside .metric { padding: .6rem .7rem; }
#pr-caract > .movement__grid > .movement__aside .metric .v { font-size: 1.45rem; }
#pr-caract > .movement__grid > .movement__aside .metric .k { font-size: .72rem; line-height: 1.3; }
.pca-elbl { fill: var(--muted); font-family: var(--font-mono); font-size: 12px; }
figure.poc-fig .poc-fig__img { display: block; width: 100%; height: auto; border-radius: 8px; filter: url(#photoSharpen) contrast(1.07) saturate(1.12) brightness(1.02); cursor: zoom-in; }
/* Capture d'ecran : ne pas depasser sa taille native, elle deviendrait floue */
figure.poc-fig .poc-fig__img--shot { max-width: 860px; margin-inline: auto; }
figure.poc-fig .poc-fig__cap { margin-top: .75rem; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
figure.poc-fig .poc-fig__cap b { color: #fff; }
figure.poc-fig .poc-fig__cap i { color: var(--neon-2); font-style: normal; }
/* Photo et graphe reunis : le graphe illustre la photo, ils forment un bloc.
   Ligne 1 photo + texte cote a cote, ligne 2 le graphe pleine largeur. */
figure.poc-fig--pair { background: var(--charcoal-2); border: 1px solid var(--line); border-radius: 16px; padding: 14px; }
#su-communication > figure.poc-fig--pair,
#fi-signature > figure.poc-fig--pair,
#fi-multizones > figure.poc-fig--pair,
#fi-demonstrateur > figure.poc-fig--pair,
#pe-tendances > figure.poc-fig--pair { background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3)); }
#fi-signature > figure.poc-fig--pair,
#fi-multizones > figure.poc-fig--pair,
#fi-demonstrateur > figure.poc-fig--pair,
#pe-tendances > figure.poc-fig--pair { padding: clamp(1rem, 2.5vw, 1.5rem); }
#fi-multizones .poc-fig__chart--stack { max-width: none; }
.poc-fig__chart--overlay { width: 100%; aspect-ratio: 16 / 10; min-height: 380px; }
#fi-demonstrateur .poc-fig__img--shot { max-width: none; }
.poc-fig__top { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 1.1rem; align-items: center; margin-bottom: 14px; }
.poc-fig__aside { display: grid; gap: .7rem; color: var(--muted); font-size: var(--t-small); line-height: 1.6; }
.poc-fig__aside b { color: #fff; }
.poc-fig__top--demo { grid-template-columns: minmax(0, 1fr); }
.poc-fig__top--demo > .poc-fig__frame { width: 100%; }
.poc-fig__top--demo .poc-fig__aside,
.poc-fig__top--demo .poc-fig__aside p { width: 100%; max-width: none; }
.poc-fig__top--demo .poc-fig__aside p,
.poc-fig__top--demo .poc-fig__aside b { color: #fff; font-weight: inherit; }
figure.poc-fig .poc-fig__top--demo > .poc-fig__frame { border-radius: 0; }
figure.poc-fig .poc-fig__top--demo .poc-fig__img { border-radius: 0; cursor: default; }
/* Le contenant porte deja le fond et la bordure : les cadres internes ne les redoublent pas.
   Selecteur aligne sur la specificite de .poc-fig__frame, sinon il perd. */
figure.poc-fig--pair .poc-fig__frame { background: transparent; border: 0; padding: 0; }
figure.poc-fig--pair .poc-fig__cap { margin-top: .8rem; }
@media (max-width: 860px) { .poc-fig__top { grid-template-columns: 1fr; } }
.poc-fig__hint { color: var(--neon-2); }

/* Carte de stratégie interactive (schéma → clic vers le paragraphe) */
.stratmap { margin: 1.7rem 0 0.5rem; }
.stratmap__stage { position: relative; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; line-height: 0; }
.stratmap__img { display: block; width: 100%; height: auto; }
.stratmap__hot { position: absolute; display: grid; place-items: center; border-radius: 7px; text-decoration: none; -webkit-tap-highlight-color: transparent; transition: background .16s var(--ease-out), box-shadow .16s var(--ease-out); }
.stratmap__hot:hover, .stratmap__hot:focus-visible { background: color-mix(in srgb, var(--neon) 16%, transparent); box-shadow: 0 0 0 2px var(--neon); outline: none; }
.stratmap__hot span { opacity: 0; transform: translateY(-3px); font: 700 var(--t-micro)/1 var(--font-mono); color: #fff; background: var(--neon); border-radius: 999px; padding: .18rem .45rem; box-shadow: 0 4px 12px rgba(0,0,0,.35); transition: opacity .16s var(--ease-out), transform .16s var(--ease-out); }
.stratmap__hot:hover span, .stratmap__hot:focus-visible span { opacity: 1; transform: none; }
.stratmap__cap { margin-top: .75rem; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
.stratmap__cap b { color: #fff; }
#pr-detection, #pr-caract, #pr-optim, #pr-pronostic { scroll-margin-top: 4.5rem; }

/* Schéma de stratégie vectoriel interactif (chapitre 3) */
.smd { margin: 1.7rem 0 0.5rem; }
.smd__title { font-size: var(--t-h1); margin-top: 0; }
.smd__scroll { overflow-x: auto; overflow-y: hidden; }
.smd__svg { display: block; width: 100%; min-width: 900px; height: auto; background: linear-gradient(180deg, var(--charcoal-2), var(--charcoal-3)); border: 1px solid var(--line); border-radius: 14px; }
.smd__cap { margin-bottom: .75rem; color: var(--muted); font-size: var(--t-lead); line-height: 1.55; }
.smd__cap b { color: #fff; }
.smd__cap .smd__name { color: var(--neon); }
.smd__hint { margin-top: .75rem; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
.smd__hint b { color: #fff; }
.sm-zone { stroke-width: 1.4; stroke-dasharray: 6 5; }
.sm-zone--diag { fill: rgba(255,255,255,0.03); stroke: rgba(255,255,255,0.45); }
.sm-zone--prog { fill: rgba(255,51,35,0.05); stroke: color-mix(in srgb, var(--neon) 55%, transparent); }
.sm-zone-lbl { font-family: var(--font-display); font-weight: 600; font-size: 17px; letter-spacing: .14em; }
.sm-zone-lbl--diag { fill: #fff; }
.sm-zone-lbl--prog { fill: var(--neon); }
.sm-box { fill: var(--charcoal-2); stroke: var(--line-strong); stroke-width: 1.2; }
.sm-box--in { fill: rgba(110,116,123,0.16); stroke: #6E747B; }
.sm-box--out { fill: var(--neon-soft); stroke: var(--neon); stroke-width: 1.8; }
.sm-box--here { fill: var(--neon-soft); stroke: var(--neon); stroke-width: 2.2; }
.sm-link--done { opacity: .55; }
.sm-link--done .sm-box { fill: var(--charcoal-2); stroke: var(--line-strong); stroke-width: 1.2; }
.sm-link--done:hover, .sm-link--done:focus-visible { opacity: 1; }
.sm-txt { fill: #fff; font-family: var(--font-body); font-size: 15px; font-weight: 600; text-anchor: middle; }
.sm-txt--in { fill: rgba(255,255,255,0.85); font-weight: 500; font-size: 14px; }
.sm-txt--out { fill: #fff; font-weight: 700; font-size: 18px; }
.sm-wire { fill: none; stroke: var(--line-strong); stroke-width: 1.5; }
.sm-wire--feed { stroke: rgba(255,255,255,0.22); stroke-dasharray: 4 4; stroke-width: 1.2; }
.sm-arrow { fill: var(--line-strong); }
.sm-tag { fill: color-mix(in srgb, var(--neon) 62%, transparent); font-family: var(--font-mono); font-size: 12px; font-weight: 700; text-anchor: end; }
.sm-link { cursor: pointer; }
.sm-link .sm-box { transition: fill .16s var(--ease-out), stroke .16s var(--ease-out); }
.sm-link:hover .sm-box, .sm-link:focus-visible .sm-box { fill: var(--neon-soft); stroke: var(--neon); stroke-width: 2; }
.sm-link:hover .sm-tag, .sm-link:focus-visible .sm-tag { fill: var(--neon); }
.sm-link:focus-visible { outline: none; }

/* PrognoCable — logigramme de la méthodologie (mouvement 3.4) */
.progno { margin: 1.6rem 0 0; }
.progno__scroll { overflow-x: auto; overflow-y: hidden; }
.pgc-svg { display: block; width: 100%; height: auto; background: radial-gradient(120% 150% at 50% 0%, rgba(255,51,35,.05), transparent 60%), var(--charcoal-3); border: 1px solid var(--line); border-radius: 14px; }
.pgc-box { fill: var(--charcoal-2); stroke: var(--line-strong); stroke-width: 1.2; }
.pgc-box--out { fill: var(--neon-soft); stroke: var(--neon); stroke-width: 1.6; }
.pgc-diamond { fill: var(--charcoal-2); stroke: #8A9097; stroke-width: 1.4; }
.pgc-zone { fill: rgba(255,255,255,0.03); stroke: rgba(255,255,255,0.45); stroke-width: 1.4; stroke-dasharray: 6 5; }
.pgc-zone-lbl { fill: var(--neon); font-family: var(--font-display); font-weight: 600; font-size: 17px; letter-spacing: .1em; }
.pgc-txt { fill: #fff; font-family: var(--font-body); font-size: 16px; font-weight: 600; text-anchor: middle; }
.pgc-txt--sm { font-size: 14px; }
.pgc-num { fill: var(--neon); stroke: var(--charcoal-3); stroke-width: 2; }
.pgc-num-t { fill: #fff; font-family: var(--font-body); font-size: 14px; font-weight: 700; text-anchor: middle; }
.pc-num { display: inline-grid; place-items: center; width: 1.5em; height: 1.5em; margin-right: .5em; border-radius: 50%; background: var(--neon); color: #fff; font-weight: 700; font-size: .85em; text-decoration: none; vertical-align: .1em; }
.pc-num:hover, .pc-num:focus-visible { background: #fff; color: var(--neon); }
#pc-series { scroll-margin-top: 5.5rem; }
.pgc-lbl { fill: var(--muted); font-family: var(--font-mono); font-size: 15px; font-weight: 700; }
.pgc-wire { fill: none; stroke: var(--line-strong); stroke-width: 1.5; }
.pgc-arrow { fill: var(--line-strong); }
.progno__cap { margin-top: .75rem; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
.progno__cap b { color: #fff; }
.pgc-link { cursor: pointer; }
.pgc-link .pgc-box { transition: fill .16s var(--ease-out), stroke .16s var(--ease-out); }
.pgc-link:hover .pgc-box, .pgc-link:focus-visible .pgc-box { fill: var(--neon-soft); stroke: var(--neon); stroke-width: 2; }
.pgc-link:focus-visible { outline: none; }
#pc-data, #pc-features, #pc-predict { scroll-margin-top: 5.5rem; }
#pc-data:target, #pc-features:target, #pc-predict:target { background: rgba(255,51,35,0.06); box-shadow: 0 0 0 8px rgba(255,51,35,0.06); border-radius: 4px; }
.progno + .prose { margin-top: 1.4rem; }
.figfeat { margin: 1.4rem 0 0; }
#pr-pronostic > .prose { max-width: none; }
.rff-description { fill: #fff; font-family: var(--font-body); font-size: 22px; font-weight: 500; }
.figfeat__cap { margin-top: .75rem; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
.figfeat__cap b { color: #fff; }
.figfeat__cap i { font-style: italic; }
.rff-svg { display: block; width: 100%; height: auto; background: radial-gradient(120% 150% at 50% 0%, rgba(255,51,35,.05), transparent 60%), var(--charcoal-3); border: 1px solid var(--line); border-radius: 14px; }
.rff-axis { stroke: var(--line-strong); stroke-width: 1.4; fill: none; }
.rff-tickmark { stroke: var(--line-strong); stroke-width: 1.2; }
.rff-zero { stroke: rgba(255,255,255,0.12); stroke-width: 1; }
.rff-zone { fill: rgba(255,51,35,0.06); }
.rff-curve { fill: none; stroke: #fff; stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; }
.rff-curve--fault { stroke: var(--neon); stroke-width: 2.8; }
.rff-keypoints circle { fill: #fff; stroke: var(--neon); stroke-width: 1.8; }
.rff-ann { stroke: rgba(255,255,255,0.30); stroke-width: 1; stroke-dasharray: 5 4; fill: none; }
.rff-ann--faint { stroke: rgba(255,255,255,0.16); }
.rff-dim { stroke: rgba(255,255,255,0.65); stroke-width: 1.3; }
.rff-arrowhead { fill: rgba(255,255,255,0.65); }
.rff-lbl { fill: #fff; font-family: var(--font-mono); font-size: 20px; }
.rff-lbl--faint { fill: rgba(255,255,255,0.5); font-family: var(--font-mono); font-size: 16px; }
.rff-neon { fill: var(--neon); }
.rff-tick { fill: var(--muted); font-family: var(--font-mono); font-size: 17px; }
.rff-eq { fill: rgba(255,255,255,0.85); font-family: var(--font-mono); font-size: 21px; }
.rff-axistitle { fill: rgba(255,255,255,0.72); font-family: var(--font-body); font-weight: 600; font-size: 19px; }

/* Lightbox (agrandissement plein écran) */
.lightbox { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 3vmin; background: rgba(6, 7, 9, 0.92); backdrop-filter: blur(3px); cursor: zoom-out; opacity: 0; transition: opacity .22s var(--ease-out); }
.lightbox.is-open { opacity: 1; }
.lightbox[hidden] { display: none; }
.lightbox__img { max-width: 96vw; max-height: 92vh; width: auto; height: auto; border-radius: 10px; box-shadow: 0 24px 80px rgba(0, 0, 0, 0.6); background: #fff; }
.lightbox__close { position: fixed; top: 14px; right: 18px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: rgba(20, 22, 25, 0.72); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; transition: background .18s var(--ease-out); }
.lightbox__close:hover { background: var(--neon); border-color: transparent; }
body.has-lightbox { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .lightbox { transition: none; } }

/* Démonstrateur embarqué interactif (chapitre 2.3) */
.demokit { margin: 1.7rem 0 0.5rem; }
.demokit__stage { border-radius: 14px; overflow: hidden; background: var(--charcoal-3); }
/* Cadre au theme, partage par la scene et les vignettes : lisere degrade neon
   et lueur uniforme sur les quatre bords. Le masque en exclusion ne garde que
   l'anneau de bordure ; border-image donnerait le degrade mais ignorerait le
   rayon des coins. */
.demokit__stage,
.demokit__item {
  position: relative;
  box-shadow: 0 0 58px -16px var(--neon-glow);
}
.demokit__stage::after,
.demokit__item::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  border-radius: inherit; padding: 1px;
  background: linear-gradient(135deg,
    var(--neon) 0%, var(--neon-glow) 20%,
    rgba(255, 255, 255, 0.10) 52%,
    var(--neon-soft) 76%, var(--neon) 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
}
.demokit__photo { display: block; width: 100%; height: auto; }
#su-demonstrateur .demokit__stage,
#pr-detection .demokit__stage { width: 100%; }
#su-demonstrateur .demokit__hint { max-width: none; width: 100%; }
#su-demonstrateur .demokit__item--carte { width: min(100%, 480px); justify-self: center; }
#pr-detection .prose:has(+ .demokit),
#pr-detection .demokit__cap,
#pr-detection .demokit__hint { width: 100%; max-width: none; }
.demokit__hot { position: absolute; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .62rem .3rem .32rem; border-radius: 999px; background: rgba(12, 13, 15, 0.74); border: 1px solid var(--neon); color: #fff; cursor: pointer; font: 600 var(--t-micro)/1 var(--font-mono); letter-spacing: .04em; white-space: nowrap; transition: background .18s var(--ease-out); }
.demokit__hot:hover, .demokit__hot.is-active { background: var(--neon); border-color: transparent; }
.demokit__dot { width: 11px; height: 11px; border-radius: 50%; background: var(--neon); flex: none; }
.demokit__hot:hover .demokit__dot, .demokit__hot.is-active .demokit__dot { background: #fff; }
.demokit__hot .demokit__dot { animation: demoPulse 2.2s ease-out infinite; }
@keyframes demoPulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--neon) 55%, transparent); } 70% { box-shadow: 0 0 0 13px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.demokit__panel { margin-top: 1rem; }
.demokit__hint { color: var(--muted); font-size: var(--t-small); line-height: 1.5; }
.demokit__hint b { color: #fff; font-weight: 600; }
.demokit__content { position: relative; }
.demokit__grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.demokit__close { position: absolute; top: -0.4rem; right: 0; z-index: 2; display: inline-flex; align-items: center; gap: .35rem; padding: .32rem .7rem; border-radius: 999px; background: rgba(12, 13, 15, 0.86); border: 1px solid var(--neon); color: #fff; cursor: pointer; font: 600 var(--t-micro)/1 var(--font-mono); letter-spacing: .04em; transition: background .18s var(--ease-out); }
.demokit__close:hover, .demokit__close:focus-visible { background: var(--neon); border-color: transparent; }
.demokit__item { margin: 0; background: var(--charcoal-2); border-radius: 12px; padding: 10px; }
.demokit__item img { display: block; width: 100%; height: auto; border-radius: 8px; cursor: zoom-in; }
.demokit__item figcaption { margin-top: .55rem; color: var(--neon); text-align: center; font-size: var(--t-micro); line-height: 1.45; }
.demokit__item figcaption b { color: var(--neon); font-weight: 700; }
#su-demonstrateur .demokit__item figcaption,
#su-demonstrateur .demokit__item figcaption b { color: #fff; }
.demokit__cap { margin-top: .75rem; color: var(--muted); font-size: var(--t-small); line-height: 1.55; }
.demokit__cap b { color: #fff; }
@media (prefers-reduced-motion: reduce) { .demokit__hot .demokit__dot { animation: none; } }

/* ===== Bilan de l'axe — panneau clair à identité forte (filigrane Lucide) ===== */
.bilan {
  --bl-ink:#191b1e; --bl-soft:#3a3e44; --bl-mut:#6b7178; --bl-red:#CE2417; --bl-red-d:#A81810;
  --bl-surf: rgba(255,255,255,.55); --bl-line: rgba(0,0,0,.09);
  position: relative; overflow: hidden; isolation: isolate;
  margin: 1.8rem 0 0; border-radius: 20px;
  padding: clamp(1.5rem, 1rem + 3vw, 2.8rem);
  background: radial-gradient(135% 150% at 100% 0%, #F3F1ED 0%, #E7E4DE 68%, #DEDAD3 100%);
  color: var(--bl-ink);
  box-shadow: 0 30px 60px -26px rgba(0,0,0,.65), inset 0 0 0 1px rgba(0,0,0,.05);
}
.bilan__wm { position: absolute; z-index: 0; right: -36px; bottom: -48px; width: clamp(210px, 32%, 340px); color: var(--bl-ink); opacity: .06; pointer-events: none; }
#surveillance .bilan, #pronostic .bilan, #incendie .bilan { --t-small: 1.02rem; --t-micro: .85rem; --t-body: 1.1rem; }
.bilan__projects .bp--wide { grid-column: 1 / -1; }
.bp--roadmap { margin: 0; }
.bp--roadmap img { display: block; width: 100%; height: auto; border-radius: 8px; margin: .35rem 0 .5rem; cursor: zoom-in; }
#pronostic .bilan__inner > .bilan__lead:last-child,
#incendie .bilan__inner > .bilan__lead:last-child { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; }
#pronostic .bilan__seed { max-width: none; }
/* la photo prend la hauteur de la carte voisine sans l'imposer a la rangee */
.bp--photo { position: relative; padding: 0; overflow: hidden; min-height: 180px; }
.bp--photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; cursor: zoom-in; }
.bilan__wm svg { width: 100%; height: auto; stroke-width: .9; }
.bilan__inner { position: relative; z-index: 1; }
.bilan__locks { padding-bottom: 1.5rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--bl-line); }
.bilan__locklist { list-style: none; counter-reset: lk; display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; padding: 0; margin: 0; }
.bilan__locklist > li { counter-increment: lk; padding: .9rem 1.05rem; border-radius: 12px; background: var(--bl-surf); border: 1px solid var(--bl-line); }
.bilan__locklist > li::before { content: "0" counter(lk); display: block; font-family: var(--font-mono); font-size: var(--t-micro); color: var(--bl-red); letter-spacing: .1em; margin-bottom: .3rem; }
.bilan__locklist b { display: block; color: var(--bl-ink); font-weight: 600; font-size: var(--t-small); line-height: 1.35; min-height: 4.1em; text-wrap: balance; }
.bilan__locklist ul { list-style: none; padding: 0; margin: .5rem 0 0; display: grid; gap: .3rem; }
.bilan__locklist ul li { position: relative; padding-left: .9rem; color: var(--bl-soft); font-size: var(--t-small); line-height: 1.35; }
.bilan__locklist ul li::before { content: ""; position: absolute; left: 0; top: .55em; width: 5px; height: 5px; border-radius: 50%; background: var(--bl-red); }
@media (max-width: 760px) { .bilan__locklist { grid-template-columns: 1fr; } }
.bilan__lead { display: flex; align-items: center; gap: clamp(1rem, 2.5vw, 2.2rem); flex-wrap: wrap; padding-bottom: 1.5rem; margin-bottom: 1.5rem; border-bottom: 1px solid var(--bl-line); }
.bilan__big { font-family: var(--font-display); font-weight: 300; font-size: clamp(3rem, 2rem + 5vw, 4.75rem); line-height: .88; color: var(--bl-red); letter-spacing: -.02em; }
.bilan__leadtxt { flex: 1 1 320px; }
.bilan__role, .bilan__kicker { display: inline-block; font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .16em; text-transform: uppercase; color: var(--bl-red-d); margin-bottom: .55rem; }
.bilan__leadtxt p { color: var(--bl-soft); font-size: var(--t-body); line-height: 1.6; margin: 0; }
.bilan__leadtxt b { color: var(--bl-ink); font-weight: 600; }
.bilan__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(1.4rem, 3vw, 2.6rem); align-items: stretch; }
.bilan__col { display: flex; flex-direction: column; }
.bilan__people { display: grid; gap: .85rem; }
.bilan__projects { grid-template-columns: 1fr 1fr; }
.bilan__projects .bp { display: flex; flex-direction: column; }
.bilan__projects .bp__meta { margin-top: auto; }
.bilan__projects .bp__who { color: var(--bl-red); font-size: var(--t-lead); }
.bilan__projects .bp__what b { color: var(--bl-ink); font-weight: 600; }
@media (max-width: 760px) { .bilan__projects { grid-template-columns: 1fr; } }
.bp { padding: .9rem 1.05rem; border-radius: 12px; background: var(--bl-surf); border: 1px solid var(--bl-line); }
.bp__who { font-family: var(--font-body); font-weight: 600; color: var(--bl-ink); font-size: var(--t-card); }
.bp__what { color: var(--bl-soft); font-size: var(--t-small); line-height: 1.5; margin: .25rem 0 .45rem; }
.bp__meta { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .03em; color: var(--bl-mut); }
.bilan__seed { margin: .8rem 0 0; padding-top: .7rem; border-top: 1px solid rgba(25,27,30,0.10); color: var(--bl-mut); font-size: var(--t-small); line-height: 1.45; }
.bilan__seed b { color: var(--bl-soft); font-weight: 600; }
.bilan__impacts { display: flex; gap: .8rem; flex: 1; }
.bi { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; justify-content: center; padding: 1rem; border-radius: 12px; background: var(--bl-surf); border: 1px solid var(--bl-line); }
.bi .v { display: block; font-family: var(--font-display); font-weight: 700; font-size: clamp(2.8rem, 1.8rem + 2.6vw, 3.6rem); color: var(--bl-red); line-height: 1; letter-spacing: -.03em; }
.bi .v sup { font-size: .5em; }
.bi .k { display: block; margin-top: .35rem; color: var(--bl-soft); font-size: var(--t-small); line-height: 1.35; }
/* compteurs du bilan reutilises hors du panneau clair, sur fond sombre */
.axe-impacts { --bl-red: var(--neon); --bl-soft: rgba(255,255,255,.72); --bl-surf: rgba(255,255,255,.04); --bl-line: rgba(255,255,255,.14); max-width: 720px; margin: 1.4rem 0 2.2rem; }
.bilan__kicker--sub { margin-top: 1.1rem; }
/* deux 16:9 en tete, a hauteur egale */
.bilan__events { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; align-items: start; }
@media (max-width: 600px) { .bilan__events { grid-template-columns: 1fr; } }
.bev { margin: 0; position: relative; }
.bev img { display: block; width: 100%; height: auto; border-radius: 8px; border: 1px solid var(--bl-line); cursor: zoom-in; }
.bev figcaption { margin-top: .35rem; font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .02em; color: var(--bl-mut); line-height: 1.3; }
.bilan__feature { margin-top: 1.7rem; padding-top: 1.6rem; border-top: 1px solid var(--bl-line); display: grid; grid-template-columns: 1fr minmax(260px, 40%); gap: clamp(1.2rem, 3vw, 2.4rem); align-items: center; }
.bilan__feat-title { font-family: var(--font-body); font-weight: 600; color: var(--bl-ink); font-size: var(--t-lead); line-height: 1.2; margin: .35rem 0 .6rem; }
.bilan__feat-txt p { color: var(--bl-soft); font-size: var(--t-body); line-height: 1.6; margin: 0 0 .9rem; max-width: 60ch; }
.bilan__feat-txt b { color: var(--bl-ink); font-weight: 600; }
.bilan__press { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .02em; color: var(--bl-mut); margin: 0 0 .9rem; }
.bilan__press a { color: var(--bl-red-d); text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px; }
.bilan__press a:hover { color: var(--bl-red); }
.bilan__specs { list-style: none; display: flex; flex-wrap: wrap; gap: .5rem; padding: 0; margin: 0; }
.bilan__specs li { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .02em; color: var(--bl-red-d); background: rgba(206,36,23,.08); border: 1px solid rgba(206,36,23,.22); border-radius: 20px; padding: .25rem .7rem; }
.bilan__feat-img { margin: 0; display: flex; flex-direction: column; align-items: center; }
.bilan__feat-img img { width: auto; max-width: 100%; max-height: 400px; height: auto; display: block; filter: drop-shadow(0 16px 26px rgba(0,0,0,.28)); }
.bilan__feat-cap { display: block; margin-top: .5rem; font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .02em; color: var(--bl-mut); text-align: center; }
@media (max-width: 700px) { .bilan__feature { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .bilan__grid { grid-template-columns: 1fr; } }
@media (max-width: 520px) { .bilan__impacts { flex-direction: column; } .bi { flex: 0 0 auto; } }

/* Bloc HDR générique (encadrement / rayonnement) */
.hdr-block { margin: 1.7rem 0; }
.hdr-block__head { display: flex; align-items: baseline; gap: 0.7rem; flex-wrap: wrap; margin-bottom: 0.9rem; }
.hdr-block__kicker { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.14em; text-transform: uppercase; color: var(--neon); }
.hdr-block__title { font-family: var(--font-body); font-weight: 600; color: #fff; font-size: var(--t-lead); }

/* Rôle / pilotage en exergue */
.lead-role {
  display: flex; gap: 1.1rem; align-items: center; margin: 1.4rem 0;
  padding: 1.1rem 1.3rem; border: 1px dashed var(--line-strong); border-radius: 12px;
}
.lead-role .big {
  flex: 0 0 auto; font-family: var(--font-display); font-weight: 300; color: #fff;
  font-size: clamp(1.7rem, 1rem + 2.4vw, 2.6rem); line-height: 1; letter-spacing: -0.02em;
}
.lead-role .txt { color: var(--ink-soft); font-size: var(--t-small); line-height: 1.55; }
.lead-role .txt b { color: #fff; font-weight: 600; }

/* Personnes encadrées */
.people { display: grid; gap: 0.7rem; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.person { border: 1px solid var(--line); border-left: 2px solid var(--neon); border-radius: 8px; padding: 0.85rem 1rem; background: var(--glass); }
.person .who { color: #fff; font-weight: 600; }
.person .what { color: var(--muted); font-size: var(--t-small); line-height: 1.45; margin-top: 0.25rem; }
.person .meta { font-family: var(--font-mono); font-size: var(--t-micro); color: var(--faint); letter-spacing: 0.04em; margin-top: 0.45rem; }
.person .prod { color: var(--neon-2); }

/* Rayonnement & transfert — bandeau impact */
.impact-band {
  display: grid; gap: 1px; background: var(--line);
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  border: 1px solid var(--neon); border-radius: 12px; overflow: hidden;
}
.impact { background: var(--charcoal-2); padding: 1.1rem 1.2rem; display: grid; gap: 0.3rem; }
.impact .v { font-family: var(--font-display); font-weight: 300; color: var(--neon-2); font-size: clamp(1.35rem, 1rem + 1.5vw, 1.9rem); line-height: 1; }
.impact .v sup { font-size: 0.55em; }
.impact .k { font-size: var(--t-micro); color: var(--ink-soft); line-height: 1.4; }

/* Orientation ouverte (pivot thématique) */
.pivot {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  margin-top: 1.6rem; padding: 1.1rem 1.3rem; border: 1px solid var(--line);
  border-radius: 12px; background: linear-gradient(90deg, var(--neon-soft), transparent 70%);
}
.pivot .arrow { flex: 0 0 auto; color: var(--neon); font-size: 1.5rem; line-height: 1; }
.pivot .txt { color: var(--ink-soft); font-size: var(--t-small); line-height: 1.55; }
.pivot .txt b { color: #fff; }

/* ===== Seuil de transition entre chapitres ===== */
.threshold {
  position: relative; display: block; overflow: hidden; isolation: isolate;
  margin: 2.4rem 0 0.5rem; padding: clamp(1.6rem, 1rem + 3vw, 2.8rem);
  border-radius: 18px; text-decoration: none; color: inherit;
  background: radial-gradient(130% 170% at 50% 130%, var(--neon-soft), transparent 62%), var(--charcoal-2);
  border: 1px solid var(--line);
  box-shadow: inset 0 1px 0 var(--line-strong), 0 30px 60px -30px rgba(0,0,0,.8);
  transition: border-color var(--dur) var(--ease-out);
}
.threshold:hover { border-color: color-mix(in srgb, var(--neon) 45%, var(--line)); }
.threshold:focus-visible { outline: 2px solid var(--neon); outline-offset: 3px; }
.threshold::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 2px; z-index: 2; background: linear-gradient(90deg, transparent, var(--neon), transparent); opacity: .7; }
.threshold::after { content: ""; position: absolute; left: 0; right: 0; bottom: -45%; height: 70%; z-index: 0; pointer-events: none; background: radial-gradient(55% 100% at 50% 100%, var(--neon-glow), transparent 70%); opacity: .28; animation: thGlow 4s ease-in-out infinite; }
@keyframes thGlow { 0%, 100% { opacity: .14; transform: translateY(8px); } 50% { opacity: .34; transform: translateY(0); } }
.threshold__wm { position: absolute; top: .2rem; right: 1rem; z-index: 0; pointer-events: none; font-family: var(--font-display); font-weight: 700; font-size: clamp(3.4rem, 2rem + 7vw, 8rem); letter-spacing: -.04em; color: #fff; opacity: .045; line-height: 1; white-space: nowrap; }
.threshold__grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(1.4rem, 3vw, 2.8rem); align-items: center; }
@media (max-width: 780px) { .threshold__grid { grid-template-columns: 1fr; } }
.threshold__kicker { display: inline-block; font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: .16em; text-transform: uppercase; color: var(--neon); margin-bottom: .6rem; }
.threshold__title { font-family: var(--font-display); font-weight: 300; text-transform: uppercase; font-size: clamp(1.5rem, 1rem + 2.4vw, 2.35rem); line-height: 1.06; letter-spacing: -.02em; color: #fff; margin: 0 0 .75rem; }
.threshold__title em { font-style: normal; color: var(--neon); }
.threshold__title .soft { color: var(--muted); }
.threshold__lead { color: var(--ink-soft); font-size: var(--t-body); line-height: 1.6; margin: 0; max-width: 56ch; }
.threshold__lead b { color: #fff; font-weight: 600; }
.threshold__viz { margin: 0; display: flex; flex-direction: column; gap: .55rem; }
.tw { width: 100%; height: auto; display: block; }
.tw__cap { font-family: var(--font-mono); font-size: var(--t-micro); color: var(--muted); text-align: center; line-height: 1.4; }
.tw__cap b { color: #fff; font-weight: 600; }
.tw-axis { stroke: var(--line-strong); }
.tw-noise { fill: none; stroke: var(--slate); stroke-width: 1.4; opacity: .55; stroke-linejoin: round; stroke-linecap: round; }
.tw-peak { fill: var(--neon); }
.tw-peak-glow { fill: var(--neon); opacity: .22; }
.tw-peakg { transform-box: fill-box; transform-origin: 50% 100%; animation: twFade 4.6s ease-in-out infinite; }
@keyframes twFade { 0%, 12% { transform: scaleY(1); opacity: 1; } 50%, 62% { transform: scaleY(.16); opacity: .6; } 100% { transform: scaleY(1); opacity: 1; } }
.tw-bip-line { fill: none; stroke: var(--neon); stroke-width: 2.6; stroke-linejoin: round; stroke-linecap: round; }
.tw-bip-glow { fill: none; stroke: var(--neon); stroke-width: 7; opacity: .16; stroke-linejoin: round; stroke-linecap: round; }
.tw-bip { transform-box: fill-box; transform-origin: 50% 50%; animation: twBip 5s ease-in-out infinite; }
@keyframes twBip { 0%, 12% { transform: scaleY(1); opacity: 1; } 50%, 60% { transform: scaleY(.08); opacity: .72; } 100% { transform: scaleY(1); opacity: 1; } }
.threshold__cue { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: .35rem; margin-top: 1.5rem; padding-top: 1.2rem; border-top: 1px solid var(--line); color: var(--neon); }
.threshold__next { font-family: var(--font-mono); font-size: var(--t-small); letter-spacing: .14em; text-transform: uppercase; }
.threshold__chev { width: 26px; height: 26px; animation: thBounce 1.8s ease-in-out infinite; }
@keyframes thBounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(7px); } }
.threshold:hover .threshold__chev { color: var(--neon-2); }
@media (prefers-reduced-motion: reduce) { .threshold::after, .threshold__chev, .tw-peakg, .tw-bip { animation: none; } }

/* Références explicites (production scientifique de l'axe) */
.cite-list { display: grid; gap: 0.7rem; margin: 1.4rem 0; }
.cite {
  display: grid; grid-template-columns: 116px 1fr; gap: 0.5rem 1.1rem; align-items: start;
  padding: 0.9rem 1.1rem; border: 1px solid var(--line); border-left: 2px solid var(--neon);
  border-radius: 10px; background: var(--glass);
}
.cite__type {
  align-self: start; text-align: center; white-space: nowrap;
  font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--neon-2); border: 1px solid var(--line-strong); border-radius: 999px; padding: 0.28rem 0.5rem;
}
.cite__ref { margin: 0; color: var(--ink-soft); font-size: var(--t-small); line-height: 1.55; }
.cite__ref i { color: #fff; font-style: italic; }
.cite__ref a { color: var(--neon-2); border-bottom: 1px solid transparent; transition: border-color var(--dur); }
.cite__ref a:hover { border-bottom-color: var(--neon-2); }
.cite__ref .ref__auth { color: var(--muted); }
@media (max-width: 560px) { .cite { grid-template-columns: 1fr; } }

/* Pastille de référence inline (nature + titre) + infotip au survol/focus */
.ref {
  position: relative; display: inline-flex; align-items: baseline; gap: 0.45rem;
  max-width: 100%; vertical-align: middle; cursor: help;
  border: 1px solid var(--line); background: var(--glass); border-radius: 999px;
  padding: 0.28rem 0.75rem; margin: 0.2rem 0.3rem 0 0;
  transition: border-color var(--dur), background var(--dur);
}
.ref:hover, .ref:focus-visible { border-color: var(--neon); background: var(--neon-soft); outline: none; }
#su-omtdr > .refs .ref { padding-inline: 0.5rem; margin-right: 0; }
.ref__kind {
  flex: 0 0 auto; font-family: var(--font-mono); font-size: 0.6rem;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--neon-2); white-space: nowrap;
}
.ref__title {
  min-width: 0; font-size: var(--t-small); color: var(--ink-soft); line-height: 1.2;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 34ch;
}
.ref:hover .ref__title, .ref:focus-visible .ref__title { color: #fff; }

.ref__tip {
  position: absolute; bottom: calc(100% + 9px); left: 0; z-index: 80;
  width: max-content; max-width: min(360px, 82vw);
  background: var(--charcoal); border: 1px solid var(--line-strong); border-radius: 10px;
  padding: 0.8rem 0.9rem; box-shadow: 0 14px 34px rgba(0, 0, 0, 0.6);
  font-size: var(--t-small); color: var(--ink-soft); line-height: 1.5; white-space: normal;
  opacity: 0; visibility: hidden; transform: translateY(5px); pointer-events: none;
  transition: opacity var(--dur), transform var(--dur), visibility var(--dur);
}
.ref__tip i { color: #fff; font-style: italic; }
.ref__tip .ref__auth { color: var(--muted); }
.ref__tip a { color: var(--neon-2); pointer-events: auto; }
.ref__tip::after {
  content: ""; position: absolute; top: 100%; left: 22px;
  border: 6px solid transparent; border-top-color: var(--charcoal);
}
.ref:hover .ref__tip, .ref:focus-within .ref__tip { opacity: 1; visibility: visible; transform: translateY(0); }

/* Chap. 4 - verrous du contexte a la taille du texte courant */
#fi-contexte .synthese__ans li { font-size: var(--t-lead); line-height: 1.55; }

/* Chap. 4.1 - cartographie thermique pleine largeur, texte dessous */
#fi-signature .poc-fig__top,
#fi-demonstrateur .poc-fig__top { grid-template-columns: minmax(0, 1fr); }
#fi-signature .poc-fig__top .poc-fig__aside p,
#fi-demonstrateur .poc-fig__top .poc-fig__aside p { max-width: none; }
figure.poc-fig .poc-fig__img:not([data-zoom]) { cursor: default; }