:root {
  --ink:            #0D0D0C;
  --paper:          #EFEDE4;
  --yellow:         #FFFF00;
  --border:         #2a2925;
  --border-inner:   #1c1b18;
  --text-secondary: #8a8880;
  --text-tertiary:  #6f6d66;
  --text-body:      #c9c6bd;
  --pending:        #4a4844;

  --type-hero:    clamp(72px, 12vw, 148px);
  --type-product: clamp(48px, 8vw, 72px);
  --type-body:    17px;
  --type-small:   15px;
  --type-label:   11px;
  --type-micro:   10px;

  --section-pad-v: 100px;
  --section-pad-h: 120px;
}

/*
  KILL DULL MOTION PRINCIPLE — CONSTITUTIONAL
  No two interface elements animate simultaneously.
  Motion is sequential, deliberate, procedural.
  The site processes. It does not decorate.
*/

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: auto; }

body {
  background: var(--ink);
  color: var(--paper);
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* { border-radius: 0 !important; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--yellow); }
a:focus-visible { outline: 2px solid var(--yellow); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .terminal, .hero-line { animation: none; }
}

/* TERMINAL MARK */
@keyframes kd-terminal-rotate {
  0%   { transform: rotate(0deg); }
  8%   { transform: rotate(90deg); }
  100% { transform: rotate(90deg); }
}

.terminal {
  display: inline-block;
  width: 0.72em;
  height: 0.72em;
  background: var(--yellow);
  margin-left: 0.08em;
  vertical-align: baseline;
  flex-shrink: 0;
  animation: kd-terminal-rotate 7s ease-in-out infinite;
}

.footer .terminal {
  animation-delay: 3.5s;
}

/* CTA SQUARE MARKER */
.sq {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--yellow);
  flex-shrink: 0;
}

/* TRADEMARK MARK */
.tm {
  font-size: 0.45em;
  vertical-align: super;
  line-height: 0;
  letter-spacing: 0.02em;
  margin-left: 0.05em;
  color: var(--paper);
}

/* MASTHEAD */
.masthead {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 200;
  background: var(--ink);
  border-bottom: 1px solid var(--border);
}

/* TOP ROW */
.masthead-top {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: baseline;
  padding: 20px 120px 0;
  gap: 24px;
}

.masthead-date {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.16em;
  color: var(--text-secondary);
  text-transform: uppercase;
  line-height: 1;
}

.masthead-wordmark {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 54px;
  letter-spacing: -0.03em;
  line-height: 1;
  color: var(--paper);
  text-align: center;
  white-space: nowrap;
}

.masthead-designation {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.10em;
  color: var(--paper);
  text-align: right;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}
.masthead-designation .tm {
  font-size: 0.85em;
  vertical-align: top;
  line-height: 1;
  color: var(--paper);
  margin-left: 0.06em;
}

/* SECOND ROW */
.masthead-tagline {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 400;
  font-size: 12px;
  color: var(--text-secondary);
  text-align: center;
  padding: 6px 120px 16px;
  letter-spacing: 0;
}

/* BORDER */
.masthead-rule {
  border-top: 1px solid var(--border);
}

/* BUREAU BULLETIN */
.masthead-bulletin {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 120px;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

.bulletin-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-secondary);
}

.bulletin-text {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 12px;
  font-weight: 400;
  color: var(--text-body);
  letter-spacing: 0;
}

/* UNIFIED NAV */
.unified-nav {
  position: fixed;
  left: 0; right: 0;
  z-index: 190;
  background: var(--ink);
  border-bottom: 1px solid var(--border);
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  padding: 0 120px;
}

.unified-nav-chapters {
  display: flex;
  align-items: stretch;
  margin-left: 0;
}

