@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap');

:root {
  --color-primary: #2C34D9;
  --color-primary-dark: #1D264D;
  --color-secondary: #2A387E;

  --color-bg: #FFFFFF;
  --color-bg-soft: #F7F7FE;
  --color-bg-alt: #F3F3FD;
  --color-border: #D7E0EB;
  --color-text-muted: #7D8099;
  --color-text-gray: #979298;

  --color-accent-pink: #F9E1DA;
  --color-accent-teal: #E2F8F6;
  --color-accent-lavender: #B8B5CF;

  --font-arabic: 'Cairo', 'IBM Plex Sans Arabic', sans-serif;
  --font-size-h1: clamp(2rem, 4vw, 3.5rem);
  --font-size-h2: clamp(1.5rem, 3vw, 2.5rem);
  --font-size-body: 1rem;

  --radius-card: 20px;
  --radius-button: 12px;
  --shadow-card: 0 10px 30px rgba(42, 56, 126, 0.08);
}