/* LAB strona usługi „Pompy ciepła” aslandi.pl, v1 (9.10.2026). Język wizualny nowej strony głównej (marka/DESIGN.md):
   sosna, złoto, szałwia, Poppins, karty 12-18 px, cienie tonowane zielenią. Jasny motyw, bez trybu ciemnego.
   Układ: pas sosny (hero) → jasne sekcje z dużymi zdjęciami → pas sosny (wycena). Wszystko w zakresie .pc. */

.pc {
  --pc-sosna: #123f2d;
  --pc-sosna-2: #19583f;
  --pc-sosna-3: #0c2e21;
  --pc-atrament: #1c3428;
  --pc-szary: #58685f;
  --pc-zloto: #ceb472;
  --pc-zloto-tekst: #182e23;
  --pc-zloto-jasne: #dcc78f;
  --pc-tlo: #f7f8f4;
  --pc-bialy: #ffffff;
  --pc-szalwia: #eaf0e3;
  --pc-linia: #dce3da;
  --pc-fokus: #a67b23;
  --pc-cien: 0 22px 44px -28px rgba(0, 21, 15, 0.42), 0 2px 6px rgba(18, 63, 45, 0.08);
  --pc-cien-maly: 0 10px 24px -18px rgba(0, 21, 15, 0.45);
  --pc-r: 16px;
  --pc-r-maly: 12px;
  --pc-r-btn: 8px;
  --pc-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --pc-sekcja: clamp(56px, 7vw, 104px);
  font-family: Poppins, system-ui, -apple-system, "Segoe UI", sans-serif;
  color: var(--pc-atrament);
  background: var(--pc-tlo);
  -webkit-font-smoothing: antialiased;
}
.pc *, .pc *::before, .pc *::after { box-sizing: border-box; }
.pc-sekcja img, .pc-sekcja video { max-width: 100%; display: block; }
.pc-sekcja :where(img, video) { height: auto; } /* wysokość z proporcji, nie z atrybutu height: bez motywu WordPressa też */
/* Reset tylko w sekcjach tej strony; moduły strony głównej (opinie .op, wycena .kt) mają własne style. */
.pc-sekcja :where(h1, h2, h3, p, ul, ol, li, figure, table) { margin: 0; padding: 0; }
.pc-sekcja :where(ul, ol) { list-style: none; }
.pc ::selection { background: var(--pc-zloto-jasne); color: var(--pc-zloto-tekst); }
.pc-sekcja :where(h1, h2, h3, p) { text-align: left; }
/* fokus bez zmiany kształtu: obrys idzie za własnym promieniem elementu; promień dostają tylko linki tekstowe */
.pc :focus-visible { outline: 3px solid var(--pc-fokus); outline-offset: 3px; }
.pc-hero-tel:focus-visible, .pc-link:focus-visible, .pc-miasta-lista a:focus-visible { border-radius: 6px; }

.pc-wew { width: min(1280px, 100% - 64px); margin-inline: auto; }
.pc-sekcja { padding-block: var(--pc-sekcja); }

.pc-sekcja h2 {
  font-size: clamp(30px, 2.2vw + 16px, 48px); font-weight: 600; line-height: 1.15; letter-spacing: -0.02em; /* jak H2 sekcji strony głównej */
  color: var(--pc-sosna); text-wrap: balance; max-width: 22ch;
}
.pc-sekcja h2 em, .pc-sekcja h1 em { font-style: normal; }
.pc-sekcja h2 em {
  text-decoration: underline; text-decoration-color: var(--pc-zloto); text-decoration-thickness: 3px;
  text-underline-offset: 0.16em; text-decoration-skip-ink: none;
}
.pc-sekcja h3 { font-size: 19px; font-weight: 600; line-height: 1.3; color: var(--pc-sosna); }

