/* easyworkclub — design tokens (handoff)
   Base palette: terracotta #B5502B / ink #1E1B18 / cream #FBF9F5.
   Every colour, size, spacing, radius and shadow used by home/city/job lives here. */
:root {
  /* ---- colour: base palette ---- */
  --c-ink: #1E1B18;            /* primary text, dark buttons, active locale */
  --c-cream: #FBF9F5;          /* page ground; text on dark fills */
  --c-terracotta: #B5502B;     /* the one accent: links hover, brand, median marker */
  --c-white: #FFFFFF;          /* card + header/footer surfaces, inputs */
  --c-black: #000000;          /* dark-button hover */
  /* ---- colour: derived neutrals (warm greys) ---- */
  --c-border: #E6E0D6;         /* card + section borders */
  --c-border-soft: #F0EBE2;    /* inner row rules; thin progress track */
  --c-border-accent: #F0D5C4;  /* card hover border; accent-box input border */
  --c-text-mute: #7A7068;      /* secondary text, labels, footer */
  --c-text-soft: #554D46;      /* tertiary copy, body lists */
  --c-surface-tint: #F5F2EC;   /* locale switcher track */
  /* ---- colour: accent tints ---- */
  --c-accent-weak: #FDF1EA;    /* signup box, active filter pill fill */
  --c-accent-deep: #83381A;    /* active filter pill text */
  --c-band-track: #D8AE9D;     /* salary band track */
  --c-band-fill: #C28166;      /* salary band interquartile fill; city share bar */
  /* ---- colour: semantic chips ---- */
  --c-pos: #2F5726;            /* "New" chip text; live status dot */
  --c-pos-bg: #E8F1E6;
  --c-salary: #6F5209;         /* salary chip text */
  --c-salary-bg: #FDF6E3;
  --c-chip-neutral-text: #574E46;
  --c-chip-neutral-bg: #F1EEE9;
  /* ---- colour: employer monogram palette (varied hue AND lightness) ---- */
  --c-mono-1: #5A4A7A; --c-mono-2: #2F5726; --c-mono-3: #8A5A1E;
  --c-mono-4: #35526E; --c-mono-5: #7A3D4F; --c-mono-6: #3E5E5A; --c-mono-7: #6B4226;
  /* ---- type ---- */
  --font-sans: 'Inter', system-ui, sans-serif; /* load with cv05 + ss03 features */
  --fs-12: 12px; --fs-13: 13px; --fs-14: 14px; --fs-15: 15px;
  --fs-16: 16px; --fs-17: 17px; --fs-18: 18px; --fs-19: 19px;
  --fs-h1-home: clamp(30px, 4vw, 44px);
  --fs-h1-city: clamp(26px, 3vw, 34px);
  --fs-h1-job:  clamp(22px, 2.6vw, 26px);
  --fw-regular: 400; --fw-medium: 560; --fw-semibold: 620;
  --fw-bold: 660; --fw-heavy: 680; --fw-display: 720;
  --lh-tight: 1.15; --lh-heading: 1.25; --lh-title: 1.35; --lh-body: 1.5; --lh-copy: 1.6;
  --ls-tight: -0.02em; --ls-snug: -0.015em; --ls-brand: -0.01em; --ls-label: 0.06em;
  /* ---- spacing (used values, px) ---- */
  --sp-2: 2px; --sp-3: 3px; --sp-4: 4px; --sp-6: 6px; --sp-8: 8px; --sp-9: 9px;
  --sp-10: 10px; --sp-11: 11px; --sp-12: 12px; --sp-13: 13px; --sp-14: 14px;
  --sp-16: 16px; --sp-18: 18px; --sp-20: 20px; --sp-22: 22px; --sp-24: 24px;
  --sp-26: 26px; --sp-28: 28px; --sp-32: 32px; --sp-36: 36px;
  --sp-44: 44px; --sp-48: 48px; --sp-56: 56px;
  /* ---- radius ---- */
  --r-2: 2px;      /* median marker */
  --r-sm: 8px;     /* buttons, inputs, monograms, city cards */
  --r-md: 12px;    /* cards, panels, signup box */
  --r-pill: 999px; /* chips, filters, locale, bands */
  /* ---- borders / focus ---- */
  --bw-1: 1px; --bw-2: 2px;
  /* ---- layout ---- */
  --page-max: 1180px;
  --page-gutter: clamp(16px, 3vw, 32px);
  --col-gap: clamp(28px, 4vw, 56px);   /* main/aside gap */
  --pad-panel: clamp(20px, 3vw, 32px); /* job-detail panel padding */
  --avatar: 44px; --avatar-lg: 52px;   /* monogram sizes */
  --dot: 8px;                          /* status dots; band height */
  /* ---- shadow ---- */
  --shadow-marker: 0 0 0 var(--bw-2) var(--c-white); /* halo on band median marker */
}