/* =========================================================
   OPERATION IMAGINAL, Donate Page
   Layered on top of style.css tokens.
   New components only. No token overrides.
   ========================================================= */

/* ---- Pre-launch notice (ported from landing.css with style.css tokens) ---- */
.prelaunch-notice {
  background: var(--bg-elev-2);
  border-bottom: 1px solid var(--rule);
  padding: 10px 0;
  font-size: 14px;
  color: var(--ink-dim);
}
.prelaunch-inner {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.prelaunch-copy {
  margin: 0;
  flex: 1;
  min-width: 0;
  line-height: 1.45;
}
.prelaunch-copy a {
  color: var(--accent-2-deep);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}
.prelaunch-chip {
  display: inline-block;
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
  background: var(--bg);
  border: 1px solid var(--accent-soft);
  border-radius: 999px;
  padding: 4px 10px;
  white-space: nowrap;
  flex-shrink: 0;
}
@media (max-width: 560px) {
  .prelaunch-notice { font-size: 13px; padding: 12px 0; }
  .prelaunch-inner { gap: 10px; }
}

/* ---- Hero ---- */
.donate-hero {
  padding: clamp(48px, 7vw, 96px) 0 clamp(32px, 5vw, 56px);
  text-align: center;
}
/* Donate hero uses canonical Fraunces serif at weight 800 (vs canonical .h1 at 700).
   Heavier weight is a deliberate editorial choice: the three-line structure
   ("100% to operations. / Zero salary. / Public books.") needs maximum punch
   at small line counts. Size scale (40-84px) mirrors canonical .h1. */
.donate-hero-headline {
  font-family: var(--font-serif);
  font-weight: 800;
  letter-spacing: var(--ls-tight);
  line-height: 1.05;
  font-size: clamp(40px, 7vw, 84px);
  color: var(--ink);
  margin: 0 auto var(--sp-6);
  max-width: 18ch;
}
.donate-hero-line {
  display: block;
}
.donate-hero-line:nth-child(1) { color: var(--accent); }
.donate-hero-line:nth-child(2) { color: var(--accent-2-deep); }
.donate-hero-line:nth-child(3) { color: var(--ink); }
.donate-hero-sub {
  max-width: 52ch;
  margin: 0 auto var(--sp-8);
  font-size: clamp(16px, 1.4vw, 19px);
  line-height: var(--lh-normal);
  color: var(--ink-dim);
}
.donate-hero-cta {
  margin: 0 0 var(--sp-6);
}
.donate-hero-hint {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin: 0;
}
.donate-hero-hint a { color: var(--ink-dim); }
.donate-hero-hint a:hover { color: var(--accent); opacity: 1; }

/* ---- Raised-to-date counter ---- */
.raised-counter {
  padding: clamp(32px, 4vw, 56px) 0;
  border-top: 1px solid var(--rule-soft);
  border-bottom: 1px solid var(--rule-soft);
  background: var(--bg-elev);
}
.raised-counter-inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-6);
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
}
@media (min-width: 720px) {
  .raised-counter-inner { grid-template-columns: 2fr 1fr 1fr; align-items: end; gap: var(--sp-8); }
}
.raised-counter-stat { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.raised-counter-num {
  font-family: var(--font-serif);
  font-weight: 800;
  font-size: clamp(44px, 6vw, 72px);
  color: var(--accent-2);
  line-height: 1;
  font-feature-settings: 'tnum';
  letter-spacing: -0.01em;
}
.raised-counter-sub {
  font-family: var(--font-serif);
  font-weight: 700;
  font-size: clamp(22px, 3vw, 32px);
  color: var(--ink);
  line-height: 1;
  font-feature-settings: 'tnum';
}
.raised-counter-label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-dim);
}
.raised-counter-note {
  text-align: center;
  font-size: 13px;
  color: var(--ink-dim);
  margin: var(--sp-6) auto 0;
  max-width: 60ch;
}

