@font-face{font-family:"Space Grotesk";src:url("../assets/fonts/SpaceGrotesk-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Space Grotesk";src:url("../assets/fonts/SpaceGrotesk-bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap;}
/* ======================================================================
   CTI AI Insights: client release build
   Brand source: Cititec standard template (logo, Space Grotesk)
   Primary publishing identity: Commodities Tech Insider
   Secondary endorsement: Powered by Cititec
   ====================================================================== */

:root{
  /* Cititec brand ink, sampled from the supplied wordmark */
  --brand:#0D2F20;
  --brand-deep:#071B12;
  --brand-mid:#12402C;

  /* pale mint: restrained highlight and interaction colour */
  --mint:#DCEAE0;
  --mint-soft:#EDF4EF;
  --mint-line:#C3D9C9;
  --mint-on-dark:#9DC7AC;

  --ink:#141C17;
  --ink-2:#3A463E;
  --muted:#5A665E;
  --faint:#636D65;

  /* cream is the dominant reading surface */
  --paper:#FAF7F0;
  --paper-2:#F4F0E6;
  --card:#FFFFFF;
  --rule:#E3DDCE;
  --rule-2:#EEE9DC;

  --accent:var(--brand);
  --accent-2:var(--brand-mid);
  --accent-soft:var(--mint-soft);

  --tension:#8A4A1E;
  --tension-soft:#FBF0E6;
  --examine:#265F42;
  --examine-soft:var(--mint-soft);

  --src-private:#0D2F20;
  --src-private-soft:#E4EEE7;
  --src-external:#37506C;
  --src-external-soft:#E9EEF3;
  --src-cititec:#6B5316;
  --src-cititec-soft:#F7F0DE;

  --gap:#8A4A1E;

  /* UNVERIFIED: awaiting the confirmed Cititec brand yellow. Until it is
     supplied this falls back to an existing token, so no invented colour
     ships. Replace this one value to introduce the brand accent. */
  --brand-accent:var(--mint-line);

  --display:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --sans:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  /* Reading face for long-form narrative. A system serif stack: nothing is
     downloaded, nothing is requested from a third party, and it renders on
     corporate machines with no network dependency. Space Grotesk is the sole
     downloaded face, used for both display and interface text. */
  /* PROVISIONAL: reading face set to Space Grotesk pending a decision between
     Georgia (0 KB, on Mac and Windows, oldstyle figures native) and Literata
     (20 KB webfont, identical everywhere). Space Grotesk has no oldstyle
     figures, so the font-variant-numeric rule below is currently inert. */
  --serif:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;

  --wrap:1180px;
  --col:34rem;   /* single reading measure used by every narrative section */

  /* breathing room scale */
  --s-section:4.25rem;
  --s-block:2.4rem;
  --s-card:1.75rem;
  --s-para:1.15em;
  --radius-sm:3px;
  --ctrl-h:2.35rem;

  --shadow:0 1px 2px rgba(10,26,18,.04),0 12px 34px rgba(10,26,18,.07);
  --shadow-lift:0 2px 6px rgba(10,26,18,.06),0 20px 48px rgba(10,26,18,.10);
  --radius:6px;
  --dur:200ms;
}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important;animation-iteration-count:1 !important;transition-duration:0.001ms !important;scroll-behavior:auto !important;}
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:1.02rem;line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:var(--display);line-height:1.14;margin:0;font-weight:700;letter-spacing:-.01em;color:var(--ink)}
p{margin:0 0 var(--s-para)}
a{color:var(--accent);text-underline-offset:.18em;text-decoration-thickness:.06em}
a:hover{color:var(--accent-2)}
button{font-family:var(--sans)}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 2rem}
.col{max-width:var(--col)}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:.75rem 1rem;z-index:200}
.skip:focus{left:.5rem;top:.5rem}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---------- review-build banner ---------- */

/* ---------- masthead ---------- */
.masthead{background:var(--brand);border-bottom:1px solid rgba(255,255,255,.08)}
.masthead .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding-top:1.5rem;padding-bottom:1.5rem;flex-wrap:wrap}
.cti-lockup{display:flex;flex-direction:column;gap:.15rem;text-decoration:none}
.cti-name{font-family:var(--display);font-size:1.18rem;font-weight:700;letter-spacing:.02em;color:#fff;line-height:1.05}
.cti-edition{font-family:var(--sans);font-size:.76rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--mint-on-dark);margin-top:.35rem}
.powered-by{display:flex;align-items:center;gap:.7rem}
.powered-by-label{font-family:var(--sans);font-size:.76rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--mint-on-dark)}
.powered-by img{height:26px;width:auto;display:block;filter:brightness(0) invert(1)}

/* ---------- hero ---------- */
.hero{background:var(--brand);color:#fff;padding:4.4rem 0 3.4rem;position:relative}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(255,255,255,.10)}
.kicker{font-family:var(--sans);font-size:.76rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--mint-on-dark);margin-bottom:2rem}
.hero h1{font-size:clamp(2.35rem,5.2vw,3.85rem);letter-spacing:-.022em;max-width:15ch;color:#fff;line-height:1.07}
.title-note{font-family:var(--sans);font-size:.79rem;color:var(--mint-on-dark);margin-top:1.1rem;font-style:italic;opacity:.85}
.standfirst{font-family:var(--sans);font-size:clamp(1.08rem,1.9vw,1.28rem);line-height:1.6;color:#DCE7DE;max-width:48ch;margin-top:1.7rem;font-weight:400}
.hero-meta{font-family:var(--sans);font-size:.94rem;letter-spacing:0;color:var(--ink-2);
  margin-top:2.9rem;background:var(--paper);border:1px solid var(--rule);
  border-top:3px solid var(--brand-accent);border-radius:var(--radius);padding:1.65rem 1.85rem;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(15.5rem,1fr));gap:1.5rem 2.6rem;
  max-width:62rem;line-height:1.6}
.hero-meta > div{min-width:0}
.hero-meta b{display:block;margin-bottom:.45rem;font-family:var(--sans);font-size:.835rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}

/* ---------- nav ---------- */
.navbar{position:sticky;top:0;z-index:60;background:rgba(250,247,240,.95);backdrop-filter:saturate(160%) blur(12px);border-bottom:1px solid var(--rule)}
/* The navbar spans wider than the reading measure so all seven section
   labels stay visible at desktop widths rather than scrolling out of view. */
.navbar .wrap{display:flex;align-items:center;gap:.85rem;padding:0 2rem;max-width:min(1560px,100%)}
.navlist{display:flex;gap:.1rem;overflow-x:auto;scrollbar-width:none;flex:1;margin:0;padding:0;list-style:none;
  -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 2rem),transparent 100%);
  mask-image:linear-gradient(to right,#000 calc(100% - 2rem),transparent 100%)}
.navlist::-webkit-scrollbar{display:none}
.navlist a{font-family:var(--sans);font-size:.835rem;font-weight:700;letter-spacing:.005em;color:var(--ink-2);text-decoration:none;white-space:nowrap;padding:1.05rem .5rem;display:block;border-bottom:2px solid transparent;transition:color var(--dur)}
.navlist a:hover{color:var(--ink)}
.navlist a.on{color:var(--accent);border-bottom-color:var(--accent)}
.nav-tools{display:flex;gap:.5rem;align-items:center;padding:.5rem 0;flex-shrink:0}
.icon-btn{font-family:var(--sans);font-size:.78rem;font-weight:600;color:var(--ink-2);background:var(--card);border:1px solid var(--rule);border-radius:var(--radius-sm);height:2.05rem;padding:0 .75rem;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:.4rem;transition:border-color var(--dur),color var(--dur)}
.icon-btn:hover{border-color:var(--accent);color:var(--accent)}
.icon-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}

