/* ==========================================================================
   Trusting God and Trusting Science
   Single stylesheet. Plain CSS. No build step, no framework, no third party.
   Register: restrained editorial (ref: Ammodo, Augustinus Fonden).
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Fonts

   Fraunces (display) and Source Serif 4 (body) are self-hosted as woff2 in
   /fonts, from their open-source releases (SIL Open Font License; the OFL text
   ships beside the fonts). Both are variable, so one file per style covers the
   whole weight range. No font CDN, no network request. The system
   editorial-serif stack in --font-display / --font-body stays as the fallback.
   -------------------------------------------------------------------------- */

@font-face {
  font-family: "Fraunces";
  src: url("fonts/fraunces-normal.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fraunces";
  src: url("fonts/fraunces-italic.woff2") format("woff2");
  font-weight: 300 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("fonts/source-serif-4-normal.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Source Serif 4";
  src: url("fonts/source-serif-4-italic.woff2") format("woff2");
  font-weight: 300 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Public Sans";
  src: url("fonts/public-sans-normal.woff2") format("woff2");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

/* --------------------------------------------------------------------------
   2. Design tokens
   -------------------------------------------------------------------------- */

:root {
  /* Color. One accent, swappable on the next line. */
  --accent: #294a6a;            /* ink blue. Swap this single value to retheme. */
  --accent-deep: #1d3750;       /* hover / pressed */

  --gilt: #a68a53;              /* antique gold, used only in the ribbon */
  --paper: #f6f3ec;             /* off-white paper */
  --paper-panel: #efeade;       /* slightly deeper panel */
  --ink: #1a1a1a;               /* near-black text */
  --ink-soft: #4c4842;          /* secondary text */
  --ink-faint: #676257;         /* captions, meta */
  --rule: #ded7c8;              /* hairlines */
  --rule-strong: #c9c1b0;

  /* Discipline palette: muted, harmonized, each AA on paper and panel */
  --disc-psy: #2f5f7a;          /* psychology */
  --disc-theo: #8a4636;         /* theology */
  --disc-rs: #3f5c48;           /* religious studies */
  --disc-phil: #5a4a72;         /* philosophy */
  --disc-inter: #6b6250;        /* interdisciplinary */

  /* Type. Fraunces / Source Serif 4 take over once the woff2 files are added. */
  --font-display: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino,
                  "Book Antiqua", Georgia, Cambria, serif;
  --font-body: "Source Serif 4", Charter, "Bitstream Charter", "Iowan Old Style",
               Georgia, Cambria, "Times New Roman", serif;
  --font-ui: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  /* Measure and rhythm */
  --measure: 40rem;             /* ~66ch prose column */
  --measure-wide: 66rem;        /* tables, wide sections */
  --gap: 1.5rem;
  --step: 1.55;                 /* line height for body */

  /* Fluid type scale */
  --fs-hero: clamp(2.3rem, 1.35rem + 4vw, 4.25rem);
  --fs-h1: clamp(1.9rem, 1.3rem + 2.4vw, 3rem);
  --fs-h2: clamp(1.4rem, 1.1rem + 1.2vw, 1.9rem);
  --fs-h3: clamp(1.15rem, 1rem + 0.5vw, 1.35rem);
  --fs-lead: clamp(1.1rem, 1rem + 0.4vw, 1.28rem);
  --fs-body: 1.075rem;
  --fs-small: 0.92rem;
}

/* --------------------------------------------------------------------------
   3. Reset and base
   -------------------------------------------------------------------------- */

@view-transition { navigation: auto; }

::selection { background: color-mix(in srgb, var(--accent) 18%, transparent); }

*, *::before, *::after { box-sizing: border-box; }

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

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

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: var(--fs-body);
  line-height: var(--step);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  font-kerning: normal;
  font-variant-numeric: oldstyle-nums;
  font-optical-sizing: auto;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 600;
  line-height: 1.14;
  letter-spacing: -0.01em;
  color: var(--ink);
  margin: 0 0 0.5em;
  text-wrap: balance;
}

p { margin: 0 0 1.1em; }

a {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  text-decoration-color: color-mix(in srgb, var(--accent) 45%, transparent);
  transition: color 0.15s ease, text-decoration-color 0.15s ease;
}
a:hover { color: var(--accent-deep); text-decoration-color: currentColor; }

strong { font-weight: 600; }
em { font-style: italic; }

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

hr {
  border: 0;
  border-top: 1px solid var(--rule);
  margin: 2.5rem 0;
}

/* Visible focus for every interactive element */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
.door:focus-visible {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
  border-radius: 2px;
}

/* Skip link */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  background: var(--accent);
  color: #fff;
  padding: 0.6rem 1rem;
  z-index: 100;
  text-decoration: none;
}
.skip-link:focus { left: 0.5rem; top: 0.5rem; }

/* --------------------------------------------------------------------------
   4. Layout helpers
   -------------------------------------------------------------------------- */

.wrap {
  width: 100%;
  max-width: var(--measure-wide);
  margin-inline: auto;
  padding-inline: clamp(1.1rem, 4vw, 3rem);
}

.prose { max-width: var(--measure); }
.prose p, .prose li { color: var(--ink); }
.prose h2 { margin-top: 2.4rem; }
.prose h3 { margin-top: 1.8rem; }
.prose h2::before {
  content: "";
  display: block;
  width: 2.6rem;
  height: 2px;
  background: var(--accent);
  margin-bottom: 0.7rem;
}

.dropcap::first-letter {
  font-family: var(--font-display);
  font-size: 3.1em;
  font-weight: 500;
  float: left;
  line-height: 0.82;
  padding: 0.04em 0.12em 0 0;
  color: var(--accent-deep);
}

.lead {
  font-size: var(--fs-lead);
  color: var(--ink-soft);
  line-height: 1.5;
  max-width: var(--measure);
}

.section { padding-block: clamp(2.5rem, 6vw, 4.5rem); }
.section--tight { padding-block: clamp(1.8rem, 4vw, 3rem); }
.section + .section { border-top: 1px solid var(--rule); }

.eyebrow {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin: 0 0 0.9rem;
}

.center { text-align: center; }

/* --------------------------------------------------------------------------
   4b. Ribbon: a thin static gradient band across the top of every page.
   CSS only, no motion. Colors stay inside the site palette plus --gilt.
   -------------------------------------------------------------------------- */

.ribbon {
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--accent-deep),
    var(--accent),
    #6e87a3,
    var(--gilt),
    var(--accent),
    var(--accent-deep)
  );
}

