* { box-sizing: border-box; }

html {
  color-scheme: light;
  scroll-behavior: smooth;
  background: var(--color-page);
}

body {
  margin: 0;
  background: var(--color-page);
  color: var(--color-text-onink);
  font-family: var(--font-body);
  font-size: var(--type-scale-body);
  line-height: var(--line-height-body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img, svg { max-width: 100%; }
button, input, select, textarea { font: inherit; }

h1, h2, h3 {
  color: var(--color-ink);
  font-family: var(--font-display);
  line-height: var(--line-height-heading);
  letter-spacing: var(--tracking-heading);
  text-wrap: balance;
}

h1 {
  margin: 0 0 var(--space-5);
  font-size: var(--type-scale-page-title);
  font-weight: 760;
}

h2 {
  margin: var(--space-8) 0 var(--space-4);
  font-size: var(--type-scale-h1);
  font-weight: 720;
}

h3 {
  margin: var(--space-6) 0 var(--space-3);
  font-size: var(--type-scale-h2);
  font-weight: 700;
}

p, li { max-width: 70ch; }
p { margin: 0 0 var(--space-4); }
ul, ol { padding-left: 1.25rem; }
li + li { margin-top: var(--space-2); }
strong { color: var(--color-ink); }

code {
  padding: 0.14em 0.38em;
  border: 1px solid var(--color-panel-border);
  border-radius: 6px;
  background: var(--color-surface-subtle);
  color: var(--color-ink);
  font-family: var(--font-mono);
  font-size: 0.9em;
}

pre {
  overflow-x: auto;
  margin: var(--space-5) 0;
  padding: var(--space-5);
  border: 1px solid #263247;
  border-radius: var(--radius-md);
  background: var(--color-ink-raised);
  color: var(--color-text-inverse);
  box-shadow: var(--shadow-card);
}

pre code {
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
}

a {
  color: #245a95;
  text-decoration-color: rgba(36, 90, 149, 0.35);
  text-underline-offset: 0.2em;
  transition: color var(--motion-duration-fast) var(--motion-easing-standard), text-decoration-color var(--motion-duration-fast) var(--motion-easing-standard);
}

a:hover {
  color: #163f6d;
  text-decoration-color: currentColor;
}

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, .table-scroll:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: var(--space-3) var(--space-5);
  border-radius: var(--radius-sm);
  background: var(--color-ink);
  color: var(--color-text-inverse);
}
.skip-link:focus { left: var(--space-3); top: var(--space-3); }

.site-header {
  position: sticky;
  top: 0;
  z-index: 30;
  border-bottom: 1px solid rgba(185, 196, 211, 0.72);
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(16px);
}

.site-header__inner {
  max-width: var(--container-wide);
  min-height: 72px;
  margin: 0 auto;
  padding: 0 var(--space-5);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-6);
}

.site-header__brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
  color: var(--color-ink);
  text-decoration: none;
  font-family: var(--font-display);
  font-size: 1rem;
  font-weight: 760;
  letter-spacing: -0.02em;
}

.site-header__brand-mark {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid var(--color-panel-border);
  border-radius: 10px;
  background: var(--color-surface);
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.04);
}

.site-header__nav {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: var(--space-2);
  margin: 0;
  padding: 0;
}

.site-header__nav a {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  padding: 0 var(--space-3);
  border-radius: var(--radius-sm);
  color: var(--color-text-onink-muted);
  text-decoration: none;
  font-size: var(--type-scale-small);
  font-weight: 600;
}

.site-header__nav a:hover,
.site-header__nav a[aria-current='page'] {
  background: var(--color-surface-subtle);
  color: var(--color-ink);
}

.site-header__nav .site-header__cta {
  margin-left: var(--space-2);
  padding-inline: var(--space-4);
  background: var(--color-ink);
  color: var(--color-text-inverse);
}
.site-header__nav .site-header__cta:hover,
.site-header__nav .site-header__cta[aria-current='page'] {
  background: var(--color-ink-soft);
  color: var(--color-text-inverse);
}

main {
  max-width: var(--container-wide);
  margin: 0 auto;
  padding: var(--space-8) var(--space-5) var(--space-10);
}

main > section + section { margin-top: var(--space-10); }
.container-narrow { max-width: var(--container-narrow); margin-inline: auto; }
.container-wide { max-width: var(--container-wide); margin-inline: auto; }

