/* LAB sekcja kontaktu (wezwanie na końcu) nowej strony głównej aslandi.pl, v2 (29.09.2026): wybrany wariant B na sośnie,
   cały formularz w dużej jasnej karcie. Igor: „B wygrywa, ale zrób ją na ciemnym tle, naszym brandowym zielonym”, potem
   „tło jest zielone, ale cały formularz jest jasny, aby było wiadomo, że to CTA WIELKIE; musi być jak najlepsze pod
   konwersję”. Układ: nagłówek i zdanie na zieleni, pod nimi biała karta (do 720 px, głęboki cień) z formularzem, pod
   przyciskiem „Bez zobowiązań” i ocena w Google, zgoda drobnym drukiem na końcu karty (długi tekst prawny nie stoi już
   między polami a przyciskiem); telefon pod kartą jako druga droga. Jedna akcja z jedną nazwą („Bezpłatna wycena”, jak
   w nagłówku witryny). Formularz Contact Form 7 w budowie z ../PLAN.md: etykiety nad polami, pola 16 px (mniejsze
   powiększają stronę na iPhonie), usługa jednym dotknięciem, komunikat przy polu, potwierdzenie w miejscu formularza.
   Na sośnie #123f2d: nagłówek biały 11,8:1, zdanie biel 84% 8,8:1, obrys fokusu złoto jasne #dcc78f 7,1:1. W karcie:
   atrament #1c3428, obrys pól #7c8c82 (3,3:1, granica kontrolki), błąd #b3261e 6,5:1, fokus #a67b23, drobny druk
   #58685f 6,0:1; przycisk złoty #ceb472 z tekstem #182e23 7,2:1. Stopka pod sekcją ma zbliżoną zieleń (#163327), więc
   sekcja ma u góry jaśniejszą poświatę, a na dole cienką linię: strona nie wygasa w stopkę.
   Motyw (Astra) ma własne, silne reguły dla pól Contact Form 7 (niebieska ramka #046bd2 przy fokusie, bez obrysu,
   szary tekst), a przyciskom zdejmuje obrys przy fokusie; reguły tutaj są silniejsze. */
