/*
 * Treść wpisów blogowych (single-post.php) i stron z czystym HTML w szablonie
 * 229 (cennik, oświadczenie o dostępności, polityki) — w wymiarach landingu
 * /fotografia-wnetrz-i-nieruchomosci/ (wzór Janka, pomiar 06.10.2026):
 *   pasek tytułu: #F5F5F5, 180 px, H1 Playfair 42/600 środek (tel. 28), 100 px pod paskiem;
 *   treść: 1140 px, Open Sans 15/1.75 #5C5C5C, akapit +14,4 px;
 *   H2 Playfair 36/300 środek (tel. 30), H3 Open Sans 20/600 #222 (tel. 17);
 *   ramka: tło białe, linia 1 px #E5E5E5, padding 40/32 px; linki #1D1D1D podkreślone.
 * Kontrast: #5C5C5C 6,7:1, #1D1D1D 16,9:1, #222 15,9:1. Bez `opacity` na tekście.
 */
:root {
	--js-ink: #1D1D1D;
	--js-graphite: #222222;
	--js-slate: #5C5C5C;
	--js-paper: #FFFFFF;
	--js-line: #E5E5E5;
	--js-mist: #F5F5F5;
	--js-szerokosc: 1140px;
}

/* ---------- Szablon wpisu: pasek tytułu jak na landingu ---------- */
body .site-main:is(.js-wpis, .js-blog) { max-width: none; width: 100%; margin: 0; padding: 0; }
:is(.js-wpis, .js-blog) .js-naglowek {
	background: var(--js-mist);
	min-height: 180px;
	padding: 10px;
	margin-bottom: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
}
:is(.js-wpis, .js-blog) .js-naglowek h1 {
	font: 600 42px/1.1 "Playfair Display", serif;
	color: var(--js-ink);
	text-align: center;
	max-width: var(--js-szerokosc);
	margin: 0;
}
.js-tresc { max-width: var(--js-szerokosc); margin: 0 auto 100px; padding: 0 10px; }

/* Strony 229: Elementor wymusza pełną szerokość widgetu treści */
.js-strona-html .e-con > .e-con-inner > .elementor-widget-theme-post-content,
.js-strona-html .e-con > .elementor-widget-theme-post-content {
	width: 100%;
	max-width: var(--js-szerokosc);
	margin-left: auto;
	margin-right: auto;
}

/* ---------- Typografia treści ---------- */
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) {
	font: 400 15px/1.75 "Open Sans", sans-serif;
	color: var(--js-slate);
}
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) :is(p, ul, ol, figure, table) { margin: 0 0 14.4px; }
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) p { color: var(--js-slate); }
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) h2 {
	font: 300 36px/1.2 "Playfair Display", serif;
	color: var(--js-ink);
	text-align: center;
	margin: 70px 0 40px;
}
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) > h2:first-child { margin-top: 0; }
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) h3 {
	font: 600 20px/1.35 "Open Sans", sans-serif;
	color: var(--js-graphite);
	margin: 32px 0 16px;
}
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) h4 {
	font: 600 17px/1.35 "Open Sans", sans-serif;
	color: var(--js-graphite);
	margin: 24px 0 12px;
}
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) :is(ul, ol) { padding-left: 1.5em; }
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) li strong { color: var(--js-ink); }
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) [id] { scroll-margin-top: 6rem; }

/* Linki: kolor i podkreślenie jak na landingu */
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) a {
	font: inherit;
	color: var(--js-ink);
	text-decoration: underline;
	text-underline-offset: .15em;
}
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content, .js-naglowek) a:focus-visible {
	outline: 2px solid var(--js-ink);
	outline-offset: 3px;
}

/* Zdjęcia w treści: wyśrodkowane, nie szersze niż 760 px */
.js-tresc figure.wp-block-image { max-width: 760px; margin: 32px auto; }
.js-tresc figure.wp-block-image img { display: block; width: 100%; height: auto; }

/* ---------- Tabele (cennik, oświadczenie) ---------- */
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) .wp-block-table :is(table, thead, tfoot) { border: 0; }
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
	font-variant-numeric: tabular-nums;
}
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) :is(th, td) {
	border: 0;
	border-bottom: 1px solid var(--js-line);
	background: none;
	padding: 14px 16px 14px 0;
	text-align: left;
	vertical-align: top;
}
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) th {
	font-weight: 600;
	color: var(--js-graphite);
	border-bottom: 1px solid var(--js-graphite);
}
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) :is(th, td):last-child { padding-right: 0; }
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) tbody > tr:nth-child(odd) > td { background: none; }
.js-cennik__tabela :is(th, td):last-child { text-align: right; white-space: nowrap; padding-left: 16px; }
.js-cennik__tabela td:last-child { color: var(--js-ink); font-weight: 600; }

