/**
 * Broker Design System — Tokens
 * Central visual language for broker.com.eg
 * Phase 1: variables only; no legacy page overrides.
 */
:root {
  /* Brand palette */
  --brk-charcoal: #252729;
  --brk-charcoal-900: #1f2123;
  --brk-charcoal-700: #4a4d50;

  --brk-page: #f2f2ef;
  --brk-ivory: #f7f4ee;
  --brk-ivory-100: #fffdf8;
  --brk-ivory-300: #eee9df;

  --brk-sand: #cdbb94;
  --brk-sand-soft: #f3eee4;
  --brk-sand-600: #b9a77f;

  --brk-green: #252729;
  --brk-green-900: #1f2123;
  --brk-green-700: #4a4d50;

  --brk-white: #fffdf8;
  --brk-text: #252729;
  --brk-text-muted: #626562;
  --brk-border: #deddd7;
  --brk-danger: #a33a35;
  --brk-success: #2f6c59;

  /* Typography */
  --brk-font-ar: "Cairo", "Tajawal", Tahoma, Arial, sans-serif;
  --brk-font-latin: Inter, Arial, sans-serif;
  --brk-fw-regular: 400;
  --brk-fw-medium: 500;
  --brk-fw-semibold: 600;
  --brk-fw-bold: 700;
  --brk-fw-black: 900;

  --brk-fs-xs: 0.75rem;
  --brk-fs-sm: 0.875rem;
  --brk-fs-base: 1rem;
  --brk-fs-lg: 1.125rem;
  --brk-fs-xl: 1.375rem;
  --brk-fs-2xl: clamp(1.75rem, 3vw, 2.5rem);
  --brk-fs-hero: clamp(2.5rem, 6vw, 5rem);

  --brk-lh-tight: 1.15;
  --brk-lh-heading: 1.3;
  --brk-lh-body: 1.8;

  /* Spacing */
  --brk-sp-1: 0.25rem;
  --brk-sp-2: 0.5rem;
  --brk-sp-3: 0.75rem;
  --brk-sp-4: 1rem;
  --brk-sp-5: 1.25rem;
  --brk-sp-6: 1.5rem;
  --brk-sp-8: 2rem;
  --brk-sp-10: 2.5rem;
  --brk-sp-12: 3rem;
  --brk-sp-16: 4rem;
  --brk-sp-20: 5rem;

  /* Layout */
  --brk-container: 1440px;
  --brk-content: 1180px;
  --brk-gutter: clamp(16px, 3vw, 40px);

  /* Radius */
  --brk-radius-sm: 10px;
  --brk-radius-md: 18px;
  --brk-radius-lg: 28px;
  --brk-radius-xl: 38px;
  --brk-radius-pill: 999px;

  /* Elevation */
  --brk-shadow-sm: 0 6px 18px rgba(37, 39, 41, 0.06);
  --brk-shadow-md: 0 14px 38px rgba(37, 39, 41, 0.09);
  --brk-shadow-lg: 0 24px 60px rgba(37, 39, 41, 0.12);

  /* Motion */
  --brk-ease: cubic-bezier(.2,.7,.2,1);
  --brk-speed: 180ms;
}