/* ---- Why we are asking ---- */
.donate-why {
  padding: clamp(56px, 7vw, 96px) 0 clamp(32px, 4vw, 56px);
  text-align: center;
}
.donate-why .h2 {
  max-width: 22ch;
  margin: 0 auto var(--sp-6);
}
.donate-why .lede {
  margin-left: auto;
  margin-right: auto;
}
.donate-why-body {
  max-width: 56ch;
  margin: var(--sp-4) auto 0;
  font-size: 17px;
  line-height: var(--lh-normal);
  color: var(--ink);
}

/* ---- Dollar breakdown table ---- */
.dollar-breakdown-section {
  padding: clamp(32px, 4vw, 56px) 0 clamp(56px, 7vw, 96px);
  text-align: center;
}
.dollar-breakdown-section .h2 { max-width: 24ch; margin-left: auto; margin-right: auto; margin-bottom: var(--sp-4); }
.dollar-breakdown-section .lede { margin-left: auto; margin-right: auto; margin-bottom: var(--sp-8); }
.dollar-breakdown {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  border-collapse: collapse;
  text-align: left;
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-radius: 10px;
  overflow: hidden;
}
.dollar-breakdown th,
.dollar-breakdown td {
  padding: 16px 20px;
  border-bottom: 1px solid var(--rule-soft);
  vertical-align: top;
}
.dollar-breakdown thead th {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-dim);
  font-weight: 600;
  background: var(--bg-elev-2);
  border-bottom: 1.5px solid var(--rule);
}
.dollar-breakdown tr:last-child td { border-bottom: none; }
.dollar-breakdown .db-amount {
  font-family: var(--font-serif);
  font-size: clamp(22px, 2.4vw, 28px);
  font-weight: 700;
  color: var(--accent-2);
  font-feature-settings: 'tnum';
  white-space: nowrap;
  width: 130px;
  border-left: 3px solid var(--accent);
}
.dollar-breakdown .db-line {
  font-size: 15px;
  color: var(--ink);
  line-height: 1.5;
}
@media (max-width: 560px) {
  .dollar-breakdown th,
  .dollar-breakdown td { padding: 14px 16px; }
  .dollar-breakdown .db-amount { width: 90px; font-size: 20px; }
  .dollar-breakdown .db-line { font-size: 14px; }
}

/* ---- Tier ladder ---- */
.donate-tiers-section {
  padding: clamp(56px, 7vw, 96px) 0;
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg-elev) 100%);
  border-top: 1px solid var(--rule);
  text-align: center;
}
.donate-tiers-section .h2 { max-width: 24ch; margin-left: auto; margin-right: auto; margin-bottom: var(--sp-4); }
.donate-tiers-section .lede { margin-left: auto; margin-right: auto; margin-bottom: var(--sp-8); }

.cadence-toggle {
  display: inline-flex;
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-radius: 999px;
  padding: 4px;
  margin-bottom: var(--sp-8);
  box-shadow: var(--shadow-soft);
}
.cadence-btn {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 10px 22px;
  border: none;
  background: transparent;
  color: var(--ink-dim);
  border-radius: 999px;
  cursor: pointer;
  transition: all .15s ease;
}
.cadence-btn:hover { color: var(--ink); }
.cadence-btn.is-active {
  background: var(--accent);
  color: var(--bg-light);
  box-shadow: 0 2px 8px rgba(46, 93, 63, 0.25);
}

