:root{
  --bg:#FFFFFF;
  --bg-soft:#F5F7FA;
  --surface:#FFFFFF;
  --surface-2:#F5F7FA;
  --surface-3:#EDF0F5;
  --border:#E5E8EE;
  --border-strong:#D4D9E0;
  --text:#1A1A1A;
  --text-muted:#5A6472;
  --text-dim:#8A93A0;
  --navy:#0A2540;
  --navy-2:#1B2A4A;
  --navy-soft:#EEF2F7;
  --red:#9B1B1B;
  --red-dark:#7A1414;
  --red-bright:#C41E3A;
  --red-soft:#FBEEEE;
  --olive:#2E5A3C;
  --olive-dark:#234830;
  --olive-soft:#EEF4EF;
  --green:#166534;
  --white:#FFFFFF;
  --link:#1B2A4A;
  --font-display:'Tajawal','IBM Plex Sans Arabic',system-ui,sans-serif;
  --font-body:'IBM Plex Sans Arabic','Noto Sans Arabic',system-ui,sans-serif;
  --font-script:'Amiri',Georgia,serif;
  --font-latin:'Inter',system-ui,sans-serif;
  --fs-xs:12px; --fs-sm:14px; --fs-base:17px; --fs-md:18px; --fs-lg:20px;
  --fs-xl:24px; --fs-2xl:30px; --fs-3xl:38px; --fs-4xl:48px; --fs-5xl:58px;
  --lh-body:1.8; --lh-tight:1.28;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-6:24px;
  --sp-8:32px; --sp-12:48px; --sp-16:64px; --sp-24:96px;
  --radius:8px; --radius-sm:4px; --radius-pill:999px;
  --shadow:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.06);
  --shadow-lg:0 8px 24px rgba(16,24,40,.10);
  --glass:rgba(255,255,255,.92);
  --blur:blur(8px);
  --ease:cubic-bezier(.2,.7,.2,1);
  --dur:180ms;
  --container:1200px; --grid-gap:28px;
}