/* --------------------------------------------------------------------------
   5. Header and navigation (CSS-only collapse via checkbox)
   -------------------------------------------------------------------------- */

.site-header {
  border-bottom: 1px solid var(--rule);
  background: var(--paper);
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-block: 0.9rem;
}
.brand {
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--ink);
  text-decoration: none;
  line-height: 1.2;
  white-space: nowrap;
}
.brand:hover { color: var(--accent-deep); }

.nav-toggle { position: absolute; opacity: 0; pointer-events: none; }
.nav-toggle-label {
  display: none;
  font-family: var(--font-body);
  font-size: var(--fs-small);
  font-weight: 600;
  letter-spacing: 0.03em;
  padding: 0.45rem 0.7rem;
  border: 1px solid var(--rule-strong);
  border-radius: 4px;
  cursor: pointer;
  color: var(--ink);
  user-select: none;
}
.nav-toggle-label:hover { border-color: var(--accent); color: var(--accent); }
.nav-toggle:focus-visible + .nav-toggle-label {
  outline: 3px solid var(--accent);
  outline-offset: 3px;
}

.site-nav ul {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.2rem 0.9rem;
  margin: 0;
  padding: 0;
}
.site-nav a {
  font-family: var(--font-body);
  font-size: 0.92rem;
  color: var(--ink-soft);
  text-decoration: none;
  padding: 0.3rem 0.1rem;
  border-bottom: 2px solid transparent;
  white-space: nowrap;
}
.site-nav a:hover { color: var(--accent); }
.site-nav a[aria-current="page"] {
  color: var(--ink);
  border-bottom-color: var(--accent);
}

@media (max-width: 1024px) {
  .site-header__inner { flex-wrap: wrap; }
  .nav-toggle-label { display: inline-block; }
  .site-nav {
    flex-basis: 100%;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.25s ease;
  }
  .nav-toggle:checked ~ .site-nav { max-height: 26rem; }
  .site-nav ul {
    flex-direction: column;
    gap: 0;
    padding-block: 0.4rem 0.8rem;
  }
  .site-nav li { border-top: 1px solid var(--rule); }
  .site-nav a { display: block; padding: 0.7rem 0.2rem; font-size: 1.05rem; }
  .site-nav a[aria-current="page"] { border-bottom-color: transparent; color: var(--accent); }
}

/* --------------------------------------------------------------------------
   6. Hero
   -------------------------------------------------------------------------- */

.hero {
  padding-block: clamp(2rem, 4.5vw, 3.6rem) clamp(1.3rem, 3vw, 2rem);
  position: relative;
  overflow: hidden;
}
.hero > :not(.wash) { position: relative; z-index: 1; }

/* Hero wash: large blurred color fields orbiting slowly behind the headline,
   anchored top right. CSS only; the global reduced-motion rule freezes it. */