.donate-tiers {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: var(--sp-4);
  max-width: 960px;
  margin: 0 auto var(--sp-8);
  padding: 0 24px;
}
.donate-tier-card {
  position: relative;
  background: var(--bg-elev);
  border: 1.5px solid var(--rule);
  border-radius: 12px;
  padding: var(--sp-6) var(--sp-4);
  text-align: center;
  cursor: pointer;
  transition: all .15s ease;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  font-family: inherit;
}
.donate-tier-card:hover {
  border-color: var(--accent-2);
  transform: translateY(-2px);
  box-shadow: var(--shadow-soft);
}
.donate-tier-card.is-selected {
  border-color: var(--accent);
  background: var(--bg-elev-2);
  box-shadow: 0 0 0 3px rgba(46, 93, 63, 0.15);
}
.donate-tier-amount {
  font-family: var(--font-serif);
  font-size: clamp(28px, 3.4vw, 38px);
  font-weight: 700;
  color: var(--accent-2);
  line-height: 1;
  font-feature-settings: 'tnum';
}
.donate-tier-cadence {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-faint);
}
.donate-tier-label {
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
  letter-spacing: var(--ls-tight);
}
.donate-tier-framing {
  font-size: 13px;
  color: var(--ink-dim);
  line-height: 1.5;
}
.donate-tier-custom {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.donate-tier-custom-input {
  width: 100px;
  padding: 6px 10px;
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--accent-2);
  text-align: center;
  border: 1.5px solid var(--rule);
  border-radius: 6px;
  background: var(--bg);
  font-feature-settings: 'tnum';
}
.donate-tier-custom-input:focus {
  outline: none;
  border-color: var(--accent-2);
}
.donate-tier-custom-prefix {
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink-dim);
}

.donate-tiers-note {
  max-width: 60ch;
  margin: var(--sp-6) auto 0;
  padding: 0 24px;
  font-size: 14px;
  color: var(--ink-dim);
  line-height: 1.6;
  text-align: center;
}

/* ---- Launch card ---- */
.donate-launch-section {
  padding: clamp(40px, 5vw, 72px) 0;
  background: var(--bg);
}
.donate-launch {
  max-width: 720px;
  margin: 0 auto;
  background: var(--bg-elev);
  border: 1.5px solid var(--accent);
  border-radius: 16px;
  padding: clamp(24px, 3vw, 40px);
  box-shadow: var(--shadow-card);
  display: grid;
  gap: var(--sp-6);
  grid-template-columns: 1fr;
  align-items: center;
}
@media (min-width: 680px) {
  .donate-launch { grid-template-columns: 1fr auto; gap: var(--sp-8); }
}
.donate-launch-summary { text-align: left; }
.donate-launch-label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-dim);
  margin: 0 0 6px;
}
.donate-launch-amount {
  font-family: var(--font-serif);
  font-size: clamp(28px, 3.4vw, 38px);
  font-weight: 700;
  color: var(--ink);
  line-height: 1.1;
  margin: 0 0 4px;
  font-feature-settings: 'tnum';
}
.donate-launch-amount #launch-amount { color: var(--accent-2); }
.donate-launch-tier {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0;
}
.donate-launch-cta {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
}
.donate-launch-note {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.04em;
  color: var(--ink-faint);
  max-width: 36ch;
  line-height: 1.5;
  margin: 0;
}

.btn.is-disabled,
.btn.is-disabled:hover {
  background: var(--ink-faint);
  color: var(--bg-light);
  box-shadow: none;
  cursor: not-allowed;
  opacity: 0.85;
  transform: none;
  pointer-events: auto;
}

/* ---- Stewardship ---- */
.stewardship {
  padding: clamp(56px, 7vw, 96px) 0;
  border-top: 1px solid var(--rule-soft);
  text-align: center;
}
.stewardship .h2 { max-width: 24ch; margin: 0 auto var(--sp-8); }
.stewardship-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-6);
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
@media (min-width: 760px) {
  .stewardship-grid { grid-template-columns: repeat(3, 1fr); gap: var(--sp-8); }
}

/* Single-director solo layout */
.stewardship-solo {
  max-width: 480px;
  margin: 0 auto;
  padding: 0 24px;
}
.steward-card {
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-radius: 12px;
  padding: var(--sp-8) var(--sp-6);
  text-align: center;
  transition: all .15s ease;
}
.steward-card:hover {
  border-color: var(--accent-soft);
  transform: translateY(-2px);
  box-shadow: var(--shadow-soft);
}
.steward-portrait {
  width: 120px;
  height: 120px;
  margin: 0 auto var(--sp-4);
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid var(--accent);
  background: var(--bg-elev-2);
}
.steward-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
}
.steward-portrait-photo img { filter: grayscale(15%); }
.steward-portrait-silhouette {
  border-style: dashed;
  background: var(--bg-elev-2);
}
.steward-portrait-silhouette img {
  width: 60%;
  height: 60%;
  margin: 20%;
  object-fit: contain;
}
.steward-name {
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: var(--ls-tight);
  line-height: 1.2;
  margin: 0 0 4px;
  color: var(--ink);
}
.steward-role {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent-2-deep);
  margin: 0 0 var(--sp-3);
}
.steward-bio {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-dim);
  margin: 0;
}
.stewardship-note {
  max-width: 60ch;
  margin: var(--sp-12) auto 0;
  padding: 0 24px;
  font-size: 14px;
  font-style: italic;
  color: var(--ink-dim);
  text-align: center;
  line-height: 1.6;
}

