/* ============================================================
   GSD Utility Solutions — Theme (non-color design tokens)
   ------------------------------------------------------------
   COLOR lives only in gsd-tokens.css. This file holds the
   typography, spacing, radius and motion tokens for the
   "bold industrial" direction. No hex/rgb values here.

   Type direction: a heavy industrial gothic (Oswald) for
   display headlines to echo the logo's condensed utility
   lettering; Inter for body/UI; JetBrains Mono for the
   technical labels, telemetry and tool codenames.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* ---- Families ------------------------------------------ */
  --font-display: 'Oswald', 'Arial Narrow', 'Helvetica Neue', sans-serif;
  --font-sans:    'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* ---- Weights ------------------------------------------- */
  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semi:    600;
  --weight-bold:    700;

  /* ---- Display scale (Oswald, condensed industrial) ------ */
  --type-display-xl:   clamp(2.75rem, 5.2vw + 1rem, 4.5rem);   /* hero h1     */
  --type-display-lg:   clamp(2.1rem, 3.4vw + 1rem, 3.25rem);   /* section h2  */
  --type-display-md:   clamp(1.6rem, 1.6vw + 1rem, 2.25rem);   /* sub h2/h3   */
  --type-display-sm:   1.375rem;                               /* card title  */

  --leading-display:   1.04;
  --tracking-display:  0.01em;   /* slight positive — industrial, not editorial */

  /* ---- Body scale (Inter) -------------------------------- */
  --type-lead:   clamp(1.0625rem, 0.5vw + 1rem, 1.25rem);  /* hero/section lead */
  --type-body:   1rem;
  --type-sm:     0.875rem;
  --type-xs:     0.8125rem;
  --leading-body: 1.6;

  /* ---- Caption / eyebrow (mono, tracked) ----------------- */
  --type-eyebrow:    1.125rem;
  --tracking-eyebrow: 0.1em;

  /* ---- Spacing (4px base; 96px between major bands) ------ */
  --space-3xs: 0.25rem;   /* 4  */
  --space-2xs: 0.5rem;    /* 8  */
  --space-xs:  0.75rem;   /* 12 */
  --space-sm:  1rem;      /* 16 */
  --space-md:  1.5rem;    /* 24 */
  --space-lg:  2rem;      /* 32 */
  --space-xl:  3rem;      /* 48 */
  --space-2xl: 4rem;      /* 64 */
  --space-section: clamp(2.25rem, 4vw, 3.5rem);  /* band rhythm (tightened) */

  /* ---- Layout -------------------------------------------- */
  --container-max: 1200px;
  --container-pad: clamp(1.25rem, 4vw, 2rem);
  --nav-height: 68px;

  /* ---- Radius (industrial = squared, minimal) ------------ */
  --radius-xs:   2px;
  --radius-sm:   4px;   /* buttons, inputs, chips        */
  --radius-md:   6px;   /* cards                         */
  --radius-lg:   10px;  /* large panels / hero visual    */
  --radius-pill: 9999px;

  /* ---- Borders ------------------------------------------- */
  --border-width: 1px;
  --border-width-bold: 2px;   /* industrial emphasis rules */

  /* ---- Motion -------------------------------------------- */
  --transition-fast: 120ms ease;
  --transition: 160ms ease;
}