/* „Ile to wychodzi w praktyce”: opis z lewej, kwota z prawej */
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) ul.js-cennik__przyklady { list-style: none; padding-left: 0; }
:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) ul.js-cennik__przyklady > li {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 10px 0;
	border-bottom: 1px solid var(--js-line);
}
ul.js-cennik__przyklady strong { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* ---------- Ramka „Umów sesję” jak karty na landingu ---------- */
.js-tresc .js-cta {
	background: var(--js-paper);
	border: 1px solid var(--js-line);
	padding: 40px 32px;
	margin-top: 70px;
	text-align: center;
}
.js-tresc .js-cta h2 { margin: 0 0 16px; }
.js-cta__przyciski { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 16px 24px; margin-top: 24px; }
.js-tresc a.js-cta__glowny {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 24px;
	border: 2px solid var(--js-ink);
	border-radius: 54px;
	color: var(--js-ink);
	text-decoration: none;
	font: 600 15px/1 "Open Sans", sans-serif;
}
.js-tresc a.js-cta__glowny:hover { background: var(--js-ink); color: var(--js-paper); }

/* ---------- Blog: lista, karty, pigułki, paginacja ---------- */
.js-blog__in { max-width: var(--js-szerokosc); margin: 0 auto 100px; padding: 0 10px; }
.js-blog__opis { text-align: center; color: var(--js-slate); font: 400 15px/1.75 "Open Sans", sans-serif; margin-bottom: 32px; }
.js-pigulki ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; list-style: none; margin: 0; padding: 0; }
.js-pigulki li { margin: 0; padding: 0; }
:is(.js-blog, .js-tresc) .js-pigulki a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 20px;
	border: 2px solid var(--js-ink);
	border-radius: 54px;
	color: var(--js-ink);
	text-decoration: none;
	font: 600 14px/1.2 "Open Sans", sans-serif;
}
:is(.js-blog, .js-tresc) .js-pigulki a:is(:hover, [aria-current="page"]) { background: var(--js-ink); color: var(--js-paper); }
.js-pigulki a:focus-visible, .js-karta a:focus-visible, .js-blog .nav-links a:focus-visible { outline: 2px solid var(--js-ink); outline-offset: 3px; }
.js-blog .js-pigulki { margin-bottom: 48px; }

.js-karty { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; list-style: none; margin: 0; padding: 0; }
.js-karty > li { margin: 0; padding: 0; }
.js-karta { position: relative; height: 100%; background: var(--js-paper); border: 1px solid var(--js-line); display: flex; flex-direction: column; }
.js-karta:focus-within { outline: 2px solid var(--js-ink); outline-offset: 2px; }
.js-karta__zdjecie img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.js-karta__tresc { padding: 40px 32px; }
:is(.js-blog, .js-tresc) :is(h2, h3).js-karta__tytul { font: 600 20px/1.35 "Open Sans", sans-serif; color: var(--js-graphite); text-align: left; margin: 0 0 16px; }
:is(.js-blog, .js-tresc) .js-karta__tytul a { font: inherit; color: inherit; text-decoration: none; }
:is(.js-blog, .js-tresc) .js-karta__tytul a::after { content: ""; position: absolute; inset: 0; }
:is(.js-blog, .js-tresc) .js-karta:hover .js-karta__tytul a { text-decoration: underline; }
.js-karta a:focus-visible { outline: none; }
:is(.js-blog, .js-tresc) p.js-karta__zajawka { margin: 0; color: var(--js-slate); font: 400 15px/1.75 "Open Sans", sans-serif; }

.js-blog .pagination { margin-top: 48px; }
.js-blog .nav-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.js-blog .nav-links :is(a, span.current) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 16px;
	border: 1px solid var(--js-line);
	color: var(--js-ink);
	text-decoration: none;
	font: 600 14px/1 "Open Sans", sans-serif;
}
.js-blog .nav-links span.current { background: var(--js-ink); border-color: var(--js-ink); color: var(--js-paper); }
.js-blog .nav-links a:hover { border-color: var(--js-ink); }

/* Stopka wpisu: tematy i powiązane */
.js-wpis__tematy { margin-top: 70px; text-align: center; }
.js-tresc p.js-wpis__tematy-etykieta { font: 600 15px/1.4 "Open Sans", sans-serif; color: var(--js-graphite); margin-bottom: 16px; }
.js-tresc .js-pigulki ul.js-pigulki__lista, .js-tresc nav.js-pigulki ul { padding-left: 0; margin: 0; }
.js-tresc .js-wpis__powiazane ul.js-karty { margin: 0; padding: 0; }
.js-tresc ul.js-karty > li { margin: 0; }

/* ---------- Telefon: wartości landingu przy 390 px ---------- */
@media (max-width: 767px) {
	:is(.js-wpis, .js-blog) .js-naglowek h1 { font-size: 28px; }
	.js-tresc { padding: 0 40px; }
	:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) h2 { font-size: 30px; margin-top: 50px; }
	:is(.js-tresc, .js-strona-html .elementor-widget-theme-post-content) h3 { font-size: 17px; }
	.js-tresc .js-cta { padding: 32px 20px; }
	.js-blog__in { padding: 0 40px; }
	.js-karty { grid-template-columns: minmax(0, 1fr); }
	.js-karta__tresc { padding: 32px 20px; }
	.js-cennik__tabela :is(th, td):last-child { white-space: normal; }
}