/* Strony statyczne: o nas, kontakt, cennik, dla pacjenta, mapa, polityki. */

.strona-head { background: var(--c-brand-bg); padding-block: var(--sp-7) var(--sp-6); }
.strona-head h1 { margin-bottom: var(--sp-3); }
.strona-head__lead { max-width: 62ch; color: var(--c-text-soft); margin: 0 0 var(--sp-4); }

.strona-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--sp-7);
	padding-block: var(--sp-7);
}
@media (min-width: 992px) {
	.strona-layout { grid-template-columns: minmax(0, 1fr) 320px; }
	.strona-aside { position: sticky; top: calc(var(--h-header) + var(--sp-4)); align-self: start; }
}
.karta-kontakt__adres { font-size: 0.88rem; line-height: 1.6; }

/* --- kontakt --- */
.kontakt-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--sp-6);
	padding-block: var(--sp-7);
	align-items: start;
}
@media (min-width: 900px) {
	.kontakt-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-7); }
}
.kontakt-glowny__nad {
	margin: 0 0 var(--sp-2);
	font-size: 0.76rem; font-weight: 700; letter-spacing: 0.14em;
	text-transform: uppercase; color: var(--c-brand);
}
.kontakt-glowny__tel {
	display: inline-block;
	font-family: var(--f-heading);
	font-size: 1.9rem; font-weight: 700;
	color: var(--c-cta);
	text-decoration: none;
	line-height: 1.1;
}
.kontakt-hours { margin-top: var(--sp-5); }
.kontakt-adres { font-style: normal; line-height: 1.65; margin-bottom: var(--sp-3); }
.kontakt-mail { font-weight: 600; }
.kontakt-dojazd { font-size: 0.88rem; color: var(--c-text-muted); }
.kontakt-form__nota { font-size: 0.86rem; color: var(--c-text-muted); margin-bottom: var(--sp-4); }
.form-szybki--pelny textarea.form-szybki__input { min-height: 110px; resize: vertical; }

/* --- mapa strony --- */
.mapa-strony { padding-block: var(--sp-7) var(--sp-8); }
.mapa-sekcja { margin-bottom: var(--sp-8); }
.mapa-sekcja h2 {
	font-size: 1.3rem;
	padding-bottom: var(--sp-2);
	border-bottom: 2px solid var(--c-brand-light);
	margin-bottom: var(--sp-4);
}
.mapa-podtytul {
	font-size: 0.8rem; font-weight: 700; letter-spacing: 0.1em;
	text-transform: uppercase; color: var(--c-brand);
	margin: var(--sp-5) 0 var(--sp-3);
}
.mapa-podtytul a { color: inherit; text-decoration: none; }
.mapa-lista { margin: 0; padding: 0; list-style: none; columns: 2; column-gap: var(--sp-6); }
@media (max-width: 599.98px) { .mapa-lista { columns: 1; } }
.mapa-lista li { margin-bottom: var(--sp-2); break-inside: avoid; }
.mapa-lista a { font-size: 0.9rem; color: var(--c-brand-dark); text-decoration: none; }
.mapa-lista a:hover { color: var(--c-cta); text-decoration: underline; }
.mapa-lista--pod { columns: 1; padding-left: var(--sp-4); margin-top: var(--sp-1); }
.mapa-rola { font-size: 0.78rem; color: var(--c-text-muted); }

/* --- dokumenty prawne --- */
.prose--dokument { max-width: 76ch; padding-block: var(--sp-7) var(--sp-8); font-size: 0.96rem; }
.prose--dokument h2 { font-size: 1.3rem; margin-top: var(--sp-7); }
.prose--dokument h3 { font-size: 1.06rem; }

/* --- cennik --- */
/* Tabele przychodza z bazy WordPressa i czesc ma sztywne atrybuty
   (cellpadding, width="100%", style="width: 99.9%"). Jedna z nich rozciagala
   sie do 1487 px i rozpychala cala strone na kazdej szerokosci ekranu.
   display:block + overflow-x zamyka przewijanie WEWNATRZ tabeli. */
.prose--cennik table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-collapse: collapse;
	margin-block: var(--sp-4) var(--sp-6);
	font-size: 0.94rem;
}
/* Komorki nie moga sie zwezac do zera przy dlugich nazwach zabiegow */
.prose--cennik th:first-child, .prose--cennik td:first-child { min-width: 15rem; }
.prose--cennik th, .prose--cennik td { padding: var(--sp-3); border-bottom: 1px solid var(--c-border); text-align: left; }
.prose--cennik td:last-child { text-align: right; font-family: var(--f-heading); font-weight: 600; white-space: nowrap; color: var(--c-brand-dark); }
.prose--cennik h3 { margin-top: var(--sp-6); color: var(--c-brand); }

/* --- wirtualny spacer --- */
/* Spacer jest wyzszy niz mapa - wystarczy podmienic zmienna, reszta
   (placeholder i iframe) dostosuje sie sama. */
.map-lazy--spacer {
	--map-h: clamp(380px, 46vw, 560px);
	margin-top: var(--sp-7);
}
.spacer-cta { padding-block: var(--sp-7) var(--sp-8); text-align: center; }
.spacer-cta h2 { font-size: var(--fs-h3); }
.spacer-cta p { color: var(--c-text-muted); margin-bottom: var(--sp-5); }

/* Zdjecie wstawione w tresc strony (np. zespol na /o-nas/).
   Bez zaokraglen i ramki - sama krawedz kadru wystarcza, zgodnie
   z zasadami w docs/ZASADY-DESIGNU.md. */
.tresc-foto {
	margin: var(--sp-6) 0;
}
.tresc-foto img {
	width: 100%;
	height: auto;
	display: block;
}
.tresc-foto figcaption {
	margin-top: var(--sp-2);
	font-size: 0.82rem;
	color: var(--c-text-muted);
}