/* ==========================================================================
   Balkan Mechanic — Design tokens
   ========================================================================== */
:root {
  /* --- Brand colors (plan §15/§16) --- */
  --color-graphite: #111820;
  --color-graphite-dark: #0a0f14;
  --color-navy: #17283a;
  --color-steel: #31566f;
  --color-steel-light: #527791;
  --color-primary: #f36a21;
  --color-primary-hover: #c94b16;
  --color-primary-soft: #fff0e7;

  --color-background: #f6f7f8;
  --color-surface: #ffffff;
  --color-surface-dark: #18222c;
  --color-surface-steel: #edf1f4;

  --color-text: #222b33;
  --color-text-muted: #68737d;
  --color-text-light: #f4f6f8;

  --color-border: #d9dee3;
  --color-border-dark: rgba(255, 255, 255, 0.15);

  --color-success: #27815f;
  --color-error: #b94242;

  --gradient-dark: linear-gradient(135deg, #0a0f14 0%, #111820 52%, #17283a 100%);
  --gradient-primary: linear-gradient(135deg, #c94b16 0%, #f36a21 100%);
  --gradient-steel: linear-gradient(150deg, #17283a 0%, #31566f 100%);

  --shadow-card: 0 12px 35px rgba(17, 24, 32, 0.09);
  --shadow-card-hover: 0 18px 50px rgba(17, 24, 32, 0.15);
  --shadow-soft: 0 4px 14px rgba(17, 24, 32, 0.06);
  --shadow-header: 0 1px 0 rgba(17, 24, 32, 0.06);

  /* --- Typography (plan §19) --- */
  --font-heading: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;
  --font-body: "Plus Jakarta Sans", "Segoe UI", system-ui, -apple-system, sans-serif;

  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extra: 800;

  /* Fluid type scale */
  --fs-display: clamp(2.4rem, 1.6rem + 3.4vw, 4rem);
  --fs-h1: clamp(2rem, 1.4rem + 2.6vw, 3.15rem);
  --fs-h2: clamp(1.55rem, 1.2rem + 1.5vw, 2.3rem);
  --fs-h3: clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem);
  --fs-h4: clamp(1.05rem, 1rem + 0.3vw, 1.2rem);
  --fs-lead: clamp(1.08rem, 1rem + 0.4vw, 1.3rem);
  --fs-body: 1.02rem;
  --fs-small: 0.9rem;
  --fs-eyebrow: 0.78rem;

  --lh-tight: 1.12;
  --lh-heading: 1.2;
  --lh-body: 1.68;

  /* --- Spacing scale --- */
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --section-pad: clamp(3.5rem, 2rem + 6vw, 6.5rem);

  /* --- Layout --- */
  --container: 1200px;
  --container-narrow: 820px;
  --container-wide: 1360px;
  --gutter: clamp(1.15rem, 0.6rem + 2vw, 2rem);

  /* --- Radius --- */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --radius-pill: 999px;

  /* --- Motion (plan §62) --- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur-fast: 160ms;
  --dur: 200ms;
  --dur-slow: 240ms;

  /* --- Z-index --- */
  --z-header: 100;
  --z-dropdown: 110;
  --z-mobile: 120;
  --z-sticky-cta: 90;
}