/* Concentric Manufacturing — design tokens. Import once, globally. */
@import url("https://fonts.googleapis.com/css2?family=Big+Shoulders:wght@800&family=Schibsted+Grotesk:wght@400;500;600&family=IBM+Plex+Mono:wght@400&display=swap");

:root, [data-theme="dark"] {
  /* Dark theme (default: decks, social; website header and loader) */
  --ground: #000000;
  --surface: #0D0D0D;
  --surface-raised: #171717;
  --line: #2A2A2A;
  --line-strong: #8A8A8A;
  --ink: #FFFFFF;
  --ink-muted: #A3A3A3;
  --signal: #FF7A1A;
  --on-signal: #000000;

  --font-display: "Big Shoulders", "Big Shoulders Display", "Arial Narrow", sans-serif;
  --font-sans: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 48px;
  --space-5: 96px;

  --radius-none: 0px;
  --radius-sm: 2px;
  --radius-full: 9999px;
}

/* Paper theme: printed/PDF docs (quotes, invoices, CoCs, test reports) */
[data-theme="paper"] {
  --ground: #FFFFFF;
  --surface: #F5F5F5;
  --surface-raised: #EDEDED;
  --line: #D4D4D4;
  --line-strong: #737373;
  --ink: #000000;
  --ink-muted: #525252;
  --signal: #C2410C;
  --on-signal: #FFFFFF;
}

/* Light theme: website pages below the black header */
[data-theme="light"] {
  --ground: #F5F5F5;
  --surface: #EDEDED;
  --surface-raised: #FFFFFF;
  --line: #D4D4D4;
  --line-strong: #737373;
  --ink: #000000;
  --ink-muted: #525252;
  --signal: #C2410C;
  --on-signal: #FFFFFF;
}

/* Type styles */
.t-display  { font: 800 96px/0.95 var(--font-display); letter-spacing: 0.005em; text-transform: uppercase; }
.t-h1       { font: 800 64px/0.95 var(--font-display); letter-spacing: 0.005em; text-transform: uppercase; }
.t-h2       { font: 600 28px/34px var(--font-sans); letter-spacing: -0.015em; }
.t-h3       { font: 600 22px/28px var(--font-sans); letter-spacing: -0.01em; }
.t-lead     { font: 400 18px/28px var(--font-sans); }
.t-body     { font: 400 16px/24px var(--font-sans); }
.t-small    { font: 400 13px/20px var(--font-sans); }
.t-eyebrow  { font: 600 12px/16px var(--font-sans); letter-spacing: 0.28em; text-transform: uppercase; color: var(--ink-muted); }
.t-nav      { font: 600 13px/16px var(--font-sans); letter-spacing: 0.12em; text-transform: uppercase; }
.t-data     { font: 400 14px/20px var(--font-mono); }
.t-wordmark { font: 800 22px/26px var(--font-display); letter-spacing: 0.36em; text-transform: uppercase; }
.t-descriptor { font: 500 13px/16px var(--font-sans); letter-spacing: 0.5em; text-transform: uppercase; color: var(--ink-muted); }

/* Phones: scale headlines down */
@media (max-width: 640px) {
  .t-display { font-size: 56px; }
  .t-h1 { font-size: 44px; }
}

/* Base */
html, body { background: var(--ground); color: var(--ink); font-family: var(--font-sans); margin: 0; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }