/* Defense Tech Base design tokens. */

:root {
  --bg: #c2cfb5;
  --forest-hero: #101d19;
  --section-sage: #acb99e;
  --section-light-sage: #c0ccae;
  --surface-light: #cbd5ba;
  --heading-ink: #012d4e;
  --heading-inverse: #edf3dc;
  --steel-blue: #244966;
  --surface: #d2dcc7;
  --surface-raised: #dbe3d1;
  --surface-sunken: #b3c2a5;
  --ink: #15241d;
  --muted: #3b4c42;
  --meta: #44574a;
  --forest: #0f1b17;
  --forest-mid: #142420;
  --forest-raised: #1c312a;
  --forest-high: #243d33;
  --inverse: #e4ecdc;
  --muted-inverse: #b5c4b0;
  --accent: #3c94c4;
  --accent-hover: #4aa2d1;
  --accent-ink: #0b1e27;
  --accent-soft: #a6c9dc;
  --border: rgba(23,38,31,.16);
  --border-strong: #627568;
  --border-dark: rgba(214,228,204,.12);
  --border-dark-strong: rgba(214,228,204,.2);
  --focus: #15241d;
  --warning: #6e491b;
  --danger: #8a302b;
  --success: #285c37;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --s1: 4px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 20px;
  --s6: 24px;
  --s8: 32px;
  --s12: 48px;
  --s16: 64px;
  --shell: 1312px;
  /* Existing application names remain aliases of the approved semantic roles. */
  --graphite: var(--forest);
  --graphite-raised: var(--forest-raised);
  --steel: var(--forest-high);
  --paper: var(--bg);
  --paper-sunk: var(--surface-sunken);
  --surface-bright: var(--surface-raised);
  --ink-soft: var(--muted);
  --ink-inverse: var(--inverse);
  --accent-deep: var(--ink);
  --accent-wash: var(--surface-raised);
  --signal: var(--warning);
  --line: var(--border);
  --line-dark: var(--border-dark);

  --font-display: 'Inter', system-ui, sans-serif;
  --font-entity: 'Source Serif 4', Georgia, serif;
  --font-body: 'Inter', system-ui, sans-serif;
  --font-ui: 'Inter', system-ui, sans-serif;

  --step--1: 0.78rem;
  --step-0: 0.98rem;
  --step-1: 1.2rem;
  --step-2: 1.75rem;
  --step-3: 2.65rem;
  --step-4: 4rem;

  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.25rem;
  --s-6: 1.5rem;
  --s-8: 2rem;
  --s-10: 2.5rem;
  --s-12: 3rem;
  --s-16: 4rem;
  --s-24: 6rem;

  --r-sm: var(--radius-sm);
  --r-md: var(--radius-md);
  --r-lg: var(--radius-md);
  --measure: 68ch;
  --content-width: 1312px;
  --page-gutter: var(--s-16);
  --site-nav-offset: 5.5rem;
}

@media (max-width: 54rem) {
  :root {
    --page-gutter: var(--s-8);
  }
}

@media (max-width: 48rem) {
  :root {
    --step-3: 2.1rem;
    --step-4: 2.85rem;
    --s-16: 3rem;
    --s-24: 4rem;
  }
}

@media (max-width: 42rem) {
  :root {
    --page-gutter: var(--s-4);
  }
}