:root {
  /* UAE Flag Official Color Palette */
  --clr-uae-red: #dc2626;         /* UAE Crimson Red */
  --clr-uae-red-hover: #b91c1c;
  --clr-uae-green: #047857;       /* UAE Emerald Green */
  --clr-uae-green-hover: #065f46;
  --clr-uae-black: #0f172a;       /* UAE Obsidian Black */
  --clr-uae-white: #ffffff;       /* UAE Pure White */

  /* Core Design Tokens Mapped to UAE Flag Colors */
  --clr-primary: #047857;         /* UAE Emerald Green Primary */
  --clr-primary-hover: #065f46;
  --clr-primary-light: rgba(4, 120, 87, 0.08);
  --clr-primary-gradient: linear-gradient(135deg, #047857 0%, #064e3b 45%, #dc2626 100%);
  
  --clr-accent: #dc2626;          /* UAE Red Accent */
  --clr-accent-hover: #b91c1c;
  --clr-emerald: #047857;
  --clr-amber: #d97706;
  --clr-rose: #dc2626;

  /* Button & Secondary Gradients */
  --clr-secondary-gradient: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);

  /* Neutrals & Dark Slate */
  --clr-dark: #0f172a;            /* UAE Black Base */
  --clr-dark-card: #1e293b;
  --clr-slate-800: #1e293b;
  --clr-slate-700: #334155;
  --clr-slate-600: #475569;
  --clr-slate-500: #64748b;
  --clr-slate-400: #94a3b8;
  --clr-slate-300: #cbd5e1;
  --clr-slate-200: #e2e8f0;
  --clr-slate-100: #f1f5f9;
  --clr-slate-50: #f8fafc;
  --clr-white: #ffffff;

  /* Typography */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-heading: 'Plus Jakarta Sans', var(--font-sans);

  /* Elevation & Shadows */
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(4, 120, 87, 0.12), 0 4px 6px -4px rgba(220, 38, 38, 0.08);
  --shadow-xl: 0 20px 25px -5px rgba(15, 23, 42, 0.15), 0 8px 10px -6px rgba(15, 23, 42, 0.05);
  --shadow-glow: 0 0 20px rgba(4, 120, 87, 0.25);

  /* Glassmorphism & Borders */
  --glass-bg: rgba(255, 255, 255, 0.92);
  --glass-dark-bg: rgba(15, 23, 42, 0.92);
  --glass-border: rgba(226, 232, 240, 0.8);
  --glass-dark-border: rgba(51, 65, 85, 0.8);
  --glass-blur: blur(16px);

  /* Radii */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Transitions */
  --transition-fast: 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-bounce: 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);

  /* Layout Widths */
  --container-max: 1280px;
  --container-narrow: 920px;
  --header-height: 80px;
}
