/* Brand kit KPR — tokeny wyprowadzone z kpr-restrukturyzacja.pl (motyw WP "kpr", sitestyles.css), 2026-09-30.
   Opis i uzasadnienie: _obs_KPR/Referencje/Brand_kit_KPR.md */
@import url('https://fonts.googleapis.com/css2?family=Jost:wght@400;500;600&family=Playfair+Display:wght@500;700&display=swap');

:root {
  /* Marka (strona) */
  --kpr-navy:       #05202b;  /* .bg-navy — nagłówek, stopka */
  --kpr-navy-light: #022c3d;  /* .bg-navy-light */
  --kpr-teal:       #064a67;  /* .step-box, strzałki karuzeli */
  --kpr-gold:       #be914c;  /* akcent główny: h1, przyciski, obramowania (148× w CSS) */
  --kpr-gold-dark:  #9b6c23;  /* hover przycisków */
  --kpr-gold-wash:  rgba(190, 145, 76, 0.12);

  /* Powierzchnie i tekst (aplikacja w iframe Bitrix24 = jasna) */
  --surface-page:   #f1f1f1;  /* tło sekcji jasnych na stronie */
  --surface-card:   #ffffff;
  --text-primary:   #101010;  /* kolor tekstu strony */
  --text-secondary: #4b4b4b;
  --text-muted:     #7e7e7e;
  --line:           #e3e0da;  /* hairline, ciepła szarość pod złoto */
  --grid:           #ebe8e2;
  --axis:           #c9c4ba;

  /* Typografia */
  --font-display: "Playfair Display", Georgia, serif;   /* nagłówki, liczby KPI (jak „83%”, „900+” na stronie) */
  --font-ui:      "Jost", system-ui, "Segoe UI", sans-serif; /* cały interfejs, etykiety, tabele */

  /* Wykresy — kategorie (kolejność stała, walidowana: CVD ≥ 8.8, normal ≥ 16.9, kontrast ≥ 3:1 na #fff) */
  --series-1: #0b78a6;  /* morski (z granatu marki) */
  --series-2: #b8862f;  /* złoto (przyciemnione złoto marki, ≥ 3:1) */
  --series-3: #23a17a;  /* zieleń */
  --series-4: #7a4fb0;  /* fiolet */
  --series-5: #c9466a;  /* róż/bordo */
  --series-6: #8f8f24;  /* oliwka */

  /* Wykresy — skala uporządkowana (lejek, etapy): jeden odcień, jasny → ciemny */
  --seq-1: #7fb6d6;
  --seq-2: #4b97c2;
  --seq-3: #0b78a6;
  --seq-4: #0a5d80;
  --seq-5: #064a67;

  /* Statusy — zawsze z ikoną i etykietą, nigdy jako kolor serii */
  --status-good:     #0ca30c;
  --status-warning:  #fab219;
  --status-critical: #d03b3b;

  --radius: 6px;
}

body { font-family: var(--font-ui); color: var(--text-primary); background: var(--surface-page); }
h1, h2, .kpi-value { font-family: var(--font-display); }