/* ---------- evidence lens filter bar ---------- */
/* The lens now sits inside the snapshot, between the introduction and the
   cards, and pins to the top of the viewport once scrolled past. */
.lens-sentinel{height:0}
.lens-bar{background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);
  margin:0 0 2rem;padding:.95rem 1.15rem}
.lens-inner{display:flex;flex-direction:column;gap:.7rem}
.lens-row{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.lens-bar.pinned{position:fixed;top:var(--lens-top,0);left:0;right:0;z-index:55;margin:0;
  border-radius:0;border-left:0;border-right:0;border-top:0;
  padding:.6rem max(2rem,calc((100vw - var(--wrap)) / 2 + 2rem));
  box-shadow:0 8px 16px -14px rgba(10,26,18,.55)}
.lens-bar.pinned .ev-controls{display:none}
.lens-label{font-family:var(--sans);font-size:.79rem;font-weight:700;letter-spacing:.06em;color:var(--ink-2)}
/* Expand and collapse all, driving both card toggles and inline notes. */
.ev-controls{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;
  padding-top:.7rem;border-top:1px solid var(--rule-2)}
.ev-ctrl{font-family:var(--sans);font-size:.79rem;font-weight:600;color:var(--accent);
  background:none;border:1px solid var(--mint-line);border-radius:var(--radius-sm);
  padding:.35rem .7rem;cursor:pointer;transition:background var(--dur),border-color var(--dur)}
.ev-ctrl:hover{background:var(--mint-soft);border-color:var(--accent)}
.ev-ctrl-note{font-family:var(--sans);font-size:.78rem;color:var(--muted)}
.lens-chip{font-family:var(--sans);font-size:.81rem;font-weight:600;padding:.44rem .9rem;border-radius:20px;border:1px solid var(--rule);background:var(--card);color:var(--ink-2);cursor:pointer;display:inline-flex;align-items:center;gap:.45rem;transition:all var(--dur)}
.lens-chip .dot{width:8px;height:8px;border-radius:50%;display:inline-block}
.lens-chip[data-src="private"] .dot{background:var(--src-private)}
.lens-chip[data-src="external"] .dot{background:var(--src-external)}
.lens-chip[data-src="cititec"] .dot{background:var(--src-cititec)}
.lens-chip.active[data-src="private"]{background:var(--src-private-soft);border-color:var(--src-private);color:var(--src-private)}
.lens-chip.active[data-src="external"]{background:var(--src-external-soft);border-color:var(--src-external);color:var(--src-external)}
.lens-chip.active[data-src="cititec"]{background:var(--src-cititec-soft);border-color:var(--src-cititec);color:var(--src-cititec)}
.lens-reset{font-family:var(--sans);font-size:.78rem;color:var(--muted);background:none;border:none;cursor:pointer;text-decoration:underline;text-underline-offset:.2em}
body.lens-filtering [data-source]{opacity:.22;transition:opacity var(--dur)}
body.lens-filtering [data-source].lens-match{opacity:1}

/* ---------- evidence badges (inline, restrained) ---------- */
.src-badge{display:inline-flex;align-items:center;gap:.34rem;font-family:var(--sans);font-size:.78rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:.2rem .55rem;border-radius:20px;white-space:nowrap;vertical-align:middle}
.src-badge .dot{width:6px;height:6px;border-radius:50%}
.src-badge[data-src="private"]{background:var(--src-private-soft);color:var(--src-private)}
.src-badge[data-src="private"] .dot{background:var(--src-private)}
.src-badge[data-src="external"]{background:var(--src-external-soft);color:var(--src-external)}
.src-badge[data-src="external"] .dot{background:var(--src-external)}
.src-badge[data-src="cititec"]{background:var(--src-cititec-soft);color:var(--src-cititec)}
.src-badge[data-src="cititec"] .dot{background:var(--src-cititec)}
.gap-badge{display:inline-flex;align-items:center;font-family:var(--sans);font-size:.78rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:.2rem .55rem;border-radius:20px;background:#fff;color:var(--gap);border:1px dashed var(--gap)}

/* ---------- snapshot ---------- */
.snapshot{padding:var(--s-section) 0;border-bottom:0;background:var(--paper-2)}
.sec-label{font-family:var(--sans);font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2)}
/* A13 applies to the executive snapshot label specifically, not to every
   small-caps label in the report. */
.sec-label.snap-label{text-transform:none;letter-spacing:.02em;font-size:.85rem}
.snapshot h2{font-size:clamp(1.75rem,3vw,2.2rem);margin:1rem 0 .9rem;letter-spacing:-.015em}
.orientation{font-family:var(--sans);font-size:1.13rem;font-weight:500;line-height:1.62;color:var(--ink);max-width:58ch;margin:0 0 1rem}
.snapshot .lede{color:var(--muted);max-width:56ch;margin-bottom:2rem;font-size:.97rem}
.snap-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(20rem,1fr));gap:1.4rem}
.snap{background:var(--card);padding:var(--s-card) 1.7rem;position:relative;border:1px solid var(--rule);border-radius:var(--radius);box-shadow:var(--shadow);transition:box-shadow var(--dur)}
.snap:hover{box-shadow:var(--shadow-lift)}
.snap-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.65rem}
.snap-num{font-family:var(--display);font-size:.95rem;font-weight:700;letter-spacing:.06em;color:var(--accent)}
.snap-head{font-family:var(--display);font-size:1.17rem;line-height:1.36;font-weight:700;letter-spacing:-.008em;margin:0}
.snap-summary{font-size:1rem;color:var(--ink-2);margin-top:1.1rem;line-height:1.68}
.snap-toggle{font-family:var(--sans);font-size:.8rem;font-weight:700;color:var(--accent);margin-top:1.3rem;display:inline-flex;align-items:center;gap:.45rem;background:var(--mint-soft);border:1px solid var(--mint-line);border-radius:3px;cursor:pointer;padding:.45rem .75rem;transition:background var(--dur)}
.snap-toggle:hover{background:var(--mint)}
.snap-toggle::after{content:"+";font-size:.95rem;line-height:1}
.snap-toggle[aria-expanded="true"]::after{content:"\2013"}
.snap-toggle[aria-expanded="true"]{color:var(--accent)}
.snap-evidence{font-size:.97rem;color:var(--ink-2);margin-top:1.4rem;padding-top:1.4rem;border-top:1px solid var(--rule-2);display:none;line-height:1.68}
.snap-evidence.open{display:block}
.snap-evidence p{margin-bottom:.75em}
.snap-evidence .ev-block{margin-bottom:1.35rem}
.snap-evidence .ev-block:last-child{margin-bottom:0}
.snap-evidence .badges{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.4rem}
.snap-jump{font-family:var(--sans);font-size:.81rem;font-weight:600;text-decoration:none;border-bottom:1px solid var(--accent-soft)}
.feature-head{position:relative}

