/* IKT Design Tokens — Single Source of Truth for Color, Typography, Spacing, and Geometry
   Positioning: Premium B2B Industrial Engineering & Custom Manufacturing Partner */

:root {
  /* Color Palette — Engineered Industrial (High-Trust B2B) */
  --dark: #0d1b2a;             /* Deep Prussian Navy — primary dark surface */
  --dark-2: #15263a;           /* Secondary dark surface / card hover */
  --dark-3: #1e3550;           /* Tertiary dark surface / border highlight */
  --ink: #0f1923;              /* Near-black text on light surfaces */
  --ink-2: #1e293b;            /* Secondary dark text */
  --paper: #f8f6f1;            /* Warm Industrial White — main page background */
  --paper-2: #efece5;          /* Warm Silver — soft section background */
  --paper-3: #e3dfd6;          /* Strong Silver — dividers and subtle card backgrounds */
  --steel: #2c4255;            /* Industrial Steel — active elements, technical anchors */
  --steel-light: #475f75;      /* Steel body text on paper */
  --steel-dark: #162432;       /* Dark steel */
  --accent: #b9381e;           /* Precision Vermillion / Signal Red — conversion actions only */
  --accent-dark: #9c2e17;      /* Vermillion hover state */
  --accent-light: #fef2f0;     /* Soft vermillion wash */
  --copper: #8b5e3c;           /* Warm Copper — technical highlight & spec accents */
  --teal: #166056;             /* Engineering Teal — mono labels, section eyebrows */
  --teal-on-dark: #4ecdc4;     /* Teal for high-contrast on dark navy */
  --muted: #52606d;            /* Secondary body copy on light backgrounds */
  --muted-light: #94a3b8;      /* Secondary text on dark surfaces */
  --muted-subtle: #cbd5e1;     /* Subtle muted text */
  --line: #d8d3cb;             /* Hairline divider on light background */
  --line-strong: #b8b1a4;      /* High-contrast border on light */
  --line-dark: rgba(255, 255, 255, 0.12); /* Hairline on dark background */
  --line-dark-strong: rgba(255, 255, 255, 0.22);
  --ok: #15803d;               /* Success state */
  --err: #b91c1c;              /* Error / validation state */

  /* Typography Families — IBM Plex Sans & IBM Plex Mono */
  --font-display: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-body: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: "IBM Plex Mono", "Cascadia Mono", Consolas, "SF Mono", Menlo, monospace;

  /* Typography Scale */
  --text-hero: clamp(38px, 5.2vw, 68px);
  --text-h1: clamp(32px, 4vw, 52px);
  --text-h2: clamp(24px, 2.8vw, 38px);
  --text-h3: 20px;
  --text-h4: 17px;
  --text-body: 16px;
  --text-small: 14px;
  --text-micro: 12px;
  --text-eyebrow: 11px;

  /* Letter Spacing */
  --tracking-tight: -0.035em;
  --tracking-headline: -0.025em;
  --tracking-mono: 0.14em;
  --tracking-wide: 0.20em;

  /* Spacing Grid (8pt baseline system) */
  --space-2xs: 4px;
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 32px;
  --space-xl: 48px;
  --space-2xl: 64px;
  --space-3xl: 96px;
  --space-4xl: 120px;

  --space-section: 104px;
  --space-section-mobile: 60px;
  --space-gap: 24px;
  --header-h: 74px;
  --utility-h: 36px;

  /* Geometry & Borders */
  --radius-sm: 2px;
  --radius: 4px;
  --radius-md: 6px;

  /* Layout Container */
  --max: 1240px;
  --max-reading: 740px;
  --gutter: 24px;

  /* Motion & Transitions */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur: 0.18s;
  --dur-med: 0.28s;

  /* Elevation / Shadows (Strictly Restrained) */
  --shadow-subtle: 0 1px 3px rgba(15, 25, 35, 0.05), 0 4px 12px rgba(15, 25, 35, 0.03);
  --shadow-elevated: 0 4px 20px rgba(13, 27, 42, 0.12);
}