/* Enterprise Product Design & Management — production stylesheet v3.2.
   Drop-in replacement for styles-v3.css. WCAG 2.2 AA target. */

/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Instrument+Sans:ital,wght@0,400..700;1,400..700&family=Source+Serif+4:ital,opsz,wght@0,8..60,300..700;1,8..60,300..700&display=swap');

/* Design tokens and themes */
:root {

  --ink:           #111111;
  --ink-2:         #3A3A38;
  --ink-3:         #5E5E5A;
  --paper:         #FBFAF8;
  --surface:       #F1EFE9;
  --red:           #B01A08;
  --ochre:         #FFD23F;
  --rule:          #C0BFB9;
  --rule-strong:   #B0AEA6;
  --rule-heavy:    var(--ink);

  --on-red:        var(--paper);
  --grey:          var(--ink-3);
  --grey-mid:      var(--ink-3);

  --font-display:  'Instrument Sans', system-ui, -apple-system, sans-serif;
  --font-heading:  var(--font-display);
  --font-body:     'Source Serif 4', Georgia, 'Times New Roman', serif;
  --font-mono:     var(--font-display);
  --font-label:    var(--font-display);

  --u:             8px;
  --lh:            1.62;
  --measure:       640px;
  --fs-body:       1.1875rem;
  --sidebar:       15rem;
  --shell-gap:     3rem;
  --gap:           40px;

  --label-size:    11.5px;
  --label-track:   0.15em;

  --shell-w:       calc(var(--measure) + (var(--gap) * 2) + var(--sidebar) + (var(--shell-gap) * 2) + var(--aside));

  --aside:         0px;
  --note-float:    none;
  --note-w:        100%;
  --note-mr:       0px;
  --note-mt:       0px;
  --note-mb:       24px;
}

@media (min-width: 1180px) {
  :root {
    --measure:    660px;
    --aside:      212px;
    --note-float: right;
    --note-w:     196px;
    --note-mr:    -248px;
    --note-mt:    6px;
    --note-mb:    10px;
  }
}

@media (min-width: 1440px) {
  :root {
    --measure: 680px;
    --aside:   236px;
    --note-w:  212px;
    --note-mr: -288px;
  }
}

html[data-theme="dark"] {
  --ink:         #F2F1ED;
  --ink-2:       #CFCEC8;
  --ink-3:       #A3A29B;
  --paper:       #0F0F0E;
  --surface:     #1A1A18;
  --red:         #FF5A4D;
  --rule:        #33322E;
  --rule-strong: #4A4844;
  --rule-heavy:  var(--ink);
  --on-red:      #1A0603;
}

/* Base and accessibility */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;

  scroll-padding-top: calc(var(--u) * 9);
  background: var(--paper);
}

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: var(--ochre);
  color: #111111;
}

img, svg, video {
  max-width: 100%;
  height: auto;
}

.skip-link {
  position: absolute;
  top: -100px;
  left: 0;
  background: var(--ink);
  color: var(--paper);
  padding: calc(var(--u) * 1.5) calc(var(--u) * 2);
  font-family: var(--font-label);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  letter-spacing: 0.08em;
  z-index: 1000;
  transition: top 0.15s ease;
}

.skip-link:focus,
.skip-link:focus-visible {
  top: 0;
  outline: 3px solid var(--red);
  outline-offset: 0;
}

.masthead {
  background: var(--paper);
  color: var(--ink);
  padding: calc(var(--u) * 7) 0;
}

.masthead-inner {
  max-width: calc(var(--measure) + (var(--gap) * 2));
  margin: 0 auto;
  padding: 0 var(--gap);
}

.shell > .masthead {
  grid-column: 2;
  grid-row: 1;
  padding: calc(var(--u) * 7) 0 calc(var(--u) * 5);
}

.shell > .masthead .masthead-inner {
  max-width: none;
  padding: 0;
  display: block;
}

.shell > .chapnav {
  grid-column: 1;
  grid-row: 2;
  align-self: stretch;
}

.shell:has(> .masthead) > main,
.shell:has(> .masthead) > .chapter {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
}