/* ---------- sections ---------- */
.section{padding:var(--s-section) 0;border-bottom:0}
.surface-cream{background:var(--paper-2)}
.surface-white{background:var(--card)}
.surface-mint{background:var(--mint-soft)}
/* hairline only where two like surfaces meet */
.surface-white + .surface-white,.surface-cream + .surface-cream{border-top:1px solid var(--rule)}
/* keep anchored headings clear of the sticky nav */
section[id]{scroll-margin-top:5rem}
/* 821px to 903px: the evidence-lens chips wrap onto a second row, so the pinned
   navigation and lens together stand about 155px tall and the default 5rem
   anchor offset leaves standard section headings behind them. Measured, not
   assumed: the chips fit on one row again from 904px. */
@media (min-width:821px) and (max-width:903px){
  section[id]{scroll-margin-top:8rem}
}
.section-head{display:grid;grid-template-columns:7.5rem 1fr;gap:1.1rem;align-items:start;margin-bottom:var(--s-block);padding-bottom:1.3rem;border-bottom:1px solid var(--rule)}
.section-num{font-family:var(--sans);font-size:1.25rem;font-weight:700;letter-spacing:.01em;color:var(--ink-2);padding-top:.62rem;border-top:2px solid var(--ink);line-height:1.2}
.section-head h2{font-size:clamp(1.7rem,3vw,2.25rem);letter-spacing:-.02em;max-width:22ch;line-height:1.14}
.section-head .sub{font-family:var(--sans);font-size:1.01rem;font-weight:400;color:var(--ink-2);margin-top:.8rem;max-width:54ch;line-height:1.62}
.section-head h2 + .sub{font-weight:400}
.body{max-width:var(--col)}
.body.wide{max-width:none}
.body h3{font-family:var(--display);font-size:1.2rem;margin:2.6rem 0 .9rem;letter-spacing:-.008em;padding-top:1.4rem;border-top:1px solid var(--rule)}
.body h3:first-child{margin-top:0;padding-top:0;border-top:0}
.lead-para{font-size:1.18rem;line-height:1.58;color:var(--ink);margin-bottom:1.35em}

/* ---------- expandable qualification note ---------- */
.expand-note{margin:1.5rem 0;max-width:var(--col)}
.expand-note summary{cursor:pointer;font-family:var(--sans);font-size:.85rem;font-weight:600;color:var(--accent);list-style:none;display:flex;align-items:flex-start;gap:.5rem;line-height:1.45}
.expand-note summary:hover{text-decoration:underline;text-underline-offset:.2em}
.expand-note summary::before{flex:0 0 auto;line-height:1.25}
.expand-note summary::-webkit-details-marker{display:none}
.expand-note summary::before{content:"+";color:var(--accent);font-size:1rem}
.expand-note[open] summary::before{content:"\2013"}
.expand-note-body{font-size:.97rem;color:var(--ink-2);padding:1rem 0 .4rem 1.5rem;border-left:2px solid var(--mint-line);margin-left:.05rem;margin-top:.7rem;line-height:1.68}

.market-dek{font-family:var(--sans);font-size:.8rem;color:var(--muted);margin:0 0 .9rem}

/* ---------- feature card shell ---------- */
.body .feature,.body .bench,.body .wide-block{width:min(calc(var(--wrap) - 3rem),calc(100vw - 4.5rem));max-width:none}
.feature{margin:var(--s-block) 0;background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);box-shadow:none;overflow:hidden}
.feature-head{padding:1.5rem 1.8rem 1.25rem;border-bottom:1px solid var(--rule);display:flex;justify-content:space-between;align-items:flex-start;gap:1.5rem;background:var(--mint-soft)}
.feature-head .sec-label{color:var(--accent)}
.feature-head h3{font-size:1.22rem;margin:.5rem 0 .45rem;letter-spacing:-.012em;padding-top:0;border-top:0}
.feature-head p{font-family:var(--sans);font-size:.91rem;color:var(--ink-2);margin:0;max-width:56ch;line-height:1.55}
.feature-body{padding:1.7rem 1.8rem 1.9rem}

/* ---------- market activity chart ---------- */
/* The panels sit inside the 34rem reading measure, so two columns left each
   label too narrow and forced it to wrap away from its figure. */
.chart-panels{display:grid;grid-template-columns:1fr;gap:1.2rem}
.chart-panel{background:var(--paper);border:1px solid var(--rule);border-radius:4px;padding:1.7rem 1.8rem}
/* These panel titles are h3 so the section heading order runs h2 then h3.
   .body h3 would otherwise reach them, so every property it sets is
   restated here to keep the rendering byte-identical to the previous h4. */
.chart-panel h3{font-family:var(--display);font-size:.98rem;letter-spacing:-.01em;
  margin:0 0 .35rem;padding-top:0;border-top:0}
.chart-panel .chart-note{font-size:.86rem;color:var(--ink-2);margin-bottom:1.1rem;line-height:1.5}
.bar-row{margin-bottom:.9rem}
.bar-row:last-child{margin-bottom:0}
.bar-label{font-family:var(--sans);font-size:.88rem;color:var(--ink-2);margin-bottom:.4rem;display:flex;
  justify-content:space-between;align-items:baseline;gap:1.5rem;flex-wrap:nowrap;line-height:1.45}
