/* =====================================================================
   WARSTWA D · AKTUALNOŚCI I WPIS
   Strony renderowane przez PHP korzystają z tego samego systemu, co
   strona główna (dist/app.css). Tutaj tylko to, czego tam nie ma:
   nagłówek listy, karta wpisu wiodącego, typografia artykułu.
   ===================================================================== */

/* Nagłówek warstwy D na podstronach jest przyklejony, ale nie chowa
   paska — na liście wpisów nie ma czego chować. */
.d--strona{padding-top:0}
.d-szczyt--staly{position:sticky;background:rgba(5,11,19,.92);
  backdrop-filter:blur(16px) saturate(1.25);box-shadow:0 1px 0 var(--kreska-cicha)}
.d-gora__tel{font-family:var(--mono);font-size:11.52px;letter-spacing:.05em;
  color:var(--tekst-jasny);text-decoration:none;white-space:nowrap;flex:none}
.d-gora__tel:hover{color:var(--zloto-jasne)}

/* ══ NAGŁÓWEK LISTY ════════════════════════════════════════════════ */
.d-blogtop{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--tusz-0);color:var(--tekst-jasny);
  padding-block:clamp(96px,11vw,144px) clamp(48px,6vw,72px);
}
.d-blogtop__tlo{position:absolute;inset:-10%;z-index:-2;background-size:cover;
  background-position:center 35%;opacity:.34;filter:saturate(.45)}
.d-blogtop__cien{position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(56% 48% at 20% 40%,rgba(5,11,19,.92),transparent 74%),
    linear-gradient(180deg,rgba(5,11,19,.9) 0%,rgba(5,11,19,.72) 40%,var(--tusz-0) 100%)}
.d-blogtop__osi{max-width:min(1320px,100%)}
.d-blogtop h1{font-size:clamp(32px,21.6px + 2.6vw,49.6px);max-width:15em;margin:0 0 20.8px}
.d-blogtop .d-lead{max-width:58ch}

/* filtr kategorii */
.d-kategorie{display:flex;flex-wrap:wrap;gap:8px;margin-top:36px}
.d-kat{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:11.2px;letter-spacing:.08em;
  padding:9.92px 16px;text-decoration:none;
  color:var(--tekst-cichy);background:rgba(15,29,46,.55);
  border:1px solid var(--kreska-cicha);min-height:24px;
  transition:border-color .35s var(--ex),color .35s var(--ex),background .35s var(--ex);
}
.d-kat:hover{border-color:var(--kreska);color:var(--tekst-jasny);background:rgba(22,48,74,.6)}
.d-kat--akt{border-color:transparent;color:var(--tusz-0);background:var(--folia-cicha)}
.d-kat__n{font-size:9.92px;opacity:.72;font-variant-numeric:tabular-nums}

/* ══ WPIS WIODĄCY ══════════════════════════════════════════════════ */
.d-wiodacy{background:var(--tusz-0);color:var(--tekst-jasny);padding-block:0 var(--rytm)}
.d-wiodacy__karta{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  text-decoration:none;background:var(--tusz-1);
  border:1px solid var(--kreska-cicha);overflow:hidden;
  transition:border-color .5s var(--ex),box-shadow .5s var(--ex);
}
.d-wiodacy__karta:hover{border-color:rgba(200,155,60,.5);
  box-shadow:0 32px 64px -40px rgba(0,0,0,.9)}
.d-wiodacy__foto{display:block;overflow:hidden;background:var(--tusz-2);min-height:320px}
.d-wiodacy__foto img{width:100%;height:100%;object-fit:cover;
  filter:grayscale(.35) contrast(1.05);transition:transform 1.3s var(--ex),filter .6s var(--ex)}
.d-wiodacy__karta:hover .d-wiodacy__foto img{transform:scale(1.04);filter:grayscale(0)}
.d-wiodacy__tresc{padding:clamp(28.8px,3.4vw,48px);display:flex;flex-direction:column;
  gap:16px;justify-content:center}