.wash {
  position: absolute;
  top: -22%;
  right: -14%;
  width: 78%;
  height: 140%;
  pointer-events: none;
}
.wash i {
  position: absolute;
  display: block;
  aspect-ratio: 1;
  border-radius: 50%;
  filter: blur(clamp(42px, 6vw, 88px));
}
.wash__a {
  width: 58%;
  right: -4%;
  top: -10%;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--accent) 58%, transparent), transparent 72%);
  transform-origin: 28% 72%;
  animation: wash-orbit 46s linear infinite;
}
.wash__b {
  width: 50%;
  right: 24%;
  top: 8%;
  background: radial-gradient(closest-side, color-mix(in srgb, var(--gilt) 62%, transparent), transparent 72%);
  transform-origin: 70% 30%;
  animation: wash-orbit 64s linear infinite reverse;
}
.wash__c {
  width: 42%;
  right: 6%;
  top: 34%;
  background: radial-gradient(closest-side, color-mix(in srgb, #6e87a3 55%, transparent), transparent 72%);
  transform-origin: 40% 20%;
  animation: wash-orbit 82s linear infinite;
}
@keyframes wash-orbit {
  to { transform: rotate(360deg); }
}
@media (max-width: 760px) {
  .wash { width: 120%; right: -35%; top: -12%; }
}
.hero__title {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 1.4rem;
}
.hero__finding {
  font-size: var(--fs-hero);
  font-weight: 600;
  line-height: 1.04;
  letter-spacing: -0.025em;
  max-width: 20ch;
  margin: 0;
}
.hero__finding .soft { color: var(--ink-soft); font-style: italic; }

/* --------------------------------------------------------------------------
   7. Doors (three routes)
   -------------------------------------------------------------------------- */

.doors {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.1rem;
}
.door {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--rule-strong);
  border-top: 3px solid var(--accent);
  border-radius: 3px 3px 6px 6px;
  padding: 1.35rem 1.4rem 1.35rem;
  background: var(--paper);
  text-decoration: none;
  color: var(--ink);
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.door:hover {
  border-color: var(--accent);
  background: var(--paper-panel);
  box-shadow: 0 2px 0 0 var(--accent) inset;
}
.door__who {
  align-self: flex-start;
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 12%, transparent);
  padding: 0.28rem 0.62rem;
  border-radius: 999px;
  margin: 0 0 0.9rem;
}
.door__line {
  font-family: var(--font-display);
  font-size: var(--fs-h3);
  line-height: 1.25;
  margin: 0 0 1.1rem;
}
.door__cta {
  margin-top: auto;
  font-family: var(--font-body);
  font-weight: 600;
  color: var(--accent);
}
.door__cta::after { content: " \2192"; }

@media (max-width: 760px) {
  .doors { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   8. Stats strip (quiet, not dashboard)
   -------------------------------------------------------------------------- */

.stats {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1rem 1.4rem;
  border-top: 1px solid var(--rule);
  padding-top: 1.9rem;
}
.stat { padding-left: 1.2rem; border-left: 1px solid var(--rule-strong); }
.stat:first-child { padding-left: 0; border-left: 0; }
.stat__num {
  font-family: var(--font-display);
  font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.4rem);
  font-weight: 600;
  line-height: 1;
  color: var(--ink);
  font-variant-numeric: lining-nums tabular-nums;
}
.stat__label {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.86rem;
  color: var(--ink-faint);
  line-height: 1.3;
}
@media (max-width: 720px) {
  .stats { grid-template-columns: repeat(3, 1fr); }
  .stat { padding-left: 0; border-left: 0; }
}
@media (max-width: 380px) {
  .stats { grid-template-columns: repeat(2, 1fr); }
}

/* --------------------------------------------------------------------------
   9. Findings (What We Learned)
   -------------------------------------------------------------------------- */

.findings { counter-reset: finding; }

.finding {
  position: relative;
  counter-increment: finding;
  max-width: var(--measure);
  padding-block: 2rem;
}
.finding::before {
  content: counter(finding, decimal-leading-zero) / "";
  position: absolute;
  top: 1.2rem;
  right: 0;
  font-family: var(--font-display);
  font-size: clamp(3.6rem, 2.4rem + 4vw, 6rem);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.03em;
  color: color-mix(in srgb, var(--accent) 13%, transparent);
  pointer-events: none;
}
@media (min-width: 1180px) {
  .finding::before { right: -11rem; }
}
.finding + .finding { border-top: 1px solid var(--rule); }
.finding__index {
  font-family: var(--font-body);
  font-size: var(--fs-small);
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--accent);
  margin: 0 0 0.5rem;
}
.finding__plain {
  font-size: var(--fs-lead);
  color: var(--ink);
  font-style: italic;
  margin: 0 0 1rem;
}
.finding__sources {
  font-size: var(--fs-small);
  color: var(--ink-faint);
  margin-top: 0.4rem;
}
.finding__sources::before {
  content: "Sources";
  display: block;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.76rem;
  color: var(--ink-faint);
  margin-bottom: 0.2rem;
}

.callout {
  max-width: var(--measure);
  background: var(--paper-panel);
  border-left: 3px solid var(--accent);
  border-radius: 0 6px 6px 0;
  padding: 1.6rem 1.6rem 1.4rem;
  margin-top: 2.4rem;
}
.callout h2 { margin-top: 0; }

/* --------------------------------------------------------------------------
   10. Questions index table + mobile cards
   -------------------------------------------------------------------------- */

.q-index {
  width: 100%;
  border-collapse: collapse;
  font-size: 1rem;
  margin-top: 1.4rem;
  font-variant-numeric: lining-nums tabular-nums;
}
.q-index caption { text-align: left; color: var(--ink-faint); font-size: var(--fs-small); margin-bottom: 0.6rem; }
.q-index th {
  text-align: left;
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--ink-faint);
  border-bottom: 2px solid var(--rule-strong);
  padding: 0.5rem 0.8rem 0.5rem 0;
}
.q-index td {
  border-bottom: 1px solid var(--rule);
  padding: 0.7rem 0.8rem 0.7rem 0;
  vertical-align: baseline;
}
.q-index tr:hover td { background: color-mix(in srgb, var(--paper-panel) 60%, transparent); }
.q-index .qid {
  font-family: var(--font-body);
  font-weight: 600;
  color: var(--accent);
  white-space: nowrap;
}
.q-index .qid a { text-decoration: none; }
.q-index .qid a:hover { text-decoration: underline; }
.q-index .qdisc { color: var(--ink-soft); white-space: nowrap; font-size: var(--fs-small); }
.q-index .qcol-id { width: 4.5rem; }
.q-index .qcol-disc { width: 12rem; }

.track-band {
  margin-top: 2.2rem;
  padding-top: 0.4rem;
}
.track-band th {
  padding-top: 1.4rem;
}

@media (max-width: 680px) {
  .q-index, .q-index caption, .q-index tbody, .q-index tr, .q-index td { display: block; }
  .q-index thead { position: absolute; left: -9999px; }
  .q-index caption { width: auto; margin-bottom: 1rem; }
  .q-index tbody { margin-bottom: 0.5rem; }
  /* grouped track headings turn 36 cards into a scannable, designed list */
  .q-index tbody::before {
    display: block;
    font-family: var(--font-ui); font-weight: 700;
    font-size: 0.8rem; letter-spacing: 0.06em; text-transform: uppercase;
    padding: 0.7rem 0 0.6rem; margin-top: 0.3rem;
    border-top: 1px solid var(--rule-strong);
  }
  .q-index tbody.tb-psy::before { content: "Psychology"; color: var(--disc-psy); }
  .q-index tbody.tb-theo::before { content: "Theology"; color: var(--disc-theo); }
  .q-index tbody.tb-rs::before { content: "Religious studies"; color: var(--disc-rs); }
  .q-index tbody.tb-phil::before { content: "Philosophy"; color: var(--disc-phil); }
  .q-index tbody.tb-inter::before { content: "Interdisciplinary"; color: var(--disc-inter); }
  .q-index tr {
    border: 1px solid var(--rule); border-radius: 6px;
    padding: 0.8rem 1rem; margin-bottom: 0.6rem; background: var(--paper);
  }
  .q-index tbody td:first-child { box-shadow: none; padding-left: 0; }
  .q-index td { border: 0; padding: 0.1rem 0; }
  .q-index .qid { font-size: 0.9rem; }
  .q-index .qtext { font-size: 1.05rem; margin: 0.1rem 0 0; }
  .q-index .qdisc { display: none; }
}