.bar-label span{flex:1 1 auto;min-width:0}
.bar-label b{flex:0 0 auto;color:var(--ink);font-weight:700;text-align:right}
.bar-track{height:10px;background:var(--rule-2);border-radius:20px;overflow:hidden}
.bar-fill{height:100%;background:var(--accent);border-radius:20px;width:0;transition:width 700ms ease}
.chart-panel.impact .bar-fill{background:var(--tension)}
.chart-counterpoint{grid-column:1/-1;background:var(--tension-soft);border:1px solid #E9CDAE;border-radius:4px;padding:1.1rem 1.3rem;font-size:.92rem;color:#5A3612}
.chart-counterpoint b{display:block;font-family:var(--sans);font-size:.76rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:.4rem;color:var(--tension)}

/* ---------- buttons ---------- */
.btn{font-family:var(--sans);font-size:.8rem;font-weight:700;height:var(--ctrl-h);padding:0 1.15rem;border-radius:var(--radius-sm);border:1px solid var(--accent);background:var(--accent);color:#fff;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;transition:background var(--dur)}
.btn:hover{background:var(--accent-2);border-color:var(--accent-2);color:#fff}
.btn.ghost{background:transparent;color:var(--ink-2);border-color:var(--rule)}
.btn.ghost:hover{color:var(--accent);border-color:var(--accent);background:transparent}

/* ---------- ask the briefing ---------- */

/* ---------- in-development list ---------- */

/* ---------- method / source notes ---------- */


/* ---------- footer ---------- */
footer{background:var(--brand-deep);color:#A9C0B0;padding:4.5rem 0 4rem;font-family:var(--sans);font-size:.84rem}

footer h4{font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mint-on-dark);margin-bottom:1.1rem}
footer p{margin-bottom:.65em;line-height:1.6}
footer a{color:#D5DBCF}
footer a:hover{color:#fff}
.foot-brand{font-family:var(--display);font-size:1rem;font-weight:700;letter-spacing:.03em;color:#fff;margin-bottom:1.2rem}
.foot-bottom{margin-top:2.2rem;padding-top:1.3rem;border-top:1px solid #1E2B23;font-size:.79rem;color:#6E7E71;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}

/* ---------- responsive ---------- */
@media (max-width:820px){
  .section-head{grid-template-columns:1fr;gap:.85rem}
  .section-num{border-top:0;padding-top:0}
  .foot-grid{grid-template-columns:1fr;gap:1.6rem}
  .hero{padding:2.6rem 0 2rem}
  .section{padding:2.8rem 0}
  .feature-head,.feature-body{padding-left:1.2rem;padding-right:1.2rem}
  .body .feature,.body .bench,.body .wide-block{width:100%}
  .q{grid-template-columns:1fr;gap:.7rem}
  .masthead .wrap{gap:.6rem}
  /* keep the section list usable: long button labels otherwise squeeze the
     scroller down to a sliver on a phone */
  .navbar .wrap{gap:.5rem}
  .nav-tools{gap:.35rem}
  .icon-btn{font-size:.76rem;padding:0 .55rem}
  .navlist a{padding:1.1rem .55rem}
}
@media (max-width:520px){
  body{font-size:1rem}
  .wrap{padding:0 1.1rem}
  .powered-by-label{font-size:.76rem;letter-spacing:.1em}
}

@media (max-width:1300px){.navlist a{padding-left:.35rem;padding-right:.35rem}}

/* ---------- print ---------- */
@media print{
  :root{--paper:#fff}
  body{background:#fff;font-size:10.5pt;line-height:1.45;color:#000}
  /* chrome that must never print */
  .navbar,.lens-bar,.share-menu,.snap-toggle{display:none !important}
  .masthead{border-bottom:1px solid #ccc}
  a{color:#000;text-decoration:none}
  .hero{padding:1.4rem 0}
  .hero h1{font-size:26pt}
  .section{padding:1.15rem 0;border-bottom:0}
  .section-head{break-after:avoid}
  .body .feature,.body .bench,.body .wide-block{width:100%}
  .feature,.snap,details.auth{break-inside:avoid}
  .snap-evidence{display:block !important}
  footer{background:#fff;color:#333;border-top:1px solid #ccc}
  footer h4,.foot-brand{color:#000}
  footer a{color:#000}
    .expand-note{display:block}
  .expand-note-body{display:block !important}
}


/* ---------- responsive: keep breathing room on mobile ---------- */
@media (max-width:820px){
  :root{--s-section:4rem;--s-block:2.4rem;--s-card:1.6rem}
  .hero{padding:3.5rem 0 3.5rem}
  .hero-meta{margin-top:2.4rem;gap:1rem}
  .snap-grid{gap:1.1rem}
  .snap{padding:1.7rem 1.5rem}
  .feature-head,.feature-body{padding-left:1.5rem;padding-right:1.5rem}
  .author-card{grid-template-columns:1fr;gap:2rem;padding:2.2rem 1.7rem}
  .author-photo,.author-monogram{width:120px;height:120px}
  .author-photo-pending{width:120px}
  .wrap{padding:0 1.4rem}
}
@media (max-width:520px){
  .wrap{padding:0 1.2rem}
  .masthead .wrap{padding-top:1.1rem;padding-bottom:1.1rem}
}

/* ---------- print: author panel renders on white ---------- */
@media print{
      .conv-out{background:#f2f2f2 !important;color:#000 !important}
  .author-section{background:#fff !important}
  .author-card{border:1px solid #999 !important;box-shadow:none !important;break-inside:avoid}
  .author-monogram{background:#f2f2f2 !important;color:#000 !important}
}

/* ======================================================================
   FDE ROLE COMPARATOR
   Same card shell, typography and control language as every other
   feature. Its dark band is a header accent, not a separate design.
   ====================================================================== */

/* ======================================================================
   AUTHOR PANEL: dark closing anchor, centred and composed
   ====================================================================== */
.visually-hidden{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.author-section{background:var(--brand);color:#fff;padding:var(--s-section) 0 calc(var(--s-section) * .9)}
.author-panel{max-width:56rem;margin:0 auto;text-align:center}
.author-eyebrow{font-family:var(--sans);font-size:.75rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--mint-on-dark);margin-bottom:2rem}
.author-inner{display:grid;grid-template-columns:auto 1fr;gap:2.6rem;align-items:start;text-align:left}
.author-figure{margin:0;flex-shrink:0}
.author-photo{width:190px;height:190px;border-radius:50%;object-fit:cover;display:block;
  border:3px solid var(--mint-on-dark);box-shadow:0 0 0 8px rgba(157,199,172,.10)}
.author-name{font-family:var(--display);font-size:1.75rem;font-weight:700;letter-spacing:-.018em;color:#fff;margin-bottom:.4rem}
.author-title{font-family:var(--sans);font-size:.78rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase;color:var(--mint-on-dark);margin-bottom:1.4rem}
.author-bio p{font-size:.97rem;line-height:1.7;color:#C8D6CB;margin-bottom:1em;max-width:58ch}
.author-bio p:last-child{margin-bottom:0}
.author-contact{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.6rem}
.author-link{font-family:var(--sans);font-size:.82rem;font-weight:600;color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.26);border-radius:var(--radius-sm);height:var(--ctrl-h);padding:0 1rem;display:inline-flex;align-items:center;transition:all var(--dur)}
.author-link:hover{background:var(--mint);border-color:var(--mint);color:var(--brand-deep)}
.author-endorse{display:flex;align-items:center;justify-content:center;gap:.9rem;margin-top:2.6rem;padding-top:1.8rem;border-top:1px solid rgba(255,255,255,.14)}
.author-pub{font-family:var(--sans);font-size:.76rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.author-dot{width:4px;height:4px;border-radius:50%;background:var(--mint-on-dark);display:inline-block}
.author-powered{font-family:var(--sans);font-size:.76rem;font-weight:600;letter-spacing:.11em;text-transform:uppercase;color:var(--mint-on-dark)}
.author-logo{height:30px;width:auto;filter:brightness(0) invert(1)}

/* ======================================================================
   SLIM FOOTER
   ====================================================================== */
footer{background:var(--brand-deep);color:#A9C0B0;padding:2.2rem 0 2.4rem;font-family:var(--sans);font-size:.82rem}
.foot-row{display:flex;justify-content:space-between;align-items:center;gap:1.6rem;flex-wrap:wrap;padding-bottom:1.4rem;border-bottom:1px solid rgba(255,255,255,.10)}
.foot-identity{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.foot-brand{font-family:var(--display);font-size:1.02rem;font-weight:700;letter-spacing:.04em;color:#fff}
.foot-powered{display:inline-flex;align-items:center;gap:.5rem}
.foot-powered span{font-size:.76rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--mint-on-dark)}
.foot-powered img{height:24px;width:auto;filter:brightness(0) invert(1)}
.foot-links{display:flex;gap:1.4rem;flex-wrap:wrap}
.foot-links a{color:#CFDDD2;text-decoration:none;font-size:.86rem}
.foot-links a:hover{color:#fff;text-decoration:underline}
.foot-bottom{margin-top:1.2rem;font-size:.79rem;color:#93A79A;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}

/* ---------- responsive ---------- */
@media (max-width:820px){
  :root{--s-section:3rem;--s-block:1.9rem;--s-card:1.4rem}
  .author-inner{grid-template-columns:1fr;gap:1.6rem;text-align:center;justify-items:center}
  .author-photo{width:140px;height:140px}
  .author-bio p{text-align:left}
  .author-contact{justify-content:center}
  .foot-row{flex-direction:column;align-items:flex-start;gap:1rem}
}

/* ---------- print ---------- */
@media print{
  .surface-white,.surface-cream,.surface-mint{background:#fff !important}
  .author-section{background:#fff !important;color:#000 !important}
    .author-name,.author-title,.author-bio p,.author-pub,.author-powered{color:#000 !important}
  .author-logo,.foot-powered img{filter:none !important}
  .author-panel{max-width:none}
  footer{background:#fff !important;color:#333 !important;border-top:1px solid #ccc}
  .foot-brand,.foot-links a{color:#000 !important}
}

/* ======================================================================
   METHOD & SOURCES: compact disclosure
   ====================================================================== */
.method-strip{padding:2.4rem 0}
/* The sticky nav and evidence lens together stand about 7rem tall, so the
   default 5rem anchor offset tucks the top of this box underneath them. */
#method{scroll-margin-top:8.5rem}
/* Same 821-903px case as the standard sections above: the wrapped lens bar
   needs a deeper offset or the top of this box tucks under it. */
@media (min-width:821px) and (max-width:903px){ #method{scroll-margin-top:11rem} }
.method-disclosure{max-width:var(--wrap);border:1px solid var(--rule);border-radius:var(--radius);background:var(--card)}
.method-disclosure summary{cursor:pointer;list-style:none;padding:1rem 1.3rem;display:flex;
  align-items:baseline;gap:.7rem;flex-wrap:wrap;font-family:var(--sans)}
.method-disclosure summary::-webkit-details-marker{display:none}
.method-disclosure summary::before{content:"+";color:var(--accent);font-size:1rem;font-weight:700}
.method-disclosure[open] summary::before{content:"\2013"}
.md-label{font-size:.835rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent)}
.md-sum{font-size:.91rem;color:var(--ink-2);line-height:1.5}
.method-body{padding:0 1.3rem 1.4rem;border-top:1px solid var(--rule-2)}
.md-layers{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.2rem;
  margin:0 0 1.4rem;padding-top:1.4rem;border-top:1px solid var(--rule-2)}
.md-layer p{font-size:.91rem;color:var(--ink-2);line-height:1.58;margin:.5rem 0 0}
.md-note{font-size:.91rem;color:var(--ink-2);line-height:1.62;margin:1.2rem 0 1.4rem}
.md-sources{margin:0;padding-left:1.1rem;columns:2;column-gap:2rem}
.md-sources li{font-size:.86rem;color:var(--ink-2);margin-bottom:.45em;break-inside:avoid}
.md-sources a{color:var(--accent)}
.md-sources .src-note{display:block;margin-top:.3rem;font-size:.82rem;line-height:1.5;color:var(--muted)}
@media (max-width:820px){.md-sources{columns:1}}

/* ---------- print ---------- */
@media print{
  .method-disclosure{border-color:#999 !important}
  .method-body{display:block !important}
}
.foot-sep{color:var(--mint-on-dark);font-size:1rem;line-height:1}

/* ======================================================================
   WHERE FIRMS ARE APPLYING AI: evidence-state list
   ====================================================================== */
.ev-legend{display:flex;flex-wrap:wrap;gap:.7rem;margin-bottom:1.6rem;padding-bottom:1.1rem;border-bottom:1px solid var(--rule)}
/* Restrained badge treatment matching the source labels, so the evidence
   states read as labels rather than stray small caps. */
.ev-key{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--sans);font-size:.8rem;
  font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);white-space:nowrap;
  background:var(--paper-2);border:1px solid var(--rule);border-radius:20px;padding:.2rem .6rem}
.surface-cream .ev-key{background:var(--card)}
.ev-key i{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.ev-production i{background:var(--brand)}
.ev-pilot i{background:var(--mint-line);box-shadow:inset 0 0 0 2px var(--brand)}
.ev-production{color:var(--brand);background:var(--mint-soft);border-color:var(--mint-line)}
.apps{list-style:none;margin:0;padding:0;display:grid;gap:0}
.app{padding:1.35rem 0;border-bottom:1px solid var(--rule)}
.app:last-child{border-bottom:0}
/* A15: the badge belongs beside the title it qualifies, not pinned to the
   far edge of the measure. */
.app-top{display:flex;justify-content:flex-start;align-items:baseline;gap:.85rem;flex-wrap:wrap;margin-bottom:.5rem}
.app-title{font-family:var(--display);font-size:1.08rem;font-weight:700;margin:0;padding:0;border:0;letter-spacing:-.008em}
.app-text{margin:0;font-size:1rem;line-height:1.66;color:var(--ink-2);max-width:var(--col)}
.apps-closing{margin-top:1.4rem;font-size:.95rem;color:var(--ink-2);max-width:var(--col)}

/* ======================================================================
   FORWARD-DEPLOYED CAPABILITY: four evidence-led views
   ====================================================================== */
.cap{background:var(--brand);border-radius:var(--radius);overflow:hidden;margin:var(--s-block) 0;
  width:min(calc(var(--wrap) - 4rem),calc(100vw - 4rem))}
.cap-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1.5rem;
  padding:1.9rem 2.1rem 1.4rem;border-bottom:1px solid rgba(255,255,255,.12)}
.cap-kicker{font-family:var(--sans);font-size:.75rem;font-weight:700;letter-spacing:.11em;
  text-transform:uppercase;color:var(--mint-on-dark);margin-bottom:.55rem}
.cap-title{font-family:var(--display);font-size:clamp(1.2rem,2.1vw,1.5rem);color:#fff;
  margin:0 0 .55rem;padding:0;border:0;letter-spacing:-.01em;line-height:1.22}
.cap-dek{font-family:var(--sans);font-size:.95rem;color:#C3D7C9;margin:0;max-width:60ch;line-height:1.55}
.cap-body{display:grid;grid-template-columns:16.5rem 1fr;gap:0}
.cap-tabs{display:flex;flex-direction:column;border-right:1px solid rgba(255,255,255,.12);padding:1.2rem 0}
.cap-tab{display:flex;align-items:flex-start;gap:.7rem;text-align:left;background:none;border:0;
  border-left:2px solid transparent;cursor:pointer;padding:.85rem 1.5rem .85rem 2rem;
  font-family:var(--sans);font-size:.86rem;font-weight:600;line-height:1.35;color:#A9C0B0;
  transition:color var(--dur),border-color var(--dur),background var(--dur)}
.cap-tab:hover{color:#fff}
.cap-tab.active{color:#fff;border-left-color:var(--mint);background:rgba(255,255,255,.05)}
.cap-tab-n{font-family:var(--display);font-size:.76rem;font-weight:700;letter-spacing:.06em;
  color:var(--mint-on-dark);padding-top:.25rem;min-width:1ch}
.cap-tab.active .cap-tab-n{color:var(--mint)}
.cap-panel{padding:1.9rem 2.1rem 2rem}
.cap-panel-top{display:flex;justify-content:space-between;align-items:baseline;gap:1.2rem;
  flex-wrap:wrap;margin-bottom:.9rem}
.cap-panel-h{font-family:var(--display);font-size:1.08rem;color:#fff;margin:0;padding:0;border:0}
.cap-srcs{display:flex;gap:.4rem;flex-wrap:wrap}
.cap-src{display:inline-flex;align-items:center;gap:.35rem;font-family:var(--sans);font-size:.76rem;
  font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#A9C0B0;
  border:1px solid rgba(255,255,255,.18);border-radius:20px;padding:.16rem .55rem}
/* on-dark equivalents of the lens dots: the light-background tokens vanish here */
.cap-src i{width:5px;height:5px;border-radius:50%;background:var(--mint-on-dark)}
.cap-src[data-src="cititec"] i{background:#D9B860}
.cap-panel p{margin:0 0 .85rem;font-size:.94rem;line-height:1.66;color:#C8D6CB;max-width:62ch}
.cap-panel p:last-child{margin-bottom:0}
.cap-list{margin:0;padding:0;list-style:none;max-width:62ch}
.cap-list li{position:relative;padding-left:1.3rem;margin-bottom:.75em;font-size:.94rem;
  line-height:1.6;color:#C8D6CB}
.cap-list li:last-child{margin-bottom:0}
.cap-list li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;
  border-radius:50%;background:var(--mint-on-dark)}
.cap-closing{margin-top:1.2rem !important;padding-top:1.1rem;border-top:1px solid rgba(255,255,255,.12);
  font-size:.88rem !important;color:#A9C0B0 !important}

/* ======================================================================
   VALUE, MEASUREMENT AND RUN ECONOMICS
   ====================================================================== */
.val-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1.2rem;align-items:start}
.val-card{background:var(--card);border:1px solid var(--rule);border-top:3px solid var(--brand);
  border-radius:var(--radius);padding:1.5rem 1.6rem}
.val-h{font-family:var(--display);font-size:1.06rem;margin:0 0 .9rem;padding:0;border:0;letter-spacing:-.005em}
.val-card ul{margin:0;padding-left:1.05rem}
.val-card li{font-size:.96rem;line-height:1.62;color:var(--ink-2);margin-bottom:.65em}
.val-card li:last-child{margin-bottom:0}
.val-q{margin:1.1rem 0 0;padding-top:.95rem;border-top:1px solid var(--mint-line);
  font-size:.9rem;line-height:1.55;color:var(--ink-2)}
.val-q p{margin:0 0 .5em;font-size:.95rem;line-height:1.55}
.val-q p:last-child{margin-bottom:0}
.val-q span{display:block;font-family:var(--sans);font-size:.76rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--accent);margin-bottom:.4rem}

@media (max-width:900px){
  .cap{width:100%}
  .cap-head{padding:1.5rem 1.4rem 1.2rem}
  .cap-body{grid-template-columns:1fr}
  .cap-tabs{flex-direction:row;overflow-x:auto;scrollbar-width:none;border-right:0;
    border-bottom:1px solid rgba(255,255,255,.12);padding:0}
  .cap-tabs::-webkit-scrollbar{display:none}
  .cap-tab{padding:.95rem 1rem;border-left:0;border-bottom:2px solid transparent;white-space:nowrap;font-size:.82rem}
  .cap-tab.active{border-left-color:transparent;border-bottom-color:var(--mint)}
  .cap-panel{padding:1.5rem 1.4rem 1.7rem}
  .cap-panel-top{gap:.5rem}
  .app-top{gap:.4rem}
}

@media print{
  .cap{background:#fff !important;border:1px solid #999}
  .cap-title,.cap-panel-h{color:#000 !important}
  .cap-dek,.cap-panel p,.cap-list li{color:#333 !important}
  .cap-kicker,.cap-closing,.cap-src{color:#555 !important}
  .cap-src{border-color:#bbb !important}
  .cap-body{display:block !important}
  .cap-tabs{display:none !important}
  /* every view prints, whether or not it is the selected tab */
  .cap-panel,.cap-panel[hidden]{display:block !important;padding:1rem 0 0 !important;break-inside:avoid}
  .cap-panel-h{border-bottom:1px solid #ccc;padding-bottom:.3rem}
  .cap-list li::before{background:#666 !important}
  .cap-closing{border-top-color:#ccc !important}
  .val-card{border-color:#999 !important;break-inside:avoid}
  .app{break-inside:avoid}
}

/* Always-visible qualification lifted out of the capability tab set, so no
   material caveat depends on the reader selecting a tab. */
.cap-note{font-family:var(--sans);font-size:.95rem;line-height:1.62;color:var(--ink-2);
  max-width:var(--col);margin:1.4rem 0 0;padding-left:1rem;border-left:2px solid var(--mint-line)}

/* Talent-market bridge. */
.talent-cta{margin:1.8rem 0 0}
.talent-cta .btn{text-decoration:none}

/* Focus visibility on every control the reader can reach. */
.snap-toggle:focus-visible,.ev-ctrl:focus-visible,.lens-chip:focus-visible,
.lens-reset:focus-visible,.expand-note summary:focus-visible,.talent-cta .btn:focus-visible{
  outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

@media (max-width:820px){
  /* The lens stays in the document flow on smaller screens. */
  .lens-bar.pinned{position:static;padding:.95rem 1.15rem;box-shadow:none;
    border:1px solid var(--rule);border-radius:var(--radius)}
  .lens-bar.pinned .ev-controls{display:flex}
  .lens-sentinel{height:0 !important}
  .section-head{grid-template-columns:1fr}
  .section-num{font-size:1.15rem}
}

@media print{
  /* Every disclosure prints open. */
  .snap-evidence{display:block !important}
  .snap-toggle{display:none !important}
  details.expand-note > .expand-note-body,
  details.method-disclosure > .method-body{display:block !important}
  .lens-bar,.lens-sentinel,.ev-controls{display:none !important}
  .cap-note{color:#000 !important;border-left-color:#666 !important}
  .hero-meta{background:#fff !important;border-color:#999 !important;color:#000 !important}
  .hero-meta b{color:#000 !important}
  .ev-key{border-color:#999 !important;background:#fff !important;color:#000 !important}
  .talent-cta .btn{border:1px solid #666 !important;background:#fff !important;color:#000 !important}
}

/* ======================================================================
   AUTHORITY DISCLOSURES
   One neutral treatment for every classification. The surface is
   transparent, the rules are fine and neutral, and no authority type gets
   its own colour, panel or border. Classification is carried by the written
   label on the metadata line. The only coloured element is the small
   Evidence gap flag.
   ====================================================================== */
details.auth{
  max-width:var(--col);margin:1.6rem 0;
  background:transparent;border:1px solid var(--rule);border-radius:var(--radius)}
details.auth + details.auth{margin-top:.85rem}

details.auth > summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:flex-start;gap:1rem;
  padding:1.05rem 1.25rem;
  transition:background var(--dur)}
details.auth > summary::-webkit-details-marker{display:none}
details.auth > summary::marker{content:""}
details.auth > summary:hover{background:rgba(18,33,26,.025)}
details.auth > summary:focus-visible{outline:2px solid var(--accent);outline-offset:-2px;border-radius:var(--radius)}

details.auth .auth-text{flex:1 1 auto;min-width:0;display:block}

/* 1. the descriptive title leads, in the normal dark reading colour */
details.auth .auth-title{
  display:block;font-family:var(--display);font-size:1.08rem;font-weight:700;
  line-height:1.38;letter-spacing:-.006em;color:var(--ink)}

/* 2. a quiet metadata line beneath it, on its own row */
details.auth .auth-meta{
  display:flex;align-items:center;flex-wrap:wrap;gap:.45rem;
  margin-top:.42rem;
  font-family:var(--sans);font-size:.8rem;font-weight:400;
  letter-spacing:.01em;color:var(--muted);line-height:1.45}
details.auth .auth-meta-text{white-space:normal}

/* 3. provenance keeps a small subdued dot, no pill */
details.auth .auth-dot{
  width:6px;height:6px;border-radius:50%;flex:0 0 auto;background:var(--faint)}
details.auth .auth-dot[data-src="private"]{background:var(--src-private)}
details.auth .auth-dot[data-src="external"]{background:var(--src-external)}
details.auth .auth-dot[data-src="cititec"]{background:var(--src-cititec)}

/* 4. Evidence gap is the one place a warning colour is used */
details.auth .gap-flag{
  font-family:var(--sans);font-size:.76rem;font-weight:700;letter-spacing:.05em;
  text-transform:uppercase;color:var(--gap);
  border:1px solid var(--gap);border-radius:2px;padding:.05rem .38rem;line-height:1.5}

/* 5. restrained chevron */
details.auth .auth-chevron{
  flex:0 0 auto;width:.62rem;height:.62rem;margin-top:.5rem;
  border-right:1.5px solid var(--muted);border-bottom:1.5px solid var(--muted);
  transform:rotate(45deg);transform-origin:60% 60%;
  transition:transform var(--dur),border-color var(--dur)}
details.auth[open] .auth-chevron{transform:rotate(-135deg)}
details.auth > summary:hover .auth-chevron{border-color:var(--accent)}

/* 6. expanded copy sits beneath a subtle neutral rule */
details.auth .auth-body{
  padding:1.05rem 1.25rem 1.15rem;border-top:1px solid var(--rule-2);
  margin:0 0 0 0}
details.auth .auth-body p{margin:0 0 .75em;font-size:1rem;line-height:1.68;color:var(--ink-2)}
details.auth .auth-body p:last-child{margin-bottom:0}
details.auth .auth-body ol{margin:.1rem 0 0;padding-left:1.2rem}
details.auth .auth-body li{margin-bottom:.7em;font-size:1rem;line-height:1.62;color:var(--ink-2);padding-left:.2rem}
details.auth .auth-body li:last-child{margin-bottom:0}

/* quiet subheading for specific cases inside a disclosure */
details.auth .auth-sublabel{
  font-family:var(--sans);font-size:.76rem;font-weight:700;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);
  margin:1.3rem 0 .6rem;padding-top:.85rem;border-top:1px solid var(--rule-2)}

/* review comment control stays reachable while collapsed */

@media (max-width:820px){
  details.auth > summary{padding:.95rem 1rem;gap:.7rem}
  details.auth .auth-body{padding:.95rem 1rem 1.05rem}
  details.auth .auth-title{font-size:1.04rem}
}

@media print{
  details.auth{border-color:#999 !important;background:#fff !important;break-inside:avoid}
  details.auth .auth-chevron{display:none !important}
  details.auth .auth-title{color:#000 !important}
  details.auth .auth-meta,details.auth .auth-sublabel{color:#333 !important}
  details.auth .auth-body{display:block !important;border-top-color:#ccc !important}
  details.auth .auth-body p,details.auth .auth-body li{color:#000 !important}
  details.auth .gap-flag{color:#333 !important;border-color:#666 !important}
}

/* ======================================================================
   EDITORIAL LIFT
   Applied on top of the existing design system rather than replacing it.
   Three moves: a serif reading face for narrative prose, original artwork
   at the cover and at two section transitions, and a publisher ending.
   Colour is unchanged apart from one deeper brand tone for the ending.
   ====================================================================== */

/* ---------- 1. reading face ----------
   Narrative prose only. Headings, navigation, labels, metadata, controls,
   evidence badges and card furniture keep Space Grotesk. */
.body p, .body li,
.lead-para,
.snap-summary p, .snap-summary, .ev-block p,
details.auth .auth-body p, details.auth .auth-body li,
.expand-note-body p,
.method-body p, .md-layer p, .md-note,
.author-bio p,
.pub-intro p, .pub-card p, .pub-contact p,
.pullquote blockquote p,
.cap-note, .cap-closing p,
.val-card p, .app p, .stock p{
  font-family:var(--serif);
  font-variant-numeric:oldstyle-nums proportional-nums;
}
.body p, .body li, .expand-note-body p,
details.auth .auth-body p, details.auth .auth-body li{
  line-height:1.72;
}
.lead-para{font-size:1.22rem;line-height:1.56}
.body p{font-size:1.045rem}

/* ---------- 2. cover artwork ----------
   Original artwork commissioned for this report. Abstract layered strata,
   decorative only, hidden from assistive technology and from print. */
.hero{overflow:hidden}
.cover-art{
  position:absolute;top:0;right:0;width:min(46%,640px);height:min(72%,420px);
  background:right top/cover no-repeat url("../assets/art/cover-strata.svg");
  opacity:.34;pointer-events:none;
  -webkit-mask-image:linear-gradient(to left,#000 45%,transparent 100%);
  mask-image:linear-gradient(to left,#000 45%,transparent 100%)}
.hero .wrap{position:relative;z-index:1}
@media (max-width:900px){ .cover-art{display:none} }

/* section transitions: two only, at the two structural turns in the report */
.section.has-art{position:relative;padding-top:calc(var(--s-section) + 3.4rem)}
.section.has-art::before{
  content:"";position:absolute;left:0;right:0;top:1.6rem;height:120px;
  background:center top/min(1180px,calc(100% - 4rem)) no-repeat;
  opacity:.75;pointer-events:none}
/* the artwork sits above the section head, so anchor jumps must clear the
   sticky navigation as well as the artwork band */
.section.has-art{scroll-margin-top:9.5rem}
#delivery.has-art::before{background-image:url("../assets/art/transition-path.svg")}
#architecture.has-art::before{background-image:url("../assets/art/transition-layer.svg")}
@media (max-width:820px){
  .section.has-art{padding-top:calc(var(--s-section) + 2rem)}
  .section.has-art::before{height:78px;top:.9rem}
}

/* ---------- 3. pull quotes ----------
   Verbatim public quotations only, with speaker, role and linked source. */
.pullquote{
  margin:2.9rem 0;padding:0 0 0 1.6rem;max-width:var(--col);
  border-left:2px solid var(--mint-line)}
.pullquote blockquote{margin:0}
.pullquote blockquote p{
  font-family:var(--serif);font-size:1.42rem;line-height:1.42;color:var(--ink);
  letter-spacing:-.008em;margin:0 0 .85rem;text-wrap:balance}
.pullquote figcaption{display:flex;flex-direction:column;gap:.2rem}
.pq-who{font-family:var(--sans);font-size:.88rem;font-weight:700;color:var(--ink-2)}
.pq-src{font-family:var(--sans);font-size:.84rem;color:var(--muted)}
a.pq-src{color:var(--accent);text-decoration:underline}
a.pq-src:hover{color:var(--accent-2)}
/* Private contributor quotations. Same restrained treatment as the public
   ones; the accent on the rule is the only difference, so the two read as one
   editorial device rather than as two classes of evidence. */
.pullquote.private{border-left-color:var(--brand)}
@media (max-width:520px){ .pullquote blockquote p{font-size:1.22rem} }

/* ---------- 4. disclosures as editorial annotations ----------
   Same neutral treatment approved in V10.4, refined: a quieter surface, a
   restrained accent on the source dot side, and the serif body inside.
   No authority type gains a colour, a panel or a weight of its own. */
details.auth{background:rgba(255,255,255,.55)}
.surface-white details.auth{background:var(--paper)}
details.auth[open]{background:var(--card);box-shadow:var(--shadow)}
.surface-white details.auth[open]{background:var(--paper)}
details.auth > summary{transition:background var(--dur),border-color var(--dur)}
details.auth .auth-body p{color:var(--ink-2)}

/* ---------- 5. share menu ---------- */
.share-menu[hidden]{display:none}
.share-menu{
  position:absolute;right:2rem;top:calc(100% - .35rem);z-index:60;
  background:var(--card);border:1px solid var(--rule);border-radius:var(--radius);
  box-shadow:var(--shadow-lift);padding:.5rem;min-width:16rem;
  display:flex;flex-direction:column;gap:.1rem}
.share-item{
  font-family:var(--sans);font-size:.88rem;text-align:left;color:var(--ink-2);
  background:none;border:0;border-radius:4px;padding:.55rem .7rem;cursor:pointer;
  text-decoration:none;display:block}
.share-item:hover{background:var(--mint-soft);color:var(--accent)}
.share-note{font-family:var(--sans);font-size:.8rem;color:var(--muted);padding:.15rem .7rem .3rem}
.share-note:empty{display:none}
.navbar .wrap{position:relative}
@media (max-width:520px){ .share-menu{right:1.1rem;left:1.1rem;min-width:0} }

/* ---------- 6. publisher ending ----------
   The one deeper tonal band in the report. It closes the document the way a
   publisher's note closes a printed briefing. */
.publisher{background:var(--brand-deep);color:#D8E4DB;padding:4.4rem 0 4rem}
.publisher .sec-label{color:var(--mint-on-dark)}
.pub-head{margin-bottom:1.9rem}
.pub-title{font-family:var(--display);font-size:clamp(1.7rem,3vw,2.25rem);color:#fff;margin-top:.7rem;letter-spacing:-.018em}
.pub-tagline{font-family:var(--display);font-size:clamp(1.06rem,1.55vw,1.2rem);line-height:1.5;
  color:var(--mint-on-dark);margin:.9rem 0 1.4rem;max-width:46rem;letter-spacing:-.004em}
.pub-intro{max-width:46rem}
.pub-intro p{font-size:1.06rem;line-height:1.68;color:#D8E4DB;margin-bottom:1rem}
.pub-services{list-style:none;margin:2.4rem 0 0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(15.5rem,1fr));gap:1px;
  background:rgba(157,199,172,.22);border:1px solid rgba(157,199,172,.22);border-radius:var(--radius);overflow:hidden}
.pub-services li{background:var(--brand-deep);padding:1.35rem 1.5rem}
.pub-services b{display:block;font-family:var(--sans);font-size:.8rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--mint-on-dark);margin-bottom:.55rem}
.pub-services span{font-family:var(--serif);font-size:1rem;line-height:1.6;color:#C6D5C9}
.pub-reach{font-family:var(--sans);font-size:.95rem;color:#C6D5C9;margin-top:1.6rem}

.pub-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(17rem,1fr));gap:1.6rem;margin-top:2.6rem}
.pub-card{border-top:2px solid var(--mint-on-dark);padding-top:1.2rem}
.pub-card h3{font-family:var(--display);font-size:1.14rem;color:#fff;margin-bottom:.6rem}
.pub-card p{font-size:1rem;line-height:1.65;color:#C6D5C9;margin-bottom:1.1rem}
.publisher .btn{font-family:var(--sans);font-size:.88rem;font-weight:700;border-radius:4px;
  padding:.62rem 1.05rem;display:inline-flex;height:auto;text-decoration:none;cursor:pointer;
  background:var(--mint);border:1px solid var(--mint);color:var(--brand-deep)}
.publisher .btn:hover{background:#fff;border-color:#fff;color:var(--brand-deep)}
.publisher .btn.ghost{background:transparent;border-color:rgba(216,228,219,.45);color:#EAF2EC}
.publisher .btn.ghost:hover{background:rgba(255,255,255,.08);border-color:#fff;color:#fff}
.pub-share{display:flex;flex-wrap:wrap;gap:.55rem}
.pub-share-note{display:block;font-family:var(--sans);font-size:.86rem;color:var(--mint-on-dark);margin-top:.7rem}
.pub-share-note:empty{display:none}
.pub-contact{margin-top:2.8rem;padding-top:1.6rem;border-top:1px solid rgba(157,199,172,.25);max-width:46rem}
.pub-contact h3{font-family:var(--sans);font-size:.8rem;font-weight:700;letter-spacing:.11em;
  text-transform:uppercase;color:var(--mint-on-dark);margin-bottom:.6rem}
.pub-contact p{font-size:1rem;line-height:1.68;color:#D8E4DB;margin:0}
.publisher a{color:#EAF2EC;text-decoration:underline}
.publisher a:hover{color:#fff}
@media (max-width:820px){ .publisher{padding:3rem 0 2.6rem} }

/* ---------- print ---------- */
@media print{
  .cover-art,.section.has-art::before{display:none !important}
  .section.has-art{padding-top:1.15rem}
  .pullquote{border-left-color:#999;break-inside:avoid}
  .pullquote blockquote p{color:#000;font-size:13pt}
  .pq-who,.pq-src,a.pq-src{color:#333 !important}
  .publisher{background:#fff !important;color:#000 !important;padding:1.4rem 0;break-inside:avoid}
  .pub-title,.pub-card h3{color:#000 !important}
  .pub-intro p,.pub-card p,.pub-services span,.pub-contact p,.pub-reach,.pub-tagline{color:#000 !important}
  .pub-services li{background:#fff !important}
  .pub-services b,.pub-contact h3,.publisher .sec-label{color:#333 !important}
  .pub-services{border-color:#999 !important;background:#999 !important}
  .publisher .btn,.publisher .btn.ghost{border:1px solid #666 !important;background:#fff !important;color:#000 !important}
  .publisher a{color:#000 !important}
  details.auth,details.auth[open]{background:#fff !important;box-shadow:none !important}
}