.reg-item {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 11px 16px 9px;
  border-right: 1px solid var(--border);
  color: #8a8880;
  white-space: nowrap;
  transition: color 0.15s,
              padding-top 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              padding-bottom 0.8s cubic-bezier(0.16, 1, 0.3, 1),
              opacity 0.6s ease;
}
.reg-item:first-child { border-left: none; }
.reg-item.is-past { color: #6f6d66; padding-top: 6px; padding-bottom: 6px; opacity: 0.6; }
.reg-item.is-active { color: var(--paper); border-bottom: 2px solid var(--yellow); opacity: 1; }

.unified-nav-products {
  display: flex;
  align-items: center;
  gap: 0;
  border-left: 1px solid var(--border);
  margin-right: 0;
}

.product-link {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--paper);
  text-decoration: none;
  padding: 11px 20px 9px;
  border-right: 1px solid var(--border);
  white-space: nowrap;
}
.product-link:hover { color: var(--yellow); }

.product-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--yellow);
  text-decoration: none;
  padding: 11px 24px 9px;
  white-space: nowrap;
}
.product-cta .enter-arrow {
  display: inline-block;
  transition: transform 0.15s cubic-bezier(0.16, 1, 0.3, 1);
}
.product-cta .enter-text {
  display: inline-block;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1) 0.05s;
}
.product-cta:hover .enter-arrow { transform: translateX(4px); }
.product-cta:hover .enter-text { transform: translateX(2px); }
.product-cta:hover { color: var(--paper); }

.registrar-mobile { display: none; }

@media (max-width: 767px) {
  .unified-nav-chapters { display: none; }
  .unified-nav-products { display: none; }
  .registrar-mobile { display: flex; flex: 1; }
  .reg-mobile-current {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 12px 24px;
    background: transparent;
    border: none;
    font-family: 'IBM Plex Mono', monospace;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--paper);
    cursor: pointer;
  }
  .reg-mobile-arrow { color: var(--yellow); }
  .reg-mobile-dropdown {
    background: var(--ink);
    border-top: 1px solid var(--border);
  }
  .reg-mobile-dropdown .reg-item {
    display: block;
    padding: 12px 24px;
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
  .reg-mobile-dropdown .reg-item:first-child { border-left: none; }
}

/* VIEWPORTS */
.viewport {
  min-height: 100vh;
  padding: 90px var(--section-pad-h) 90px;
  display: flex;
  flex-direction: column;
}
.viewport + .viewport {
  padding-top: 90px;
  border-top: 1px solid var(--border);
}

/* RUNNING HEAD */
.running-head {
  display: flex;
  justify-content: space-between;
  font-family: 'IBM Plex Mono', monospace;
  font-size: var(--type-label);
  letter-spacing: 0.16em;
  color: var(--text-secondary);
  border-top: 1px solid var(--border);
  padding-top: 18px;
  margin-bottom: 56px;
  text-transform: uppercase;
}

/* HERO HEADLINE (fitToWidth) */
.hero-headline {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: var(--type-hero);
  letter-spacing: -0.05em;
  line-height: 0.88;
  white-space: nowrap;
  color: var(--paper);
  margin-bottom: 52px;
}

/* HERO LINE (two-line fitToWidth, VP1) */
@keyframes kd-reveal {
  from { transform: translateY(110%); }
  to   { transform: translateY(0); }
}

.hero-line-wrap {
  overflow: hidden;
  display: block;
  margin-bottom: 4px;
}

.hero-line {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  letter-spacing: -0.05em;
  line-height: 0.88;
  white-space: normal;
  color: var(--paper);
  display: block;
  animation: kd-reveal 0.4s cubic-bezier(0.16, 1, 0.3, 1) both;
}

#hero-line-1 { animation-delay: 0.1s; }
#hero-line-2 { animation-delay: 0.25s; }

/* HERO BODY */
.hero-body {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 560px;
  font-size: var(--type-body);
  line-height: 1.8;
  color: var(--text-body);
}
.hero-body .text-secondary { color: var(--text-secondary); }

/* INLINE LINK */
.inline-link {
  color: inherit;
  text-decoration: underline;
  text-decoration-color: var(--yellow);
  text-underline-offset: 3px;
}
.inline-link:hover { color: var(--yellow); }