.eyebrow,
.section-kicker,
.audit-board__label,
.resource-card__meta {
  margin: 0 0 var(--space-3);
  color: var(--color-signal-amber);
  font-family: var(--font-mono);
  font-size: var(--type-scale-caption);
  font-weight: 700;
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
}

.lede {
  max-width: 64ch;
  color: var(--color-text-onink-muted);
  font-size: var(--type-scale-lead);
  line-height: 1.6;
}

.card {
  background: var(--color-surface);
  border: var(--border-hairline);
  border-radius: var(--radius-card);
  padding: var(--space-6);
  box-shadow: var(--shadow-card);
}

.status-note {
  border-left: 3px solid var(--color-signal-amber);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: var(--space-4) var(--space-5);
  background: var(--color-signal-amber-soft);
}

/* Homepage */
.home-page { display: grid; gap: var(--space-10); }

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(380px, 0.92fr);
  align-items: center;
  gap: clamp(48px, 7vw, 96px);
  min-height: 520px;
}

.hero__copy h1 {
  max-width: 780px;
  margin-bottom: var(--space-5);
  font-size: var(--type-scale-hero);
  line-height: 1.01;
}

.hero__lead {
  max-width: 650px;
  margin-bottom: var(--space-5);
  color: var(--color-text-onink-muted);
  font-size: var(--type-scale-lead);
  line-height: 1.62;
}

.hero__trust {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  max-width: 610px;
  margin: 0;
  color: var(--color-text-onink-muted);
  font-size: var(--type-scale-small);
}

.hero__trust::before {
  content: '';
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  margin-top: 0.55em;
  border-radius: 50%;
  background: var(--color-pass);
  box-shadow: 0 0 0 4px var(--color-pass-soft);
}

.audit-board {
  overflow: hidden;
  border: 1px solid #28344a;
  border-radius: var(--radius-xl);
  background: linear-gradient(155deg, #172236 0%, #101827 100%);
  color: var(--color-text-inverse);
  box-shadow: 0 28px 80px rgba(17, 24, 39, 0.2);
}

.audit-board__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-6);
  border-bottom: 1px solid rgba(185, 196, 211, 0.18);
}

.audit-board__header h2 {
  margin: 0;
  color: var(--color-text-inverse);
  font-size: 1.35rem;
  letter-spacing: -0.02em;
}

