/* Zestro — tokeny marki 2.0 (biel, grafit, minia) · wrzesień 2026
   Zamiennik 1:1 dla site/public/brand/tokens.css: te same nazwy --z-*,
   nowe wartości. Nowe tokeny dopisane niżej. Źródło: outputs/brand-system-v2. */

/* Wersja dla strony: fonty są hostowane lokalnie (@fontsource-variable, import w
   BaseLayout.astro), więc bez @import z Google Fonts: mniej zapytań blokujących
   i brak przekazywania IP odwiedzających do Google. Rodziny "… Variable" to nazwy
   z @fontsource; reszta pliku jest identyczna ze źródłem. */

:root {
  /* --- Tła ---------------------------------------------------------------- */
  --z-canvas: #f6f6f4;          /* Biel robocza: tło strony */
  --z-white: #ffffff;           /* Biel: arkusze, panele, formularze */
  --z-surface: #ecedea;         /* Szarość robocza: tło obrazu, wyróżniony blok */

  /* --- Tekst -------------------------------------------------------------- */
  --z-ink: #121518;             /* Grafit: tekst, logo, zwykłe przyciski */
  --z-ink-2: #3e4a56;           /* Grafit stalowy: klucze, linki, tekst pomocniczy */
  --z-ink-70: rgba(18, 21, 24, 0.72);
  --z-ink-60: rgba(18, 21, 24, 0.64);  /* najjaśniejszy dopuszczalny tekst */

  /* --- Ciemne płaszczyzny ---------------------------------------------------- */
  --z-steel: #1f2b36;           /* Stal: reklamy, slajdy, najwyżej jeden pas strony */
  --z-steel-deep: #161f28;
  --z-steel-raised: #2b3a48;    /* supergrafika na Stali */
  --z-on-dark: #f2f3f1;         /* tekst na Stali i Graficie */
  --z-on-dark-2: #a9b6c2;       /* tekst pomocniczy na ciemnym */

  /* --- Sygnał: minia (jeden na widok) --------------------------------------- */
  --z-signal: #e0522a;          /* przycisk CTA, skos logo, zakreślenie */
  --z-signal-hover: #e8653f;
  --z-on-signal: #121518;       /* tekst na minii zawsze grafitowy (4,7:1) */
  --z-signal-on-dark: #f08560;  /* minia jasna: drobny tekst i linki na ciemnym */
  --z-signal-soft: #f9ddd2;     /* tło wyróżnienia, rzadko */

  /* --- Zgodność wstecz (nazwy używane w kodzie strony i design systemie) ---- */
  --z-decision: #3e4a56;        /* dawny kolor linków i focusu → Grafit stalowy */
  --z-decision-soft: #e4e7ea;
  --z-interface: #b4b8ba;       /* linie wykresów, nieaktywne; nie do tekstu */
  --z-petrol: var(--z-steel);
  --z-petrol-deep: var(--z-steel-deep);
  --z-petrol-raised: var(--z-steel-raised);
  --z-on-petrol: var(--z-on-dark);
  --z-petrol-muted: var(--z-on-dark-2);
  --z-signal-text: var(--z-signal-on-dark);

  /* --- Linie ---------------------------------------------------------------- */
  --z-hairline: rgba(18, 21, 24, 0.12);
  --z-rule: rgba(18, 21, 24, 0.22);
  --z-field-border: rgba(18, 21, 24, 0.24);
  --z-hairline-on-dark: rgba(242, 243, 241, 0.18);
  --z-hairline-on-petrol: var(--z-hairline-on-dark);

  /* --- Stany ---------------------------------------------------------------- */
  --z-success: #2e7d62;
  --z-warning: #9a6700;
  --z-error: #a8322a;           /* ciemniejsza od minii; zawsze z ikoną lub tekstem */
  --z-info: #3e4a56;

  /* --- Typografia ----------------------------------------------------------- */
  --z-font-display: "Figtree Variable", "Figtree", "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --z-font-body: "Figtree Variable", "Figtree", "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  --z-font-mono: "Red Hat Mono Variable", "Red Hat Mono", Menlo, Consolas, monospace;
  --z-text-h1: clamp(44px, 5.4vw, 80px);
  --z-text-h2: clamp(34px, 3.6vw, 52px);
  --z-text-h3: clamp(26px, 2.4vw, 36px);
  --z-text-lead: clamp(17px, 1.35vw, 19px);
  --z-text-body: 17px;
  --z-text-small: 15px;
  --z-text-label: 12px;
  --z-leading-tight: 1;
  --z-leading-heading: 1.04;
  --z-leading-body: 1.6;
  --z-tracking-h1: -0.055em;
  --z-tracking-h2: -0.045em;
  --z-tracking-label: 0.12em;
  --z-weight-heading: 650;

  /* --- Kształt: kanciasto, płasko ------------------------------------------- */
  --z-radius-none: 0;
  --z-radius-sm: 0;
  --z-radius-md: 0;
  --z-radius-lg: 0;
  --z-radius-pill: 999px;       /* tylko okrągłe zdjęcia i kropki statusu */
  --z-shadow: none;
  --z-shadow-panel: none;

  /* --- Siatka i odstępy (8 px) ---------------------------------------------- */
  --z-grid: 8px;
  --z-space-1: 8px;
  --z-space-2: 16px;
  --z-space-3: 24px;
  --z-space-4: 32px;
  --z-space-5: 48px;
  --z-space-6: 64px;
  --z-space-7: 80px;
  --z-space-8: 112px;
  --z-container: 1296px;
  --z-gutter: clamp(20px, 5vw, 72px);
  --z-measure: 660px;
  --z-control-height: 52px;
}
