/* DATAENABLER — Design Tokens */
:root {
  /* Brand */
  --de-navy: #0B1220;
  --de-navy-2: #111D33;
  --de-accent: #0F6F5C;
  --de-accent-hover: #0D5C4D;
  --de-accent-soft: #E6F2EF;
  --de-accent-ring: rgba(15,111,92,.18);

  /* Product accents */
  --nexora: #1A56DB;
  --nexora-soft: #EFF4FF;
  --dmo: #0F4C81;
  --dmo-soft: #EEF4FA;
  --karohat: #E11D48;
  --naghma: #7C3AED;
  --malaab: #059669;
  --matbakh: #EA580C;
  --qaree: #0E7490;

  /* Neutrals */
  --bg: #F8FAFC;
  --surface: #FFFFFF;
  --surface-elevated: #FFFFFF;
  --surface-muted: #F1F5F9;
  --surface-hover: #F8FAFC;
  --border: #E2E8F0;
  --border-strong: #CBD5E1;
  --text-primary: #0F172A;
  --text-secondary: #475569;
  --text-muted: #94A3B8;
  --text-inverse: #FFFFFF;

  /* Semantic */
  --success: #059669;
  --warning: #D97706;
  --error: #DC2626;
  --info: #2563EB;

  /* Typography */
  --font-en: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-ar: 'DIN Next LT Arabic', system-ui, sans-serif;
  --font-display: var(--font-en);
  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 15px;
  --text-md: 16px;
  --text-lg: 18px;
  --text-xl: 20px;
  --text-2xl: 24px;
  --text-3xl: 30px;
  --text-4xl: 38px;
  --text-5xl: 48px;
  --text-hero: clamp(38px, 6vw, 64px);
  --leading-tight: 1.05;
  --leading-snug: 1.2;
  --leading-normal: 1.6;

  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;
  --space-4xl: 96px;

  /* Radius */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-xs: 0 1px 2px rgba(15,23,42,.06);
  --shadow-sm: 0 1px 3px rgba(15,23,42,.08), 0 1px 2px rgba(15,23,42,.06);
  --shadow-md: 0 4px 12px rgba(15,23,42,.08), 0 1px 3px rgba(15,23,42,.06);
  --shadow-lg: 0 12px 32px rgba(15,23,42,.10), 0 4px 12px rgba(15,23,42,.06);
  --shadow-elevated: 0 16px 40px rgba(11,18,32,.12);

  /* Transitions */
  --ease: 180ms cubic-bezier(.2,.8,.2,1);
  --ease-slow: 280ms cubic-bezier(.2,.8,.2,1);

  /* Layout */
  --header-h: 64px;
  --container: 1240px;
  --container-narrow: 1040px;
}

/* Dark mode */
[data-theme="dark"] {
  --bg: #070B14;
  --surface: #0F172A;
  --surface-elevated: #16233D;
  --surface-muted: #0F1D33;
  --surface-hover: #12213A;
  --border: #1E2E4A;
  --border-strong: #2A3F63;
  --text-primary: #F1F5F9;
  --text-secondary: #94A3B8;
  --text-muted: #64748B;
  --de-accent-soft: rgba(15,111,92,.18);
  --nexora-soft: rgba(26,86,219,.14);
  --dmo-soft: rgba(15,76,129,.18);
  --shadow-sm: 0 1px 3px rgba(0,0,0,.4);
  --shadow-md: 0 8px 24px rgba(0,0,0,.4);
  --shadow-lg: 0 16px 40px rgba(0,0,0,.5);
}

/* Arabic font faces */
@font-face { font-family: 'DIN Next LT Arabic'; src: url('../fonts/din-next-lt-arabic-ultralight.ttf') format('truetype'); font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: 'DIN Next LT Arabic'; src: url('../fonts/din-next-lt-arabic-light.ttf') format('truetype'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'DIN Next LT Arabic'; src: url('../fonts/din-next-lt-arabic-regular.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'DIN Next LT Arabic'; src: url('../fonts/din-next-lt-arabic-medium.ttf') format('truetype'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'DIN Next LT Arabic'; src: url('../fonts/din-next-lt-arabic-bold.ttf') format('truetype'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'DIN Next LT Arabic'; src: url('../fonts/din-next-lt-arabic-heavy.ttf') format('truetype'); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: 'DIN Next LT Arabic'; src: url('../fonts/din-next-lt-arabic-black.ttf') format('truetype'); font-weight: 900; font-style: normal; font-display: swap; }

/* Inter via system — loaded via Google Fonts in HTML as fallback */
