/* ==========================================================================
   המתקנת — Design Tokens
   שינוי פונט/צבע מרכזי נעשה כאן בלבד.
   ========================================================================== */

@font-face{
  font-family: 'TelAvivBrutalist';
  src: url('../assets/fonts/TelAvivBrutalist-Bold.woff2') format('woff2');
  font-weight: 700 900;
  font-style: normal;
  font-display: swap;
}

:root{
  /* ---- Colors ---- */
  --color-bg:        #F5F1EB;
  --color-bg-rgb:     245, 241, 235;
  --color-black:     #111111;
  --color-dark:      #222222;
  --color-lime:      #FCB705; /* sampled from the brush-CTA reference asset — warm yellow-orange, not neon/lime */
  --color-lime-rgb:   252, 183, 5;
  --color-wood:      #C99A68;
  --color-white:     #FFFFFF;

  --color-ink:       var(--color-black);
  --color-muted:     #6B665D;
  --color-line:      rgba(17,17,17,0.14);
  --color-line-strong: rgba(17,17,17,0.28);

  /* ---- Fonts (swap here later without touching components) ---- */
  --font-display: 'TelAvivBrutalist', 'Rubik', 'Arial Hebrew', 'Segoe UI', sans-serif;
  --font-body:    'Assistant', 'Arial Hebrew', 'Segoe UI', sans-serif;
  --font-hand:    'Gveret Levin Alef', cursive;

  --tracking-display: -0.03em;
  --weight-display: 800;
  --weight-display-heavy: 900;

  /* ---- Type scale ---- */
  --fs-display-xl: clamp(3.2rem, 9vw, 8.5rem);
  --fs-display-lg: clamp(2.4rem, 6vw, 5.5rem);
  --fs-display-md: clamp(1.8rem, 3.6vw, 3.2rem);
  --fs-display-sm: clamp(1.3rem, 2.2vw, 1.9rem);
  --fs-body-lg: clamp(1.05rem, 1.4vw, 1.3rem);
  --fs-body: 1rem;
  --fs-small: 0.85rem;
  --fs-eyebrow: 0.8rem;

  /* ---- Spacing ---- */
  --space-section: clamp(5rem, 10vw, 9rem);
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --container-max: 1600px;

  /* ---- Misc ---- */
  --radius: 2px;
  --radius-sm: 1px;
  --ease-editorial: cubic-bezier(0.65, 0, 0.15, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 0.25s;
  --dur-med: 0.55s;
  --dur-slow: 1s;

  --header-h: 84px;

  /* ---- Hero-scoped palette (Header + Hero only, does not affect other sections) ---- */
  --hero-bg:        #F4F0E8;
  --hero-black:     #111111;
  --hero-graphite:  #292929;
  --hero-wood:      #B98252;
  --hero-accent:    #FCB705;
  --hero-accent-rgb: 252, 183, 5;
  --hero-accent-dark: #6F4F00;
  --hero-trace:     #BA8500;

  /* ---- Warm yellow-orange, sampled from the brush-CTA reference asset ---- */
  --hero-tape:      #FCB705;
  --hero-tape-rgb:   252, 183, 5;
}

@media (max-width: 720px){
  :root{
    --header-h: 64px;
    --space-section: clamp(3.5rem, 14vw, 5.5rem);
  }
}