/* „W lochach socjalizmu” — system wizualny strony (2026-10-05)
   Kolory z okładki (zbuduj_okladke*.py): czerń celi, złote światło okna, czerwień akcentu, papier.
   Kroje: Gelasio (metryka Georgii z okładki) + Source Sans 3 — pliki na własnym serwerze, OFL (fonty/OFL-*.txt).
   Zasady: zero zewnętrznych zasobów (RODO), kontrast WCAG 2.1 AA, działa bez JS, szanuje prefers-reduced-motion. */

/* ---------- czcionki ---------- */
@font-face { font-family: "Gelasio"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("fonty/gelasio-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Gelasio"; font-style: normal; font-weight: 400 700; font-display: swap;
  src: url("fonty/gelasio-latin-ext-normal.woff2") format("woff2");
  unicode-range: U+0100-017F, U+0218-021B; }
@font-face { font-family: "Gelasio"; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url("fonty/gelasio-latin-italic.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Gelasio"; font-style: italic; font-weight: 400 700; font-display: swap;
  src: url("fonty/gelasio-latin-ext-italic.woff2") format("woff2");
  unicode-range: U+0100-017F, U+0218-021B; }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url("fonty/source-sans-3-latin-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 200 900; font-display: swap;
  src: url("fonty/source-sans-3-latin-ext-normal.woff2") format("woff2");
  unicode-range: U+0100-017F, U+0218-021B; }

/* ---------- tokeny ---------- */
:root {
  /* strefa ciemna — jak okładka */
  --cela: #121110;
  --cela-2: #1b1917;
  --cela-3: #282420;
  --poswiata: #3a3228;
  --swiatlo: #e8d6aa;          /* górna krawędź okna */
  --swiatlo-2: #c0aa78;        /* dolna krawędź okna */
  --na-ciemnym: #ece6d8;       /* tekst na czerni (13,9:1) */
  --na-ciemnym-2: #b4ac9e;     /* tekst drugorzędny na czerni (8,1:1) */
  --linia-ciemna: #3a3530;

  /* strefa jasna — papier */
  --papier: #f6f2ea;
  --papier-2: #ece6da;
  --karta: #fbf9f4;
  --tekst: #1d1b19;
  --tekst-2: #57524b;          /* 7,0:1 na papierze */
  --linia: #d9d1c3;
  --akcent: #96201c;           /* czerwień z okładki, 7,9:1 na papierze */
  --akcent-2: #7a1814;
  --fokus: #96201c;

  --ok-tlo: #e3f1e5; --ok-ramka: #3c7a46; --ok-tekst: #1e4325;
  --blad-tlo: #f8e1e1; --blad-tekst: #5a1414;
  --info-tlo: var(--papier-2);

  --szeryf: "Gelasio", Georgia, "Times New Roman", serif;
  --bezszeryf: "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  --szer: 72rem;
  --szer-tekst: 42rem;
  --margines: clamp(1rem, 4vw, 2rem);
  --sekcja: clamp(3rem, 8vw, 5.5rem);
  --promien: 6px;
  --cien: 0 1px 2px rgb(18 17 16 / .06), 0 8px 24px rgb(18 17 16 / .08);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --papier: #161513;
    --papier-2: #201e1b;
    --karta: #1c1a18;
    --tekst: #e9e3d6;
    --tekst-2: #b4ac9e;
    --linia: #37322c;
    --akcent: #e3c98f;
    --akcent-2: #f0dcb0;
    --fokus: #e3c98f;
    --ok-tlo: #17301c; --ok-ramka: #4f9a5c; --ok-tekst: #cfe9d3;
    --blad-tlo: #3a1715; --blad-tekst: #f6d4d1;
    --cien: 0 1px 2px rgb(0 0 0 / .3), 0 8px 24px rgb(0 0 0 / .35);
    color-scheme: dark;
  }
}

/* ---------- podstawa ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: 5rem; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0; background: var(--papier); color: var(--tekst);
  font-family: var(--szeryf); font-size: 1.125rem; line-height: 1.7;
  font-feature-settings: "kern", "liga"; font-variant-numeric: oldstyle-nums proportional-nums;
  text-rendering: optimizeLegibility;
}
img, svg, picture { display: block; max-width: 100%; height: auto; }
h1, h2, h3 { line-height: 1.15; font-weight: 700; letter-spacing: -0.01em; text-wrap: balance; }
h2 { font-size: clamp(1.6rem, 3.6vw, 2.2rem); margin: 0 0 1rem; }
h3 { font-size: 1.25rem; margin: 1.75rem 0 0.5rem; }
p { margin: 0 0 1.1rem; text-wrap: pretty; }
a { color: var(--akcent); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
a:hover { color: var(--akcent-2); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--fokus); outline-offset: 3px; border-radius: 2px; }
strong { font-weight: 700; }
abbr[title] { text-decoration: underline dotted; cursor: help; }
.liczba { font-variant-numeric: lining-nums tabular-nums; }

.pomin {
  position: absolute; left: 0.5rem; top: -4rem; z-index: 100;
  background: var(--swiatlo); color: var(--cela); padding: 0.6rem 1rem; font-family: var(--bezszeryf); font-weight: 700;
  border-radius: var(--promien); text-decoration: none;
}
.pomin:focus { top: 0.5rem; }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
[hidden] { display: none !important; }

.kontener { max-width: calc(var(--szer) + 2 * var(--margines)); margin-inline: auto; padding-inline: var(--margines); }
.kontener-tekst { max-width: calc(var(--szer-tekst) + 2 * var(--margines)); margin-inline: auto; padding-inline: var(--margines); }

/* ---------- strefa ciemna (nagłówek, hero, pasy) ---------- */
.ciemne {
  --fokus: var(--swiatlo);
  background: var(--cela); color: var(--na-ciemnym); color-scheme: dark;
}
.ciemne a { color: var(--swiatlo); }
.ciemne a:hover { color: #f4e6c4; }

/* ---------- nagłówek ---------- */
.naglowek { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--linia-ciemna); }
.naglowek .kontener { display: flex; align-items: center; gap: 1rem; min-height: 4rem; }
.marka {
  display: inline-flex; align-items: center; gap: 0.65rem; margin-right: auto;
  font-family: var(--szeryf); font-weight: 700; font-size: 1.05rem; letter-spacing: 0.01em;
  color: var(--na-ciemnym) !important; text-decoration: none;
}
.marka img { width: 1.9rem; height: 1.9rem; border-radius: 5px; }
.marka small { display: block; font-family: var(--bezszeryf); font-weight: 400; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--na-ciemnym-2); line-height: 1.2; }
.marka span { line-height: 1.15; }

