.ks-konf {
	/* Znacznik wersji — diagnostyka odczytuje go, żeby od razu było widać,
	   czy na serwerze leży aktualny plik CSS, czy stara kopia z cache/FTP. */
	--ks-wersja: 7;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--ks-odstep-5);
	align-items: start;
	container-type: inline-size;
}

@container (min-width: 720px) {
	.ks-konf {
		grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	}
}

/* Fallback dla przeglądarek bez container queries i dla Elementora */
@media (min-width: 900px) {
	.ks-konf {
		grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	}
}

/* ---------- lewa kolumna: pola wprost na tle sekcji ---------- */

.ks-konf__pola {
	display: flex;
	flex-direction: column;
	gap: var(--ks-odstep-5);
	min-width: 0;
}

.ks-konf__produkt {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ks-odstep-2);
	margin-top: var(--ks-odstep-3);
}

.ks-widget .ks-konf__tab {
	border: 2px solid var(--ks-linia-mocna);
	border-radius: var(--ks-promien-2);
	background: var(--ks-biel);
	color: var(--ks-tekst-2);
	font: inherit;
	font-size: 14px;
	font-weight: 700;
	padding: 10px 14px;
	cursor: pointer;
}

.ks-widget .ks-konf__tab[aria-pressed="true"] {
	background: var(--ks-granat);
	border-color: var(--ks-granat);
	color: var(--ks-biel);
}

.ks-konf__grupa + .ks-konf__grupa {
	margin-top: 0;
}

.ks-konf__rzad {
	display: flex;
	flex-wrap: wrap;
	gap: 18px 26px;
	margin-top: var(--ks-odstep-3);
}

.ks-konf__pole {
	min-width: 0;
}

.ks-konf__pole > label,
.ks-konf__pole-etykieta {
	display: block;
	font-size: 13.5px;
	font-weight: 700;
	color: var(--ks-tekst-2);
	margin-bottom: var(--ks-odstep-1);
}

/* Licznik jako jedna zwarta pigułka */
.ks-konf__licznik {
	display: flex;
	align-items: center;
	width: var(--ks-kontrolka-w);
	height: var(--ks-kontrolka-h);
	background: var(--ks-biel);
	border: 1.5px solid rgba(11, 27, 51, 0.16);
	border-radius: var(--ks-promien-2);
	overflow: hidden;
}

.ks-widget .ks-konf__krok {
	width: 34px;
	height: 100%;
	flex: 0 0 34px;
	border: 0;
	background: none;
	/* Reset motywu nadrzędnego daje przyciskom padding .5em 1em. Nie
	   deklarując paddingu, przepuszczaliśmy go dalej — a że elementy flex
	   mają min-width:auto, treść z tym paddingiem rozpychała przycisk
	   do 38px zamiast 34px. */
	padding: 0;
	font: inherit;
	font-size: 19px;
	font-weight: 700;
	color: var(--ks-tekst);
	cursor: pointer;
}

.ks-widget .ks-konf__krok[disabled] {
	opacity: 0.35;
	cursor: default;
}

.ks-konf__wartosc {
	flex: 1;
	text-align: center;
	white-space: nowrap;
}

.ks-konf__wartosc b {
	font-size: 21px;
	font-weight: 700;
}

.ks-konf__wartosc span {
	font-size: 11.5px;
	font-weight: 500;
	color: var(--ks-tekst-3);
	margin-left: 3px;
}

.ks-konf__kwota {
	display: flex;
	align-items: center;
	width: var(--ks-kontrolka-w);
	height: var(--ks-kontrolka-h);
	background: var(--ks-biel);
	border: 1.5px solid rgba(11, 27, 51, 0.16);
	border-radius: var(--ks-promien-2);
	overflow: hidden;
}

.ks-konf__kwota input {
	flex: 1;
	min-width: 0;
	height: 100%;
	border: 0;
	background: none;
	font: inherit;
	font-size: 17px;
	font-weight: 700;
	color: var(--ks-tekst);
	padding: 0 4px 0 12px;
}

.ks-konf__kwota span {
	font-size: 13px;
	color: var(--ks-tekst-3);
	padding-right: 12px;
}

.ks-konf__limit {
	margin-top: var(--ks-odstep-2);
	font-size: 13px;
	font-weight: 700;
	color: var(--ks-bursztyn-tekst);
}