.shell:has(> .masthead) > main > .chapter,
.shell:has(> .masthead) > .chapter { padding-top: 0; }

.shell:has(> .masthead) > .chapnav {
  padding-top: 0;
}

body:has(.shell) .masthead-inner {
  max-width: var(--shell-w);
  display: grid;
  grid-template-columns: var(--sidebar) minmax(0, 1fr) var(--aside);
  column-gap: var(--shell-gap);
  row-gap: 0;
}

body:has(.shell) .masthead-inner > * { grid-column: 2; }

body:has(.shell) .masthead h1 { max-width: 24ch; }
body:has(.shell) .standfirst { max-width: 40ch; }

body:has(.shell) .readtime,
body:has(.shell) .outcomes {
  max-width: none;
}

.chapno {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(52px, 9vw, 104px);
  line-height: 0.8;
  letter-spacing: -0.05em;
  color: var(--ink);
  margin-bottom: calc(var(--u) * 1.5);
}

.eyebrow {
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: calc(var(--u) * 1.5);
}

.masthead .mast-body { margin-top: calc(var(--u) * 1.5); }

.chapno em {
  font-style: normal;
  color: inherit;
}

.masthead h1 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: clamp(30px, 3.6vw, 44px);
  line-height: 1.06;
  letter-spacing: -0.028em;
  max-width: 24ch;
  margin-bottom: calc(var(--u) * 3);
  text-wrap: balance;
  color: var(--ink);
}

.standfirst {
  font-family: var(--font-body);
  font-size: 21px;
  line-height: 1.5;
  max-width: 44ch;
  color: var(--ink-2);
  margin-bottom: calc(var(--u) * 5);
  text-wrap: pretty;
}

.readtime {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 600;
  letter-spacing: var(--label-track);
  text-transform: uppercase;
  color: var(--ink-3);
  border-top: 1px solid var(--rule-strong);
  padding-top: calc(var(--u) * 1.5);
  margin-bottom: 0;
  max-width: var(--measure);
}

.outcomes {
  border-top: 0;
  padding-top: 0;
  max-width: var(--measure);
}

.outcomes p,
.outcomes li { max-width: none; }

.outcomes h2 {
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 600;
  letter-spacing: var(--label-track);
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: calc(var(--u) * 2);
}

.outcomes p {
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.5;
  color: var(--ink-2);
  max-width: 52ch;
  margin-bottom: calc(var(--u) * 2);
}

.outcomes ol {
  list-style: none;
  counter-reset: oc;
}

.outcomes li {
  counter-increment: oc;
  position: relative;
  padding: calc(var(--u) * 1.5) 0 calc(var(--u) * 1.5) 50px;
  border-bottom: 1px solid var(--rule);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.5;
  color: var(--ink);
}

.outcomes li:last-child {
  border-bottom: 0;
}