/* --------------------------------------------------------------------------
   11. Glossed question entries + tensions
   -------------------------------------------------------------------------- */

.gloss {
  max-width: var(--measure);
  padding-block: 1.3rem;
  scroll-margin-top: 5rem;
}
.gloss + .gloss { border-top: 1px solid var(--rule); }
.gloss__id {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-small);
  letter-spacing: 0.06em;
  color: var(--accent);
  margin: 0 0 0.3rem;
}
.gloss__q {
  font-size: var(--fs-h3);
  font-family: var(--font-display);
  line-height: 1.28;
  margin: 0 0 0.6rem;
}
.gloss__q .disc {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ink-faint);
  vertical-align: middle;
  margin-left: 0.5rem;
}
.gloss p { margin-bottom: 0; color: var(--ink-soft); }

.tension {
  max-width: var(--measure);
  padding-block: 1.8rem;
  scroll-margin-top: 5rem;
}
.tension + .tension { border-top: 1px solid var(--rule); }
.tension__id {
  font-family: var(--font-body);
  font-weight: 600;
  font-size: var(--fs-small);
  letter-spacing: 0.07em;
  color: var(--accent);
  margin: 0 0 0.3rem;
}

/* Back-to-index and jump links */
.jumplinks {
  max-width: var(--measure);
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.2rem;
  font-size: var(--fs-small);
  margin-top: 0.6rem;
}
.backlink {
  display: inline-block;
  margin-top: 1.2rem;
  font-size: var(--fs-small);
  font-weight: 600;
}
.backlink::before { content: "\2191 "; }

/* --------------------------------------------------------------------------
   12. Publication blocks and lists
   -------------------------------------------------------------------------- */

.pub {
  max-width: var(--measure);
  padding-block: 1.9rem;
}
.pub + .pub { border-top: 1px solid var(--rule); }
.pub__kind {
  font-family: var(--font-body);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin: 0 0 0.5rem;
}
.pub__title { font-size: var(--fs-h3); margin: 0 0 0.7rem; }
.pub__meta {
  font-size: var(--fs-small);
  color: var(--ink-faint);
  margin-top: 0.6rem;
}
.tag {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.74rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--accent);
  border: 1px solid color-mix(in srgb, var(--accent) 40%, var(--rule));
  border-radius: 999px;
  padding: 0.12rem 0.6rem;
  margin-left: 0.4rem;
  vertical-align: middle;
}
.tag--muted { color: var(--ink-faint); border-color: var(--rule-strong); }

/* People / participant lists */
.roster { max-width: var(--measure-wide); }
.roster__track { padding-block: 1.5rem; }
.roster__track + .roster__track { border-top: 1px solid var(--rule); }
.roster__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.4rem 0.9rem;
  margin-bottom: 0.9rem;
}
.roster__head h3 { margin: 0; }
.roster__meta { font-size: var(--fs-small); color: var(--ink-faint); }
.namegrid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.35rem 1.6rem;
}
.namegrid li { color: var(--ink); }
.namegrid .aff { color: var(--ink-faint); font-size: var(--fs-small); }
@media (max-width: 620px) { .namegrid { grid-template-columns: 1fr; } }

.factlist {
  max-width: var(--measure);
  list-style: none;
  margin: 0 0 1.4rem;
  padding: 0;
}
.factlist li {
  display: grid;
  grid-template-columns: 11rem 1fr;
  gap: 0.6rem 1.2rem;
  padding: 0.55rem 0;
  border-bottom: 1px solid var(--rule);
}
.factlist .k { color: var(--ink-faint); font-size: var(--fs-small); font-weight: 600; letter-spacing: 0.03em; }
@media (max-width: 560px) { .factlist li { grid-template-columns: 1fr; gap: 0.1rem; } }

.bio { max-width: var(--measure); padding-block: 1.2rem; }
.bio + .bio { border-top: 1px solid var(--rule); }
.bio h3 { margin-bottom: 0.15rem; }
.bio__role { font-size: var(--fs-small); color: var(--ink-faint); margin: 0 0 0.7rem; }

/* --------------------------------------------------------------------------
   13. Footer
   -------------------------------------------------------------------------- */

.site-footer {
  border-top: 1px solid var(--rule-strong);
  background: var(--paper-panel);
  margin-top: 3rem;
  padding-block: 2.4rem 2.8rem;
  font-size: var(--fs-small);
  color: var(--ink-soft);
}
.footer-mark {
  font-family: var(--font-display);
  font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.3rem);
  font-weight: 600;
  letter-spacing: -0.015em;
  color: var(--ink);
  margin: 0 0 1.4rem;
  text-wrap: balance;
}
.footer-mark span { font-style: italic; font-weight: 400; color: var(--ink-soft); }

.motif { margin: 0; }
.motif svg { display: block; width: 100%; height: auto; }

/* Archival band: grayscale engraving multiplied onto the paper ground so the
   scan's white sheet takes the site's paper tone. Hairline rules top and bottom. */
.band-section { padding-block: clamp(1.6rem, 4vw, 2.8rem); }
.band { margin: 0; }
.band img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 5.5;
  object-fit: cover;
  object-position: center 30%;
  filter: grayscale(1) contrast(1.06) brightness(1.03);
  mix-blend-mode: multiply;
  border-block: 1px solid var(--rule-strong);
}
.band figcaption {
  font-size: 0.8rem;
  color: var(--ink-faint);
  margin-top: 0.55rem;
  letter-spacing: 0.01em;
}
@media (max-width: 640px) {
  .band img { aspect-ratio: 16 / 8; }
}

.site-footer__grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 1.6rem;
}
.site-footer a { color: var(--accent); }
.site-footer nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.3rem 1.1rem; }
.site-footer nav a { text-decoration: none; }
.site-footer nav a:hover { text-decoration: underline; }
.funder { margin-top: 1.4rem; color: var(--ink-faint); max-width: 46rem; }
@media (max-width: 640px) { .site-footer__grid { grid-template-columns: 1fr; } }

