/*
 * Wpisy bloga jako zwykłe strony (W18, decyzja Magdy 2A z 22.10.2026; generator: strona/narzedzia/blog.py).
 * Dokłada się do podstrony.css (kolory, czcionki, okruszki, przyciski, kafelki wpisów z sekcji 16) i działa tylko
 * wewnątrz <main class="ps ps-blog">. Treść wpisu to czysty HTML z WordPressa: h2–h4, p, listy, cytaty,
 * zdjęcia <figure class="wpis-foto"> i ramki <aside class="wpis-ramka">.
 */

/* Nagłówek wpisu: okruszki, etykieta z kategoriami, tytuł, data i zdjęcie w łuku */
.ps .ps-wpis__naglowek { padding: 104px 0 clamp(2rem, 1.6rem + 1.6vw, 3rem); }
.ps .ps-wpis__naglowek .okruszki li[aria-current] { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps .ps-wpis__naglowek .etykieta { margin-bottom: 1rem; }
.ps .ps-wpis__naglowek h1 { font-size: clamp(2rem, 1.35rem + 2.4vw, 3.3rem); line-height: 1.1; }
.ps .ps-wpis__meta { display: flex; flex-wrap: wrap; gap: .2em .6em; margin-top: 1.1rem; font-size: .875rem; color: var(--tekst-2); }
.ps .ps-wpis__meta span[aria-hidden] { color: var(--taupe); }
.ps .ps-wpis__zdjecie { margin-top: clamp(1.6rem, 1.2rem + 1.6vw, 2.6rem); }
.ps .ps-wpis__luk { aspect-ratio: 3 / 2; border-radius: 50% 50% 0 0 / 30% 30% 0 0; overflow: hidden; background: var(--greige); box-shadow: var(--cien); }
.ps .ps-wpis__luk img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.ps .ps-wpis__zdjecie figcaption { margin-top: .7rem; font-size: .8125rem; line-height: 1.5; color: var(--tekst-2); }
@media (min-width: 900px) { .ps .ps-wpis__naglowek { padding-top: 124px; } }

/* Treść wpisu: wygodna szerokość do czytania, odstępy między częściami */
.ps .ps-wpis__tresc { max-width: 44rem; margin-inline: auto; font-size: clamp(1rem, .97rem + .15vw, 1.0625rem); line-height: 1.75; }
.ps .ps-wpis__tresc > * + * { margin-top: 1.1em; }
.ps .ps-wpis__tresc p, .ps .ps-wpis__tresc li { color: var(--tekst-2); }
.ps .ps-wpis__tresc h2 { margin-top: 1.9em; font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.2rem); line-height: 1.15; }
.ps .ps-wpis__tresc h3 { margin-top: 1.7em; font-size: clamp(1.3rem, 1.18rem + .5vw, 1.6rem); }
.ps .ps-wpis__tresc h4 { margin-top: 1.5em; font-family: var(--sans-srednie); font-size: 1.0625rem; line-height: 1.4; letter-spacing: 0; color: var(--ink); }
.ps .ps-wpis__tresc h2 + *, .ps .ps-wpis__tresc h3 + *, .ps .ps-wpis__tresc h4 + * { margin-top: .7em; }
.ps .ps-wpis__tresc > :first-child { margin-top: 0; }
.ps .ps-wpis__tresc ul, .ps .ps-wpis__tresc ol { padding-left: 1.3em; }
.ps .ps-wpis__tresc ul { list-style: disc; }
.ps .ps-wpis__tresc ol { list-style: decimal; }
.ps .ps-wpis__tresc li + li { margin-top: .45em; }
.ps .ps-wpis__tresc li::marker { color: var(--taupe); }
.ps .ps-wpis__tresc hr { margin-block: 2.2em; border: 0; border-top: 1px solid var(--linia); }
.ps .ps-wpis__tresc .wpis-srodek { text-align: center; }
.ps .ps-wpis__tresc blockquote {
  padding-left: clamp(1rem, .7rem + 1.2vw, 1.6rem);
  border-left: 1px solid var(--taupe);
  font-family: var(--szeryf);
  font-size: clamp(1.2rem, 1.08rem + .5vw, 1.45rem);
  line-height: 1.4;
}
.ps .ps-wpis__tresc blockquote p { color: var(--ink); }
.ps .ps-wpis__tresc blockquote > * + * { margin-top: .7em; }
.ps .ps-wpis__tresc cite { display: block; font-family: var(--sans); font-size: .875rem; font-style: normal; color: var(--tekst-2); }

/* Zdjęcia w treści: szerokość z WordPressa (styl max-width), pionowe węższe, zawsze wyśrodkowane */
.ps .wpis-foto { margin-inline: auto; margin-block: 1.8em; }
.ps .wpis-foto img { width: 100%; border-radius: var(--promien-maly); }
.ps .wpis-foto figcaption { margin-top: .6rem; font-size: .8125rem; line-height: 1.5; text-align: center; color: var(--tekst-2); }
.ps .wpis-galeria { display: grid; gap: 14px; }
.ps .wpis-galeria .wpis-foto { max-width: none !important; margin: 0; }
@media (min-width: 560px) { .ps .wpis-galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Ramka (dawne bloki z tłem: „Okiem eksperta”, opinie, przedstawienie instruktorek) */
.ps .wpis-ramka { padding: clamp(1.3rem, 1rem + 1.2vw, 2rem); border-radius: var(--promien); background: var(--krem); }
.ps .wpis-ramka > * + * { margin-top: .9em; }
.ps .wpis-ramka::after { content: ""; display: block; clear: both; }
.ps .wpis-ramka .wpis-foto { margin-block: 0 1.2em; }
@media (min-width: 640px) {
  .ps .wpis-ramka .wpis-foto { float: left; width: 38%; margin: .2em 1.6em .8em 0; }
}

/* Czytaj też: trzy kafelki pod wpisem */
.ps-blog .ps-sekcja .przyciski { justify-content: center; }