.menu-lista { display: flex; align-items: center; gap: 0.25rem; list-style: none; margin: 0; padding: 0; font-family: var(--bezszeryf); font-size: 0.98rem; }
.menu-lista a { display: block; padding: 0.5rem 0.7rem; border-radius: var(--promien); color: var(--na-ciemnym) !important; text-decoration: none; }
.menu-lista a:hover { background: var(--cela-3); }
.menu-lista a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--swiatlo); border-radius: 0; }
.jezyki { display: flex; gap: 0.15rem; font-family: var(--bezszeryf); font-size: 0.85rem; letter-spacing: 0.06em; }
.jezyki a { padding: 0.35rem 0.5rem; border-radius: var(--promien); color: var(--na-ciemnym-2) !important; text-decoration: none; }
.jezyki a[aria-current="true"] { color: var(--cela) !important; background: var(--swiatlo); font-weight: 700; }

.menu-mobilne { display: none; position: relative; }
.menu-mobilne > summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem;
  border: 1px solid var(--linia-ciemna); border-radius: var(--promien); font-family: var(--bezszeryf); font-weight: 600;
}
.menu-mobilne > summary::-webkit-details-marker { display: none; }
.menu-mobilne > summary svg { width: 1.1rem; height: 1.1rem; }
.menu-mobilne[open] > summary { background: var(--cela-3); }
.menu-mobilne .panel {
  position: absolute; right: 0; top: calc(100% + 0.5rem); min-width: 15rem; padding: 0.5rem;
  background: var(--cela-2); border: 1px solid var(--linia-ciemna); border-radius: var(--promien); box-shadow: 0 16px 40px rgb(0 0 0 / .45);
}
.menu-mobilne .menu-lista { flex-direction: column; align-items: stretch; }
.menu-mobilne .menu-lista a { padding: 0.75rem 0.9rem; }
.menu-mobilne .jezyki { padding: 0.5rem 0.4rem 0.2rem; border-top: 1px solid var(--linia-ciemna); margin-top: 0.4rem; }

@media (max-width: 54rem) {
  .naglowek .menu-glowne { display: none; }
  .menu-mobilne { display: block; }
}
@media (max-width: 26rem) {
  .marka small { display: none; }
}

/* ---------- przyciski ---------- */
.przycisk {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem; min-height: 2.9rem; padding: 0.65rem 1.4rem;
  font-family: var(--bezszeryf); font-size: 1rem; font-weight: 700; letter-spacing: 0.01em; line-height: 1.2;
  border: 2px solid transparent; border-radius: var(--promien); cursor: pointer; text-decoration: none;
  background: var(--cela); color: var(--na-ciemnym) !important;
  transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}