/* --------------------------------------------------------------------------
   14. 404
   -------------------------------------------------------------------------- */

.error-page { padding-block: clamp(3rem, 10vw, 7rem); max-width: var(--measure); }
.error-page .code {
  font-family: var(--font-display);
  font-size: clamp(3rem, 2rem + 6vw, 6rem);
  color: var(--accent);
  line-height: 1;
  margin: 0 0 1rem;
}

/* --------------------------------------------------------------------------
   14b. Track chips (Open Questions jump nav) and pull quotes
   -------------------------------------------------------------------------- */

.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.55rem;
  margin: 1.3rem 0 0;
  padding: 0;
  list-style: none;
}
.chips a {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.86rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--accent);
  text-decoration: none;
  padding: 0.34rem 0.8rem;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--rule));
  border-radius: 999px;
  background: var(--paper);
  transition: background 0.15s ease, border-color 0.15s ease;
}
.chips a:hover {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border-color: var(--accent);
}

.pullquote {
  max-width: var(--measure);
  margin: 2.1rem 0;
  padding: 0.1rem 0 0.1rem 1.4rem;
  border-left: 3px solid var(--accent);
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 1.1rem + 1.1vw, 1.8rem);
  line-height: 1.26;
  font-weight: 500;
  color: var(--ink);
  text-wrap: balance;
}
.pullquote p { margin: 0; }

/* --------------------------------------------------------------------------
   14c. Design system v2: sans chrome, disciplines, diagram, endings
   -------------------------------------------------------------------------- */

/* Quiet sans for UI chrome. Prose stays Source Serif; display stays Fraunces. */
.eyebrow, .hero__title, .hero__meta, .nav-toggle-label, .site-nav a,
.door__who, .door__cta, .stat__label, .finding__index, .finding__sources,
.gloss__id, .gloss__q .disc, .tension__id, .backlink, .pub__kind, .pub__meta,
.tag, .roster__meta, .factlist .k, .bio__role, .q-index th, .q-index caption,
.q-index .qid, .q-index .qdisc, .chips a, .legend, .next__eyebrow, .disc-badge {
  font-family: var(--font-ui);
}
.site-nav a { font-size: 0.9rem; letter-spacing: 0.005em; }

/* Hero metadata line */
.hero__meta {
  margin: 1.15rem 0 0;
  font-size: 0.84rem;
  letter-spacing: 0.02em;
  color: var(--ink-faint);
}
.hero__meta b { font-weight: 600; color: var(--ink-soft); }

/* Freeze the hero wash to a calm static state (no orbit) */
.wash__a, .wash__b, .wash__c { animation: none; }
.wash { opacity: 0.8; }

/* Type tuning now that Fraunces and Source Serif are live */
h1, h2, h3, h4 { font-weight: 560; }
.hero__finding { font-weight: 600; letter-spacing: -0.022em; }
.gloss__q, .door__line, .pub__title, .footer-mark { font-weight: 560; }

/* Chips get a discipline dot */
.chips a { --d: var(--accent); }
.chips a::before {
  content: ""; display: inline-block; width: 0.5rem; height: 0.5rem;
  border-radius: 50%; background: var(--d); margin-right: 0.5rem; vertical-align: 0.05em;
}
.chip--psy{--d:var(--disc-psy)} .chip--theo{--d:var(--disc-theo)}
.chip--rs{--d:var(--disc-rs)} .chip--phil{--d:var(--disc-phil)}
.chip--inter{--d:var(--disc-inter)} .chip--tension{--d:var(--ink-faint)}

/* Discipline legend */
.legend {
  display: flex; flex-wrap: wrap; gap: 0.45rem 1.3rem;
  margin: 1.2rem 0 0; padding: 0; list-style: none;
  font-size: 0.82rem; color: var(--ink-soft);
}
.legend li { display: flex; align-items: center; gap: 0.45rem; }
.legend .sw { width: 0.62rem; height: 0.62rem; border-radius: 50%; background: var(--d, var(--accent)); }
.leg--psy{--d:var(--disc-psy)} .leg--theo{--d:var(--disc-theo)}
.leg--rs{--d:var(--disc-rs)} .leg--phil{--d:var(--disc-phil)}
.leg--inter{--d:var(--disc-inter)}

/* Index table, colored by track group */
.q-index tbody.tb-psy .qdisc{color:var(--disc-psy)}
.q-index tbody.tb-theo .qdisc{color:var(--disc-theo)}
.q-index tbody.tb-rs .qdisc{color:var(--disc-rs)}
.q-index tbody.tb-phil .qdisc{color:var(--disc-phil)}
.q-index tbody.tb-inter .qdisc{color:var(--disc-inter)}
.q-index tbody.tb-psy td:first-child{box-shadow: inset 3px 0 0 var(--disc-psy)}
.q-index tbody.tb-theo td:first-child{box-shadow: inset 3px 0 0 var(--disc-theo)}
.q-index tbody.tb-rs td:first-child{box-shadow: inset 3px 0 0 var(--disc-rs)}
.q-index tbody.tb-phil td:first-child{box-shadow: inset 3px 0 0 var(--disc-phil)}
.q-index tbody.tb-inter td:first-child{box-shadow: inset 3px 0 0 var(--disc-inter)}
.q-index tbody td:first-child { padding-left: 0.7rem; }
@media (max-width: 680px) {
  .q-index tbody td:first-child { box-shadow: none; padding-left: 0; }
}

/* Gloss discipline label: colored by section, hung in the right margin on wide screens */
#psychology .gloss__q .disc{color:var(--disc-psy)}
#theology .gloss__q .disc{color:var(--disc-theo)}
#religious-studies .gloss__q .disc{color:var(--disc-rs)}
#philosophy .gloss__q .disc{color:var(--disc-phil)}
#interdisciplinary .gloss__q .disc{color:var(--disc-inter)}
@media (min-width: 1180px) {
  .gloss { position: relative; }
  .gloss__q .disc {
    position: absolute; right: -9.75rem; top: 0.2rem; margin: 0;
    width: 8.5rem; text-align: left;
  }
  .gloss__q .disc::before {
    content: ""; display: inline-block; width: 0.5rem; height: 0.5rem;
    border-radius: 50%; background: currentColor; margin-right: 0.4rem; vertical-align: 0.05em;
  }
}

