/* insightix Bahrain design system tokens (from claude.ai/design project "insightix Bahrain Design System") */
:root {
  /* Fonts — Google Fonts substitutes; Lexend approximates the logo wordmark */
  --font-display: "Lexend", "Hanken Grotesk", system-ui, sans-serif;
  --font-body: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* Colours sampled from the logo */
  --navy-950: #03142a; --navy-900: #051b33; --navy-800: #072443; --navy-700: #103559; --navy-600: #1c4a76; --navy-500: #2f5f8f; --navy-200: #bfcddd; --navy-100: #e2e9f1; --navy-50: #f0f4f8;
  --sky-800: #165a8f; --sky-700: #1d6ca8; --sky-600: #2a85c7; --sky-500: #3a9bdf; --sky-400: #62b1e7; --sky-300: #93c9ef; --sky-200: #c2e0f6; --sky-100: #dcedfa; --sky-50: #eef6fd;
  --slate-900: #1c2129; --slate-800: #2d333c; --slate-700: #454c56; --slate-600: #5d6571; --slate-500: #808893; --slate-400: #a2a8b1; --slate-300: #c5cad1; --slate-200: #e0e3e7; --slate-100: #edeff1; --slate-50: #f7f7f7; --white: #ffffff;
  --green-700: #1f6b4c; --green-100: #dcefe5; --amber-700: #8a5a10; --amber-100: #f8ecd2; --red-700: #a3302f; --red-100: #f7dedd;

  --text-strong: var(--navy-800); --text-body: var(--slate-800); --text-muted: var(--slate-600); --text-subtle: var(--slate-500);
  --text-on-dark: var(--white); --text-on-dark-muted: var(--navy-200); --text-link: var(--sky-700); --text-link-hover: var(--navy-800); --text-accent-on-dark: var(--sky-400);
  --surface-page: var(--white); --surface-paper: var(--slate-50); --surface-card: var(--white); --surface-tint: var(--navy-50); --surface-dark: var(--navy-800); --surface-darker: var(--navy-900);
  --border-subtle: var(--slate-200); --border-default: var(--slate-300); --border-strong: var(--slate-500); --border-on-dark: rgba(255,255,255,.16); --border-focus: var(--sky-500);
  --action-primary: var(--navy-800); --action-primary-hover: var(--navy-700); --action-primary-press: var(--navy-900);
  --action-accent: var(--sky-500); --action-accent-hover: var(--sky-400); --action-accent-press: var(--sky-600);
  --status-success: var(--green-700); --status-danger: var(--red-700);

  /* Typography */
  --weight-light: 300; --weight-regular: 400; --weight-medium: 500; --weight-semibold: 600; --weight-bold: 700;
  --text-display: clamp(44px, 5.4vw, 68px); --text-h1: clamp(36px, 4vw, 50px); --text-h2: clamp(28px, 3vw, 38px); --text-h3: 26px; --text-h4: 20px; --text-lead: 19px; --text-base: 16px; --text-sm: 14px; --text-xs: 12px;
  --leading-tight: 1.08; --leading-snug: 1.25; --leading-normal: 1.55; --leading-relaxed: 1.7;
  --tracking-display: -0.02em; --tracking-heading: -0.01em; --tracking-eyebrow: 0.18em; --tracking-button: 0.01em;
  --type-display: var(--weight-medium) var(--text-display)/var(--leading-tight) var(--font-display);
  --type-h1: var(--weight-medium) var(--text-h1)/var(--leading-tight) var(--font-display);
  --type-h2: var(--weight-medium) var(--text-h2)/1.15 var(--font-display);
  --type-h3: var(--weight-medium) var(--text-h3)/var(--leading-snug) var(--font-display);
  --type-h4: var(--weight-semibold) var(--text-h4)/1.3 var(--font-body);
  --type-lead: var(--weight-regular) var(--text-lead)/var(--leading-normal) var(--font-body);
  --type-body: var(--weight-regular) var(--text-base)/var(--leading-relaxed) var(--font-body);
  --type-small: var(--weight-regular) var(--text-sm)/var(--leading-normal) var(--font-body);
  --type-eyebrow: var(--weight-semibold) var(--text-xs)/1.2 var(--font-body);

  /* Spacing & layout */
  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 10px; --radius-pill: 999px;
  --container-max: 1200px; --gutter: clamp(20px, 4vw, 48px); --section-y: clamp(64px, 9vw, 120px);
  --control-sm: 36px; --control-md: 44px; --control-lg: 52px; --header-h: 76px;

  /* Effects */
  --shadow-xs: 0 1px 2px rgba(7,36,67,.06);
  --shadow-sm: 0 1px 3px rgba(7,36,67,.08), 0 1px 2px rgba(7,36,67,.04);
  --shadow-md: 0 6px 18px -6px rgba(7,36,67,.14), 0 2px 4px rgba(7,36,67,.05);
  --shadow-lg: 0 22px 48px -16px rgba(7,36,67,.24), 0 4px 10px rgba(7,36,67,.06);
  --focus-ring: 0 0 0 3px rgba(58,155,223,.35);
  --hero-protection: linear-gradient(90deg, rgba(7,36,67,.92) 0%, rgba(7,36,67,.72) 45%, rgba(7,36,67,.15) 100%);
  --ease-standard: cubic-bezier(.2,0,0,1); --ease-out: cubic-bezier(.16,1,.3,1);
  --duration-fast: 120ms; --duration-base: 200ms; --duration-slow: 360ms;
}