/* ---- Zero-salary pledge ---- */
.zero-salary {
  padding: clamp(56px, 7vw, 96px) 0;
  background: var(--bg-elev);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  text-align: center;
}
.zero-salary-quote {
  max-width: 640px;
  margin: 0 auto;
  padding: 0 24px;
}
.zero-salary-quote p {
  font-family: var(--font-serif);
  font-size: clamp(18px, 1.8vw, 22px);
  font-style: italic;
  line-height: 1.55;
  color: var(--ink);
  margin: 0 0 var(--sp-4);
}
.zero-salary-sig {
  margin-top: var(--sp-6);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent);
  line-height: 1.5;
}
.zero-salary-sig-meta {
  color: var(--ink-faint);
  font-weight: 400;
}

/* ---- Refusal rules ---- */
.refusal {
  padding: clamp(56px, 7vw, 96px) 0;
  text-align: center;
}
.refusal .h2 { max-width: 26ch; margin: 0 auto var(--sp-8); }
.refusal-list {
  max-width: 720px;
  margin: 0 auto var(--sp-8);
  padding: 0 24px;
  list-style: none;
  text-align: left;
  counter-reset: refusal;
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}
.refusal-list li {
  counter-increment: refusal;
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-left: 4px solid var(--danger);
  border-radius: 8px;
  padding: var(--sp-6);
  position: relative;
}
.refusal-list li::before {
  content: counter(refusal, decimal-leading-zero);
  display: block;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--danger);
  margin-bottom: var(--sp-2);
}
.refusal-title {
  display: block;
  font-family: var(--font-serif);
  font-size: clamp(18px, 1.6vw, 20px);
  font-weight: 700;
  color: var(--ink);
  line-height: 1.35;
  margin-bottom: var(--sp-2);
}
.refusal-body {
  display: block;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-dim);
}
.refusal-edge {
  max-width: 640px;
  margin: 0 auto;
  padding: var(--sp-5) var(--sp-6);
  background: var(--bg-elev-2);
  border: 1px dashed var(--rule);
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-dim);
  text-align: left;
}
.refusal-edge strong { color: var(--accent); }

/* ---- FAQ ---- */
.donate-faq-section {
  padding: clamp(56px, 7vw, 96px) 0;
  background: var(--bg-elev);
  border-top: 1px solid var(--rule);
}
.donate-faq-section .eyebrow,
.donate-faq-section .h2 { text-align: center; }
.donate-faq-section .h2 { max-width: 28ch; margin: 0 auto var(--sp-8); }
.donate-faq {
  max-width: 720px;
  margin: 0 auto;
  padding: 0 24px;
}
.donate-faq details {
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 8px;
  margin-bottom: var(--sp-3);
  overflow: hidden;
  transition: border-color .15s ease;
}
.donate-faq details[open] {
  border-color: var(--accent);
  box-shadow: var(--shadow-soft);
}
.donate-faq summary {
  padding: 16px 20px;
  font-family: var(--font-serif);
  font-size: 17px;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
  list-style: none;
  position: relative;
  padding-right: 48px;
  line-height: 1.4;
  transition: color .15s ease;
}
.donate-faq summary::-webkit-details-marker { display: none; }
.donate-faq summary:hover { color: var(--accent); }
.donate-faq summary::after {
  content: '+';
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 500;
  color: var(--ink-faint);
  transition: transform .2s ease, color .15s ease;
}
.donate-faq details[open] summary::after {
  content: '\2212'; /* minus sign */
  color: var(--accent-2-deep);
}
.donate-faq details[open] summary { color: var(--accent-2-deep); }
.donate-faq .faq-body {
  padding: 0 20px 20px;
  font-size: 15px;
  line-height: 1.65;
  color: var(--ink-dim);
}
.donate-faq .faq-body p { margin: 0 0 12px; }
.donate-faq .faq-body p:last-child { margin-bottom: 0; }
.donate-faq .faq-body a { color: var(--accent); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 2px; }