.outcomes li::before {
  content: counter(oc, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: calc(var(--u) * 1.5 + 4px);
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.08em;
  color: var(--red);
}

.chapter {
  max-width: calc(var(--measure) + (var(--gap) * 2));
  margin: 0 auto;
  padding: calc(var(--u) * 8) var(--gap) calc(var(--u) * 10);
}

.shell {
  max-width: var(--shell-w);
  margin: 0 auto;
  padding: 0 var(--gap);
  display: grid;
  grid-template-columns: var(--sidebar) minmax(0, 1fr) var(--aside);
  gap: var(--shell-gap);
  align-items: start;
}

.shell .chapter {
  max-width: none;
  margin: 0;
  padding: calc(var(--u) * 8) 0 calc(var(--u) * 10);
}

.chapnav {
  padding: calc(var(--u) * 8) 0 calc(var(--u) * 4);
  font-family: var(--font-display);
  font-size: 13.5px;
  line-height: 1.35;
}

.chapnav:not(:has(.chapnav-inner)) {
  position: sticky;
  top: 0;
}

.chapnav-inner {
  position: sticky;
  top: calc(var(--u) * 9);
}

.chapnav__label {
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 600;
  letter-spacing: var(--label-track);
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: calc(var(--u) * 1.5);
}

body:has(.chapnav) .content h2.sec:first-child {
  margin-top: 0;
}

.chapnav ol { list-style: none; margin: 0; padding: 0; }

.chapnav li {
  margin: 0;
  border-bottom: 1px solid var(--rule-strong);
}

.chapnav li:last-child { border-bottom: 0; }

.chapnav a {
  display: grid;
  grid-template-columns: 26px minmax(0, 1fr);
  gap: var(--u);
  padding: calc(var(--u) * 1.25) 0 calc(var(--u) * 1.25) calc(var(--u) * 1.25);
  margin-left: calc(var(--u) * -1.25);
  color: var(--ink-2);
  text-decoration: none;
  border-left: 3px solid transparent;
}

.chapnav a span { display: block; }

.chapnav a::before {
  content: attr(data-n);
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.04em;
  color: var(--ink-3);
  padding-top: 3px;
}

.chapnav a:hover { color: var(--red); }
.chapnav a:hover::before { color: var(--red); }

.chapnav [aria-current="page"] {
  color: var(--ink);
  font-weight: 600;
  border-left-color: var(--red);
}

.chapnav [aria-current="page"]::before { color: var(--red); }

.pagenav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-top: 2px solid var(--rule-heavy);
  margin-top: calc(var(--u) * 8);
}

.pagenav a {
  padding: calc(var(--u) * 3) calc(var(--u) * 3) calc(var(--u) * 3) 0;
  text-decoration: none;
  color: var(--ink);
  border-right: 1px solid var(--rule-strong);
}

.pagenav a:last-child {
  border-right: 0;
  padding: calc(var(--u) * 3) 0 calc(var(--u) * 3) calc(var(--u) * 3);
  text-align: right;
}

.pagenav .dir {
  display: block;
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 600;
  letter-spacing: var(--label-track);
  text-transform: uppercase;
  color: var(--red);
  margin-bottom: var(--u);
}

.pagenav .num {
  display: block;
  font-family: var(--font-label);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
  color: var(--ink-3);
  margin-bottom: 4px;
}

.pagenav .t {
  font-family: var(--font-display);
  font-size: 19px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -0.012em;
}

.pagenav a:hover .t { color: var(--red); }
.pagenav a.is-empty { visibility: hidden; }

h2.sec,
.content h2 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 26px;
  line-height: 1.24;
  letter-spacing: -0.014em;
  margin: calc(var(--u) * 8) 0 calc(var(--u) * 2.5);
  padding-top: calc(var(--u) * 2.25);
  border-top: 1px solid var(--rule-strong);
  color: var(--ink);
  text-wrap: balance;
  clear: both;
}

.content { counter-reset: sec; }

.content h2.sec {
  counter-increment: sec;
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 0.62em;
  align-items: baseline;
}