.d-wiodacy__meta{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.d-wiodacy__meta .d-etykieta{margin:0}
.d-wiodacy__meta time{font-family:var(--mono);font-size:10.88px;letter-spacing:.1em;
  color:var(--tekst-cichy)}
.d-wiodacy__tytul{font-family:var(--serif);font-weight:600;
  font-size:clamp(21.6px,17.6px + 1.1vw,32px);line-height:1.22;letter-spacing:-.014em;
  color:var(--tekst-jasny);text-wrap:balance}
.d-wiodacy__zajawka{font-size:var(--t-lead);line-height:1.68;color:var(--tekst-cichy)}

/* ══ SIATKA WPISÓW ═════════════════════════════════════════════════ */
.d-lista-wpisow{background:var(--papier-2);color:var(--tekst-ciemny)}
.d-lista-wpisow .d-wpisy{grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
/* Karty listy nie dziedziczą `span 2` z modułu bloga strony głównej.
   Przy trzech kolumnach każda zajmowała dwie, więc druga nie mieściła się
   już w wierszu i desktop wyglądał jak jedna wąska kolumna. */
.d-lista-wpisow .d-wpis{grid-column:auto}
.d-wpis__foto--pusta{display:grid;place-items:center;background:var(--tusz-1)}
.d-wpis__meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.d-wpis__kat{
  font-family:var(--mono);font-size:9.6px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--zloto-ciemne);border:1px solid rgba(200,155,60,.34);padding:3.2px 8px;
}
.d-wpis__zajawka{font-size:14.4px;line-height:1.6;color:var(--tekst-ciemny-2);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* stronicowanie */
.d-strony{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;
  margin-top:clamp(40px,5vw,64px)}
.d-strony .page-numbers{
  display:inline-grid;place-items:center;min-width:44px;min-height:44px;padding:0 14.4px;
  font-family:var(--mono);font-size:11.52px;letter-spacing:.06em;text-decoration:none;
  color:var(--tekst-ciemny-2);border:1px solid var(--kreska-ciemna);background:var(--papier);
  transition:border-color .35s var(--ex),color .35s var(--ex),background .35s var(--ex);
}
.d-strony .page-numbers:hover{border-color:rgba(200,155,60,.55);color:var(--tekst-ciemny)}
.d-strony .page-numbers.current{background:var(--tusz-0);color:var(--zloto-jasne);
  border-color:var(--tusz-0)}
.d-strony .dots{border-color:transparent;background:transparent}

/* ══ WPIS ══════════════════════════════════════════════════════════ */
.d-artykul{background:var(--papier);color:var(--tekst-ciemny)}
.d-artykul__szczyt{position:relative;isolation:isolate;overflow:hidden;
  background:var(--tusz-0);color:var(--tekst-jasny);
  padding-block:clamp(96px,11vw,144px) clamp(40px,5vw,64px)}
.d-artykul__foto{position:absolute;inset:-8%;z-index:-2;background-size:cover;
  background-position:center 35%;opacity:.42;filter:saturate(.5)}
.d-artykul__cien{position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(58% 52% at 24% 46%,rgba(5,11,19,.94),transparent 76%),
    linear-gradient(180deg,rgba(5,11,19,.88) 0%,rgba(5,11,19,.72) 44%,var(--tusz-0) 100%)}
.d-artykul__naglowek{max-width:min(1320px,100%)}
.d-artykul__szczyt h1{font-size:clamp(29.6px,20px + 2.5vw,46.4px);
  line-height:1.16;max-width:19em;margin:19.2px 0}

.d-okruszki{display:flex;flex-wrap:wrap;align-items:center;gap:9.6px;
  font-family:var(--mono);font-size:10.56px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--tekst-cichy)}
.d-okruszki a{text-decoration:none;padding-block:4.8px}
.d-okruszki a:hover{color:var(--zloto-jasne)}

.d-artykul__meta{display:flex;flex-wrap:wrap;align-items:center;gap:11.2px;
  font-family:var(--mono);font-size:11.2px;letter-spacing:.08em;color:var(--tekst-cichy)}

/* układ: tekst plus lepka kolumna boczna */
.d-artykul__uklad{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);
  gap:clamp(40px,5vw,72px);align-items:start;
  padding-block:clamp(48px,6vw,80px)}