/* ---- Final CTA extends .cta-banner ---- */
.cta-banner .cta-sub {
  max-width: 48ch;
  margin: 0 auto var(--sp-8);
  font-size: 16px;
  color: var(--ink-dim);
  line-height: 1.6;
}
.cta-banner .cta-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

/* =========================================================
   THANKS PAGE
   ========================================================= */

.thanks-main { padding-bottom: clamp(40px, 6vw, 80px); }

.thanks-confirm {
  padding: clamp(64px, 9vw, 120px) 0 clamp(32px, 4vw, 56px);
  text-align: center;
}
.thanks-title {
  max-width: 22ch;
  margin: 0 auto var(--sp-6);
  font-size: clamp(40px, 6vw, 72px);
  color: var(--accent);
}
.thanks-lede {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: var(--sp-6);
}
.thanks-tax-note {
  max-width: 54ch;
  margin: 0 auto;
  font-family: var(--font-mono);
  font-size: 13px;
  color: var(--ink-faint);
  line-height: 1.6;
  padding: var(--sp-4) var(--sp-6);
  background: var(--bg-elev);
  border: 1px dashed var(--rule);
  border-radius: 8px;
}

.thanks-next {
  padding: clamp(48px, 6vw, 80px) 0;
  text-align: center;
  border-top: 1px solid var(--rule-soft);
}
.thanks-next .h2 { max-width: 22ch; margin-left: auto; margin-right: auto; margin-bottom: var(--sp-4); }
.thanks-next .lede { margin-left: auto; margin-right: auto; margin-bottom: var(--sp-6); }
.thanks-cta { margin: 0 0 var(--sp-4); }
.thanks-sub-note {
  max-width: 48ch;
  margin: 0 auto;
  font-size: 13px;
  color: var(--ink-dim);
  line-height: 1.5;
}

.thanks-share {
  padding: clamp(48px, 6vw, 80px) 0;
  text-align: center;
  background: var(--bg-elev);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.thanks-share .h2 { max-width: 22ch; margin: 0 auto var(--sp-4); }
.thanks-share .lede { margin: 0 auto var(--sp-6); }

.thanks-links { padding: clamp(48px, 6vw, 72px) 0; }
.thanks-links-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-4);
  max-width: 720px;
  margin: 0 auto;
  padding: 0 24px;
}
@media (min-width: 680px) {
  .thanks-links-row { grid-template-columns: 1fr 1fr; gap: var(--sp-6); }
}
.thanks-link-card {
  display: block;
  padding: var(--sp-6);
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition: all .15s ease;
}
.thanks-link-card:hover {
  border-color: var(--accent);
  transform: translateY(-2px);
  box-shadow: var(--shadow-soft);
  opacity: 1;
}
.thanks-link-kicker {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent-2-deep);
  margin: 0 0 8px;
}
.thanks-link-title {
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: var(--ls-tight);
  margin: 0 0 8px;
}
.thanks-link-sub {
  font-size: 13px;
  color: var(--ink-dim);
  line-height: 1.55;
  margin: 0;
}

/* =========================================================
   TRANSPARENCY PAGE
   ========================================================= */

.transparency-hero {
  padding: clamp(64px, 9vw, 120px) 0 clamp(32px, 4vw, 48px);
  text-align: center;
}
.transparency-hero .h1 {
  max-width: 24ch;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: var(--sp-6);
  font-size: clamp(34px, 5.2vw, 56px);
}
.transparency-hero .lede { margin: 0 auto var(--sp-6); }
.transparency-last-updated {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-dim);
}
.transparency-chip {
  padding: 4px 10px;
  background: var(--accent);
  color: var(--bg-light);
  border-radius: 999px;
  font-weight: 600;
}

