/* ISSLA RISK - Service page compositions (every /services/<name>/ page built from src/services/*.json by tools/service_page.py).
   Loaded after archive.css, which supplies the shared Archive components used here: compact photo hero, filing cabinet (.caps/.cab/.dr),
   report page drawing (.pg), FAQ accordion (.faq/.qa) and empty-folder CTA (.hs--end/.fld). This file only adds what is specific to service pages:
   the screening / investigation contrast (.cmp), the stepped workstreams (.stp), the compact report (.rpt) and the mirrored cabinet layout.
   Rhythm: dark hero / paper contrast / dark questions / paper-alt workstreams / dark report / paper FAQ / dark CTA.
   Reveals use the shared system (data-reveal*, base.css); reduced motion and html.motion-paused need nothing extra (no loops here).
   Accent: brass only, one element per section. Progressive enhancement over a complete static page. */

.sv-head { margin-bottom: var(--sp-7); }
.sv-head .hs__title { max-width: 40rem; margin-bottom: var(--sp-3); }
.sv-intro { margin: 0; max-width: 40rem; color: var(--ink-soft); font-size: var(--fs-500); }

/* 1. Contrast: a flat ledger beside a leather case holding stacked, narrowing sheets (depth = what screening cannot see). */
.sv-cmp { padding-block: clamp(3rem, 2rem + 4vw, 5.5rem); }
.cmp { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-5); align-items: stretch; }
@media (min-width: 820px) { .cmp { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(1.5rem, 4vw, 3.5rem); } }
.cmp__side { display: flex; flex-direction: column; min-width: 0; padding: clamp(1.25rem, 2.4vw, 2rem); border-radius: 3px; }
.cmp__name { margin: 0 0 var(--sp-1); font: 500 var(--fs-600) / 1.2 var(--font-serif); }
.cmp__sub { margin: 0 0 var(--sp-5); font-size: var(--fs-300); line-height: 1.4; }
.cmp ul { list-style: none; margin: 0; padding: 0; }
.cmp__k { display: block; font-weight: 600; }
.cmp__t { display: block; }
.cmp__foot { margin: auto 0 0; padding-top: var(--sp-5); }

.cmp__side--flat { /* flat ledger: no depth, no shadow, quiet ink */
  background: var(--paper-alt);
  border: 1px solid var(--line); color: var(--ink-soft);
}
.cmp__side--flat .cmp__name { color: var(--ink-soft); }
.cmp__side--flat .cmp__sub { color: var(--ink-soft); }
.cmp__side--flat li { padding: 0.8rem 0; border-top: 1px solid var(--line); }
.cmp__side--flat li:last-child { border-bottom: 1px solid var(--line); }
.cmp__side--flat .cmp__k { font: 600 var(--fs-300) / 1.4 var(--font-sans); color: var(--ink-soft); }
.cmp__side--flat .cmp__t { font: 400 var(--fs-400) / 1.45 var(--font-serif); color: var(--ink-soft); }
.cmp__side--flat .cmp__foot { font: italic 400 var(--fs-400) / 1.5 var(--font-serif); color: var(--ink-soft); border-top: 0; }