.kt {
  --kt-sosna: #123f2d;
  --kt-atrament: #1c3428;
  --kt-szary: #58685f;
  --kt-linia: #dce3da;
  --kt-obrys: #7c8c82;
  --kt-szalwia: #eef3ec;
  --kt-zloto: #ceb472;
  --kt-zloto-2: #d8c287;
  --kt-zloto-tekst: #182e23;
  --kt-zloto-jasne: #dcc78f;
  --kt-fokus: #a67b23;
  --kt-blad: #b3261e;
  --kt-ease: cubic-bezier(0.23, 1, 0.32, 1);
  padding-block: clamp(64px, 7vw, 104px);
  background: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(27, 90, 65, 0.9) 0%, rgba(27, 90, 65, 0) 100%), var(--kt-sosna);
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.1);
  color: #fff;
  font-family: Poppins, system-ui, sans-serif;
}
.kt *, .kt *::before, .kt *::after { box-sizing: border-box; }
.kt h2, .kt p, .kt ul, .kt fieldset, .kt legend { margin: 0; padding: 0; }
.kt fieldset { min-width: 0; border: 0; }
.kt ::selection { background: #cfdcc5; color: var(--kt-atrament); }
.kt :focus-visible { outline: 3px solid var(--kt-zloto-jasne); outline-offset: 3px; }
.kt-karta :focus-visible { outline-color: var(--kt-fokus); }
.kt [hidden] { display: none !important; }
.kt-wew { width: min(720px, 100% - 64px); margin-inline: auto; }

/* Nagłówek na zieleni: nazwa akcji jak w nagłówku witryny; rozmiar i krój jak H2 wszystkich nowych sekcji strony
   (usługi, opinie, realizacje, „Poznaj nas”: clamp 30–48 px, -0,02em), czas wyróżniony jak w sekcji opinii. */
.kt .kt-h2 { font-family: inherit; font-size: clamp(30px, 2.2vw + 16px, 48px); line-height: 1.15; font-weight: 600; letter-spacing: -0.02em;
  text-align: center; text-transform: none; color: #fff; text-wrap: balance; }
/* wyróżnienie na ciemnym tle jak w sekcji opinii (.op h2 em) i w hero: złoto jasne, bez pasa (półprzezroczysty złoty
   pas na sośnie wychodził oliwkowy #6a7d53; recenzja 29.09) */
.kt-h2-czas { white-space: nowrap; color: var(--kt-zloto-jasne); }
.kt .kt-lead { max-width: 34ch; margin: 14px auto 0; font-size: clamp(16.5px, 0.35vw + 15px, 19px); line-height: 1.55; text-align: center;
  color: rgba(255, 255, 255, 0.84); text-wrap: balance; }

/* Karta: jasna, duża, z głębokim cieniem na zieleni; to jest wezwanie tej strony. */
.kt-karta { margin-top: clamp(28px, 3vw, 40px); padding: clamp(24px, 3.4vw, 44px); border-radius: 18px; background: #fff; color: var(--kt-atrament);
  box-shadow: 0 2px 6px rgba(0, 21, 15, 0.2), 0 44px 90px -40px rgba(0, 21, 15, 0.85); }   /* cienie tonowane zielenią (DESIGN.md) */

/* ---------- Formularz ---------- */
.kt .screen-reader-response { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; }
.kt .hidden-fields-container { display: none; }
.kt-formularz form p { margin: 0; }              /* Contact Form 7 owija linie szablonu w akapity, jeśli nie wyłączymy tego filtrem */
.kt-pola { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.kt-pola > :nth-child(3) { grid-column: 1 / -1; }
.kt-pole { display: grid; align-content: start; gap: 6px; }   /* dwulinijkowy błąd obok nie przesuwa pola w rzędzie */
.kt .kt-etykieta { display: block; padding: 0; font-size: 14px; font-weight: 600; line-height: 1.3; color: var(--kt-atrament); }
.kt .wpcf7-form-control-wrap { display: block; position: relative; }
.kt .wpcf7 input.wpcf7-form-control:not([type=submit]):not([type=radio]),
.kt .wpcf7 input.wpcf7-form-control:not([type=submit]):not([type=radio]):focus,
.kt .wpcf7 select.wpcf7-form-control, .kt .wpcf7 select.wpcf7-form-control:focus {
  display: block; width: 100%; height: 54px; margin: 0; padding: 0 14px; border: 1px solid var(--kt-obrys); border-radius: 8px; background-color: #fff;
  box-shadow: none; color: var(--kt-atrament); font: inherit; font-size: 16px; line-height: 1.2; transition: border-color 160ms ease, box-shadow 160ms ease; }
.kt .wpcf7 select.wpcf7-form-control, .kt .wpcf7 select.wpcf7-form-control:focus { padding-right: 44px; appearance: none; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23123f2d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center / 20px; }
.kt .wpcf7 input.wpcf7-form-control:not([type=submit]):not([type=radio]):focus, .kt .wpcf7 select.wpcf7-form-control:focus {
  border-color: var(--kt-sosna); outline: 3px solid var(--kt-fokus); outline-offset: 1px; }
/* pole z błędem (selektor silniejszy od reguł pól wyżej, inaczej ich ramka przykrywała błąd) */
.kt .wpcf7 input.wpcf7-form-control.wpcf7-not-valid:not([type=submit]):not([type=radio]),
.kt .wpcf7 input.wpcf7-form-control.wpcf7-not-valid:not([type=submit]):not([type=radio]):focus,
.kt .wpcf7 select.wpcf7-form-control.wpcf7-not-valid, .kt .wpcf7 select.wpcf7-form-control.wpcf7-not-valid:focus {
  border-color: var(--kt-blad); box-shadow: 0 0 0 1px var(--kt-blad); }
/* fokus na polu z błędem: obrys w kolorze błędu, zamiast brązowego nałożonego na czerwony */
.kt .wpcf7 input.wpcf7-form-control.wpcf7-not-valid:not([type=submit]):not([type=radio]):focus,
.kt .wpcf7 select.wpcf7-form-control.wpcf7-not-valid:focus { outline-color: var(--kt-blad); }
.kt .wpcf7-not-valid-tip { display: flex; align-items: flex-start; gap: 6px; margin-top: 7px; font-size: 14px; font-weight: 500; line-height: 1.35; color: var(--kt-blad); }
.kt .wpcf7-not-valid-tip::before { content: ""; flex: none; width: 16px; height: 16px; margin-top: 1px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b3261e' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.5v.5'/%3E%3C/svg%3E") no-repeat center / contain; }

/* Usługa: kafle wyboru (grupa radiowa, strzałki działają same). Igor 02.10: ikona usługi nad nazwą i kółko wyboru
   z boku, jak kropka filtrów podstrony realizacji; potem „troszeczkę mniejsze … pod konwersję, żeby klient jak najmniej
   musiał myśleć”: niższe kafle i sześć opcji, „Inna usługa” na końcu jako zwykły wybór (bez dodatkowej listy).
   Kółko i ikona są w CSS (::before, ::after), nie w znacznikach: Contact Form 7 buduje pola wyboru sam
   ([radio usluga use_label_element …]) i nie przyjmie dodatkowych elementów w etykiecie, więc ikona wynika z wartości
   opcji (reguły niżej; zmiana nazwy opcji = zmiana selektora). Kółko przy lewej krawędzi na wysokości ikony, nazwa
   pod spodem na całą szerokość kafla („Magazyn energii” i „Dofinansowanie” w jednej linii do 320 px). Wybrany kafel
   na sośnie jak filtry realizacji: kółko z białym obrysem i złotym środkiem, ikona złota. */
.kt-usluga { margin-top: 22px; }
.kt-usluga legend { margin-bottom: 8px; }
/* trzy kolumny od 760 px (dwa rzędy), węziej dwie (trzy rzędy) */
.kt .wpcf7-radio { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.kt .wpcf7-list-item { display: block; margin: 0; }
/* kafel: kółko | ikona | pusta kolumna tej samej szerokości (ikona na środku), nazwa w drugim rzędzie;
   --kt-kafel-x to boczny odstęp napisu (węższy na najwęższych telefonach) */
.kt .wpcf7-list-item label { --kt-kafel-x: 12px; position: relative; display: grid; grid-template-columns: 1fr auto 1fr; grid-template-areas: "kolko ikona ." "nazwa nazwa nazwa";
  align-items: center; align-content: center; row-gap: 4px; width: 100%; min-height: 68px; margin: 0; padding: 10px var(--kt-kafel-x); text-align: center;
  border: 1px solid var(--kt-obrys); border-radius: 12px; background: #fff; color: var(--kt-atrament); font-size: 15px; font-weight: 600; line-height: 1.2;
  cursor: pointer; user-select: none; touch-action: manipulation; transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms var(--kt-ease); }
.kt .wpcf7-list-item input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
/* kółko wyboru: obrys jako border (w trybie wysokiego kontrastu cienie znikają), zawsze 10 px od wewnętrznej krawędzi */
.kt .wpcf7-list-item label::before { content: ""; grid-area: kolko; justify-self: start; width: 16px; height: 16px; margin-left: calc(10px - var(--kt-kafel-x));
  border: 2px solid var(--kt-obrys); border-radius: 50%; pointer-events: none; transition: border-color 160ms ease, box-shadow 160ms ease; }
/* ikona usługi: maska z rysunku rodziny ikon realizacji (24 px, kreska ok. 1,8 px), kolor z tła */
.kt .wpcf7-list-item label::after { grid-area: ikona; width: 26px; height: 26px; background: var(--kt-sosna); pointer-events: none;
  -webkit-mask: var(--kt-ikona) center / contain no-repeat; mask: var(--kt-ikona) center / contain no-repeat; transition: background-color 160ms ease; }
/* ikona tylko przy znanej opcji: content i rysunek w regułach według wartości (opcja bez reguły albo przeglądarka bez
   :has() zostaje bez ikony zamiast pokazać pełny kwadrat tła) */
.kt .wpcf7-list-item label:has(input[value="Instalacja fotowoltaiczna"])::after, .kt .wpcf7-list-item label:has(input[value="Fotowoltaika"])::after { content: ""; --kt-ikona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12.5 7.5 4h10.5l-5 8.5z'/%3E%3Cpath d='M5 8.25h10.5M12.75 4l-5 8.5'/%3E%3Cpath d='M18 4l3.5 6v10H13v-7.5'/%3E%3Cpath d='M4 12.5V20h9'/%3E%3C/svg%3E"); }
.kt .wpcf7-list-item label:has(input[value="Pompa ciepła"])::after { content: ""; --kt-ikona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4.5' width='19' height='13' rx='2'/%3E%3Ccircle cx='9.5' cy='11' r='4.2'/%3E%3Cpath d='M9.5 8.2v5.6M6.7 11h5.6'/%3E%3Cpath d='M16.5 8h2M16.5 11h2M16.5 14h2'/%3E%3Cpath d='M6 17.5V20M18 17.5V20'/%3E%3C/svg%3E"); }
.kt .wpcf7-list-item label:has(input[value="Klimatyzacja"])::after { content: ""; --kt-ikona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='5' width='19' height='8' rx='2'/%3E%3Cpath d='M5.5 10h13'/%3E%3Cpath d='M8 16.5c0 1.2-1 1.6-1 2.8M12 16.5c0 1.2-1 1.6-1 2.8M16 16.5c0 1.2-1 1.6-1 2.8'/%3E%3C/svg%3E"); }
.kt .wpcf7-list-item label:has(input[value="Magazyn energii"])::after { content: ""; --kt-ikona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='7' width='17' height='10' rx='2'/%3E%3Cpath d='M21.5 10.5v3'/%3E%3Cpath d='m11.8 8.8-2.6 3.6h3.4l-2.6 3.6'/%3E%3C/svg%3E"); }
.kt .wpcf7-list-item label:has(input[value="Dofinansowanie"])::after { content: ""; --kt-ikona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3.5h8l4 4v13H6z'/%3E%3Cpath d='M14 3.5v4h4'/%3E%3Cpath d='m9.5 16.5 5-5'/%3E%3Ccircle cx='10' cy='12' r='.9'/%3E%3Ccircle cx='14' cy='16' r='.9'/%3E%3C/svg%3E"); }
.kt .wpcf7-list-item label:has(input[value="Inna usługa"])::after { content: ""; --kt-ikona: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M8 12h.01M12 12h.01M16 12h.01' stroke-width='2.6'/%3E%3C/svg%3E"); }
.kt .wpcf7-list-item-label { grid-area: nazwa; }
.kt .wpcf7-list-item label:has(input:checked) { border-color: var(--kt-sosna); background: var(--kt-sosna); color: #fff; }   /* bez zmiany grubości: wybór nie przesuwa rzędu */
.kt .wpcf7-list-item label:has(input:checked)::before { border-color: #fff; box-shadow: inset 0 0 0 3px var(--kt-sosna), inset 0 0 0 6px var(--kt-zloto-jasne); }
.kt .wpcf7-list-item label:has(input:checked)::after { background: var(--kt-zloto-jasne); }
.kt .wpcf7-list-item label:has(input:focus-visible) { outline: 3px solid var(--kt-fokus); outline-offset: 2px; }
.kt .wpcf7-list-item label:active { transform: scale(0.98); }
/* brak wyboru przy wysyłce: niewybrane kafle z czerwonym obrysem jak pola z błędem, komunikat pod nimi */
.kt .wpcf7-form-control-wrap[data-name="usluga"]:has(.wpcf7-not-valid-tip) .wpcf7-list-item label:not(:has(input:checked)),
.kt .wpcf7-form-control-wrap[data-name="usluga"]:has(.wpcf7-not-valid-tip) .wpcf7-list-item label:not(:has(input:checked))::before { border-color: var(--kt-blad); }
.kt .kt-usluga .wpcf7-not-valid-tip { flex-basis: 100%; }

/* Wysyłka: duży złoty przycisk jak „Bezpłatna wycena” w nagłówku; kręciołek w trakcie. */
/* strzałka przy prawej krawędzi, kręciołek przy lewej; wcięcie napisu rezerwuje ich miejsce i 8 px odstępu z obu stron */
.kt-wyslij-pas { position: relative; margin-top: 24px; --kt-strzalka-od: 22px; --kt-strzalka: 22px; }
.kt input[type="submit"].kt-wyslij, .kt input[type="submit"].kt-wyslij:hover, .kt input[type="submit"].kt-wyslij:focus {
  display: block; width: 100%; height: 60px; margin: 0; padding: 0 calc(var(--kt-strzalka-od) + var(--kt-strzalka) + 8px); border: 0; border-radius: 10px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5) inset, 0 12px 24px -16px rgba(0, 21, 15, 0.55);   /* promień jak przyciski usług, cień zielony */
  background: var(--kt-zloto) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23182e23' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") no-repeat right var(--kt-strzalka-od) center / var(--kt-strzalka);
  color: var(--kt-zloto-tekst); font: inherit; font-size: 18px; font-weight: 600; line-height: 1; letter-spacing: normal; text-transform: none;
  cursor: pointer; touch-action: manipulation; transition: background-color 160ms ease, transform 160ms var(--kt-ease); }
.kt input[type="submit"].kt-wyslij:active { transform: scale(0.985); }
/* motyw zdejmuje przyciskom obrys przy fokusie (input[type=submit]:focus { outline: 0 }); z klawiatury obrys wraca */
.kt .wpcf7 input[type="submit"].kt-wyslij:focus-visible { outline: 3px solid var(--kt-fokus); outline-offset: 3px; }
.kt .wpcf7-spinner { position: absolute; top: 50%; left: var(--kt-strzalka-od); width: 20px; height: 20px; margin: -10px 0 0; padding: 0; border: 2.5px solid rgba(24, 46, 35, 0.25);
  border-top-color: var(--kt-zloto-tekst); border-radius: 50%; background: none; opacity: 1; visibility: hidden; pointer-events: none; animation: kt-krec 0.8s linear infinite; }
.kt .wpcf7-spinner::before { content: none; }
.kt .submitting .wpcf7-spinner { visibility: visible; }
.kt .submitting input[type="submit"].kt-wyslij { opacity: 0.8; pointer-events: none; }
@keyframes kt-krec { to { transform: rotate(360deg); } }
.kt .wpcf7-response-output { display: none; }

/* Pod przyciskiem: bez zobowiązań i ocena w Google (dowód w miejscu decyzji), dalej zgoda drobnym drukiem. */
.kt-zaufanie { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 22px; margin-top: 16px; font-size: 14.5px; line-height: 1.2; color: #46564d; }
.kt-bez { display: inline-flex; align-items: center; gap: 7px; font-weight: 500; color: var(--kt-atrament); }
.kt-bez-ikona { display: grid; width: 20px; height: 20px; }
.kt-bez-ikona svg { width: 100%; height: 100%; fill: none; stroke: var(--kt-sosna); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
/* „220+ opinii” zawsze w jednej linii; na bardzo wąskim ekranie cały napis schodzi niżej zamiast łamać się w pół */
.kt-ocena { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.kt-ocena-opinie { white-space: nowrap; }
.kt-ocena img { display: block; width: 58px; height: auto; }
.kt-ocena-liczba { padding-left: 9px; border-left: 1px solid var(--kt-linia); font-size: 16px; font-weight: 700; color: var(--kt-atrament); }
.kt-gwiazdki { display: block; width: 76px; height: auto; fill: #fbbc04; }
.kt .kt-zgoda { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--kt-linia); font-size: 12.5px; line-height: 1.5; color: var(--kt-szary); }
.kt .kt-zgoda a, .kt .kt-zgoda a:hover, .kt .kt-zgoda a:focus, .kt .kt-zgoda a:visited { color: var(--kt-sosna); text-decoration: underline; text-underline-offset: 2px; }

/* Po wysłaniu: potwierdzenie w miejscu formularza (w karcie); błąd wysyłki z telefonem. */
.kt-dziekujemy { display: grid; justify-items: center; gap: 10px; padding-block: 12px; text-align: center; }
.kt-dziekujemy:focus { outline: none; }
.kt-dziekujemy-ikona { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; background: var(--kt-sosna); }
.kt-dziekujemy-ikona svg { width: 30px; height: 30px; fill: none; stroke: var(--kt-zloto-jasne); stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.kt .kt-dziekujemy-tytul { font-size: 28px; font-weight: 600; line-height: 1.25; color: var(--kt-sosna); }
.kt .kt-dziekujemy-tekst { font-size: 17px; line-height: 1.5; color: var(--kt-atrament); }
.kt-blad-wysylki { margin-top: 14px; padding: 12px 14px; border-radius: 8px; background: #fdeceb; color: #7a1c14; font-size: 15px; line-height: 1.45; }
.kt a.kt-tel-link, .kt a.kt-tel-link:hover, .kt a.kt-tel-link:focus, .kt a.kt-tel-link:visited { color: var(--kt-sosna); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.kt .kt-blad-wysylki a.kt-tel-link, .kt .kt-blad-wysylki a.kt-tel-link:hover, .kt .kt-blad-wysylki a.kt-tel-link:focus { color: #7a1c14; }

/* ---------- Telefon pod kartą (na zieleni) ---------- */
.kt-alternatywa { display: flex; justify-content: center; margin-top: 28px; }
.kt a.kt-telefon, .kt a.kt-telefon:hover, .kt a.kt-telefon:focus, .kt a.kt-telefon:visited {
  display: inline-flex; align-items: center; gap: 14px; min-height: 60px; padding: 8px 22px 8px 8px; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 999px;
  background: rgba(255, 255, 255, 0.06); color: #fff; text-decoration: none; transition: background-color 160ms ease, border-color 160ms ease; }
.kt-telefon-ikona { display: grid; flex: none; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--kt-zloto); }
.kt-telefon-ikona svg { width: 20px; height: 20px; fill: none; stroke: var(--kt-zloto-tekst); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.kt-telefon-tekst { display: grid; gap: 2px; }
.kt-telefon-podpis { font-size: 13.5px; font-weight: 500; line-height: 1.2; color: rgba(255, 255, 255, 0.8); }
.kt-telefon-numer { font-size: 23px; font-weight: 600; line-height: 1.15; letter-spacing: 0.01em; }
.kt a.kt-telefon:active { transform: scale(0.98); }

@media (hover: hover) and (pointer: fine) {
  .kt input[type="submit"].kt-wyslij:hover { background-color: var(--kt-zloto-2); }
  .kt .wpcf7-list-item label:not(:has(input:checked)):hover { border-color: var(--kt-sosna); background: var(--kt-szalwia); }
  .kt .wpcf7-list-item label:not(:has(input:checked)):hover::before { border-color: var(--kt-sosna); }
  .kt a.kt-telefon:hover { border-color: rgba(255, 255, 255, 0.5); background: rgba(255, 255, 255, 0.12); }
}

/* Węziej niż 760 px usługi w dwóch kolumnach (ostatnia, „Inna usługa”, na całą szerokość). */
@media (max-width: 759px) {
  .kt .wpcf7-radio { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kt .wpcf7-list-item label { --kt-kafel-x: 10px; min-height: 64px; padding: 9px var(--kt-kafel-x); }
  .kt .wpcf7-list-item label::after { width: 24px; height: 24px; }
}
/* Telefon: karta prawie na całą szerokość, pola jedno pod drugim. */
@media (max-width: 699px) {
  .kt-wew { width: min(720px, 100% - 24px); }
  .kt .kt-h2, .kt .kt-lead { padding-inline: 4px; }
  .kt-karta { padding: 22px 16px 20px; border-radius: 16px; }
  .kt-pola { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .kt-telefon-numer { font-size: 22px; }
}
/* Najwęższe telefony: „Magazyn energii” w jednej linii przycisku (przy 360 px łamał się na dwie, a przy 320 px
   jeszcze przy 14 px; napis potrzebuje ok. 117 px przy 14 px i 113 px przy 13,5 px). */
@media (max-width: 374px) {
  .kt .wpcf7-list-item label { --kt-kafel-x: 6px; font-size: 14px; }
  /* 320 px: napis przycisku dotykał strzałki, a „220+ opinii” łamało się na dwie linie */
  .kt-wyslij-pas { --kt-strzalka-od: 16px; --kt-strzalka: 20px; }
  .kt-ocena { gap: 6px; }
  .kt-ocena img { width: 52px; }
  .kt-ocena-liczba { padding-left: 7px; }
  .kt-gwiazdki { width: 68px; }
}
@media (max-width: 339px) {
  .kt .wpcf7-list-item label { --kt-kafel-x: 4px; font-size: 13.5px; }
}

/* Tryb wysokiego kontrastu (Windows): tła i cienie znikają, a pole wyboru jest niewidoczne, więc wybór pokazuje
   kolor systemowy Highlight w obrysie kafla i w kółku. */
@media (forced-colors: active) {
  .kt .wpcf7-list-item label::before { border-color: CanvasText; }
  .kt .wpcf7-list-item label::after { forced-color-adjust: none; background: CanvasText; }
  .kt .wpcf7-list-item label:has(input:checked) { border-color: Highlight; }
  .kt .wpcf7-list-item label:has(input:checked)::before { forced-color-adjust: none; border-color: Highlight; background: Canvas;
    box-shadow: inset 0 0 0 3px Canvas, inset 0 0 0 6px Highlight; }
  .kt .wpcf7-list-item label:has(input:checked)::after { background: Highlight; }
}

@media (prefers-reduced-motion: reduce) {
  .kt .wpcf7 input.wpcf7-form-control:not([type=submit]):not([type=radio]), .kt .wpcf7 select.wpcf7-form-control, .kt .wpcf7-list-item label, .kt .wpcf7-list-item label::before, .kt .wpcf7-list-item label::after,
  .kt input[type="submit"].kt-wyslij, .kt a.kt-telefon { transition: none; }
  .kt .wpcf7-spinner { animation-duration: 2.4s; }
}