.transparency-summary {
  padding: clamp(32px, 4vw, 56px) 0;
  border-top: 1px solid var(--rule-soft);
  border-bottom: 1px solid var(--rule-soft);
  background: var(--bg-elev);
}
.transparency-summary-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-4);
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
}
@media (min-width: 640px) {
  .transparency-summary-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 960px) {
  .transparency-summary-grid { grid-template-columns: repeat(4, 1fr); gap: var(--sp-6); }
}
.tsum-card {
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 10px;
  padding: var(--sp-6);
  text-align: left;
}
.tsum-label {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-dim);
  margin: 0 0 var(--sp-3);
  line-height: 1.4;
}
.tsum-value {
  font-family: var(--font-serif);
  font-weight: 800;
  font-size: clamp(28px, 3.4vw, 40px);
  color: var(--accent-2);
  line-height: 1;
  margin: 0 0 var(--sp-3);
  font-feature-settings: 'tnum';
}
.tsum-value-text {
  color: var(--accent);
  font-size: clamp(20px, 2.4vw, 26px);
}
.tsum-sub {
  font-size: 12px;
  color: var(--ink-dim);
  line-height: 1.5;
  margin: 0;
}

.transparency-ledger { padding: clamp(56px, 7vw, 96px) 0; text-align: center; }
.transparency-ledger .h2 { max-width: 22ch; margin-left: auto; margin-right: auto; margin-bottom: var(--sp-4); }
.transparency-ledger .lede { margin-left: auto; margin-right: auto; margin-bottom: var(--sp-8); }

.ledger-wrap {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 24px;
  overflow-x: auto;
}
.ledger-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-radius: 10px;
  overflow: hidden;
  text-align: left;
}
.ledger-table th,
.ledger-table td {
  padding: 14px 18px;
  border-bottom: 1px solid var(--rule-soft);
  vertical-align: top;
  font-size: 14px;
}
.ledger-table thead th {
  background: var(--bg-elev-2);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink-dim);
  font-weight: 600;
  border-bottom: 1.5px solid var(--rule);
  white-space: nowrap;
}
.ledger-table tbody tr:last-child td { border-bottom: none; }
.ldg-date { width: 120px; white-space: nowrap; font-family: var(--font-mono); color: var(--ink-dim); }
.ldg-cat { width: 150px; white-space: nowrap; color: var(--accent); font-weight: 600; }
.ldg-desc { color: var(--ink); line-height: 1.5; }
.ldg-amt { width: 130px; font-family: var(--font-mono); font-weight: 600; color: var(--ink); text-align: right; font-feature-settings: 'tnum'; white-space: nowrap; }
.ldg-restr { width: 110px; white-space: nowrap; color: var(--ink-dim); font-family: var(--font-mono); font-size: 12px; }

.ledger-empty td {
  padding: var(--sp-8) var(--sp-6);
  text-align: center;
  color: var(--ink-dim);
  font-size: 14px;
  line-height: 1.6;
}
.ledger-empty td strong { color: var(--ink); display: block; margin-bottom: 8px; font-family: var(--font-serif); font-size: 17px; }
.ledger-empty td p { margin: 0 0 6px; }
.ledger-empty td p:last-child { margin-bottom: 0; }

.transparency-months {
  padding: clamp(56px, 7vw, 96px) 0;
  background: var(--bg-elev);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  text-align: center;
}
.transparency-months .h2 { max-width: 22ch; margin: 0 auto var(--sp-4); }
.transparency-months .lede { margin: 0 auto var(--sp-8); }

.month-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  max-width: 720px;
  margin: 0 auto;
  padding: 0 24px;
  text-align: left;
}
.month-card {
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 10px;
  padding: var(--sp-6);
}
.month-title {
  font-family: var(--font-serif);
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 6px;
  color: var(--ink);
}
.month-status {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 var(--sp-3);
}
.month-body {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-dim);
  margin: 0;
}