.content h2.sec::before {
  content: counter(sec, decimal-leading-zero);
  color: var(--red);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.content[data-chap="1"] { --chap: "1."; }
.content[data-chap="2"] { --chap: "2."; }
.content[data-chap="3"] { --chap: "3."; }
.content[data-chap="4"] { --chap: "4."; }
.content[data-chap="5"] { --chap: "5."; }
.content[data-chap="6"] { --chap: "6."; }
.content[data-chap="7"] { --chap: "7."; }
.content[data-chap="8"] { --chap: "8."; }
.content[data-chap="9"] { --chap: "9."; }
.content[data-chap="10"] { --chap: "10."; }
.content[data-chap="11"] { --chap: "11."; }
.content[data-chap="12"] { --chap: "12."; }
.content[data-chap="13"] { --chap: "13."; }
.content[data-chap="14"] { --chap: "14."; }
.content[data-chap="15"] { --chap: "15."; }
.content[data-chap="16"] { --chap: "16."; }
.content[data-chap="17"] { --chap: "17."; }
.content[data-chap="18"] { --chap: "18."; }
.content[data-chap="19"] { --chap: "19."; }
.content[data-chap="20"] { --chap: "20."; }
.content[data-chap="21"] { --chap: "21."; }
.content[data-chap="22"] { --chap: "22."; }
.content[data-chap="23"] { --chap: "23."; }
.content[data-chap="24"] { --chap: "24."; }

.content[data-chap] h2.sec::before {
  content: var(--chap) counter(sec);
}

.content[data-chap] .bp h2::before,
.content[data-chap] h2[id*="reference"]::before,
.content[data-chap] h2[id*="further"]::before,
.content.no-numbers[data-chap] h2.sec::before {
  content: none;
}

.content[data-chap] .bp h2,
.content[data-chap] h2[id*="reference"],
.content[data-chap] h2[id*="further"] {
  display: block;
}

.content .bp h2,
.content h2[id*="reference"],
.content h2[id*="further"],
.content.no-numbers h2.sec {
  counter-increment: none;
  display: block;
}

.content .bp h2::before,
.content h2[id*="reference"]::before,
.content h2[id*="further"]::before,
.content.no-numbers h2.sec::before {
  content: none;
}

.content h2[id*="reference"],
.content h2[id*="further"] {
  border-top-width: 2px;
  border-top-color: var(--rule-heavy);
  font-size: 22px;
}

.content h2:first-child { margin-top: 0; }

.content h3 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 19px;
  line-height: 1.3;
  letter-spacing: -0.004em;
  margin: calc(var(--u) * 5) 0 calc(var(--u) * 1.5);
  color: var(--ink);
}

.content h3::before {
  content: "";
  display: block;
  width: 24px;
  height: 2px;
  background: var(--red);
  margin-bottom: calc(var(--u) * 1.5);
}

.content h4 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16.5px;
  line-height: 1.32;
  letter-spacing: 0;
  margin: calc(var(--u) * 3.5) 0 var(--u);
  color: var(--ink);
}

.content p {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh);
  color: var(--ink);
  margin-bottom: calc(var(--u) * 2.25);
  text-wrap: pretty;
}

.content p.lede::first-letter {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 3.2em;
  float: left;
  line-height: 0.8;
  margin: 8px 10px 0 0;
  color: var(--red);
}

.content strong { font-weight: 600; color: var(--ink); }
.content em { font-style: italic; }

a { color: var(--ink); }

.content a,
.references a {
  color: var(--ink);
  text-decoration: underline;
  text-decoration-color: var(--red);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.content a:hover,
.references a:hover {
  color: var(--red);
  text-decoration-thickness: 2px;
}

.references a { overflow-wrap: anywhere; }

.content sup a,
.content a[id^="fnref"],
.content a[href^="#fn"]:not([href^="#fnref"]) {
  font-family: var(--font-label);
  font-size: 0.68em;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  vertical-align: super;
  line-height: 0;
  padding: 0 1px 0 2px;
  color: var(--red);
  text-decoration: none;
}

.content sup a:hover,
.content a[id^="fnref"]:hover,
.content a[href^="#fn"]:not([href^="#fnref"]):hover {
  text-decoration: underline;
  text-decoration-thickness: 1px;
}

.references a[href^="#fnref"],
.footnotes a[href^="#fnref"] {
  text-decoration: none;
  color: var(--red);
  padding-left: 4px;
}

.references a[href^="#fnref"]:hover,
.footnotes a[href^="#fnref"]:hover { text-decoration: underline; }


.content ul,
.content ol {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh);
  color: var(--ink);
  margin: 0 0 calc(var(--u) * 3) 0;
  padding-left: 2rem;
}

.content li { margin-bottom: calc(var(--u) * 1.5); }
.content li > p { margin-bottom: var(--u); }
.content li::marker { color: var(--ink-3); }

.content li ul,
.content li ol {
  margin-top: var(--u);
  margin-bottom: var(--u);
}

.cards {
  margin: calc(var(--u) * 4) 0;
  counter-reset: cd;
}

.card {
  counter-increment: cd;
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: calc(var(--u) * 3);
  padding: calc(var(--u) * 3) 0;
  border-bottom: 1px solid var(--rule);
}