.przycisk:hover { background: var(--cela-3); text-decoration: none; }
.przycisk:active { transform: translateY(1px); }
.przycisk[disabled], .przycisk[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.przycisk.drugorzedny { background: transparent; color: var(--tekst) !important; border-color: var(--linia); }
.przycisk.drugorzedny:hover { border-color: var(--tekst); }
.ciemne .przycisk { background: var(--swiatlo); color: var(--cela) !important; }
.ciemne .przycisk:hover { background: #f4e6c4; }
.ciemne .przycisk.drugorzedny { background: transparent; color: var(--na-ciemnym) !important; border-color: var(--linia-ciemna); }
.ciemne .przycisk.drugorzedny:hover { border-color: var(--na-ciemnym-2); }
@media (prefers-color-scheme: dark) {
  .przycisk { background: var(--swiatlo); color: var(--cela) !important; }
  .przycisk:hover { background: #f4e6c4; }
}
.strzalka::after { content: "→"; font-weight: 400; }

/* ---------- hero (strona główna) ---------- */
.hero { position: relative; overflow: hidden; isolation: isolate; }
.hero::before {
  content: ""; position: absolute; inset: -20% -10% auto auto; width: min(70rem, 120vw); aspect-ratio: 1; z-index: -1;
  background: radial-gradient(closest-side, rgb(58 50 40 / .9), rgb(58 50 40 / 0) 70%);
}
.hero .kontener { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.85fr); gap: clamp(2rem, 6vw, 5rem); align-items: center; padding-block: clamp(3rem, 9vw, 6.5rem); }
.nadtytul {
  margin: 0 0 1rem; font-family: var(--bezszeryf); font-size: 0.85rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--na-ciemnym-2);
}
.nadtytul::after { content: ""; display: block; width: 3.5rem; height: 3px; margin-top: 0.9rem; background: var(--akcent-okladka, #96201c); }
.hero h1 { font-size: clamp(2.6rem, 7.2vw, 5rem); line-height: 1.02; margin: 0 0 0.6rem; color: var(--na-ciemnym); }
.hero .podtytul { font-style: italic; font-size: clamp(1.15rem, 2.4vw, 1.4rem); color: var(--na-ciemnym-2); margin: 0 0 1.8rem; }
.haslo { font-style: italic; font-size: clamp(1.5rem, 3.6vw, 2.1rem); line-height: 1.3; color: var(--swiatlo); margin: 0 0 1.25rem; }
.hero .wstep { max-width: 36rem; color: var(--na-ciemnym); font-size: 1.15rem; }
.cta { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; margin-top: 2rem; }
.cta .uwaga { font-family: var(--bezszeryf); font-size: 0.95rem; color: var(--na-ciemnym-2); }
.okladka-ramka { position: relative; justify-self: center; width: min(100%, 22rem); }
.okladka-ramka img { width: 100%; height: auto; border-radius: 3px; box-shadow: 0 2px 4px rgb(0 0 0 / .4), 0 30px 60px -10px rgb(0 0 0 / .7), 0 0 0 1px rgb(255 255 255 / .06); }
.okladka-ramka figcaption { margin-top: 0.9rem; text-align: center; font-family: var(--bezszeryf); font-size: 0.85rem; color: var(--na-ciemnym-2); }
@media (max-width: 48rem) {
  .hero .kontener { grid-template-columns: 1fr; padding-block: 2rem 3rem; gap: 1.75rem; }
  .hero .okladka-ramka { width: min(42%, 10.5rem); order: -1; justify-self: start; }
}

/* ---------- nagłówek podstrony ---------- */
.tytul-strony .kontener-tekst, .tytul-strony .kontener { padding-block: clamp(2.25rem, 6vw, 4rem) clamp(2rem, 5vw, 3.25rem); }
.tytul-strony h1 { font-size: clamp(2.1rem, 5.2vw, 3.4rem); margin: 0 0 0.75rem; color: var(--na-ciemnym); }
.tytul-strony .lead { font-size: clamp(1.1rem, 2.2vw, 1.3rem); color: var(--na-ciemnym-2); margin: 0; max-width: 40rem; }
.okruszki ol { display: flex; flex-wrap: wrap; gap: 0.25rem 0.5rem; list-style: none; margin: 0 0 1.25rem; padding: 0; font-family: var(--bezszeryf); font-size: 0.88rem; color: var(--na-ciemnym-2); }
.okruszki li + li::before { content: "/"; margin-right: 0.5rem; color: var(--linia-ciemna); }
.okruszki a { color: var(--na-ciemnym-2) !important; }
.okruszki [aria-current="page"] { color: var(--na-ciemnym); }

/* ---------- sekcje na papierze ---------- */
.sekcja { padding-block: var(--sekcja); }
.sekcja + .sekcja { padding-top: 0; }
.sekcja.tlo-2 { background: var(--papier-2); padding-top: var(--sekcja); }
.sekcja.tlo-2 + .sekcja { padding-top: var(--sekcja); }
.etykieta { margin: 0 0 0.6rem; font-family: var(--bezszeryf); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: var(--akcent); }
.lead-tekst { font-size: clamp(1.2rem, 2.4vw, 1.4rem); line-height: 1.55; }
.dwie-kolumny { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 4.5rem); align-items: start; }
@media (max-width: 52rem) { .dwie-kolumny { grid-template-columns: 1fr; } }
.tresc { max-width: var(--szer-tekst); }
.tresc h2 { margin-top: 2.75rem; }
.tresc h2:first-child { margin-top: 0; }
.tresc ul, .tresc ol { padding-left: 1.3rem; }
.tresc li { margin-bottom: 0.4rem; }
.tresc li::marker { color: var(--akcent); }

/* liczby */
.liczby { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; list-style: none; margin: 0; padding: 0; border-block: 1px solid var(--linia); }
.liczby li { padding: 1.75rem 1.25rem 1.5rem; border-left: 1px solid var(--linia); }
.liczby li:first-child { border-left: 0; padding-left: 0; }
.liczby .wartosc { display: block; font-size: clamp(2.4rem, 5vw, 3.4rem); font-weight: 700; line-height: 1; color: var(--akcent); font-variant-numeric: lining-nums; margin-bottom: 0.6rem; }
.liczby .opis { display: block; font-family: var(--bezszeryf); font-size: 0.98rem; line-height: 1.45; color: var(--tekst-2); }
@media (max-width: 52rem) {
  .liczby { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .liczby li:nth-child(3) { border-left: 0; padding-left: 0; }
  .liczby li:nth-child(n+3) { border-top: 1px solid var(--linia); }
}
@media (max-width: 30rem) {
  .liczby li { padding: 1.25rem 0.9rem 1rem; }
  .liczby li:nth-child(even) { padding-right: 0; }
}

/* pas z hasłem */
.pas { padding-block: clamp(3rem, 8vw, 5rem); text-align: center; position: relative; overflow: hidden; isolation: isolate; }
.pas::before { content: ""; position: absolute; inset: 50% auto auto 50%; translate: -50% -50%; width: 60rem; aspect-ratio: 1.8; z-index: -1; background: radial-gradient(closest-side, rgb(58 50 40 / .8), transparent 72%); }
.pas blockquote { margin: 0 auto; max-width: 46rem; }
.pas blockquote p { font-size: clamp(1.6rem, 4vw, 2.5rem); font-style: italic; line-height: 1.3; color: var(--na-ciemnym); margin: 0; }
.pas .znak { width: 2.75rem; margin: 0 auto 1.5rem; }

/* karty */
.karty { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1.25rem; list-style: none; margin: 0; padding: 0; }
.karta-tresc { display: flex; flex-direction: column; gap: 0.35rem; padding: 1.5rem; background: var(--karta); border: 1px solid var(--linia); border-radius: var(--promien); box-shadow: var(--cien); }
.karta-tresc .rok { font-size: 2rem; font-weight: 700; line-height: 1; color: var(--akcent); font-variant-numeric: lining-nums; }
.karta-tresc h3 { margin: 0.35rem 0 0.25rem; font-size: 1.2rem; }
.karta-tresc p { margin: 0; font-size: 1rem; line-height: 1.6; color: var(--tekst-2); }
.karta-tresc .zrodlo { margin-top: auto; padding-top: 0.75rem; font-family: var(--bezszeryf); font-size: 0.85rem; }
.karta-tresc.wyrozniona { border-color: var(--akcent); box-shadow: inset 0 3px 0 var(--akcent), var(--cien); }

/* fakty w skrócie */
.fakty { display: grid; grid-template-columns: max-content 1fr; gap: 0; margin: 0; border-top: 1px solid var(--linia); }
.fakty dt, .fakty dd { padding: 0.8rem 0; border-bottom: 1px solid var(--linia); margin: 0; }
.fakty dt { font-family: var(--bezszeryf); font-weight: 700; font-size: 0.95rem; color: var(--tekst-2); padding-right: 1.5rem; }
.fakty dd { font-size: 1.02rem; line-height: 1.55; }
@media (max-width: 36rem) {
  .fakty { grid-template-columns: 1fr; }
  .fakty dt { border-bottom: 0; padding-bottom: 0; }
  .fakty dd { padding-top: 0.2rem; }
}
.ramka-boczna { padding: 1.5rem; background: var(--karta); border: 1px solid var(--linia); border-radius: var(--promien); }
.ramka-boczna h2 { font-size: 1.25rem; margin-bottom: 0.75rem; }
.przyklejone { position: sticky; top: 5.5rem; }

.okladka-tlo { padding: 2rem 1.25rem 1.25rem; border-radius: var(--promien); margin-bottom: 1.25rem; background: radial-gradient(closest-side, var(--poswiata), var(--cela) 85%); }
.okladka-tlo .okladka-ramka { width: min(70%, 15rem); margin-inline: auto; }
.zapis-srodek .zapis { margin: 1.5rem auto 0; text-align: left; }
.pas h2 { color: var(--na-ciemnym); }

/* oś czasu */
.os { list-style: none; margin: 0; padding: 0; position: relative; }
.os::before { content: ""; position: absolute; left: 5.25rem; top: 0.5rem; bottom: 0.5rem; width: 2px; background: var(--linia); }
.os li { display: grid; grid-template-columns: 4.5rem 1fr; gap: 1.5rem; padding: 0 0 1.4rem; position: relative; }
.os li::before { content: ""; position: absolute; left: calc(5.25rem - 0.38rem); top: 0.55rem; width: 0.78rem; height: 0.78rem; border-radius: 50%; background: var(--papier); border: 2px solid var(--akcent); }
.os li.wazne::before { background: var(--akcent); }
.os time { font-family: var(--bezszeryf); font-weight: 700; font-size: 1.05rem; color: var(--akcent); text-align: right; font-variant-numeric: lining-nums tabular-nums; }
.os .co { padding-left: 0.5rem; }
.os .co small { display: block; font-family: var(--bezszeryf); font-size: 0.85rem; color: var(--tekst-2); }
.tlo-2 .os li::before { background: var(--papier-2); }
.tlo-2 .os li.wazne::before { background: var(--akcent); }

/* FAQ */
.faq { display: grid; gap: 0; border-top: 1px solid var(--linia); }
.faq article { padding: 1.6rem 0 1.4rem; border-bottom: 1px solid var(--linia); }
.faq h2, .faq h3 { font-size: clamp(1.2rem, 2.4vw, 1.4rem); margin: 0 0 0.6rem; }
.faq p { margin: 0 0 0.6rem; }
.faq .zrodlo { font-family: var(--bezszeryf); font-size: 0.88rem; color: var(--tekst-2); margin: 0; }
details.faq-skrot { border-bottom: 1px solid var(--linia); }
details.faq-skrot summary { cursor: pointer; padding: 1.1rem 2rem 1.1rem 0; font-weight: 700; font-size: 1.1rem; list-style: none; position: relative; }
details.faq-skrot summary::-webkit-details-marker { display: none; }
details.faq-skrot summary::after { content: "+"; position: absolute; right: 0.25rem; top: 0.95rem; font-family: var(--bezszeryf); font-size: 1.5rem; line-height: 1; color: var(--akcent); }
details.faq-skrot[open] summary::after { content: "–"; }
details.faq-skrot p { margin: 0 0 1.2rem; }

/* źródła */
.zrodla-lista { list-style: none; margin: 0; padding: 0; font-family: var(--bezszeryf); font-size: 0.95rem; line-height: 1.5; counter-reset: zr; }
.zrodla-lista li { counter-increment: zr; padding: 0.6rem 0 0.6rem 2rem; border-bottom: 1px solid var(--linia); position: relative; }
.zrodla-lista li::before { content: counter(zr); position: absolute; left: 0; top: 0.6rem; font-weight: 700; color: var(--akcent); }
.zrodla-lista a { word-break: break-word; }
.zrodla { font-family: var(--bezszeryf); font-size: 0.88rem; color: var(--tekst-2); }
.aktualizacja { font-family: var(--bezszeryf); font-size: 0.88rem; color: var(--tekst-2); margin-top: 2.5rem; }

/* wydania i ceny */
.formaty { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
.formaty li { display: grid; grid-template-columns: 1fr auto; gap: 0.5rem 1.5rem; align-items: center; padding: 1.25rem 1.5rem; background: var(--karta); border: 1px solid var(--linia); border-radius: var(--promien); }
.formaty .nazwa { font-weight: 700; font-size: 1.1rem; }
.formaty small { display: block; font-family: var(--bezszeryf); color: var(--tekst-2); font-size: 0.92rem; line-height: 1.5; margin-top: 0.2rem; }
.formaty .cena { font-family: var(--bezszeryf); font-weight: 700; font-size: 1.15rem; white-space: nowrap; text-align: right; }
.formaty .cena small { font-weight: 400; }
@media (max-width: 36rem) { .formaty li { grid-template-columns: 1fr; } .formaty .cena { text-align: left; } }

/* tabela danych */
.dane { width: 100%; border-collapse: collapse; font-size: 1rem; }
.dane th, .dane td { text-align: left; padding: 0.7rem 0; border-bottom: 1px solid var(--linia); vertical-align: top; }
.dane th { width: 38%; padding-right: 1rem; font-family: var(--bezszeryf); font-weight: 700; font-size: 0.95rem; color: var(--tekst-2); }

/* czytaj dalej */
.dalej { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; list-style: none; margin: 0; padding: 0; }
.dalej a { display: flex; flex-direction: column; gap: 0.3rem; height: 100%; padding: 1.25rem 1.4rem; background: var(--karta); border: 1px solid var(--linia); border-radius: var(--promien); text-decoration: none; color: var(--tekst); transition: border-color .15s ease, transform .15s ease; }
.dalej a:hover { border-color: var(--akcent); transform: translateY(-2px); color: var(--tekst); }
.dalej strong { font-size: 1.15rem; }
.dalej strong::after { content: " →"; color: var(--akcent); }
.dalej span { font-family: var(--bezszeryf); font-size: 0.95rem; color: var(--tekst-2); line-height: 1.5; }

/* do pobrania (media) */
.pobierz-siatka { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 13rem)); gap: 1.5rem; list-style: none; margin: 0; padding: 0; align-items: end; }
.pobierz-siatka li:last-child { grid-column: span 2; max-width: 27.5rem; }
@media (max-width: 30rem) { .pobierz-siatka { grid-template-columns: 1fr 1fr; } .pobierz-siatka li:last-child { max-width: none; } }
.pobierz-siatka figure { margin: 0; }
.pobierz-siatka img { width: 100%; height: auto; border-radius: 3px; border: 1px solid var(--linia); background: var(--cela); }
.pobierz-siatka figcaption { font-family: var(--bezszeryf); font-size: 0.92rem; margin-top: 0.5rem; }
.do-skopiowania { padding: 1.25rem 1.5rem; background: var(--karta); border: 1px solid var(--linia); border-left: 3px solid var(--akcent); border-radius: var(--promien); }
.do-skopiowania p:last-child { margin-bottom: 0; }

/* zapis na powiadomienie */
.zapis { display: grid; gap: 0.75rem; max-width: 34rem; font-family: var(--bezszeryf); font-size: 1rem; }
.zapis .wiersz { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.zapis input[type="email"] {
  flex: 1 1 15rem; min-height: 2.9rem; padding: 0.55rem 0.85rem; font: inherit; font-size: 1.05rem;
  border: 1px solid var(--na-ciemnym-2); border-radius: var(--promien); background: var(--cela-2); color: var(--na-ciemnym);
}
.zapis input[type="email"]::placeholder { color: #8f887c; }
.zapis .zgoda { display: flex; gap: 0.6rem; align-items: flex-start; font-size: 0.92rem; line-height: 1.5; color: var(--na-ciemnym-2); }
.zapis .zgoda input { margin-top: 0.25rem; width: 1.1rem; height: 1.1rem; accent-color: var(--swiatlo); flex: none; }
.zapis .uwaga { font-size: 0.85rem; color: var(--na-ciemnym-2); margin: 0; }
.pulapka { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.jasne .zapis input[type="email"] { background: var(--karta); color: var(--tekst); border-color: var(--tekst-2); }
.jasne .zapis .zgoda, .jasne .zapis .uwaga { color: var(--tekst-2); }

/* ---------- stopka ---------- */
.stopka { padding-block: 3.5rem 2rem; font-family: var(--bezszeryf); font-size: 0.95rem; }
.stopka .siatka-stopki { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 2.5rem; }
.stopka h2 { font-family: var(--bezszeryf); font-size: 0.8rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--na-ciemnym-2); margin: 0 0 0.9rem; }
.stopka ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.45rem; }
.stopka a { color: var(--na-ciemnym) !important; text-decoration: none; }
.stopka a:hover { text-decoration: underline; }
.stopka .o-stronie { color: var(--na-ciemnym-2); max-width: 26rem; line-height: 1.6; }
.stopka .dol { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--linia-ciemna); color: var(--na-ciemnym-2); font-size: 0.88rem; }
.stopka .dol p { margin: 0; }
@media (max-width: 48rem) { .stopka .siatka-stopki { grid-template-columns: 1fr 1fr; } .stopka .siatka-stopki > :first-child { grid-column: 1 / -1; } }

/* ---------- komunikaty, formularze (sklep) ---------- */
.baner-test { background: #fff3cd; color: #5c4400; border-bottom: 1px solid #e0c46c; text-align: center; font-family: var(--bezszeryf); font-size: 0.9rem; padding: 0.5rem 1rem; }
.alert { padding: 0.9rem 1.1rem; border-radius: var(--promien); margin: 0 0 1.25rem; font-family: var(--bezszeryf); font-size: 1rem; line-height: 1.5; }
.alert.blad { background: var(--blad-tlo); border: 1px solid var(--akcent); color: var(--blad-tekst); }
.alert.ok { background: var(--ok-tlo); border: 1px solid var(--ok-ramka); color: var(--ok-tekst); }
.alert.info { background: var(--info-tlo); border: 1px solid var(--linia); }
.alert ul { margin: 0.5rem 0 0; padding-left: 1.2rem; }
.alert a { color: inherit; font-weight: 700; }

.strona-formularza { padding-block: clamp(2rem, 5vw, 3.5rem) var(--sekcja); }
form.sklep { font-family: var(--bezszeryf); font-size: 1rem; }
form.sklep fieldset { border: 1px solid var(--linia); border-radius: var(--promien); padding: 1.25rem 1.5rem 1.5rem; margin: 0 0 1.5rem; background: var(--karta); }
form.sklep legend { font-family: var(--szeryf); font-size: 1.3rem; font-weight: 700; padding: 0 0.5rem; }
.pole { display: flex; flex-direction: column; gap: 0.3rem; margin: 0 0 1rem; }
.pole label { font-weight: 600; font-size: 0.95rem; }
.pole input, .pole select, .pole textarea {
  min-height: 2.75rem; padding: 0.5rem 0.75rem; font: inherit; border: 1px solid var(--tekst-2);
  border-radius: var(--promien); background: var(--papier); color: var(--tekst);
}
.pole input:focus, .pole select:focus, .pole textarea:focus { border-color: var(--akcent); }
.pole .podpowiedz, .podpowiedz { font-size: 0.88rem; color: var(--tekst-2); }
.pole.blad input, .pole.blad select { border-color: var(--akcent); border-width: 2px; }
.komunikat-bledu { color: var(--akcent); font-size: 0.9rem; font-weight: 700; }
.siatka { display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); gap: 0 1rem; }
.produkt-wiersz { display: flex; justify-content: space-between; gap: 1rem; align-items: center; padding: 0.75rem 0; border-bottom: 1px solid var(--linia); }
.produkt-wiersz:last-child { border-bottom: 0; }
.produkt-wiersz .ilosc { width: 5.5rem; min-height: 2.6rem; font: inherit; padding: 0.35rem 0.6rem; border: 1px solid var(--tekst-2); border-radius: var(--promien); background: var(--papier); color: var(--tekst); }
.produkt-wiersz small { display: block; color: var(--tekst-2); font-size: 0.88rem; }
.opcja { display: flex; gap: 0.7rem; align-items: flex-start; padding: 0.7rem 0.8rem; border-radius: var(--promien); cursor: pointer; }
.opcja:hover { background: var(--papier-2); }
.opcja input { margin-top: 0.3rem; accent-color: var(--akcent); }
.opcja .cena { margin-left: auto; font-weight: 700; white-space: nowrap; }
.zgoda-pole { display: flex; gap: 0.65rem; align-items: flex-start; margin: 0 0 0.85rem; font-size: 0.95rem; line-height: 1.5; }
.zgoda-pole input { margin-top: 0.25rem; width: 1.1rem; height: 1.1rem; accent-color: var(--akcent); flex: none; }
.wielkie-litery { text-transform: uppercase; }
.podsumowanie { width: 100%; border-collapse: collapse; margin: 0 0 1rem; }
.podsumowanie td { padding: 0.4rem 0; }
.podsumowanie td:last-child { text-align: right; white-space: nowrap; font-variant-numeric: lining-nums tabular-nums; }
.podsumowanie tr.razem td { border-top: 2px solid var(--tekst); font-weight: 700; font-size: 1.15rem; padding-top: 0.7rem; }
.punkt-wybrany { font-size: 0.92rem; margin: 0.25rem 0 0.75rem; }
.mapa-inpost { height: 28rem; margin: 0.75rem 0 1rem; border: 1px solid var(--linia); border-radius: var(--promien); overflow: hidden; }
.prawne h2 { font-size: 1.35rem; margin-top: 2.25rem; }
.prawne .szkic { font-family: var(--bezszeryf); }
.komunikat-strona { padding-block: var(--sekcja); }

/* ---------- panel (admin) ---------- */
.admin { max-width: 72rem; margin: 0 auto; padding: 1.5rem; font-family: var(--bezszeryf); font-size: 0.95rem; }
.admin table { width: 100%; border-collapse: collapse; }
.admin th, .admin td { text-align: left; padding: 0.45rem 0.5rem; border-bottom: 1px solid var(--linia); vertical-align: top; }
.admin .status { display: inline-block; padding: 0.1rem 0.5rem; border-radius: 3px; background: var(--papier-2); font-size: 0.8rem; }
.admin .status.oplacone { background: #fff3cd; color: #3d2f00; }
.admin .status.wyslane { background: #e3f1e5; color: #1e4325; }
.admin .status.do_sprawdzenia, .admin .status.platnosc_nieudana { background: #f8e1e1; color: #5a1414; }
.admin form.inline { display: inline; }
.admin .karty { display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); gap: 1rem; }
.admin .karta { border: 1px solid var(--linia); border-radius: 4px; padding: 1rem; background: var(--karta); }
.admin button { font: inherit; padding: 0.35rem 0.9rem; cursor: pointer; }

/* ---------- druk ---------- */
@media print {
  .naglowek, .stopka, .cta, .menu-mobilne, .pomin, .dalej, .zapis { display: none !important; }
  .ciemne { background: none; color: #000; }
  .ciemne * { color: #000 !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  a { color: #000; }
  .tresc a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.85em; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* ===== Faza 2: historia i wydarzenia (2026-10-05) ===== */
.lista-artykulow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); gap: 1.25rem; }
.lista-artykulow article { position: relative; height: 100%; padding: 1.75rem 1.6rem 1.4rem; background: var(--karta); border: 1px solid var(--linia); border-radius: var(--promien); box-shadow: var(--cien); transition: border-color .15s ease, transform .15s ease; }
.lista-artykulow article:hover { border-color: var(--akcent); transform: translateY(-2px); }
.lista-artykulow .numer { display: block; font-size: 2rem; font-weight: 700; line-height: 1; color: var(--akcent); margin-bottom: 0.75rem; }
.lista-artykulow h2 { font-size: 1.35rem; margin: 0 0 0.6rem; }
.lista-artykulow h2 a { color: var(--tekst); text-decoration: none; }
.lista-artykulow h2 a::after { content: ""; position: absolute; inset: 0; }  /* cała karta klikalna */
.lista-artykulow p { font-size: 1rem; line-height: 1.6; color: var(--tekst-2); margin: 0 0 0.75rem; }
.meta-artykulu { font-family: var(--bezszeryf); font-size: 0.9rem; color: var(--tekst-2); margin: 0 0 1.5rem; }
.lista-artykulow .meta-artykulu { margin: 0; }
.uwaga-historia { margin-top: 2rem; max-width: var(--szer-tekst); }

.artykul h2 { font-size: clamp(1.4rem, 3vw, 1.75rem); }
.artykul table { width: 100%; border-collapse: collapse; margin: 0.5rem 0 1.5rem; font-family: var(--bezszeryf); font-size: 1rem; }
.artykul th, .artykul td { text-align: left; padding: 0.55rem 0.75rem; border-bottom: 1px solid var(--linia); }
.artykul th { font-weight: 700; color: var(--tekst-2); }
.artykul td:last-child, .artykul th:last-child { text-align: right; font-variant-numeric: lining-nums tabular-nums; }
sup.przypis { font-family: var(--bezszeryf); font-size: 0.7em; line-height: 0; margin-left: 0.08em; }
sup.przypis a { text-decoration: none; padding: 0 0.12em; border-radius: 2px; }
sup.przypis a:hover { background: var(--papier-2); }
.zrodla-artykulu { margin-top: 3rem; padding-top: 1.5rem; border-top: 2px solid var(--tekst); }
.zrodla-artykulu h2 { font-size: 1.3rem; }
.zrodla-lista li:target { background: var(--papier-2); }

.wydarzenia-lista { list-style: none; margin: 0 0 1.5rem; padding: 0; display: grid; gap: 1rem; }
.wydarzenie { display: grid; grid-template-columns: 5.5rem 1fr; gap: 1.25rem; padding: 1.25rem; background: var(--karta); border: 1px solid var(--linia); border-radius: var(--promien); scroll-margin-top: 6rem; }
.wydarzenie:target { border-color: var(--akcent); box-shadow: inset 0 0 0 1px var(--akcent); }
.wydarzenie.odwolane h3 { text-decoration: line-through; }
.data-blok { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0.6rem 0.3rem; border-radius: var(--promien); background: var(--cela); color: var(--na-ciemnym); text-align: center; align-self: start; }
.data-blok .dzien { font-size: 2rem; font-weight: 700; line-height: 1; }
.data-blok .miesiac { font-family: var(--bezszeryf); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--swiatlo); margin-top: 0.2rem; }
.data-blok .rok { font-family: var(--bezszeryf); font-size: 0.8rem; color: var(--na-ciemnym-2); }
.typ-wydarzenia { margin: 0 0 0.2rem; font-family: var(--bezszeryf); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--akcent); }
.opis-wydarzenia h3 { margin: 0 0 0.35rem; font-size: 1.2rem; }
.opis-wydarzenia p { margin: 0 0 0.5rem; font-size: 1rem; line-height: 1.6; }
.opis-wydarzenia .kiedy, .opis-wydarzenia .miejsce { font-family: var(--bezszeryf); font-size: 0.95rem; color: var(--tekst-2); }
.opis-wydarzenia .akcje { font-family: var(--bezszeryf); font-size: 0.92rem; margin: 0.25rem 0 0; }
.wydarzenia-lista.kompaktowa .opis-wydarzenia > p:not(.typ-wydarzenia):not(.kiedy):not(.akcje) { display: none; }
@media (max-width: 30rem) { .wydarzenie { grid-template-columns: 4.25rem 1fr; gap: 0.9rem; padding: 1rem; } .data-blok .dzien { font-size: 1.6rem; } }
@media (max-width: 68rem) and (min-width: 54.01rem) { .menu-lista a { padding: 0.5rem 0.5rem; } .menu-lista { font-size: 0.92rem; } }