/* ── Komponenty artykułów z części „Wiedza” ─────────────────────
   Ładowany WYŁĄCZNIE na stronach generowanych przez publikacja/zbuduj.py
   (artykuły z klasą .artykul-wiedza, /wiedza/, strony tematów).
   Tylko paleta i kroje z strona.css - żadnych nowych kolorów ani fontów.
   Zatwierdzone strony go nie ładują, więc na nie nie wpływa.
   ─────────────────────────────────────────────────────────── */

/* Szybka orientacja pod podpisem autorki */
.artykul-wiedza .meta-czytania { font-size: 12px; color: var(--muted); margin: 18px 0 0; }

/* W skrócie - odpowiedź dla kogoś, kto ma 10 sekund */
.skrot { background: var(--plum); color: var(--paper); border-radius: 9px; padding: 30px 32px; margin: 32px 0 12px; }
.skrot .eyebrow { color: var(--peach); font-size: 10px; margin-bottom: 16px; }
.skrot ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.skrot li { position: relative; padding-left: 36px; font-size: 16px; line-height: 1.6; }
.skrot li::before { content: "✓"; position: absolute; left: 0; top: 1px; width: 24px; height: 24px; border-radius: 50%;
  background: var(--peach); color: var(--plum); font-size: 13px; font-weight: 600; display: flex; align-items: center; justify-content: center; }
.skrot strong { color: var(--peach); font-weight: 600; }

/* Listy w treści - kafelki z ikoną zamiast gołych kropek */
.artykul-wiedza .block > ul, .artykul-wiedza .exercise ul { list-style: none; padding: 0; margin: 22px 0; display: grid; gap: 10px; }
.artykul-wiedza .block > ul > li, .artykul-wiedza .exercise ul > li { position: relative; margin: 0; padding: 14px 18px 14px 54px;
  background: var(--paper); border: 1px solid var(--line); border-radius: 9px; line-height: 1.6; }
.artykul-wiedza .block > ul > li::before, .artykul-wiedza .exercise ul > li::before { content: "✓"; position: absolute; left: 16px; top: 13px;
  width: 26px; height: 26px; border-radius: 50%; background: var(--lilac); color: var(--plum); font-size: 13px; font-weight: 600;
  display: flex; align-items: center; justify-content: center; }

/* Listy numerowane - ten sam język co kroki konsultacji na stronie głównej */
.artykul-wiedza .block > ol, .artykul-wiedza .exercise ol { list-style: none; counter-reset: krok; padding: 0; margin: 22px 0; display: grid; gap: 10px; }
.artykul-wiedza .block > ol > li, .artykul-wiedza .exercise ol > li { counter-increment: krok; position: relative; margin: 0;
  padding: 16px 20px 16px 66px; background: var(--lilac); border-radius: 9px; line-height: 1.6; min-height: 38px; }
.artykul-wiedza .exercise ol > li { background: var(--paper); }
.artykul-wiedza .block > ol > li::before, .artykul-wiedza .exercise ol > li::before { content: counter(krok); position: absolute; left: 16px; top: 13px;
  width: 36px; height: 36px; border-radius: 50%; background: var(--plum); color: var(--paper);
  font-family: Fraunces, Georgia, serif; font-style: italic; font-size: 18px; line-height: 1; display: flex; align-items: center; justify-content: center; }

/* Co pokazują badania / czego jeszcze nie wiemy */
.dowody { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 34px 0; }
.dowody > div { border-radius: 9px; padding: 26px 26px 22px; }
.dowody .wiemy { background: var(--sand); }
.dowody .nie-wiemy { background: var(--paper); border: 1px dashed #b6a4b0; }
.dowody h3 { font-size: 1rem; margin-bottom: 14px; }
.dowody ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; font-size: 15px; line-height: 1.6; }
.dowody li { position: relative; padding-left: 30px; }
.dowody li::before { position: absolute; left: 0; top: 2px; width: 20px; height: 20px; border-radius: 50%; font-size: 11px; font-weight: 600;
  display: flex; align-items: center; justify-content: center; }
.dowody .wiemy li::before { content: "✓"; background: var(--plum); color: var(--paper); }
.dowody .nie-wiemy li::before { content: "?"; background: var(--lilac); color: var(--plum); }

/* Kiedy warto porozmawiać ze specjalistą */
.kiedy-pomoc { background: var(--peach); border-radius: 9px; padding: 28px 30px; margin: 34px 0; }
.kiedy-pomoc .eyebrow { font-size: 10px; margin-bottom: 12px; color: var(--plum); }
.kiedy-pomoc h3 { margin-bottom: 12px; }
.kiedy-pomoc ul { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; }
.kiedy-pomoc li { position: relative; padding-left: 22px; line-height: 1.6; }
.kiedy-pomoc li::before { content: "→"; position: absolute; left: 0; color: #ac6b33; font-weight: 600; }
.kiedy-pomoc p { margin: 0 0 10px; }
.kiedy-pomoc a { font-weight: 600; }

/* Źródła - z krótkim opisem, czym jest badanie */
.artykul-wiedza .sources ol { padding-left: 20px; display: grid; gap: 10px; }
.artykul-wiedza .sources li { line-height: 1.55; }
.artykul-wiedza .sources .rodzaj { display: block; color: var(--muted); font-size: 11.5px; margin-top: 2px; }
.artykul-wiedza .sources .wyjasnienie { font-size: 12px; margin: 0 0 14px; }

@media (max-width: 760px) {
  .dowody { grid-template-columns: 1fr; }
  .skrot, .kiedy-pomoc { padding: 24px 22px; }
}

/* Tabele - tekst wyśrodkowany w pionie w każdej komórce (strona.css ma „top”) */
.artykul-wiedza th, .artykul-wiedza td { vertical-align: middle; }