.transparency-governance { padding: clamp(56px, 7vw, 96px) 0; text-align: left; }
.transparency-governance .eyebrow,
.transparency-governance .h2 { text-align: center; }
.transparency-governance .h2 { max-width: 22ch; margin: 0 auto var(--sp-8); }
.gov-facts {
  max-width: 720px;
  margin: 0 auto;
  padding: var(--sp-6) var(--sp-8);
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-radius: 10px;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-4);
}
@media (min-width: 640px) {
  .gov-facts { grid-template-columns: 200px 1fr; column-gap: var(--sp-6); row-gap: var(--sp-4); }
}
.gov-facts dt {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ink-dim);
  font-weight: 600;
  padding-top: 2px;
}
.gov-facts dd {
  margin: 0;
  font-size: 15px;
  color: var(--ink);
  line-height: 1.5;
}
.gov-facts dd em {
  color: var(--ink-dim);
  font-style: italic;
  font-size: 14px;
}

.transparency-board {
  padding: clamp(56px, 7vw, 96px) 0;
  background: var(--bg-elev);
  border-top: 1px solid var(--rule);
  text-align: center;
}
.transparency-board .h2 { max-width: 22ch; margin: 0 auto var(--sp-8); }
.board-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-6);
  max-width: 960px;
  margin: 0 auto;
  padding: 0 24px;
  text-align: left;
}
@media (min-width: 760px) {
  .board-grid { grid-template-columns: repeat(3, 1fr); }
}

/* Solo layout when only Josh is publicly named */
.board-grid.board-grid-solo {
  max-width: 560px;
}
@media (min-width: 760px) {
  .board-grid.board-grid-solo { grid-template-columns: 1fr; }
}

/* Board notes: 3-card grid sitting below the .board-grid (Joshua's solo card).
   Mirrors the .tsum-card pattern with a 4px accent left-border, elevated
   surface, hover lift. Three cards: governance fact (CNCA floor), trajectory
   (bootstrap, not ceiling), compensation (founder $0, staff capped). */
.board-notes-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sp-6);
  max-width: 1040px;
  margin: var(--sp-10) auto 0;
  padding: 0 24px;
  text-align: left;
}
@media (min-width: 760px) {
  .board-notes-grid { grid-template-columns: repeat(3, 1fr); }
}
.board-note-card {
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-radius: 12px;
  padding: var(--sp-7) var(--sp-6);
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
  display: flex;
  flex-direction: column;
}
.board-note-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent-soft);
  box-shadow: var(--shadow-soft);
}
.board-note-card--accent   { border-left: 4px solid var(--accent); }
.board-note-card--accent-2 { border-left: 4px solid var(--accent-2); }
.board-note-card--honey    { border-left: 4px solid var(--honey); }
.board-note-eyebrow {
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink-faint);
  margin: 0 0 var(--sp-3);
  font-weight: 600;
}
.board-note-card--accent   .board-note-eyebrow { color: var(--accent); }
.board-note-card--accent-2 .board-note-eyebrow { color: var(--accent-2-deep); }
.board-note-card--honey    .board-note-eyebrow { color: var(--accent-2-deep); }
.board-note-title {
  font-family: var(--font-serif);
  font-size: 19px;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.3;
  letter-spacing: var(--ls-tight);
  margin: 0 0 var(--sp-4);
}
.board-note-body {
  font-size: 14px;
  line-height: 1.65;
  color: var(--ink-dim);
  margin: 0;
  flex-grow: 1;
}
.board-note-body strong { color: var(--ink); }
@media (min-width: 880px) {
  .board-note-card { padding: var(--sp-8) var(--sp-7); }
}
.board-member {
  background: var(--bg);
  border: 1px solid var(--rule);
  border-radius: 10px;
  padding: var(--sp-6);
}
.board-name {
  font-family: var(--font-serif);
  font-size: 20px;
  font-weight: 700;
  color: var(--ink);
  margin: 0 0 6px;
  letter-spacing: var(--ls-tight);
}
.board-role {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--accent-2-deep);
  font-weight: 600;
  margin: 0 0 var(--sp-3);
}
.board-bio {
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-dim);
  margin: 0 0 var(--sp-4);
}
.board-salary {
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--ink);
  margin: 0;
  padding-top: var(--sp-3);
  border-top: 1px solid var(--rule);
}
.board-salary strong { color: var(--accent); }