.card:last-child { border-bottom: 0; }

.card-id {
  display: flex;
  flex-direction: column;
  gap: var(--u);
}

.card-num {
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.08em;
  color: var(--red);
  line-height: 1.4;
}

.card-num::before { content: counter(cd, decimal-leading-zero); }

.card-term {
  font-family: var(--font-display);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--ink);
}

.content .card-body p {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh);
  color: var(--ink);
  margin-bottom: calc(var(--u) * 1.5);
}

.content .card-body p:last-child { margin-bottom: 0; }
.content .card-body p.card-gist { font-weight: 600; }

.tier {
  border-left: 4px solid var(--red);
  padding: calc(var(--u) * 2.75) calc(var(--u) * 3);
  margin: calc(var(--u) * 3) 0 calc(var(--u) * 4);
  background: var(--surface);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh);
  color: var(--ink);
}

.tier .label {
  display: block;
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 600;
  letter-spacing: var(--label-track);
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: var(--u);
}

.content .tier p {
  font-size: var(--fs-body);
  line-height: var(--lh);
  margin-bottom: calc(var(--u) * 1.5);
}

.content .tier p:last-child { margin-bottom: 0; }

.figure {
  margin: calc(var(--u) * 5) 0;
}

.figure img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid var(--rule);
  background: var(--surface);
}

.figure-caption {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: calc(var(--u) * 2);
  margin-top: calc(var(--u) * 1.5);
  padding-top: calc(var(--u) * 1.25);
  border-top: 1px solid var(--rule-strong);
  align-items: baseline;
}

.figure-num {
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--red);
  white-space: nowrap;
}

.figure-text {
  font-family: var(--font-display);
  font-size: 13.5px;
  color: var(--ink-3);
  line-height: 1.5;
}

.table-wrap {
  overflow-x: auto;
  margin: calc(var(--u) * 4) 0;
}

.table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-display);
  font-size: 15px;
}

.table-wrap .table {
  min-width: 34rem;
  margin: 0;
}

.table thead th {
  background: var(--ink);
  color: var(--paper);
  text-align: left;
  padding: calc(var(--u) * 1.5) calc(var(--u) * 2);
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  vertical-align: bottom;
}

.table td {
  padding: calc(var(--u) * 1.5) calc(var(--u) * 2);
  border-bottom: 1px solid var(--rule);
  vertical-align: top;
  line-height: 1.5;
  color: var(--ink-2);
}

.table tbody td.row-label,
.table tbody th.row-label {
  background: transparent;
  padding: calc(var(--u) * 1.5) calc(var(--u) * 2);
  text-align: left;
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
  color: var(--ink);
  border-bottom: 1px solid var(--rule);
  vertical-align: top;
  line-height: 1.5;
}

.table tbody tr:last-child td,
.table tbody tr:last-child th { border-bottom-color: var(--rule-strong); }

.table-wrap:has(+ .table-caption) { margin-bottom: 0; }

.table-caption {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: calc(var(--u) * 2);
  margin-top: calc(var(--u) * 1.5);
  align-items: baseline;
}

.table-num {
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--red);
  white-space: nowrap;
}

.table-text {
  font-family: var(--font-display);
  font-size: 13.5px;
  color: var(--ink-3);
  line-height: 1.5;
}

.keyterm {
  border: 1px solid var(--rule-strong);
  margin: calc(var(--u) * 4) 0;
  background: var(--surface);
}

.keyterm-word {
  background: var(--ink);
  color: var(--paper);
  padding: calc(var(--u) * 2.5) calc(var(--u) * 3);
}

.keyterm-label {
  display: block;
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 600;
  letter-spacing: var(--label-track);
  text-transform: uppercase;
  color: var(--paper);
  opacity: 0.78;
  margin-bottom: 6px;
}

.keyterm-term {
  display: block;
  font-family: var(--font-display);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.18;
  letter-spacing: -0.012em;
  color: var(--paper);
}

.keyterm-def {
  padding: calc(var(--u) * 3);
  font-family: var(--font-body);
  font-size: 16.5px;
  line-height: 1.58;
  color: var(--ink);
}

