:root {
  /* Brand */
  --c-black: #231F20;
  --c-orange: #E19015;
  --c-white: #FFFFFF;

  /* Grey scale */
  --c-grey-900: #3A3A3A;
  --c-grey-700: #5A5A5A;
  --c-grey-500: #9A9A9A;
  --c-grey-300: #C7C7C7;
  --c-grey-200: #E5E5E5;
  --c-grey-100: #F5F5F5;

  /* Orange tints */
  --c-orange-700: #B86F0D;
  --c-orange-300: #F4B566;
  --c-orange-100: #FCE9CF;

  /* Typography */
  --f-sans: "Inter", "Myriad Pro", system-ui, sans-serif;
  --f-arabic: "Cairo", "GE Dinar Two", "Tajawal", sans-serif;

  /* Type scale */
  --fs-h1: clamp(2.25rem, 4vw, 3rem);
  --fs-h2: clamp(1.75rem, 3vw, 2.25rem);
  --fs-h3: 1.5rem;
  --fs-h4: 1.25rem;
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --lh-tight: 1.15;
  --lh-base: 1.6;

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 5rem;

  /* Radius */
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 16px;

  /* Transitions */
  --transition-fast: 0.15s ease;
  --transition-base: 0.2s ease;

  /* Container */
  --container-max: 1280px;
  --container-padding: var(--space-4);
}

[dir="rtl"] {
  font-family: var(--f-arabic);
}