/* ============================================================
   Kropka — Typography tokens (Design System)

   ŹRÓDŁO: docs/Nowy-Design-Kropka/_ds/kropka-eduhub-design-system-
           9cab01f8-efff-4109-8fa5-976f5fbd8656/tokens/typography.css

   ODSTĘPSTWO OD ŹRÓDŁA (świadome):
   pominięte deklaracje --font-display i --font-body. Źródło deklaruje
   je zarówno tu, jak i w tokens/fonts.css; w produkcie oba tokeny mają
   jedno źródło — static/kropka-ds/tokens-fonts.css. Zostawienie kopii
   tutaj oznaczałoby, że kolejność <link> w base.html decyduje o stosie
   zapasowym kroju, co jest pułapką bez żadnego zysku.

   Reszta pliku — skala rozmiarów, wagi i klasy semantyczne .eh-* —
   jest skopiowana dosłownie, z wartościami bez zmian.

   Sprawdzone przed dodaniem: żadna z nazw (--fs-*, --fw-*, --font-body,
   klasy .eh-*) nie występuje w templates/ ani w pozostałych plikach
   static/ — brak kolizji z istniejącymi zmiennymi aplikacji.
   ============================================================ */

:root {
  /* Weights */
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold:600;
  --fw-bold:    700;
  /* DOŁOŻONE POZA ŹRÓDŁEM DS (nagłówki tabel, właściciel: „powiększ i
     pogrub"). --fw-bold to był dotychczasowy sufit skali — realnie
     cięższy stopień istnieje dopiero po rozszerzeniu `@font-face` Inter
     do faktycznego zakresu osi `wght` (tokens-fonts.css), zmierzonego
     w pliku fontu (fontTools: 100–900, instancja nazwana „ExtraBold"
     przy 800). Token UŻYWAJ PUNKTOWO — tylko tam, gdzie treść wiersza
     jest wyraźnie lżejsza (regular/medium), żeby nagłówek nie zbliżył
     się wagą do pogrubionych wartości w komórkach (np. `--fw-semibold`
     na nazwiskach). Dziś jedyny konsument: nagłówki tabel katalogowych
     (`.kp-th span`, `.pcm-table th`, `.edu-table th`, `.rej-th`). */
  --fw-heavy:   800;

  /* Size ramp (px, product-derived — not snapped to a grid) */
  --fs-display: 40px;   /* page hero — "Cześć, Jan!" */
  --fs-h1:      32px;
  --fs-h2:      20px;
  --fs-h3:      18px;
  --fs-h4:      14px;
  --fs-body:    14px;
  --fs-sub:     13.5px;
  --fs-caption: 12px;
  --fs-micro:   11.5px;
  --fs-tiny:    10.5px;
}

/* ── Semantic type classes ─────────────────────────────────── */
.eh-wordmark { font-family: var(--font-body); font-weight: 700; font-size: 20px; line-height: 24px; letter-spacing: -0.8px; color: var(--ink); }

.eh-display  { font-family: var(--font-display); font-weight: 700; font-size: 40px; line-height: 36px; letter-spacing: -0.6px; color: var(--ink); }
.eh-h1       { font-family: var(--font-display); font-weight: 700; font-size: 32px; line-height: 36px; letter-spacing: -0.7px; color: var(--ink); }
.eh-h2       { font-family: var(--font-display); font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: -0.4px; color: var(--ink); }
.eh-h3       { font-family: var(--font-display); font-weight: 700; font-size: 18px; line-height: 28px; letter-spacing: -0.36px; color: var(--ink); }
.eh-h4       { font-family: var(--font-display); font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: -0.28px; color: var(--ink-2); }
.eh-nav      { font-family: var(--font-display); font-weight: 600; font-size: 14px; line-height: 24px; letter-spacing: -0.2px; color: var(--muted); }

.eh-lead     { font-family: var(--font-display); font-weight: 500; font-size: 20px; line-height: 36px; letter-spacing: -0.6px; color: var(--hint); }
.eh-body     { font-family: var(--font-body); font-weight: 400; font-size: 14px; line-height: 20px; color: var(--ink); }
.eh-sub      { font-family: var(--font-body); font-weight: 500; font-size: 13.5px; line-height: 18px; color: var(--muted); }
.eh-caption  { font-family: var(--font-body); font-weight: 400; font-size: 12px; line-height: 16px; color: var(--muted); }
.eh-chip-text{ font-family: var(--font-body); font-weight: 700; font-size: 12px; line-height: 16px; }
.eh-timer    { font-family: var(--font-body); font-weight: 500; font-size: 10px; line-height: 15px; }

.eh-num      { font-variant-numeric: tabular-nums; }