/* Przyciski i linki */
.pc-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4em; min-height: 52px; padding: 0 24px;
  border-radius: var(--pc-r-btn); font: inherit; font-size: 16px; font-weight: 600; line-height: 1.2; text-decoration: none;
  cursor: pointer; border: 1.5px solid transparent; text-align: center;
  transition: background-color 0.2s var(--pc-ease), border-color 0.2s var(--pc-ease), transform 0.12s var(--pc-ease);
}
.pc-btn:active { transform: scale(0.98); }
.pc-btn-zloto { background: var(--pc-zloto); color: var(--pc-zloto-tekst); }
.pc-btn-zloto span { font-weight: 500; }
.pc-btn-obrys { border-color: rgba(255, 255, 255, 0.55); color: #fff; background: transparent; }
.pc-btn-obrys-ciemny { border-color: var(--pc-sosna); color: var(--pc-sosna); background: transparent; }
@media (hover: hover) and (pointer: fine) {
  .pc-btn-zloto:hover { background: #d8c286; }
  .pc-btn-obrys:hover { border-color: #fff; background: rgba(255, 255, 255, 0.08); }
  .pc-btn-obrys-ciemny:hover { background: var(--pc-szalwia); }
  .pc-link:hover { text-decoration-thickness: 2px; }
}
.pc-link {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--pc-sosna); font-weight: 600;
  text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px;
}
.pc-ikona { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }

/* 1. Hero: panel sosny i film pompy na całą wysokość */
.pc-hero {
  padding-block: 0 !important; display: grid; background: var(--pc-sosna); color: #fff;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); grid-template-areas: "panel media";
  min-height: min(760px, calc(100svh - 80px));
}
.pc-hero-media { grid-area: media; position: relative; overflow: hidden; background: var(--pc-sosna-3); }
.pc-hero-film { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pc-hero-panel { grid-area: panel; display: flex; align-items: center; padding: clamp(36px, 5vw, 80px) clamp(24px, 4.5vw, 72px); }
.pc-hero-tresc { max-width: 560px; margin-left: auto; display: grid; gap: 22px; }
.pc-hero h1 { font-size: clamp(34px, 2.6vw + 16px, 56px); font-weight: 600; line-height: 1.1; letter-spacing: -0.022em; color: #fff; text-wrap: balance; }
.pc-hero h1 em { color: var(--pc-zloto-jasne); }
.pc-hero-lead { font-size: clamp(16.5px, 0.4vw + 15px, 19px); line-height: 1.55; color: rgba(255, 255, 255, 0.86); max-width: 38ch; }
.pc-hero-akcje { display: flex; flex-wrap: wrap; gap: 12px; }
.pc-hero-tel { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; width: max-content; color: #fff; font-size: 20px; font-weight: 600; text-decoration: none; font-variant-numeric: tabular-nums; }
.pc-hero-tel .pc-ikona { color: var(--pc-zloto); }
.pc-dowody { display: flex; flex-wrap: wrap; gap: 10px 18px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, 0.16); }
.pc-dowody li { display: inline-flex; align-items: center; gap: 8px; font-size: 14.5px; color: rgba(255, 255, 255, 0.9); }
.pc-dowody .pc-ikona { width: 20px; height: 20px; color: var(--pc-zloto); }

/* 2. Jak działa: film strony głównej (rozdział „Zima”) i trzy kroki */
.pc-dziala { background: var(--pc-tlo); }
.pc-dziala-uklad { margin-top: clamp(28px, 3vw, 44px); display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(24px, 3vw, 48px); align-items: center; }
.pc-dziala-film { position: relative; border-radius: var(--pc-r); overflow: hidden; background: var(--pc-sosna-3); box-shadow: var(--pc-cien); }
.pc-film { width: 100%; height: auto; }
.pc .pc-film-telefon { display: none; }
.pc-film-pauza {
  position: absolute; right: 12px; bottom: 16px; width: 44px; height: 44px; padding: 0; border-radius: 50%; border: 0; display: grid; place-items: center;
  background: rgba(12, 46, 33, 0.72); color: #fff; cursor: pointer; backdrop-filter: blur(6px);
}
.pc-film-pasek { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: rgba(255, 255, 255, 0.18); }
.pc-film-pasek span { display: block; height: 100%; width: 100%; transform: scaleX(0); transform-origin: left center; background: var(--pc-zloto); transition: transform 0.25s linear; }
.pc-film-pauza .pc-ikona + .pc-ikona, .pc-film-pauza.jest-wstrzymany .pc-ikona:first-child { display: none; }
.pc-film-pauza.jest-wstrzymany .pc-ikona + .pc-ikona { display: block; }
.pc-hero-pauza { right: 16px; bottom: 16px; z-index: 1; }
.pc-kroki { display: grid; gap: 10px; counter-reset: krok; }
.pc-krok-btn {
  width: 100%; display: grid; grid-template-columns: 44px 1fr; gap: 16px; align-items: center; text-align: left; padding: 16px 18px;
  border: 1px solid transparent; border-radius: var(--pc-r-maly); background: transparent; font: inherit; color: var(--pc-szary); cursor: pointer;
  transition: background-color 0.3s var(--pc-ease), color 0.3s var(--pc-ease), border-color 0.3s var(--pc-ease);
}
.pc-krok-nr {
  width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font-weight: 600; font-size: 17px;
  background: var(--pc-szalwia); color: var(--pc-sosna); transition: background-color 0.3s var(--pc-ease), color 0.3s var(--pc-ease);
}
.pc-krok-txt { font-size: 16.5px; line-height: 1.5; }
.pc-krok.jest-aktywny .pc-krok-btn { background: #fff; border-color: var(--pc-linia); color: var(--pc-atrament); box-shadow: var(--pc-cien-maly); }
.pc-krok.jest-aktywny .pc-krok-nr { background: var(--pc-sosna); color: var(--pc-zloto-jasne); }
@media (hover: hover) and (pointer: fine) { .pc-krok-btn:hover { color: var(--pc-atrament); } }

/* 3. Dobór i cena: quiz „Twoja wstępna oferta” (v3, niżej), cennik i „w cenie” */
.pc-dobor { background: #fff; }
.pc input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 44px; background: transparent; cursor: pointer; margin: 0; padding: 0; border: 0; box-shadow: none; }
/* motyw daje suwakowi przy fokusie kropkowaną ramkę i zdejmuje obrys: ramka precz, obrys tylko z klawiatury */
.pc input[type="range"]:focus { border: 0; outline: none; }
.pc input[type="range"]:focus-visible { outline: 3px solid var(--pc-fokus); outline-offset: 4px; border-radius: 8px; }
.pc input[type="range"]::-webkit-slider-runnable-track { height: 6px; border: 0; border-radius: 6px; box-shadow: none; background: linear-gradient(to right, var(--pc-sosna) var(--pc-wypelnienie, 35%), var(--pc-linia) var(--pc-wypelnienie, 35%)); }
.pc input[type="range"]::-moz-range-track { height: 6px; border: 0; border-radius: 6px; box-shadow: none; background: var(--pc-linia); }
.pc input[type="range"]::-moz-range-progress { height: 6px; border-radius: 6px; background: var(--pc-sosna); }
.pc input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 28px; height: 28px; margin-top: -11px; border-radius: 50%; background: #fff; border: 4px solid var(--pc-sosna); box-shadow: 0 2px 8px rgba(18, 63, 45, 0.35); }
.pc input[type="range"]::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 4px solid var(--pc-sosna); box-shadow: 0 2px 8px rgba(18, 63, 45, 0.35); }

.pc-cennik { margin-top: clamp(20px, 2.4vw, 32px); display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: clamp(16px, 2vw, 28px); }
.pc-tabela { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 16px; border: 1px solid var(--pc-linia); border-radius: var(--pc-r); overflow: hidden; background: #fff; }
.pc-tabela caption { caption-side: bottom; text-align: left; padding: 10px 18px 0; font-size: 14px; color: var(--pc-szary); } /* wcięcie jak tekst komórek; bez niego obcięcie tabeli ucina pierwszą literę */
.pc-tabela th, .pc-tabela td { padding: 14px 18px; text-align: left; border-bottom: 1px solid var(--pc-linia); font-variant-numeric: tabular-nums; }
.pc-tabela thead th { font-size: 14px; font-weight: 500; color: var(--pc-szary); background: var(--pc-tlo); }
.pc-tabela tbody th { font-weight: 600; color: var(--pc-sosna); }
.pc-tabela tbody tr:last-child > * { border-bottom: 0; }
.pc-tabela tbody tr { transition: background-color 0.25s var(--pc-ease); }
.pc-tabela tbody tr.jest-wybrany { background: var(--pc-szalwia); }
.pc-wcenie { padding: clamp(20px, 2.4vw, 30px); border-radius: var(--pc-r); background: var(--pc-szalwia); display: grid; gap: 14px; align-content: start; }
.pc-wcenie ul { display: grid; gap: 10px; }
.pc-wcenie li { display: flex; gap: 12px; align-items: center; font-size: 16px; line-height: 1.4; }
.pc-wcenie .pc-ikona { color: var(--pc-sosna); }
.pc-wcenie-dof { display: flex; gap: 12px; align-items: flex-start; padding-top: 14px; border-top: 1px solid rgba(18, 63, 45, 0.15); font-size: 15px; line-height: 1.5; color: var(--pc-atrament); }
.pc-wcenie-dof .pc-ikona { color: var(--pc-sosna); margin-top: 1px; }

/* 4. Realizacje: prawdziwe zdjęcia z /realizacje/ */
.pc-real { background: var(--pc-tlo); }
.pc-real-lead { margin-top: 10px; font-size: clamp(16px, 0.3vw + 15px, 18px); color: var(--pc-szary); }
.pc-real-siatka { margin-top: clamp(24px, 2.6vw, 36px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 22px); }
.pc-real-siatka img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--pc-r-maly); background: var(--pc-linia); box-shadow: var(--pc-cien-maly); }
.pc-real-wiecej { margin-top: clamp(22px, 2.4vw, 32px); }

/* 5. Panasonic: rodzaje pomp na zdjęciach z realizacji */
.pc-pan { background: #fff; }
.pc-pan-naglowek { display: grid; gap: 16px; max-width: 760px; }
.pc-pan-logo { width: 168px; height: auto; }
.pc-pan-lead { font-size: 17px; line-height: 1.6; color: var(--pc-szary); max-width: 52ch; }
.pc-warianty { margin-top: clamp(26px, 3vw, 40px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); }
.pc-wariant { position: relative; border-radius: var(--pc-r); overflow: hidden; background: var(--pc-sosna-3); color: #fff; min-height: 380px; display: flex; align-items: flex-end; box-shadow: var(--pc-cien-maly); }
.pc-wariant img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pc-wariant::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(9, 45, 32, 0.94) 0%, rgba(9, 45, 32, 0.72) 38%, rgba(9, 45, 32, 0) 70%); }
.pc-wariant-tresc { position: relative; z-index: 1; padding: 20px; display: grid; gap: 6px; }
.pc-wariant h3 { color: #fff; font-size: 20px; }
.pc-wariant p { font-size: 15px; line-height: 1.45; color: rgba(255, 255, 255, 0.88); }
.pc-wariant-ile { justify-self: start; margin-bottom: 2px; padding: 4px 10px; border-radius: 999px; background: rgba(220, 199, 143, 0.18); color: var(--pc-zloto-jasne); font-size: 13.5px; font-weight: 600; }
.pc-pan-cisza { margin-top: 22px; display: flex; gap: 12px; align-items: center; font-size: 16px; color: var(--pc-atrament); }
.pc-pan-cisza .pc-ikona { color: var(--pc-sosna); }

/* 6. Proces: oś od telefonu do serwisu */
.pc-proces { background: var(--pc-szalwia); }
.pc-os { margin-top: clamp(28px, 3vw, 44px); display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px; position: relative; }
.pc-os li:not(:last-child)::after { content: ""; position: absolute; left: 56px; right: -18px; top: 27px; height: 2px; background: rgba(18, 63, 45, 0.22); }
.pc-os li { position: relative; display: grid; gap: 14px; align-content: start; }
.pc-os-tekst { display: grid; gap: 6px; }
.pc-os .pc-ikona { width: 56px; height: 56px; padding: 15px; border-radius: 50%; background: var(--pc-sosna); color: var(--pc-zloto-jasne); stroke-width: 1.6; position: relative; z-index: 1; box-shadow: 0 0 0 6px var(--pc-szalwia); }
.pc-os strong { font-size: 16.5px; font-weight: 600; line-height: 1.35; color: var(--pc-sosna); }
.pc-os span { font-size: 14.5px; line-height: 1.45; color: var(--pc-szary); }

/* 7. FAQ na details */
.pc-faq { background: var(--pc-tlo); }
.pc-faq-uklad { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.pc-faq-lista { display: grid; gap: 10px; }
.pc-faq details { border: 1px solid var(--pc-linia); border-radius: var(--pc-r-maly); background: #fff; }
.pc-faq summary {
  list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr 32px; gap: 16px; align-items: center; padding: 18px 20px; min-height: 60px;
  font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--pc-sosna);
}
.pc-faq summary::-webkit-details-marker { display: none; }
.pc-faq summary::after {
  content: ""; width: 32px; height: 32px; border-radius: 50%; background: var(--pc-szalwia) no-repeat center / 14px 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 1v12M1 7h12' stroke='%23123f2d' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  transition: transform 0.3s var(--pc-ease);
}
.pc-faq details[open] summary::after { transform: rotate(45deg); }
.pc-faq details p { padding: 0 20px 20px; font-size: 16px; line-height: 1.65; color: var(--pc-atrament); max-width: 62ch; }

/* 8. Miasta */
.pc-miasta { background: #fff; padding-block: clamp(44px, 5vw, 72px) !important; }
.pc-sekcja.pc-miasta h2 { font-size: clamp(24px, 1.2vw + 17px, 32px); }
.pc-miasta .pc-wew { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 20px 48px; align-items: start; }
.pc-miasta-lista { columns: 3; column-gap: 32px; }
.pc-miasta-lista li { break-inside: avoid; }
.pc-miasta-lista a {
  display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 52px; border-bottom: 1px solid var(--pc-linia);
  color: var(--pc-sosna); font-weight: 600; font-size: 16px; text-decoration: none;
}
.pc-miasta-lista .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-miasta-lista a:hover .pc-ikona { transform: translateX(4px); } .pc-miasta-lista a:hover { border-bottom-color: var(--pc-sosna); } }

/* Podsumowanie doboru nad formularzem wyceny */
.pc-kt-dobor { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 18px; padding: 12px 14px; border-radius: 10px; background: var(--pc-szalwia, #eaf0e3); color: #123f2d; font-size: 15px; line-height: 1.45; }

/* Tablet */
@media (max-width: 1100px) {
  .pc-wariant { min-height: 320px; }
  .pc-os { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 34px; }
  .pc-os li:nth-child(3n)::after { display: none; }
  .pc-cennik { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .pc-hero { grid-template-columns: 1fr; grid-template-areas: "media" "panel"; min-height: 0; }
  .pc-hero-media { aspect-ratio: 4 / 3; }
  .pc-hero-tresc { margin-left: 0; max-width: none; }
  .pc-dziala-uklad, .pc-faq-uklad { grid-template-columns: 1fr; }
  .pc-real-siatka { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-miasta .pc-wew { grid-template-columns: 1fr; }
}
/* Telefon */
@media (max-width: 600px) {
  .pc-wew { width: calc(100% - 32px); }
  .pc-hero-media { aspect-ratio: 16 / 9; } /* cena, wycena i telefon w pierwszym ekranie także na 375 x 667 */
  .pc-hero-panel { padding: 22px 16px 32px; }
  .pc-hero-tresc { gap: 14px; }
  .pc-dowody { gap: 8px 18px; padding-top: 14px; }
  .pc-hero-akcje .pc-btn { flex: 1 1 100%; }
  .pc .pc-film-komputer { display: none; }
  .pc .pc-film-telefon { display: block; }
  .pc-krok-btn { padding: 12px 14px; gap: 14px; }
  .pc-cennik .pc-tabela thead { display: none; }
  .pc-cennik .pc-tabela, .pc-cennik .pc-tabela tbody { display: block; }
  .pc-cennik .pc-tabela tbody tr { display: grid; grid-template-columns: 4.4em 1fr; gap: 2px 14px; padding: 14px 16px; border-bottom: 1px solid var(--pc-linia); } /* stała kolumna mocy: tekst wierszy na jednej krawędzi */
  .pc-cennik .pc-tabela tbody tr:last-child { border-bottom: 0; }
  .pc-cennik .pc-tabela th, .pc-cennik .pc-tabela td { padding: 0; border: 0; }
  .pc-cennik .pc-tabela tbody th { grid-row: span 3; font-size: 20px; align-self: center; }
  .pc-cennik .pc-tabela caption { display: block; padding: 10px 16px 14px; }
  /* bez nagłówka kolumn przykład czytałby się jak reguła doboru */
  .pc-cennik .pc-tabela td[data-etykieta]::before { content: attr(data-etykieta) ": "; color: var(--pc-szary); }
  /* (z kontenerem w selektorze: reguły ogólne tabel metody stoją niżej w pliku)
     tabele metody: wiersz jako karta, przy każdej wartości nazwa kolumny (poziom ocieplenia albo rocznie i miesięcznie) */
  .pc-metoda-tabela .pc-tabela-metoda thead { display: none; }
  .pc-metoda-tabela .pc-tabela-metoda, .pc-metoda-tabela .pc-tabela-metoda tbody, .pc-metoda-tabela .pc-tabela-metoda tr, .pc-metoda-tabela .pc-tabela-metoda th { display: block; }
  .pc-metoda-tabela .pc-tabela-metoda tbody tr { padding: 12px 16px; border-bottom: 1px solid var(--pc-linia); }
  .pc-metoda-tabela .pc-tabela-metoda tbody tr:last-child { border-bottom: 0; }
  .pc-metoda-tabela .pc-tabela-metoda th, .pc-metoda-tabela .pc-tabela-metoda td { padding: 0; border: 0; }
  .pc-metoda-tabela .pc-tabela-metoda tbody th { margin-bottom: 6px; }
  .pc-metoda-tabela .pc-tabela-metoda td { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 3px 0; }
  .pc-metoda-tabela .pc-tabela-metoda td::before { content: attr(data-etykieta); flex: 0 1 auto; color: var(--pc-szary); font-size: 14px; }
  .pc-metoda-tabela .pc-tabela-metoda td > span { text-align: right; }
  .pc-metoda-tabela .pc-tabela-metoda td strong { display: inline; }
  .pc-metoda-tabela .pc-tabela-metoda caption { display: block; padding: 12px 16px 6px; } /* podpis w ramce tabeli: odstęp jak w komórkach, nie pod zaokrąglonym rogiem */
  .pc-warianty { grid-template-columns: 1fr; gap: 10px; }
  .pc-wariant { min-height: 240px; }
  .pc-wariant-tresc { padding: 14px; }
  .pc-wariant h3 { font-size: 17px; }
  .pc-wariant p { font-size: 14px; }
  .pc-os { grid-template-columns: 1fr; gap: 16px; }
  .pc-os li { grid-template-columns: 56px 1fr; column-gap: 16px; align-items: center; }
  .pc-os li:not(:last-child)::after { display: block; left: 27px; right: auto; top: 56px; bottom: -16px; width: 2px; height: auto; }
  .pc-miasta-lista { columns: 2; column-gap: 20px; }
  .pc-miasta-lista a { font-size: 15px; min-height: 48px; }
  .pc-faq summary { font-size: 16.5px; padding: 16px; }
  .pc-faq details p { padding: 0 16px 16px; }
}
@media (max-width: 380px) {
  .pc-warianty { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .pc *, .pc *::before, .pc *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* ---------- v2 (Igor 10.10.2026) ---------- */
/* Filmy z YouTube: dwa kadry z ludźmi firmy (ludzie kupują od ludzi); klik wstawia odtwarzacz w miejscu kadru. */
.pc-filmy { background: var(--pc-tlo); } /* po białej sekcji Panasonic, przed ciemnymi opiniami */
.pc-filmy-lista { margin-top: clamp(24px, 3vw, 40px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(18px, 2.2vw, 32px); }
.pc-yt { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--pc-r); background: var(--pc-sosna-3); box-shadow: var(--pc-cien); }
.pc-yt img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--pc-ease); }
.pc-yt-play {
  position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%;
  background: rgba(255, 255, 255, 0.94); color: var(--pc-sosna); transform: translate(-50%, -50%);
  box-shadow: 0 10px 28px -8px rgba(8, 32, 22, 0.55); transition: transform 0.2s var(--pc-ease);
}
.pc-yt-play .pc-ikona { width: 30px; height: 30px; margin-left: 4px; fill: currentColor; stroke: none; }
.pc-yt iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #000; }
.pc-yt.gra img, .pc-yt.gra .pc-yt-play { visibility: hidden; }
.pc-yt:active .pc-yt-play { transform: translate(-50%, -50%) scale(0.95); }
.pc-yt-tytul { margin-top: 12px; font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--pc-sosna); }
.pc-yt-kanal { margin-top: clamp(18px, 2vw, 26px); }
@media (hover: hover) and (pointer: fine) {
  .pc-yt:hover img { transform: scale(1.03); }
  .pc-yt:hover .pc-yt-play { transform: translate(-50%, -50%) scale(1.06); }
}

/* Film w treści: mały link z kółkiem odtwarzania tam, gdzie film odpowiada na pytanie. */
.pc-film-link {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: var(--pc-sosna); font-size: 15px; font-weight: 600;
  text-decoration: underline; text-decoration-color: rgba(18, 63, 45, 0.35); text-underline-offset: 4px;
}
.pc-film-link .pc-ikona { width: 26px; height: 26px; padding: 7px 6px 7px 8px; border-radius: 50%; background: var(--pc-sosna); color: #fff; fill: currentColor; stroke: none; }
@media (hover: hover) and (pointer: fine) { .pc-film-link:hover { text-decoration-color: currentColor; } }
.pc-pan-naglowek .pc-film-link { margin-top: 6px; }
.pc-faq details .pc-film-link { margin: -6px 20px 16px; }

/* Wezwanie po procesie: skok do formularza i telefon. */
.pc-proces-cta { margin-top: clamp(28px, 3vw, 44px); display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; }
.pc-proces-tel { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; color: var(--pc-sosna); font-size: 18px; font-weight: 600; text-decoration: none; }
.pc-proces-tel .pc-ikona { color: var(--pc-sosna); }
@media (hover: hover) and (pointer: fine) { .pc-proces-tel:hover { text-decoration: underline; text-underline-offset: 4px; } }

/* Formularz na stronie usługi: bez wyboru usługi, zapewnienie o dofinansowaniu nad przyciskiem. */
.pc .kt .kt-dof-nad { margin-top: 18px; }

@media (max-width: 900px) {
  .pc-filmy-lista { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .pc-yt-play { width: 60px; height: 60px; }
  .pc-yt-play .pc-ikona { width: 26px; height: 26px; }
  .pc-yt-tytul { font-size: 16px; }
  .pc-proces-cta .pc-btn { flex: 1 1 100%; }
  .pc-real-wiecej { width: 100%; }
  .pc-faq details .pc-film-link { margin: -6px 16px 14px; }
}

/* ---------- v5 (Igor 10.10.2026): quiz „Twoja wstępna oferta” jako epicentrum strony ----------
   Karta wyśrodkowana: u góry pasek z małym portretem Dawida Jarząbka i oceną Google (ludzie kupują od ludzi), pod nim
   jedno pytanie naraz na całą kartę; każda odpowiedź ma w prawym górnym rogu kółko zaznaczenia. Wynik bez lawiny tekstu:
   kwota, cena pompy, schodki kosztów w wariantach (kolory jak na aslandi.com), zdanie o pakiecie w bezpłatnej analizie
   i od razu pas sosny z imieniem, telefonem i dużym złotym przyciskiem. Cennik i metoda są na dole strony (#ceny). */
.pc { --pc-blad: #a12a1a; --pc-blad-jasny: #ffb9ae; --pc-gwiazdka: #f4b400; }
.pc [hidden] { display: none !important; } /* własne display elementów nie może przykryć atrybutu hidden */
.pc-sr { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }
.pc-dobor .pc-wew > h2, .pc-dobor-lead { margin-inline: auto; text-align: center; }
.pc-dobor-lead { margin-top: 12px; max-width: 52ch; font-size: clamp(16px, 0.3vw + 15px, 18px); line-height: 1.55; color: var(--pc-szary); }
.pc-btn-sosna { background: var(--pc-sosna); color: #fff; }
@media (hover: hover) and (pointer: fine) { .pc-btn-sosna:hover { background: var(--pc-sosna-2); color: #fff; } }

.pc-quiz {
  width: min(100%, 1000px); margin: clamp(24px, 3vw, 40px) auto 0; display: grid; grid-template-columns: minmax(0, 1fr);
  background: var(--pc-tlo); border: 1px solid var(--pc-linia); border-radius: var(--pc-r); box-shadow: var(--pc-cien);
  overflow: hidden; scroll-margin-top: 84px;
}

/* Pasek osoby: mały portret Dawida w kółku, podpis i ocena Google; na każdej szerokości ten sam prosty układ */
.pc-quiz-osoba { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 14px clamp(16px, 2.6vw, 28px); color: #fff; background: linear-gradient(120deg, var(--pc-sosna) 0%, var(--pc-sosna-3) 100%); }
.pc-osoba-zdjecie { flex: none; width: 52px; height: 52px; border-radius: 50%; object-fit: cover; object-position: 50% 4%; background: var(--pc-sosna-2); box-shadow: 0 0 0 2px var(--pc-zloto); }
.pc-osoba-podpis { display: grid; gap: 1px; margin-right: auto; }
.pc-osoba-podpis b { font-size: 16px; font-weight: 600; line-height: 1.25; }
.pc-osoba-podpis span { font-size: 13.5px; color: var(--pc-zloto-jasne); }
.pc-ocena { display: inline-flex; align-items: center; gap: 6px 8px; padding: 7px 14px; border-radius: 999px; background: #fff; color: var(--pc-atrament); font-size: 13.5px; line-height: 1.2; }
.pc-ocena img { width: 52px; height: auto; }
.pc-ocena strong { font-size: 15.5px; font-weight: 600; font-variant-numeric: tabular-nums; }
.pc-gwiazdki { width: 70px; height: 14px; fill: var(--pc-gwiazdka); }

/* Pytania */
.pc-quiz-panel { display: flex; flex-direction: column; gap: 22px; min-width: 0; min-height: 440px; padding: clamp(22px, 3vw, 40px); }
.pc-quiz-gora { display: grid; gap: 10px; }
.pc-quiz-postep { font-size: 14.5px; font-weight: 500; color: var(--pc-szary); font-variant-numeric: tabular-nums; }
.pc-quiz-pasek { height: 4px; border-radius: 4px; background: var(--pc-linia); overflow: hidden; }
.pc-quiz-pasek span { display: block; height: 100%; background: var(--pc-sosna); transform: scaleX(0); transform-origin: left center; transition: transform 0.3s var(--pc-ease); }
/* odpowiedzi klienta pod paskiem postępu: mała lista, żeby widział, co już podał */
.pc-quiz-dom { display: flex; flex-wrap: wrap; gap: 6px; }
.pc-quiz-dom li { padding: 3px 10px; border-radius: 999px; background: var(--pc-szalwia); color: var(--pc-sosna); font-size: 13px; font-weight: 500; line-height: 1.4; }
.pc-q { min-width: 0; margin: 0; padding: 0; border: 0; }
.pc-q-legenda { display: block; width: 100%; margin: 0 0 18px; padding: 0; border: 0; }
.pc-sekcja .pc-q-pytanie { font-size: clamp(22px, 0.9vw + 16px, 28px); line-height: 1.25; color: var(--pc-sosna); text-wrap: balance; }
.pc-q-pytanie:focus, .pc-cta-dziekujemy:focus { outline: none; } /* fokus z kodu przy zmianie widoku; to nie są kontrolki */

.pc-q-opcje { display: grid; gap: 10px; }
.pc-q-siatka { grid-template-columns: repeat(var(--kolumny, 4), minmax(0, 1fr)); }
.pc-q-rzad { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.pc-q-lista { grid-template-columns: minmax(0, 1fr); }
/* przyciski odpowiedzi: motyw nadaje przyciskom tło, wypełnienie i kolory przy najechaniu, więc wszystko jawnie */
.pc .pc-q-opcja {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 64px; margin: 0; padding: 12px 16px;
  border: 1.5px solid var(--pc-linia); border-radius: var(--pc-r-maly); background: #fff; color: var(--pc-atrament); box-shadow: none;
  font: inherit; font-size: 16px; font-weight: 500; line-height: 1.3; text-align: left; text-transform: none; letter-spacing: normal; cursor: pointer;
  transition: border-color 0.18s var(--pc-ease), background-color 0.18s var(--pc-ease), transform 0.12s var(--pc-ease);
}
.pc .pc-q-opcja:hover, .pc .pc-q-opcja:focus { background: #fff; color: var(--pc-atrament); }
.pc .pc-q-opcja .pc-ikona { width: 44px; height: 44px; padding: 10px; border-radius: 50%; background: var(--pc-szalwia); color: var(--pc-sosna); transition: background-color 0.18s var(--pc-ease), color 0.18s var(--pc-ease); }
.pc .pc-q-opcja[aria-pressed="true"] { border-color: var(--pc-sosna); background: var(--pc-szalwia); }
/* kółko zaznaczenia w prawym górnym rogu: od razu widać, że odpowiedź się klika; po wyborze pełne jak pole wyboru */
.pc .pc-q-opcja { position: relative; }
.pc .pc-q-opcja::after {
  content: ""; position: absolute; top: 10px; right: 10px; width: 20px; height: 20px; border-radius: 50%;
  border: 2px solid #8b9a91; background: #fff; transition: border-color 0.18s var(--pc-ease), background-color 0.18s var(--pc-ease), box-shadow 0.18s var(--pc-ease);
}
.pc .pc-q-opcja[aria-pressed="true"]::after { border-color: var(--pc-sosna); background: var(--pc-sosna); box-shadow: inset 0 0 0 4px #fff; }
@media (hover: hover) and (pointer: fine) { .pc .pc-q-opcja:hover::after { border-color: var(--pc-sosna); } }
.pc .pc-q-opcja[aria-pressed="true"] .pc-ikona { background: var(--pc-sosna); color: var(--pc-zloto-jasne); }
.pc .pc-q-opcja:active { transform: scale(0.98); }
@media (hover: hover) and (pointer: fine) { .pc .pc-q-opcja:hover { border-color: var(--pc-sosna); } }
.pc-q-tekst { display: grid; gap: 2px; min-width: 0; }
/* prawdziwe ikony z Gemini: bez tła i bez kółka, lekko unoszą się przy najechaniu, przy wyborze odrobinę większe */
.pc .pc-q-opcja .pc-q-obraz { width: 72px; height: 72px; object-fit: contain; transition: transform 0.25s var(--pc-ease); }
@media (hover: hover) and (pointer: fine) { .pc .pc-q-opcja:hover .pc-q-obraz { transform: translateY(-3px) scale(1.05); } }
.pc .pc-q-opcja[aria-pressed="true"] .pc-q-obraz { transform: scale(1.06); }
/* jedno wejście ikon, gdy quiz pojawi się w widoku: kolejno co 45 ms (klasy ustawia skrypt, bez skryptu ikony stoją) */
.pc-quiz.pc-ikony-czekaja .pc-q-obraz { opacity: 0; transform: translateY(10px) scale(0.92); }
.pc-quiz.pc-ikony-wchodza .pc-q-obraz { transition: opacity 0.32s var(--pc-ease), transform 0.32s var(--pc-ease); transition-delay: calc(var(--i, 0) * 45ms); }
.pc-q-etykieta { font-weight: 600; }
.pc-q-opis { font-size: 14.5px; font-weight: 400; line-height: 1.4; color: var(--pc-szary); }
.pc .pc-q-siatka .pc-q-opcja { flex-direction: column; justify-content: center; gap: 10px; min-height: 118px; padding: 18px 12px 16px; text-align: center; }
.pc-q-siatka .pc-q-etykieta { font-size: 15px; }
.pc .pc-q-rzad .pc-q-opcja { justify-content: center; padding-inline: 34px; text-align: center; }
.pc .pc-q-lista .pc-q-opcja { min-height: 68px; padding: 12px 44px 12px 18px; }
.pc-q-podpowiedz { margin-top: 14px; max-width: 60ch; font-size: 15px; line-height: 1.5; color: var(--pc-szary); }

/* Pole liczby: metraż i koszt ogrzewania */
.pc-q-metraz, .pc-q-kwota { display: grid; gap: 12px; max-width: 460px; }
.pc-q-liczba { display: flex; align-items: baseline; gap: 10px; }
.pc .pc-q-liczba input {
  width: 4.2ch; min-width: 0; min-height: 44px; margin: 0; padding: 0 0 4px; border: 0; border-bottom: 2px solid var(--pc-sosna); border-radius: 0;
  background: transparent; box-shadow: none; font: inherit; font-size: clamp(40px, 2vw + 30px, 56px); font-weight: 600; line-height: 1.1;
  color: var(--pc-sosna); font-variant-numeric: tabular-nums;
}
.pc .pc-q-liczba input:focus { outline: none; border-bottom-color: var(--pc-fokus); }
.pc .pc-q-liczba input:focus-visible { outline: 3px solid var(--pc-fokus); outline-offset: 6px; border-radius: 4px; }
.pc .pc-q-liczba input[aria-invalid="true"] { border-bottom-color: var(--pc-blad); }
.pc-q-liczba > span:last-child { font-size: 24px; font-weight: 600; color: var(--pc-sosna); }
.pc-q-metraz + .pc-q-podpowiedz, .pc-q-kwota + .pc-q-podpowiedz { margin-top: 8px; }
/* v7: liczba na środku między przyciskami −/+ (szerokość pola ustawia skrypt z liczby cyfr), suwak pod spodem */
.pc-q-krokowy { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.pc-q-krokowy .pc-q-liczba { justify-content: center; min-width: 0; }
.pc .pc-q-krokowy .pc-q-liczba input { text-align: center; }
.pc .pc-q-krok {
  display: grid; place-items: center; width: 52px; height: 52px; margin: 0; padding: 0; border: 1.5px solid var(--pc-linia); border-radius: 50%;
  background: #fff; color: var(--pc-sosna); box-shadow: none; cursor: pointer; touch-action: manipulation;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent;
  transition: border-color 0.18s var(--pc-ease), background-color 0.18s var(--pc-ease), transform 0.12s var(--pc-ease);
}
.pc .pc-q-krok:hover, .pc .pc-q-krok:focus { background: #fff; color: var(--pc-sosna); }
@media (hover: hover) and (pointer: fine) { .pc .pc-q-krok:hover { border-color: var(--pc-sosna); background: var(--pc-szalwia); } }
.pc .pc-q-krok:active, .pc .pc-q-krok.jest-wcisniety { transform: scale(0.94); border-color: var(--pc-sosna); background: var(--pc-szalwia); }
.pc .pc-q-krok .pc-ikona { width: 22px; height: 22px; stroke-width: 2.4; }
/* ile to paliwa: zmienia się z kwotą; stała wysokość, żeby przyciski pod spodem nie skakały */
.pc-q-ile { min-height: 1.5em; font-size: 15.5px; font-weight: 500; line-height: 1.5; color: var(--pc-sosna); }
.pc-q-blad { margin-top: 10px; font-size: 15px; font-weight: 500; color: var(--pc-blad); }
.pc-q-dalej { margin-top: 20px; }
.pc-q-dalej .pc-ikona { width: 18px; height: 18px; }
.pc-q-przyciski { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; margin-top: 20px; }
.pc-q-przyciski .pc-q-dalej { margin-top: 0; }

.pc .pc-quiz-wstecz, .pc .pc-wynik-zmien, .pc .pc-q-niewiem {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin: 0; padding: 0 4px; border: 0; border-radius: 6px;
  background: none; box-shadow: none; color: var(--pc-sosna); font: inherit; font-size: 15.5px; font-weight: 600; line-height: 1.2; cursor: pointer;
}
.pc .pc-quiz-wstecz:hover, .pc .pc-quiz-wstecz:focus, .pc .pc-wynik-zmien:hover, .pc .pc-wynik-zmien:focus,
.pc .pc-q-niewiem:hover, .pc .pc-q-niewiem:focus { background: none; color: var(--pc-sosna); }
.pc .pc-quiz-wstecz { align-self: flex-start; margin-top: auto; }
.pc .pc-quiz-wstecz .pc-ikona { width: 18px; height: 18px; }
.pc .pc-wynik-zmien, .pc .pc-q-niewiem { text-decoration: underline; text-underline-offset: 4px; text-decoration-color: rgba(18, 63, 45, 0.35); }
.pc-quiz-bez-js { font-size: 15px; color: var(--pc-szary); }

/* Wynik: bez lawiny tekstu */
.pc-quiz.jest-wynik .pc-quiz-gora { display: none; }
.pc-quiz.jest-wynik .pc-quiz-panel { min-height: 0; }
.pc-wynik { display: grid; gap: 14px; }
.pc-wynik-dom { font-size: 15px; line-height: 1.5; color: var(--pc-szary); }
/* v8: każda odpowiedź w opisie domu da się poprawić; kropkowane podkreślenie mówi „kliknij i zmień” bez dodatkowych etykiet */
.pc .pc-wynik-odp {
  display: inline; margin: 0; padding: 0; border: 0; border-radius: 3px; background: none; box-shadow: none;
  color: var(--pc-atrament); font: inherit; line-height: inherit; text-align: left; cursor: pointer;
  text-decoration: underline dotted rgba(18, 63, 45, 0.6); text-decoration-thickness: 1.5px; text-underline-offset: 4px;
  transition: color 0.18s var(--pc-ease), text-decoration-color 0.18s var(--pc-ease);
}
.pc .pc-wynik-odp:hover, .pc .pc-wynik-odp:focus { background: none; color: var(--pc-sosna); }
/* na dotyku odpowiedzi to osobne przyciski 40 px z odstępem (bez przecinków), żeby palec trafiał w jedną */
@media (pointer: coarse) {
  /* przyciski 44 px i „Zmień” w jednym przepływie: przy 390 px trzy rzędy, kwota zostaje wysoko */
  .pc-wynik-dom { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
  .pc-wynik-dom #pc-wynik-dom { display: contents; }
  .pc-wynik-dom .pc-wynik-sep { display: none; }
  .pc .pc-wynik-zmien { min-height: 44px; margin: 0; }
  .pc .pc-wynik-odp {
    display: inline-flex; align-items: center; min-height: 44px; padding: 4px 9px; border: 1px solid var(--pc-linia);
    border-radius: 999px; background: #fff; font-size: 13.5px; line-height: 1.2; text-decoration: none;
  }
  .pc .pc-wynik-odp:hover, .pc .pc-wynik-odp:focus { background: #fff; }
  .pc .pc-wynik-odp:active { border-color: var(--pc-sosna); background: var(--pc-szalwia); }
}
@media (hover: hover) and (pointer: fine) { .pc .pc-wynik-odp:hover { text-decoration-style: solid; text-decoration-color: var(--pc-sosna); } }
/* „Zmień” w wierszu tekstu: cel dotyku 44 px bez rozpychania wiersza */
.pc .pc-wynik-zmien { min-height: 44px; margin-block: -12px; font-size: 15px; }
.pc-sekcja .pc-wynik-kwota { margin-top: 4px; font-size: clamp(34px, 2.2vw + 20px, 52px); font-weight: 600; line-height: 1.08; letter-spacing: -0.02em; color: var(--pc-sosna); text-wrap: balance; font-variant-numeric: tabular-nums; }
.pc-wynik-kwota:focus { outline: none; } /* fokus z kodu po pokazaniu wyniku; nagłówek nie jest kontrolką */
.pc-wynik-wariant { font-size: 16.5px; font-weight: 500; line-height: 1.4; color: var(--pc-atrament); }
.pc-wynik-cena { justify-self: start; padding: 6px 12px; border-radius: 8px; background: var(--pc-szalwia); color: var(--pc-sosna); font-size: 14.5px; font-weight: 600; line-height: 1.4; }

.pc-schody-blok { display: grid; gap: 10px; margin-top: 8px; }
.pc-schody-tytul { font-size: 14px; font-weight: 500; color: var(--pc-szary); }
.pc-schody-tytul span { font-weight: 400; }
.pc-schody { display: grid; gap: 6px; }
.pc .pc-schod-przycisk {
  display: grid; grid-template-columns: minmax(0, 230px) minmax(0, 1fr) minmax(6.4em, auto); grid-template-areas: "nazwa tor zl";
  align-items: center; gap: 14px; width: 100%; margin: 0; padding: 8px 12px; border: 1.5px solid transparent; border-radius: var(--pc-r-maly);
  background: none; box-shadow: none; color: var(--pc-atrament); font: inherit; text-align: left; text-transform: none; letter-spacing: normal; cursor: pointer;
  transition: border-color 0.18s var(--pc-ease), background-color 0.18s var(--pc-ease);
}
.pc .pc-schod-przycisk:hover, .pc .pc-schod-przycisk:focus { background: none; color: var(--pc-atrament); }
.pc .pc-schod-teraz { cursor: default; }
.pc .pc-schod-przycisk[aria-pressed="true"] { border-color: var(--pc-sosna); background: #fff; box-shadow: var(--pc-cien-maly); }
.pc .pc-schod-przycisk { position: relative; padding-right: 40px; }
.pc button.pc-schod-przycisk::after {
  content: ""; position: absolute; top: 50%; right: 12px; width: 18px; height: 18px; margin-top: -9px; border-radius: 50%;
  border: 2px solid #8b9a91; background: #fff; transition: border-color 0.18s var(--pc-ease), background-color 0.18s var(--pc-ease), box-shadow 0.18s var(--pc-ease);
}
.pc button.pc-schod-przycisk[aria-pressed="true"]::after { border-color: var(--pc-sosna); background: var(--pc-sosna); box-shadow: inset 0 0 0 4px #fff; }
@media (hover: hover) and (pointer: fine) { .pc button.pc-schod-przycisk:hover { background: rgba(255, 255, 255, 0.7); } .pc button.pc-schod-przycisk[aria-pressed="true"]:hover { background: #fff; } }
.pc-schod-nazwa { grid-area: nazwa; font-size: 14.5px; font-weight: 500; line-height: 1.3; text-align: right; }
.pc-schod-tor { grid-area: tor; height: 28px; border-radius: 8px; background: rgba(18, 63, 45, 0.06); overflow: hidden; }
/* słupek rośnie od lewej przez transform (GPU); zaokrąglenie daje tor, więc skala nie zniekształca końców */
.pc-schod-tor span { display: block; width: 100%; height: 100%; transform: scaleX(0); transform-origin: left center; transition: transform 0.5s var(--pc-ease); }
.pc-schody.jest-pokazany .pc-schod-tor span { transform: scaleX(var(--w)); }
.pc-schod:nth-child(2) .pc-schod-tor span { transition-delay: 0.06s; }
.pc-schod:nth-child(3) .pc-schod-tor span { transition-delay: 0.12s; }
.pc-schod:nth-child(4) .pc-schod-tor span { transition-delay: 0.18s; }
.pc-schod-p0 .pc-schod-tor span { background: linear-gradient(90deg, #9e1c1c, #cf3a2a); }
.pc-schod-p1 .pc-schod-tor span { background: linear-gradient(90deg, #cf561b, #ea8a32); }
.pc-schod-p2 .pc-schod-tor span { background: linear-gradient(90deg, #dca12a, #efc65a); }
.pc-schod-p3 .pc-schod-tor span { background: linear-gradient(90deg, var(--pc-sosna), #2b7a51); }
.pc-schod-zl { grid-area: zl; display: grid; justify-items: end; font-size: 16.5px; font-weight: 600; color: var(--pc-sosna); text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pc-schod-roznica { font-size: 13px; font-weight: 600; line-height: 1.2; }
.pc-schod-roznica.jest-mniej { color: #1f6b45; }
.pc-schod-roznica.jest-wiecej { color: #9e1c1c; }
.pc-schod-p3 .pc-schod-zl, .pc-schod-p3 .pc-schod-nazwa { color: var(--pc-sosna); font-weight: 600; }
.pc-wynik-uwagi { font-size: 13.5px; line-height: 1.5; color: var(--pc-szary); }

/* Wezwanie: pas sosny na całą szerokość, imię i telefon, duży złoty przycisk */
.pc-cta { grid-column: 1 / -1; padding: clamp(22px, 3vw, 40px); background: var(--pc-sosna); color: #fff; border-top: 3px solid var(--pc-zloto); }
.pc-cta-wew { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); grid-template-areas: "naglowek form" "tel form"; gap: 14px clamp(24px, 3vw, 48px); align-items: center; }
.pc-cta-naglowek { grid-area: naglowek; display: grid; gap: 8px; align-self: end; }
.pc-sekcja .pc-cta-tytul { font-size: clamp(24px, 1.4vw + 16px, 34px); line-height: 1.15; letter-spacing: -0.015em; color: #fff; text-wrap: balance; }
.pc-cta-podtytul { font-size: 16px; line-height: 1.5; color: rgba(255, 255, 255, 0.86); }
.pc-cta-form, .pc-cta-dziekujemy { grid-area: form; }
.pc-cta-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pc-cta-pole { display: grid; gap: 6px; }
.pc-cta-pole span { font-size: 14px; font-weight: 500; color: rgba(255, 255, 255, 0.9); }
.pc .pc-cta-pole input {
  width: 100%; min-height: 56px; margin: 0; padding: 0 16px; border: 2px solid transparent; border-radius: 7px; background: #fff; box-shadow: none;
  color: var(--pc-atrament); font: inherit; font-size: 17px; font-weight: 500;
}
.pc .pc-cta-pole input:focus { outline: none; border-color: var(--pc-zloto); }
.pc .pc-cta-pole input:focus-visible { outline: 3px solid var(--pc-zloto-jasne); outline-offset: 2px; }
.pc .pc-cta-pole input[aria-invalid="true"] { border-color: var(--pc-blad-jasny); }
.pc .pc-cta-przycisk {
  grid-column: 1 / -1; min-height: 64px; margin: 4px 0 0; padding: 0 24px; border: 0; font-size: clamp(17px, 0.4vw + 15px, 20px); font-weight: 600;
  background: var(--pc-zloto-jasne); box-shadow: 0 16px 30px -14px rgba(0, 21, 15, 0.7);
}
.pc .pc-cta-przycisk .pc-ikona { width: 20px; height: 20px; }
@media (hover: hover) and (pointer: fine) { .pc .pc-cta-przycisk:hover { background: #e6d3a1; color: var(--pc-zloto-tekst); } }
.pc .pc-cta-przycisk:disabled { cursor: progress; opacity: 0.85; }
.pc-cta-blad { grid-column: 1 / -1; font-size: 15px; font-weight: 500; color: var(--pc-blad-jasny); }
.pc-cta-czas { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; font-size: 15.5px; font-weight: 600; color: #fff; }
.pc-cta-czas .pc-ikona { width: 20px; height: 20px; color: var(--pc-zloto); }
.pc-cta-zgoda { grid-column: 1 / -1; font-size: 12.5px; line-height: 1.5; color: rgba(255, 255, 255, 0.72); }
.pc-cta-zgoda a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.pc-cta-tel { grid-area: tel; align-self: start; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; width: max-content; color: #fff; font-size: 17px; font-weight: 600; text-decoration: none; font-variant-numeric: tabular-nums; }
.pc-cta-tel span { font-weight: 400; color: rgba(255, 255, 255, 0.82); }
.pc-cta-tel .pc-ikona { color: var(--pc-zloto); }
.pc-cta-tel:focus-visible { border-radius: 6px; }
@media (hover: hover) and (pointer: fine) { .pc-cta-tel:hover { text-decoration: underline; text-underline-offset: 4px; } }
.pc-cta-dziekujemy { display: grid; gap: 14px; }
.pc-cta.jest-wyslane .pc-cta-wew { grid-template-columns: minmax(0, 1fr); grid-template-areas: "form" "tel"; }
.pc-cta-dziekujemy-tekst { font-size: 19px; font-weight: 600; line-height: 1.4; color: #fff; }
.pc-cta-mail { margin: 0; padding: 14px 16px; border-radius: 10px; background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.92); font-size: 13px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }

/* Ceny i „Jak liczymy” na dole strony: dla wyszukiwarek, asystentów AI i dociekliwych; metoda zwinięta pod cennikiem */
.pc-ceny { background: var(--pc-tlo); }
.pc-metoda { margin-top: clamp(16px, 2vw, 24px); border: 1px solid var(--pc-linia); border-radius: var(--pc-r-maly); background: #fff; }
.pc-metoda summary {
  display: grid; grid-template-columns: 1fr 32px; gap: 16px; align-items: center; min-height: 60px; padding: 16px 20px; list-style: none; cursor: pointer;
  font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--pc-sosna);
}
.pc-metoda summary::-webkit-details-marker { display: none; }
.pc-metoda summary::after {
  content: ""; width: 32px; height: 32px; border-radius: 50%; background: var(--pc-szalwia) no-repeat center / 14px 14px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 1v12M1 7h12' stroke='%23123f2d' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  transition: transform 0.3s var(--pc-ease);
}
.pc-metoda[open] summary::after { transform: rotate(45deg); }
.pc-metoda-tresc { display: grid; gap: 18px; padding: 0 20px 22px; }
.pc-metoda-kroki { display: grid; gap: 10px; max-width: 75ch; counter-reset: metoda; }
.pc-metoda-kroki li { position: relative; padding-left: 34px; font-size: 15.5px; line-height: 1.6; color: var(--pc-atrament); counter-increment: metoda; }
.pc-metoda-kroki li::before { content: counter(metoda); position: absolute; left: 0; top: 1px; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--pc-szalwia); color: var(--pc-sosna); font-size: 13px; font-weight: 600; }
.pc-metoda-kroki strong { color: var(--pc-sosna); }
.pc-metoda-tabele { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; align-items: start; }
.pc-metoda-tabela { overflow-x: auto; }
.pc-metoda-tabela-koszty { max-width: 760px; } /* trzy kolumny: nazwa wariantu blisko kwot */
.pc-tabela-metoda { font-size: 15px; }
.pc-tabela-metoda caption { caption-side: top; padding: 0 0 10px; font-size: 15px; font-weight: 600; color: var(--pc-sosna); }
.pc-tabela-metoda td strong { display: block; color: var(--pc-sosna); }
.pc-metoda-zrodla, .pc-metoda-uwaga { font-size: 14px; line-height: 1.55; color: var(--pc-szary); max-width: 75ch; }

/* Podsumowanie oferty nad formularzem wyceny; skok z oferty zostawia nagłówek sekcji pod przyklejonym paskiem witryny */
.pc .kt .pc-kt-dobor { margin: 0 0 20px; font-weight: 500; }
.pc #wycena { scroll-margin-top: 72px; }

@media (max-width: 1100px) {
  .pc .pc-schod-przycisk { grid-template-columns: minmax(0, 180px) minmax(0, 1fr) minmax(6.4em, auto); }
}
@media (max-width: 900px) {
  .pc-quiz-panel { min-height: 0; }
  .pc-cta-wew { grid-template-columns: minmax(0, 1fr); grid-template-areas: "naglowek" "form" "tel"; }
}
@media (max-width: 600px) {
  .pc-quiz-osoba { padding: 12px 16px; gap: 8px 12px; }
  .pc-osoba-zdjecie { width: 46px; height: 46px; }
  .pc-ocena { padding: 5px 10px; font-size: 12.5px; }
  .pc-ocena img { width: 44px; }
  .pc-gwiazdki { width: 60px; height: 12px; }
  .pc-quiz-dom { display: none; }
  .pc-quiz-panel { gap: 18px; padding: 20px 16px; }
  .pc-q-siatka { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc .pc-q-siatka .pc-q-opcja { min-height: 100px; gap: 8px; padding: 12px 8px; }
  .pc .pc-q-opcja .pc-ikona { width: 38px; height: 38px; padding: 8px; }
  .pc .pc-q-opcja::after { top: 8px; right: 8px; width: 18px; height: 18px; }
  .pc .pc-q-opcja .pc-q-obraz { width: 60px; height: 60px; }
  .pc .pc-q-opcja { padding: 12px 14px; font-size: 15.5px; }
  /* w wąskim rzędzie napis schodzi pod kółko zaznaczenia (18 px od góry 8 px), żeby go nie przecinało */
  .pc .pc-q-rzad .pc-q-opcja { padding: 32px 6px 14px; }
  .pc-q-dalej { width: 100%; }
  .pc-q-krokowy { gap: 8px; }
  .pc .pc-q-krok { width: 48px; height: 48px; }
  .pc-q-przyciski { flex-direction: column; align-items: stretch; }
  .pc .pc-q-niewiem { justify-content: center; }
  /* miejsce na kółko wyboru zostaje także na telefonie (skrót padding kasował odstęp z prawej i kółko wchodziło na różnicę kwot) */
  .pc .pc-schod-przycisk { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "nazwa zl" "tor tor"; gap: 6px 10px; padding: 8px 38px 8px 10px; }
  .pc button.pc-schod-przycisk::after { right: 10px; }
  .pc-schod-nazwa { text-align: left; }
  .pc-schod-tor { height: 22px; }
  .pc-cta { padding: 22px 16px; }
  .pc-cta-form { grid-template-columns: minmax(0, 1fr); }
  .pc-metoda summary { padding: 14px 16px; font-size: 16.5px; }
  .pc-metoda-tresc { padding: 0 16px 18px; }
}

/* v8: „Może dojść” pod „W cenie”: spokojniej (bez ikon, mniejszy tekst), żeby nie konkurowało z tym, co w cenie */
.pc-wcenie .pc-wcenie-dojsc-h { margin-top: 18px; }
.pc-wcenie .pc-wcenie-dojsc { display: grid; gap: 6px; padding-left: 18px; list-style: disc; font-size: 14.5px; line-height: 1.45; color: var(--pc-szary); }
.pc-wcenie .pc-wcenie-dojsc li { display: list-item; }

/* przycisk wezwania w jednej linii na wąskim telefonie (360 px) */
@media (max-width: 400px) { .pc .pc-cta-przycisk { padding: 0 12px; font-size: 16px; gap: 0.35em; } }

/* ---------- v9 (10.10.2026): dolna strefa pod wyszukiwarki i odpowiedzi AI (poradnik.html) ----------
   Każda sekcja: nagłówek-pytanie, kapsuła (pierwsze zdanie odpowiada samo, złota kreska jako znak odpowiedzi), dowody
   z boku. Tabele w ramce tabel metody: na telefonie wiersz staje się kartą z nazwą kolumny przy każdej wartości. */
.pc-link-tekst { color: var(--pc-sosna); font-weight: 500; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.pc-link-tekst:focus-visible { border-radius: 4px; }
@media (hover: hover) and (pointer: fine) { .pc-link-tekst:hover { text-decoration-thickness: 2px; } }

/* wstęp poradnika: w skrócie i spis odpowiedzi */
.pc-por { background: #fff; }
.pc-sekcja .pc-por-lead { margin-top: 14px; font-size: clamp(16.5px, 0.3vw + 15.5px, 18px); line-height: 1.6; color: var(--pc-szary); max-width: 64ch; }
.pc-skrot { margin: clamp(22px, 2.6vw, 34px) 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pc-skrot > div { padding: 16px 18px; border-radius: var(--pc-r-maly); background: var(--pc-tlo); border: 1px solid var(--pc-linia); display: grid; gap: 6px; align-content: start; }
.pc-skrot dt { display: flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; color: var(--pc-szary); }
.pc-skrot dt .pc-ikona { color: var(--pc-sosna); width: 22px; height: 22px; }
.pc-skrot dd { margin: 0; font-size: 17px; font-weight: 600; line-height: 1.4; color: var(--pc-sosna); font-variant-numeric: tabular-nums; }
.pc-por-spis { margin-top: clamp(22px, 2.6vw, 34px); }
.pc-por-spis ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; counter-reset: spis; }
.pc-por-spis li { counter-increment: spis; }
.pc-por-spis a {
  display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 6px 0; border-bottom: 1px solid var(--pc-linia);
  color: var(--pc-atrament); font-size: 16px; font-weight: 500; text-decoration: none; transition: color 0.2s var(--pc-ease), border-color 0.2s var(--pc-ease);
}
.pc-por-spis a::before {
  content: counter(spis); flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  background: var(--pc-szalwia); color: var(--pc-sosna); font-size: 13px; font-weight: 600;
}
.pc-por-spis a:focus-visible { border-radius: 6px; }
@media (hover: hover) and (pointer: fine) { .pc-por-spis a:hover { color: var(--pc-sosna); border-bottom-color: var(--pc-sosna); } }

/* sekcje tematów */
.pc-sekcja.pc-temat { padding-block: clamp(48px, 5.5vw, 88px); scroll-margin-top: 90px; }
.pc-sekcja.pc-temat-jasne { background: var(--pc-tlo); }
.pc-sekcja.pc-temat-biale { background: #fff; }
.pc-sekcja.pc-temat h2 { font-size: clamp(27px, 1.5vw + 17px, 40px); max-width: 28ch; }
.pc-sekcja .pc-kapsula {
  margin-top: 16px; padding-left: 16px; border-left: 3px solid var(--pc-zloto); max-width: 62ch;
  font-size: clamp(17.5px, 0.4vw + 16px, 20px); font-weight: 500; line-height: 1.55; color: var(--pc-atrament);
}
.pc-sekcja .pc-tekst { margin-top: 14px; font-size: 16.5px; line-height: 1.65; color: var(--pc-atrament); max-width: 68ch; }
.pc-sekcja .pc-przypis { font-size: 14px; line-height: 1.55; color: var(--pc-szary); max-width: 78ch; }
.pc-temat-uklad { margin-top: clamp(22px, 2.6vw, 34px); display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: clamp(20px, 3vw, 48px); align-items: start; }
.pc-temat-uklad-film { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.pc-temat-glowna { display: grid; gap: 16px; min-width: 0; }
.pc-sekcja .pc-temat-glowna > .pc-tekst { margin-top: 0; }
.pc-temat-bok { display: grid; gap: 14px; min-width: 0; }
.pc-sekcja h3.pc-temat-h3 { margin-top: 8px; font-size: 20px; }
.pc-karta { padding: 18px 20px; border-radius: var(--pc-r); background: var(--pc-szalwia); display: grid; gap: 10px; font-size: 15.5px; line-height: 1.55; color: var(--pc-atrament); }
.pc-karta > .pc-ikona { width: 28px; height: 28px; color: var(--pc-sosna); }
.pc-karta strong { color: var(--pc-sosna); }
.pc-karta-jasna { background: #fff; border: 1px solid var(--pc-linia); }
.pc-karta-ostrzezenie { background: #fbf6e8; border: 1px solid rgba(206, 180, 114, 0.55); }
.pc-sekcja .pc-karta-podpis { font-size: 14px; color: var(--pc-szary); }
.pc-temat-cta { justify-self: start; margin-top: 4px; }
.pc-lista-ikon { display: grid; gap: 14px; }
.pc-lista-ikon li { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 12px; align-items: start; font-size: 16px; line-height: 1.6; color: var(--pc-atrament); }
.pc-lista-ikon .pc-ikona { width: 24px; height: 24px; margin-top: 2px; color: var(--pc-sosna); }
.pc-lista-ikon strong { color: var(--pc-sosna); }

/* tabele poradnika */
.pc-tabela-moc td small, .pc-tabela-domy td small { display: block; margin-top: 2px; font-size: 13.5px; color: var(--pc-szary); font-weight: 400; }
.pc-tabela-moc td strong, .pc-tabela-domy td strong { font-weight: 600; color: var(--pc-sosna); }
.pc-tabela-domy th small { display: block; margin-top: 3px; font-size: 13.5px; font-weight: 400; color: var(--pc-szary); }
.pc-tabela-paliwa tr.jest-pompa { background: #f2f6ee; }
.pc-tabela-paliwa tr.jest-pompa th { color: var(--pc-sosna); }
.pc-tabela-waska { max-width: 620px; }
.pc-tabela-wybor { margin-top: clamp(22px, 2.6vw, 34px); max-width: 980px; }
.pc-tabela-wybor tbody th { font-weight: 500; color: var(--pc-atrament); width: 46%; }
.pc-tabela-wybor tbody td { color: var(--pc-sosna); font-weight: 500; }

/* montaż krok po kroku */
.pc-montaz-kroki { display: grid; gap: 16px; counter-reset: montaz; }
.pc-montaz-kroki li { position: relative; padding-left: 50px; font-size: 16px; line-height: 1.6; color: var(--pc-atrament); counter-increment: montaz; min-height: 34px; }
.pc-montaz-kroki li::before {
  content: counter(montaz); position: absolute; left: 0; top: 0; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  background: var(--pc-sosna); color: var(--pc-zloto-jasne); font-size: 15px; font-weight: 600;
}
.pc-montaz-kroki strong { color: var(--pc-sosna); }
.pc-temat-film { display: grid; gap: 10px; margin: 0; min-width: 0; }
.pc-temat-film figcaption { font-size: 14.5px; line-height: 1.45; color: var(--pc-szary); }

/* realizacje z bliska */
.pc-case-siatka { margin-top: clamp(24px, 2.8vw, 36px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.8vw, 24px); }
.pc-case { display: grid; grid-template-rows: auto auto 1fr auto; border-radius: var(--pc-r); background: #fff; border: 1px solid var(--pc-linia); overflow: hidden; box-shadow: var(--pc-cien-maly); min-width: 0; }
.pc-case .pc-yt { border-radius: 0; box-shadow: none; }
.pc-case .pc-yt-play { width: 56px; height: 56px; }
.pc-sekcja .pc-case h3 { padding: 16px 18px 0; font-size: 18px; }
.pc-case dl { margin: 0; padding: 12px 18px 0; display: grid; gap: 7px; align-content: start; }
.pc-case dl div { display: grid; grid-template-columns: 6.2em minmax(0, 1fr); gap: 10px; }
.pc-case dt { font-size: 13.5px; color: var(--pc-szary); padding-top: 1px; }
.pc-case dd { margin: 0; font-size: 15px; line-height: 1.45; color: var(--pc-atrament); }
.pc-sekcja .pc-case-rok { padding: 12px 18px 16px; font-size: 13.5px; color: var(--pc-szary); }
#realizacje-z-bliska .pc-przypis { margin-top: 18px; }
#realizacje-z-bliska .pc-temat-cta { margin-top: 16px; }

/* kto montuje */
.pc-ekspert { margin-top: clamp(22px, 2.6vw, 34px); display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: clamp(20px, 3.4vw, 56px); align-items: start; }
.pc-ekspert-zdjecie { width: 100%; height: auto; border-radius: var(--pc-r); background: var(--pc-szalwia); }
.pc-ekspert-tresc { display: grid; gap: 16px; min-width: 0; }
.pc-sekcja .pc-ekspert-tresc .pc-kapsula, .pc-sekcja .pc-ekspert-tresc .pc-tekst { margin-top: 0; }
.pc-zespol { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 28px; }
.pc-zespol dt { font-size: 13.5px; color: var(--pc-szary); }
.pc-zespol dd { margin: 2px 0 0; font-size: 15.5px; font-weight: 500; color: var(--pc-atrament); }
.pc-sekcja .pc-firma { font-size: 14.5px; line-height: 1.6; color: var(--pc-szary); max-width: 72ch; }
.pc-ekspert-linki { display: flex; flex-wrap: wrap; gap: 0 24px; }

/* gdzie montujemy: większy nagłówek jak w innych tematach, tekst obok listy miast */
.pc-sekcja.pc-temat.pc-miasta { padding-block: clamp(48px, 5.5vw, 88px) !important; }
.pc-temat.pc-miasta .pc-wew { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 24px 56px; }
.pc-sekcja.pc-temat.pc-miasta h2 { font-size: clamp(27px, 1.5vw + 17px, 40px); }
.pc-miasta-glowka { display: grid; align-content: start; }

/* zakończenie: jedno wezwanie na pasie sosny */
.pc-koniec { background: var(--pc-sosna); color: #fff; padding-block: clamp(52px, 6vw, 92px) !important; }
.pc-koniec-wew { display: grid; gap: 18px; justify-items: start; }
.pc-sekcja.pc-koniec h2 { color: #fff; max-width: 24ch; }
.pc-sekcja.pc-koniec h2 em { text-decoration-color: var(--pc-zloto); color: var(--pc-zloto-jasne); }
.pc-sekcja .pc-koniec-lead { font-size: clamp(16.5px, 0.3vw + 15.5px, 18.5px); line-height: 1.6; color: rgba(255, 255, 255, 0.86); max-width: 58ch; }
.pc-koniec-akcje { display: flex; flex-wrap: wrap; gap: 12px; }
.pc-koniec-tel .pc-ikona { color: var(--pc-zloto); }
.pc-sekcja .pc-por-stan { margin-top: 10px; font-size: 13.5px; line-height: 1.55; color: rgba(255, 255, 255, 0.7); max-width: 84ch; }

@media (max-width: 1100px) {
  .pc-skrot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-por-spis ol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-case-siatka { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .pc-temat-uklad, .pc-temat-uklad-film { grid-template-columns: minmax(0, 1fr); }
  .pc-ekspert { grid-template-columns: minmax(0, 1fr); }
  .pc-ekspert-zdjecie { max-width: 260px; }
  .pc-temat.pc-miasta .pc-wew { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .pc-skrot { grid-template-columns: minmax(0, 1fr); }
  .pc-por-spis ol { grid-template-columns: minmax(0, 1fr); }
  .pc-case-siatka { grid-template-columns: minmax(0, 1fr); }
  .pc-zespol { grid-template-columns: minmax(0, 1fr); }
  .pc-sekcja .pc-kapsula { padding-left: 13px; }
  .pc-montaz-kroki li { padding-left: 46px; font-size: 15.5px; }
  .pc-tabela-wybor tbody th { width: auto; }
  .pc-koniec-akcje { width: 100%; }
  .pc-koniec-akcje .pc-btn { flex: 1 1 100%; }
  .pc-metoda-tabela .pc-tabela-metoda td small { display: block; text-align: right; }
}

/* pojemność pompy: „do ok. 140 m²” w jednej linii (komputer i karta na telefonie) */
.pc-tabela-pojemnosc td span { white-space: nowrap; }

/* v9 poprawki 2: montaż z kadrem etapu przy każdym kroku, powiązane usługi i okruszki na końcu */
.pc-montaz-kroki li { display: grid; grid-template-columns: 34px minmax(0, 168px) minmax(0, 1fr); gap: 16px; align-items: start; padding-left: 0; }
.pc-montaz-kroki li::before { position: static; }
.pc-montaz-kadr { display: block; border-radius: var(--pc-r-maly); overflow: hidden; background: var(--pc-sosna-3); box-shadow: var(--pc-cien-maly); }
.pc-montaz-kadr img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform 0.5s var(--pc-ease); }
.pc-montaz-kadr:focus-visible { border-radius: var(--pc-r-maly); }
@media (hover: hover) and (pointer: fine) { .pc-montaz-kadr:hover img { transform: scale(1.04); } }
.pc-sekcja .pc-montaz-kroki p { font-size: 16px; line-height: 1.6; color: var(--pc-atrament); }
.pc-sekcja .pc-koniec-uslugi { font-size: 15.5px; line-height: 1.6; color: rgba(255, 255, 255, 0.86); }
.pc-koniec-uslugi a, .pc-okruszki a { color: #fff; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.pc-koniec-uslugi a:focus-visible, .pc-okruszki a:focus-visible { border-radius: 4px; outline-color: var(--pc-zloto); }
.pc-okruszki ol { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; padding: 0; list-style: none; font-size: 13.5px; color: rgba(255, 255, 255, 0.7); }
.pc-okruszki li + li::before { content: "›"; margin: 0 8px; color: rgba(255, 255, 255, 0.5); }
.pc-okruszki [aria-current] { color: #fff; }
@media (max-width: 600px) {
  .pc-montaz-kroki li { grid-template-columns: 30px minmax(0, 1fr); }
  .pc-montaz-kroki li::before { width: 30px; height: 30px; font-size: 14px; }
  .pc-montaz-kadr { grid-column: 2; }
  .pc-sekcja .pc-montaz-kroki p { grid-column: 2; font-size: 15.5px; }
}