/* PUSH */
.push { margin-top: auto; }
.standalone-word.push { margin-top: auto; padding-top: 80px; }
#conviction .push { margin-top: 80px; }
#observation.viewport,
#evidence.viewport,
#conviction.viewport,
#decision.viewport,
#access.viewport,
#bureau.viewport {
  min-height: auto;
  padding-bottom: 180px;
}

/* STANDALONE WORD */
.standalone-word {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: 1;
}
.standalone-word--yellow { color: var(--yellow); }
.standalone-word--paper  { color: var(--paper); }

/* SECTION INDEX */
.section-index {
  font-family: 'IBM Plex Mono', monospace;
  font-size: var(--type-label);
  letter-spacing: 0.14em;
  color: var(--text-tertiary);
  margin-bottom: 16px;
}

/* EVIDENCE GRID (VP2) */
.evidence-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-left: 1px solid var(--border);
  border-top: 1px solid var(--border);
  margin-top: 80px;
  margin-bottom: 56px;
}
.evidence-col {
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 40px;
}
.evidence-concept {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(28px, 4vw, 48px);
  letter-spacing: -0.03em;
  line-height: 1.0;
  color: var(--paper);
  margin-bottom: 24px;
}
.evidence-divider { border: none; border-top: 1px solid var(--border); margin-bottom: 20px; }
.evidence-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  color: var(--text-body);
  line-height: 1.5;
}
.evidence-list li { display: flex; align-items: center; }
.evidence-list li::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  background: var(--yellow);
  margin-right: 10px;
  flex-shrink: 0;
}
.evidence-statement {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(28px, 4vw, 48px);
  letter-spacing: -0.03em;
  color: var(--paper);
  margin-bottom: 28px;
  line-height: 1.0;
}
.evidence-intro {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  letter-spacing: -0.05em;
  line-height: 0.88;
  color: var(--paper);
  margin-bottom: 56px;
  text-transform: uppercase;
  white-space: nowrap;
}
.evidence-body {
  font-family: 'Space Grotesk', sans-serif;
  font-size: var(--type-body);
  line-height: 1.7;
  color: var(--text-body);
  max-width: 560px;
}

/* READING (VP4) */
.reading-headline {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(40px, 6vw, 80px);
  letter-spacing: -0.04em;
  line-height: 0.95;
  color: var(--paper);
  margin-bottom: 48px;
}

#discipline-hl {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  letter-spacing: -0.05em;
  line-height: 0.88;
  white-space: nowrap;
  color: var(--paper);
  display: block;
  margin-bottom: 48px;
}
.reading-body {
  max-width: 560px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  font-size: var(--type-body);
  line-height: 1.8;
  color: var(--text-body);
  margin-bottom: 48px;
}
.reading-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  color: var(--text-secondary);
  text-transform: uppercase;
}

/* DISCIPLINE LIST (VP5) */
.discipline-list {
  margin-top: 64px;
  border-top: 1px solid var(--border);
}
.discipline-item {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 0;
  border-bottom: 1px solid var(--border);
  padding: 48px 0;
}
.discipline-meta {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-right: 40px;
}
.discipline-number {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--text-tertiary);
}
.discipline-status {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--text-secondary);
}
.discipline-status--pending { color: var(--yellow); }
.discipline-name {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(24px, 3vw, 40px);
  letter-spacing: -0.02em;
  color: var(--paper);
  margin-bottom: 16px;
  line-height: 1.0;
}
.discipline-desc {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  color: var(--text-body);
  line-height: 1.7;
  max-width: 560px;
}
.discipline-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 28px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--paper);
  text-decoration: none;
  border-top: 1px solid var(--border);
  padding-top: 16px;
}
.discipline-cta:hover { color: var(--yellow); }

/* EARLY ACCESS (VP6) */
.access-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 40px;
}
.access-statement {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 28px;
  color: var(--text-secondary);
  line-height: 1.2;
}
.access-desc {
  font-family: 'Space Grotesk', sans-serif;
  max-width: 480px;
  font-size: var(--type-small);
  line-height: 1.7;
  color: var(--text-body);
}

