/* ==========================================================================
   tokens.css — Frodo QA Studio
   Kierunek: ciepło i rzemieślniczo. Drewno, ciemna zieleń, mosiądz.
   Próbka zaakceptowana przez klientkę: #3a2a1a, #c99a5b, #f2e8d5 — te trzy
   wartości siedzą niżej dosłownie (wood-700, brass-500, cream-100), reszta
   skali jest z nich wyprowadzona.
   Wyłącznie zmienne. Żadnej reguły, która cokolwiek maluje.
   ========================================================================== */

:root {
  /* --- kolor: drewno i cień ------------------------------------------- */
  --ink-900: #130d07;
  --ink-800: #1d140c;
  --ink-700: #2a1d11;
  --wood-700: #3a2a1a;
  --wood-600: #4e3823;
  --wood-500: #6a4e31;

  /* --- kolor: zieleń warsztatu ---------------------------------------- */
  --forest-900: #07301e;
  --forest-800: #0c3d27;
  --forest-700: #134e34;
  --forest-600: #1d6343;

  /* --- kolor: mosiądz (akcent) ---------------------------------------- */
  --brass-700: #8a5f2c;
  --brass-600: #a8763a;
  --brass-500: #c99a5b;
  --brass-400: #d9b07a;
  --brass-300: #e6c79b;

  /* --- kolor: papier -------------------------------------------------- */
  --cream-50: #fbf7ee;
  --cream-100: #f2e8d5;
  --cream-200: #e8dbc2;
  --cream-300: #d8c7a8;

  /* --- role tekstowe -------------------------------------------------- */
  --text-ink: #241708;
  --text-ink-soft: #55402b;
  --text-ink-mute: #6d5740;
  --text-cream: #f7efdf;
  --text-cream-soft: #ddcdb0;
  --text-cream-mute: #bda98a;

  /* --- powierzchnie --------------------------------------------------- */
  --surface-paper: var(--cream-50);
  --surface-paper-2: var(--cream-100);
  --surface-dark: var(--ink-800);
  --surface-forest: var(--forest-800);
  --line-ink: rgba(58, 42, 26, 0.18);
  --line-ink-strong: rgba(58, 42, 26, 0.32);
  --line-cream: rgba(242, 232, 213, 0.18);
  --line-brass: rgba(201, 154, 91, 0.45);

  /* --- typografia ----------------------------------------------------- */
  --font-display: "Zilla Slab", "Iowan Old Style", Georgia, serif;
  --font-body: "Karla", "Segoe UI", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;

  --fs-micro: 0.72rem;
  --fs-xs: 0.8rem;
  --fs-sm: 0.9rem;
  --fs-base: clamp(1rem, 0.97rem + 0.15vw, 1.08rem);
  --fs-lg: clamp(1.09rem, 1.03rem + 0.3vw, 1.24rem);
  --fs-xl: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
  --fs-2xl: clamp(1.5rem, 1.3rem + 1vw, 2.1rem);
  --fs-3xl: clamp(1.9rem, 1.5rem + 2vw, 3.05rem);
  --fs-hero: clamp(2.35rem, 1.6rem + 3.4vw, 4.4rem);
  --fs-numeral: clamp(2.2rem, 1.6rem + 2.2vw, 3.2rem);

  --lh-tight: 1.04;
  --lh-snug: 1.18;
  --lh-body: 1.62;
  --ls-tight: -0.018em;
  --ls-wide: 0.02em;
  --ls-label: 0.16em;

  /* --- rytm ----------------------------------------------------------- */
  --sp-1: 0.5rem;
  --sp-2: 0.75rem;
  --sp-3: 1rem;
  --sp-4: 1.5rem;
  --sp-5: 2rem;
  --sp-6: 3rem;
  --sp-7: 4rem;
  --sp-8: 5.5rem;
  --sp-9: 7.5rem;

  --container: 1180px;
  --container-narrow: 720px;
  --gutter: clamp(1.15rem, 4vw, 2.75rem);
  --header-h: 74px;
  --header-h-tight: 62px;

  /* --- promienie i cienie (mała krzywizna: rzecz stemplowana, nie app) */
  --r-xs: 2px;
  --r-sm: 4px;
  --r-md: 8px;
  --r-lg: 14px;
  --r-pill: 999px;

  --sh-card: 0 1px 0 rgba(58, 42, 26, 0.06), 0 12px 30px -18px rgba(19, 13, 7, 0.45);
  --sh-raised: 0 18px 50px -22px rgba(19, 13, 7, 0.6);
  --sh-deep: 0 30px 70px -30px rgba(7, 48, 30, 0.7);

  /* --- ruch ----------------------------------------------------------- */
  --ease-out: cubic-bezier(0.16, 0.84, 0.44, 1);
  --ease-soft: cubic-bezier(0.32, 0.72, 0.28, 1);
  --dur-1: 0.18s;
  --dur-2: 0.36s;
  --dur-3: 0.8s;

  /* --- karb: sygnaturowy motyw (nacięcia na blacie) ------------------- */
  --karb-gap: 11px;
  --karb-width: 2px;
  --karb-accent-gap: 55px;
}