.skip-link { position: fixed; inset: var(--space-2) auto auto var(--space-2); z-index: 10; padding: var(--space-2) var(--space-3); background: var(--color-deep); color: var(--color-signal); transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }

.site-header,
.hero,
.section,
.contact,
footer { width: min(calc(100% - var(--space-6)), var(--container)); margin-inline: auto; }

.site-header { min-height: 5rem; display: flex; align-items: center; justify-content: space-between; border-bottom: var(--border-thin); }
.site-header nav { display: flex; flex-wrap: wrap; gap: var(--space-5); font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.04em; }
.site-header nav a,
.wordmark { text-decoration: none; }
.wordmark { font: 700 0.9rem/1 var(--font-mono); letter-spacing: -0.06em; }
.wordmark span { color: var(--color-alert); }

main { overflow: hidden; }
h1,
h2,
h3,
p { margin-top: 0; }
h1,
h2,
h3 { text-wrap: balance; }

.hero { min-height: min(47rem, calc(100vh - 5rem)); display: grid; grid-template-columns: minmax(0, 5fr) minmax(22rem, 6fr); align-items: center; gap: var(--space-8); padding-block: var(--space-8); }
.hero-copy { max-width: 38rem; }
.eyebrow,
.section-index { margin: 0 0 var(--space-4); color: var(--color-muted); font: 0.7rem/1.3 var(--font-mono); letter-spacing: 0.08em; }
h1 { margin-bottom: var(--space-5); font: 400 clamp(3rem, 5.7vw, 5.25rem)/1 var(--font-display); letter-spacing: -0.07em; }
h1 em { color: var(--color-trace); font-style: italic; }
.hero-lede { max-width: 36rem; margin-bottom: var(--space-6); color: var(--color-muted); font-size: clamp(1.02rem, 1.5vw, 1.16rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-bottom: var(--space-7); }
.hero-facts { display: flex; flex-wrap: wrap; gap: var(--space-6); margin: 0; }
.hero-facts div { display: grid; gap: var(--space-1); }
.hero-facts dt { color: var(--color-muted); font: 0.68rem/1.2 var(--font-mono); text-transform: uppercase; letter-spacing: 0.07em; }
.hero-facts dd { margin: 0; font: 0.78rem/1.3 var(--font-mono); }

.section { padding-block: clamp(4.5rem, 8vw, 6.5rem); border-top: var(--border-thin); }
.section-intro { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(18rem, 0.75fr); gap: var(--space-8); align-items: end; margin-bottom: var(--space-7); }
.section-intro h2,
.contact h2 { margin: 0; font: 400 clamp(2.2rem, 4vw, 3.75rem)/1.04 var(--font-display); letter-spacing: -0.065em; }
.section-intro > p { max-width: 31rem; margin: 0; color: var(--color-muted); font-size: 1.02rem; }
.section-intro--compact { align-items: baseline; margin-bottom: var(--space-6); }
.section-intro--compact h2 { font-size: clamp(2rem, 3vw, 3rem); }

.archive-table { border-top: var(--border-thin); }
.archive-table table { width: 100%; border-collapse: collapse; }
.archive-table tr { display: grid; grid-template-columns: 1.15fr 2fr 2.4fr; gap: var(--space-5); padding: var(--space-4) 0; border-bottom: var(--border-thin); font-size: 0.95rem; }
.archive-table th { color: var(--color-muted); font: 0.72rem/1.2 var(--font-mono); letter-spacing: 0.05em; text-align: left; }
.archive-table td:first-child { color: var(--color-muted); font: 0.72rem/1.45 var(--font-mono); }

.background-ledger { border-top: var(--border-thin); }
.ledger-group { padding-block: var(--space-6); border-bottom: var(--border-thin); }
.ledger-group h3 { margin: 0 0 var(--space-4); font: 700 0.84rem/1.2 var(--font-mono); letter-spacing: 0.06em; }
.ledger-row { display: grid; grid-template-columns: 11.5rem minmax(12rem, 1.25fr) minmax(13rem, 1fr); gap: var(--space-5); padding-block: var(--space-3); }
.ledger-row p { margin: 0; }
.ledger-date,
.ledger-detail { color: var(--color-muted); font-size: 0.88rem; }
.ledger-date { font-family: var(--font-mono); font-size: 0.76rem; }
.ledger-primary { font-weight: 700; }

.contact { margin-top: var(--space-7); padding: var(--space-8) 0 var(--space-9); border-top: var(--border-thin); }
.contact h2 { max-width: 50rem; margin-bottom: var(--space-7); }
footer { display: flex; justify-content: space-between; gap: var(--space-4); padding: var(--space-5) 0; border-top: var(--border-thin); color: var(--color-muted); font: 0.68rem/1.4 var(--font-mono); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

@media (max-width: 58rem) {
  .hero { grid-template-columns: 1fr; gap: var(--space-7); padding-block: var(--space-8); }
  .trace-card { max-width: 38rem; width: 100%; }
  .section-intro { grid-template-columns: 1fr; gap: var(--space-5); }
  .section-intro > p { max-width: 38rem; }
  .ledger-row { grid-template-columns: 9rem minmax(0, 1fr); }
  .ledger-detail { grid-column: 2; }
}

@media (max-width: 40rem) {
  .site-header { min-height: 6.5rem; align-items: flex-start; padding-top: var(--space-4); gap: var(--space-4); }
  .site-header nav { justify-content: flex-end; gap: var(--space-3); font-size: 0.62rem; }
  .hero { min-height: auto; }
  .section { padding-block: var(--space-8); }
  h1 { font-size: clamp(2.1rem, 9vw, 3rem); }
  .section-intro { gap: var(--space-4); margin-bottom: var(--space-6); }
  .section-intro h2,
  .contact h2 { font-size: clamp(2.15rem, 11vw, 3rem); }
  .archive-table tr { grid-template-columns: 1fr; gap: var(--space-1); }
  .archive-table thead { display: none; }
  .archive-table td:first-child { font-size: 0.72rem; }
  .ledger-group { padding-block: var(--space-5); }
  .ledger-row { grid-template-columns: 1fr; gap: var(--space-1); padding-block: var(--space-4); }
  .ledger-detail { grid-column: auto; }
  .ledger-date { order: 3; margin-top: var(--space-1) !important; }
  footer { display: block; }
  footer p + p { margin-top: var(--space-2); }
}