/* Typografia artykułu. Miara 68 znaków, wyraźne śródtytuły, cytat
   z pionową kreską — czyta się jak tekst redakcyjny, nie jak pismo. */
.d-artykul__tresc{max-width:68ch;font-size:var(--t-lead);line-height:1.78;
  color:var(--tekst-ciemny-2)}
.d-artykul__tresc > * + *{margin-top:1.3em}
/* Wcześniej stało tu `p{margin:0}` i to była przyczyna, dla której cały
   artykuł czytał się jak jedna płachta: reguła `p` ma wyższą specyficzność
   niż `> * + *`, więc zerowała odstęp między akapitami mimo tamtej reguły.
   Odstęp ustawia teraz wyłącznie reguła sąsiedztwa, a zeruje się go tylko
   przy pierwszym elemencie. */
.d-artykul__tresc > :first-child{margin-top:0}
.d-artykul__tresc :is(h2,h3,h4){color:var(--tekst-ciemny);font-family:var(--serif);
  letter-spacing:-.012em;margin-top:2.2em;margin-bottom:.7em;text-wrap:balance}
.d-artykul__tresc h2{font-size:clamp(21.6px,18.4px + .9vw,29.6px);line-height:1.24;
  font-weight:600;padding-top:22.4px;border-top:1px solid var(--kreska-ciemna)}
.d-artykul__tresc h3{font-size:clamp(17.92px,16.48px + .45vw,21.6px);line-height:1.3;font-weight:600}
.d-artykul__tresc strong{color:var(--tekst-ciemny);font-weight:600}
.d-artykul__tresc a{color:var(--zloto-ciemne);text-decoration:none;
  border-bottom:1px solid rgba(124,92,28,.4);transition:border-color .35s var(--ex)}
.d-artykul__tresc a:hover{border-color:var(--zloto-ciemne)}
.d-artykul__tresc :is(ul,ol){padding-left:0;list-style:none;display:grid;gap:11.2px}
.d-artykul__tresc li{position:relative;padding-left:25.6px}
.d-artykul__tresc ul li::before{content:"";position:absolute;left:0;top:.62em;
  width:8px;height:8px;border:1px solid var(--zloto);transform:rotate(45deg)}
.d-artykul__tresc ol{counter-reset:d-li}
.d-artykul__tresc ol li{counter-increment:d-li}
.d-artykul__tresc ol li::before{content:counter(d-li,decimal-leading-zero);
  position:absolute;left:0;top:.1em;font-family:var(--mono);font-size:11.2px;
  letter-spacing:.1em;color:var(--zloto-ciemne)}
.d-artykul__tresc blockquote{margin:2em 0;padding:0 0 0 24px;
  border-left:2px solid var(--zloto);font-family:var(--serif);font-style:italic;
  font-size:clamp(17.6px,16px + .55vw,21.6px);line-height:1.5;color:var(--tekst-ciemny)}
.d-artykul__tresc blockquote p{margin:0}
.d-artykul__tresc img{width:100%;height:auto;border:1px solid var(--kreska-ciemna)}
.d-artykul__tresc figure{margin:2em 0}
.d-artykul__tresc figcaption{margin-top:11.2px;font-family:var(--mono);font-size:10.88px;
  letter-spacing:.08em;color:var(--tekst-cichy)}
.d-artykul__tresc table{width:100%;border-collapse:collapse;font-size:14.72px}
.d-artykul__tresc :is(th,td){padding:12px 14.4px;border-bottom:1px solid var(--kreska-ciemna);
  text-align:left}
