/**
 * OPEX design tokens — Industrial Standard (adapted from stitch)
 */
:root {
  --opex-black: #1e1e1e;
  --opex-dark: #333333;
  --opex-accent: #f5b400;
  --opex-accent-hover: #e0a400;
  --opex-accent-soft: rgba(245, 180, 0, 0.16);
  --opex-action: #ba1a1a;
  --opex-action-hover: #93000a;
  --opex-bg: #fdf8f8;
  --opex-surface: #ffffff;
  --opex-surface-low: #f7f3f2;
  --opex-surface-container: #f1edec;
  --opex-surface-high: #ebe7e7;
  --opex-border: #c4c7c7;
  --opex-border-strong: #747878;
  --opex-text: #1c1b1b;
  --opex-muted: #444748;
  --opex-tint: #5f5e5e;

  --opex-radius-sm: 0.125rem;
  --opex-radius-md: 0.25rem;
  --opex-radius-lg: 0.5rem;

  --opex-font: 'Source Sans 3', 'Segoe UI', Tahoma, sans-serif;
  --opex-font-display: 'Archivo', 'Source Sans 3', sans-serif;
  --opex-font-mono: 'IBM Plex Mono', ui-monospace, Consolas, monospace;

  --opex-text-xs: 0.75rem;
  --opex-text-sm: 0.875rem;
  --opex-text-base: 1rem;
  --opex-text-lg: 1.125rem;
  --opex-text-xl: clamp(1.25rem, 1.1rem + 0.4vw, 1.35rem);
  --opex-text-2xl: clamp(1.35rem, 1.15rem + 0.7vw, 1.75rem);
  --opex-text-3xl: clamp(1.75rem, 1.35rem + 1.4vw, 2.25rem);
  --opex-text-4xl: clamp(2.25rem, 1.6rem + 2.2vw, 3rem);

  --opex-space-1: 0.25rem;
  --opex-space-2: 0.5rem;
  --opex-space-3: 0.75rem;
  --opex-space-4: 1rem;
  --opex-space-5: 1.25rem;
  --opex-space-6: 1.5rem;
  --opex-space-8: 2rem;
  --opex-space-10: 2.5rem;
  --opex-space-12: 3rem;
  --opex-space-16: 4rem;

  --opex-header-h: 68px;
  --opex-header-h-compact: 58px;
  --opex-bottom-nav-h: 56px;
  --opex-container: 1280px;
  --opex-container-wide: 1360px;

  --opex-shadow-sm: 0 1px 2px rgba(30, 30, 30, 0.06);
  --opex-shadow-md: 0 4px 12px rgba(30, 30, 30, 0.08);
  --opex-shadow-lg: 0 10px 28px rgba(30, 30, 30, 0.12);

  --opex-transition: 180ms cubic-bezier(0.33, 1, 0.68, 1);

  --opex-bp-tablet: 768px;
  --opex-bp-desktop: 1024px;
  --opex-bp-wide: 1280px;
}