/*
  Alfondia design tokens. Identity foundation is the approved brand board:
  deep navy, a working blue, and a restrained gold that belongs to the A-mark
  and to small structural accents. Every value lives here so the palette can be
  re-tuned in one place when the production logo asset arrives.

  Contrast (calculated): navy on paper 15.0:1, muted on paper 6.9:1, deep blue
  (text links) on paper 6.3:1, white on blue 5.0:1, gold-light on navy 8.7:1.
  Gold on light grounds is only ~2.7:1, so it is NEVER used as text there --
  decorative marks and hairlines only.
*/
:root {
  /* Canonical color tokens */
  --navy: #0b1f3a;
  --navy-soft: #1b3252;        /* raised navy (hover on dark) */
  --blue: #2b6cd4;             /* fills, buttons, focus */
  --blue-deep: #1f56b0;        /* text links and small blue text */
  --gold: #b8923f;             /* A-mark arc + decorative accents on light */
  --gold-light: #d9b96e;       /* gold on navy (safe as text there) */
  --paper: #f6f4ef;
  --paper-tint: #ece8df;       /* hover / quiet fills on paper */
  --surface: #ffffff;
  --ink: var(--navy);
  --ink-muted: #4a5468;        /* secondary text */
  --rule: #dad5ca;             /* hairlines */
  --rule-strong: #b9b2a3;      /* structural rules */

  /* Legacy names kept as aliases so older components adopt this system
     unchanged. New work should use the canonical tokens above. */
  --accent: var(--blue);
  --accent-hover: #2359b0;
  --ink-soft: var(--navy-soft);
  --alf-navy: var(--navy);
  --alf-navy-soft: var(--navy-soft);
  --alf-blue: var(--blue);
  --alf-blue-soft: var(--paper-tint);
  --alf-blue-strong: var(--blue);
  --brand-navy: var(--navy);
  --brand-blue: var(--blue);
  --brand-ivory: var(--paper);
  --alf-bg: var(--paper);
  --alf-bg-soft: var(--surface);
  --alf-ink: var(--ink);
  --alf-muted: var(--ink-muted);
  --alf-faint: var(--ink-muted);   /* no sub-AA "faint" text color exists */
  --alf-line: var(--rule);
  --alf-line-strong: var(--rule-strong);

  /* Typography -- one superfamily for both scripts, self-hosted (fonts.css),
     so English and Arabic speak in the same voice and no request leaves the
     site. Hierarchy comes from scale, weight and rules, not typeface swaps. */
  --font-body: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-display: var(--font-body);
  --font-body-ar: 'IBM Plex Sans Arabic', 'IBM Plex Sans', Tahoma, sans-serif;
  --font-display-ar: var(--font-body-ar);

  /* Type scale (Arabic sizes/line-heights are set per script in base.css) */
  --fs-h1: clamp(34px, 4.2vw, 52px);
  --fs-h2: clamp(26px, 2.6vw, 32px);
  --fs-h3: 19px;
  --fs-nav: 15px;
  --fs-body: 17px;
  --fs-lede: 19px;
  --fs-small: 14px;
  --fs-eyebrow: 12.5px;

  /* Spacing -- 8px rhythm */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 40px;
  --space-xl: 64px;
  --space-2xl: 96px;

  /* Layout */
  --container: 1120px;
  --hero-col: 680px;
  --radius: 4px;
}