.d-artykul__tresc th{font-family:var(--mono);font-size:10.56px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--zloto-ciemne);font-weight:400}

.d-artykul__tagi{display:flex;flex-wrap:wrap;align-items:center;gap:9.6px;
  margin-top:48px;padding-top:25.6px;border-top:1px solid var(--kreska-ciemna)}
.d-artykul__tagi .d-etykieta{margin:0 9.6px 0 0}
.d-artykul__tagi .d-kat{background:var(--papier-2);border-color:var(--kreska-ciemna);
  color:var(--tekst-ciemny-2)}

/* kolumna boczna */
.d-artykul__bok{position:sticky;top:136px}
.d-artykul__panel{background:var(--tusz-0);color:var(--tekst-jasny);
  border:1px solid var(--kreska);padding:clamp(24px,2.8vw,32px);
  display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.d-artykul__panel-tyt{font-family:var(--serif);font-weight:600;font-size:20px;
  line-height:1.25;margin:6.4px 0 0}
.d-artykul__panel-txt{font-size:14.4px;line-height:1.62;color:var(--tekst-cichy);margin:0}
.d-artykul__panel .d-btn{width:100%;justify-content:center}

/* ══ WĄSKIE EKRANY ═════════════════════════════════════════════════ */
@media(max-width:1100px){
  .d-wiodacy__karta{grid-template-columns:1fr}
  .d-wiodacy__foto{min-height:230px}
  .d-artykul__uklad{grid-template-columns:1fr}
  .d-artykul__bok{position:static;max-width:420px}
  .d-gora__tel{display:none}
}
@media(max-width:760px){
  .d-blogtop{padding-block:88px 40px}
  .d-artykul__szczyt{padding-block:88px 32px}
  .d-artykul__tresc{font-size:16px}
  .d-kategorie{gap:6.4px}
  .d-kat{font-size:10.56px;padding:8.8px 12.8px}
}


/* Kadry wpisów muszą mieć tło także zanim obraz się wczyta. */
.d-wiodacy__foto,.d-wpis__foto{background:var(--tusz-2)}
.d-wiodacy__foto picture,.d-wpis__foto picture{display:block;width:100%;height:100%}
.d-wiodacy__foto img,.d-wpis__foto img{width:100%;height:100%;object-fit:cover;display:block}

/* ══ RYTM ARTYKUŁU ═════════════════════════════════════════════════
   Tekst prawniczy czyta się długo. Bez wyraźnych odstępów i bez różnicy
   między akapitem a śródtytułem wygląda jak wydruk, a nie jak artykuł.
   ══════════════════════════════════════════════════════════════════ */
.d-artykul__tresc > * + *{margin-top:1.45em}

/* Śródtytuł potrzebuje więcej powietrza nad sobą niż pod: należy do tego,
   co po nim, a nie do tego, co przed. */
.d-artykul__tresc > :is(h2,h3,h4){margin-top:2.1em}
.d-artykul__tresc > :is(h2,h3,h4) + *{margin-top:.85em}
.d-artykul__tresc h2{position:relative;padding-top:.55em}
.d-artykul__tresc h2::before{
  content:"";position:absolute;top:0;left:0;width:44px;height:2px;
  background:var(--folia-cicha);
}

/* Pierwszy akapit jako lead — wprowadza w tekst i daje oku punkt startu. */
.d-artykul__tresc > p:first-of-type{
  font-size:1.12em;line-height:1.66;color:var(--tekst-ciemny);
}

/* Listy: znacznik rysowany, nie systemowy kropka-kreska. */
.d-artykul__tresc :is(ul,ol) > li{position:relative;padding-left:26px}
.d-artykul__tresc ul > li::before{
  content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;
  border:1px solid var(--zloto);transform:rotate(45deg);
}
.d-artykul__tresc ol{counter-reset:poz}
.d-artykul__tresc ol > li{counter-increment:poz}
.d-artykul__tresc ol > li::before{
  content:counter(poz,decimal-leading-zero);position:absolute;left:0;top:.16em;
  font-family:var(--mono);font-size:.72em;letter-spacing:.06em;color:var(--zloto-ciemne);
}

/* Cytat blokowy — w tekście o orzeczeniach to zwykle fragment wyroku. */
.d-artykul__tresc blockquote{
  margin-inline:0;padding:4px 0 4px 22px;
  border-left:2px solid var(--zloto);
  font-family:var(--serif);font-style:italic;
  font-size:1.08em;line-height:1.6;color:var(--tekst-ciemny);
}
.d-artykul__tresc blockquote p{margin:0}
.d-artykul__tresc blockquote > * + *{margin-top:.6em}

/* Tabela w artykule bywa zestawieniem sygnatur — musi dać się przewinąć
   na telefonie zamiast rozpychać stronę. */
.d-artykul__tresc table{width:100%;border-collapse:collapse;font-size:.92em}
.d-artykul__tresc :is(th,td){padding:10px 12px;text-align:left;
  border-bottom:1px solid var(--kreska-ciemna)}
.d-artykul__tresc th{font-family:var(--mono);font-size:.8em;letter-spacing:.1em;
  text-transform:uppercase;color:var(--tekst-ciemny-2)}
.d-artykul__tresc figure{margin-inline:0}
.d-artykul__tresc :is(img,figure img){max-width:100%;height:auto;display:block}
.d-artykul__tresc figcaption{margin-top:9px;font-size:.82em;color:var(--tekst-ciemny-2)}
.d-artykul__tresc hr{border:0;height:1px;background:var(--kreska-ciemna);margin-block:2em}

/* ══ PODPIS AUTORSKI ═══════════════════════════════════════════════
   Tekst o cudzym kredycie musi mieć nazwisko. Blok stoi po treści,
   a przed kategoriami — czytelnik dochodzi do końca artykułu i od razu
   widzi, kto za niego odpowiada, zamiast szukać tego w stopce.
   Ramka jest cieplejsza niż karta CTA obok, żeby te dwie rzeczy się
   nie zlewały: jedna jest informacją, druga zaproszeniem. */
.d-autor{margin-top:56px;padding:clamp(22px,2.6vw,30px);
  background:var(--papier-2);border:1px solid var(--kreska-ciemna);
  border-left:2px solid var(--zloto-ciemne)}
.d-autor .d-etykieta{margin:0 0 14px}
.d-autor__rzad{display:flex;gap:22px;align-items:flex-start}
.d-autor__tresc{min-width:0}
.d-autor__imie{font-family:var(--serif);font-weight:600;
  font-size:clamp(18px,16px + .35vw,21px);line-height:1.25;
  color:var(--tekst-ciemny);margin:0}
.d-autor__rola{font-family:var(--mono);font-size:11px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--zloto-ciemne);margin:6px 0 0}
.d-autor__bio{font-size:14.6px;line-height:1.68;color:var(--tekst-ciemny-2);
  margin:14px 0 0;max-width:62ch}
.d-autor__fakty{list-style:none;margin:16px 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:8px 10px}
.d-autor__fakty li{font-family:var(--mono);font-size:10.4px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--tekst-ciemny-2);
  background:var(--papier);border:1px solid var(--kreska-ciemna);
  padding:5px 9px}
.d-autor__link{display:inline-flex;align-items:center;gap:7px;margin-top:16px;
  font-family:var(--mono);font-size:10.6px;letter-spacing:.13em;
  text-transform:uppercase;color:var(--zloto-ciemne);text-decoration:none;
  border-bottom:1px solid rgba(200,155,60,.35);padding-bottom:2px;
  transition:color .35s var(--ex),border-color .35s var(--ex)}
.d-autor__link:hover{color:var(--tekst-ciemny);border-color:var(--tekst-ciemny)}
@media(max-width:600px){
  .d-autor__rzad{gap:16px}
  .d-autor__fakty{gap:6px}
}