/* Roster track headings get a discipline rule (About) */
.roster__track > .roster__head h3 { padding-left: 0.7rem; border-left: 3px solid var(--rule-strong); }
.roster__track--psy > .roster__head h3{border-left-color:var(--disc-psy)}
.roster__track--theo > .roster__head h3{border-left-color:var(--disc-theo)}
.roster__track--rs > .roster__head h3{border-left-color:var(--disc-rs)}
.roster__track--phil > .roster__head h3{border-left-color:var(--disc-phil)}

/* Critical-trust signature diagram (framed, typographic) */
.ct-diagram {
  max-width: 46rem; margin: 2.3rem 0;
  border: 1px solid var(--rule-strong); border-radius: 12px;
  padding: 1.8rem 2rem 1.5rem;
  background: var(--paper);
}
.ct-diagram svg { width: 100%; height: auto; display: block; }
.ct-diagram .ct-mid { font-family: var(--font-display); font-weight: 600; fill: var(--accent); }
.ct-diagram .ct-sub { font-family: var(--font-ui); fill: var(--ink-soft); }
.ct-diagram .ct-pole { font-family: var(--font-ui); font-weight: 600; fill: var(--ink); }
.ct-diagram .ct-polesub { font-family: var(--font-ui); fill: var(--ink-faint); }
.ct-diagram figcaption { font-family: var(--font-ui); font-size: 0.8rem; color: var(--ink-faint); text-align: center; margin-top: 0.7rem; }
.callout .ct-diagram { background: color-mix(in srgb, var(--paper) 82%, #fff); }

/* Editorial page-ending pathway: a foundation-report navigation list */
.next { margin-top: 2.8rem; max-width: var(--measure); }
.next__eyebrow {
  font-size: 0.74rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--ink-faint); margin: 0 0 0.4rem;
}
.next__links { display: grid; }
.next__links a {
  display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
  padding: 0.85rem 0; border-top: 1px solid var(--rule);
  font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 560;
  text-decoration: none; color: var(--ink);
}
.next__links a:last-child { border-bottom: 1px solid var(--rule); }
.next__links a:hover { color: var(--accent-deep); }
.next__links a::after { content: "\2192"; color: var(--accent); font-size: 1.05rem; }
.next__links a:hover::after { transform: translateX(2px); }

/* About: directors grid */
.dir-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; max-width: var(--measure-wide); }
.dir { border-top: 3px solid var(--accent); padding-top: 0.9rem; }
.dir h3 { margin: 0 0 0.1rem; }
.dir .bio__role { margin-bottom: 0.6rem; }
.dir p:last-child { font-size: 0.98rem; color: var(--ink-soft); margin-bottom: 0; }
@media (max-width: 760px) { .dir-grid { grid-template-columns: 1fr; gap: 1.7rem; } }

/* --------------------------------------------------------------------------
   14d. Design system v3: field map, discipline everywhere, mobile wordmark, band
   -------------------------------------------------------------------------- */

/* Homepage field map: four disciplines feed the open questions and critical trust */
.fieldmap {
  display: flex; align-items: stretch;
  border: 1px solid var(--rule-strong); border-radius: 12px; overflow: hidden;
  background: var(--paper);
}
.fm-col { flex: 1; padding: 1.5rem 1.6rem; display: flex; flex-direction: column; justify-content: center; }
.fm-col + .fm-col { border-left: 1px solid var(--rule); }
.fm-label {
  font-family: var(--font-ui); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-faint); margin: 0 0 0.75rem;
}
.fm-disciplines ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.fm-disciplines li {
  display: flex; align-items: center; gap: 0.6rem;
  font-family: var(--font-ui); font-weight: 600; font-size: 0.98rem; color: var(--ink);
}
.fm-disciplines .dot { width: 0.64rem; height: 0.64rem; border-radius: 50%; background: var(--d, var(--accent)); flex: none; }
.fm-psy{--d:var(--disc-psy)} .fm-theo{--d:var(--disc-theo)} .fm-rs{--d:var(--disc-rs)} .fm-phil{--d:var(--disc-phil)}
.fm-arrow { display: flex; align-items: center; padding: 0 0.1rem; color: var(--rule-strong); font-size: 1.5rem; }
.fm-hub { text-align: center; align-items: center; background: color-mix(in srgb, var(--paper-panel) 55%, var(--paper)); }
.fm-num { font-family: var(--font-display); font-size: clamp(2.3rem, 1.7rem + 2vw, 3.1rem); font-weight: 600; line-height: 1; color: var(--ink); margin: 0; }
.fm-cap2 { font-family: var(--font-ui); font-size: 0.82rem; color: var(--ink-soft); margin: 0.55rem 0 0; }
.fm-idea { text-align: center; align-items: center; }
.fm-idea-name { font-family: var(--font-display); font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); font-weight: 600; color: var(--accent); margin: 0; line-height: 1.05; }
@media (max-width: 760px) {
  .fieldmap { flex-direction: column; }
  .fm-col + .fm-col { border-left: 0; border-top: 1px solid var(--rule); }
  .fm-arrow { padding: 0.35rem; transform: rotate(90deg); }
}