.audit-board__label { color: #e3a944; }
.audit-board__mode {
  flex: 0 0 auto;
  padding: 6px 9px;
  border: 1px solid rgba(185, 196, 211, 0.28);
  border-radius: var(--radius-pill);
  color: var(--color-text-inverse-muted);
  font-size: 0.72rem;
  font-weight: 650;
}

.audit-board__rows { padding: var(--space-2) var(--space-4); }
.audit-board__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4) var(--space-2);
  border-bottom: 1px solid rgba(185, 196, 211, 0.13);
}
.audit-board__row:last-child { border-bottom: 0; }
.audit-board__identity { display: grid; gap: 2px; }
.audit-board__identity strong { color: var(--color-text-inverse); font-size: 0.95rem; }
.audit-board__identity span { color: var(--color-text-inverse-muted); font-size: 0.78rem; }
.audit-board__status {
  min-width: 76px;
  padding: 7px 10px;
  border-radius: var(--radius-pill);
  text-align: center;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.audit-board__status--open { background: rgba(39, 162, 119, 0.18); color: #80d8b7; }
.audit-board__status--blocked { background: rgba(213, 76, 61, 0.18); color: #ff9f94; }
.audit-board__status--review { background: rgba(216, 156, 47, 0.2); color: #f6cb74; }
.audit-board__footnote {
  max-width: none;
  margin: 0;
  padding: var(--space-5) var(--space-6);
  background: rgba(255, 255, 255, 0.035);
  color: var(--color-text-inverse-muted);
  font-size: 0.8rem;
}

.audit-start {
  display: grid;
  grid-template-columns: minmax(220px, 0.75fr) minmax(0, 1.7fr);
  gap: var(--space-7);
  align-items: center;
  margin-top: calc(var(--space-8) * -1);
  padding: var(--space-6);
  border: 1px solid var(--color-panel-border);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
  box-shadow: var(--shadow-card);
}
.audit-start h2 { margin: 0 0 var(--space-3); font-size: 1.55rem; }
.audit-start__intro p { margin: 0; color: var(--color-text-onink-muted); font-size: var(--type-scale-small); }
.audit-start__form { display: grid; gap: var(--space-4); }
.audit-start__fields {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(210px, 0.85fr) auto;
  gap: var(--space-3);
  align-items: end;
}
.form-field { display: grid; gap: 7px; }
.form-field label { color: var(--color-ink); font-size: 0.78rem; font-weight: 700; }
.audit-start__note { margin: 0; color: var(--color-text-onink-muted); font-size: 0.78rem; }

.section-heading {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: var(--space-8);
  align-items: end;
  margin-bottom: var(--space-7);
}
.section-heading h2 { margin: 0; }
.section-heading p { margin: 0; color: var(--color-text-onink-muted); font-size: var(--type-scale-lead); }

.feature-grid,
.resource-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
}

.feature-grid--four { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.feature-card,
.resource-card {
  min-height: 100%;
  padding: var(--space-6);
  border: var(--border-hairline);
  border-radius: var(--radius-card);
  background: var(--color-surface);
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.025);
  transition: transform var(--motion-duration-default) var(--motion-easing-standard), box-shadow var(--motion-duration-default) var(--motion-easing-standard), border-color var(--motion-duration-default) var(--motion-easing-standard);
}

.feature-card:hover,
.resource-card:hover {
  transform: translateY(-2px);
  border-color: var(--color-panel-border-strong);
  box-shadow: var(--shadow-card-hover);
}

.feature-card__number {
  display: inline-grid;
  width: 34px;
  height: 34px;
  margin-bottom: var(--space-5);
  place-items: center;
  border-radius: 10px;
  background: var(--color-surface-subtle);
  color: var(--color-ink-soft);
  font-family: var(--font-mono);
  font-size: 0.75rem;
  font-weight: 700;
}
.feature-card h3,
.resource-card h2,
.resource-card h3 { margin: 0 0 var(--space-3); font-size: 1.1rem; letter-spacing: -0.025em; }
.feature-card p,
.resource-card p { margin: 0; color: var(--color-text-onink-muted); font-size: 0.92rem; }
.resource-card a { color: var(--color-ink); text-decoration: none; }
.resource-card a::after { content: ' →'; color: var(--color-signal-amber); }

.evidence-section,
.policy-section {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: var(--space-9);
  align-items: start;
}

.evidence-list {
  display: grid;
  gap: var(--space-3);
}
.evidence-list__item {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: var(--space-4);
  align-items: start;
  padding: var(--space-4);
  border-bottom: var(--border-hairline);
}
.evidence-list__item:last-child { border-bottom: 0; }
.evidence-list__item p { margin: 2px 0 0; color: var(--color-text-onink-muted); font-size: 0.88rem; }

.policy-panel {
  padding: clamp(32px, 5vw, 64px);
  border-radius: var(--radius-xl);
  background: var(--color-ink);
  color: var(--color-text-inverse);
}
.policy-panel h2, .policy-panel h3, .policy-panel strong { color: var(--color-text-inverse); }
.policy-panel p { color: var(--color-text-inverse-muted); }
.policy-comparison { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); margin-top: var(--space-6); }
.policy-comparison__item {
  padding: var(--space-5);
  border: 1px solid rgba(185, 196, 211, 0.2);
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.04);
}
.policy-comparison__item h3 { margin-top: 0; font-size: 1rem; }
.policy-comparison__item p { margin-bottom: 0; font-size: 0.88rem; }

.reference-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.reference-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-5);
  border: var(--border-hairline);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  text-decoration: none;
}
.reference-item:hover { border-color: var(--color-panel-border-strong); }
.reference-item__identity { display: grid; gap: 3px; }
.reference-item__identity strong { color: var(--color-ink); }
.reference-item__identity span { color: var(--color-text-onink-muted); font-size: 0.82rem; }
.reference-item__arrow { color: var(--color-signal-amber); font-size: 1.2rem; }