.transparency-annual { padding: clamp(56px, 7vw, 96px) 0; text-align: center; }
.annual-placeholder {
  max-width: 640px;
  margin: 0 auto;
  padding: var(--sp-8) var(--sp-6);
  background: var(--bg-elev);
  border: 1px dashed var(--rule);
  border-radius: 10px;
}
.annual-placeholder p {
  font-family: var(--font-serif);
  font-size: 18px;
  color: var(--ink);
  line-height: 1.5;
  margin: 0 0 var(--sp-4);
}
.annual-placeholder p:last-child { margin-bottom: 0; }
.annual-placeholder .annual-sub {
  font-family: var(--font-sans);
  font-size: 14px;
  color: var(--ink-dim);
  font-style: normal;
  line-height: 1.6;
}

/* =========================================================
   TRANSPARENCY POLISH (added 2026-05-20)
   Hero pillars strip, card hovers, H2 underlines, refusal
   tint, governance PDF link styling. Scoped via parent
   .transparency-* and .refusal selectors so nothing leaks.
   ========================================================= */

/* Hero pillars: four commitment chips under the lede. Each chip is a soft
   pill with a left dot indicator. All dots are the same accent color so
   the chips read as parallel commitments, not as a traffic light. Text
   wraps naturally on mobile (no white-space:nowrap) and the row gap +
   column gap let chips reflow without crowding. */
.transparency-pillars {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--sp-3) var(--sp-4);
  list-style: none;
  margin: var(--sp-2) auto var(--sp-6);
  padding: 0;
  max-width: 760px;
}
.transparency-pillar {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-dim);
  line-height: 1.35;
  padding: 8px 14px;
  background: var(--bg-elev);
  border: 1px solid var(--rule);
  border-radius: 999px;
  transition: border-color .15s ease, color .15s ease;
}
.transparency-pillar:hover {
  border-color: var(--accent-soft);
  color: var(--ink);
}
.transparency-pillar-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--accent);
  flex-shrink: 0;
}

/* H2 accent-underline rule, scoped to transparency sections.
   A 64px-wide --accent rule below each centered H2 to give the
   page a consistent visual rhythm. */
.transparency-summary .h2,
.transparency-ledger .h2,
.transparency-months .h2,
.refusal .h2,
.transparency-governance .h2,
.transparency-board .h2,
.transparency-annual .h2 {
  position: relative;
}
.transparency-summary .h2::after,
.transparency-ledger .h2::after,
.transparency-months .h2::after,
.refusal .h2::after,
.transparency-governance .h2::after,
.transparency-board .h2::after,
.transparency-annual .h2::after {
  content: '';
  display: block;
  width: 56px;
  height: 3px;
  background: var(--accent);
  margin: var(--sp-3) auto 0;
  border-radius: 2px;
}

/* Hover lift on the summary cards + monthly cards. Pattern
   matches .steward-card and .board-note-card. */
.tsum-card {
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.tsum-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent-soft);
  box-shadow: var(--shadow-soft);
}
.month-card {
  transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.month-card:hover {
  transform: translateY(-2px);
  border-color: var(--accent-soft);
  box-shadow: var(--shadow-soft);
}

/* Subtle danger tint on the refusal list items. Codes "refusal"
   visually without shouting. Falls back to var(--bg-elev) on
   engines without color-mix() support. */
.refusal-list li {
  background: var(--bg-elev);
  background: color-mix(in srgb, var(--danger) 4%, var(--bg-elev));
}

/* Governance PDF links: serif body type, accent underline, hover. */
.gov-doc-link {
  color: var(--accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
  font-weight: 600;
  transition: color .15s ease;
}
.gov-doc-link:hover { color: var(--accent-2-deep); }

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition-duration: 0.01ms !important;
  }
}