/* =====================================================
   DESIGN TOKENS — ענת הרוש ביטוח
   ===================================================== */

:root {

  /* --- Colors: Brand --- */
  --color-primary:        #0d2137;   /* Navy — header, headings, trust */
  --color-primary-light:  #1a3a5c;   /* Lighter navy for hover states */
  --color-primary-dark:   #071524;   /* Darker navy for depth */

  --color-gold:           #09AECE;   /* Teal — primary CTA, icons, highlights */
  --color-gold-light:     #1CBFDE;   /* Lighter teal for hover */
  --color-gold-dark:      #0794B0;   /* Darker teal for pressed state */

  --color-blue:           #2563eb;   /* Accent blue — links, secondary CTA */
  --color-blue-light:     #3b82f6;
  --color-blue-dark:      #1d4ed8;

  /* --- Colors: Neutral --- */
  --color-bg:             #f4f7fb;   /* Page background */
  --color-surface:        #ffffff;   /* Cards, containers */
  --color-surface-alt:    #eef2f8;   /* Alternate section background */
  --color-border:         #dde4ef;   /* Dividers, input borders */
  --color-border-light:   #eef1f7;

  /* --- Colors: Text --- */
  --color-text:           #1e293b;   /* Primary body text */
  --color-text-secondary: #475569;   /* Secondary text */
  --color-text-muted:     #64748b;   /* Captions, labels */
  --color-text-inverse:   #ffffff;   /* Text on dark backgrounds */

  /* --- Colors: Semantic --- */
  --color-success:        #16a34a;
  --color-success-bg:     #f0fdf4;
  --color-error:          #dc2626;
  --color-error-bg:       #fef2f2;
  --color-warning:        #d97706;
  --color-whatsapp:       #1a9e4e;
  --color-whatsapp-dark:  #157a3c;

  /* --- Typography: Families --- */
  --font-heading: 'Rubik', sans-serif;
  --font-body:    'Assistant', sans-serif;

  /* --- Typography: Scale --- */
  --text-xs:    0.75rem;    /* 12px */
  --text-sm:    0.875rem;   /* 14px */
  --text-base:  1rem;       /* 16px */
  --text-lg:    1.125rem;   /* 18px */
  --text-xl:    1.25rem;    /* 20px */
  --text-2xl:   1.5rem;     /* 24px */
  --text-3xl:   1.875rem;   /* 30px */
  --text-4xl:   2.25rem;    /* 36px */
  --text-5xl:   3rem;       /* 48px */
  --text-6xl:   3.75rem;    /* 60px */

  /* --- Typography: Weights --- */
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;

  /* --- Typography: Line Heights --- */
  --leading-tight:   1.25;
  --leading-snug:    1.375;
  --leading-normal:  1.6;
  --leading-relaxed: 1.75;

  /* --- Spacing (8px base grid) --- */
  --space-1:    0.25rem;   /* 4px */
  --space-2:    0.5rem;    /* 8px */
  --space-3:    0.75rem;   /* 12px */
  --space-4:    1rem;      /* 16px */
  --space-5:    1.25rem;   /* 20px */
  --space-6:    1.5rem;    /* 24px */
  --space-8:    2rem;      /* 32px */
  --space-10:   2.5rem;    /* 40px */
  --space-12:   3rem;      /* 48px */
  --space-16:   4rem;      /* 64px */
  --space-20:   5rem;      /* 80px */
  --space-24:   6rem;      /* 96px */

  /* --- Border Radius --- */
  --radius-sm:   4px;
  --radius-md:   8px;
  --radius-lg:   12px;
  --radius-xl:   16px;
  --radius-2xl:  24px;
  --radius-full: 9999px;

  /* --- Shadows --- */
  --shadow-xs:  0 1px 3px rgba(13, 33, 55, 0.06);
  --shadow-sm:  0 2px 8px rgba(13, 33, 55, 0.08);
  --shadow-md:  0 4px 20px rgba(13, 33, 55, 0.10);
  --shadow-lg:  0 8px 32px rgba(13, 33, 55, 0.14);
  --shadow-xl:  0 16px 48px rgba(13, 33, 55, 0.18);
  --shadow-gold: 0 4px 18px rgba(201, 146, 42, 0.35);

  /* --- Transitions --- */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;
  --transition-bounce: 300ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* --- Layout --- */
  --container-max:      1200px;
  --container-padding:  var(--space-6);   /* 24px */
  --header-height:      84px;
  --section-py:         var(--space-20);  /* 80px */
  --section-py-sm:      var(--space-12);  /* 48px */

  /* --- Z-Index --- */
  --z-base:      1;
  --z-dropdown:  100;
  --z-sticky:    200;
  --z-overlay:   300;
  --z-modal:     400;
  --z-toast:     500;
  --z-floating:  600;
}