/* Discipline system pushed into headings and IDs */
#psychology > h2::before, #theology > h2::before, #religious-studies > h2::before,
#philosophy > h2::before, #interdisciplinary > h2::before {
  content: ""; display: block; width: 2.8rem; height: 3px; margin-bottom: 0.6rem;
}
#psychology > h2::before{background:var(--disc-psy)}
#theology > h2::before{background:var(--disc-theo)}
#religious-studies > h2::before{background:var(--disc-rs)}
#philosophy > h2::before{background:var(--disc-phil)}
#interdisciplinary > h2::before{background:var(--disc-inter)}
.q-index tbody.tb-psy .qid a{color:var(--disc-psy)}
.q-index tbody.tb-theo .qid a{color:var(--disc-theo)}
.q-index tbody.tb-rs .qid a{color:var(--disc-rs)}
.q-index tbody.tb-phil .qid a{color:var(--disc-phil)}
.q-index tbody.tb-inter .qid a{color:var(--disc-inter)}
#psychology .gloss__id{color:var(--disc-psy)}
#theology .gloss__id{color:var(--disc-theo)}
#religious-studies .gloss__id{color:var(--disc-rs)}
#philosophy .gloss__id{color:var(--disc-phil)}
#interdisciplinary .gloss__id{color:var(--disc-inter)}

/* Two-line mobile wordmark with breathing room */
.brand__l1, .brand__l2 { display: inline; }
.brand__l2 { color: var(--ink-soft); }
@media (max-width: 1024px) {
  .site-header__inner { padding-block: 1.05rem; }
  .brand { white-space: normal; font-size: 1.08rem; line-height: 1.16; }
  .brand__l1, .brand__l2 { display: block; }
}

/* Archival band as a full-bleed divider */
.band-section { padding-block: 0; margin-block: clamp(2rem, 5vw, 3.4rem); }
.band { margin: 0; }
.band img {
  width: 100vw; margin-left: calc(50% - 50vw);
  aspect-ratio: 16 / 5;
  object-fit: cover; object-position: center 28%;
  filter: grayscale(1) contrast(1.06) brightness(1.03);
  mix-blend-mode: multiply;
  border-block: 1px solid var(--rule-strong);
}
.band__caption { padding-top: 0.7rem; }
.band__theme { font-family: var(--font-display); font-size: var(--fs-lead); color: var(--ink); margin: 0 0 0.3rem; max-width: 40rem; }
.band__credit { font-family: var(--font-ui); font-size: 0.76rem; color: var(--ink-faint); margin: 0; }
@media (max-width: 640px) { .band img { aspect-ratio: 16 / 8; } }

/* --------------------------------------------------------------------------
   14e. Design system v4: bespoke field map, editorial doors, ct statement
   -------------------------------------------------------------------------- */

/* Field map: disciplines flow along drawn paths into the questions and the idea */
.fieldmap {
  display: flex; align-items: center; gap: clamp(0.5rem, 1.8vw, 1.4rem);
  padding: 1.4rem 0.25rem 0.6rem;
  border: 0; background: none; overflow: visible;
}
.fm-disciplines { flex: 0 0 auto; }
.fm-label {
  font-family: var(--font-ui); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-faint); margin: 0 0 0.8rem;
}
.fm-disciplines ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.75rem; }
.fm-disciplines li {
  display: flex; align-items: center; gap: 0.6rem;
  font-family: var(--font-ui); font-weight: 600; font-size: 1rem; color: var(--ink);
}
.fm-disciplines .dot { width: 0.7rem; height: 0.7rem; border-radius: 50%; background: var(--d, var(--accent)); flex: none; }
.fm-fan { flex: 0 1 110px; align-self: stretch; min-width: 48px; max-width: 130px; height: auto; }
.fm-fan path { fill: none; stroke-width: 1.5; opacity: 0.55; }
.fm-hub { flex: 0 0 auto; text-align: center; padding: 0 0.4rem; }
.fm-num { font-family: var(--font-display); font-size: clamp(2.7rem, 2rem + 2.6vw, 3.7rem); font-weight: 600; line-height: 0.95; color: var(--ink); margin: 0; }
.fm-cap2 { font-family: var(--font-ui); font-size: 0.8rem; color: var(--ink-soft); margin: 0.5rem 0 0; line-height: 1.3; }
.fm-link { flex: 0 0 auto; width: clamp(44px, 6vw, 88px); height: 24px; }
.fm-link path { fill: none; stroke-width: 1.5; }
.fm-idea { flex: 0 0 auto; }
.fm-idea-name { font-family: var(--font-display); font-size: clamp(1.6rem, 1.3rem + 1vw, 2.2rem); font-weight: 600; color: var(--accent); margin: 0.15rem 0 0; line-height: 1.05; }
.fm-down { display: none; color: var(--rule-strong); font-size: 1.5rem; line-height: 1; text-align: center; }
@media (max-width: 720px) {
  .fieldmap { flex-direction: column; align-items: center; text-align: center; gap: 0.35rem; }
  .fm-fan, .fm-link { display: none; }
  .fm-disciplines ul { justify-items: center; }
  .fm-disciplines li { justify-content: center; }
  .fm-down { display: block; }
}

/* Critical trust made central, right after the map */
.ct-statement {
  max-width: 44rem; margin: 1.5rem 0 0;
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(1.2rem, 1rem + 0.9vw, 1.55rem); line-height: 1.4; color: var(--ink-soft);
}
.ct-statement strong { color: var(--accent); font-weight: 600; }
.ct-statement a { font-family: var(--font-ui); font-size: 0.9rem; font-weight: 600; white-space: nowrap; text-decoration: none; border-bottom: 2px solid var(--accent); }

/* Doors as three editorial routes, not cards */
.doors { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 2px solid var(--ink); }
.door {
  display: flex; flex-direction: column;
  padding: 1.3rem 1.5rem 1.2rem;
  border: 0; border-radius: 0; background: none;
  text-decoration: none; color: var(--ink);
  transition: background 0.15s ease;
}
.door + .door { border-left: 1px solid var(--rule); }
.door:hover { background: color-mix(in srgb, var(--paper-panel) 45%, transparent); }
.door__who {
  align-self: flex-start;
  font-family: var(--font-ui); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.09em; text-transform: uppercase; color: var(--accent);
  background: none; padding: 0; border-radius: 0; margin: 0 0 0.7rem;
}
.door__line { font-family: var(--font-display); font-size: clamp(1.2rem, 1rem + 0.9vw, 1.6rem); font-weight: 560; line-height: 1.18; margin: 0 0 1.2rem; }
.door__cta { margin-top: auto; font-family: var(--font-ui); font-size: 0.9rem; font-weight: 600; color: var(--accent); }
@media (max-width: 760px) {
  .doors { grid-template-columns: 1fr; }
  .door + .door { border-left: 0; border-top: 1px solid var(--rule); }
}

