/* Strony miast „pompy ciepła <miasto>” aslandi.pl (lab miasta/, od 14.10.2026): tylko klocki, których nie ma na stronie
   pomp. Wszystko inne (hero, quiz, cennik, tabele, listy z ikonami, filmy, FAQ, koniec) bierze pompy.css; te same zmienne. */

/* W skrócie: klocek pc-skrot strony pomp (pompy.css) na jasnym pasie między doborem a okolicą; karty białe */
.pc-skrot-sekcja { padding-block: clamp(40px, 5vw, 72px); background: var(--pc-tlo); }
.pc-miasto .pc-skrot > div { position: relative; min-height: 104px; padding-left: 108px; align-content: center; background: #fff; }
.pc-miasto .pc-skrot .pc-skrot-obraz { position: absolute; left: 14px; top: 50%; width: 80px; height: 80px; transform: translateY(-50%); object-fit: contain; }

/* okolica: tekst obok schematu mapy, pod spodem karty pomp z okolicy */
.pc-okolica-gora { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: clamp(20px, 3vw, 48px); align-items: center; }
.pc-okolica-tekst { min-width: 0; }
.pc-okolica-tekst .pc-link { margin-top: clamp(16px, 1.8vw, 22px); }
.pc-mapa { margin: 0; display: grid; gap: 8px; min-width: 0; }
.pc-mapa-svg { display: block; width: 100%; height: auto; font-family: inherit; }
.pc-mapa-tlo { fill: var(--pc-szalwia); }
.pc-mapa-trasa { fill: none; stroke: var(--pc-sosna); stroke-width: 2; stroke-dasharray: 7 7; opacity: 0.55; }
.pc-mapa-trasa-opis { font-size: 15px; font-weight: 600; fill: var(--pc-sosna); paint-order: stroke; stroke: var(--pc-szalwia); stroke-width: 4px; stroke-linejoin: round; }
.pc-mapa-pompa { fill: var(--pc-zloto); stroke: var(--pc-sosna); stroke-width: 2.5; }
.pc-mapa-biuro { fill: var(--pc-sosna); }
.pc-mapa-miasto { fill: var(--pc-sosna); }
.pc-mapa-miasto-obszar { fill: var(--pc-sosna); opacity: 0.12; }
.pc-mapa-podpis { font-size: 16px; font-weight: 500; fill: var(--pc-atrament); paint-order: stroke; stroke: var(--pc-szalwia); stroke-width: 4px; stroke-linejoin: round; }
.pc-mapa-podpis-miasto { font-size: 20px; font-weight: 600; fill: var(--pc-sosna); }
.pc-mapa-podpis-biuro { font-weight: 600; fill: var(--pc-sosna); }
.pc-mapa-skala { stroke: var(--pc-atrament); stroke-width: 2.5; fill: none; }
.pc-mapa-skala-opis { font-size: 14px; fill: var(--pc-szary); }
.pc-mapa figcaption { font-size: 13px; color: var(--pc-szary); }

.pc-okolica-karty { margin-top: clamp(24px, 2.8vw, 38px); display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(10px, 1.2vw, 16px); }
.pc-okolica-karta { display: grid; grid-template-rows: auto 1fr; border-radius: var(--pc-r-maly); background: #fff; border: 1px solid var(--pc-linia); overflow: hidden; box-shadow: var(--pc-cien-maly); min-width: 0; }
.pc-okolica-karta img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; background: var(--pc-linia); }
.pc-okolica-karta p { padding: 12px 14px 14px; display: grid; gap: 3px; align-content: start; }
.pc-okolica-karta strong { font-size: 16.5px; color: var(--pc-sosna); }
.pc-okolica-karta span { font-size: 14px; line-height: 1.4; color: var(--pc-szary); }
.pc-okolica-karta span + span { color: var(--pc-atrament); font-weight: 500; }
/* podpis tabeli nad tabelą: tabela ma zaokrąglone rogi z obcięciem, więc podpis bez wcięcia traci pierwszą literę */
@media (min-width: 601px) { .pc-miasto .pc-metoda-tabela .pc-tabela-metoda caption { padding-left: 14px; } }
.pc-dotacje #kociol { margin-top: clamp(28px, 3vw, 40px); }

/* ludzie firmy: portrety z sesji na stronie „O nas” przy serwisie i przy wniosku o dotację */
.pc-osoby { display: flex; flex-wrap: wrap; gap: 14px 30px; }
.pc-osoba { display: flex; align-items: center; gap: 14px; }
.pc-osoba img, .pc-osoba-karta img { width: 112px; height: 112px; flex: none; border-radius: 50%; object-fit: cover; background: #fff; border: 3px solid #fff; box-shadow: var(--pc-cien-maly); }
.pc-osoba > span { display: grid; gap: 2px; }
.pc-osoba strong, .pc-osoba-karta strong { font-size: 16.5px; color: var(--pc-sosna); }
.pc-osoba span span, .pc-osoba-karta figcaption > span { font-size: 14px; line-height: 1.45; color: var(--pc-szary); }
.pc-dotacje-gora { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); gap: clamp(20px, 3vw, 48px); align-items: end; }
.pc-dotacje-wstep { min-width: 0; }
.pc-osoba-karta { margin: 0; padding: 18px 20px; border-radius: var(--pc-r); background: var(--pc-szalwia); display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 16px; align-items: center; }
.pc-osoba-karta figcaption { display: grid; gap: 2px; }
.pc-sekcja .pc-osoba-karta .pc-osoba-tekst { margin-top: 6px; font-size: 15px; line-height: 1.5; color: var(--pc-atrament); }

/* dopłaty: karty programów i oś dat uchwały */
.pc-programy { margin-top: clamp(22px, 2.6vw, 34px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 22px); }
.pc-program { padding: 20px 22px; border-radius: var(--pc-r); background: var(--pc-tlo); border: 1px solid var(--pc-linia); display: grid; gap: 8px; align-content: start; min-width: 0; }
.pc-program .pc-program-obraz { width: 104px; height: 104px; margin: -6px 0 -2px -6px; object-fit: contain; }
.pc-sekcja .pc-program h3 { font-size: 18px; }
.pc-sekcja .pc-program-kwota { font-size: clamp(19px, 0.5vw + 16px, 22px); font-weight: 600; line-height: 1.3; color: var(--pc-sosna); font-variant-numeric: tabular-nums; }
.pc-program p { font-size: 15px; line-height: 1.55; color: var(--pc-atrament); }
.pc-program .pc-link-tekst { font-size: 14px; justify-self: start; }
.pc-dotacje .pc-tekst > .pc-ikona { width: 22px; height: 22px; margin-right: 8px; vertical-align: -5px; color: var(--pc-sosna); }
.pc-sekcja .pc-kapsula.pc-kapsula-h3 { font-size: 17.5px; }
/* oś dat uchwały: trzy terminy na jednej linii czasu (także na telefonie), na jasnym panelu; nie .pc-os — to oś procesu
   strony pomp (pompy.css) */
.pc-os-uchwaly { margin-top: 18px; max-width: 900px; padding: clamp(18px, 2.2vw, 26px) clamp(16px, 2.4vw, 30px); border-radius: var(--pc-r); background: var(--pc-szalwia); }
.pc-os-dat { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(10px, 2vw, 24px); padding-top: 32px; }
.pc-os-dat::before { content: ""; position: absolute; left: 10px; right: 0; top: 9px; height: 3px; border-radius: 3px; background: linear-gradient(to right, #9eaba3, var(--pc-sosna) 50%, var(--pc-zloto)); }
.pc-os-dat li { position: relative; display: grid; gap: 4px; align-content: start; min-width: 0; }
.pc-os-dat li::before { content: ""; position: absolute; top: -32px; left: 0; width: 22px; height: 22px; box-sizing: border-box; border-radius: 50%; background: #fff; border: 5px solid #9eaba3; }
.pc-os-dat li:nth-child(2)::before { border-color: var(--pc-sosna); }
.pc-os-dat li:last-child::before { border-color: var(--pc-zloto); }
.pc-os-dat strong { font-size: 16px; color: var(--pc-sosna); font-variant-numeric: tabular-nums; }
.pc-os-dat span { font-size: 14.5px; line-height: 1.45; color: var(--pc-atrament); }

/* ceny: cennik obok prawdziwego zdjęcia kotłowni, pod nimi „W cenie” w dwóch kolumnach (tabela nie rozciąga się już
   do wysokości karty obok) */
.pc-miasto .pc-cennik { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); grid-template-areas: "tabela foto" "wcenie wcenie"; align-items: start; }
.pc-miasto .pc-cennik > .pc-tabela { grid-area: tabela; }
.pc-miasto .pc-cennik > .pc-ceny-foto { grid-area: foto; }
.pc-miasto .pc-cennik > .pc-wcenie { grid-area: wcenie; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "w-h d-h" "w-l d-l" "dof dof"; column-gap: clamp(24px, 3.4vw, 56px); }
.pc-miasto .pc-wcenie > h3:first-child { grid-area: w-h; }
.pc-miasto .pc-wcenie > ul:not(.pc-wcenie-dojsc) { grid-area: w-l; }
.pc-miasto .pc-wcenie > .pc-wcenie-dojsc-h { grid-area: d-h; margin-top: 0; }
.pc-miasto .pc-wcenie > .pc-wcenie-dojsc { grid-area: d-l; }
.pc-miasto .pc-wcenie > .pc-wcenie-dof { grid-area: dof; }
.pc-ceny-foto { margin: 0; display: grid; gap: 8px; min-width: 0; }
.pc-ceny-foto img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--pc-r); background: var(--pc-linia); }
.pc-sekcja .pc-ceny-foto figcaption { font-size: 13.5px; line-height: 1.5; color: var(--pc-szary); }

/* koszt: słupki rocznego kosztu w dwóch domach (te same kwoty co tabela w <details>), wiersze z pompą wyróżnione */
.pc-wykresy { margin-top: clamp(20px, 2.4vw, 30px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.8vw, 22px); max-width: 1040px; }
.pc-wykres { margin: 0; padding: clamp(18px, 2.2vw, 26px); border-radius: var(--pc-r); background: #fff; border: 1px solid var(--pc-linia); box-shadow: var(--pc-cien-maly); display: grid; gap: 16px; align-content: start; min-width: 0; }
.pc-sekcja .pc-wykres figcaption { font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--pc-sosna); }
.pc-slupki { display: grid; gap: 14px; }
.pc-slupek { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; grid-template-areas: "ikona nazwa kwota" "ikona pasek pasek"; gap: 6px 12px; align-items: center; }
.pc-slupek img { grid-area: ikona; width: 76px; height: 76px; object-fit: contain; }
.pc-slupek-nazwa { grid-area: nazwa; min-width: 0; font-size: 15px; line-height: 1.35; color: var(--pc-atrament); }
.pc-slupek-nazwa small { font-size: 13px; color: var(--pc-szary); white-space: nowrap; }
.pc-slupek strong { grid-area: kwota; font-size: 16px; font-weight: 600; color: var(--pc-sosna); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pc-slupek-pasek { grid-area: pasek; height: 10px; border-radius: 999px; background: var(--pc-tlo); overflow: hidden; }
.pc-slupek-pasek span { display: block; height: 100%; width: calc(var(--udzial) * 100%); border-radius: inherit; background: #9eaba3; }
.pc-slupek.jest-pompa .pc-slupek-pasek span { background: var(--pc-sosna-2); }
.pc-slupek.najtaniej .pc-slupek-pasek span { background: var(--pc-zloto); }
.pc-sekcja .pc-wykres-wstep { margin-top: 14px; max-width: 72ch; }
.pc-sekcja .pc-wykres-podpis { margin-top: 12px; max-width: 80ch; font-size: 13.5px; line-height: 1.5; color: var(--pc-szary); }
.pc-koszt-tabela { max-width: 1040px; }
.pc-koszt-dol { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: clamp(20px, 3vw, 48px); align-items: start; }
.pc-koszt-dol-tekst { display: grid; gap: 14px; min-width: 0; }
.pc-sekcja .pc-koszt-dol-tekst .pc-tekst { margin-top: 0; }
.pc-koszt-scena { margin: 0; display: grid; gap: 8px; min-width: 0; }
.pc-koszt-scena img { width: 100%; height: auto; border-radius: var(--pc-r); }
.pc-sekcja .pc-koszt-scena figcaption { font-size: 13.5px; line-height: 1.5; color: var(--pc-szary); }
.pc-sekcja .pc-koszt-tabela + .pc-temat-h3 { margin-top: clamp(26px, 3vw, 38px); }
.pc-tabela-koszt { max-width: 900px; }
.pc-tabela-koszt td small { display: block; margin-top: 2px; font-size: 13.5px; color: var(--pc-szary); font-weight: 400; }
.pc-tabela-koszt td strong { font-weight: 600; color: var(--pc-sosna); }
.pc-tabela-koszt tr.jest-pompa { background: #f2f6ee; }
.pc-tabela-koszt tr.jest-pompa th { color: var(--pc-sosna); }
.pc-sekcja .pc-tekst.pc-tekst-maly { font-size: 14.5px; line-height: 1.55; color: var(--pc-szary); }

/* montaż: pięć kroków z ikonami */
.pc-kroki-montazu { display: grid; gap: 14px; }
.pc-kroki-montazu li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: start; }
.pc-kroki-montazu .pc-ikona { width: 44px; height: 44px; padding: 11px; border-radius: 50%; background: var(--pc-sosna); color: var(--pc-zloto-jasne); stroke-width: 1.6; }
.pc-kroki-montazu div { display: grid; gap: 3px; padding-top: 2px; }
.pc-kroki-montazu strong { font-size: 16.5px; color: var(--pc-sosna); }
.pc-kroki-montazu span { font-size: 15.5px; line-height: 1.55; color: var(--pc-atrament); }
.pc-montaz .pc-link { margin-top: 6px; }

/* inne usługi i miasta obok */
.pc-inne-grupy { margin-top: clamp(20px, 2.4vw, 30px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 36px); }
.pc-sekcja .pc-inne-grupa h3 { font-size: 17px; margin-bottom: 8px; }
.pc-inne-grupa a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--pc-linia); color: var(--pc-atrament); font-weight: 500; text-decoration: none; }
.pc-inne-grupa .pc-ikona { width: 16px; height: 16px; flex: none; color: var(--pc-fokus); transition: transform 0.2s var(--pc-ease); }
@media (hover: hover) and (pointer: fine) { .pc-inne-grupa a:hover { border-bottom-color: var(--pc-sosna); } .pc-inne-grupa a:hover .pc-ikona { transform: translateX(4px); } }

/* koniec: źródła i stan */
.pc-zrodla { margin-top: 26px; display: grid; gap: 6px; max-width: 78ch; }
.pc-sekcja .pc-zrodla-tytul { font-size: 14px; font-weight: 600; color: var(--pc-zloto-jasne); }
.pc-zrodla li { font-size: 13.5px; line-height: 1.5; color: rgba(255, 255, 255, 0.78); }

@media (max-width: 1100px) {
  .pc-okolica-karty { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .pc-okolica-gora { grid-template-columns: minmax(0, 1fr); }
  .pc-programy, .pc-inne-grupy { grid-template-columns: minmax(0, 1fr); }
  .pc-miasto .pc-cennik { grid-template-columns: minmax(0, 1fr); grid-template-areas: "foto" "tabela" "wcenie"; }
  .pc-montaz .pc-temat-film { order: -1; }
  .pc-miasto .pc-cennik > .pc-wcenie { grid-template-columns: minmax(0, 1fr); grid-template-areas: "w-h" "w-l" "d-h" "d-l" "dof"; }
  .pc-miasto .pc-wcenie > .pc-wcenie-dojsc-h { margin-top: 18px; }
  .pc-dotacje-gora { grid-template-columns: minmax(0, 1fr); }
  .pc-koszt-dol { grid-template-columns: minmax(0, 1fr); }
  .pc-koszt-scena { order: -1; }
}
@media (max-width: 760px) {
  .pc-wykresy { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .pc-osoba img, .pc-osoba-karta img { width: 88px; height: 88px; }
  .pc-kroki-montazu li { grid-template-columns: 64px minmax(0, 1fr); }
  .pc-kroki-montazu .pc-ikona { width: 64px; height: 64px; padding: 18px; }
  .pc-kroki-montazu div { padding-top: 8px; }
  .pc-osoba-karta { grid-template-columns: 88px minmax(0, 1fr); padding: 16px; }
  .pc-os-dat strong { font-size: 14.5px; }
  .pc-os-dat span { font-size: 13.5px; }
  .pc-okolica-karty { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-okolica-karta:first-child { grid-column: 1 / -1; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: none; }
  .pc-okolica-karta:first-child img { height: 100%; }
  .pc-mapa-podpis { font-size: 25px; }
  .pc-mapa-foto-tytul { display: none; }  /* na telefonie same zdjęcia z mocą; nagłówek wchodził na podpis biura */
  .pc-mapa-km { display: none; }
  .pc-mapa-podpis-miasto { font-size: 28px; }
  .pc-mapa-trasa-opis { font-size: 21px; }
  /* dojazd: trzy krótkie kolumny mieszczą się na telefonie, więc zostaje zwykła tabela zamiast kart pompy.css */
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda { display: table; }
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda caption { display: table-caption; }
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda thead { display: table-header-group; }
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda tbody { display: table-row-group; }
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda tr { display: table-row; padding: 0; }
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda th,
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda td { display: table-cell; padding: 10px 12px; margin: 0; border-bottom: 1px solid var(--pc-linia); }
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda tbody tr:last-child > * { border-bottom: 0; }
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda td::before { content: none; }
  .pc-dojazd .pc-metoda-tabela .pc-tabela-metoda td > span { text-align: left; }
}

/* Opinie z Google o pompach (strona miasta, opcjonalne): karty z cytatem słowo w słowo, bez danych Review */
.pc-opinie-google { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; margin: 16px 0 6px; padding: 0; list-style: none; }
@media (min-width: 640px) { .pc-opinie-google { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.pc-opinia-google { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 18px 18px 16px; border: 1px solid var(--pc-linia); border-radius: var(--pc-r-maly); background: #fff; }
.pc-opinia-gwiazdki { margin: 0; color: #e8a317; font-size: 17px; line-height: 1; letter-spacing: 2px; }
.pc-opinia-google blockquote { flex: 1; margin: 0; padding: 0; border: 0; }
.pc-opinia-google blockquote p { margin: 0; font-size: 15.5px; font-style: normal; line-height: 1.55; color: var(--pc-atrament); }
.pc-opinia-autor { display: flex; flex-wrap: wrap; gap: 2px 8px; align-items: baseline; margin: 0; font-size: 14px; color: var(--pc-szary); }
.pc-opinia-autor strong { color: var(--pc-atrament); }
/* Mapa Google w dojeździe: najpierw przycisk, ramka Google dopiero po kliknięciu */
.pc-mapa-google { margin: 18px 0 8px; }
.pc .pc-mapa-google-przycisk { position: relative; display: block; width: 100%; margin: 0; padding: 0; overflow: hidden;
  border: 1px solid var(--pc-linia); border-radius: var(--pc-r-maly); background: var(--pc-szalwia); color: var(--pc-sosna); box-shadow: none;
  font: inherit; font-size: 16px; text-align: left; text-transform: none; letter-spacing: normal; cursor: pointer; }
.pc-mapa-google-przycisk img { display: block; width: 100%; height: auto; aspect-ratio: 2 / 1; object-fit: cover; }
.pc-mapa-google-etykieta { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--pc-linia);
  background: #fff; }
.pc .pc-mapa-google-przycisk:hover, .pc .pc-mapa-google-przycisk:focus { background: var(--pc-szalwia); color: var(--pc-sosna); border-color: var(--pc-sosna); }
.pc .pc-mapa-google-przycisk:hover .pc-mapa-google-etykieta { background: var(--pc-szalwia); }
.pc .pc-mapa-google-przycisk .pc-ikona { width: 40px; height: 40px; }
.pc-mapa-google-etykieta > span { display: grid; gap: 3px; min-width: 0; }
.pc-mapa-google-przycisk small { font-size: 13.5px; font-weight: 400; color: var(--pc-szary); }
.pc-mapa-google iframe { display: block; width: 100%; aspect-ratio: 2 / 1; height: auto; min-height: 280px; border: 0; border-radius: var(--pc-r-maly); }
.pc-mapa-google .pc-tekst-maly { margin-top: 8px; }
.pc-opinie-google-sekcja h2 { margin-bottom: 4px; }
.pc-opinia-foto { width: 40px; height: 40px; flex: none; border-radius: 50%; object-fit: cover; }
.pc-opinia-autor { align-items: center; }
/* Dojazd: mapa Google w prawej kolumnie pod filmem serwisu (komputer); na telefonie po filmie */
@media (min-width: 901px) {
  .pc-dojazd .pc-temat-uklad-film > .pc-temat-glowna { grid-row: 1 / span 2; }
  .pc-dojazd .pc-temat-uklad-film > .pc-mapa-google { grid-column: 2; margin: 0; }
}
/* Zdjęcia naszych pomp z miasta przy jego znaczniku na mapie okolicy */
.pc-mapa-foto-linia { stroke: var(--pc-sosna); stroke-width: 2; opacity: 0.7; }
.pc-mapa-foto-tlo { fill: #fff; }
.pc-mapa-foto-ramka { fill: none; stroke: var(--pc-sosna); stroke-width: 2.5; }
/* Galeria realizacji: ciemne jednostki i kotłownie, 2 kolumny na telefonie, 4 na komputerze */
.pc-galeria { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 14px 0 0; padding: 0; list-style: none; }
@media (min-width: 900px) { .pc-galeria { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; } }
.pc-galeria-karta { display: grid; gap: 6px; margin: 0; min-width: 0; }
.pc-galeria-karta img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--pc-r-maly); background: var(--pc-szalwia); }
.pc-galeria-karta span { font-size: 13.5px; line-height: 1.35; color: var(--pc-szary); }
.pc-okolica-karty + .pc-temat-h3 { margin-top: clamp(28px, 3vw, 40px); }
/* Cennik z drugim zdjęciem (realizacja z miasta) obok „W cenie”: na komputerze dwa rzędy po dwie kolumny */
@media (min-width: 901px) {
  .pc-miasto .pc-cennik:has(> .pc-ceny-foto2) { grid-template-areas: "tabela foto" "wcenie foto2"; }
  .pc-miasto .pc-cennik > .pc-ceny-foto2 { grid-area: foto2; }
  .pc-miasto .pc-cennik:has(> .pc-ceny-foto2) > .pc-wcenie { grid-template-columns: minmax(0, 1fr); grid-template-areas: "w-h" "w-l" "d-h" "d-l" "dof"; }
  .pc-miasto .pc-cennik:has(> .pc-ceny-foto2) .pc-wcenie > .pc-wcenie-dojsc-h { margin-top: 18px; }
}
.pc-ceny-foto2 img { aspect-ratio: 1 / 1; object-fit: cover; object-position: 50% 60%; }
/* Mapa miasta z dzielnicami (czas jazdy z biura) i realizacjami z samego miasta; cztery karty realizacji w rzędzie */
.pc-mapa-dzielnica { fill: #fff; stroke: var(--pc-sosna); stroke-width: 2.5; }
.pc-mapa-foto-podpis { font-size: 14px; font-weight: 600; }
.pc-okolica-karty:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) {
  .pc-okolica-karty:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .pc-okolica-karty:has(> :nth-child(4):last-child) > .pc-okolica-karta:first-child { grid-column: auto; grid-template-columns: none; grid-template-rows: auto 1fr; }
  .pc-okolica-karty:has(> :nth-child(4):last-child) > .pc-okolica-karta:first-child img { height: auto; }
  .pc-mapa-foto-podpis { font-size: 21px; }
}