/* CHAPTER HEADLINE */
.chapter-headline {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(36px, 6vw, 80px);
  letter-spacing: -0.04em;
  line-height: 0.9;
  color: var(--paper);
  margin-bottom: 0;
}

/* BUREAU HEADLINE */
#bureau-hl {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  letter-spacing: -0.05em;
  line-height: 0.88;
  white-space: nowrap;
  color: var(--paper);
  text-transform: uppercase;
  display: block;
  margin-bottom: 32px;
}

/* BUREAU MISSION */
.bureau-mission {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 400;
  font-size: clamp(16px, 2vw, 22px);
  letter-spacing: -0.01em;
  line-height: 1.4;
  color: var(--text-body);
  margin-top: 32px;
  margin-bottom: 48px;
  max-width: 560px;
}

/* BUREAU BODY */
.bureau-body {
  max-width: 560px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  font-size: var(--type-small);
  line-height: 1.9;
  color: var(--text-body);
}

/* BUREAU FRAMEWORK */
.bureau-framework {
  border-left: 2px solid var(--yellow);
  padding-left: 24px;
  margin: 40px 0;
}
.bureau-framework-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--text-secondary);
  text-transform: uppercase;
  margin-bottom: 12px;
}
.bureau-framework-intro {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  color: var(--text-secondary);
  margin-bottom: 16px;
}
.bureau-questions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px;
  color: var(--paper);
  line-height: 1.5;
}

/* FOOTER */
.footer {
  background: var(--paper);
  color: var(--ink);
  border-top: 1px solid #2a2925;
}

.footer-inner {
  padding: 80px 120px;
}

.footer-bureau {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(40px, 6vw, 80px);
  letter-spacing: -0.04em;
  line-height: 0.9;
  color: var(--ink);
  margin-bottom: 64px;
  border-top: 2px solid var(--ink);
  padding-top: 32px;
}

.footer-index {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid #2a2925;
  margin-bottom: 80px;
}

.footer-section {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 0;
  padding: 28px 0;
  border-bottom: 1px solid #2a2925;
  align-items: baseline;
}

.footer-section-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.16em;
  color: #6f6d66;
  text-transform: uppercase;
  padding-right: 40px;
}

.footer-section nav {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-wrap: nowrap;
}

.footer-section nav a {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: var(--ink);
  text-decoration: none;
  line-height: 1;
  display: block;
}

.footer-section nav a:hover {
  color: #555;
}

.footer-section nav a:focus-visible {
  outline: 2px solid var(--yellow);
  outline-offset: 3px;
}

.footer .tm {
  font-size: 1.2em;
  color: #6f6d66;
  vertical-align: top;
  line-height: 1;
  position: relative;
  top: 6px;
}

.footer-colophon {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.08em;
  color: #6f6d66;
}

/* INSTITUTIONAL PAGES */
.inst-section {
  padding: 90px 120px 180px;
  max-width: 1400px;
}

.inst-headline {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(40px, 6vw, 80px);
  letter-spacing: -0.04em;
  line-height: 0.9;
  color: var(--paper);
  margin-bottom: 48px;
  margin-top: 24px;
}

.inst-body {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 17px;
  font-weight: 400;
  color: var(--text-body);
  line-height: 1.8;
  max-width: 640px;
}

.inst-body p { margin-bottom: 24px; }
.inst-body p:last-child { margin-bottom: 0; }

/* TABLET */
@media (max-width: 1279px) {
  :root { --section-pad-v: 64px; --section-pad-h: 64px; }
  .masthead-top { padding: 16px 64px 0; }
  .masthead-tagline { padding: 6px 64px 14px; }
  .masthead-bulletin { padding: 10px 64px; }
  .masthead-wordmark { font-size: 45px; }
  .unified-nav { padding: 0 64px; }
  .evidence-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1279px) {
  .footer-inner { padding: 64px; }
}