/* About at-a-glance band */
.stats--about { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 620px) { .stats--about { grid-template-columns: repeat(2, 1fr); } }

/* --------------------------------------------------------------------------
   14f. Design system v5: one bespoke editorial device per inner page
   -------------------------------------------------------------------------- */

/* Problem: the assumption vs the evidence */
.split { display: grid; grid-template-columns: 1fr 1fr; border-top: 2px solid var(--ink); max-width: var(--measure-wide); margin: 1.7rem 0 0; }
.split__col { padding: 1.3rem 1.6rem 1.4rem; }
.split__col--new { border-left: 3px solid var(--accent); background: color-mix(in srgb, var(--accent) 5%, transparent); }
.split__label { font-family: var(--font-ui); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase; margin: 0 0 0.6rem; }
.split__col--old .split__label { color: var(--ink-faint); }
.split__col--new .split__label { color: var(--accent); }
.split__text { font-family: var(--font-display); font-size: clamp(1.1rem, 1rem + 0.6vw, 1.35rem); line-height: 1.32; margin: 0; }
.split__col--old .split__text { color: var(--ink-faint); }
@media (max-width: 680px) { .split { grid-template-columns: 1fr; } .split__col--new { border-left: 0; border-top: 1px solid var(--rule); } }

/* Findings: the six-finding spine */
.spine { max-width: var(--measure); margin: 1.7rem 0 0; }
.spine__eyebrow { font-family: var(--font-ui); font-size: 0.74rem; font-weight: 700; letter-spacing: 0.11em; text-transform: uppercase; color: var(--ink-faint); margin: 0 0 0.3rem; }
.spine__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 2rem; border-top: 2px solid var(--ink); }
.spine__list a { display: flex; gap: 0.7rem; align-items: baseline; padding: 0.7rem 0; border-top: 1px solid var(--rule); text-decoration: none; color: var(--ink); font-family: var(--font-body); font-size: 0.98rem; line-height: 1.25; }
.spine__list li:nth-child(1) a, .spine__list li:nth-child(2) a { border-top: 0; }
.spine__n { font-family: var(--font-display); font-weight: 600; color: var(--accent); font-size: 1.05rem; flex: none; min-width: 1.4rem; }
.spine__list a:hover { color: var(--accent-deep); }
.spine__idea { display: inline-flex; gap: 0.6rem; align-items: baseline; margin-top: 1rem; font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 560; color: var(--accent); text-decoration: none; border-bottom: 2px solid var(--accent); }
@media (max-width: 640px) { .spine__list { grid-template-columns: 1fr; } .spine__list li:nth-child(2) a { border-top: 1px solid var(--rule); } }

/* Publications: the outputs ledger */
.ledger { width: 100%; max-width: var(--measure-wide); border-collapse: collapse; margin: 1.6rem 0 0; font-family: var(--font-ui); }
.ledger td { padding: 0.85rem 1rem 0.85rem 0; border-top: 1px solid var(--rule); vertical-align: baseline; }
.ledger tr:first-child td { border-top: 2px solid var(--ink); }
.ledger td:first-child { font-weight: 700; color: var(--ink); white-space: nowrap; }
.ledger td:nth-child(2) { font-family: var(--font-display); font-size: 1.1rem; color: var(--ink); }
.ledger td:last-child { color: var(--ink-faint); font-size: 0.9rem; }
@media (max-width: 640px) {
  .ledger, .ledger tbody, .ledger tr, .ledger td { display: block; }
  .ledger td { border: 0; padding: 0.1rem 0; white-space: normal; }
  .ledger tr { border-top: 1px solid var(--rule); padding: 0.7rem 0; }
  .ledger tr:first-child { border-top: 2px solid var(--ink); }
}

/* About: two-column institutional hero */
.about-hero { display: grid; grid-template-columns: 1.6fr 1fr; gap: 2.5rem; align-items: start; }
.about-hero__lead { font-family: var(--font-display); font-size: var(--fs-lead); color: var(--ink-soft); line-height: 1.4; margin: 0.6rem 0 0; max-width: 34rem; }
.about-hero__aside { border-left: 1px solid var(--rule-strong); padding-left: 1.5rem; }
.about-hero__k { font-family: var(--font-ui); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-faint); margin: 0 0 0.2rem; }
.about-hero__v { font-family: var(--font-body); font-size: 1rem; color: var(--ink); margin: 0 0 1rem; line-height: 1.35; }
@media (max-width: 760px) { .about-hero { grid-template-columns: 1fr; gap: 1.4rem; } .about-hero__aside { border-left: 0; border-top: 1px solid var(--rule-strong); padding-left: 0; padding-top: 1.2rem; } }

/* Field map: connector line instead of arrow glyphs on mobile */
.fm-down { display: none; width: 2px; height: 22px; background: var(--rule-strong); border-radius: 2px; margin: 0.15rem auto; }

/* 14g. Mobile refinement: larger, simpler critical-trust diagram on phones */
@media (max-width: 600px) {
  .ct-diagram { padding: 1.2rem 1.1rem 1rem; }
  .ct-diagram .ct-mid { font-size: 46px; }
  .ct-diagram .ct-pole { font-size: 30px; }
  .ct-diagram .ct-sub, .ct-diagram .ct-polesub { display: none; }
  .ct-diagram figcaption { display: none; }
}

/* --------------------------------------------------------------------------
   15. Utilities
   -------------------------------------------------------------------------- */

.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.muted { color: var(--ink-faint); }
.nowrap { white-space: nowrap; }
.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}