:root {
  /* terminal — dark developer-tool preset. Structure forked from teal
     (widest container, 1728), palette from the netok landing (GitHub-dark
     family: near-black blue-tinted bg, green accent, mono eyebrows). */

  /* Typography — Families & Weights */
  --font-heading: "Funnel Sans", sans-serif;
  --font-body: "Inter", sans-serif;
  --font-mono: "Martian Mono", monospace;
  --font-eyebrow: var(--font-mono);
  --font-weight-heading: 600;
  --font-weight-body: 400;
  --font-weight-medium: 500;

  /* Typography — Sizes */
  --font-size-h1: clamp(48px, calc(20px + 5.3cqw), 96px);
  --font-size-h2: clamp(36px, calc(12px + 3.6cqw), 64px);
  /* h3 was a flat 32px, so FAQ questions + story statements stayed 32px on
     phones. Now fluid: 32px at the top (desktop unchanged) → 22px floor. */
  --font-size-h3: clamp(22px, calc(16px + 2cqw), 32px);
  --font-size-body: 16px;
  /* body-lg fluid: 22px desktop (top) → 18px on phones. */
  --font-size-body-lg: clamp(18px, calc(14px + 1.1cqw), 22px);
  --font-size-body-sm: 14px;
  --font-size-body-xs: 12px;
  --font-size-btn: 14px;
  --font-size-nav: 14px;

  /* Typography — Line Height */
  --line-height-h1: 1.1;
  --line-height-h2: 1.15;
  --line-height-h3: 1.2;
  --line-height-body: 1.6;

  /* Typography — Letter Spacing */
  --letter-spacing-h1: -0.02em;
  --letter-spacing-h2: -0.01em;
  --letter-spacing-h3: normal;
  --letter-spacing-body: normal;

  /* Spacing Scale */
  --spacing-xs: 8px;
  --spacing-sm: 16px;
  --spacing-md: 24px;
  --spacing-lg: 32px;
  --spacing-xl: 40px;
  --spacing-2xl: 48px;
  --spacing-3xl: 64px;
  --spacing-grid-gap: 24px;
  --spacing-card-padding: 32px;

  /* Layout */
  --rhythm: clamp(64px, 8.3cqw, 120px);
  --pad-card: clamp(40px, 5cqw, 72px);
  --narrow: 720px;
  --content: 880px;
  --container: 1200px;
  --breakout: 1200px;
  --padding-inline: clamp(20px, 5cqw, 72px);
  --nav-height: 80px;
  /* Nav links styled as text-links matching the footer copyright row: larger,
     muted, colour-shift on hover (no chip). Consumed by nav/bar. */
  --nav-link-font-size: var(--font-size-body-lg);
  --nav-link-letter-spacing: -0.01em;
  --nav-link-color: var(--color-text-secondary);
  --nav-link-hover-bg: transparent;
  --nav-link-hover-color: var(--color-text-primary);
  /* Left-aligned nav: links grouped next to the logo, actions pushed right. */
  --nav-inner-justify: flex-start;
  --nav-links-gap: var(--spacing-2xl);
  --nav-actions-push: auto;

  /* Semantic Spacing */
  --gap-label-to-h: 16px;
  --gap-h-to-desc: 24px;
  --gap-desc-to-content: 64px;

  /* Button sizing — canonical (A.5, 2026-04-24) */
  --btn-padding-y: 14px;
  --btn-padding-x: 28px;
  --btn-gap: 8px;
  --btn-font-weight: 500;
  /* lg: the hero download CTA — larger pill, bigger label. */
  --btn-lg-padding-y: 20px;
  --btn-lg-padding-x: 40px;
  --btn-lg-font-size: 18px;

  /* Shape */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-card: 40px;
  --radius-pill: 100px;

  /* Colors — netok palette (GitHub-dark family) */
  --color-bg: #131314;
  --color-surface: #161B22;
  --color-surface-dark: #0A0D11;
  --color-accent: #3DD68C;
  --color-accent-hover: #2FBF79;
  --color-text-primary: #E6EDF3;
  --color-text-secondary: #7D8590;
  --color-text-muted: #484F58;
  --color-text-on-dark: #E6EDF3;
  --color-text-on-accent: #0B0F14;
  --color-border: #232A33;
  --color-brand-light: #3DD68C;
  --color-brand-lightest: rgba(61, 214, 140, 0.2);
  --color-brand-tint: rgba(61, 214, 140, 0.12);

  /* Logo — brand-forward like violet: the netok mark is a green circle that
     reads natively on the dark bg; show project logos in their real colors. */
  --logo-filter: none;

  /* Eyebrow — terminal identity: mono uppercase labels read as terminal output */
  --letter-spacing-eyebrow: 0.08em;

  /* No hairline under the nav — the dark header blends into the page. */
  --nav-border: none;

  /* Wide wordmark lockup — smaller than the default button-height rule. */
  --nav-logo-height: 32px;

  /* Shadows — dark surface separates by border, not shadow */
  --shadow-card: none;
}