/* MOBILE */
/* Below 1000px the three-column masthead cannot fit its own content: the
   date and the designation are nowrap and the wordmark is fixed, so the row
   pushes past the viewport and the whole page scrolls sideways. Stack it,
   the way the phone layout already does. The desktop CTA has no room beside
   the chapters at these widths either; the Bench stays reachable from the
   nav itself. */
@media (max-width: 1000px) {
  .masthead-top { grid-template-columns: 1fr; text-align: center; gap: 8px; }
  .masthead-date, .masthead-designation { text-align: center; }
  .unified-nav-products { display: none; }
}

@media (max-width: 767px) {
  :root { --section-pad-v: 48px; --section-pad-h: 24px; }
  .masthead-top {
    grid-template-columns: 1fr;
    text-align: center;
    padding: 16px 24px 0;
    gap: 8px;
  }
  .masthead-date { text-align: center; }
  .masthead-designation { text-align: center; font-size: 11px; }
  .masthead-wordmark { font-size: 36px; }
  .masthead-tagline { padding: 6px 24px 12px; }
  .masthead-bulletin { padding: 10px 24px; }
  .unified-nav { padding: 0; }
  .evidence-grid { grid-template-columns: 1fr; }
  .discipline-item { grid-template-columns: 1fr; gap: 16px; }
  .discipline-meta { flex-direction: row; padding-right: 0; }
}

@media (max-width: 767px) {
  .footer-inner { padding: 48px 24px; }
  .footer-section { grid-template-columns: 1fr; gap: 12px; }
  .footer-section-label { padding-right: 0; }
  .footer-colophon { flex-direction: column; gap: 8px; }
}

/* =========================================================================
   V1 ADDITIONS — 2026
   New components for: public examples, Dense Idea examples, Published
   Readings, The Bench, Independent Interrogation, the close.
   Built from the existing grammar: hairline borders, mono labels,
   disciplined yellow, no radius, sequential motion only.
   ========================================================================= */

/* SUBHEAD — sits under a hero line, above body */
.kd-subhead {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(24px, 3vw, 40px);
  letter-spacing: -0.03em;
  line-height: 1.05;
  color: var(--paper);
  margin-bottom: 32px;
}

/* LEDE — one paragraph of consequence */
.kd-lede {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: -0.01em;
  color: var(--paper);
  max-width: 720px;
  margin-bottom: 40px;
}

/* EXAMPLE TABLE — public examples and Dense Idea examples share one grammar */
.kd-examples {
  border-top: 1px solid var(--border);
  margin-top: 64px;
}

.kd-example {
  display: grid;
  grid-template-columns: 200px 1fr auto;
  gap: 0 40px;
  align-items: start;
  border-bottom: 1px solid var(--border);
  padding: 40px 0;
}

.kd-example-org {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(20px, 2.4vw, 28px);
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--paper);
}

.kd-example-idea {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(20px, 2.4vw, 28px);
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: var(--paper);
  margin-bottom: 12px;
}

.kd-example-note {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-body);
  max-width: 560px;
}

/* VERDICT — DUH / HMM / DULL. Only ever applied to a completed Reading. */
.kd-verdict {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: 0.02em;
  line-height: 1;
  padding: 8px 12px;
  border: 1px solid var(--border);
  color: var(--text-secondary);
  white-space: nowrap;
  align-self: start;
}
.kd-verdict--duh  { color: var(--ink); background: var(--yellow); border-color: var(--yellow); }
.kd-verdict--hmm  { color: var(--paper); border-color: var(--paper); }
.kd-verdict--dull { color: var(--text-tertiary); border-color: var(--border); }

/* STATEMENT — a line that closes an argument */
.kd-statement {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(24px, 3.2vw, 44px);
  letter-spacing: -0.03em;
  line-height: 1.05;
  color: var(--paper);
  max-width: 900px;
  margin-top: 56px;
}
.kd-statement--yellow { color: var(--yellow); }

/* TWO-COLUMN PRINCIPLE SPLIT — Big Data / Gut Data reuses .evidence-grid */

/* PROCESS LIST — what happens on the Bench */
.kd-process {
  border-top: 1px solid var(--border);
  margin-top: 56px;
}
.kd-process-step {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 0 40px;
  border-bottom: 1px solid var(--border);
  padding: 32px 0;
  align-items: baseline;
}
.kd-process-num {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
  color: var(--text-tertiary);
  text-transform: uppercase;
}
.kd-process-text {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(18px, 2.2vw, 26px);
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: var(--paper);
}
.kd-process-note {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 400;
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-body);
  margin-top: 10px;
  max-width: 560px;
}

/* STATUS NOTE — restrained. Never "coming soon", never "available now". */
.kd-status {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-secondary);
  border-top: 1px solid var(--border);
  padding-top: 16px;
  margin-top: 56px;
  max-width: 560px;
  line-height: 1.7;
}

/* GATEWAY — a compact door to a deeper page */
.kd-gateways {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-left: 1px solid var(--border);
  border-top: 1px solid var(--border);
  margin-top: 72px;
}
.kd-gateway {
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-decoration: none;
}
.kd-gateway:hover { background: #131311; color: inherit; }
.kd-gateway-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-tertiary);
}
.kd-gateway-name {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(20px, 2.4vw, 28px);
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--paper);
}
.kd-gateway-desc {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  line-height: 1.7;
  color: var(--text-body);
}
.kd-gateway-arrow {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--yellow);
  margin-top: auto;
  padding-top: 20px;
}

/* PRIMARY CALL — the commercial door */
.kd-call {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--ink);
  background: var(--yellow);
  padding: 18px 28px;
  text-decoration: none;
  margin-top: 40px;
}
.kd-call:hover { color: var(--ink); background: var(--paper); }

.kd-call-secondary {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--paper);
  text-decoration: none;
  border-bottom: 1px solid var(--border);
  padding: 0 0 6px;
  margin-top: 28px;
}
.kd-call-secondary:hover { color: var(--yellow); border-bottom-color: var(--yellow); }

.kd-calls { display: flex; flex-direction: column; align-items: flex-start; }

/* CLOSE — the last viewport */
.kd-close-list {
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(18px, 2.2vw, 24px);
  font-weight: 400;
  line-height: 1.7;
  color: var(--text-body);
  margin: 32px 0 8px;
}

/* COLLECTION NOTE — explained only where useful, never a front door */
.kd-aside {
  border-left: 2px solid var(--border);
  padding-left: 24px;
  margin: 56px 0 0;
  max-width: 560px;
}
.kd-aside-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--text-tertiary);
  margin-bottom: 12px;
}
.kd-aside-body {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  line-height: 1.8;
  color: var(--text-body);
}

/* CONTACT — privacy-conscious, no intake system */
.kd-contact {
  border-top: 1px solid var(--border);
  padding-top: 32px;
  margin-top: 56px;
  max-width: 640px;
}
.kd-contact-address {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  font-size: clamp(20px, 2.6vw, 32px);
  letter-spacing: -0.02em;
  color: var(--paper);
}
.kd-contact-address a { border-bottom: 1px solid var(--yellow); }
.kd-contact-address a:hover { color: var(--yellow); }
.kd-contact-note {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 15px;
  line-height: 1.8;
  color: var(--text-secondary);
  margin-top: 20px;
}

/* TABLET */
@media (max-width: 1279px) {
  .kd-gateways { grid-template-columns: 1fr; }
}

/* MOBILE */
@media (max-width: 767px) {
  .kd-example { grid-template-columns: 1fr; gap: 12px; padding: 32px 0; }
  .kd-process-step { grid-template-columns: 1fr; gap: 10px; }
  .kd-gateway { padding: 24px; }
  .kd-call { width: 100%; justify-content: space-between; }
}

/* Wordmark is a link home; it must not change colour on hover. */
.masthead-wordmark a { color: var(--paper); text-decoration: none; }
.masthead-wordmark a:hover { color: var(--paper); }

/* Inner pages: the left rail carries destinations, not chapters. */
.reg-item.is-current { color: var(--paper); border-bottom: 2px solid var(--yellow); }