.ks-konf__limit[hidden] {
	display: none;
}

/* ---------- prawa kolumna: jeden zrośnięty blok ---------- */

.ks-konf__wynik {
	border-radius: var(--ks-promien-4);
	overflow: hidden;
	min-width: 0;
}

.ks-konf__wynik-gora {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	background: var(--ks-granat);
}

@container (min-width: 420px) {
	.ks-konf__wynik-gora {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.ks-konf__kafel {
	padding: var(--ks-odstep-4);
}

.ks-konf__kafel + .ks-konf__kafel {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

@container (min-width: 420px) {
	.ks-konf__kafel + .ks-konf__kafel {
		border-top: 0;
		border-left: 1px solid rgba(255, 255, 255, 0.12);
	}
}

.ks-konf__kafel dt {
	font-size: 13.5px;
	font-weight: 700;
	color: #B9C3D2;
	margin: 0;
}

.ks-konf__kafel dd {
	margin: var(--ks-odstep-1) 0 0;
}

.ks-konf__kafel dd b {
	display: block;
	font-size: clamp(30px, 8cqi, 44px);
	font-weight: 700;
	line-height: 1.05;
	color: var(--ks-bursztyn);
	white-space: nowrap;
}

.ks-konf__kafel dd small {
	display: block;
	font-size: 13px;
	color: #93A3B8;
	margin-top: 4px;
}

.ks-konf__wynik-dol {
	background: var(--ks-bursztyn);
	color: var(--ks-granat);
	padding: clamp(20px, 5cqi, 34px);
}

.ks-konf__wynik-dol h3 {
	margin: 0;
	font-size: 15px;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ks-konf__nadwyzka {
	font-size: clamp(28px, 11cqi, 60px);
	font-weight: 700;
	line-height: 1.02;
	margin-top: var(--ks-odstep-2);
	white-space: nowrap;
}

.ks-konf__rozbicie {
	font-size: 15px;
	line-height: 1.55;
	margin: var(--ks-odstep-3) 0 0;
	max-width: 460px;
}

/* Elementy WYŁĄCZNIE mobilne: nagłówek zwijanej karty, pole wpisywania
   w liczniku i przyklejony blok wyniku. Na desktopie nie istnieją wizualnie —
   ich układ opisuje media ≤767px na dole pliku. */
.ks-konf__glowa,
.ks-konf__wpis,
.ks-konf__mob {
	display: none;
}

.ks-konf__cta {
	display: inline-block;
	margin-top: var(--ks-odstep-4);
	background: var(--ks-czerwony);
	color: var(--ks-biel);
	text-decoration: none;
	font-weight: 700;
	font-size: 16.5px;
	padding: 16px 24px;
	border-radius: var(--ks-promien-2);
}

.ks-konf__cta:hover,
.ks-konf__cta:focus {
	background: var(--ks-czerwony-ciemny);
	color: var(--ks-biel);
}

.ks-konf__przypis {
	font-size: 13px;
	line-height: 1.5;
	margin: var(--ks-odstep-4) 0 0;
	color: #6B5310;
	max-width: 460px;
}

.ks-konf__komunikat {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.45;
	margin-top: var(--ks-odstep-2);
}

.ks-konf__komunikat[hidden],
.ks-konf__nadwyzka[hidden],
.ks-konf__rozbicie[hidden] {
	display: none;
}

/* ============================================================
   MOBILE (≤767px)

   Cały układ telefonu żyje w tym jednym bloku. Poza nim nie ma ani
   jednej reguły dotyczącej wersji mobilnej — dzięki temu desktop da się
   sprawdzić diffem: powyżej tej linii plik jest nietknięty poza
   zamianą .ks-konf__pasek na .ks-konf__glowa/.ks-konf__wpis/.ks-konf__mob
   (trzy elementy, których na desktopie po prostu nie ma).

   Kompozycja: nagłówek → segmentowany przełącznik formatu → trzy zwijane
   karty (akordeon) → przyklejony blok wyniku. Każde pole to jeden wiersz
   „etykieta ↔ kontrolka", więc sekcja z jedną otwartą kartą mieści się
   w jednym ekranie i kwota reaguje bez przewijania.
   ============================================================ */
@media (max-width: 767px) {

	/* --- Pusta przestrzeń pod sekcją -----------------------------------
	   Źródłem jest min-height ustawione w Elementorze na kontenerze sekcji
	   (u nas: kontener niosący tło, nad którym stoi widżet). Dwie pułapki:

	   1. Hierarchia ma wrapper .elementor-shortcode
	      (.elementor-element > .elementor-widget-container > .elementor-shortcode
	      > .ks-widget.ks-konf), więc selektory z ">" nie trafiają — stąd :has().
	   2. Kontenery .e-con NIE biorą wysokości z min-height wprost, tylko ze
	      zmiennej: `min-height: var(--min-height)`. Nadpisanie samego min-height
	      nic nie daje, dopóki zmienna trzyma starą wartość — zerujemy oba.

	   :has() zawęża regułę wyłącznie do opakowań tego konfiguratora, a całość
	   siedzi w media query — na desktopie ustawienie z Elementora zostaje. */
	.e-con:has( .ks-konf ),
	.elementor-shortcode:has( .ks-konf ),
	.elementor-widget-container:has( .ks-konf ),
	.elementor-widget-shortcode:has( .ks-konf ) {
		/* !important MUSI stać także przy zmiennych. Elementor pisze je
		   selektorem .elementor-NNN .elementor-element.elementor-element-XXX,
		   czyli (0,3,0) — więcej niż nasze (0,2,0). Bez !important zmienna
		   zachowuje starą wartość i całe zerowanie jest bezskuteczne. */
		--min-height: 0px !important;
		--height: auto !important;
		min-height: 0 !important;
		height: auto !important;
	}

	/* Drugi mechanizm dający ten sam efekt: dolny padding kontenera z tłem,
	   ustawiony pod układ desktopowy. Nie zerujemy go — to legalny odstęp
	   sekcji — tylko PRZYCINAMY: rozsądne wartości zostają nietknięte
	   (24px → 24px), a te z desktopu przestają robić dziurę (600px → 48px). */
	.e-con:has( > .elementor-widget-shortcode .ks-konf ) {
		padding-block-end: min( var( --padding-block-end, 0px ), 48px ) !important;
	}

	/* Sam widżet nigdy nie trzyma wysokości z układu dwukolumnowego. */
	.ks-konf {
		min-height: 0;
		height: auto;
		/* Dwoje dzieci: pola i przyklejony wynik. Odstęp między nimi daje
		   margin-top wyniku, nie gap — inaczej sumowałyby się. */
		gap: 0;
	}

	/* .ks-konf ma WŁASNĄ deklarację container-type na górze tego pliku,
	   a ks-konfigurator.css ładuje się PO ks-tokens.css — reguła z tokenów
	   nie miała jak jej przebić. Wyłączamy kontener również tutaj.
	   Powód w komentarzu przy .ks-widget w ks-tokens.css. */
	.ks-konf {
		container-type: normal;
	}

	/* --- Nagłówek sekcji ------------------------------------------------
	   .ks-sekcja__* mieszka w ks-tokens.css i obsługuje TAKŻE cennik,
	   dlatego zawężamy regułę przez :has() do sekcji z konfiguratorem.
	   Bez kontenerów zapytań jednostki cqi liczyłyby się od okna — stąd
	   wprost vw. */
	.ks-sekcja:has( .ks-konf ) .ks-sekcja__naglowek {
		margin-bottom: 20px;
	}

	.ks-sekcja:has( .ks-konf ) .ks-sekcja__etykieta {
		margin-bottom: 10px;
		font-size: 11px;
		letter-spacing: 0.12em;
	}

	.ks-sekcja:has( .ks-konf ) .ks-sekcja__tytul {
		font-size: clamp( 26px, 7vw, 32px );
		line-height: 1.15;
	}

	/* Etykiety grup ("FORMAT", "RODZICE"…) zastępuje na telefonie nagłówek
	   karty — ta sama informacja, ale klikalna i z kwotą po prawej. */
	.ks-konf .ks-etykieta-grupy {
		display: none;
	}

	.ks-konf__pola {
		gap: 10px;
		/* Wynik jest sticky, czyli zajmuje własne miejsce w przepływie —
		   rezerwa pod dawny pasek fixed nie jest już do niczego potrzebna. */
		padding-bottom: 0;
	}

	/* Format stoi wyżej niż karty, więc dostaje własny, większy odstęp. */
	.ks-konf__grupa:first-child {
		margin-bottom: 8px;
	}

	/* --- FORMAT: segmentowany przełącznik -------------------------------
	   Cały wygląd niesie wspólny komponent .ks-segment z ks-tokens.css —
	   ten sam, którego używa cennik w sekcji 08. Tutaj zostaje wyłącznie
	   to, co dotyczy TEGO widżetu: wyzerowanie marginesu, który na
	   desktopie odsuwa przełącznik od etykiety grupy (a etykiety na
	   telefonie nie ma). */
	.ks-konf__produkt {
		margin-top: 0;
	}

	/* --- Karta strumienia ----------------------------------------------- */
	.ks-konf__grupa--karta {
		background: var(--ks-biel);
		border: 1px solid #E8E8EC;
		border-radius: 16px;
		overflow: hidden;
	}

	.ks-widget .ks-konf__glowa {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		width: 100%;
		min-height: 56px;
		padding: 0 16px;
		border: 0;
		background: none;
		font: inherit;
		color: inherit;
		text-align: left;
		cursor: pointer;
	}

	.ks-widget .ks-konf__glowa:focus-visible {
		outline-offset: -2px;
	}

	.ks-konf__glowa-nazwa {
		font-size: 15px;
		font-weight: 800;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		color: var(--ks-granat);
	}

	.ks-konf__glowa-prawa {
		display: flex;
		align-items: center;
		gap: 10px;
		flex: 0 0 auto;
	}

	/* Kwota zmienia się także przy karcie ZWINIĘTEJ — po to jest ten układ:
	   zwinięta karta ma mówić "to źródło wnosi tyle pieniędzy". */
	.ks-konf__glowa-suma {
		font-size: 17px;
		font-weight: 800;
		color: var(--ks-bursztyn);
		white-space: nowrap;
	}

	.ks-konf__chevron {
		flex: 0 0 16px;
		width: 16px;
		height: 16px;
		color: #8A8A94;
		transition: transform 0.22s ease;
	}

	.ks-konf__grupa--otwarta .ks-konf__chevron {
		transform: rotate( 180deg );
	}

	/* Animujemy grid-template-rows 0fr → 1fr, a nie max-height: wysokość
	   liczy się z realnej treści, więc nie ma ani skoku, ani zgadywanej
	   wartości granicznej. */
	.ks-konf__cialo {
		display: grid;
		grid-template-rows: 0fr;
		transition: grid-template-rows 0.22s ease;
	}

	.ks-konf__grupa--otwarta .ks-konf__cialo {
		grid-template-rows: 1fr;
	}

	.ks-konf__cialo-in {
		/* min-height:0 jest konieczne: bez niego automatyczny rozmiar
		   minimalny elementu siatki nie pozwala wierszowi zejść do zera. */
		min-height: 0;
		overflow: hidden;
		/* visibility zabiera zwinięte pola z kolejności TAB i z drzewa
		   dostępności — inaczej fokus wpadałby w niewidoczne inputy.
		   Opóźnienie równe czasowi animacji, żeby treść nie znikała
		   w trakcie zwijania. Robi to CSS, nie JS: na desktopie ta reguła
		   nie istnieje, więc pola nigdy nie zostaną tam ukryte. */
		visibility: hidden;
		transition: visibility 0s linear 0.22s;
	}

	.ks-konf__grupa--otwarta .ks-konf__cialo-in {
		visibility: visible;
		transition: visibility 0s;
	}

	/* --- Wiersz pola: etykieta ↔ kontrolka, jeden poziom ----------------- */
	.ks-konf__rzad {
		display: block;
		margin: 0;
		padding: 4px 16px 16px;
	}

	.ks-konf__pole {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: 12px;
		min-height: 48px;
	}

	.ks-konf__pole + .ks-konf__pole {
		border-top: 1px solid #F2F2F4;
	}

	.ks-konf__pole > label,
	.ks-konf__pole-etykieta {
		margin-bottom: 0;
		font-size: 14px;
		font-weight: 600;
		line-height: 1.25;
		color: #55555F;
	}

	.ks-konf__limit {
		margin: 0;
		padding: 0 16px 16px;
	}

	/* --- Stepper --------------------------------------------------------- */
	.ks-konf__licznik {
		display: grid;
		grid-template-columns: 40px 1fr 40px;
		align-items: center;
		flex: 0 0 118px;
		width: 118px;
		height: 40px;
		margin-top: 0;
		border: 0;
		border-radius: 12px;
		background: #F4F4F6;
		/* Pole wartości wystaje 2px poza pigułkę, żeby dobić do 44px
		   celu dotykowego — nie może być przycięte. */
		overflow: visible;
	}

	.ks-widget .ks-konf__krok {
		position: relative;
		flex-basis: auto;
		width: 40px;
		height: 40px;
		border-radius: 12px;
		background: none;
		font-size: 18px;
		font-weight: 700;
		color: var(--ks-granat);
	}

	/* Pigułka ma 40px wysokości z projektu, ale palec potrzebuje 44px.
	   Powiększamy sam obszar trafienia, nie rysunek. */
	.ks-widget .ks-konf__krok::after {
		content: "";
		position: absolute;
		inset: -2px;
	}

	.ks-widget .ks-konf__krok:active {
		transform: scale( 0.92 );
	}

	.ks-widget .ks-konf__krok[disabled] {
		opacity: 0.3;
	}

	/* Jednostka ("grup", "osób") wraca do etykiety wiersza — w kontrolce
	   zjadałaby miejsce potrzebne na cyfry. Na telefonie pokazujemy
	   edytowalny input zamiast statycznej liczby. */
	.ks-konf__wartosc {
		min-width: 0;
	}

	.ks-konf__wartosc b,
	.ks-konf__wartosc > span {
		display: none;
	}

	/* SELEKTOR MUSI BYĆ TAK DŁUGI.
	   Motyw nadrzędny stylizuje pola przez `input[type="text"]`, czyli
	   (0,1,1) — więcej niż sama klasa (0,1,0). Przy krótkim selektorze
	   input dostawał tło, ramkę i PADDING motywu; na 38px szerokości
	   kontrolki padding zjadał całe pole na cyfrę i wartość znikała
	   (widać było tylko ścięty pasek). Elementor bywa jeszcze bardziej
	   szczegółowy, więc schodzimy do (0,3,0) zamiast walczyć !importantem.
	   To ten sam mechanizm co przy `[type="button"]` i .ks-konf__krok. */
	.ks-widget .ks-konf__licznik .ks-konf__wpis {
		display: block;
		width: 100%;
		/* 44px celu dotykowego przy 40px pigułce; tło przezroczyste,
		   więc nadmiar jest niewidoczny. */
		height: 44px;
		min-height: 0;
		max-width: none;
		margin: -2px 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: none;
		box-shadow: none;
		font: inherit;
		/* 17px, nie 15px: poniżej 16px iOS przybliża całą stronę przy
		   wejściu w pole i układ się rozjeżdża. */
		font-size: 17px;
		font-weight: 800;
		line-height: 1;
		text-align: center;
		text-indent: 0;
		color: var(--ks-granat);
		font-variant-numeric: tabular-nums;
		appearance: none;
		-webkit-appearance: none;
	}

	/* --- Pole ceny -------------------------------------------------------- */
	.ks-konf__kwota {
		position: relative;
		display: block;
		flex: 0 0 100px;
		width: 100px;
		height: 40px;
		margin-top: 0;
		border: 0;
		border-radius: 12px;
		background: #F4F4F6;
		overflow: visible;
	}

	/* Ta sama walka o specyficzność co przy .ks-konf__wpis wyżej:
	   `input[type="number"]` z motywu to (0,1,1), czyli REMIS z krótkim
	   `.ks-konf__kwota input` — a remis rozstrzyga kolejność ładowania,
	   której nie kontrolujemy (Elementor dokłada swoje arkusze po naszych).
	   Prefiks widżetu daje (0,2,1) i zdejmuje ten hazard. */
	.ks-widget .ks-konf__kwota input {
		width: 100%;
		height: 44px;
		min-height: 0;
		max-width: none;
		margin: -2px 0;
		padding: 0 28px 0 10px;
		border: 0;
		border-radius: 0;
		background: none;
		box-shadow: none;
		font: inherit;
		font-size: 17px;
		font-weight: 800;
		line-height: 1;
		text-align: right;
		text-indent: 0;
		color: var(--ks-granat);
		font-variant-numeric: tabular-nums;
		appearance: textfield;
		-moz-appearance: textfield;
	}

	.ks-widget .ks-konf__kwota input::-webkit-outer-spin-button,
	.ks-widget .ks-konf__kwota input::-webkit-inner-spin-button {
		-webkit-appearance: none;
		margin: 0;
	}

	.ks-konf__kwota span {
		position: absolute;
		top: 50%;
		right: 10px;
		transform: translateY( -50% );
		padding: 0;
		font-size: 13px;
		font-weight: 600;
		color: #8A8A94;
		pointer-events: none;
	}

	/* --- Wynik ------------------------------------------------------------
	   Pełny panel wyników to układ desktopowy — na telefonie zastępuje go
	   jeden przyklejony blok. sticky, nie fixed: kiedy sekcja wyjedzie
	   z ekranu, blok znika sam, bez żadnego JS. */
	.ks-konf__wynik {
		display: none;
	}

	.ks-konf__mob {
		position: sticky;
		/* --ks-klawiatura ustawia JS na wysokość obszaru zasłoniętego przez
		   klawiaturę systemową (0px, gdy jej nie ma). Bez tego blok stałby
		   przy dolnej krawędzi UKŁADU strony, czyli pod klawiaturą — a to
		   właśnie w trakcie wpisywania kwota ma być widoczna. */
		bottom: calc( 12px + env( safe-area-inset-bottom, 0px ) + var( --ks-klawiatura, 0px ) );
		z-index: 5;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 14px;
		margin-top: 16px;
		padding: 14px 16px;
		border-radius: 18px;
		background: var(--ks-granat);
		box-shadow: 0 8px 24px rgba( 16, 22, 45, 0.18 );
	}

	.ks-konf__mob-tekst {
		min-width: 0;
	}

	.ks-konf__mob p {
		margin: 0;
	}

	/* #8A8A94 na granacie daje 5,05:1 — powyżej progu 4.5:1. */
	.ks-konf__mob-kicker {
		font-size: 11px;
		font-weight: 700;
		letter-spacing: 0.12em;
		text-transform: uppercase;
		color: #8A8A94;
	}

	/* Bursztyn na granacie: 8,2:1. */
	.ks-konf__mob-kwota {
		margin-top: 2px !important;
		font-size: 32px;
		font-weight: 800;
		line-height: 1.05;
		letter-spacing: -0.02em;
		color: var(--ks-bursztyn);
		white-space: nowrap;
	}

	.ks-konf__mob-meta {
		margin-top: 4px !important;
		font-size: 11px;
		font-weight: 600;
		line-height: 1.35;
		color: #8A8A94;
	}

	/* Gdy rachunek się nie spina, ten sam wiersz niesie ostrzeżenie zamiast
	   nakładu — musi wyglądać inaczej niż przypis. Bez nowego koloru:
	   biel z palety na granacie, 15,9:1. */
	.ks-konf__mob-meta--alarm {
		font-weight: 700;
		color: var(--ks-biel);
	}

	.ks-konf__mob-meta[hidden] {
		display: none;
	}

	/* Jedyna czerwień w sekcji. min-height zamiast height, bo etykieta CTA
	   pochodzi z pricing.php i bywa dwuwierszowa — cel dotykowy ma zostać
	   co najmniej 44px, a nie zostać przycięty. */
	.ks-konf__mob-cta {
		display: flex;
		align-items: center;
		justify-content: center;
		flex: 0 0 auto;
		max-width: 46%;
		min-height: 44px;
		padding: 0 14px;
		border-radius: 12px;
		background: var(--ks-czerwony);
		color: var(--ks-biel);
		font-size: 14px;
		font-weight: 700;
		line-height: 1.15;
		text-align: center;
		text-decoration: none;
	}

	.ks-konf__mob-cta:hover,
	.ks-konf__mob-cta:focus {
		background: var(--ks-czerwony-ciemny);
		color: var(--ks-biel);
	}

	@media (prefers-reduced-motion: reduce) {

		.ks-konf__cialo,
		.ks-konf__chevron,
		.ks-widget .ks-konf__tab {
			transition: none;
		}
	}

	/* Hamburger (.ks-mm-przycisk) to position:fixed z z-index 100001 w prawym
	   górnym rogu. Przyklejony wynik stoi na z-index 5 w obrębie sekcji,
	   więc nie ma z nim żadnej rywalizacji — w przeciwieństwie do dawnego
	   paska fixed, który musiał trzymać z-index 900. */
}