.cta-panel {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-7);
  align-items: center;
  padding: clamp(32px, 5vw, 64px);
  border: 1px solid #27334a;
  border-radius: var(--radius-xl);
  background: linear-gradient(145deg, #111827, #1c2940);
  color: var(--color-text-inverse);
}
.cta-panel h2 { margin: 0 0 var(--space-3); color: var(--color-text-inverse); }
.cta-panel p { margin: 0; color: var(--color-text-inverse-muted); }
.cta-panel .button { background: var(--color-surface); color: var(--color-ink); }

/* Forms and controls */
form { display: grid; gap: var(--space-4); }
label, legend { font-weight: 650; }
input[type='text'], input[type='url'], select {
  width: 100%;
  min-height: var(--control-height-lg);
  border: 1px solid var(--color-panel-border-strong);
  border-radius: var(--radius-sm);
  padding: 0 var(--control-padding-x);
  background: var(--color-surface);
  color: var(--color-ink);
  transition: border-color var(--motion-duration-fast) var(--motion-easing-standard), box-shadow var(--motion-duration-fast) var(--motion-easing-standard);
}
input[type='text']:hover, input[type='url']:hover, select:hover { border-color: #98a7ba; }
input::placeholder { color: #8a95a6; }
fieldset {
  display: grid;
  gap: var(--space-3);
  margin: 0;
  border: var(--border-hairline);
  border-radius: var(--radius-sm);
  padding: var(--space-4);
  background: var(--color-surface);
}
fieldset label { font-weight: 400; }
button, .button {
  display: inline-flex;
  min-height: var(--control-height-lg);
  width: fit-content;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-ink);
  border-radius: var(--radius-sm);
  padding: 0 var(--control-padding-x);
  background: var(--color-ink);
  color: var(--color-text-inverse);
  text-decoration: none;
  font-weight: 700;
  cursor: pointer;
  transition: transform var(--motion-duration-fast) var(--motion-easing-standard), background var(--motion-duration-fast) var(--motion-easing-standard);
}
button:hover, .button:hover { transform: translateY(-1px); background: var(--color-ink-soft); color: var(--color-text-inverse); }
button:disabled { cursor: not-allowed; opacity: 0.65; }
.button--secondary { border-color: var(--color-panel-border-strong); background: var(--color-surface); color: var(--color-ink); }
.button--secondary:hover { background: var(--color-surface-subtle); color: var(--color-ink); }

/* Content hubs and articles */
.content-hub__header { max-width: 760px; margin-bottom: var(--space-8); }
.content-hub__header h1 { margin-bottom: var(--space-4); }
.content-hub__header p { color: var(--color-text-onink-muted); font-size: var(--type-scale-lead); }

article.container-narrow {
  padding: var(--space-2) 0 var(--space-8);
}
article.container-narrow > p:first-child {
  margin-bottom: var(--space-5);
  color: var(--color-text-onink-muted);
  font-size: var(--type-scale-small);
}
article.container-narrow > h1 { max-width: 850px; }
article.container-narrow > .lede { margin-bottom: var(--space-8); }
article.container-narrow h2 { padding-top: var(--space-2); }
article.container-narrow blockquote {
  margin: var(--space-6) 0;
  padding: var(--space-4) var(--space-5);
  border-left: 3px solid var(--color-signal-amber);
  background: var(--color-signal-amber-soft);
  color: var(--color-ink-soft);
}

.table-scroll {
  overflow-x: auto;
  border: var(--border-hairline);
  border-radius: var(--radius-card);
  background: var(--color-surface);
  box-shadow: 0 1px 2px rgba(17, 24, 39, 0.03);
}
table { width: 100%; border-collapse: collapse; background: var(--color-surface); }
th, td { padding: var(--space-4) var(--space-5); border-bottom: var(--border-hairline); text-align: left; vertical-align: top; }
tr:last-child td { border-bottom: 0; }
th {
  background: var(--color-surface-subtle);
  color: var(--color-text-onink-muted);
  font-family: var(--font-body);
  font-size: var(--type-scale-caption);
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: var(--tracking-label);
}
.definition-grid {
  display: grid;
  grid-template-columns: minmax(11rem, 0.55fr) 1fr;
  overflow: hidden;
  border: var(--border-hairline);
  border-radius: var(--radius-card);
  background: var(--color-panel-border);
  gap: 1px;
}
.definition-grid dt, .definition-grid dd { margin: 0; padding: var(--space-4) var(--space-5); background: var(--color-surface); }
.definition-grid dt { color: var(--color-text-onink-muted); font-size: var(--type-scale-small); font-weight: 700; }

.evidence-badge {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  margin: 2px;
  padding: 0 10px;
  border-radius: var(--radius-pill);
  font-family: var(--font-body);
  font-size: 0.68rem;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: 0.045em;
}
.evidence-badge--observed { background: #e8f1fb; color: #1f5d9f; }
.evidence-badge--documented { background: #eeeafd; color: #5545aa; }
.evidence-badge--simulated { border: 1px solid #78a5d5; background: #f5f9fd; color: #2f659d; }
.evidence-badge--heuristic { border: 1px solid #c9aa69; background: #fffaf0; color: #755315; }
.evidence-badge--inferred { border: 1px solid #aab2bf; background: #f8f9fb; color: #596273; }
.evidence-badge--manual { border: 1px dashed #8e9aae; background: #f8f9fb; color: #5e6a7d; }

.content-meta {
  margin-top: var(--space-9);
  padding: var(--space-6);
  border: var(--border-hairline);
  border-radius: var(--radius-card);
  background: var(--color-surface-subtle);
  color: var(--color-text-onink-muted);
  font-size: var(--type-scale-small);
}
.content-meta h2 { margin-top: var(--space-5); font-size: 1.1rem; color: var(--color-ink); }

.site-footer {
  border-top: var(--border-hairline);
  background: var(--color-surface);
}
.site-footer__inner {
  max-width: var(--container-wide);
  margin: 0 auto;
  padding: var(--space-8) var(--space-5);
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto;
  align-items: start;
  gap: var(--space-7);
  color: var(--color-text-onink-muted);
  font-size: var(--type-scale-small);
}
.site-footer__brand { display: grid; gap: var(--space-2); }
.site-footer__brand strong { font-size: 1rem; }
.site-footer__brand p { margin: 0; }
.site-footer__links { list-style: none; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--space-4); margin: 0; padding: 0; }
.site-footer__links li + li { margin-top: 0; }
.site-footer__links a { color: var(--color-text-onink-muted); text-decoration: none; }
.site-footer__links a:hover { color: var(--color-ink); }

@media (max-width: 1050px) {
  .hero { grid-template-columns: 1fr 0.9fr; gap: var(--space-7); }
  .feature-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .audit-start { grid-template-columns: 1fr; }
  .audit-start__fields { grid-template-columns: 1fr 1fr; }
  .audit-start__fields button { width: 100%; grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .site-header__inner { min-height: auto; padding-block: var(--space-3); align-items: flex-start; flex-direction: column; gap: var(--space-3); }
  .site-header__nav { width: 100%; justify-content: flex-start; overflow-x: auto; padding-bottom: 2px; }
  .site-header__nav .site-header__cta { margin-left: 0; }
  main { padding-top: var(--space-7); }
  .hero { grid-template-columns: 1fr; min-height: auto; }
  .hero__copy h1 { max-width: 720px; }
  .audit-start { margin-top: calc(var(--space-6) * -1); }
  .section-heading, .evidence-section, .policy-section { grid-template-columns: 1fr; gap: var(--space-5); }
  .feature-grid, .resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reference-list { grid-template-columns: 1fr; }
  .cta-panel { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  main { padding-inline: var(--space-4); padding-bottom: var(--space-9); }
  main > section + section, .home-page { gap: var(--space-9); }
  .hero__copy h1 { font-size: clamp(2.65rem, 14vw, 3.6rem); }
  .audit-board__header { padding: var(--space-5); }
  .audit-board__rows { padding-inline: var(--space-3); }
  .audit-board__footnote { padding: var(--space-4) var(--space-5); }
  .audit-start { padding: var(--space-5); }
  .audit-start__fields { grid-template-columns: 1fr; }
  .audit-start__fields button { grid-column: auto; }
  .feature-grid, .feature-grid--four, .resource-grid { grid-template-columns: 1fr; }
  .policy-comparison { grid-template-columns: 1fr; }
  .definition-grid { grid-template-columns: 1fr; }
  .definition-grid dd { padding-top: 0; }
  .site-footer__inner { grid-template-columns: 1fr; }
  .site-footer__links { justify-content: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0ms !important; animation-duration: 0ms !important; }
}