.cmp__side--deep { /* leather case: soft light from above, contact shadow, sheets inside */
  background: var(--leather); color: var(--on-dark); border: 1px solid rgba(196, 164, 104, 0.4);
  box-shadow: inset 0 1px 0 rgba(246, 244, 238, 0.14), 0 30px 44px -26px rgba(9, 36, 50, 0.7);
}
.cmp__side--deep .cmp__name { color: var(--brass-hi); }
.cmp__side--deep .cmp__sub { color: var(--on-dark-soft); }
.cmp__layers { padding-bottom: 0.35rem; }
.lyr {
  position: relative; z-index: calc(10 - var(--n)); margin-inline: calc(var(--n) * clamp(0.45rem, 0.2rem + 1.2vw, 0.95rem));
  padding: 0.85rem 1.15rem 0.95rem; color: var(--ink);
  background: linear-gradient(180deg, #fbf9f3, #f0ece0); border-left: 3px solid var(--brass);
  box-shadow: inset 0 1px 0 #fff, 0 12px 16px -10px rgba(0, 0, 0, 0.75);
}
.lyr::before { /* each deeper sheet sits a little further from the light */
  content: ""; position: absolute; inset: 0; pointer-events: none; background: rgba(9, 36, 50, calc(var(--n) * 0.05));
}
.lyr + .lyr { margin-top: -0.35rem; padding-top: 1.2rem; }
.lyr .cmp__k { font: 600 var(--fs-400) / 1.35 var(--font-serif); color: var(--ink); }
.lyr .cmp__t { margin-top: 0.1rem; font-size: var(--fs-300); line-height: 1.45; color: #33434b; }
.cmp__side--deep .cmp__foot { font: italic 400 var(--fs-400) / 1.5 var(--font-serif); color: var(--on-dark); }

/* 2. Questions: the filing cabinet from archive.css, mirrored (cabinet left, heading right from 900px). */
.hs--flip::before { background: radial-gradient(44rem 26rem at 90% 40%, rgba(27, 81, 108, 0.38), transparent 70%); }
.caps--flip .caps__intro { max-width: 27rem; }
@media (min-width: 900px) {
  .caps--flip { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  .caps--flip .caps__head { grid-column: 2; grid-row: 1; }
  .caps--flip .cab { grid-column: 1; grid-row: 1; }
}
.caps--flip .dr__plate { font-size: var(--fs-400); }

/* 3. Workstreams: stepped slabs. Each step is indented a little further than the one above and tinted a little deeper, so the list reads as
   a descent below the register. Not numbered, not a tab picker: plain headings and text, fully visible without JS. */
.sv-stp { --run: clamp(0.35rem, 0.1rem + 2.4vw, 2.25rem); padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.stp { list-style: none; margin: 0; padding: 0; }
.stp__i {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-1) var(--sp-6); margin-left: calc(var(--n) * var(--run));
  padding: var(--sp-4) var(--sp-4) var(--sp-4) clamp(1rem, 2vw, 1.5rem); border-left: 2px solid var(--brass);
  background: linear-gradient(90deg, rgba(19, 64, 87, calc(0.035 + var(--n) * 0.014)), rgba(19, 64, 87, 0) 88%);
}
.stp__i::before { /* tread: a brass lead-in, then a hairline */
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, var(--brass) 0 2.5rem, var(--line) 2.5rem);
}
.stp__i:last-child { border-bottom: 1px solid var(--line); }
.stp__t { margin: 0; font: 500 var(--fs-500) / 1.3 var(--font-serif); color: var(--ink); text-wrap: balance; }
.stp__d { margin: 0; color: var(--ink-soft); }
@media (min-width: 760px) { .stp__i { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); align-items: baseline; padding-block: var(--sp-5); } }
.stp__foot { max-width: 46rem; margin: var(--sp-6) 0 0; font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }

/* 4. Report ("what the report contains"): the section IS an open folder (kraft interior, grain, central crease, two flaps). A report sheet lies on the right
   flap showing only the STRUCTURE of a report (labels, redaction bars, grey text bars) and dissolves halfway down (mask). Sheet = decorative (aria-hidden);
   the live text on the left flap carries the meaning. Rise + mask reveal use the shared reveal class (.is-in on .rf__stage); html.motion only. */
@property --f { syntax: "<percentage>"; inherits: false; initial-value: 84%; }
.sv-rf {
  --kraft: #c9b383; --kraft-d: #b39b68; --rf-ink: #1c262b;
  position: relative; isolation: isolate; overflow: hidden; padding-block: 0; color: var(--rf-ink);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9 .035' numOctaves='2' seed='7'/%3E%3CfeColorMatrix values='0 0 0 0 .32 0 0 0 0 .22 0 0 0 0 .08 0 0 0 .5 -.12'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E"),
    radial-gradient(70rem 36rem at 62% 30%, rgba(255, 244, 214, 0.34), transparent 70%),
    linear-gradient(180deg, #cdb88a, var(--kraft) 55%, var(--kraft-d));
  box-shadow: inset 0 18px 22px -16px rgba(58, 40, 10, 0.5), inset 0 -18px 22px -16px rgba(58, 40, 10, 0.5);
}
.rf { display: grid; grid-template-columns: minmax(0, 1fr); }
.rf__flap { position: relative; padding: clamp(2.5rem, 1.5rem + 4vw, 5rem) var(--gutter); }
.rf__flap--l { background: linear-gradient(180deg, transparent 70%, rgba(70, 48, 12, 0.2)); }
.rf__flap--r { background: linear-gradient(180deg, rgba(70, 48, 12, 0.22), transparent 26%), linear-gradient(rgba(255, 246, 220, 0.12), rgba(255, 246, 220, 0.12)); }
.rf__flap--r::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: linear-gradient(180deg, rgba(58, 40, 10, 0.45), rgba(255, 244, 214, 0.5)); box-shadow: 0 0 18px 5px rgba(58, 40, 10, 0.2); }
.rf__txt { max-width: 34rem; margin-inline: auto; }
.rf__head .hs__title { margin-bottom: var(--sp-4); }
.rf__intro { margin: 0 0 var(--sp-4); color: var(--rf-ink); font-size: var(--fs-500); line-height: 1.6; }
.rf__stage { width: min(100%, 30rem); margin-inline: auto; }
.rf__shadow { container-type: inline-size; filter: drop-shadow(0 22px 22px rgba(52, 36, 8, 0.38)) drop-shadow(0 3px 4px rgba(52, 36, 8, 0.3)); transform: rotate(-1.4deg); }
.rf__cap { margin: calc(var(--sp-5) - 7rem) 0 0; position: relative; text-align: center; font: 600 var(--fs-300) / 1.4 var(--font-sans); color: #2c2412; letter-spacing: 0.01em; }
.rf__sheet {
  --f: 84%; position: relative; aspect-ratio: 5 / 7.4; overflow: hidden; border-radius: 2px; font: 400 clamp(14px, 3.5cqw, 18px) / 1.35 var(--font-sans); color: #26323a;
  background: linear-gradient(180deg, #fbf9f1, #f3efe2); padding: 6.2% 7% 0 8%; border-left: 0.35em solid var(--brass);
  -webkit-mask-image: linear-gradient(180deg, #000 calc(var(--f) * 0.46), transparent var(--f)); mask-image: linear-gradient(180deg, #000 calc(var(--f) * 0.46), transparent var(--f));
}
.sh > * + * { margin-top: 0.9em; }
.sh i { display: block; }
.sh .rb { display: inline-block; vertical-align: middle; width: var(--w); height: 0.95em; border-radius: 1px; background: #2b373d; }
.sh .gb { display: block; width: var(--w); height: 0.6em; margin-top: 0.5em; border-radius: 1px; background: #cfc9b9; }
.sh__run { display: flex; align-items: baseline; justify-content: space-between; gap: 0.7em; padding-bottom: 0.5em; border-bottom: 1px solid var(--brass); font-size: 1em; }
.sh__run b { color: #0f2740; } .sh__run em { font-style: normal; font-weight: 700; color: #7d1b12; letter-spacing: 0.04em; }
.sh__ttl { display: grid; justify-items: center; gap: 0.5em; padding: 1em; background: #14263f; text-align: center; }
.sh__t { font: 700 1.3em / 1.15 var(--font-serif); color: #e6c878; letter-spacing: 0.02em; }
.sh .rb--w { background: #e9e6dc; opacity: 0.92; }
.sh__meta { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--brass); background: #edf0f3; }
.sh__meta div { padding: 0.45em 0.3em 0.6em; text-align: center; } .sh__meta div + div { border-left: 1px solid var(--brass); }
.sh__meta small { display: block; margin-bottom: 0.3em; font-size: 1em; font-weight: 700; letter-spacing: 0; color: #1f2a36; }
.sh__meta .rb { width: 70%; }
.sh__kv { margin: 0; border: 1px solid #c2c9d1; }
.sh__kv div { display: grid; grid-template-columns: 40% 1fr; } .sh__kv div + div { border-top: 1px solid #c2c9d1; }
.sh__kv dt { margin: 0; padding: 0.45em 0.6em; font-weight: 700; font-size: 1em; background: #e8ecf1; color: #14202c; }
.sh__kv dd { margin: 0; padding: 0.45em 0.6em; display: grid; gap: 0.35em; align-content: center; }
.sh__bar { padding: 0.5em 0.8em; background: #14263f; color: #fff; font: 700 1em / 1.2 var(--font-sans); letter-spacing: 0.01em; }
.sh__call { padding: 0.7em 0.9em; background: #fdf3e0; border-left: 0.3em solid var(--brass); font-size: 1em; }
.sh__call b { color: #5c3700; } .sh__call div { margin-top: 0.3em; }
.sh__key { display: flex; flex-wrap: wrap; gap: 0.4em; }
.pl { display: inline-block; padding: 0.1em 0.6em; border-radius: 99px; font: 700 1em / 1.4 var(--font-sans); letter-spacing: 0.02em; }
.pl--r { background: #f6dcd7; color: #7d1b12; } .pl--o { background: #f8e7c8; color: #5c3700; } .pl--g { background: #dcefe0; color: #124a26; } .pl--n { background: #e6e8ea; color: #2c343c; }
.sh .pl--x { width: 4em; height: 1.1em; padding: 0; background: #d7dade; }
.sh__tab { border: 1px solid #c2c9d1; font-size: 1em; }
.sh__h, .sh__r { display: grid; grid-template-columns: 1fr 5em; gap: 0.6em; padding: 0.4em 0.6em; align-items: center; }
.sh__h { background: #14263f; color: #fff; font-weight: 700; }
.sh__r:nth-child(odd) { background: #f1f3f5; } .sh__r span:first-child { color: #14202c; }
.sh__src, .sh__note { font-size: 1em; color: #26323a; } .sh__src b { color: #14202c; }
.sh__tx { padding-inline: 0.3em; }
.sh__lim { padding: 0.7em 0.9em; background: #e9f0f8; border-left: 0.3em solid #14263f; font-size: 1em; } .sh__lim b { color: #0f2740; }
@media (min-width: 900px) {
  .rf { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .rf__flap--l { padding-left: max(var(--gutter), calc((100vw - var(--wrap)) / 2)); padding-right: clamp(2rem, 5vw, 5rem); display: flex; align-items: center; background: linear-gradient(90deg, transparent 72%, rgba(70, 48, 12, 0.2)); }
  .rf__flap--l .rf__txt { margin: 0; }
  .rf__flap--r { padding-right: max(var(--gutter), calc((100vw - var(--wrap)) / 2)); padding-left: clamp(2rem, 5vw, 5rem); background: linear-gradient(90deg, rgba(70, 48, 12, 0.24), transparent 24%), linear-gradient(rgba(255, 246, 220, 0.12), rgba(255, 246, 220, 0.12)); }
  .rf__flap--r::before { left: -1px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; background: linear-gradient(90deg, rgba(58, 40, 10, 0.45), rgba(255, 244, 214, 0.5)); }
  .rf__stage { width: min(100%, 34rem); margin-inline: 0 auto; }
}
html.motion .rf__stage[data-reveal] .rf__shadow { transform: translate3d(0, 34px, 0) rotate(-5deg); transition: transform var(--dur-out) var(--ease-out); }
html.motion .rf__stage[data-reveal] .rf__sheet { --f: 12%; transition: --f var(--dur-out) var(--ease-out); }
html.motion .rf__stage[data-reveal].is-in .rf__shadow { transform: rotate(-1.4deg); transition: transform 1300ms var(--ease-out); }
html.motion .rf__stage[data-reveal].is-in .rf__sheet { --f: 84%; transition: --f 1600ms var(--ease-out) 250ms; }
html.motion-paused .rf__shadow, html.motion-paused .rf__sheet { transition: none !important; }

/* 6. Depth slider ("the question sets the depth"): text and a 6-stop control on the left, a decorative graph on the right whose layers follow the stop.
   Without JS the six workstreams are a plain list and the graph shows every layer. html.js stacks the stages in one grid cell (height = tallest, so
   switching never shifts the layout); .is-ready (archive.js) adds the control and the layer states. */
.sv-dpt { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); --stop: 5.75rem; }
.dpt { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-6); }
.dpt__list { list-style: none; margin: 0; padding: 0; }
.dpt__i { padding: var(--sp-3) 0 var(--sp-3) var(--sp-4); border-left: 2px solid var(--brass); }
.dpt__i + .dpt__i { margin-top: var(--sp-3); }
.dpt__t { margin: 0 0 var(--sp-1); font: 500 var(--fs-600) / 1.25 var(--font-serif); color: var(--ink); text-wrap: balance; }
.dpt__d { margin: 0; color: var(--ink-soft); max-width: 34rem; }
.dpt__ctl { display: none; }
.dpt__viz {
  position: relative; border-radius: 6px; overflow: hidden; background: #faf9f5; border: 1px solid #b7b2a2;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), 0 28px 40px -26px rgba(9, 36, 50, 0.55), 0 2px 6px rgba(9, 36, 50, 0.14);
}
.dpt__viz svg { display: block; width: 100%; height: auto; }
.dpt__foot { grid-column: 1 / -1; margin: 0; max-width: 46rem; font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
@media (min-width: 900px) {
  .dpt { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--sp-6) clamp(2rem, 5vw, 4.5rem); align-items: center; }
}
/* link chart (original artwork in the conventions of link-analysis tools): light gridded canvas, entity tiles + pictograms, labels beneath, thin links with arrowheads, selection halo for what the active stage adds */
.dpt__viz path { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.dpt__viz { font-family: var(--font-sans); }
.cr { stroke: #cfcabb; stroke-width: 1; }
.wt { font-size: 11px; font-weight: 600; fill: #3b4147; text-anchor: middle; }
.tool path, .tool circle { stroke: #5a6169; stroke-width: 1.3; fill: none; }
.ic { fill: none; stroke: #2c3a46; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.tb { fill: #fff; stroke: #7f8a96; stroke-width: 1.2; }
.tn-org .tb { fill: #e3ecf6; } .tn-per .tb { fill: #e5efe3; } .tn-doc .tb { fill: #f4efdd; } .tn-med .tb { fill: #efe7f1; } .tn-src .tb { fill: #fbe9d0; } .tn-pre .tb { fill: #dfe9ee; }
.tn-ind .tb, .tn-unk .tb { stroke-dasharray: 3 2.5; } .tn-unk .tb { stroke: #8a6d1f; fill: #fff; } .tn-unk .ic { stroke: #8a6d1f; }
.tl { font-size: 11px; font-weight: 600; fill: #27323a; text-anchor: middle; } .co .tl { text-anchor: start; }
.sel { fill: rgba(255, 214, 10, 0.4); stroke: #d9a900; stroke-width: 1; opacity: 0; } .lg-s { opacity: 1; }
.lk { stroke: #5f6b78; stroke-width: 1.3; stroke-dasharray: 1; stroke-dashoffset: 0; }
.lk.lg { stroke-dasharray: none; }
.dl { stroke: #5f6b78; stroke-width: 1.3; stroke-dasharray: 5 4; }
.dl.wm { stroke: #b4432f; stroke-width: 1.7; }
.llb { fill: #faf9f5; stroke: #d8d4c6; stroke-width: 0.6; } .lt { font-size: 9.5px; fill: #4a4f55; text-anchor: middle; }
.lg-t { font-size: 10px; fill: #4a4f55; }
.cf rect { fill: #e3d7bf; stroke: #8f7233; stroke-width: 0.6; transform-box: fill-box; } .cf rect.on { fill: #8f7233; }
.ok { fill: #2f7a4d; stroke: #fff; stroke-width: 1; } .okc { stroke: #fff; stroke-width: 1.5; fill: none; }
.wf { fill: #fff; stroke: #b4432f; stroke-width: 1.5; } .wfc { stroke: #b4432f; stroke-width: 1.6; }
.wr { fill: none; stroke: #b4432f; stroke-width: 1.4; stroke-dasharray: 3 3; }
.dg { transform-box: fill-box; transform-origin: center; transition: opacity 600ms var(--ease-out), transform 600ms var(--ease-out); }
.dg .lk { transition: stroke-dashoffset 700ms var(--ease-out); }
.dpt.is-ready .dg { opacity: 0; transform: scale(0.96); }
.dpt.is-ready .dg.is-on { opacity: 1; transform: none; }
.dpt.is-ready .dg:not(.is-on) .lk { stroke-dashoffset: 1; }
.dpt.is-ready .dg.is-on .lk { transition-delay: calc(var(--k, 0) * 70ms); }
.dg.is-cur .sel { opacity: 0.55; animation: dpt-sel 1.5s var(--ease-out) backwards; }
@keyframes dpt-sel { 0% { opacity: 0; } 28% { opacity: 1; } 100% { opacity: 0.55; } }
html.motion-paused .dpt .sel { animation: none !important; }
@media (max-width: 559.98px) { .tl { font-size: 13px; } .ll { display: none; } }

/* stages stacked in one cell */
html.js .dpt__list { display: grid; }
html.js .dpt__i { grid-area: 1 / 1; margin: 0; visibility: hidden; opacity: 0; transition: opacity 300ms var(--ease-out), visibility 0s linear 300ms; }
html.js .dpt__i:first-child, html.js .dpt__i.is-active { visibility: visible; opacity: 1; transition-delay: 0s; }
html.js .dpt.is-ready .dpt__i:first-child:not(.is-active) { visibility: hidden; opacity: 0; transition-delay: 0s, 300ms; }
html.js .dpt__ctl { display: block; height: 2.75rem; margin-top: var(--sp-5); }
.dpt__ctl { position: relative; }
.dpt__row { display: flex; align-items: center; gap: var(--sp-2); }
.dpt__track { position: relative; flex: 1 1 auto; height: 2.75rem; cursor: pointer; touch-action: none; outline: none; -webkit-tap-highlight-color: transparent; }
.dpt__rail { position: absolute; left: 14px; right: 14px; top: 50%; height: 8px; margin-top: -4px; border-radius: 4px; background: var(--leather); box-shadow: 0 0 0 1px rgba(196, 164, 104, 0.45), inset 0 1px 3px rgba(0, 0, 0, 0.7); }
.dpt__fill { position: absolute; left: 14px; top: 50%; height: 4px; margin-top: -2px; border-radius: 2px; width: calc((100% - 28px) * var(--p, 0)); background: var(--foil); transition: width 500ms var(--ease-out); }
.dpt__stop { position: absolute; top: 50%; left: calc(14px + (100% - 28px) * var(--s)); width: 6px; height: 6px; margin: -3px 0 0 -3px; border-radius: 50%; background: rgba(196, 164, 104, 0.55); }
.dpt__thumb {
  position: absolute; top: 50%; left: calc(14px + (100% - 28px) * var(--p, 0)); width: 28px; height: 28px; margin: -14px 0 0 -14px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #f0dba2, #c4a468 55%, #8f7233); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5), inset 0 0 0 2px rgba(9, 36, 50, 0.35);
  transition: left 500ms var(--ease-out);
}
.dpt__track:focus-visible .dpt__thumb { outline: 3px solid var(--focus); outline-offset: 3px; }
.dpt__labels { position: relative; height: 1.6rem; margin-top: var(--sp-1); }
.dpt__lb { position: absolute; top: 0; left: calc(14px + (100% - 28px) * var(--s)); transform: translateX(-50%); padding: 0; white-space: nowrap; text-align: center; font: 500 0.8125rem / 1.25 var(--font-sans); color: var(--ink-soft); cursor: pointer; transition: color var(--dur-fast) var(--ease-out); }
.dpt__lb:first-child { left: 0; transform: none; text-align: left; }
.dpt__lb:last-child { left: auto; right: 0; transform: none; text-align: right; }
.dpt__lb.is-on { color: var(--ink); font-weight: 700; }
@media (min-width: 900px) and (max-width: 1119.98px) { .dpt__lb { font-size: 0.6875rem; } }
.dpt__nav { display: none; flex: none; width: 2.75rem; height: 2.75rem; padding: 0; border: 1px solid rgba(196, 164, 104, 0.5); border-radius: 3px; background: var(--leather); cursor: pointer; position: relative; }
.dpt__nav::before { content: ""; position: absolute; left: 50%; top: 50%; width: 0.6rem; height: 0.6rem; border: solid var(--brass-hi); border-width: 0 2px 2px 0; transform: translate(-65%, -50%) rotate(135deg); }
.dpt__nav--n::before { transform: translate(-35%, -50%) rotate(-45deg); }
.dpt__nav:disabled { opacity: 0.4; cursor: default; }
html.js .dpt__ctl:has(.dpt__labels) { height: calc(2.75rem + var(--sp-1) + 1.6rem); }
@media (max-width: 699.98px) {
  .dpt__nav { display: block; }
  .dpt__labels { display: none; }
  html.js .dpt__ctl, html.js .dpt__ctl:has(.dpt__labels) { height: 2.75rem; }
}
html.motion-paused .dpt *, html.motion-paused .dpt__i { transition: none !important; }


/* 7. Case board (corporate page hook): leather board, ivory evidence cards of three kinds (marker shape + border style, not colour alone), brass connectors to the hypothesis.
   Cards are decorative (aria-hidden); .cb__live carries the meaning. Filter buttons exist only with JS (archive.js sets data-f on .cb); without JS or with reduced motion all kinds stay visible. */
.sv-cb { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.cb { display: grid; gap: var(--sp-5); }
.cb .sv-head { margin-bottom: 0; }
.cb__live { margin: 0; max-width: 46rem; color: var(--ink-soft); }
.cb__ctl { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.cb__ctl[hidden] { display: none; }
.cb__f { display: inline-flex; align-items: center; gap: 0.55rem; min-height: 2.75rem; padding: 0.4rem 1rem; border: 1px solid var(--petrol-800); border-radius: 99px; background: transparent; color: var(--petrol-800); font: 600 var(--fs-300) / 1.2 var(--font-sans); cursor: pointer; transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.cb__f:hover { background: rgba(9, 36, 50, 0.08); }
.cb__f:focus-visible { outline: 3px solid var(--petrol-600); outline-offset: 3px; }
.cb__f[aria-pressed="true"] { background: var(--petrol-800); color: var(--white); }
.mk { display: inline-block; flex: none; width: 0.7rem; height: 0.7rem; border: 2px solid currentColor; }
.mk--fact { background: currentColor; border-radius: 1px; }
.mk--account { border-radius: 50%; }
.mk--inference { transform: rotate(45deg) scale(0.9); border-radius: 1px; border-style: dashed; }
.cb__board { padding: clamp(0.9rem, 0.4rem + 2.4vw, 2rem); border-radius: 4px; border: 1px solid rgba(196, 164, 104, 0.4); background: var(--leather); box-shadow: inset 0 1px 0 rgba(246, 244, 238, 0.14), 0 30px 44px -26px rgba(9, 36, 50, 0.7); }
.cb__grid { position: relative; display: grid; gap: var(--sp-3); grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cb__lines { display: none; }
.cd--h { grid-column: 1 / -1; order: -1; }
.cd { display: grid; }
.cd__in { background: #faf8f1; color: #1c262b; padding: 0.75rem 0.9rem 0.9rem; border: 1.5px solid #1b323d; box-shadow: 0 12px 18px -12px rgba(0, 0, 0, 0.7), inset 0 1px 0 #fff; transition: opacity var(--dur-base) var(--ease-out), filter var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out); }
.cd__k { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 0.35rem; font: 700 0.72rem / 1.3 var(--font-sans); letter-spacing: 0.06em; text-transform: uppercase; color: #5a4511; }
.cd__t { margin: 0; font: 400 0.9rem / 1.4 var(--font-sans); }
.cd--fact .cd__in { border-left-width: 5px; border-radius: 1px; }
.cd--account .cd__in { border-color: #8f7233; border-radius: 14px; }
.cd--inference .cd__in { border-style: dashed; border-color: #6a5420; border-radius: 1px; background: repeating-linear-gradient(135deg, #faf8f1 0 7px, #f1ecdc 7px 8px); }
.cd--h .cd__in { background: linear-gradient(180deg, #f3dd9e, #c4a468); border: 2px solid #8f7233; border-radius: 3px; text-align: center; color: #13232b; }
.cd--h .cd__k { justify-content: center; color: #4a3a12; }
.cd--h .cd__t { font: 600 1.05rem / 1.3 var(--font-serif); }
.cd--fact .mk, .cd--account .mk, .cd--inference .mk { color: #5a4511; }
.cb__rule { margin: 0; max-width: 46rem; font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
@media (min-width: 700px) {
  .cb__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: clamp(1.25rem, 3vw, 2.5rem) clamp(1rem, 3vw, 2.5rem); }
  .cd { grid-column: var(--c); grid-row: var(--r); }
  .cd--h { grid-column: 2; grid-row: 2; order: 0; }
  .cb__lines { display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
  .cb__lines + .cd { z-index: 0; } .cd { position: relative; z-index: 1; }
}
.ln { fill: none; stroke: var(--brass); stroke-width: 1.2; vector-effect: non-scaling-stroke; opacity: 0.8; transition: opacity var(--dur-base) var(--ease-out); }
.ln[data-k="inference"] { stroke-dasharray: 5 4; }
.cb[data-f] .cd:not(.cd--h) .cd__in { opacity: 0.7; filter: grayscale(0.7); }
.cb[data-f="fact"] .cd--fact .cd__in, .cb[data-f="account"] .cd--account .cd__in, .cb[data-f="inference"] .cd--inference .cd__in { opacity: 1; filter: none; box-shadow: 0 0 0 3px var(--brass), 0 14px 22px -10px rgba(0, 0, 0, 0.8); }
.cb[data-f] .ln { opacity: 0.18; }
.cb[data-f="fact"] .ln[data-k="fact"], .cb[data-f="account"] .ln[data-k="account"], .cb[data-f="inference"] .ln[data-k="inference"] { opacity: 1; stroke-width: 2; }
html.motion .cb__grid:not(.is-in) .ln { stroke-dasharray: 1; stroke-dashoffset: 1; }
html.motion .cb__grid.is-in .ln { stroke-dashoffset: 0; transition: stroke-dashoffset 700ms var(--ease-out) 500ms, opacity var(--dur-base) var(--ease-out); }
html.motion .cb__grid.is-in .ln[data-k="inference"] { stroke-dasharray: 5 4; }
html.motion-paused .cb *, html.motion-paused .cb__f { transition: none !important; }

/* 8. Chronology strip (corporate page): a rail with one node per workstream, horizontal from 1000px, vertical below. */
.sv-chx { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.chx { list-style: none; margin: 0 0 var(--sp-6); padding: 0; display: grid; gap: var(--sp-5); counter-reset: ch; }
.chx__i { position: relative; padding: 0 0 0 var(--sp-6); border-left: 2px solid var(--line); }
.chx__i::before { content: ""; position: absolute; left: -7px; top: 0.35rem; width: 12px; height: 12px; border-radius: 50%; background: var(--brass); box-shadow: 0 0 0 4px var(--paper); }
.chx__t { margin: 0 0 var(--sp-1); font: 500 var(--fs-500) / 1.3 var(--font-serif); color: var(--ink); }
.chx__d { margin: 0; color: var(--ink-soft); font-size: var(--fs-400); }
.chx__mx { display: grid; grid-template-columns: repeat(3, 0.9rem); gap: 3px; margin-top: var(--sp-3); }
.chx__mx i { display: block; height: 0.9rem; border: 1px solid #8f7233; background: transparent; }
.chx__mx i:nth-child(1), .chx__mx i:nth-child(5), .chx__mx i:nth-child(9), .chx__mx i:nth-child(6) { background: rgba(196, 164, 104, 0.6); }
.chx__foot { margin: 0; max-width: 46rem; padding-left: var(--sp-4); border-left: 3px solid var(--brass); font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
@media (min-width: 1000px) {
  .chx { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--sp-5); padding-top: var(--sp-5); }
  .chx__i { padding: var(--sp-4) 0 0; border-left: 0; border-top: 2px solid var(--line); }
  .chx__i::before { left: 0; top: -7px; }
}

/* 9. Compact report folder (corporate page): the same open-folder sheet in a lighter form. */
.sv-rf--c { --kraft: #d3c096; --kraft-d: #c1ac7e; }
.sv-rf--c .rf__flap { padding-block: clamp(2rem, 1rem + 3vw, 3.5rem); }
.sv-rf--c .rf__stage { width: min(100%, 21rem); }
.sv-rf--c .rf__sheet { aspect-ratio: 5 / 6.4; }
@media (min-width: 900px) { .sv-rf--c .rf__stage { width: min(100%, 22rem); } }


/* 10. Evidence ladder (asset page hook): four rungs on a leather panel, strongest at the top. Lead selector (JS) sets which rungs are reached; every rung keeps its text.
   Confidence = marker shape + label (hollow, half, filled, square with tick). Static (all reached, all text) without JS. */
.sv-lad { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.lad { display: grid; gap: var(--sp-6); }
.lad .sv-head { margin-bottom: var(--sp-5); }
.lad__ctl { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-bottom: var(--sp-4); }
.lad__ctl[hidden] { display: none; }
.lad__lead { min-height: 2.75rem; padding: 0.4rem 1rem; border: 1px solid var(--petrol-800); border-radius: 99px; background: transparent; color: var(--petrol-800); font: 600 var(--fs-300) / 1.2 var(--font-sans); cursor: pointer; transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); }
.lad__lead:hover { background: rgba(9, 36, 50, 0.08); }
.lad__lead:focus-visible, .rg__h:focus-visible { outline: 3px solid var(--petrol-600); outline-offset: 3px; }
.lad__lead[aria-pressed="true"] { background: var(--petrol-800); color: var(--white); }
.lad__rule { margin: 0; max-width: 34rem; padding-left: var(--sp-4); border-left: 3px solid var(--brass); font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
.lad__rungs { position: relative; display: flex; flex-direction: column-reverse; gap: var(--sp-3); margin: 0; padding: clamp(1rem, 0.5rem + 2.5vw, 2rem) clamp(1.5rem, 1rem + 3vw, 2.75rem); list-style: none; border-radius: 4px; border: 1px solid rgba(196, 164, 104, 0.4); background: var(--leather); box-shadow: inset 0 1px 0 rgba(246, 244, 238, 0.14), 0 30px 44px -26px rgba(9, 36, 50, 0.7); }
.lad__rungs::before, .lad__rungs::after { content: ""; position: absolute; top: 1rem; bottom: 1rem; width: 6px; border-radius: 3px; background: var(--foil); opacity: 0.85; }
.lad__rungs::before { left: 0.7rem; } .lad__rungs::after { right: 0.7rem; }
.rg { position: relative; padding: 0.8rem 1rem 0.9rem; border: 1.5px solid #1b323d; border-left-width: 5px; border-radius: 2px; background: #faf8f1; color: #1c262b; box-shadow: 0 12px 18px -12px rgba(0, 0, 0, 0.7), inset 0 1px 0 #fff; transition: box-shadow var(--dur-base) var(--ease-out), background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out); }
.rg__h { display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 0.75rem; width: 100%; min-height: 2.5rem; margin: 0 0 0.35rem; padding: 0; border: 0; background: transparent; color: inherit; text-align: left; font: inherit; cursor: default; }
html.js .rg__h { cursor: pointer; }
.rg__t { font: 500 var(--fs-500) / 1.25 var(--font-serif); }
.rg__c, .rg__st { font: 700 0.72rem / 1.3 var(--font-sans); letter-spacing: 0.06em; text-transform: uppercase; color: #5a4511; }
.rg__st { margin-left: auto; }
.rg__b { margin: 0.2rem 0 0; font: 400 0.9rem / 1.4 var(--font-sans); }
.rg__k { display: block; font: 700 0.7rem / 1.4 var(--font-sans); letter-spacing: 0.06em; text-transform: uppercase; color: #5a4511; }
.rg__b--n { color: #3a4347; }
.cm { position: relative; flex: none; width: 0.9rem; height: 0.9rem; border: 2px solid #5a4511; border-radius: 50%; }
.cm--2 { background: linear-gradient(90deg, #5a4511 50%, transparent 50%); }
.cm--3 { background: #5a4511; }
.cm--4 { border-radius: 1px; background: #5a4511; }
.cm--4::after { content: ""; position: absolute; left: 2px; top: -1px; width: 3px; height: 6px; border: solid #faf8f1; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.rg:not(.is-reached) { background: transparent; border-style: dashed; border-color: rgba(196, 164, 104, 0.6); color: var(--on-dark-soft); box-shadow: none; }
.rg:not(.is-reached) .rg__c, .rg:not(.is-reached) .rg__st, .rg:not(.is-reached) .rg__k, .rg:not(.is-reached) .rg__b--n { color: var(--on-dark-soft); }
.rg:not(.is-reached) .cm { border-color: var(--on-dark-soft); background: transparent; } .rg:not(.is-reached) .cm::after { display: none; }
.rg:not(.is-reached) .rg__st::before { content: "Not "; }
.rg.is-sel.is-reached { box-shadow: 0 0 0 3px var(--brass), 0 14px 22px -10px rgba(0, 0, 0, 0.8); }
.rg.is-sel:not(.is-reached) { border-color: var(--brass); }
@media (min-width: 900px) { .lad { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--sp-6) clamp(2rem, 5vw, 4.5rem); align-items: center; } }
html.motion-paused .rg, html.motion-paused .lad__lead { transition: none !important; }

/* 11. Three moments (asset page): panels on a progress line that draws on entry (shared reveal, reversible), vertical on mobile. */
.sv-mom { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.mom { position: relative; display: grid; gap: var(--sp-5); margin: 0; padding: 0 0 0 var(--sp-5); list-style: none; }
.mom::before, .mom::after { content: ""; position: absolute; left: 0; top: 0.4rem; bottom: 0.4rem; width: 2px; background: var(--line); }
.mom::after { background: var(--foil); transform-origin: top; transform: scaleY(0); transition: transform var(--dur-out) var(--ease-out); }
.mom.is-in::after, html:not(.motion) .mom::after { transform: none; transition: transform 1800ms var(--ease-out) 200ms; }
.mom__i { position: relative; }
.mom__i::before { content: ""; position: absolute; left: calc(-1 * var(--sp-5) - 6px); top: 0.35rem; width: 14px; height: 14px; border-radius: 50%; background: var(--brass); box-shadow: 0 0 0 4px var(--paper); }
.mom__t { margin: 0 0 var(--sp-2); font: 500 var(--fs-600) / 1.25 var(--font-serif); color: var(--ink); }
.mom__d { margin: 0; max-width: 30rem; color: var(--ink-soft); }
@media (min-width: 900px) {
  .mom { grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: var(--sp-6); padding: var(--sp-5) 0 0; }
  .mom::before, .mom::after { left: 0; right: 0; top: 6px; bottom: auto; width: auto; height: 2px; }
  .mom::after { transform-origin: left; transform: scaleX(0); }
  .mom.is-in::after, html:not(.motion) .mom::after { transform: none; }
  .mom__i::before { left: 0; top: calc(-1 * var(--sp-5) - 1px); }
}
html.motion-paused .mom::after { transition: none !important; }

/* 12. What can be traced (asset page): quiet typographic list, hairlines only. */
.sv-trc { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.trc { margin: 0 0 var(--sp-6); }
.trc__r { display: grid; gap: var(--sp-2); padding: var(--sp-5) 0; border-top: 1px solid var(--line); }
.trc__r:last-child { border-bottom: 1px solid var(--line); }
.trc__t { margin: 0; font: 500 var(--fs-700) / 1.15 var(--font-serif); color: var(--ink); text-wrap: balance; }
.trc__d { margin: 0; max-width: 34rem; color: var(--ink-soft); }
.trc__l { display: block; margin-top: var(--sp-1); font: italic 500 var(--fs-400) / 1.45 var(--font-serif); color: var(--brass-ink); }
.trc__foot { margin: 0; max-width: 46rem; font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
@media (min-width: 900px) { .trc__r { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--sp-6); align-items: baseline; } }


/* 13. Analyst's note (reputation page hook): one ivory sheet on the section background, hairlines, brass only for the connectors and the stamp border.
   Desktop: sheet left, four annotations in the right margin joined by brass lines (all positions are percentages of the figure). Mobile: annotations stack under the sheet. */
.sv-an { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.an { display: grid; gap: var(--sp-5); }
.an .sv-head { margin-bottom: 0; }
.an__wrap { max-width: 62rem; }
.an__fig { position: relative; }
.an__sheet { position: relative; aspect-ratio: 5 / 4; background: #fbf9f1; border: 1px solid #d9d4c4; border-radius: 2px; box-shadow: 0 14px 24px -20px rgba(19, 35, 43, 0.35); }
.an__sheet i { position: absolute; display: block; height: 0.5rem; margin-top: -0.25rem; border-radius: 1px; background: #d6d1c3; }
.an__sheet .an__h { top: 8%; left: 8%; width: 34%; height: 0.7rem; background: #9aa3a1; }
.an__sheet .an__s { background: #a9a496; overflow: visible; }
.an__sheet .an__s::after { content: ""; position: absolute; left: 0; right: 0; bottom: -0.35rem; height: 1px; background: var(--brass); }
.an__lines { display: none; }
.an__notes { list-style: none; margin: var(--sp-4) 0 0; padding: 0; display: grid; gap: var(--sp-3); }
.an__n { position: relative; padding-left: var(--sp-5); font: 500 var(--fs-400) / 1.35 var(--font-sans); color: var(--ink); }
.an__n::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 1rem; height: 1px; background: var(--brass); }
.an__stamp { margin: var(--sp-5) 0 0; }
.an__stamp span { display: inline-block; padding: 0.6rem 1.1rem; border: 1px solid var(--brass); border-radius: 0.6rem; font: italic 400 var(--fs-500) / 1.35 var(--font-serif); color: var(--ink); background: rgba(251, 249, 241, 0.6); }
.an__cap { margin: 0; max-width: 46rem; font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
@media (min-width: 900px) {
  .an__fig { aspect-ratio: 100 / 62; }
  .an__sheet { position: absolute; inset: 0 auto 0 0; width: 60%; aspect-ratio: auto; }
  .an__lines { display: block; position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
  .an__notes { position: absolute; inset: 0; margin: 0; display: block; }
  .an__n { position: absolute; left: 68%; right: 0; margin-top: -0.7em; padding-left: 0; }
  .an__n::before { display: none; }
  .an__stamp { width: 60%; margin-top: var(--sp-5); text-align: center; }
}
.an__c { fill: none; stroke: var(--brass); stroke-width: 1.2; vector-effect: non-scaling-stroke; stroke-dasharray: 1000; stroke-dashoffset: 0; }
html.motion .an__wrap:not(.is-in) .an__c { stroke-dashoffset: 1000; }
html.motion .an__wrap:not(.is-in) .an__n, html.motion .an__wrap:not(.is-in) .an__stamp { opacity: 0; transform: translateX(-6px); }
html.motion .an__c { transition: stroke-dashoffset var(--dur-out) var(--ease-out); }
html.motion .an__n, html.motion .an__stamp { transition: opacity var(--dur-out) var(--ease-out), transform var(--dur-out) var(--ease-out); }
html.motion .an__wrap.is-in .an__c { transition: stroke-dashoffset 700ms var(--ease-out) calc(300ms + var(--i, 0) * 260ms); }
html.motion .an__wrap.is-in .an__n { transition: opacity 600ms var(--ease-out) calc(700ms + var(--i, 0) * 260ms), transform 600ms var(--ease-out) calc(700ms + var(--i, 0) * 260ms); }
html.motion .an__wrap.is-in .an__stamp { transition: opacity 800ms var(--ease-out) 2100ms; }
html.motion-paused .an__c, html.motion-paused .an__n, html.motion-paused .an__stamp { transition: none !important; }

/* 14. Records vs market (reputation page): two quiet columns, fine dividers, no cards. */
.sv-tc { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.tc { display: grid; gap: var(--sp-6); margin-bottom: var(--sp-6); }
.tc__h { margin: 0 0 var(--sp-3); padding-top: var(--sp-3); border-top: 2px solid var(--line); font: 500 var(--fs-600) / 1.25 var(--font-serif); color: var(--ink-soft); }
.tc__c--b .tc__h { border-top-color: var(--brass); color: var(--ink); }
.tc__l { list-style: none; margin: 0; padding: 0; }
.tc__l li { padding: var(--sp-3) 0; border-top: 1px solid var(--line); color: var(--ink-soft); }
.tc__c--b .tc__l li { color: var(--ink); }
.tc__foot { margin: 0; max-width: 46rem; font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
@media (min-width: 700px) { .tc { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6) clamp(2rem, 6vw, 5rem); } }

/* 15. Protecting sources: sober dark band, discreet seal, two plain lists. */
.sv-prt { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); background-image: radial-gradient(46rem 28rem at 85% 20%, rgba(27, 81, 108, 0.35), transparent 70%), linear-gradient(180deg, var(--petrol-900), #061c27); }
.prt { display: grid; gap: var(--sp-6); }
.prt__head { display: grid; gap: var(--sp-4); align-items: start; }
.prt__seal { width: 4.5rem; height: 4.5rem; fill: none; stroke: var(--brass); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; opacity: 0.85; }
.prt__seal circle:first-child { stroke-opacity: 0.6; }
.prt__top .hs__title { max-width: 28rem; margin-bottom: var(--sp-3); }
.prt__intro { margin: 0; max-width: 40rem; color: var(--on-dark-soft); font-size: var(--fs-500); }
.prt__cols { display: grid; gap: var(--sp-5); }
.prt__h { margin: 0 0 var(--sp-3); font: 500 var(--fs-500) / 1.3 var(--font-serif); color: var(--on-dark); }
.prt__l { list-style: none; margin: 0; padding: 0; }
.prt__l li { position: relative; padding: var(--sp-3) 0 var(--sp-3) var(--sp-5); border-top: 1px solid var(--line-dark); color: var(--on-dark-soft); }
.prt__l li::before { content: ""; position: absolute; left: 0; top: 1.15rem; width: 0.55rem; height: 0.55rem; border: 2px solid var(--brass); }
.prt__c--in .prt__l li::before { background: var(--brass); }
.prt__c--out .prt__l li::before { border-radius: 50%; }
.prt__text { margin: 0; max-width: 44rem; padding-top: var(--sp-5); border-top: 1px solid var(--line-dark); font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--on-dark); }
@media (min-width: 700px) { .prt__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-6) clamp(2rem, 6vw, 5rem); } .prt__head { grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-6); } }


/* 16. Audience voices (scannable): small label, LARGE upright serif headline, bold outcome in the accent, at most one supporting line. First item = focal point on a dark panel. */
.sv-vc { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.vc { display: grid; max-width: 54rem; }
.vc__r { display: grid; gap: var(--sp-2); padding: var(--sp-5) 0; border-top: 1px solid var(--line); }
.vc__r:last-child { border-bottom: 1px solid var(--line); }
.vc__a { margin: 0; font: 700 0.8125rem / 1.3 var(--font-sans); letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-soft); }
.vc__h { margin: 0; font: 500 clamp(1.5rem, 1.15rem + 1.2vw, 2.1rem) / 1.15 var(--font-serif); color: #0b161c; text-wrap: balance; }
.vc__o { margin: 0; font: 700 var(--fs-500) / 1.3 var(--font-sans); color: var(--brass-ink); }
.vc__l { margin: 0; color: var(--ink-soft); font-size: var(--fs-400); }
.vc__r--lead { margin-bottom: var(--sp-4); padding: clamp(1.5rem, 1rem + 2.5vw, 2.75rem); border: 0; border-radius: 3px; background: linear-gradient(180deg, var(--petrol-800), var(--petrol-900)); color: var(--on-dark); box-shadow: 0 26px 40px -28px rgba(9, 36, 50, 0.8); }
.vc__r--lead .vc__a { color: var(--on-dark-soft); }
.vc__r--lead .vc__h { color: var(--on-dark); font-size: clamp(1.9rem, 1.3rem + 2.3vw, 3rem); line-height: 1.1; }
.vc__r--lead .vc__o { color: #e6cd8e; font-size: var(--fs-600); }
.vc__r--lead .vc__l { color: var(--on-dark-soft); }

/* 17. Bridge (country page): outputs as a quiet list beside a static scenario fan (three paths with end shapes, indicator ticks). */
.sv-br { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.br { display: grid; gap: var(--sp-6); }
.br__l { list-style: none; margin: 0; padding: 0; }
.br__l li { padding: var(--sp-3) 0; border-top: 1px solid var(--line); font: 500 var(--fs-500) / 1.35 var(--font-serif); color: var(--ink); }
.br__l li:last-child { border-bottom: 1px solid var(--line); }
.br__fig { margin: 0; align-self: center; }
.br__svg { display: block; width: 100%; height: auto; }
.br__note { margin: var(--sp-3) 0 0; font: italic 400 var(--fs-400) / 1.45 var(--font-serif); color: var(--ink-soft); }
.fn-ax { fill: none; stroke: #b7b2a2; stroke-width: 1; }
.fn-p { fill: none; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.fn-p--b { stroke: #13232b; stroke-width: 2.2; } .fn-p--f { stroke: #1b516c; stroke-width: 1.6; } .fn-p--a { stroke: #76591f; stroke-width: 1.6; }
.fn-t { stroke: #46545c; stroke-width: 1; } .fn-d { fill: #13232b; }
.fn-m { fill: #13232b; } .fn-p--f ~ .fn-e .fn-m { fill: #13232b; }
.fn-l { font: 600 11px var(--font-sans); fill: #46545c; }
html.motion .br__fig:not(.is-in) .fn-p { stroke-dashoffset: 1; }
html.motion .br__fig:not(.is-in) .fn-i, html.motion .br__fig:not(.is-in) .fn-e { opacity: 0; }
html.motion .fn-p { transition: stroke-dashoffset var(--dur-out) var(--ease-out); }
html.motion .fn-i, html.motion .fn-e { transition: opacity var(--dur-out) var(--ease-out); }
html.motion .br__fig.is-in .fn-p { transition: stroke-dashoffset 1400ms var(--ease-out) calc(200ms + var(--k, 0) * 350ms); }
html.motion .br__fig.is-in .fn-i { transition: opacity 600ms var(--ease-out) 900ms; }
html.motion .br__fig.is-in .fn-e { transition: opacity 600ms var(--ease-out) 1600ms; }
html.motion-paused .fn-p, html.motion-paused .fn-i, html.motion-paused .fn-e { transition: none !important; }
@media (min-width: 900px) { .br { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--sp-6) clamp(2rem, 5vw, 4.5rem); align-items: center; } }

/* 18. Guided scroll walk (brand page hook): one pinned stage, the supply-route diagram on one side and ONE sentence at a time on the other, driven by four sentinels
   (archive.js, one IntersectionObserver; native scrolling only). Static default (no JS, reduced motion, paused, viewport shorter than 30rem): plain list beside the lit diagram.
   Staged (html.motion, not paused, height >= 30rem): .wk is a tall track, .wk__pin sticks inside it; sentences stack in one grid cell and cross-fade (never visibility-hidden). */
.sv-wk { padding-block: clamp(3rem, 2rem + 4vw, 5.5rem) 0; }
.wk__title { margin: 0 0 var(--sp-4); font: 700 var(--fs-300) / 1.4 var(--font-sans); letter-spacing: 0.08em; text-transform: uppercase; color: var(--brass-ink); }
.wk__stage { display: grid; gap: var(--sp-5); }
.wk__viz { align-self: center; }
.wk__svg { display: block; width: 100%; height: auto; }
.wk__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-5); }
.wk__s { padding-left: var(--sp-4); border-left: 2px solid var(--brass); }
.wk__q { margin: 0; font: 500 clamp(1.35rem, 1.1rem + 1.2vw, 2.25rem) / 1.2 var(--font-serif); color: var(--ink); text-wrap: balance; }
.wk__f { margin: var(--sp-2) 0 0; max-width: 32rem; color: var(--ink-soft); font-size: var(--fs-400); }
.wk__rail, .wk__zones { display: none; }
.wk__after { padding-block: var(--sp-6) clamp(2.5rem, 1.5rem + 3vw, 4.5rem); }
.rt-l { fill: none; stroke: #8f7233; stroke-width: 1.5; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.rt-n circle { fill: #13232b; } .rt-s { fill: none; stroke: #b7b2a2; stroke-width: 1; }
.rt-n text { font: 600 14px var(--font-sans); fill: #13232b; text-anchor: middle; }
@media (min-width: 900px) { .wk__stage { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--sp-6) clamp(2rem, 5vw, 4.5rem); } }
@media (min-height: 30rem) {
  html.motion:not(.motion-paused) .wk { --u: 1vh; --step: calc(38 * var(--u)); --pinh: calc(100 * var(--u) - var(--header-h)); position: relative; height: calc(var(--pinh) + 3.5 * var(--step)); }
  @supports (height: 1svh) { html.motion:not(.motion-paused) .wk { --u: 1svh; } }
  html.motion:not(.motion-paused) .sv-wk { padding-block: 0; }
  html.motion:not(.motion-paused) .wk__pin { position: sticky; top: var(--header-h); height: var(--pinh); display: flex; align-items: center; }
  html.motion:not(.motion-paused) .wk__in { padding-block: 0; }
  html.motion:not(.motion-paused) .wk__stage { gap: var(--sp-4); }
  html.motion:not(.motion-paused) .wk__viz { max-height: 34svh; }
  html.motion:not(.motion-paused) .wk__svg { max-height: 34svh; margin-inline: auto; }
  html.motion:not(.motion-paused) .wk__txt { display: grid; gap: var(--sp-4); align-content: center; }
  html.motion:not(.motion-paused) .wk__list { gap: 0; }
  html.motion:not(.motion-paused) .wk__s { grid-area: 1 / 1; opacity: 1; transform: none; }
  html.motion:not(.motion-paused) .wk.is-ready .wk__s { opacity: 0; transform: translate3d(0, 1rem, 0); pointer-events: none; transition: opacity 700ms var(--ease-inout), transform 700ms var(--ease-inout); }
  html.motion:not(.motion-paused) .wk.is-ready .wk__s.is-active { opacity: 1; transform: none; pointer-events: auto; transition: opacity 600ms var(--ease-out) 150ms, transform 600ms var(--ease-out) 150ms; }
  html.motion:not(.motion-paused) .wk.is-ready .rt-n { opacity: 0.22; transition: opacity 600ms var(--ease-out); }
  html.motion:not(.motion-paused) .wk.is-ready .rt-n.is-lit { opacity: 1; }
  html.motion:not(.motion-paused) .wk.is-ready .rt-l { stroke-dashoffset: 1; transition: stroke-dashoffset 700ms var(--ease-out); }
  html.motion:not(.motion-paused) .wk.is-ready .rt-l.is-lit { stroke-dashoffset: 0; }
  html.motion:not(.motion-paused) .wk__rail { display: flex; justify-content: space-between; position: relative; height: 1.5rem; align-items: center; max-width: 18rem; }
  html.motion:not(.motion-paused) .wk__rail::before, html.motion:not(.motion-paused) .wk__rail::after { content: ""; position: absolute; left: 0; top: 50%; height: 1px; width: 100%; background: var(--line); }
  html.motion:not(.motion-paused) .wk__rail::after { background: var(--accent); transform: scaleX(var(--p, 0)); transform-origin: left center; transition: transform var(--dur-base) var(--ease-inout); }
  html.motion:not(.motion-paused) .wk__rail i { position: relative; z-index: 1; display: block; width: 1px; height: 0.75rem; background: var(--ink-soft); opacity: 0.45; transition: opacity var(--dur-base) var(--ease-out); }
  html.motion:not(.motion-paused) .wk__rail i.is-on { background: var(--accent); opacity: 1; }
  html.motion:not(.motion-paused) .wk__zones { display: flex; flex-direction: column; position: absolute; inset: 0; pointer-events: none; }
  html.motion:not(.motion-paused) .wk__zones i { display: block; flex: 0 0 var(--step); }
  html.motion:not(.motion-paused) .wk__zones i:first-child { flex-basis: calc(var(--step) + 50 * var(--u) - var(--header-h)); }
  html.motion:not(.motion-paused) .wk__zones i:last-child { flex: 1 1 0; }
}


/* 19. Chapters (supporting page): full-width bands alternating dark and paper; a large 16:9 image (about 60%) on one side, one reading thread on the other. Image drifts on scroll
   (view timeline, transform only, where supported). A thin sticky rail (ticks, no digits) shows progress through the bands (archive.js). Mobile: image on top, text below. */
.sv-chs { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem) 0; }
.sv-chs .sv-head { margin-bottom: var(--sp-6); }
.chs { position: relative; }
.chs__rail { display: none; }
.chs.is-ready .chs__rail { display: block; position: sticky; top: var(--header-h); z-index: 6; height: 3px; margin-bottom: -3px; background: rgba(196, 164, 104, 0.25); }
.chs__fill { position: absolute; left: 0; top: 0; bottom: 0; width: calc(var(--p, 0) * 100%); background: var(--foil); transition: width 600ms var(--ease-out); }
.chs__rail i { position: absolute; top: 0; width: 1px; height: 9px; background: rgba(196, 164, 104, 0.8); }
.chs__rail i:nth-of-type(1) { left: 16.66%; } .chs__rail i:nth-of-type(2) { left: 33.33%; } .chs__rail i:nth-of-type(3) { left: 50%; } .chs__rail i:nth-of-type(4) { left: 66.66%; } .chs__rail i:nth-of-type(5) { left: 83.33%; } .chs__rail i:nth-of-type(6) { left: calc(100% - 1px); }
.cx { padding-block: clamp(3rem, 2rem + 4vw, 6rem); }
.cx--d { background: radial-gradient(46rem 26rem at 85% 30%, rgba(27, 81, 108, 0.35), transparent 70%), linear-gradient(180deg, var(--petrol-900), #061c27); color: var(--on-dark); --focus: #e3c27a; }
.cx--l { background: var(--paper); color: var(--ink); }
.cx--l:nth-of-type(odd) { background: var(--paper-alt); }
.cx__in { display: grid; gap: var(--sp-5); width: 100%; max-width: calc(var(--wrap) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); align-items: center; }
.cx__img { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: 3px; background: var(--petrol-800); box-shadow: 0 30px 44px -26px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(196, 164, 104, 0.3); }
.cx__img img { position: absolute; left: 0; top: -6%; width: 100%; height: 112%; object-fit: cover; }
.cx__tx { display: grid; gap: var(--sp-3); align-content: center; }
.cx__ic { fill: none; stroke: currentColor; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.cx--d .cx__ic { color: var(--brass); } .cx--l .cx__ic { color: var(--brass-ink); }
.cx__t { margin: 0; font: 500 var(--fs-700) / 1.15 var(--font-serif); text-wrap: balance; }
.cx__q { margin: 0; font: italic 400 var(--fs-500) / 1.45 var(--font-serif); }
.cx--d .cx__q { color: var(--on-dark-soft); } .cx--l .cx__q { color: var(--ink-soft); }
.cx__c { margin: 0; max-width: 32rem; }
.cx__r { margin: var(--sp-2) 0 0; padding-left: var(--sp-4); border-left: 3px solid var(--brass); font: 600 var(--fs-500) / 1.35 var(--font-serif); }
.cx--d .cx__r { color: var(--brass-hi, #e6cd8e); } .cx--l .cx__r { color: var(--ink); }
.cx--d a { color: var(--on-dark); }
.chs__foot { margin: clamp(2.5rem, 1.5rem + 3vw, 4.5rem) 0; max-width: 46rem; font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
@media (min-width: 900px) {
  .cx__in { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: var(--sp-6) clamp(2rem, 5vw, 4.5rem); }
  .cx--r .cx__img { order: 2; }
  .cx--r .cx__in { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
}
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    html:not(.motion-paused) .cx__img img { animation: ch-drift linear both; animation-timeline: view(); }
    @keyframes ch-drift { from { transform: translateY(5%); } to { transform: translateY(-5%); } }
  }
}
html.motion-paused .chs__fill { transition: none !important; }


/* 20. Mid-page CTA row, certainty strip, benefit statements, sticky conversion bar */
.mcta { padding-block: clamp(2rem, 1.2rem + 3vw, 3.5rem); border-block: 1px solid var(--line); background: var(--paper); }
.mcta__in { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-4) var(--sp-6); }
.mcta__t { margin: 0; max-width: 40rem; font: 500 var(--fs-600) / 1.3 var(--font-serif); color: var(--ink); text-wrap: balance; }
.cst { background: var(--petrol-900); border-top: 1px solid rgba(196, 164, 104, 0.35); }
.cst__l { list-style: none; margin: 0; padding: var(--sp-4) 0; display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-6); color: var(--on-dark); font: 500 var(--fs-400) / 1.4 var(--font-sans); }
.cst__l li { position: relative; padding-left: var(--sp-4); }
.cst__l li::before { content: ""; position: absolute; left: 0; top: 0.6em; width: 0.5rem; height: 0.5rem; background: var(--brass); transform: rotate(45deg); }
.sv-stm { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.stm { list-style: none; margin: 0 0 var(--sp-6); padding: 0; max-width: 54rem; }
.stm li { padding: var(--sp-4) 0; border-top: 1px solid var(--line); font: 600 clamp(1.5rem, 1.1rem + 1.6vw, 2.4rem) / 1.2 var(--font-serif); color: #0b161c; text-wrap: balance; }
.stm li:last-child { border-bottom: 1px solid var(--line); }
.stm__foot { margin: 0; max-width: 46rem; font: 500 var(--fs-500) / 1.5 var(--font-serif); color: var(--ink); }
.sbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; display: flex; align-items: center; justify-content: center; gap: var(--sp-4); padding: 0.55rem var(--gutter) calc(0.55rem + env(safe-area-inset-bottom, 0px)); background: var(--petrol-900); color: var(--on-dark); border-top: 1px solid rgba(196, 164, 104, 0.45); box-shadow: 0 -10px 24px -16px rgba(0, 0, 0, 0.6); }
.sbar[hidden], html.cc-open .sbar { display: none; }
.sbar:not(.is-on) { visibility: hidden; opacity: 0; transform: translateY(100%); pointer-events: none; }
html.motion:not(.motion-paused) .sbar { transition: transform 500ms var(--ease-out), opacity 500ms var(--ease-out), visibility 0s linear 500ms; }
html.motion:not(.motion-paused) .sbar.is-on { transition-delay: 0s; }
.sbar__t { margin: 0; font: 500 var(--fs-400) / 1.3 var(--font-sans); }
.sbar .btn { min-height: 2.5rem; }
.sbar__x { flex: none; width: 2.75rem; height: 2.75rem; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--on-dark); cursor: pointer; display: grid; place-items: center; }
.sbar__x svg { fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.sbar__x:hover { background: rgba(246, 244, 238, 0.12); }
.sbar a:focus-visible, .sbar__x:focus-visible { outline: 3px solid #e3c27a; outline-offset: 2px; }
@media (max-width: 559.98px) { .sbar__t { display: none; } .sbar { justify-content: space-between; } }


/* 21. Country page: statement chapters, watchlist map, decision-briefing sample */
.chs--st .cx__t { font-size: clamp(1.7rem, 1.2rem + 1.5vw, 2.2rem); line-height: 1.12; }
@media (min-width: 900px) { .chs--st .cx__in { grid-template-columns: minmax(0, 11fr) minmax(0, 9fr); } .chs--st .cx--r .cx__in { grid-template-columns: minmax(0, 9fr) minmax(0, 11fr); } }
.chs--st .cx__c { font-size: var(--fs-500); }
.sv-wl { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); background-image: radial-gradient(46rem 28rem at 70% 40%, rgba(27, 81, 108, 0.35), transparent 70%), linear-gradient(180deg, var(--petrol-900), #061c27); }
.wl { display: grid; gap: var(--sp-6); }
.wl__head .hs__title { max-width: 26rem; margin-bottom: var(--sp-3); }
.wl__intro { margin: 0; max-width: 34rem; color: var(--on-dark-soft); font-size: var(--fs-500); }
.wl__fig { margin: 0; justify-self: center; width: min(100%, 30rem); }
.wl__svg { display: block; width: 100%; height: auto; overflow: visible; }
.wl-d { fill: none; stroke: url(#wl-face); stroke-width: 3.9; stroke-linecap: round; }
.wl-d--e { stroke: #06202d; }
.wl-n { fill: #e3c27a; stroke: #8f7233; stroke-width: 1.2; }
.wl-k { fill: none; stroke: #c4a468; stroke-width: 1.3; stroke-dasharray: 1; stroke-dashoffset: 0; }
.wl-b { fill: rgba(6, 28, 39, 0.92); stroke: rgba(196, 164, 104, 0.6); stroke-width: 1; }
.wl-t { font: 600 23px var(--font-sans); fill: #f6f4ee; }
.wl__note { margin: var(--sp-4) 0 0; font: italic 400 var(--fs-500) / 1.45 var(--font-serif); color: var(--on-dark); text-align: center; }
html.motion .wl__fig:not(.is-in) .wl-k { stroke-dashoffset: 1; }
html.motion .wl__fig:not(.is-in) .wl-n, html.motion .wl__fig:not(.is-in) .wl-b, html.motion .wl__fig:not(.is-in) .wl-t { opacity: 0; }
html.motion .wl-k { transition: stroke-dashoffset var(--dur-out) var(--ease-out); }
html.motion .wl-n, html.motion .wl-b, html.motion .wl-t { transition: opacity var(--dur-out) var(--ease-out); }
html.motion .wl__fig.is-in .wl-k { transition: stroke-dashoffset 700ms var(--ease-out) calc(400ms + var(--k, 0) * 300ms); }
html.motion .wl__fig.is-in .wl-n, html.motion .wl__fig.is-in .wl-b, html.motion .wl__fig.is-in .wl-t { transition: opacity 600ms var(--ease-out) calc(300ms + var(--k, 0) * 300ms); }
html.motion-paused .wl-k, html.motion-paused .wl-n, html.motion-paused .wl-b, html.motion-paused .wl-t { transition: none !important; }
.wl-p { --k: 0; }
@media (min-width: 900px) { .wl { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); align-items: center; gap: var(--sp-6) clamp(2rem, 5vw, 4.5rem); } .wl__fig { justify-self: end; } }
.sv-bf { padding-block: clamp(3.5rem, 2rem + 5vw, 6.5rem); }
.bf { display: grid; gap: var(--sp-5); justify-items: start; }
.bf .sv-head { margin-bottom: 0; }
.bf__sheet { width: min(100%, 40rem); padding: clamp(1.5rem, 1rem + 2.5vw, 2.75rem); background: #fbf9f1; border: 1px solid #d9d4c4; border-left: 4px solid var(--brass); border-radius: 2px; box-shadow: 0 22px 34px -26px rgba(19, 35, 43, 0.5); }
.bf__l { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--sp-5); }
.bf__h { margin: 0 0 var(--sp-3); font: 500 clamp(1.5rem, 1.15rem + 1.3vw, 2.2rem) / 1.15 var(--font-serif); color: #0b161c; text-wrap: balance; }
.bf__l i { display: block; height: 0.5rem; margin-top: 0.4rem; border-radius: 1px; background: #d6d1c3; } .bf__l i:last-child { width: 62%; }
.bf__cap { margin: 0; font: italic 400 var(--fs-400) / 1.45 var(--font-serif); color: var(--ink-soft); }

/* prose: plain editorial block (H2 + paragraphs + bullet list) */
.sv-pr { padding-block: clamp(2.5rem, 1.5rem + 4vw, 5rem); }
.sv-pr .pr { max-width: 40rem; color: var(--ink-soft); }
.sv-pr .pr > * + * { margin-top: var(--sp-4); }
.sv-pr .pr p, .sv-pr .pr ul { margin-block: 0; }
.sv-pr .pr ul { padding-left: 1.25rem; }
.sv-pr .pr li + li { margin-top: var(--sp-2); }
.sv-pr .pr strong { color: var(--ink); }

/* Prose blocks: comparison table (additive). */
.sv-pr .pr:has(.pr__tw) { max-width: 52rem; }
.pr__tw { overflow-x: auto; }
.pr__tb { width: 100%; border-collapse: collapse; font-size: var(--fs-400); }
.pr__tb th, .pr__tb td { padding: var(--sp-3) var(--sp-4) var(--sp-3) 0; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); color: var(--ink-soft); }
.pr__tb thead th { font: 600 var(--fs-300) / 1.4 var(--font-sans); color: var(--ink); border-bottom: 2px solid var(--brass); }
.pr__tb tbody th { font-weight: 600; color: var(--ink); width: 22%; }
.pr__tb { min-width: 34rem; }