.content .keyterm-def,
.content .keyterm-def p {
  font-size: 16.5px;
  line-height: 1.58;
  margin: 0;
}

.content .keyterm-def p + p { margin-top: calc(var(--u) * 1.5); }

mark.yellow,
.mark-yellow {
  background: var(--ochre);
  padding: 0.05em 0.15em;
  color: #111111;
}

mark.red,
.mark-red {
  background: var(--red);
  padding: 0.1em 0.25em;
  color: var(--paper);
  font-weight: 500;
}

html[data-theme="dark"] mark.red,
html[data-theme="dark"] .mark-red { color: #1A0603; }

.bp {
  background: transparent;
  padding: calc(var(--u) * 3) 0 0;
  margin: calc(var(--u) * 8) 0 calc(var(--u) * 6);
  border-top: 2px solid var(--rule-heavy);
}

.bp-label { display: none; }

.bp h2,
.content .bp h2 {
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 600;
  line-height: 1.24;
  letter-spacing: -0.014em;
  color: var(--ink);
  margin: 0 0 calc(var(--u) * 2.5);
  border: 0;
  padding: 0;
}

.bp p,
.content .bp p {
  color: var(--ink-2);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--lh);
  margin: 0 0 calc(var(--u) * 2.5);
}

.bp p:last-child,
.content .bp p:last-child { margin-bottom: 0; }

.bp ol,
.content .bp ol {
  list-style: none;
  counter-reset: bp;
  margin: 0;
  padding: 0;
}

.bp li,
.content .bp li {
  counter-increment: bp;
  position: relative;
  padding: calc(var(--u) * 2.25) 0 calc(var(--u) * 2.25) 52px;
  margin: 0;
  border-bottom: 1px solid var(--rule-strong);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 17.5px;
  line-height: 1.55;
}

.bp li:first-child,
.content .bp li:first-child { border-top: 1px solid var(--rule-strong); }

.bp li:last-child,
.content .bp li:last-child { border-bottom: 0; }

.bp li::before {
  content: counter(bp, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: calc(var(--u) * 2.25 + 5px);
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.08em;
  color: var(--red);
}

.bp strong,
.content .bp strong { color: var(--ink); font-weight: 600; }

.references p,
.footnotes p {
  font-family: var(--font-body);
  font-size: 15.5px;
  line-height: 1.62;
  color: var(--ink-2);
  margin-bottom: calc(var(--u) * 2);
  padding-left: 2rem;
  text-indent: -2rem;
}

.copyright {
  max-width: var(--shell-w);
  margin: 0 auto;
  padding: calc(var(--u) * 3) var(--gap) calc(var(--u) * 6);
  border-top: 1px solid var(--rule-strong);
  text-align: left;
}

body:has(.shell) .copyright {
  display: grid;
  grid-template-columns: var(--sidebar) minmax(0, 1fr) var(--aside);
  column-gap: var(--shell-gap);
  row-gap: 0;
  border-top: 0;
  padding-top: 0;
}

body:has(.shell) .copyright > * { grid-column: 2; }

body:has(.shell) .copyright > :first-child {
  border-top: 1px solid var(--rule-strong);
  padding-top: calc(var(--u) * 3);
}

.copyright p {
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 500;
  color: var(--ink-3);
  line-height: 1.6;
  margin: 0;
  letter-spacing: 0.04em;
}

.copyright .notice {
  font-size: 12px;
  color: var(--ink-3);
  margin-top: 4px;
}

:focus-visible {
  outline: 3px solid var(--red);
  outline-offset: 3px;
  border-radius: 1px;
}

.on-red,
.masthead.is-reversed {
  --ink: #FFFFFF;
  --ink-2: #F2E4E1;
  --ink-3: #F2E4E1;
  --rule: rgba(255, 255, 255, 0.28);
  --rule-strong: rgba(255, 255, 255, 0.45);
  --rule-heavy: #FFFFFF;
  --red: var(--ochre);
  color: #FFFFFF;
}

.on-red :focus-visible,
.masthead.is-reversed :focus-visible {
  outline-color: #FFFFFF;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * {
    animation: none !important;
    transition: none !important;
  }
}

/* Responsive layout */
@media (max-width: 900px) {
  :root { --gap: 24px; }

  .chapno {
    font-size: clamp(60px, 18vw, 96px);
    margin-bottom: calc(var(--u) * 2);
  }

  .masthead { padding: calc(var(--u) * 5) var(--gap) calc(var(--u) * 4); }
  .standfirst { font-size: 19px; }

  .shell {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .shell .chapter { padding-top: calc(var(--u) * 5); }

  .shell > .masthead,
  .shell > .chapnav,
  .shell:has(> .masthead) > main,
  .shell:has(> .masthead) > .chapter {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .shell > .masthead { padding: calc(var(--u) * 5) 0 calc(var(--u) * 3); }

  .chapnav,
  .chapnav:not(:has(.chapnav-inner)) {
    position: static;
    padding: calc(var(--u) * 3) 0 0;
    border-bottom: 1px solid var(--rule-strong);
  }

  .chapnav-inner { position: static; }

  .shell:has(> .masthead) > .chapnav { padding-top: calc(var(--u) * 3); }

  body:has(.shell) .masthead-inner,
  body:has(.shell) .copyright {
    display: block;
    max-width: calc(var(--measure) + (var(--gap) * 2));
    padding-left: var(--gap);
  }

  body:has(.shell) .copyright {
    border-top: 1px solid var(--rule-strong);
    padding-top: calc(var(--u) * 3);
  }

  body:has(.shell) .copyright > :first-child {
    border-top: 0;
    padding-top: 0;
  }

  .chapnav details summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 44px;
  }

  .chapnav details summary::-webkit-details-marker { display: none; }
  .chapnav details summary::after { content: "\25BE"; color: var(--red); font-size: 12px; }
  .chapnav details[open] summary::after { content: "\25B4"; }

  .chapnav__label { padding-top: 0; margin: 0; }

  .chapnav a { min-height: 44px; align-items: center; }

  .copyright { max-width: calc(var(--measure) + (var(--gap) * 2)); }
}

@media (min-width: 901px) {
  .chapnav details > summary { display: none; }
}

@media (max-width: 640px) {
  .content h2, h2.sec { font-size: 23px; }
  .content h3 { font-size: 18px; }
  .masthead h1 { font-size: clamp(27px, 7.4vw, 34px); }

  .pagenav { grid-template-columns: 1fr; }

  .pagenav a,
  .pagenav a:last-child {
    text-align: left;
    border-right: 0;
    border-bottom: 1px solid var(--rule-strong);
    padding: calc(var(--u) * 2.5) 0;
  }

  .card { grid-template-columns: 1fr; gap: var(--u); }

  .card-id {
    flex-direction: row;
    align-items: baseline;
    gap: calc(var(--u) * 1.5);
  }

  .bp { padding-top: calc(var(--u) * 2.5); }
  .bp li, .content .bp li { padding-left: 42px; }
}

/* Optional components: chapter bar, margin notes, numbering, summary list */
.chapbar {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--paper);
  border-bottom: 1px solid var(--rule-strong);
}

.chapbar-inner {
  max-width: var(--shell-w);
  margin: 0 auto;
  padding: 0 var(--gap);
  min-height: 56px;
  display: flex;
  align-items: center;
  gap: calc(var(--u) * 1.5);
}

.chapbar-book,
.chapbar-loc {
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin: 0;
  white-space: nowrap;
}

.chapbar-book { color: var(--ink); }

.chapbar-loc {
  color: var(--ink-3);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-left: calc(var(--u) * 1.5);
  border-left: 1px solid var(--rule-strong);
}

.themetoggle {
  margin-left: auto;
  min-height: 34px;
  padding: 0 12px;
  cursor: pointer;
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--rule-strong);
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
}

.themetoggle:hover { border-color: var(--ink); color: var(--red); }

@media (max-width: 640px) {
  .chapbar-loc { display: none; }
}

.note,
.content .note {
  float: var(--note-float);
  width: var(--note-w);
  margin: var(--note-mt) var(--note-mr) var(--note-mb) 0;
  padding-left: 12px;
  border-left: 2px solid var(--red);
  font-family: var(--font-display);
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--ink-2);
}

.note b,
.note .note-label {
  display: block;
  font-family: var(--font-label);
  font-size: var(--label-size);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: 5px;
}

.content .note p {
  font-family: var(--font-display);
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--ink-2);
  margin: 0 0 8px;
}

.content .note p:last-child { margin-bottom: 0; }

.content.numbered h2 { counter-reset: sub; }

.content.numbered[data-chap] h2.sec::before {
  content: var(--chap) counter(sec);
  color: var(--red);
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

.summary,
.content .summary {
  list-style: none;
  counter-reset: sm;
  margin: calc(var(--u) * 4) 0;
  padding: 0;
  border-top: 2px solid var(--rule-heavy);
}

.summary li,
.content .summary li {
  counter-increment: sm;
  position: relative;
  margin: 0;
  padding: calc(var(--u) * 2) 0 calc(var(--u) * 2) 44px;
  border-bottom: 1px solid var(--rule-strong);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.5;
  color: var(--ink);
}

.summary li::before {
  content: counter(sm, decimal-leading-zero);
  position: absolute;
  left: 0;
  top: calc(var(--u) * 2 + 4px);
  font-family: var(--font-label);
  font-size: 12px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--red);
}

/* Print */
@media print {
  html[data-theme="dark"] {
    --ink: #000; --ink-2: #000; --ink-3: #333;
    --paper: #fff; --surface: #fff; --red: #000;
    --rule: #ccc; --rule-strong: #999; --rule-heavy: #000;
  }

  body {
    background: #fff;
    color: #000;
    font-size: 11pt;
  }

  .skip-link,
  .chapnav,
  .pagenav,
  .chapbar,
  .themetoggle { display: none; }

  .shell {
    display: block;
    max-width: none;
    padding: 0;
  }

  .masthead {
    padding: 0 0 18pt;
    border-bottom: 2pt solid #000;
    margin-bottom: 20pt;
  }

  .chapno { font-size: 48pt; }
  .masthead h1 { font-size: 24pt; }
  .eyebrow, .chapno em, .figure-num, .table-num, .card-num,
  .pagenav .dir, .summary li::before, .outcomes li::before { color: #000; }

  .content h3::before {
    background: #000;
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  a { color: #000; text-decoration: underline; }

  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 8pt;
    color: #666;
  }

  .note, .content .note {
    float: none;
    width: auto;
    margin: 12pt 0;
    border-left: 1pt solid #000;
  }

  .keyterm-word {
    background: #fff;
    color: #000;
    border-bottom: 1pt solid #000;
  }

  .keyterm-label, .keyterm-term { color: #000; }

  mark.yellow, .mark-yellow,
  mark.red, .mark-red {
    background: transparent;
    color: #000;
    border-bottom: 1.5pt solid #000;
    font-weight: 600;
  }

  .bp {
    background: #fff;
    border-top: 2pt solid #000;
    padding: 12pt 0 0;
  }

  .bp h2, .bp li, .bp strong, .bp p, .bp a { color: #000; }
  .bp li { border-bottom-color: #ccc; }
  .bp li:first-child { border-top-color: #999; }
  .bp li::before { color: #000; }

  .card-term { color: #000; }
  .card { border-bottom-color: #ccc; }

  .table-wrap { overflow: visible; }

  .table thead th {
    background: #fff;
    color: #000;
    border-top: 2pt solid #000;
    border-bottom: 1pt solid #000;
  }

  h2.sec, .content h2 { border-top-color: #000; }

  h2.sec, .content h2,
  .content h3, .content h4 {
    page-break-after: avoid;
    break-after: avoid;
  }

  .figure, .table, .keyterm, .tier, .card, .summary li {
    page-break-inside: avoid;
    break-inside: avoid;
  }
}