/*
Theme Name: HomeFix Child
Description: Lekki motyw potomny GeneratePress dla HomeFix — wyłącznie warstwa prezentacji (style, template parts, wzorce bloków). Bez logiki biznesowej, CPT ani integracji.
Template: generatepress
Version: 0.4.0
Text Domain: homefix-child
*/

/* ==========================================================================
   HOMEFIX VISUAL WOW (Premium Intervention + Premium Technical), portowane
   z mockups/homefix-visual-wow-mockup-v1.html (zatwierdzony kierunek
   wizualny) na realne klasy motywu. `overflow-x: hidden` na body to
   zabezpieczenie dla techniki "full-bleed box-shadow" użytej w Hero i
   Dlaczego HomeFix (patrz te sekcje niżej) — pozwala sekcji na pełną
   szerokość viewportu bez zmiany struktury bloków (bez alignfull), bez
   ryzyka poziomego scrolla.
   ========================================================================== */
body {
	overflow-x: hidden;
}

/* Scroll-reveal utility — klasy nadawane WYŁĄCZNIE przez
   assets/js/motion.js (patrz docblock tego pliku dla uzasadnienia
   progressive enhancement: bez JS/z prefers-reduced-motion żaden
   element nigdy nie dostaje `.homefix-reveal`, więc nic nie zostaje
   trwale ukryte). */
.homefix-reveal {
	opacity: 0;
	transform: translateY( 22px );
	transition: opacity 600ms ease, transform 600ms ease;
}

.homefix-reveal.is-visible {
	opacity: 1;
	transform: none;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-reveal {
		opacity: 1;
		transform: none;
		transition: none;
	}
}

/* ==========================================================================
   HOMEFIX WOW MOTION PASS (2026-09-19) — jeden, spójny system czasów i
   krzywych dla WSZYSTKICH nowych efektów dodanych w tej turze (Hero
   status sequence, Journey completed/active/upcoming, Before/After
   scroll-scrub, Selector card motifs, HomeCare storytelling, Final CTA
   brand moment). NIE nadpisuje żadnej z ok. 146 istniejących reguł
   `160ms ease` (mikro-interakcje UI) ani ustalonej krzywej
   `cubic-bezier(0.22, 0.7, 0.2, 1)` już używanej przez Hero wipe reveal
   i Before/After curtain (`--hf-ease` poniżej to dosłownie ta sama
   krzywa, nazwana raz, żeby nowe reguły jawnie się do niej odwoływały
   zamiast wpisywać ją ponownie ad-hoc) — WYŁĄCZNIE rozszerza istniejący,
   już spójny system o nazwane tokeny dla nowych efektów.

   `--hf-ease` = premium reveal ("ease-out", bez bounce) — brief §7.
   `--hf-dur-ui` / `--hf-dur-ui-slow` = warstwa UI (250-600ms, brief §7).
   `--hf-dur-story` = warstwa storytelling (800-1400ms, brief §7).

   Każdy nowy efekt ma odpowiadający blok `@media (prefers-reduced-motion:
   reduce)` UMIESZCZONY PRZY SWOIM KOMPONENCIE — ten sam wzorzec co 14
   już istniejących bloków w tym pliku (belt-and-suspenders: JS w ogóle
   nie dodaje klas włączających ruch pod reduced-motion, a CSS
   dodatkowo neutralizuje transition/animation na wszelki wypadek), nie
   jeden skonsolidowany blok globalny — konsekwentnie z resztą pliku.
   ========================================================================== */
:root {
	--hf-ease: cubic-bezier( 0.22, 0.7, 0.2, 1 );
	--hf-dur-ui: 350ms;
	--hf-dur-ui-slow: 550ms;
	--hf-dur-story: 1100ms;
}

/* ==========================================================================
   FIX KONTRASTU (ETAP 16A) — dostępny wariant Stone.
   Audyt ETAPU 16 wykazał: Stone (#8A8272) na Background (#F4F2EA) daje
   ~3.4:1, poniżej WCAG AA (4.5:1) dla tekstu normalnej wielkości. Ten
   token NIE zmienia zamrożonej palety w theme.json (Stone tam zostaje
   bez zmian, używany gdzie indziej np. jako placeholder-stripe) — to
   świadomie ciemniejszy wariant tego samego odcienia (ta sama barwa/
   nasycenie HSL, obniżona jasność: L 49.4% → 38%), używany WYŁĄCZNIE
   tam, gdzie Stone pełni rolę czytanego tekstu (małe etykiety "eyebrow"
   i placeholdery), nie dekoracji. Realnie policzony kontrast nowej
   wartości (#6A6458) na Background: ~5.24:1 — PASS WCAG AA.
   ========================================================================== */
:root {
	--homefix-stone-accessible: #6A6458;
}

/* ==========================================================================
   HomeFix Header — komponent nagłówka.
   Konsumuje wyłącznie zamrożone tokeny z theme.json (--wp--preset--*,
   --wp--custom--*) — nie definiuje żadnych nowych kolorów/rozmiarów.
   ========================================================================== */

.homefix-header {
	background-color: var( --wp--preset--color--petrol );
	color: var( --wp--preset--color--background );
	position: sticky;
	top: 0;
	z-index: 100;
	border-bottom: 1px solid transparent;
	transition: box-shadow 200ms ease, border-color 200ms ease;
}

.homefix-header.is-scrolled {
	border-bottom-color: rgba( 244, 242, 234, 0.14 );
	box-shadow: 0 4px 16px rgba( 0, 0, 0, 0.12 );
}

.homefix-header__inner {
	max-width: 1280px;
	margin-inline: auto;
	padding: 14px 24px;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 24px;
	font-family: var( --wp--preset--font-family--body );
}

.homefix-header__brand a {
	/* Tymczasowy wordmark tekstowy — do zastąpienia realnym logo. */
	color: var( --wp--preset--color--background );
	text-decoration: none;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 20px;
	letter-spacing: -0.01em;
}

.homefix-header__nav {
	margin-inline-start: auto;
}

.homefix-header__menu {
	display: flex;
	align-items: center;
	gap: 28px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 15px;
	font-weight: 500;
}

.homefix-header__menu a {
	color: var( --wp--preset--color--background );
	text-decoration: none;
	opacity: 0.82;
	padding: 10px 2px;
	display: inline-block;
}

.homefix-header__menu a:hover,
.homefix-header__menu a:focus-visible {
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* Active states — .current-menu-item/-parent/-ancestor to natywne
   klasy WordPressa (wp_nav_menu() dolicza je same, porównując bieżące
   zapytanie z celem linku) — zero dodatkowego kodu do ich wykrywania. */
.homefix-header__menu .current-menu-item > a,
.homefix-header__menu .current-menu-parent > a,
.homefix-header__menu .current-menu-ancestor > a,
.homefix-header__menu .current-menu-parent > .homefix-header__menu-trigger,
.homefix-header__menu .current-menu-ancestor > .homefix-header__menu-trigger {
	opacity: 1;
}

.homefix-header__actions {
	display: flex;
	align-items: center;
	gap: 12px;
}

/* Header primary CTA — reużywa .homefix-cta-seam__btn (patrz "HomeFix CTA
   System" niżej w tym pliku), tylko mniejszy wariant dopasowany do wysokości
   headera, tym samym wzorcem co .homefix-selector__panel-cta poniżej. */
.homefix-header__cta .homefix-cta-seam__btn {
	font-size: 13.5px;
	padding: 10px 16px;
	gap: 6px;
}

.homefix-header__cta .homefix-cta-seam__badge {
	font-size: 8.5px;
	padding: 2px 6px;
	top: -7px;
	right: -6px;
}

.homefix-btn {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 15px;
	border-radius: var( --wp--custom--radius--button, 9px );
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var( --wp--custom--tap-target-min, 44px );
	padding-inline: 22px;
	transition: background-color 160ms ease, transform 160ms ease;
}

.homefix-btn--primary {
	background-color: var( --wp--preset--color--background );
	color: var( --wp--preset--color--petrol );
}

.homefix-btn--primary:hover {
	background-color: var( --wp--preset--color--surface-alt );
	transform: translateY( -1px );
}

/* CLEANUP (ETAP 15A): usunięto .homefix-header .homefix-btn--primary
   :focus-visible (bardziej specyficzny wariant dla przycisku wewnątrz
   headera) razem z .homefix-header__cta/-full/-short (mobile) — ich
   jedyny konsument, przycisk "Zamów fachowca" z href="#", został
   usunięty z header.php (martwy link, URL BLOCKED, patrz docblock
   PHP). .homefix-btn / .homefix-btn--primary poniżej ZOSTAJĄ — to
   celowo reużywalny, udokumentowany komponent (patrz block-patterns.php:
   Hero, Final CTA), gotowy do podpięcia z powrotem po potwierdzeniu
   URL-a zgłoszenia. */
.homefix-btn--primary:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
	background-color: var( --wp--preset--color--surface-alt );
}

.homefix-header__toggle {
	display: none;
	background: transparent;
	border: none;
	color: var( --wp--preset--color--background );
	width: var( --wp--custom--tap-target-min, 44px );
	height: var( --wp--custom--tap-target-min, 44px );
	align-items: center;
	justify-content: center;
	position: relative;
	cursor: pointer;
	padding: 0;
}

.homefix-header__toggle-bar,
.homefix-header__toggle-bar::before,
.homefix-header__toggle-bar::after {
	content: "";
	display: block;
	width: 22px;
	height: 2px;
	background-color: currentColor;
	transition: transform 200ms ease, opacity 200ms ease, background-color 200ms ease;
}

.homefix-header__toggle-bar::before {
	position: absolute;
	transform: translateY( -7px );
}

.homefix-header__toggle-bar::after {
	position: absolute;
	transform: translateY( 7px );
}

.homefix-header[data-menu-open="true"] .homefix-header__toggle-bar {
	background-color: transparent;
}

.homefix-header[data-menu-open="true"] .homefix-header__toggle-bar::before {
	transform: rotate( 45deg );
}

.homefix-header[data-menu-open="true"] .homefix-header__toggle-bar::after {
	transform: rotate( -45deg );
}

.homefix-header a:focus-visible,
.homefix-header button:focus-visible {
	outline: 2px solid var( --wp--preset--color--background );
	outline-offset: 2px;
}

/* ==========================================================================
   Dropdown "Usługi" (HOMEFIX NAVIGATION & FOOTER V1, 2026-09-08;
   trigger zamieniony na <button> 2026-09-08 — zero href="#" w finalnym
   chrome). Klasy `.menu-item-has-children` / `.sub-menu` pochodzą z
   domyślnego Walker_Nav_Menu WordPressa (depth=2 w header.php) — nie są
   ręcznie dopisywane w HTML. Widoczność na desktopie: :hover (czysty
   CSS, mysz) LUB klasa .is-open (header.js — klik/Enter/Space na
   triggerze ORAZ zwykłe wejście fokusem/Tab w dowolny element
   wewnątrz, przez focusin/focusout). Świadomie BEZ :focus-within w
   CSS — Escape musi oddać fokus na trigger (wymóg dostępności), a
   trigger sam jest wewnątrz .menu-item-has-children, więc
   :focus-within nigdy by się nie "wyłączył" (patrz uzasadnienie w
   header.js). Trigger to prawdziwy `<button type="button">` (patrz
   functions.php, filtr walker_nav_menu_start_el) — semantyczny
   disclosure trigger, nie fałszywy link.
   ========================================================================== */
.homefix-header__menu .menu-item-has-children {
	position: relative;
}

.homefix-header__menu-trigger {
	appearance: none;
	background: transparent;
	border: none;
	margin: 0;
	cursor: pointer;
	font: inherit;
	font-family: inherit;
	color: var( --wp--preset--color--background );
	text-decoration: none;
	opacity: 0.82;
	padding: 10px 2px;
	display: inline-flex;
	align-items: center;
}

.homefix-header__menu-trigger:hover,
.homefix-header__menu-trigger:focus-visible {
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 4px;
}

.homefix-header__menu-trigger::after {
	content: "";
	display: inline-block;
	width: 6px;
	height: 6px;
	margin-inline-start: 6px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate( 45deg ) translateY( -2px );
	opacity: 0.7;
}

.homefix-header__menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	margin: 4px 0 0;
	padding: 8px;
	list-style: none;
	background-color: var( --wp--preset--color--background );
	border-radius: var( --wp--custom--radius--card, 16px );
	box-shadow: 0 12px 32px rgba( 0, 0, 0, 0.18 );
	opacity: 0;
	visibility: hidden;
	transform: translateY( -4px );
	transition: opacity 160ms ease, transform 160ms ease, visibility 0s linear 160ms;
	z-index: 10;
}

.homefix-header__menu .sub-menu a {
	color: var( --wp--preset--color--ink );
	opacity: 1;
	padding: 10px 12px;
	border-radius: var( --wp--custom--radius--button, 9px );
	min-height: var( --wp--custom--tap-target-min, 44px );
	display: flex;
	align-items: center;
	white-space: nowrap;
}

.homefix-header__menu .sub-menu a:hover,
.homefix-header__menu .sub-menu a:focus-visible {
	background-color: var( --wp--preset--color--surface-alt );
	text-decoration: none;
	opacity: 1;
}

.homefix-header__menu .sub-menu a:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: -2px;
}

.homefix-header__menu .menu-item-has-children:hover > .sub-menu,
.homefix-header__menu .menu-item-has-children.is-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY( 0 );
	transition: opacity 160ms ease, transform 160ms ease, visibility 0s linear 0s;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-header,
	.homefix-header__nav,
	.homefix-header__toggle-bar,
	.homefix-header__toggle-bar::before,
	.homefix-header__toggle-bar::after,
	.homefix-header__menu .sub-menu,
	.homefix-btn {
		transition: none;
	}
}

@media ( max-width: 780px ) {
	.homefix-header__inner {
		padding: 10px 16px;
		gap: 12px;
		flex-wrap: wrap;
	}

	.homefix-header__brand {
		order: 1;
	}

	.homefix-header__actions {
		order: 2;
		margin-inline-start: auto;
	}

	.homefix-header__cta {
		display: none;
	}

	.homefix-header__nav {
		order: 3;
		flex-basis: 100%;
		margin-inline-start: 0;
		max-height: 0;
		overflow: hidden;
		visibility: hidden;
		transition: max-height 220ms ease, visibility 0s linear 220ms;
	}

	/* visibility:hidden usuwa zwinięte linki menu z kolejności tabulacji —
	   bez tego klawiatura wchodziłaby w niewidoczne linki przed CTA. */
	.homefix-header[data-menu-open="true"] .homefix-header__nav {
		max-height: 320px;
		visibility: visible;
		transition: max-height 220ms ease, visibility 0s linear 0s;
	}

	.homefix-header__menu {
		flex-direction: column;
		align-items: flex-start;
		gap: 2px;
		padding: 8px 0 16px;
	}

	.homefix-header__menu a {
		width: 100%;
		min-height: var( --wp--custom--tap-target-min, 44px );
		display: flex;
		align-items: center;
	}

	.homefix-header__toggle {
		display: inline-flex;
	}

	/* Mobile: podmenu "Usługi" jest ZAWSZE widoczne (nie disclosure) —
	   celowo najprostsze, gwarantowanie dostępne rozwiązanie: brak
	   zagnieżdżonego toggle'a w hamburgerze, wszystkie 4 kategorie są
	   zawsze osiągalne bez dodatkowej interakcji. Trigger "Usługi"
	   staje się wizualnie/interaktywnie etykietą sekcji (pointer-events:
	   none — nadal focusowalny klawiaturą jako <button>, ale bez efektu
	   dotyku/kliknięcia, bo i tak nic pod nim nie ma sensownego landing
	   page'a — wszystkie 4 kategorie są już i tak widoczne poniżej). */
	.homefix-header__menu-trigger {
		pointer-events: none;
		opacity: 0.68;
	}

	.homefix-header__menu-trigger::after {
		display: none;
	}

	.homefix-header__menu .sub-menu {
		position: static;
		display: block;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		background: transparent;
		margin: 0 0 4px;
		padding: 0 0 0 16px;
	}

	.homefix-header__menu .sub-menu a {
		color: var( --wp--preset--color--background );
	}

	.homefix-header__menu .sub-menu a:hover,
	.homefix-header__menu .sub-menu a:focus-visible {
		background-color: rgba( 244, 242, 234, 0.12 );
	}
}

/* FIX (audyt ETAP 16): reguła [data-menu-open="true"] powyżej jest
   bardziej specyficzna (0,3,0) niż `.homefix-header__nav{transition:none}`
   w bloku prefers-reduced-motion (0,1,0), więc ta druga nigdy nie
   wygrywała — otwarcie menu nadal animowało się przy włączonym reduced
   motion. Reguła o dopasowanej specyficzności, żeby faktycznie wygrała. */
@media ( prefers-reduced-motion: reduce ) and ( max-width: 780px ) {
	.homefix-header[data-menu-open="true"] .homefix-header__nav {
		transition: none;
	}
}

/* ==========================================================================
   HomeFix Hero — V3.1 PRODUCTION CANDIDATE (2026-09-10).
   Przebudowane z dwukolumnowego układu (copy | media) na jednolitą,
   pełnoekranową kompozycję (zdjęcie full-bleed w tle + gradient +
   treść), zgodnie z zatwierdzonym mockupem V3.1. Markup: natywny
   core/group (nie core/columns) — patrz docblock w block-patterns.php.
   Konsumuje wyłącznie zamrożone tokeny z theme.json.
   ========================================================================== */

.homefix-hero {
	position: relative;
	overflow: hidden;
	min-height: 78vh;
	display: flex;
	align-items: flex-end;
	margin: 0;
	padding: 0;
}

/* FIX (znaleziony w realnej przeglądarce na 375px, nie zgadywany):
   GeneratePress dokłada domyślny `.site-main{margin-top}` +
   `.inside-article{padding-top}` (responsywnie różne wartości,
   razem 50px na mobile w tym teście) — dla zwykłej, przewijanej
   treści to poprawny, celowy odstęp pod sticky headerem, ale Hero to
   pełnoekranowy komponent liczony z `min-height` względem viewportu:
   każdy dodatkowy odstęp NAD nim przesuwa też jego DÓŁ, powodując
   realny overflow poza viewport na małych ekranach (potwierdzone:
   dół Hero lądował 63px poza dołem viewportu 812px, telefon w CTA
   nachodził na sticky bar). Zero tego odstępu WYŁĄCZNIE na stronie,
   która faktycznie renderuje Hero jako pierwszy blok (`:has()`,
   wsparcie przeglądarek jak w Priority Selector) — inne strony
   (usługi, Care, O HomeFix) zachowują domyślny odstęp GeneratePress
   bez zmian. */
.site-main:has( .homefix-hero ) {
	margin-top: 0;
}

.inside-article:has( > .entry-content > .homefix-hero:first-child ) {
	padding-top: 0;
}

.homefix-hero__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.homefix-hero__picture,
.homefix-hero__picture img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.homefix-hero__picture img {
	object-fit: cover;
	object-position: 62% 55%;
}

.homefix-hero__media.is-loading .homefix-hero__picture img {
	clip-path: inset( 0 0 0 100% );
	transition: clip-path 1000ms cubic-bezier( 0.22, 0.7, 0.2, 1 );
}

.homefix-hero__media.is-revealed .homefix-hero__picture img {
	clip-path: inset( 0 0 0 0% );
}

.homefix-hero__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient( 100deg, rgba( 18, 20, 15, 0.92 ) 0%, rgba( 18, 20, 15, 0.78 ) 34%, rgba( 18, 20, 15, 0.32 ) 60%, rgba( 18, 20, 15, 0.08 ) 78% );
}

.homefix-hero__content {
	position: relative;
	z-index: 1;
	max-width: 1280px;
	margin-inline: auto;
	padding: 120px 24px 56px;
	width: 100%;
}

.homefix-hero__eyebrow {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 16px;
}

.homefix-hero__heading {
	font-family: var( --wp--preset--font-family--display );
	font-size: 50px;
	line-height: 1.06;
	font-weight: 700;
	color: #fff;
	max-width: 15ch;
	margin: 0 0 18px;
}

.homefix-hero__rotate {
	color: var( --wp--preset--color--brass );
	display: inline-block;
	transition: opacity 220ms ease;
}

.homefix-hero__support {
	font-size: 16px;
	line-height: 1.6;
	color: rgba( 244, 242, 234, 0.78 );
	max-width: 44ch;
	margin: 0 0 28px;
}

.homefix-hero__ctas {
	margin: 0;
}

/* FIX (znaleziony w realnej przeglądarce na 375px, nie zgadywany):
   ten link nadal niesie natywne klasy bloku Gutenberg
   (.wp-block-button__link.wp-element-button) z poprzedniej wersji
   (HOMEFIX VISUAL WOW), która celowo stylowała telefon jako
   dominujący przycisk Brass. V3.1 odwraca hierarchię (primary =
   .homefix-cta-seam, telefon = zwykły podkreślony link) — ale bez
   jawnego resetu ten link po prostu dziedziczył domyślny globalny
   styl WordPressa dla `.wp-element-button` (ciemne tło, padding,
   zaokrąglenie) zamiast wyglądać jak tekst, co na mobile renderowało
   się jako nieforemna, zawijająca się na 2 linie "pigułka". Pełny
   reset do zwykłego tekstu — ten sam wygląd co `.homefix-secondary-call`
   (Priority/Payment), świadomie zduplikowany selektor zamiast wspólnej
   klasy, bo ten element wciąż żyje wewnątrz `wp:button` (inne DOM
   otoczenie niż zwykły `<a>` w Priority/Payment). */
.homefix-hero__secondary.wp-block-button .wp-block-button__link {
	background: none;
	color: #fff;
	font-family: inherit;
	font-weight: 700;
	font-size: 14.5px;
	padding: 0;
	min-height: 0;
	border-radius: 0;
	text-decoration: underline;
	text-underline-offset: 3px;
	display: inline-flex;
	align-items: center;
}

.homefix-hero__secondary.wp-block-button .wp-block-button__link:hover,
.homefix-hero__secondary.wp-block-button .wp-block-button__link:focus-visible {
	background: none;
	transform: none;
}

.homefix-hero__starter {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 26px;
	padding-top: 22px;
	border-top: 1px solid rgba( 244, 242, 234, 0.16 );
}

.homefix-hero__starter-label {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: rgba( 244, 242, 234, 0.78 );
	margin-right: 2px;
}

.homefix-hero__starter-chip {
	font-size: 12.5px;
	font-weight: 600;
	color: #fff;
	background: rgba( 244, 242, 234, 0.1 );
	border: 1px solid rgba( 244, 242, 234, 0.22 );
	padding: 7px 13px;
	border-radius: 999px;
	text-decoration: none;
	transition: background 160ms ease, border-color 160ms ease;
	display: inline-flex;
	align-items: center;
	min-height: 32px;
}

.homefix-hero__starter-chip:hover,
.homefix-hero__starter-chip:focus-visible {
	background: rgba( 244, 242, 234, 0.2 );
	border-color: rgba( 244, 242, 234, 0.4 );
}

.homefix-hero__starter-chip--more {
	color: var( --wp--preset--color--brass );
	border-color: transparent;
	background: none;
	font-weight: 700;
}

/* ---------- Hero — konceptualna sekwencja statusu (WOW MOTION PASS,
   2026-09-19), "sygnaturowy moment" strony. Pływająca karta w jasnej,
   mało zakrytej gradientem części zdjęcia Hero (prawa strona — patrz
   `.homefix-hero__media::after`) pokazuje krótki, konceptualny cykl:
   nazwa problemu → Zgłoszone → Fachowiec przypisany → Realizacja →
   Rozwiązane, po czym płynnie przechodzi do kolejnego przykładu.
   Świadomie `aria-hidden="true"` w całości (patrz markup w
   block-patterns.php) — to ilustracja modelu działania, NIE realne,
   aktualne zgłoszenie ani dana na żywo; ukrycie przed czytnikami
   ekranu zapobiega dokładnie takiemu myleniu. Cykl sterowany przez
   `initHeroStatusSequence()` (homepage-interactions.js) — bez JS/z
   `prefers-reduced-motion` karta pokazuje wyłącznie pierwszy,
   statyczny przykład (zero cyklu), patrz globalny blok reduced-motion
   niżej w tej sekcji. ---------- */
.homefix-hero__status {
	position: absolute;
	top: 96px;
	right: 40px;
	width: 258px;
	padding: 18px 20px;
	background: rgba( 18, 20, 15, 0.42 );
	backdrop-filter: blur( 14px );
	-webkit-backdrop-filter: blur( 14px );
	border: 1px solid rgba( 244, 242, 234, 0.16 );
	border-radius: var( --wp--custom--radius--card, 16px );
	box-shadow: 0 24px 48px -20px rgba( 0, 0, 0, 0.5 );
	z-index: 1;
}

.homefix-hero__status-eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 10px;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: rgba( 244, 242, 234, 0.55 );
	margin: 0 0 8px;
}

.homefix-hero__status-problem {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 16px;
	color: #fff;
	margin: 0 0 16px;
	transition: opacity var( --hf-dur-ui ) var( --hf-ease );
	min-height: 1.3em;
}

.homefix-hero__status.is-swapping .homefix-hero__status-problem {
	opacity: 0;
}

.homefix-hero__status-track {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.homefix-hero__status-step {
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	color: rgba( 244, 242, 234, 0.45 );
	transition: color var( --hf-dur-ui ) var( --hf-ease );
}

.homefix-hero__status-step::before {
	content: "";
	flex-shrink: 0;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: rgba( 244, 242, 234, 0.3 );
	transition: background-color var( --hf-dur-ui ) var( --hf-ease ), transform var( --hf-dur-ui ) var( --hf-ease ), box-shadow var( --hf-dur-ui ) var( --hf-ease );
}

.homefix-hero__status-step.is-done {
	color: rgba( 244, 242, 234, 0.85 );
}

.homefix-hero__status-step.is-done::before {
	background: var( --wp--preset--color--brass );
}

.homefix-hero__status-step.is-current {
	color: #fff;
}

.homefix-hero__status-step.is-current::before {
	background: var( --wp--preset--color--brass );
	transform: scale( 1.35 );
	box-shadow: 0 0 0 4px rgba( 137, 92, 37, 0.28 );
}

@media ( max-width: 980px ) {
	.homefix-hero {
		min-height: 92vh;
	}

	.homefix-hero__content {
		padding: 100px 20px 40px;
	}

	.homefix-hero__heading {
		font-size: 34px;
		max-width: none;
	}

	.homefix-hero__picture img {
		object-position: 60% 60%;
	}

	/* FIX (WOW MOTION PASS — korekta zgłoszona przez właściciela na
	   żywej stronie, 2026-09-19): przy realnej wysokości Hero na
	   telefonie/tablecie (92vh, treść dosunięta do dołu) karta statusu
	   pozycjonowana top-right kolidowała bezpośrednio z nagłówkiem H1 —
	   nachodziła na tekst zamiast siedzieć w "pustej" górnej strefie
	   zdjęcia, którą Hero ma tylko na szerokim desktopie. Zamiast dalej
	   dostrajać pozycję/rozmiar (ryzyko kolejnej kolizji na innej
	   wysokości ekranu), karta jest tu w całości ukryta — sygnaturowy
	   moment zostaje efektem WYŁĄCZNIE desktopowym, zgodnie z zasadą
	   "Hero motion prostszy na mobile" (brief §9): telefon dostaje
	   czyste zdjęcie + tekst + CTA, zero ryzyka nachodzenia. */
	.homefix-hero__status {
		display: none;
	}
}

@media ( max-width: 600px ) {
	/* Chipy "Szybki start" znikają na małych telefonach: te same
	   kategorie są jeden scroll niżej w Selectorze, a usunięcie tego
	   rzędu utrzymuje hero czytelnym w pierwszym ekranie zamiast
	   kolidować ze sticky CTA zarezerwowanym na dole viewportu
	   (potwierdzony błąd znaleziony i naprawiony w realnej przeglądarce
	   podczas tury mockupu V3.1). */
	.homefix-hero__starter {
		display: none;
	}

	.homefix-hero__content {
		padding-bottom: 92px;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-hero__media.is-loading .homefix-hero__picture img,
	.homefix-hero__media.is-revealed .homefix-hero__picture img {
		clip-path: inset( 0 0 0 0% );
		transition: none;
	}

	.homefix-hero__rotate {
		transition: none;
	}

	/* initHeroStatusSequence() bails entirely pod reduced-motion (patrz
	   homepage-interactions.js), więc karta nigdy nie dostaje
	   `.is-swapping`/kolejnych `.is-done`/`.is-current` po pierwszym,
	   statycznym przykładzie z markupu — ten blok to wyłącznie druga
	   linia obrony (transition:none), gdyby coś inne kiedyś dotknęło tych
	   klas. */
	.homefix-hero__status-problem,
	.homefix-hero__status-step,
	.homefix-hero__status-step::before {
		transition: none;
	}
}

/* ==========================================================================
   HomeFix Czym jest HomeFix (Compare) — V3.1 PRODUCTION CANDIDATE
   (2026-09-10). Przebudowane z jednego akapitu na edytorskie
   porównanie 2 kolumn (Tradycyjnie / Z HomeFix) — białe zaokrąglone
   karty świadomie pominięte (powtarzalny wzorzec "feature card grid"),
   czysta typografia rozdzielona jedną pionową linią. Konsumuje
   wyłącznie zamrożone tokeny z theme.json.
   ========================================================================== */

.homefix-what-is-section {
	max-width: 1280px;
	margin: 0 auto;
	padding: 72px 24px;
	background: var( --wp--preset--color--background );
}

.homefix-what-is__head {
	max-width: 680px;
	margin: 0 auto 40px;
	text-align: center;
}

.homefix-what-is__eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 12px;
}

.homefix-what-is__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0;
}

.homefix-compare.wp-block-columns {
	max-width: 920px;
	margin-inline: auto;
	gap: 0;
	align-items: start;
}

.homefix-compare__col {
	padding: 0 32px;
}

.homefix-compare__col--trad {
	opacity: 0.6;
	border-right: 1px solid var( --wp--preset--color--surface-alt );
}

.homefix-compare__col-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin: 0 0 22px;
	color: var( --homefix-stone-accessible );
}

.homefix-compare__col--home .homefix-compare__col-title {
	color: var( --wp--preset--color--brass );
}

.homefix-compare__steps {
	list-style: none;
	margin: 0;
	padding: 0;
}

.homefix-compare__steps li {
	padding: 12px 0;
	border-top: 1px solid var( --wp--preset--color--surface-alt );
	font-family: var( --wp--preset--font-family--display );
	font-size: 17px;
	font-weight: 500;
	line-height: 1.35;
	color: var( --wp--preset--color--ink );
}

.homefix-compare__col--home .homefix-compare__steps li {
	font-size: 22px;
	font-weight: 600;
	color: var( --wp--preset--color--petrol );
}

@media ( max-width: 780px ) {
	.homefix-compare.wp-block-columns {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.homefix-compare__col--trad {
		border-right: none;
		border-bottom: 1px solid var( --wp--preset--color--surface-alt );
		padding-bottom: 24px;
	}
}

@media ( max-width: 780px ) {
	.homefix-what-is-section {
		padding: 56px 20px;
	}

	.homefix-what-is__title {
		font-size: 26px;
	}
}
/* ==========================================================================
   HomeFix Jak działa (Journey) — V3.1 PRODUCTION CANDIDATE (2026-09-10).
   Przebudowane z poziomej siatki 4 kolumn na pionową ścieżkę z linią
   postępu — treść 4 kroków bez zmian (patrz docblock w
   block-patterns.php), wyłącznie nowa prezentacja. Tło Ink — razem z
   Priority Selector i Payment Journey tworzy ciągły "dark system"
   beat w rytmie strony. Konsumuje wyłącznie zamrożone tokeny z
   theme.json.
   ========================================================================== */

.homefix-journey-section {
	position: relative;
	z-index: 0;
	max-width: 1280px;
	margin-inline: auto;
	padding: 72px 24px;
}

.homefix-journey-section::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX( -50% );
	background-color: var( --wp--preset--color--ink );
	z-index: -1;
}

.homefix-journey-section .homefix-steps__title {
	max-width: 760px;
	margin: 0 auto 12px;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: #fff;
	text-align: center;
}

.homefix-journey-section .homefix-steps__intro {
	max-width: 560px;
	margin: 0 auto 48px;
	font-size: 15.5px;
	line-height: 1.6;
	color: rgba( 244, 242, 234, 0.78 );
	text-align: center;
}

.homefix-journey__track {
	max-width: 620px;
	margin: 0 auto;
	position: relative;
	padding-left: 28px;
}

.homefix-journey__line {
	position: absolute;
	left: 9px;
	top: 6px;
	bottom: 6px;
	width: 2px;
	background: rgba( 244, 242, 234, 0.15 );
}

.homefix-journey__line-fill {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 0%;
	background: var( --wp--preset--color--brass );
	transition: height 200ms linear;
}

.homefix-journey__step {
	position: relative;
	padding: 0 0 34px 20px;
}

.homefix-journey__step:last-child {
	padding-bottom: 0;
}

.homefix-journey__dot {
	position: absolute;
	left: -28px;
	top: 2px;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: var( --wp--preset--color--ink );
	border: 2px solid rgba( 244, 242, 234, 0.3 );
	transition: border-color var( --hf-dur-ui ) var( --hf-ease ), background-color var( --hf-dur-ui ) var( --hf-ease ), box-shadow var( --hf-dur-ui ) var( --hf-ease );
}

/* WOW MOTION PASS (2026-09-19) — 3 stany zamiast 1: ukończony (Brass +
   ptaszek, bez poświaty — "zamknięty" temat), aktywny (Brass + miękka
   poświata — "tu jesteś teraz"), nadchodzący (domyślny, przygaszony).
   Wcześniej `.is-active` obejmował TAKŻE wszystkie poprzednie kroki
   (identyczny wygląd bieżącego i ukończonych) — teraz jawnie rozróżnione,
   zgodnie z briefem: "poprzednie kroki oznaczają się jako zakończone". */
.homefix-journey__step.is-complete .homefix-journey__dot,
.homefix-journey__step.is-active .homefix-journey__dot {
	border-color: var( --wp--preset--color--brass );
	background: var( --wp--preset--color--brass );
}

.homefix-journey__step.is-active .homefix-journey__dot {
	box-shadow: 0 0 0 4px rgba( 137, 92, 37, 0.24 );
}

.homefix-journey__step.is-complete .homefix-journey__dot::after {
	content: "";
	position: absolute;
	top: 5px;
	left: 4px;
	width: 9px;
	height: 5px;
	border-left: 2px solid var( --wp--preset--color--ink );
	border-bottom: 2px solid var( --wp--preset--color--ink );
	transform: rotate( -45deg );
	opacity: 0.85;
}

.homefix-journey__step h3 {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 17px;
	color: rgba( 244, 242, 234, 0.55 );
	margin: 0 0 6px;
	transition: color var( --hf-dur-ui ) var( --hf-ease );
}

.homefix-journey__step.is-complete h3,
.homefix-journey__step.is-active h3 {
	color: #fff;
}

.homefix-journey__step p {
	font-size: 14px;
	line-height: 1.55;
	color: rgba( 244, 242, 234, 0.78 );
	margin: 0;
	transition: opacity var( --hf-dur-ui ) var( --hf-ease ), transform var( --hf-dur-ui ) var( --hf-ease );
}

/* Krok "zaraz nadejdzie" — lekkie wejście, nie ma stać w miejscu
   identycznie jak reszta nadchodzących kroków (brief §2: "następny
   krok lekko wchodzi"). Świadomie WYŁĄCZNIE opacity/transform (zero
   CLS — element już zajmuje swoje miejsce w layoucie). */
.homefix-journey__step.is-next-up p {
	opacity: 0.92;
	transform: translateX( 2px );
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-journey__line-fill,
	.homefix-journey__dot,
	.homefix-journey__step h3,
	.homefix-journey__step p {
		transition: none;
	}
}

@media ( max-width: 780px ) {
	.homefix-journey-section {
		padding: 56px 20px;
	}

	.homefix-journey-section .homefix-steps__title {
		font-size: 26px;
	}
}

/* ==========================================================================
   HomeFix Dlaczego HomeFix — 3 przewagi + zdjęcie kontekstowe.
   Litera zamiast numeru (zbiór argumentów, nie sekwencja) i inny rytm
   siatki niż Usługi/Jak działa, żeby uniknąć efektu powtarzalnego
   "4 ikony + slogan" szablonu SaaS.

   UKŁAD ZMIENIONY (HOMEFIX VISUAL SYSTEM V1, 2026-09-06): z jednej
   pełnej szerokości (H2 + 3 kolumny A-C obok siebie) na dwukolumnowy
   układ spójny z Hero — tekst (H2 + 3 punkty, teraz UŁOŻONE PIONOWO)
   po lewej, zdjęcie po prawej. `.homefix-why.wp-block-columns` to
   teraz zewnętrzny wiersz (jak `.homefix-hero.wp-block-columns`), nie
   wewnętrzny rząd 3 punktów jak wcześniej.
   ========================================================================== */

/* WOW (2026-09-10): sekcja przechodzi z jasnego tła (Background) na
   pełnowymiarowe tło Ink (#1B2420), zero zmian struktury bloku. To
   świadoma zmiana kontrastu istniejącej sekcji (nie nowa treść) —
   realizuje wprost brief Part 2.4 ("convert to full Ink dark
   background section"). Wszystkie kolory tekstu w tej sekcji przełączone
   na jasne warianty (Background/Brass), żeby zachować kontrast na
   ciemnym tle.

   FIX (2026-09-10, po wdrożeniu): jak w Hero — box-shadow 100vmax
   zastąpiony pseudo-elementem ::before ograniczonym do top/bottom tej
   sekcji, żeby tło Ink nie zasłaniało sekcji sąsiednich w pionie
   (potwierdzony błąd na żywej stronie: Ink zasłaniał dół Hero). */
.homefix-why.wp-block-columns {
	position: relative;
	z-index: 0;
	max-width: 1280px;
	margin-inline: auto;
	padding: 72px 24px;
	gap: 56px;
	align-items: center;
}

.homefix-why.wp-block-columns::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX( -50% );
	background-color: var( --wp--preset--color--ink );
	z-index: -1;
}

.homefix-why__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 34px;
	line-height: 1.15;
	color: var( --wp--preset--color--background );
	margin: 0 0 32px;
	max-width: 14ch;
}

.homefix-why__item {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 20px 0;
	margin-bottom: 0;
	border-top: 1px solid rgba( 244, 242, 234, 0.14 );
}

.homefix-why__item:last-child {
	border-bottom: 1px solid rgba( 244, 242, 234, 0.14 );
}

.homefix-why__letter {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	/* WOW (2026-09-10): na Ink tle litera przełączona z Petrol (nieczytelny
	   na ciemnym tle) na Brass, pełna nieprzezroczystość — Brass na Ink
	   ma znacznie wyższy kontrast niż poprzednia kombinacja Petrol/
	   Background wymagała, więc obniżanie opacity (poprzedni FIX ETAP 16)
	   nie jest tu już potrzebne. */
	color: var( --wp--preset--color--brass );
	opacity: 1;
	margin: 0;
}

.homefix-why__item-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 17px;
	line-height: 1.3;
	color: var( --wp--preset--color--background );
	margin: 0;
}

.homefix-why__item-desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--background );
	opacity: 0.78;
	margin: 0;
}

.homefix-why__media {
	position: relative;
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	aspect-ratio: 16 / 9;
}

.homefix-why__picture,
.homefix-why__picture img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media ( max-width: 780px ) {
	.homefix-why.wp-block-columns {
		padding: 40px 16px 48px;
		gap: 24px;
		flex-wrap: wrap;
	}

	/* WordPress ustawia flex-basis jako inline style na kolumnie —
	   trzeba !important, żeby go nadpisać na mobile (ta sama zasada co
	   Hero). */
	.homefix-why__copy,
	.homefix-why__media {
		flex-basis: 100% !important;
	}

	.homefix-why__title {
		font-size: 25px;
		margin-bottom: 24px;
	}

	.homefix-why__media {
		aspect-ratio: 4 / 5;
	}
}

/* ==========================================================================
   HomeFix Priority Selector — Standard / Express / Pilna interwencja.
   V3.1 PRODUCTION CANDIDATE (2026-09-10). Działa w 100% bez JS: 3
   natywne radio (ukryte wizualnie, nie z display:none) + label jako
   przyciski + przełączanie treści/paska postępu/pigułki wyłącznie
   selektorem CSS `:checked ~ …` (patrz docblock w block-patterns.php).
   Tło Ink — razem z Journey i Payment Journey tworzy ciągły "dark
   system" beat. Konsumuje wyłącznie zamrożone tokeny z theme.json.
   ========================================================================== */

.homefix-priority-section {
	position: relative;
	z-index: 0;
	max-width: 1280px;
	margin-inline: auto;
	padding: 72px 24px;
	text-align: center;
}

.homefix-priority-section::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX( -50% );
	background-color: var( --wp--preset--color--ink );
	z-index: -1;
}

.homefix-priority__head {
	max-width: 640px;
	margin: 0 auto 32px;
}

.homefix-priority__eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 12px;
}

.homefix-priority__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: #fff;
	margin: 0;
}

.homefix-priority__transparency {
	max-width: 640px;
	margin: 0 auto 28px;
	text-align: center;
}

.homefix-priority__transparency-main {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.5;
	color: #fff;
	margin: 0 0 6px;
}

.homefix-priority__transparency-sub {
	font-size: 13.5px;
	line-height: 1.5;
	color: rgba( 244, 242, 234, 0.75 );
	margin: 0;
}

.homefix-priority__control {
	position: relative;
	max-width: 640px;
	margin: 0 auto 4px;
	background: rgba( 244, 242, 234, 0.06 );
	border: 1px solid rgba( 244, 242, 234, 0.14 );
	border-radius: 999px;
	padding: 6px;
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 4px;
}

.homefix-priority__radio {
	/* Visually hidden, still focusable/keyboard-operable — standard
	   "sr-only but interactive" pattern, not display:none. */
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
	border: 0;
}

.homefix-priority__option {
	position: relative;
	z-index: 1;
	display: block;
	padding: 13px 8px;
	text-align: center;
	font-weight: 700;
	font-size: 13.5px;
	border-radius: 999px;
	cursor: pointer;
	color: rgba( 244, 242, 234, 0.55 );
	transition: color 200ms ease;
	min-height: var( --wp--custom--tap-target-min, 44px );
	display: flex;
	align-items: center;
	justify-content: center;
}

.homefix-priority__radio:checked + .homefix-priority__option {
	color: var( --wp--preset--color--ink );
}

.homefix-priority__radio:focus-visible + .homefix-priority__option {
	outline: 2px solid var( --wp--preset--color--brass );
	outline-offset: 2px;
}

.homefix-priority__thumb {
	position: absolute;
	top: 6px;
	bottom: 6px;
	left: 6px;
	width: calc( 33.333% - 5.333px );
	background: var( --wp--preset--color--background );
	border-radius: 999px;
	transition: transform 260ms cubic-bezier( 0.4, 0, 0.2, 1 );
	z-index: 0;
}

#homefix-priority-express:checked ~ .homefix-priority__thumb {
	transform: translateX( calc( 100% + 4px ) );
}

#homefix-priority-pilna:checked ~ .homefix-priority__thumb {
	transform: translateX( calc( 200% + 8px ) );
}

.homefix-priority__rail {
	max-width: 640px;
	margin: 0 auto 32px;
	height: 4px;
	border-radius: 999px;
	background: rgba( 244, 242, 234, 0.1 );
	overflow: hidden;
	position: relative;
}

.homefix-priority__rail-fill {
	height: 100%;
	border-radius: 999px;
	width: 33.333%;
	background: var( --wp--preset--color--petrol );
	transition: width 300ms ease, background 300ms ease;
}

.homefix-priority-section:has( #homefix-priority-express:checked ) .homefix-priority__rail-fill {
	width: 66.666%;
	background: linear-gradient( 90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass ) );
}

.homefix-priority-section:has( #homefix-priority-pilna:checked ) .homefix-priority__rail-fill {
	width: 100%;
	background: linear-gradient( 90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass ) );
}

/* Uchwyt/rail-fill wyżej i panele szczegółów poniżej muszą przełączać
   się na podstawie stanu radio, które NIE są ich bezpośrednim
   rodzeństwem w DOM (radio żyją wewnątrz <fieldset>, panele są jego
   rodzeństwem) — zwykły kombinator `~` nie przekracza tej granicy
   zagnieżdżenia. `:has()` na wspólnym przodku (`.homefix-priority-section`)
   rozwiązuje to poprawnie niezależnie od głębokości zagnieżdżenia.
   Wsparcie przeglądarek: `:has()` ma pełne wsparcie we wszystkich
   współczesnych evergreen przeglądarkach (Chrome/Edge/Safari/Firefox)
   od 2024 — bezpieczne do użycia jako jedyny mechanizm (bez
   fallbacku), spójnie z resztą przełączania w tym komponencie. */
.homefix-priority__detail {
	max-width: 560px;
	margin: 0 auto;
	display: none;
}

.homefix-priority-section:has( #homefix-priority-standard:checked ) .homefix-priority__detail--standard,
.homefix-priority-section:has( #homefix-priority-express:checked ) .homefix-priority__detail--express,
.homefix-priority-section:has( #homefix-priority-pilna:checked ) .homefix-priority__detail--pilna {
	display: block;
}

.homefix-priority__detail-name {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 26px;
	color: #fff;
	margin-bottom: 10px;
}

/* Cena własna per tryb ("Opłata za organizację i przyjazd: …") —
   zastępuje (2026-09-15) dawną plakietkę terminu + pigułkę względnego
   kosztu ("Najniższa/Wyższa/Najwyższa opłata za tryb"). Standard,
   Express i Pilna interwencja renderują tu każda swoją niezależną
   wartość z `homefix_child_get_priority_mode_prices()` — nigdy jedną
   wspólną cenę. */
.homefix-priority__detail-price {
	font-size: 15px;
	font-weight: 600;
	color: rgba( 244, 242, 234, 0.85 );
	margin: 0 0 12px;
}

.homefix-priority__detail-price-value {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 800;
	font-size: 20px;
	color: var( --wp--preset--color--brass );
	margin-left: 4px;
}

.homefix-priority__detail-desc {
	font-size: 14.5px;
	line-height: 1.6;
	color: rgba( 244, 242, 234, 0.78 );
	margin: 0;
}

/* Wspólny komunikat pod wybranym trybem — poza .homefix-priority__detail,
   więc renderowany raz, nie duplikowany w każdym z 3 paneli (widoczny
   jest zawsze tylko jeden panel naraz, ale ten blok ma być tam za
   każdym razem). Warning-fill pasek to ten sam wzorzec co
   ".homefix-online-flow__warning" w sekcji Płatności — spójna
   semantyka "to nie jest cena robocizny/naprawy" w obu miejscach. */
.homefix-priority__common {
	max-width: 560px;
	margin: 20px auto 0;
}

.homefix-priority__common-warning {
	display: block;
	background: var( --wp--preset--color--warning );
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	padding: 10px 16px;
	border-radius: 8px;
	margin: 0 0 14px;
}

.homefix-priority__common-desc {
	font-size: 13.5px;
	line-height: 1.6;
	color: rgba( 244, 242, 234, 0.78 );
	margin: 0;
}

.homefix-priority__cta-row {
	justify-content: center;
	margin-top: 32px;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-priority__thumb,
	.homefix-priority__rail-fill {
		transition: none;
	}
}

@media ( max-width: 780px ) {
	.homefix-priority-section {
		padding: 56px 20px;
	}

	.homefix-priority__title {
		font-size: 26px;
	}

	.homefix-priority__option {
		font-size: 12px;
		padding: 11px 4px;
	}

	.homefix-priority__transparency-main {
		font-size: 14px;
	}

	.homefix-priority__transparency-sub {
		font-size: 13px;
	}
}

/* ==========================================================================
   HomeFix Gliwice i okolice — sekcja lokalna.
   Editorial, nie katalog: blok tekstowy + typograficzny panel lokalny,
   zero mapy/pinów/skyline. Panel to kolor + typografia (Petrol na
   Surface Alt, cienki akcent u góry), nie ikonografia.
   ========================================================================== */

.homefix-local.wp-block-columns {
	max-width: 1280px;
	margin: 0 auto;
	padding: 64px 24px;
	gap: 48px;
	align-items: center;
}

.homefix-local__text {
	flex-basis: 56%;
	flex-grow: 0;
}

.homefix-local__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 30px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 16px;
}

.homefix-local__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16px;
	line-height: 1.65;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	max-width: 46ch;
	margin: 0 0 20px;
}

.homefix-local__panel {
	flex-basis: 38%;
	flex-grow: 0;
	background: var( --wp--preset--color--surface-alt );
	border-top: 3px solid var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 40px 32px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.homefix-local__panel-eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	line-height: 1;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var( --homefix-stone-accessible );
	margin: 0;
}

/* PRZEBUDOWANE (HOMEFIX SERVICE AREA + PARTNER RECRUITMENT UPDATE,
   2026-09-10): jeden hardcodowany H3 z nazwą miasta zastąpiony listą
   "odznak" — skaluje się do dowolnej liczby aktywnych lokalizacji
   (dziś: jedna, Gliwice) bez zmiany layoutu, gdy przybędzie kolejne
   miasto (patrz homefix_core_get_active_locations()). */
.homefix-local__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.homefix-local__badge {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 20px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	background: #fff;
	border: 1px solid rgba( 27, 75, 84, 0.16 );
	border-radius: 999px;
	padding: 8px 20px;
}

@media ( max-width: 980px ) {
	.homefix-local.wp-block-columns {
		gap: 32px;
	}
}

@media ( max-width: 780px ) {
	.homefix-local.wp-block-columns {
		padding: 40px 16px;
		gap: 24px;
	}

	.homefix-local__text,
	.homefix-local__panel {
		flex-basis: 100%;
	}

	.homefix-local__title {
		font-size: 24px;
	}

	.homefix-local__panel {
		padding: 28px 24px;
	}

	.homefix-local__badge {
		font-size: 17px;
		padding: 7px 16px;
	}
}

/* ==========================================================================
   HomeFix Before/After — Mycie ciśnieniowe. V3.1 PRODUCTION CANDIDATE
   (2026-09-10). Curtain-reveal dwóch osobnych zdjęć (patrz docblock w
   block-patterns.php dla uzasadnienia). Stan startowy 50/50 to pełny,
   informacyjny fallback bez JS. Konsumuje wyłącznie zamrożone tokeny
   z theme.json.
   ========================================================================== */

.homefix-ba-section {
	max-width: 1280px;
	margin: 0 auto;
	padding: 72px 24px;
	text-align: center;
	background: var( --wp--preset--color--surface-alt );
}

.homefix-ba__eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 12px;
}

.homefix-ba__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 40px;
}

.homefix-ba__frame {
	max-width: 960px;
	margin-inline: auto;
	position: relative;
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	aspect-ratio: 16 / 9;
	box-shadow: 0 24px 48px -20px rgba( 27, 36, 32, 0.35 );
}

.homefix-ba__frame picture,
.homefix-ba__before,
.homefix-ba__after-wrap {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.homefix-ba__before {
	object-fit: cover;
	z-index: 1;
}

.homefix-ba__after-wrap {
	z-index: 2;
	overflow: hidden;
	/* Stan startowy (i pełny fallback bez JS): połowa "przed", połowa
	   "po", obie wyraźnie podpisane etykietą — patrz docblock. */
	clip-path: inset( 0 0 0 50% );
	transition: clip-path 700ms cubic-bezier( 0.22, 0.7, 0.2, 1 );
}

.homefix-ba__after-wrap img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* WOW MOTION PASS (2026-09-19) — `.is-scroll-driven` suprimuje tę samą
   transition co `.is-dragging`, z tego samego powodu: pozycja jest
   aktualizowana co klatkę (rAF) przez scroll, więc 700ms transition
   powodowałaby wizualne "doganianie" scrolla zamiast reagować 1:1 —
   patrz initBeforeAfterAutoReveal() w homepage-interactions.js. */
.homefix-ba__frame.is-dragging .homefix-ba__after-wrap,
.homefix-ba__frame.is-scroll-driven .homefix-ba__after-wrap {
	transition: none;
}

.homefix-ba__handle {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 44px;
	margin-left: -22px;
	background: transparent;
	border: none;
	padding: 0;
	cursor: ew-resize;
	z-index: 3;
	transition: left 700ms cubic-bezier( 0.22, 0.7, 0.2, 1 );
}

.homefix-ba__frame.is-dragging .homefix-ba__handle,
.homefix-ba__frame.is-scroll-driven .homefix-ba__handle {
	transition: none;
}

.homefix-ba__handle::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 3px;
	background: #fff;
	transform: translateX( -50% );
	box-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.15 );
}

.homefix-ba__handle::after {
	content: "⇔";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate( -50%, -50% );
	width: 40px;
	height: 40px;
	background: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 17px;
	color: var( --wp--preset--color--petrol );
	box-shadow: 0 4px 14px rgba( 0, 0, 0, 0.3 );
}

.homefix-ba__handle:focus-visible::after {
	outline: 2px solid var( --wp--preset--color--brass );
	outline-offset: 2px;
}

.homefix-ba__label {
	position: absolute;
	top: 14px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	background: rgba( 18, 20, 15, 0.7 );
	color: #fff;
	padding: 5px 10px;
	border-radius: 6px;
	z-index: 4;
}

.homefix-ba__label--before {
	left: 14px;
}

.homefix-ba__label--after {
	right: 14px;
}

.homefix-ba__hint {
	max-width: 640px;
	margin: 16px auto 0;
	text-align: center;
	font-size: 12.5px;
	opacity: 0.65;
	color: var( --wp--preset--color--ink );
}

.homefix-ba__tagline {
	max-width: 480px;
	margin: 10px auto 0;
	text-align: center;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 15px;
	color: var( --wp--preset--color--petrol );
}

@media ( max-width: 780px ) {
	.homefix-ba-section {
		padding: 56px 20px;
	}

	.homefix-ba__title {
		font-size: 26px;
		margin-bottom: 28px;
	}
}

/* ==========================================================================
   HomeFix HomeCare — sekcja zapowiedzi (secondary) na homepage.
   AKTYWOWANA (HomeFix Care Implementation V1, 2026-09-07) — poprzednia
   wersja (panel z samym wordmarkiem, bez CTA/obrazu) była świadomie
   niezobowiązująca, dopóki HomeFix Care nie miał potwierdzonej
   pozycjonacji/landingu (patrz historia w block-patterns.php). Teraz:
   ten sam "aside" (stonowane tło Surface Alt, kontenowane pasmo) +
   3 korzyści + jeden spokojny obraz + CTA tekstowy do /homefix-care/.
   CTA pozostaje linkiem, NIE przyciskiem — zgodnie z zamrożoną regułą
   Design System V1.4 (HomeCare nigdy wizualnie na równi z „Zamów
   fachowca") i z zamrożoną architekturą Care (nigdy primary CTA).
   ========================================================================== */

.homefix-homecare-section {
	max-width: 1280px;
	margin: 64px auto;
	padding: 56px 40px;
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
}

.homefix-homecare.wp-block-columns {
	gap: 48px;
	align-items: center;
}

.homefix-homecare__eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	line-height: 1;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var( --homefix-stone-accessible );
	margin: 0 0 12px;
}

.homefix-homecare__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 26px;
	line-height: 1.25;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 14px;
}

.homefix-homecare__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16px;
	line-height: 1.65;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	max-width: 52ch;
	margin: 0 0 20px;
}

/* ---------- HomeCare — storytelling scroll reveal (WOW MOTION PASS,
   2026-09-19, brief §5). "Punkty pojawiają się kolejno... potem łączą
   się wizualnie" — zrealizowane jako stopniowane wejście 4 istniejących
   punktów listy (bez zmiany treści) + Brass podkreślenie, które
   "dociąga się" pod tytułem jako moment zbiegnięcia. Dwuetapowo, jak
   wszędzie indziej w tym pliku: `.is-story-ready` (dodawana przez JS
   WYŁĄCZNIE gdy `!prefersReducedMotion`, patrz initHomeCareReveal() w
   homepage-interactions.js) ustawia stan startowy (ukryty), dopiero
   `.is-story-active` (IntersectionObserver) odsłania — bez JS/z
   reduced-motion `.is-story-ready` NIGDY się nie pojawia, więc lista i
   tytuł zostają w pełni widoczne od razu, zero ryzyka "trwale ukrytej"
   treści. Selektor celowo zawężony do `.homefix-homecare` — `.homefix-care-list`
   jest współdzielone ze stroną HomeFix Care, ta reguła nie może jej
   dotknąć. */
.homefix-homecare .homefix-care-list.is-story-ready li {
	opacity: 0;
	transform: translateY( 10px );
	transition: opacity var( --hf-dur-ui ) var( --hf-ease ), transform var( --hf-dur-ui ) var( --hf-ease );
}

.homefix-homecare .homefix-care-list.is-story-ready.is-story-active li {
	opacity: 1;
	transform: none;
}

.homefix-homecare .homefix-care-list.is-story-ready li:nth-child( 1 ) { transition-delay: 0ms; }
.homefix-homecare .homefix-care-list.is-story-ready li:nth-child( 2 ) { transition-delay: 120ms; }
.homefix-homecare .homefix-care-list.is-story-ready li:nth-child( 3 ) { transition-delay: 240ms; }
.homefix-homecare .homefix-care-list.is-story-ready li:nth-child( 4 ) { transition-delay: 360ms; }

.homefix-homecare__title.is-story-ready {
	position: relative;
	padding-bottom: 12px;
}

.homefix-homecare__title.is-story-ready::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 2px;
	width: 0;
	background: var( --wp--preset--color--brass );
	transition: width var( --hf-dur-story ) var( --hf-ease ) 480ms;
}

.homefix-homecare__title.is-story-ready.is-story-active::after {
	width: 64px;
}

.homefix-homecare__cta {
	margin: 0;
}

.homefix-homecare__cta a {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 15px;
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: opacity 160ms ease;
}

.homefix-homecare__cta a:hover {
	opacity: 0.7;
}

.homefix-homecare__cta a:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 3px;
}

.homefix-homecare__media {
	position: relative;
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	aspect-ratio: 16 / 9;
}

.homefix-homecare__picture,
.homefix-homecare__picture img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-homecare__cta a {
		transition: none;
	}

	/* initHomeCareReveal() nigdy nie dodaje `.is-story-ready` pod
	   reduced-motion (patrz homepage-interactions.js) — lista i tytuł
	   zostają w pełni widoczne od razu z markupu. Druga linia obrony,
	   ten sam wzorzec co reszta pliku. */
	.homefix-homecare .homefix-care-list li,
	.homefix-homecare__title::after {
		transition: none;
	}
}

@media ( max-width: 980px ) {
	.homefix-homecare-section {
		padding: 44px 28px;
	}

	.homefix-homecare.wp-block-columns {
		gap: 32px;
	}
}

@media ( max-width: 780px ) {
	.homefix-homecare-section {
		margin: 40px auto;
		padding: 32px 20px;
	}

	/* WordPress ustawia flex-basis jako inline style na kolumnie —
	   trzeba !important, żeby go nadpisać na mobile (ta sama zasada co
	   Hero/Dlaczego HomeFix/Final CTA). */
	.homefix-homecare__text,
	.homefix-homecare__media {
		flex-basis: 100% !important;
	}

	.homefix-homecare__title {
		font-size: 22px;
	}

	.homefix-homecare__media {
		aspect-ratio: 4 / 5;
	}
}

/* ==========================================================================
   HomeFix FAQ — natywny core/details, zero custom JS.
   Klasyczny accordion: cienka linia rozdzielająca zamiast boxów,
   wskaźnik +/x jako czysty CSS na summary::after. Focus-visible
   stylowany jawnie, bo domyślny outline znika razem z list-style.
   ========================================================================== */

.homefix-faq-section {
	max-width: 800px;
	margin: 0 auto;
	padding: 64px 24px;
}

.homefix-faq__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 30px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 8px;
}

.homefix-faq__item {
	border-bottom: 1px solid rgba( 27, 36, 32, 0.14 );
	padding: 20px 0;
}

.homefix-faq__item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	list-style: none;
	cursor: pointer;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 17px;
	line-height: 1.4;
	color: var( --wp--preset--color--ink );
	/* FIX (audyt ETAP 16): jawny min-height dla spojnego tap targetu,
	   zamiast polegac wylacznie na paddingu rodzica. */
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-faq__item summary::-webkit-details-marker {
	display: none;
}

.homefix-faq__item summary::after {
	content: "+";
	flex-shrink: 0;
	font-family: var( --wp--preset--font-family--body );
	font-size: 22px;
	line-height: 1;
	color: var( --wp--preset--color--petrol );
	transition: transform 200ms ease;
}

.homefix-faq__item[open] summary::after {
	transform: rotate( 45deg );
}

.homefix-faq__item summary:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 4px;
	border-radius: 2px;
}

.homefix-faq__item p {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.82;
	margin: 12px 0 0;
}

/* Jawny placeholder dla odpowiedzi PENDING (FAQ 3/4/6, ETAP 13) —
   celowo odróżniony od gotowego copy (kursywa, przygaszony Stone),
   żeby nie dało się go pomylić z opublikowaną odpowiedzią. */
.homefix-faq__pending {
	font-style: italic;
	color: var( --homefix-stone-accessible );
	opacity: 1;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-faq__item summary::after {
		transition: none;
	}
}

@media ( max-width: 780px ) {
	.homefix-faq-section {
		padding: 40px 16px;
	}

	.homefix-faq__title {
		font-size: 24px;
	}

	.homefix-faq__item summary {
		font-size: 16px;
	}

	.homefix-faq__item p {
		font-size: 14.5px;
	}
}

/* ==========================================================================
   HomeFix Final CTA — zamknięcie homepage.
   Duży, kontenowany Petrol block, dużo whitespace. Jeden przycisk
   (telefon) — primary CTA online celowo nie renderowany, patrz
   docblock PHP. Focus-visible używa JASNEGO obrysu (nie Petrol), bo
   tło wokół przycisku jest tutaj Petrolem — odwrotnie niż w Hero,
   gdzie przycisk siedzi na jasnym tle.

   UKŁAD ZMIENIONY (HOMEFIX VISUAL SYSTEM V1, 2026-09-06): sekcja
   zyskała zdjęcie kontekstowe. Zewnętrzny `.homefix-final-cta` (tło
   Petrol/padding/radius) BEZ ZMIAN, ale w środku jest teraz
   `.homefix-final-cta__inner.wp-block-columns` (kopia|obraz) zamiast
   pojedynczego wyśrodkowanego bloku — stąd tekst jest teraz wyrównany
   do lewej (spójnie z Hero/Dlaczego HomeFix), nie wyśrodkowany jak w
   wersji bez obrazu.
   ========================================================================== */

.homefix-final-cta {
	max-width: 1280px;
	margin: 64px auto;
	padding: 80px 40px;
	background: var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--card, 16px );
}

.homefix-final-cta__inner.wp-block-columns {
	gap: 48px;
	align-items: center;
}

.homefix-final-cta__copy {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

/* ---------- Final CTA — brand moment (WOW MOTION PASS, 2026-09-19,
   brief §6). Krótkie frazy problemów pojawiają się rozproszone, po
   chwili zbiegają się i znikają w momencie, gdy pojawia się wordmark
   "HOMEFIX". Świadomie `aria-hidden="true"` w całości (czysta wizualna
   ozdoba, redundantna wobec prawdziwego H2/opisu poniżej, które
   zostają nietknięte) — jedyna NOWA, realna treść to
   `.homefix-final-cta__brand-tagline`, który NIE jest aria-hidden.
   Bez JS/z `prefers-reduced-motion`: `.is-enhanced` nigdy się nie
   pojawia, więc kontener ma `height:0` i wyświetla się wyłącznie
   statyczny wordmark + tagline poniżej — zero pustego miejsca, zero
   CLS. ---------- */
.homefix-final-cta__brand-moment {
	position: relative;
	height: auto;
}

.homefix-final-cta__wordmark {
	display: inline-block;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 800;
	font-size: 26px;
	letter-spacing: 0.02em;
	color: var( --wp--preset--color--brass );
}

.homefix-final-cta__brand-moment.is-enhanced {
	position: relative;
	height: 46px;
	overflow: hidden;
}

.homefix-final-cta__brand-moment.is-enhanced .homefix-final-cta__wordmark {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY( -50% ) scale( 0.9 );
	opacity: 0;
	transition: opacity var( --hf-dur-story ) var( --hf-ease ), transform var( --hf-dur-story ) var( --hf-ease );
}

.homefix-final-cta__phrase {
	display: none;
}

.homefix-final-cta__brand-moment.is-enhanced .homefix-final-cta__phrase {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	white-space: nowrap;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 13.5px;
	color: rgba( 244, 242, 234, 0.68 );
	opacity: 0;
	transform: translate( -50%, -50% ) translate( var( --hf-x, 0 ), var( --hf-y, 0 ) );
	transition: opacity var( --hf-dur-ui-slow ) var( --hf-ease ), transform var( --hf-dur-story ) var( --hf-ease );
}

.homefix-final-cta__brand-moment.is-enhanced.is-playing .homefix-final-cta__phrase {
	opacity: 1;
}

.homefix-final-cta__brand-moment.is-enhanced.is-converged .homefix-final-cta__phrase {
	opacity: 0;
	transform: translate( -50%, -50% ) scale( 0.6 );
}

.homefix-final-cta__brand-moment.is-enhanced.is-converged .homefix-final-cta__wordmark {
	opacity: 1;
	transform: translateY( -50% ) scale( 1 );
}

.homefix-final-cta__brand-tagline {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14.5px;
	color: rgba( 244, 242, 234, 0.75 );
	margin: -12px 0 0;
}

.homefix-final-cta__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	/* WOW (2026-09-10): 36px -> 40px, spójnie z mocniejszą typografią
	   reszty homepage w tej wizualnej rundzie (Hero 52px, Steps liczby
	   64px). */
	font-size: 40px;
	line-height: 1.15;
	color: var( --wp--preset--color--background );
	max-width: 18ch;
	margin: 0;
}

.homefix-final-cta__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 17px;
	line-height: 1.6;
	color: var( --wp--preset--color--background );
	opacity: 0.85;
	max-width: 48ch;
	margin: 0;
}

.homefix-final-cta__actions.wp-block-buttons {
	margin: 0;
	justify-content: flex-start;
}

.homefix-final-cta__media {
	position: relative;
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	aspect-ratio: 16 / 9;
}

/* WOW (2026-09-10): "Petrol gradient overlay" z briefu Part 2.5 —
   zaaplikowany na zdjęciu kontekstowym zamiast przebudowy sekcji na
   pełnowymiarowe tło zdjęciowe (mockupowe `.final__media::after`
   działa na zdjęciu w tle CAŁEJ sekcji; tu sekcja pozostaje
   kontenowanym Petrol blockiem — "enhance don't fully rebuild", patrz
   brief). Delikatny gradient wtapia dolną krawędź zdjęcia w Petrol tło
   karty, spójnie z kierunkiem mockupu bez przebudowy layoutu. */
.homefix-final-cta__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient( 180deg, rgba( 18, 51, 57, 0 ) 60%, rgba( 18, 51, 57, 0.42 ) 100% );
	pointer-events: none;
}

.homefix-final-cta__picture,
.homefix-final-cta__picture img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* PRZESTYLOWANE (HOMEFIX V3.1 PRODUCTION CANDIDATE, 2026-09-10):
   poprzednia wersja (WOW, 2026-09-10 wcześniej tego samego dnia)
   stylowała telefon jako dominujący przycisk Brass — poprawne, dopóki
   telefon był JEDYNYM realnym CTA. V3.1 wprowadza primary CTA
   "Zgłoś problem" (`.homefix-cta-seam`, patrz wyżej w tym pliku) —
   telefon staje się SECONDARY w całej hierarchii (brief V3.1 §3),
   więc button-look był już niespójny z resztą strony (Hero/Priority/
   Payment już renderują telefon jako zwykły podkreślony link).
   FIX (znaleziony w realnej przeglądarce, ten sam problem co Hero —
   patrz jego docblock): bez pełnego resetu ten link dziedziczyłby
   globalny domyślny styl WordPressa dla `.wp-element-button` zamiast
   wyglądać jak tekst. */
.homefix-final-cta__phone.wp-block-button .wp-block-button__link {
	background: none;
	color: #fff;
	font-family: inherit;
	font-weight: 700;
	font-size: 14.5px;
	padding: 0;
	min-height: 0;
	border-radius: 0;
	text-decoration: underline;
	text-underline-offset: 3px;
	display: inline-flex;
	align-items: center;
}

.homefix-final-cta__phone.wp-block-button .wp-block-button__link:hover,
.homefix-final-cta__phone.wp-block-button .wp-block-button__link:focus-visible {
	background: none;
	transform: none;
}

@media ( prefers-reduced-motion: reduce ) {
	/* initFinalCtaBrandMoment() nigdy nie dodaje `.is-enhanced` pod
	   reduced-motion — kontener zostaje w stanie statycznym (sam
	   wordmark, zero fraz, zero animacji). Druga linia obrony. */
	.homefix-final-cta__wordmark,
	.homefix-final-cta__phrase {
		transition: none;
	}
}

@media ( max-width: 780px ) {
	.homefix-final-cta {
		margin: 40px auto;
		padding: 48px 24px;
	}

	.homefix-final-cta__inner.wp-block-columns {
		gap: 24px;
		flex-wrap: wrap;
	}

	/* WordPress ustawia flex-basis jako inline style na kolumnie —
	   trzeba !important, żeby go nadpisać na mobile (ta sama zasada co
	   Hero/Dlaczego HomeFix). */
	.homefix-final-cta__copy,
	.homefix-final-cta__media {
		flex-basis: 100% !important;
	}

	.homefix-final-cta__copy {
		gap: 18px;
	}

	.homefix-final-cta__title {
		font-size: 26px;
		max-width: none;
	}

	.homefix-final-cta__desc {
		font-size: 15.5px;
		max-width: none;
	}

	.homefix-final-cta__actions.wp-block-buttons {
		width: 100%;
	}

	.homefix-final-cta__media {
		aspect-ratio: 4 / 5;
	}

	/* Zero poziomego overflow (brief §9) — rozrzut fraz (--hf-x/--hf-y,
	   ustawiony inline w PHP dla desktopu) skalowany w dół na wąskim
	   viewporcie, żeby żadna fraza nie wychodziła poza kolumnę. */
	.homefix-final-cta__brand-moment.is-enhanced .homefix-final-cta__phrase {
		transform: translate( -50%, -50% ) translate( calc( var( --hf-x, 0 ) * 0.5 ), calc( var( --hf-y, 0 ) * 0.5 ) );
		font-size: 12px;
	}

	.homefix-final-cta__brand-moment.is-enhanced.is-converged .homefix-final-cta__phrase {
		transform: translate( -50%, -50% ) scale( 0.6 );
	}
}

/* ==========================================================================
   HomeFix Footer — footer.php (nie wzorzec blokowy, patrz docblock PHP).
   Petrol + jasny tekst, cienki separator nad copyright, dużo whitespace.
   Layout flex z `order` obsługuje 1-4 wypełnione kolumny bez zmian w
   kodzie — kolumny Usługi/HomeFix(skróty)/Informacje renderują się
   tylko, gdy admin przypisał realne menu (has_nav_menu()), patrz
   footer.php (HOMEFIX NAVIGATION & FOOTER V1, 2026-09-08).
   ========================================================================== */

.homefix-footer {
	background-color: var( --wp--preset--color--petrol );
	color: var( --wp--preset--color--background );
}

.homefix-footer__inner {
	max-width: 1280px;
	margin: 0 auto;
	padding: 64px 24px 40px;
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
}

.homefix-footer__col {
	flex: 1 1 200px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.homefix-footer__col--brand {
	order: 1;
	flex-basis: 260px;
}

.homefix-footer__col--services {
	order: 2;
}

.homefix-footer__col--links {
	order: 3;
}

.homefix-footer__col--legal {
	order: 4;
}

.homefix-footer__wordmark {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 22px;
	line-height: 1.2;
	color: var( --wp--preset--color--background );
	margin: 0;
}

.homefix-footer__tagline {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.5;
	color: var( --wp--preset--color--background );
	opacity: 0.8;
	margin: 0;
	max-width: 32ch;
}

.homefix-footer__col-title {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	line-height: 1;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var( --wp--preset--color--background );
	/* FIX (audyt ETAP 16 -- ten sam problem co copyright ponizej,
	   przeoczony przy pierwszym przejsciu): 0.6 dawalo ~4.22:1 na
	   Petrolu, ponizej WCAG AA. 0.7 daje ~5.13:1. */
	opacity: 0.7;
	margin: 0 0 4px;
}

.homefix-footer__menu {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
}

.homefix-footer__menu a,
.homefix-footer__contact-item a {
	color: var( --wp--preset--color--background );
	text-decoration: none;
	opacity: 0.85;
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	display: inline-flex;
	align-items: center;
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-footer__menu a:hover,
.homefix-footer__menu a:focus-visible,
.homefix-footer__contact-item a:hover,
.homefix-footer__contact-item a:focus-visible {
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.homefix-footer__menu .current-menu-item > a {
	opacity: 1;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.homefix-footer__menu a:focus-visible,
.homefix-footer__contact-item a:focus-visible {
	outline: 2px solid var( --wp--preset--color--background );
	outline-offset: 2px;
}

.homefix-footer__contact-item {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	color: var( --wp--preset--color--background );
	opacity: 0.85;
	margin: 0;
}

.homefix-footer__address {
	opacity: 0.7;
}

.homefix-footer__bottom {
	max-width: 1280px;
	margin: 0 auto;
	padding: 20px 24px 32px;
	border-top: 1px solid rgba( 244, 242, 234, 0.15 );
}

.homefix-footer__copyright {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13px;
	color: var( --wp--preset--color--background );
	/* FIX (audyt ETAP 16): 0.6 dawało ~4.22:1 na Petrolu, poniżej WCAG
	   AA. 0.7 daje ~5.13:1 (policzone skryptem) — nadal wyraźnie
	   przygaszone względem reszty stopki, ale w pełni dostępne. */
	opacity: 0.7;
	margin: 0;
}

@media ( max-width: 780px ) {
	.homefix-footer__inner {
		padding: 40px 16px 32px;
		gap: 32px;
	}

	.homefix-footer__col--brand {
		flex-basis: 100%;
	}

	.homefix-footer__col--nav,
	.homefix-footer__col--contact,
	.homefix-footer__col--legal {
		flex-basis: 100%;
	}

	/* Kolejność mobile: HomeFix → Kontakt → Nawigacja → Informacje —
	   inna niż desktop (HomeFix → Nawigacja → Kontakt → Informacje),
	   bo na telefonie dane kontaktowe (duże tap targety tel/mailto) są
	   ważniejsze niż nawigacja, którą i tak łatwiej znaleźć w headerze. */
	.homefix-footer__col--contact {
		order: 2;
	}

	.homefix-footer__col--nav {
		order: 3;
	}

	.homefix-footer__col--legal {
		order: 4;
	}

	.homefix-footer__bottom {
		padding: 16px 16px 24px;
	}
}

/* ==========================================================================
   HomeFix Care — landing /homefix-care/ — PEŁNY REDESIGN (HOMEFIX CARE
   FAZA 3 IMPLEMENTATION, 2026-09-18, zatwierdzony przez właściciela po
   audycie + planie). Zastępuje HomeFix Care Implementation V1 w
   całości — stara architektura (10 sekcji, 2 z nich redundantne)
   usunięta, nie doklejona. Namespace `.homefix-care-*` w dużej mierze
   nowy; `.homefix-care-list` (niżej) i `.homefix-care-section` ZOSTAJĄ
   bez zmian strukturalnych — pierwsza jest współdzielona z homepage
   teaser (`.homefix-homecare`, patrz block-patterns.php) i celowo
   nietknięta, druga wciąż obsługuje 2 sekcje na tej stronie (Problem/
   dlaczego Care, Home Passport).

   REUŻYTE Z PREMIUM SYSTEMU STRON USŁUGOWYCH: warstwowy Hero (::before
   offset panel + frame), gradient timeline ("Jak działa"), border-based
   FAQ akordeon (`.homefix-faq-section`, bez zmian). CELOWO INNE:
   Brass NIGDY jako tło głównego przycisku konwersji (zasada "HomeCare
   nigdy wizualnie na równi z primary CTA klienta" — primary button tu
   jest Petrol, jak w starej wersji), mniej kart, więcej przestrzeni,
   sekcje Limitu decyzji/Bezpiecznych rozliczeń duże i spokojne zamiast
   gęstej siatki kart.
   ========================================================================== */

/* Wspólna lista punktowana — WSPÓŁDZIELONA z homepage teaser
   (.homefix-homecare) — patrz block-patterns.php. Nietknięta. */
.homefix-care-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.homefix-care-list li {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.9;
	padding-left: 18px;
	position: relative;
	margin: 0;
}

.homefix-care-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 9px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var( --wp--preset--color--petrol );
}

.homefix-care-list strong {
	color: var( --wp--preset--color--petrol );
}

/* ---------- Wspólny nagłówek sekcji (Co obejmuje / Czego nie obejmuje /
   Jak działa / Limit / Rozliczenia / Dla kogo / AGD / Remonty / Cennik /
   Kilka nieruchomości / Formularz). ---------- */
.homefix-care-section-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 27px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	max-width: 1280px;
	margin: 0 auto 20px;
	padding: 0 24px;
}

/* ---------- Hero — warstwowy układ, identyczna mechanika co finalna
   Hydraulika/Elektryka, z dopiskiem ceny + proof points. Primary CTA
   Petrol (nigdy Brass — zasada HomeCare). ---------- */
.homefix-care-hero {
	display: flex;
	align-items: center;
	gap: 56px;
	max-width: 1280px;
	margin: 0 auto;
	padding: 56px 24px 64px;
}

.homefix-care-hero__copy {
	flex: 1 1 46%;
	min-width: 0;
}

.homefix-care-hero__eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 16px;
}

.homefix-care-hero__heading {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 38px;
	line-height: 1.14;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 16px;
	max-width: 18ch;
}

.homefix-care-hero__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16.5px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	max-width: 50ch;
	margin: 0 0 22px;
}

.homefix-care-hero__proof {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.homefix-care-hero__proof li {
	position: relative;
	padding-left: 22px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14px;
	color: var( --wp--preset--color--petrol );
}

.homefix-care-hero__proof li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 6px;
	width: 9px;
	height: 9px;
	border-radius: 3px;
	background: var( --wp--preset--color--brass );
}

.homefix-care-hero__price {
	display: flex;
	align-items: center;
	gap: 20px;
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 18px 22px;
	margin: 0 0 12px;
}

.homefix-care-hero__price-item {
	display: flex;
	flex-direction: column;
}

.homefix-care-hero__price-amount {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 24px;
	color: var( --wp--preset--color--petrol );
}

.homefix-care-hero__price-sub {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 13px;
	color: var( --wp--preset--color--stone );
}

.homefix-care-hero__price-unit {
	font-family: var( --wp--preset--font-family--body );
	font-size: 12.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.72;
}

.homefix-care-hero__price-divider {
	width: 1px;
	align-self: stretch;
	background: rgba( 27, 75, 84, 0.16 );
}

.homefix-care-hero__price-note {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13px;
	color: var( --wp--preset--color--ink );
	opacity: 0.65;
	margin: 0 0 26px;
}

.homefix-care-hero__ctas {
	display: flex;
	align-items: center;
	gap: 22px;
	flex-wrap: wrap;
}

.homefix-care-hero__cta {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 15.5px;
	border-radius: var( --wp--custom--radius--button, 9px );
	min-height: var( --wp--custom--tap-target-min, 44px );
	padding-inline: 28px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: background-color 160ms ease, transform 160ms ease, opacity 160ms ease;
}

.homefix-care-hero__cta--primary {
	background-color: var( --wp--preset--color--petrol );
	color: var( --wp--preset--color--background );
}

.homefix-care-hero__cta--primary:hover,
.homefix-care-hero__cta--primary:focus-visible {
	background-color: var( --wp--preset--color--ink );
	transform: translateY( -1px );
}

.homefix-care-hero__cta--secondary {
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 3px;
	padding-inline: 4px;
}

.homefix-care-hero__cta--secondary:hover,
.homefix-care-hero__cta--secondary:focus-visible {
	opacity: 0.72;
}

.homefix-care-hero__cta:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 3px;
}

.homefix-care-hero__media {
	flex: 1 1 54%;
	min-width: 0;
	position: relative;
}

.homefix-care-hero__media::before {
	content: "";
	position: absolute;
	top: 22px;
	right: -22px;
	bottom: -22px;
	left: 22px;
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	z-index: 0;
}

.homefix-care-hero__media-frame {
	position: relative;
	z-index: 1;
	border-radius: 20px;
	overflow: hidden;
	aspect-ratio: 4 / 5;
	box-shadow: 0 28px 56px -18px rgba( 18, 51, 57, 0.32 );
}

.homefix-care-hero__picture,
.homefix-care-hero__picture img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---------- Sekcje tekstowe wąskiej miary — Problem/dlaczego Care,
   Home Passport. ---------- */
.homefix-care-section {
	max-width: 760px;
	margin: 0 auto;
	padding: 48px 24px;
}

.homefix-care-section__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 28px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 18px;
}

.homefix-care-section__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16px;
	line-height: 1.65;
	color: var( --wp--preset--color--ink );
	opacity: 0.9;
	margin: 0 0 18px;
}

.homefix-care-section__desc:last-child {
	margin-bottom: 0;
}

.homefix-care-section .homefix-care-list {
	margin: 4px 0 22px;
}

/* ---------- Co obejmuje abonament — 8 kart, 4×2 desktop. ---------- */
.homefix-care-scope {
	padding: 8px 0 64px;
}

.homefix-care-scope__grid {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	grid-template-columns: repeat( 4, 1fr );
	gap: 14px;
}

.homefix-care-scope__card {
	display: flex;
	flex-direction: column;
	gap: 6px;
	background: var( --wp--preset--color--surface-alt );
	border-left: 3px solid var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 18px 20px;
}

.homefix-care-scope__card strong {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 14.5px;
	color: var( --wp--preset--color--petrol );
}

.homefix-care-scope__card span {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13px;
	line-height: 1.5;
	color: var( --wp--preset--color--ink );
	opacity: 0.75;
}

/* ---------- Czego abonament nie obejmuje — jawna, wyróżniona sekcja. ---------- */
.homefix-care-exclusions {
	max-width: 800px;
	margin: 0 auto 64px;
	padding: 0 24px;
}

.homefix-care-exclusions .homefix-care-section-title {
	padding: 0;
	margin-bottom: 14px;
	text-align: left;
}

.homefix-care-exclusions__lead {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 16px;
	line-height: 1.5;
	color: var( --wp--preset--color--petrol );
	background: var( --wp--preset--color--surface-alt );
	border-left: 3px solid var( --wp--preset--color--brass );
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 18px 22px;
	margin: 0 0 22px;
}

.homefix-care-exclusions__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 10px 24px;
}

.homefix-care-exclusions__list li {
	position: relative;
	padding-left: 18px;
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.8;
}

.homefix-care-exclusions__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 9px;
	width: 8px;
	height: 2px;
	background: var( --wp--preset--color--stone );
}

/* ---------- Jak działa HomeFix Care — gradient timeline, reużyty
   wizualnie z premium systemu usługowego. ---------- */
.homefix-care-journey {
	padding: 8px 0 64px;
}

.homefix-care-journey .homefix-care-section-title {
	text-align: center;
	margin-bottom: 36px;
}

.homefix-care-journey__list {
	list-style: none;
	counter-reset: care-step;
	margin: 0;
	padding: 0 24px;
	max-width: 1280px;
	margin-inline: auto;
	display: flex;
	align-items: flex-start;
	gap: 0;
}

.homefix-care-journey__list li {
	counter-increment: care-step;
	position: relative;
	flex: 1 1 0;
	padding: 0 20px 0 0;
}

.homefix-care-journey__list li:first-child {
	padding-left: 0;
}

.homefix-care-journey__list li::before {
	content: counter( care-step );
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var( --wp--preset--color--petrol );
	box-shadow: 0 0 0 3px rgba( 137, 92, 37, 0.16 );
	color: #fff;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 17px;
	margin-bottom: 16px;
}

.homefix-care-journey__list li:not( :last-child )::after {
	content: "";
	position: absolute;
	top: 23px;
	left: 48px;
	width: calc( 100% - 30px );
	height: 3px;
	background: linear-gradient( 90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass ) );
	opacity: 0.35;
}

.homefix-care-journey__list strong {
	display: block;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 16px;
	color: var( --wp--preset--color--ink );
	margin-bottom: 4px;
}

.homefix-care-journey__list span {
	display: block;
	font-family: var( --wp--preset--font-family--body );
	font-size: 13px;
	color: var( --wp--preset--color--ink );
	opacity: 0.78;
	line-height: 1.5;
}

/* ---------- Limit decyzji właściciela — najważniejsza funkcja
   produktu, duża wizualna sekcja + 2 scenariusze. ---------- */
.homefix-care-limit {
	max-width: 900px;
	margin: 0 auto 64px;
	padding: 0 24px;
}

.homefix-care-limit .homefix-care-section-title {
	padding: 0;
	margin-bottom: 12px;
	text-align: left;
	max-width: none;
}

.homefix-care-limit__lead {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.82;
	margin: 0 0 24px;
}

.homefix-care-limit__hero {
	display: flex;
	align-items: center;
	gap: 28px;
	background: var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 30px 32px;
}

.homefix-care-limit__num {
	flex-shrink: 0;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 42px;
	color: #fff;
}

.homefix-care-limit__num sup {
	font-size: 16px;
	opacity: 0.7;
}

.homefix-care-limit__hero p {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.6;
	color: #F4F2EA;
	opacity: 0.9;
	margin: 0;
}

.homefix-care-limit__footnote {
	font-family: var( --wp--preset--font-family--body );
	font-size: 12.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.55;
	margin: 10px 0 0;
}

.homefix-care-limit__scenarios {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 16px;
	margin-top: 22px;
}

.homefix-care-limit__scenario {
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 20px 22px;
}

.homefix-care-limit__scenario strong {
	display: block;
	font-family: var( --wp--preset--font-family--display );
	font-size: 15.5px;
	color: var( --wp--preset--color--petrol );
	margin-bottom: 4px;
}

.homefix-care-limit__scenario span {
	display: block;
	font-family: var( --wp--preset--font-family--body );
	font-size: 13px;
	color: var( --wp--preset--color--ink );
	opacity: 0.72;
}

.homefix-care-limit__result {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 13.5px;
	margin: 10px 0 0;
}

.homefix-care-limit__result--ok {
	color: var( --wp--preset--color--success );
}

.homefix-care-limit__result--ask {
	color: var( --wp--preset--color--warning );
}

/* ---------- Bezpieczne rozliczenia — 3 spokojne karty, zero języka
   fintechowego/strachu. ---------- */
.homefix-care-billing {
	max-width: 1280px;
	margin: 0 auto 64px;
	padding: 0 24px;
}

.homefix-care-billing .homefix-care-section-title {
	padding: 0;
	margin-bottom: 22px;
	max-width: 640px;
}

.homefix-care-billing__grid {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 16px;
}

.homefix-care-billing__item {
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 22px 22px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.homefix-care-billing__item strong {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 15.5px;
	color: var( --wp--preset--color--petrol );
}

.homefix-care-billing__item span {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.78;
}

/* ---------- Dla kogo — 5 segmentów, lekka siatka. ---------- */
.homefix-care-segments {
	padding: 8px 0 64px;
}

.homefix-care-segments__grid {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	grid-template-columns: repeat( 5, 1fr );
	gap: 12px;
}

.homefix-care-segments__card {
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 18px 16px;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 14px;
	line-height: 1.4;
	color: var( --wp--preset--color--petrol );
	text-align: center;
}

/* ---------- AGD / wyposażenie, Większe remonty — sekcje tekstowe
   lekkie, bez kart. ---------- */
.homefix-care-agd,
.homefix-care-renovations {
	max-width: 760px;
	margin: 0 auto 56px;
	padding: 0 24px;
}

.homefix-care-agd .homefix-care-section-title,
.homefix-care-renovations .homefix-care-section-title {
	padding: 0;
	margin-bottom: 14px;
	max-width: none;
}

.homefix-care-agd__desc,
.homefix-care-agd__note,
.homefix-care-renovations__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15.5px;
	line-height: 1.65;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0 0 12px;
}

.homefix-care-agd__note {
	opacity: 0.65;
	font-size: 14px;
	margin-bottom: 0;
}

/* ---------- Cennik — 2 karty, disclaimer zawsze widoczny. ---------- */
.homefix-care-pricing {
	max-width: 900px;
	margin: 0 auto 64px;
	padding: 0 24px;
	text-align: center;
}

.homefix-care-pricing .homefix-care-section-title {
	padding: 0;
	text-align: center;
	max-width: none;
}

.homefix-care-pricing__cards {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 18px;
	margin: 24px 0 20px;
	text-align: left;
}

.homefix-care-pricing__card {
	position: relative;
	background: var( --wp--preset--color--surface );
	border: 1px solid rgba( 27, 75, 84, 0.16 );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 26px 26px 24px;
}

.homefix-care-pricing__card--annual {
	border-color: var( --wp--preset--color--brass );
}

.homefix-care-pricing__badge {
	position: absolute;
	top: -11px;
	left: 22px;
	background: var( --wp--preset--color--brass );
	color: #fff;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 11px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	padding: 4px 10px;
	border-radius: 999px;
}

.homefix-care-pricing__label {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 12.5px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var( --wp--preset--color--stone );
	margin: 0 0 10px;
}

.homefix-care-pricing__amount {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	color: var( --wp--preset--color--petrol );
	margin: 0;
}

.homefix-care-pricing__amount span {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14px;
	color: var( --wp--preset--color--stone );
}

.homefix-care-pricing__note {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13px;
	color: var( --wp--preset--color--ink );
	opacity: 0.72;
	margin: 8px 0 0;
}

.homefix-care-pricing__cta {
	margin-top: 4px;
}

.homefix-care-pricing__disclaimer {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14px;
	color: var( --wp--preset--color--petrol );
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 14px 20px;
	margin: 0 0 22px;
}

/* ---------- Kilka nieruchomości — 1 linia + CTA, bez %. ---------- */
.homefix-care-portfolio {
	max-width: 760px;
	margin: 0 auto 64px;
	padding: 0 24px;
	text-align: center;
}

.homefix-care-portfolio .homefix-care-section-title {
	padding: 0;
	text-align: center;
	max-width: none;
}

.homefix-care-portfolio__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15.5px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.82;
	margin: 0 0 18px;
}

.homefix-care-portfolio__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 15px;
	color: var( --wp--preset--color--brass );
	text-decoration: none;
}

.homefix-care-portfolio__link span {
	transition: transform 160ms ease;
}

.homefix-care-portfolio__link:hover span,
.homefix-care-portfolio__link:focus-visible span {
	transform: translateX( 3px );
}

/* ---------- Dodatkowa usługa — zarządzanie najmem (2026-09-19).
   Świadomie MAŁA, wyraźnie odrębna karta — obrys, nie wypełnienie
   Petrol/surface-alt jak reszta strony — żeby nikt nie pomylił jej z
   głównym produktem Care. CTA outline (nie `.homefix-care-hero__cta--primary`),
   kontakt wyłącznie telefoniczny. ---------- */
.homefix-care-rental {
	max-width: 680px;
	margin: 0 auto 64px;
	padding: 30px 32px;
	border: 1.5px dashed rgba( 27, 75, 84, 0.28 );
	border-radius: var( --wp--custom--radius--card, 16px );
	text-align: center;
}

.homefix-care-rental__eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 11.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 12px;
}

.homefix-care-rental__heading {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 21px;
	line-height: 1.3;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 10px;
}

.homefix-care-rental__lead {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0 0 18px;
}

.homefix-care-rental__scope-intro {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 13px;
	color: var( --wp--preset--color--ink );
	opacity: 0.7;
	margin: 0 0 10px;
}

.homefix-care-rental__list {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	display: inline-flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	text-align: left;
}

.homefix-care-rental__list li {
	position: relative;
	padding-left: 16px;
	font-family: var( --wp--preset--font-family--body );
	font-size: 14px;
	color: var( --wp--preset--color--ink );
	opacity: 0.8;
}

.homefix-care-rental__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 8px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var( --wp--preset--color--stone );
}

.homefix-care-rental__actions {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	flex-wrap: wrap;
	margin-bottom: 16px;
}

.homefix-care-rental__cta {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14.5px;
	color: var( --wp--preset--color--petrol );
	background: transparent;
	border: 1.5px solid var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--button, 9px );
	min-height: var( --wp--custom--tap-target-min, 44px );
	padding-inline: 24px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: background-color 160ms ease, color 160ms ease;
}

.homefix-care-rental__cta:hover,
.homefix-care-rental__cta:focus-visible {
	background-color: var( --wp--preset--color--petrol );
	color: var( --wp--preset--color--background );
}

.homefix-care-rental__phone {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14px;
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 3px;
}

.homefix-care-rental__disclaimer {
	font-family: var( --wp--preset--font-family--body );
	font-size: 12.5px;
	line-height: 1.5;
	color: var( --wp--preset--color--ink );
	opacity: 0.6;
	margin: 0;
}

/* ---------- Formularz "Zgłoś nieruchomość" — pełny formularz (gdy
   bramka otwarta) LUB karta "już wkrótce" (domyślnie). ---------- */
.homefix-care-form-section {
	max-width: 800px;
	margin: 0 auto 64px;
	padding: 0 24px;
	scroll-margin-top: 24px;
}

.homefix-care-form-section .homefix-care-section-title {
	padding: 0;
	max-width: none;
}

.homefix-care-form-section__lead {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.78;
	margin: 0 0 28px;
	max-width: 60ch;
}

.homefix-care-form-gated {
	background: var( --wp--preset--color--surface-alt );
	border-left: 3px solid var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 32px 30px;
}

.homefix-care-form-gated__heading {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 18px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 10px;
}

.homefix-care-form-gated__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.8;
	margin: 0 0 22px;
	max-width: 60ch;
}

.homefix-care-form-gated__actions {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.homefix-care-form-gated__email {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14px;
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 3px;
}

.homefix-care-form {
	background: var( --wp--preset--color--surface );
	border: 1px solid rgba( 27, 75, 84, 0.14 );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 30px;
}

.homefix-care-form__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.homefix-care-form__grid {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 18px 20px;
}

.homefix-care-form__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.homefix-care-form__field--full,
.homefix-care-form__field--radio {
	grid-column: 1 / -1;
}

.homefix-care-form__field label,
.homefix-care-form__field-label {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 13.5px;
	color: var( --wp--preset--color--ink );
}

.homefix-care-form__field input[type="text"],
.homefix-care-form__field input[type="tel"],
.homefix-care-form__field input[type="email"],
.homefix-care-form__field select,
.homefix-care-form__field textarea {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	color: var( --wp--preset--color--ink );
	background: var( --wp--preset--color--background );
	border: 1px solid rgba( 27, 75, 84, 0.22 );
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 11px 14px;
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-care-form__field textarea {
	min-height: 88px;
	resize: vertical;
}

.homefix-care-form__field input:focus-visible,
.homefix-care-form__field select:focus-visible,
.homefix-care-form__field textarea:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 1px;
}

.homefix-care-form__radio-row {
	display: flex;
	align-items: center;
	gap: 24px;
}

.homefix-care-form__radio-row label {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-weight: 500;
}

.homefix-care-form__consents {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-top: 8px;
	border-top: 1px solid rgba( 27, 75, 84, 0.1 );
	margin-top: 4px;
}

.homefix-care-form__toggle {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-family: var( --wp--preset--font-family--body );
	font-size: 13px;
	line-height: 1.5;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
}

.homefix-care-form__toggle input {
	margin-top: 3px;
}

.homefix-care-form__error {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 13.5px;
	color: var( --wp--preset--color--error );
	margin: 16px 0 0;
}

.homefix-care-form__submit {
	margin-top: 22px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 15.5px;
	background-color: var( --wp--preset--color--petrol );
	color: var( --wp--preset--color--background );
	border: none;
	border-radius: var( --wp--custom--radius--button, 9px );
	min-height: var( --wp--custom--tap-target-min, 44px );
	padding-inline: 32px;
	cursor: pointer;
	transition: background-color 160ms ease, transform 160ms ease;
}

.homefix-care-form__submit:hover,
.homefix-care-form__submit:focus-visible {
	background-color: var( --wp--preset--color--ink );
	transform: translateY( -1px );
}

.homefix-care-form__submit:disabled {
	opacity: 0.6;
	cursor: default;
	transform: none;
}

.homefix-care-form__success {
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 30px;
	text-align: center;
}

.homefix-care-form__success h3 {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 19px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 8px;
}

.homefix-care-form__success p {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.82;
	margin: 0;
}

/* ---------- Final CTA — reużywa bazowy .homefix-final-cta (tło
   Petrol/padding/radius). ---------- */
.homefix-care-final-cta__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 8px;
	max-width: 640px;
	margin: 0 auto;
}

.homefix-care-final-cta__headline {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 28px;
	line-height: 1.25;
	color: #fff;
	margin: 0 0 6px;
}

.homefix-care-final-cta__subline {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15.5px;
	line-height: 1.55;
	color: #F4F2EA;
	opacity: 0.85;
	margin: 0 0 26px;
	max-width: 48ch;
}

.homefix-care-final-cta__actions {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 22px;
	flex-wrap: wrap;
}

.homefix-care-final-cta__inner .homefix-care-hero__cta--primary {
	background-color: var( --wp--preset--color--background );
	color: var( --wp--preset--color--petrol );
}

.homefix-care-final-cta__inner .homefix-care-hero__cta--primary:hover,
.homefix-care-final-cta__inner .homefix-care-hero__cta--primary:focus-visible {
	background-color: var( --wp--preset--color--surface-alt );
}

.homefix-care-final-cta__phone {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14px;
	color: var( --wp--preset--color--background );
	text-decoration: underline;
	text-underline-offset: 3px;
	opacity: 0.85;
}

.homefix-care-final-cta__phone:hover,
.homefix-care-final-cta__phone:focus-visible {
	opacity: 1;
}

/* ---------- Regulamin HomeFix Care (DRAFT) — /regulamin-homefix-care/,
   strona draft, nie podlinkowana publicznie. Typografia prosta,
   czytelna, banner DRAFT na górze. ---------- */
.homefix-care-terms {
	max-width: 800px;
	margin: 0 auto;
	padding: 48px 24px 80px;
}

.homefix-care-terms__banner {
	display: flex;
	flex-direction: column;
	gap: 8px;
	background: var( --wp--preset--color--warning-bg, #FBF1DC );
	border-left: 3px solid var( --wp--preset--color--warning );
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 18px 22px;
	margin: 0 0 32px;
}

.homefix-care-terms__banner strong {
	font-family: var( --wp--preset--font-family--display );
	font-size: 14.5px;
	color: var( --wp--preset--color--warning );
}

.homefix-care-terms__banner span {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
}

.homefix-care-terms h1 {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 30px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 32px;
}

.homefix-care-terms__item {
	padding: 18px 0;
	border-bottom: 1px solid rgba( 27, 75, 84, 0.1 );
}

.homefix-care-terms__item:last-child {
	border-bottom: none;
}

.homefix-care-terms__item h2 {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 16px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 8px;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

.homefix-care-terms__item p {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.65;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0;
}

.homefix-care-terms__flag {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 10.5px;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var( --wp--preset--color--warning );
	background: var( --wp--preset--color--warning-bg, #FBF1DC );
	border-radius: 999px;
	padding: 3px 9px;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-care-hero__cta,
	.homefix-care-hero__cta--secondary,
	.homefix-care-form__submit,
	.homefix-care-portfolio__link span,
	.homefix-care-rental__cta,
	.homefix-care-final-cta__phone {
		transition: none;
	}
}

@media ( max-width: 980px ) {
	.homefix-care-scope__grid {
		grid-template-columns: repeat( 2, 1fr );
	}

	.homefix-care-segments__grid {
		grid-template-columns: repeat( 3, 1fr );
	}
}

@media ( max-width: 780px ) {
	.homefix-care-hero {
		flex-direction: column;
		align-items: stretch;
		padding: 32px 20px 40px;
		gap: 26px;
	}

	.homefix-care-hero__media::before {
		display: none;
	}

	.homefix-care-hero__media-frame {
		aspect-ratio: 4 / 3;
		border-radius: 16px;
	}

	.homefix-care-hero__heading {
		font-size: 28px;
		max-width: none;
	}

	.homefix-care-hero__desc {
		max-width: none;
	}

	.homefix-care-hero__price {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.homefix-care-hero__price-divider {
		display: none;
	}

	.homefix-care-hero__ctas {
		flex-direction: column;
		align-items: stretch;
	}

	.homefix-care-hero__cta {
		width: 100%;
	}

	.homefix-care-section {
		padding: 40px 20px;
	}

	.homefix-care-section__title {
		font-size: 23px;
	}

	.homefix-care-scope__grid,
	.homefix-care-exclusions__list,
	.homefix-care-journey__list,
	.homefix-care-billing__grid,
	.homefix-care-limit__scenarios,
	.homefix-care-pricing__cards {
		grid-template-columns: 1fr;
	}

	.homefix-care-journey__list {
		flex-direction: column;
		gap: 26px;
		padding: 0 20px;
	}

	.homefix-care-journey__list li {
		padding: 0 0 0 62px;
	}

	.homefix-care-journey__list li:first-child {
		padding-left: 62px;
	}

	.homefix-care-journey__list li::before {
		position: absolute;
		left: 0;
		top: 0;
		margin-bottom: 0;
	}

	.homefix-care-journey__list li:not( :last-child )::after {
		top: 50px;
		left: 23px;
		width: 3px;
		height: calc( 100% + 10px );
	}

	.homefix-care-segments__grid {
		grid-template-columns: repeat( 2, 1fr );
	}

	.homefix-care-limit__hero {
		flex-direction: column;
		align-items: flex-start;
		gap: 14px;
	}

	.homefix-care-form__grid {
		grid-template-columns: 1fr;
	}

	.homefix-care-form {
		padding: 22px 20px;
	}

	.homefix-care-final-cta__headline {
		font-size: 22px;
	}

	.homefix-care-rental {
		margin: 0 20px 48px;
		padding: 26px 22px;
	}

	.homefix-care-rental__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.homefix-care-rental__cta {
		width: 100%;
	}

	.homefix-care-terms {
		padding: 32px 20px 56px;
	}
}

/* ==========================================================================
   HomeFix Service Pages Experience V1 (2026-09-07) — wspólny template
   dla archiwum kategorii (`taxonomy-kategoria_uslugi.php`) i
   pojedynczej usługi (`single-usluga.php`). Reużywa istniejące tokeny
   i, gdzie strukturalnie identyczne, istniejące klasy
   (`.homefix-care-list` dla list punktowanych) — patrz
   inc/service-pages.php.
   ========================================================================== */

/* Breadcrumbs — stylujemy natywny markup Rank Math
   (`rank-math-breadcrumb`), nie zastępujemy go własnym. */
.homefix-breadcrumbs {
	max-width: 1280px;
	margin: 0 auto;
	padding: 20px 24px 0;
}

.homefix-breadcrumbs p {
	margin: 0;
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
}

.homefix-breadcrumbs a {
	color: var( --homefix-stone-accessible );
	text-decoration: none;
}

.homefix-breadcrumbs a:hover,
.homefix-breadcrumbs a:focus-visible {
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 2px;
}

.homefix-breadcrumbs a:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
	border-radius: 3px;
}

.homefix-breadcrumbs .separator {
	color: var( --homefix-stone-accessible );
	opacity: 0.6;
}

.homefix-breadcrumbs .last {
	color: var( --wp--preset--color--ink );
	opacity: 0.75;
}

/* Hero — kategoria i usługa dzielą tę samą strukturę 2-kolumnową
   (tekst ~57% / obraz ~43%), spójną z resztą Visual System, ale osobna
   klasa od `.homefix-hero`/`.homefix-care-hero` — zero ryzyka dla
   głównego Hero czy Hero Care. */
.homefix-svc-hero.wp-block-columns {
	max-width: 1280px;
	margin-inline: auto;
	padding: 40px 24px 48px;
	gap: 40px;
	align-items: center;
}

.homefix-svc-hero__eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	line-height: 1;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var( --homefix-stone-accessible );
	margin: 0 0 12px;
}

.homefix-svc-hero__heading {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 36px;
	line-height: 1.15;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 14px;
}

.homefix-svc-hero__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16.5px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	max-width: 52ch;
	margin: 0;
}

.homefix-svc-hero__media {
	position: relative;
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	aspect-ratio: 16 / 9;
}

.homefix-svc-hero__picture,
.homefix-svc-hero__picture img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Sekcje wspólne — tytuł, siatka usług, "Nie wiesz która", CTA. */
.homefix-svc-section-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 26px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	max-width: 1280px;
	margin: 0 auto;
	padding: 8px 24px 20px;
}

.homefix-svc-list-section {
	padding-bottom: 8px;
}

.homefix-svc-list {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px;
	display: grid;
	/* auto-fit zamiast sztywnego repeat(3, 1fr): przy 2 usługach w
	   kategorii (np. Naprawy domowe) puste trzecie miejsce w siatce
	   jest globalnie nieużywane w całej siatce, więc auto-fit je
	   zwija i rozciąga 2 realne karty na pełną szerokość — bez fake
	   filler cards. Kategorie z 3 lub 6 usługami wyglądają identycznie
	   jak wcześniej (dokładne dopasowanie lub pełne rzędy). */
	grid-template-columns: repeat( auto-fit, minmax( 320px, 1fr ) );
	gap: 16px;
}

.homefix-svc-list__item {
	display: flex;
	flex-direction: column;
	gap: 6px;
	background-color: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 20px 22px;
	text-decoration: none;
	transition: transform 160ms ease, box-shadow 160ms ease;
}

.homefix-svc-list__item:hover,
.homefix-svc-list__item:focus-visible {
	transform: translateY( -2px );
	box-shadow: 0 8px 20px rgba( 27, 75, 84, 0.1 );
}

.homefix-svc-list__item:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
}

.homefix-svc-list__name {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 16px;
	color: var( --wp--preset--color--petrol );
}

.homefix-svc-list__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	line-height: 1.5;
	color: var( --wp--preset--color--ink );
	opacity: 0.75;
}

.homefix-svc-help {
	max-width: 700px;
	margin: 40px auto;
	padding: 0 24px;
	text-align: center;
}

.homefix-svc-help__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 22px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 10px;
}

.homefix-svc-help__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15.5px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0;
}

.homefix-svc-benefits {
	padding-bottom: 8px;
}

.homefix-svc-benefits__list {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px;
}

/* Treść pojedynczej usługi — the_content() jest zwykłym natywnym
   Gutenbergiem (heading/paragraph/list), bez własnych klas (patrz
   homefix-core/inc/service-catalog-content.php) — stylujemy więc
   generycznie w obrębie tego kontenera, zamiast dodawać className do
   samej treści. */
.homefix-usluga-content {
	max-width: 760px;
	margin: 0 auto;
	padding: 8px 24px 40px;
}

.homefix-usluga-content h2 {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 24px;
	line-height: 1.25;
	color: var( --wp--preset--color--petrol );
	margin: 36px 0 12px;
}

.homefix-usluga-content h2:first-child {
	margin-top: 0;
}

.homefix-usluga-content h3 {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 17px;
	color: var( --wp--preset--color--ink );
	margin: 22px 0 8px;
}

.homefix-usluga-content p {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15.5px;
	line-height: 1.65;
	color: var( --wp--preset--color--ink );
	opacity: 0.9;
	margin: 0 0 12px;
}

.homefix-usluga-content ul {
	margin: 0 0 12px;
	padding-left: 20px;
}

.homefix-usluga-content li {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15.5px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.9;
	margin-bottom: 6px;
}

.homefix-usluga-content a {
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 2px;
}

.homefix-usluga-content a:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
}

/* CTA — prosty pasek telefonu, spójny z resztą serwisu (bez CTA do
   `/zgloszenie`, które nie jest jeszcze aktywne produkcyjnie). */
.homefix-svc-cta {
	max-width: 1280px;
	margin: 24px auto 64px;
	padding: 32px 24px;
	background-color: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	text-align: center;
}

.homefix-svc-cta__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16px;
	color: var( --wp--preset--color--ink );
	margin: 0;
}

.homefix-svc-cta__button {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 16px;
	background-color: var( --wp--preset--color--petrol );
	color: var( --wp--preset--color--background );
	border-radius: var( --wp--custom--radius--button, 9px );
	min-height: var( --wp--custom--tap-target-min, 44px );
	padding-inline: 32px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	transition: background-color 160ms ease, transform 160ms ease;
}

.homefix-svc-cta__button:hover {
	background-color: var( --wp--preset--color--ink );
	transform: translateY( -1px );
}

.homefix-svc-cta__button:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 3px;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-svc-list__item,
	.homefix-svc-cta__button {
		transition: none;
	}
}

@media ( max-width: 980px ) {
	.homefix-svc-list {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( max-width: 780px ) {
	.homefix-svc-hero.wp-block-columns {
		padding: 24px 16px 32px;
		gap: 20px;
		flex-wrap: wrap;
	}

	.homefix-svc-hero__copy,
	.homefix-svc-hero__media {
		flex-basis: 100% !important;
	}

	.homefix-svc-hero__heading {
		font-size: 26px;
	}

	.homefix-svc-hero__media {
		aspect-ratio: 4 / 5;
	}

	.homefix-svc-list {
		grid-template-columns: 1fr;
		padding: 0 16px;
	}

	.homefix-svc-section-title,
	.homefix-usluga-content,
	.homefix-svc-help {
		padding-left: 16px;
		padding-right: 16px;
	}

	.homefix-svc-cta {
		margin: 16px 16px 40px;
		padding: 28px 20px;
	}
}

/* ==========================================================================
   HomeFix About — strona „O HomeFix" (ETAP HOMEFIX ABOUT V1).
   Świadomie prosta: prosa max-width 700px (content-max token), bez
   dużych kart/ikon — strona informacyjna, nie sprzedażowa. Sekcja Care
   to jedyny wyjątek z dwukolumnowym porównaniem (krótkie, symetryczne
   akapity). CTA reużywa dokładnie ten sam wzorzec wizualny co Final CTA
   homepage (karta Petrol + jasny przycisk) dla spójności marki.
   NIE WDROŻONE na serwer — patrz docs/strategy/HOMEFIX_ABOUT_V1.md.
   ========================================================================== */

.homefix-about {
	max-width: 1280px;
	margin: 0 auto;
}

.homefix-about__hero {
	max-width: 700px;
	margin: 0 auto;
	padding: 88px 24px 8px;
}

.homefix-about__hero-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 44px;
	line-height: 1.1;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 12px;
}

.homefix-about__hero-support {
	font-family: var( --wp--preset--font-family--body );
	font-size: 18px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0;
}

.homefix-about__section {
	max-width: 700px;
	margin: 0 auto;
	padding: 40px 24px;
}

.homefix-about__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 26px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 14px;
}

.homefix-about__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 17px;
	line-height: 1.65;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0;
}

.homefix-about__link {
	margin: 16px 0 0;
}

.homefix-about__link a {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 15px;
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 3px;
}

.homefix-about__section--care {
	max-width: 700px;
}

.homefix-about__care-compare.wp-block-columns {
	gap: 32px;
	margin: 0 0 8px;
}

.homefix-about__care-label {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 18px;
	line-height: 1.3;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 8px;
}

.homefix-about__care-desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.8;
	margin: 0;
}

.homefix-about__cta {
	max-width: 1200px;
	margin: 56px auto 88px;
	padding: 72px 40px;
	background: var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--card, 16px );
	text-align: center;
}

.homefix-about__cta-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: var( --wp--preset--color--background );
	margin: 0 0 10px;
}

.homefix-about__cta-desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16px;
	line-height: 1.6;
	color: var( --wp--preset--color--background );
	opacity: 0.85;
	margin: 0 0 24px;
}

.homefix-about__cta-actions.wp-block-buttons {
	justify-content: center;
}

.homefix-about__cta-phone.wp-block-button .wp-block-button__link {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 16px;
	background-color: var( --wp--preset--color--background );
	color: var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--button, 9px );
	min-height: var( --wp--custom--tap-target-min, 44px );
	padding-inline: 32px;
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	transition: background-color 0.15s ease, transform 0.15s ease;
}

.homefix-about__cta-phone.wp-block-button .wp-block-button__link:hover {
	background-color: var( --wp--preset--color--surface-alt );
	transform: translateY( -1px );
}

.homefix-about__cta-phone.wp-block-button .wp-block-button__link:focus-visible {
	outline: 2px solid var( --wp--preset--color--background );
	outline-offset: 3px;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-about__cta-phone.wp-block-button .wp-block-button__link {
		transition: none;
	}
}

@media ( max-width: 780px ) {
	.homefix-about__hero {
		padding: 56px 16px 4px;
	}

	.homefix-about__hero-title {
		font-size: 30px;
	}

	.homefix-about__hero-support {
		font-size: 16px;
	}

	.homefix-about__section {
		padding: 28px 16px;
	}

	.homefix-about__title {
		font-size: 22px;
	}

	.homefix-about__desc {
		font-size: 16px;
	}

	.homefix-about__care-compare.wp-block-columns {
		flex-wrap: wrap;
		gap: 24px;
	}

	.homefix-about__care-col {
		flex-basis: 100%;
	}

	.homefix-about__cta {
		margin: 32px 16px 56px;
		padding: 48px 24px;
	}

	.homefix-about__cta-title {
		font-size: 26px;
	}
}

/* ==========================================================================
   HomeFix Interaktywny Problem Selector — V3.1 PRODUCTION CANDIDATE
   (2026-09-10). Accordion natywny <details>/<summary> — ta sama
   konwencja co FAQ (zero custom JS wymaganego do działania, patrz
   docblock w block-patterns.php). Konsumuje wyłącznie zamrożone
   tokeny z theme.json.
   ========================================================================== */

.homefix-selector__title-main {
	max-width: 1280px;
	margin: 0 auto 8px;
	padding: 72px 24px 0;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	text-align: center;
	scroll-margin-top: 90px;
}

.homefix-selector__intro {
	max-width: 560px;
	margin: 0 auto 40px;
	padding: 0 24px;
	font-size: 15.5px;
	color: var( --homefix-stone-accessible );
	text-align: center;
}

.homefix-selector__grid {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px 24px;
	display: grid;
	grid-template-columns: repeat( 4, 1fr );
	gap: 16px;
}

.homefix-selector__card {
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	background: #fff;
	box-shadow: 0 1px 3px rgba( 27, 36, 32, 0.08 );
	border: 2px solid transparent;
}

.homefix-selector__card[open] {
	border-color: var( --wp--preset--color--petrol );
	box-shadow: 0 20px 36px -16px rgba( 27, 75, 84, 0.35 );
}

.homefix-selector__head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	list-style: none;
	cursor: pointer;
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-selector__head::-webkit-details-marker {
	display: none;
}

.homefix-selector__head:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
	border-radius: 4px;
}

.homefix-selector__thumb {
	/* FIX (WOW MOTION PASS, 2026-09-19, znaleziony w realnej przeglądarce):
	   przed dodaniem `.homefix-selector__thumb-wrap` ten <span> był
	   BEZPOŚREDNIM dzieckiem flex kontenera `.homefix-selector__head`,
	   więc CSS "blockification" flex itemów sprawiało, że width/height
	   faktycznie działały mimo braku jawnego `display`. Owinięcie go w
	   `.homefix-selector__thumb-wrap` (potrzebne pod odznakę motywu)
	   uczyniło TEN span zwykłym, zagnieżdżonym elementem inline —
	   width/height/overflow nie mają żadnego efektu na elementach
	   inline, więc obrazek renderował się w swoim natywnym rozmiarze
	   (1376×768) zamiast 52×52. Jawny `display: inline-block` naprawia
	   to niezależnie od tego, czy element jest bezpośrednim flex itemem. */
	display: inline-block;
	width: 52px;
	height: 52px;
	border-radius: 8px;
	overflow: hidden;
	flex-shrink: 0;
	background: var( --wp--preset--color--surface-alt );
}

.homefix-selector__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.homefix-selector__thumb--icon {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var( --wp--preset--color--petrol );
}

.homefix-selector__thumb--icon svg {
	width: 26px;
	height: 26px;
}

/* ---------- Motyw kategorii — mikroanimacja per kategoria (WOW MOTION
   PASS, 2026-09-19, brief §3). Reużywa dokładnie te same ścieżki SVG co
   `$cat['icon']` (homepage-data.php) — zero nowych assetów. Odznaka jest
   widoczna zawsze (subtelny stały akcent), a WŁASNY, charakterystyczny
   ruch per kategoria odgrywa się WYŁĄCZNIE na hover/focus-within karty —
   świadomie nie w nieskończonej pętli (8 równoczesnych looping animacji
   na ekranie kosztowałoby więcej baterii/CPU niż warte, brief §8). ---------- */
.homefix-selector__thumb-wrap {
	display: inline-block;
	position: relative;
	flex-shrink: 0;
}

.homefix-selector__motif {
	position: absolute;
	bottom: -5px;
	right: -5px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var( --wp--preset--color--petrol );
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0 0 2px var( --wp--preset--color--background );
}

.homefix-selector__motif svg {
	width: 12px;
	height: 12px;
}

.homefix-selector__card:hover .homefix-selector__motif svg,
.homefix-selector__card:focus-within .homefix-selector__motif svg {
	animation-duration: var( --hf-dur-ui-slow );
	animation-timing-function: var( --hf-ease );
	animation-fill-mode: both;
}

@keyframes hf-motif-hydraulika {
	0% { transform: translateY( 0 ); opacity: 1; }
	45% { transform: translateY( 3px ); opacity: 0.65; }
	75% { transform: translateY( -1px ); opacity: 1; }
	100% { transform: translateY( 0 ); opacity: 1; }
}

.homefix-selector__card:hover [data-motif="hydraulika"] svg,
.homefix-selector__card:focus-within [data-motif="hydraulika"] svg {
	animation-name: hf-motif-hydraulika;
}

@keyframes hf-motif-elektryka {
	0%, 100% { opacity: 1; }
	20% { opacity: 0.3; }
	38% { opacity: 1; }
	56% { opacity: 0.45; }
	74% { opacity: 1; }
}

.homefix-selector__card:hover [data-motif="elektryka"] svg,
.homefix-selector__card:focus-within [data-motif="elektryka"] svg {
	animation-name: hf-motif-elektryka;
}

@keyframes hf-motif-snap {
	0% { transform: scale( 1.3 ) rotate( -10deg ); opacity: 0.55; }
	100% { transform: scale( 1 ) rotate( 0deg ); opacity: 1; }
}

.homefix-selector__card:hover [data-motif="montaz"] svg,
.homefix-selector__card:focus-within [data-motif="montaz"] svg {
	animation-name: hf-motif-snap;
}

@keyframes hf-motif-settle {
	0% { transform: translateY( -5px ); opacity: 0.5; }
	100% { transform: translateY( 0 ); opacity: 1; }
}

.homefix-selector__card:hover [data-motif="naprawy-domowe"] svg,
.homefix-selector__card:focus-within [data-motif="naprawy-domowe"] svg {
	animation-name: hf-motif-settle;
}

.homefix-selector__motif[data-motif="kanalizacja"] svg path:last-child {
	stroke-dasharray: 3 2.5;
}

@keyframes hf-motif-flow {
	0% { stroke-dashoffset: 0; }
	100% { stroke-dashoffset: -11; }
}

.homefix-selector__card:hover [data-motif="kanalizacja"] svg path:last-child,
.homefix-selector__card:focus-within [data-motif="kanalizacja"] svg path:last-child {
	animation: hf-motif-flow var( --hf-dur-ui-slow ) linear;
}

@keyframes hf-motif-pulse {
	0%, 100% { transform: scale( 1 ); }
	50% { transform: scale( 1.22 ); }
}

.homefix-selector__card:hover [data-motif="gaz"] svg,
.homefix-selector__card:focus-within [data-motif="gaz"] svg {
	animation-name: hf-motif-pulse;
	animation-iteration-count: 2;
}

.homefix-selector__motif[data-motif="mycie-cisnieniowe"]::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: linear-gradient( 100deg, transparent 42%, rgba( 255, 255, 255, 0.75 ) 50%, transparent 58% );
	opacity: 0;
	transform: translateX( -130% );
}

.homefix-selector__card:hover [data-motif="mycie-cisnieniowe"]::after,
.homefix-selector__card:focus-within [data-motif="mycie-cisnieniowe"]::after {
	animation: hf-motif-sweep var( --hf-dur-ui-slow ) var( --hf-ease );
}

@keyframes hf-motif-sweep {
	0% { transform: translateX( -130% ); opacity: 0.9; }
	100% { transform: translateX( 130% ); opacity: 0; }
}

@keyframes hf-motif-clean {
	0% { filter: brightness( 0.55 ) saturate( 0.6 ); }
	100% { filter: brightness( 1.15 ) saturate( 1 ); }
}

.homefix-selector__card:hover [data-motif="sprzatanie"] svg,
.homefix-selector__card:focus-within [data-motif="sprzatanie"] svg {
	animation-name: hf-motif-clean;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-selector__motif svg,
	.homefix-selector__motif[data-motif="kanalizacja"] svg path:last-child,
	.homefix-selector__motif::after {
		animation: none !important;
	}
}

.homefix-selector__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 15.5px;
	color: var( --wp--preset--color--petrol );
	flex: 1;
}

.homefix-selector__chevron {
	width: 18px;
	height: 18px;
	color: var( --homefix-stone-accessible );
	transition: transform 220ms ease;
	flex-shrink: 0;
}

.homefix-selector__card[open] .homefix-selector__chevron {
	transform: rotate( 180deg );
	color: var( --wp--preset--color--petrol );
}

.homefix-selector__panel {
	padding: 0 16px 16px;
}

.homefix-selector__desc {
	font-size: 13.5px;
	line-height: 1.5;
	color: var( --wp--preset--color--ink );
	margin: 0 0 12px;
}

.homefix-selector__chip {
	display: inline-block;
	font-size: 12px;
	background: var( --wp--preset--color--surface-alt );
	color: var( --wp--preset--color--ink );
	padding: 6px 10px;
	border-radius: 999px;
	font-weight: 600;
	text-decoration: none;
	margin: 0 6px 6px 0;
}

.homefix-selector__chip:hover,
.homefix-selector__chip:focus-visible {
	background: var( --wp--preset--color--petrol );
	color: #fff;
}

.homefix-selector__panel-cta {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin-top: 12px;
}

.homefix-selector__archive-link {
	font-size: 12.5px;
	font-weight: 700;
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media ( max-width: 980px ) {
	.homefix-selector__grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( max-width: 560px ) {
	.homefix-selector__grid {
		grid-template-columns: 1fr;
	}

	.homefix-selector__title-main {
		font-size: 26px;
		padding-top: 56px;
	}
}

/* ==========================================================================
   HomeFix Cennik orientacyjny (Pricing) — V3.1 PRODUCTION CANDIDATE
   (2026-09-10). Rate-list zamiast siatki kart. Zawiera jawny
   staging-only notice (brief V3.1 §7). Konsumuje wyłącznie zamrożone
   tokeny z theme.json.
   ========================================================================== */

.homefix-pricing-section {
	max-width: 1280px;
	margin: 0 auto;
	padding: 72px 24px;
}

.homefix-pricing__head {
	max-width: 680px;
	margin: 0 auto 24px;
	text-align: center;
}

.homefix-pricing__eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 12px;
}

.homefix-pricing__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 14px;
}

.homefix-pricing__intro {
	font-size: 15.5px;
	line-height: 1.6;
	color: var( --homefix-stone-accessible );
	margin: 0;
}

/* PRICING — FINALNA ARCHITEKTURA (2026-09-15): statyczny cennik
   per-kategoria ("od 149 zł") wycofany — zbyt wysokie ryzyko, że klient
   odczyta pierwszą opłatę jako cenę całej naprawy. Sekcja opisuje
   wyłącznie zasadę dwuetapowej płatności. `.homefix-price-row`/
   `.homefix-price-list`/`.homefix-pricing__staging-notice` poniżej nie
   są już emitowane przez PHP (homefix_child_get_pricing_pattern_content())
   — zostawione jako udokumentowany, nieużywany kod na wypadek powrotu
   do wariantu z kotwicą cenową, zgodnie z przyjętą w tym projekcie
   praktyką (patrz podobny przypadek w service-pages.php). */
.homefix-price-steps {
	max-width: 900px;
	margin: 0 auto 32px;
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 24px;
}

.homefix-price-step {
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 28px 26px;
	text-align: left;
}

.homefix-price-step__label {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 18px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 10px;
}

.homefix-price-step__desc {
	font-size: 14.5px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0;
}

.homefix-pricing__principle {
	max-width: 720px;
	margin: 0 auto;
	text-align: center;
	font-size: 14.5px;
	line-height: 1.6;
	font-weight: 600;
	color: var( --wp--preset--color--ink );
}

@media ( max-width: 640px ) {
	.homefix-price-steps {
		grid-template-columns: 1fr;
	}
}

.homefix-demo-tag {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	background: var( --wp--preset--color--brass );
	color: #fff;
	padding: 2px 7px;
	border-radius: 4px;
	vertical-align: middle;
	margin-left: 8px;
}

.homefix-pricing__staging-notice {
	max-width: 720px;
	margin: 0 auto 40px;
	text-align: center;
	font-size: 13px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	background: var( --wp--preset--color--surface-alt );
	padding: 14px 20px;
	border-radius: 10px;
	border: 1px solid rgba( 27, 36, 32, 0.1 );
}

.homefix-price-list {
	max-width: 900px;
	margin-inline: auto;
	border-top: 1px solid var( --wp--preset--color--ink );
}

.homefix-price-row {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: baseline;
	gap: 20px;
	padding: 22px 4px;
	border-bottom: 1px solid var( --wp--preset--color--surface-alt );
}

.homefix-price-row__left {
	display: flex;
	align-items: baseline;
	gap: 14px;
	flex-wrap: wrap;
}

.homefix-price-row__name {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 19px;
	color: var( --wp--preset--color--petrol );
}

.homefix-price-row__includes {
	font-size: 12.5px;
	color: var( --homefix-stone-accessible );
}

.homefix-price-row__right {
	white-space: nowrap;
}

.homefix-price-row__amount {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 28px;
	color: var( --wp--preset--color--ink );
}

.homefix-price-row__prefix {
	font-size: 12px;
	font-weight: 600;
	color: var( --homefix-stone-accessible );
	margin-right: 4px;
}

@media ( max-width: 640px ) {
	.homefix-price-row {
		grid-template-columns: 1fr;
		gap: 8px;
	}

	.homefix-price-row__left {
		flex-direction: column;
		gap: 2px;
	}
}

@media ( max-width: 780px ) {
	.homefix-pricing-section {
		padding: 56px 20px;
	}

	.homefix-pricing__title {
		font-size: 26px;
	}
}

/* ==========================================================================
   HomeFix CTA System — V3.1 PRODUCTION CANDIDATE (2026-09-10).
   `.homefix-cta-seam` = primary CTA "Zgłoś problem", świadomie
   `disabled`, uczciwa etykieta "Już wkrótce" (patrz docblock
   `homefix_child_get_intake_cta_seam()`). Reużywany w Hero, Final CTA,
   Selector (wariant mniejszy), Priority, Payment Journey. Kolor Brass
   spójny z resztą serwisu — WYŁĄCZONY wygląd sygnalizowany wyłącznie
   przez `cursor:not-allowed` + odznakę, nie przez wyblakły kolor (co
   czytałoby się jako "błąd renderowania", nie jako świadomy stan).
   ========================================================================== */

.homefix-cta-seam__btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var( --wp--preset--color--brass );
	color: #fff;
	font-family: inherit;
	font-weight: 700;
	font-size: 15.5px;
	padding: 15px 24px;
	border-radius: var( --wp--custom--radius--button, 9px );
	border: none;
	cursor: not-allowed;
	text-decoration: none;
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-cta-seam__badge {
	position: absolute;
	top: -9px;
	right: -8px;
	background: var( --wp--preset--color--ink );
	color: #fff;
	font-size: 9.5px;
	font-weight: 700;
	letter-spacing: 0.03em;
	padding: 3px 8px;
	border-radius: 999px;
	white-space: nowrap;
}

.homefix-selector__panel-cta .homefix-cta-seam__btn {
	font-size: 12.5px;
	padding: 9px 14px;
}

.cta-row {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
}

/* BUG FOUND DURING QA (FINAL PRODUCT EXPERIENCE PASS, 2026-09-15):
   `color: inherit` resolved to the default body text color (near-black)
   on all 3 real usages of this class (Priority Selector, Payment
   Journey, "Zamów fachowca online w kilku krokach") — every one of them
   sits on a dark (Ink/Petrol Deep) section background, so the link was
   effectively invisible (contrast ~1:1). Fixed with the same light
   color already used for this exact "secondary link on dark
   background" pattern elsewhere (Hero/Final CTA secondary phone link). */
.homefix-secondary-call {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var( --wp--preset--color--background );
	font-weight: 700;
	font-size: 14.5px;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.homefix-secondary-call:focus-visible {
	outline: 2px solid var( --wp--preset--color--background );
	outline-offset: 3px;
}

/* ==========================================================================
   HomeFix Care — upgrade wizualny (V3.1 PRODUCTION CANDIDATE,
   2026-09-10). WYŁĄCZNIE CSS — markup/CTA/hierarchia bez zmian
   (sekcja pozostaje secondary względem primary "Zgłoś problem", zgodnie
   z HOMEFIX VISUAL SYSTEM V1.4 "HomeCare nigdy wizualnie na równi z
   Zamów fachowca" — patrz oryginalny docblock tej sekcji). Delikatny
   "premium panel" (subtelny cień + zaokrąglenie), bez zmiany koloru
   tła/typografii/CTA.
   ========================================================================== */

.homefix-homecare-section {
	box-shadow: 0 30px 60px -30px rgba( 27, 75, 84, 0.25 );
	border-radius: var( --wp--custom--radius--card, 16px );
	border-top: 3px solid var( --wp--preset--color--petrol );
}

/* PRODUCT EXPERIENCE PASS (2026-09-15): eyebrow przestaje być zwykłą
   podpisaną etykietą tekstową — staje się małą odznaką produktu, żeby
   sekcja czytała się jako wejście do osobnego produktu, nie akapit
   informacyjny. Kolor Petrol (nigdy Brass — Brass zarezerwowany dla
   "Zamów fachowca online"), zgodnie z zasadą "HomeCare nigdy wizualnie
   na równi z primary CTA klienta". */
.homefix-homecare__eyebrow {
	display: inline-block;
	background: var( --wp--preset--color--petrol );
	color: #fff;
	padding: 5px 14px;
	border-radius: 999px;
	letter-spacing: 0.04em;
}

/* ==========================================================================
   HomeFix Sticky Mobile CTA — V3.1 PRODUCTION CANDIDATE (2026-09-10).
   Odzwierciedla docelową hierarchię (primary = zgłoszenie online,
   disabled + "Już wkrótce"; secondary = telefon, realnie działający)
   na małych ekranach, gdzie Hero CTA może być poza pierwszym
   wrażeniem po dłuższym scrollu. Renderowana wyłącznie na stronie
   głównej (patrz functions.php, front-page only) przez
   `wp_footer` — nie wchodzi w konflikt z istniejącym stopka/nawigacją.
   ========================================================================== */

.homefix-sticky-cta {
	display: none;
}

@media ( max-width: 600px ) {
	.homefix-sticky-cta {
		display: grid;
		grid-template-columns: 1.3fr 1fr;
		gap: 1px;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 500;
		box-shadow: 0 -8px 24px rgba( 0, 0, 0, 0.18 );
		padding-bottom: env( safe-area-inset-bottom, 0 );
	}

	.homefix-sticky-cta__primary {
		background: var( --wp--preset--color--brass );
		color: #fff;
		text-align: center;
		padding: 12px 6px;
		font-weight: 700;
		font-size: 13px;
		font-family: inherit;
		border: none;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 1px;
		cursor: not-allowed;
	}

	.homefix-sticky-cta__primary-sub {
		font-size: 8.5px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: 0.03em;
		opacity: 0.85;
	}

	.homefix-sticky-cta__call {
		background: var( --wp--preset--color--petrol );
		color: #fff;
		text-align: center;
		padding: 12px 6px;
		font-weight: 700;
		font-size: 12.5px;
		text-decoration: none;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		white-space: nowrap;
	}

	/* Padding tylko na stronach, które FAKTYCZNIE renderują sticky bar
	   (front page) — bez :has() reguła dotyczyłaby też np. stron usług,
	   gdzie sticky bar nie istnieje, zostawiając niepotrzebny pusty pas
	   na dole. */
	body:has( .homefix-sticky-cta ) {
		padding-bottom: 58px;
	}
}

/* ==========================================================================
   HomeFix "Zamów fachowca online w kilku krokach" — FINAL PRODUCT
   EXPERIENCE PASS (2026-09-15). Kontynuuje "dark system" beat
   (Priority Ink → Journey Ink → TA SEKCJA Ink → Payment Petrol Deep) —
   tematycznie to nadal część tej samej podróży klienta przez lejek, więc
   4. ciemna sekcja z rzędu pasuje lepiej niż jasna wstawka między dwoma
   ciemnymi. Mockup aplikacji celowo w jasnych tokenach (Background/
   Surface-alt/Petrol/Brass) — kontrastuje z ciemnym tłem sekcji jak
   prawdziwy zrzut ekranu prezentowany na ciemnym tle marketingowym.
   ========================================================================== */

.homefix-online-flow-section {
	position: relative;
	z-index: 0;
	max-width: 1280px;
	margin-inline: auto;
	padding: 72px 24px;
}

.homefix-online-flow-section::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX( -50% );
	background-color: var( --wp--preset--color--ink );
	z-index: -1;
}

.homefix-online-flow__head {
	max-width: 760px;
	margin: 0 auto 48px;
	text-align: center;
}

.homefix-online-flow__eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 12px;
}

.homefix-online-flow__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: #fff;
	margin: 0;
}

.homefix-online-flow__grid {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 48px;
	align-items: center;
	max-width: 1120px;
	margin: 0 auto;
}

.homefix-online-flow__steps {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.homefix-online-flow__step {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.homefix-online-flow__num {
	flex: 0 0 auto;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: var( --wp--preset--color--brass );
	color: #fff;
	font-weight: 700;
	font-size: 13.5px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.homefix-online-flow__step-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 16px;
	color: #fff;
	margin: 0 0 4px;
}

/* "Płatność 1"/"Płatność 2" wyróżnione Brass + grubszą wagą, żeby czytelnik
   wyłapał wzrokiem "to są dwa różne momenty płatności" przed przeczytaniem
   całego zdania (UX fix, 2026-09-15). */
.homefix-online-flow__step-prefix {
	color: var( --wp--preset--color--brass );
	font-weight: 800;
}

.homefix-online-flow__step-desc {
	font-size: 13.5px;
	line-height: 1.55;
	color: rgba( 244, 242, 234, 0.75 );
	margin: 0;
}

/* "TO NIE JEST CENA NAPRAWY" — wymaganie właściciela: NIE mała odznaka,
   pełnoszerokościowy wypełniony pasek, żeby był zauważony natychmiast
   przy Etapie 2/Płatności 1. Warning (nie Error — ten zarezerwowany
   wyłącznie dla Gaz Safety Module). */
.homefix-online-flow__warning {
	display: block;
	background: var( --wp--preset--color--warning );
	color: #fff;
	font-weight: 700;
	font-size: 14.5px;
	padding: 10px 14px;
	border-radius: 8px;
	margin: 12px 0 0;
}

.homefix-online-flow__mockup {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
}

.homefix-online-flow__mockup-badge {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	background: var( --wp--preset--color--warning );
	color: #fff;
	padding: 5px 12px;
	border-radius: 999px;
}

.homefix-app-mock {
	width: 100%;
	max-width: 340px;
	background: var( --wp--preset--color--background );
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	box-shadow: 0 24px 48px rgba( 0, 0, 0, 0.35 );
}

.homefix-app-mock__bar {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 12px 16px;
	background: var( --wp--preset--color--surface-alt );
}

.homefix-app-mock__bar span:not( .homefix-app-mock__bar-name ) {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var( --homefix-stone-accessible );
	opacity: 0.4;
}

.homefix-app-mock__bar-name {
	margin-left: auto;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 13px;
	color: var( --wp--preset--color--petrol );
}

.homefix-app-mock__body {
	padding: 22px 20px 24px;
	text-align: left;
}

.homefix-app-mock__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 16px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 6px;
}

.homefix-app-mock__problem {
	font-size: 13.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.8;
	margin: 0 0 10px;
}

.homefix-app-mock__mode {
	display: inline-block;
	font-size: 11.5px;
	font-weight: 700;
	background: var( --wp--preset--color--surface-alt );
	color: var( --wp--preset--color--petrol );
	padding: 4px 10px;
	border-radius: 999px;
	margin-bottom: 14px;
}

.homefix-app-mock__pay {
	background: rgba( 137, 92, 37, 0.08 );
	border: 1px solid rgba( 137, 92, 37, 0.25 );
	border-radius: 10px;
	padding: 12px 14px;
	margin-bottom: 12px;
}

.homefix-app-mock__pay-label {
	display: block;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: var( --wp--preset--color--brass );
	margin-bottom: 4px;
}

/* "Nie obejmuje kosztu naprawy" wewnątrz mockupu Płatności 1 — świadomie
   ten sam Warning-fill / biały bold tekst co `.homefix-online-flow__warning`
   po lewej (Etap 2), nie osobny, słabszy styl: to najważniejsze jedno
   zdanie w całej sekcji i musi być widoczne tak samo mocno w obu miejscach.
   Zastępuje usuniętą (2026-09-15) `.homefix-app-mock__pay-amount`, która
   pokazywała przykładowe kwoty "149 zł"/"320 zł" oznaczone DEMO. */
.homefix-app-mock__warning {
	display: block;
	text-align: center;
	background: var( --wp--preset--color--warning );
	color: #fff;
	font-weight: 700;
	font-size: 13px;
	padding: 10px 14px;
	border-radius: 8px;
	margin: 0 0 14px;
}

.homefix-app-mock__note {
	font-size: 12px;
	color: var( --homefix-stone-accessible );
	margin: 0 0 16px;
}

.homefix-app-mock__btn {
	display: block;
	text-align: center;
	background: var( --wp--preset--color--brass );
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	padding: 12px;
	border-radius: var( --wp--custom--radius--button, 9px );
}

.homefix-online-flow__mockup-caption {
	font-size: 13px;
	font-style: italic;
	color: rgba( 244, 242, 234, 0.65 );
	margin: 0;
	text-align: center;
}

/* Łącznik między dwiema kartami mockupu — pokazuje, że Płatność 1 i
   Płatność 2 to dwa różne momenty w czasie (wizyta fachowca pomiędzy),
   nie jeden ciągły ekran. */
.homefix-online-flow__connector {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
}

.homefix-online-flow__connector-arrow {
	font-size: 20px;
	line-height: 1;
	color: var( --wp--preset--color--brass );
}

.homefix-online-flow__connector-label {
	font-size: 12px;
	font-weight: 600;
	color: rgba( 244, 242, 234, 0.65 );
	text-align: center;
}

.homefix-online-flow__summary {
	max-width: 760px;
	margin: 40px auto 0;
	text-align: center;
	font-size: 15.5px;
	font-weight: 600;
	line-height: 1.6;
	color: #fff;
	background: rgba( 244, 242, 234, 0.08 );
	border: 1px solid rgba( 244, 242, 234, 0.2 );
	border-left: 4px solid var( --wp--preset--color--brass );
	border-radius: 10px;
	padding: 18px 24px;
}

.homefix-online-flow__cta-row {
	justify-content: center;
	margin-top: 32px;
}

@media ( max-width: 900px ) {
	.homefix-online-flow__grid {
		grid-template-columns: 1fr;
	}

	.homefix-online-flow__mockup {
		order: -1;
		margin-bottom: 8px;
	}
}

@media ( max-width: 780px ) {
	.homefix-online-flow-section {
		padding: 56px 20px;
	}

	.homefix-online-flow__title {
		font-size: 26px;
	}
}

/* ==========================================================================
   HomeFix Payment Journey — V3.1 PRODUCTION CANDIDATE (2026-09-10).
   4 fazy / 2 płatności, bez kwot (patrz docblock w block-patterns.php).
   Tło Petrol Deep (#123339) — lokalny, jednorazowy odcień Petrol
   WYŁĄCZNIE dla tej sekcji (nie nowy token w theme.json, design system
   V1.3 pozostaje zamrożony), żeby domknąć "dark system" (Priority Ink
   → Journey Ink → Payment Petrol Deep) z lekką wizualną odmianą.
   ========================================================================== */

.homefix-payflow-section {
	position: relative;
	z-index: 0;
	max-width: 1280px;
	margin-inline: auto;
	padding: 72px 24px;
	text-align: center;
}

.homefix-payflow-section::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 100vw;
	transform: translateX( -50% );
	background-color: #123339;
	z-index: -1;
}

.homefix-payflow__eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 12px;
}

.homefix-payflow__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.2;
	color: #fff;
	margin: 0 0 14px;
}

.homefix-payflow__intro {
	max-width: 640px;
	margin: 0 auto 40px;
	font-size: 15px;
	line-height: 1.6;
	color: rgba( 244, 242, 234, 0.78 );
}

.homefix-payflow__grid {
	max-width: 1200px;
	margin: 0 auto 32px;
	display: grid;
	grid-template-columns: repeat( 4, 1fr );
	gap: 16px;
	text-align: left;
}

.homefix-phase-card {
	background: rgba( 244, 242, 234, 0.06 );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 22px 20px;
	border: 1px solid rgba( 244, 242, 234, 0.14 );
}

.homefix-phase-card__num {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 13px;
	color: rgba( 244, 242, 234, 0.78 );
	margin-bottom: 10px;
}

.homefix-phase-card__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 16px;
	color: #fff;
	margin-bottom: 10px;
	line-height: 1.3;
}

.homefix-phase-card__sub {
	font-size: 12.5px;
	line-height: 1.5;
	color: rgba( 244, 242, 234, 0.78 );
	margin: 0;
}

.homefix-phase-card__pay {
	display: inline-block;
	margin-top: 12px;
	background: var( --wp--preset--color--brass );
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	padding: 5px 10px;
	border-radius: 6px;
}

.homefix-payflow__cta-row {
	justify-content: center;
}

.homefix-payflow-section .homefix-secondary-call {
	color: #fff;
}

@media ( max-width: 900px ) {
	.homefix-payflow__grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

@media ( max-width: 780px ) {
	.homefix-payflow-section {
		padding: 56px 20px;
	}

	.homefix-payflow__title {
		font-size: 26px;
	}
}

@media ( max-width: 560px ) {
	.homefix-payflow__grid {
		grid-template-columns: 1fr;
	}
}

.homefix-selector__cta-link {
	font-size: 12.5px;
	font-weight: 700;
	color: #fff;
	background: var( --wp--preset--color--brass );
	padding: 9px 14px;
	border-radius: var( --wp--custom--radius--button, 9px );
	text-decoration: none;
}

/* ==========================================================================
   HomeFix Współpraca — zapowiedź B2B na homepage (HOMEFIX SERVICE AREA
   + PARTNER RECRUITMENT UPDATE, 2026-09-10). PRZEBUDOWANE WIZUALNIE
   (UX/UI + FRONTEND QA PASS, 2026-09-15): z płaskiego, jednokolumnowego
   boxu → 2 kolumny (ilustracja SVG / treść), odwrotny układ względem
   HomeFix Care (tekst-lewo/obraz-prawo) dla wizualnej odmiany rytmu
   strony. CTA primary nadal = Petrol OUTLINE (nie wypełniony Brass) —
   nigdy nie konkuruje wizualnie z `.homefix-cta-seam` klienta. Przyciski
   to teraz zwykłe klasowe `<a>`, nie bloki `wp:button` — celowo, żeby
   uniknąć całej klasy konfliktów specyficzności z domyślnym resetem
   przycisku GeneratePress (`a.wp-block-button__link:not(.has-background)`),
   który wcześniej po cichu wygrywał nad tłem/kolorem tych przycisków
   (błąd znaleziony i załatany w poprzedniej turze, patrz historia
   commitów) — nowe klasy nie mają w ogóle `wp-block-button__link`, więc
   selektor GP nigdy ich nie dotyczy. Konsumuje wyłącznie zamrożone
   tokeny z theme.json.
   ========================================================================== */

.homefix-partner-teaser-section {
	max-width: 1100px;
	margin: 64px auto;
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	background: rgba( 27, 75, 84, 0.1 );
	border: 1px solid rgba( 27, 75, 84, 0.3 );
}

.homefix-partner-teaser__inner {
	display: grid;
	grid-template-columns: 48% 1fr;
	align-items: stretch;
}

/*
 * PRZYGOTOWANE POD DOCELOWY OBRAZ (2026-09-15): kolumna zarezerwowana
 * przez `aspect-ratio`, NIE przez `min-height` w px — działa identycznie
 * niezależnie od tego, czy w środku jest dzisiejszy SVG (placeholder
 * developerski, patrz PHP) czy docelowe zdjęcie. Podmiana na finalny
 * asset = zamiana zawartości `.homefix-partner-teaser__visual` na
 * pojedynczy `<img>` (z `width`/`height`/`loading="lazy"` jak reszta
 * zdjęć na stronie) — sama klasa kontenera i te reguły CSS zostają bez
 * zmian, więc podmiana nie wymaga przebudowy sekcji ani nie powoduje
 * CLS (przestrzeń jest zarezerwowana przez `aspect-ratio` zanim
 * jakikolwiek obraz zdąży się wczytać).
 */
.homefix-partner-teaser__visual {
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
}

.homefix-partner-teaser__visual svg,
.homefix-partner-teaser__visual img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.homefix-partner-teaser__content {
	padding: 48px 44px;
}

.homefix-partner-teaser__eyebrow {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 12px;
}

.homefix-partner-teaser__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 28px;
	line-height: 1.25;
	color: var( --wp--preset--color--ink );
	margin: 0 0 12px;
}

.homefix-partner-teaser__desc {
	font-size: 15px;
	line-height: 1.6;
	color: var( --homefix-stone-accessible );
	max-width: 52ch;
	margin: 0 0 28px;
}

.homefix-partner-teaser__benefits {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 20px;
	margin: 0 0 32px;
}

.homefix-partner-teaser__benefit h3 {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 15.5px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 8px;
}

.homefix-partner-teaser__benefit p {
	font-size: 13.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0;
}

.homefix-partner-teaser__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px;
	margin-bottom: 18px;
}

.homefix-partner-teaser__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: inherit;
	font-weight: 700;
	font-size: 14px;
	text-decoration: none;
	transition: background-color 160ms ease, color 160ms ease;
}

.homefix-partner-teaser__btn--primary {
	background: none;
	color: var( --wp--preset--color--petrol );
	border: 1.5px solid var( --wp--preset--color--petrol );
	padding: 12px 22px;
	border-radius: var( --wp--custom--radius--button, 9px );
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-partner-teaser__btn--primary:hover,
.homefix-partner-teaser__btn--primary:focus-visible {
	background: var( --wp--preset--color--petrol );
	color: #fff;
}

.homefix-partner-teaser__btn--secondary {
	color: var( --homefix-stone-accessible );
	padding: 12px 4px;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.homefix-partner-teaser__btn:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
}

.homefix-partner-teaser__disclaimer {
	max-width: 56ch;
	margin: 0;
	font-size: 12px;
	line-height: 1.5;
	color: var( --homefix-stone-accessible );
	padding-top: 14px;
	border-top: 1px solid rgba( 27, 75, 84, 0.16 );
}

@media ( max-width: 900px ) {
	.homefix-partner-teaser__inner {
		grid-template-columns: 1fr;
	}

	.homefix-partner-teaser__visual {
		/* Stacked pod treścią (≤900px) — szerszy, "bannerowy" kadr zamiast
		   pionowego 4:5, żeby zdjęcie nie zajmowało nieproporcjonalnie
		   dużo wysokości ekranu na tablecie/mobile. Nadal `aspect-ratio`,
		   nie `min-height` w px — ta sama gwarancja zero-CLS po podmianie
		   na docelowy obraz. */
		aspect-ratio: 16 / 10;
	}

	.homefix-partner-teaser__content {
		padding: 36px 28px;
	}
}

@media ( max-width: 700px ) {
	.homefix-partner-teaser__benefits {
		grid-template-columns: 1fr;
	}
}

@media ( max-width: 600px ) {
	.homefix-partner-teaser__content {
		padding: 32px 20px;
	}

	.homefix-partner-teaser__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.homefix-partner-teaser__btn--primary {
		width: 100%;
	}

	.homefix-partner-teaser__btn--secondary {
		text-align: center;
	}
}

/* ==========================================================================
   HomeFix Partner Application Form (`/wspolpraca/`) — HOMEFIX PARTNER
   APPLICATION FORM V1 (2026-09-10). Multi-step, mobile-first, natywne
   kontrolki HTML + CSS-only chipy/toggle gdzie to możliwe (ten sam
   "native control + progresywne ulepszenie" duch co Priority Selector).
   Konsumuje wyłącznie zamrożone tokeny z theme.json.
   ========================================================================== */

.homefix-partner-page {
	max-width: 720px;
	margin: 0 auto;
	padding: 64px 24px 96px;
}

.homefix-partner-hero {
	text-align: center;
	margin-bottom: 48px;
}

.homefix-partner-hero__eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 14px;
}

.homefix-partner-hero__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 38px;
	line-height: 1.15;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 16px;
}

.homefix-partner-hero__subheadline {
	font-size: 16px;
	line-height: 1.6;
	color: var( --homefix-stone-accessible );
	max-width: 56ch;
	margin: 0 auto;
}

/* ----- Jak wygląda współpraca? (FINAL PRODUCT EXPERIENCE PASS, 2026-09-15) ----- */

.homefix-partner-how {
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 36px 32px;
	margin-bottom: 48px;
	scroll-margin-top: 24px;
}

.homefix-partner-how__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 22px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 20px;
	text-align: center;
}

.homefix-partner-how__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.homefix-partner-how__list li {
	display: flex;
	gap: 14px;
	align-items: flex-start;
}

.homefix-partner-how__num {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var( --wp--preset--color--petrol );
	color: #fff;
	font-weight: 700;
	font-size: 12.5px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.homefix-partner-how__list p {
	font-size: 14.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	margin: 0;
}

/* ----- Progress ----- */

.homefix-partner-form__progress {
	margin-bottom: 40px;
}

.homefix-partner-form__progress-label {
	display: block;
	font-size: 13px;
	font-weight: 700;
	color: var( --wp--preset--color--petrol );
	margin-bottom: 10px;
}

.homefix-partner-form__progress-bar {
	height: 4px;
	border-radius: 999px;
	background: var( --wp--preset--color--surface-alt );
	overflow: hidden;
}

.homefix-partner-form__progress-fill {
	height: 100%;
	width: 16.666%;
	background: linear-gradient( 90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass ) );
	transition: width 300ms ease;
}

/* ----- Honeypot (visually hidden, not display:none) ----- */

.homefix-partner-form__hp {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
	white-space: nowrap;
}

/* ----- Steps ----- */

.homefix-partner-form__step {
	display: none;
}

.homefix-partner-form__step.is-active {
	display: block;
	animation: homefix-partner-step-in 260ms ease;
}

@keyframes homefix-partner-step-in {
	from {
		opacity: 0;
		transform: translateY( 8px );
	}
	to {
		opacity: 1;
		transform: translateY( 0 );
	}
}

.homefix-partner-form__field {
	margin-bottom: 22px;
}

.homefix-partner-form__field label,
.homefix-partner-form__field-label {
	display: block;
	font-weight: 700;
	font-size: 14.5px;
	color: var( --wp--preset--color--ink );
	margin-bottom: 8px;
}

.homefix-partner-form__field-label small {
	font-weight: 500;
	color: var( --homefix-stone-accessible );
}

.homefix-partner-form__field input[type="text"],
.homefix-partner-form__field input[type="tel"],
.homefix-partner-form__field input[type="email"],
.homefix-partner-form__field textarea {
	width: 100%;
	font-family: inherit;
	font-size: 16px;
	color: var( --wp--preset--color--ink );
	background: #fff;
	border: 1.5px solid var( --wp--preset--color--surface-alt );
	border-radius: 10px;
	padding: 14px 16px;
	transition: border-color 160ms ease;
}

.homefix-partner-form__field textarea {
	resize: vertical;
	min-height: 90px;
}

.homefix-partner-form__field input:focus-visible,
.homefix-partner-form__field textarea:focus-visible {
	outline: none;
	border-color: var( --wp--preset--color--petrol );
}

.homefix-partner-form__field input:invalid:not(:placeholder-shown) {
	border-color: var( --wp--preset--color--error );
}

.homefix-partner-form__note {
	font-size: 13px;
	line-height: 1.5;
	color: var( --homefix-stone-accessible );
	background: var( --wp--preset--color--surface-alt );
	border-radius: 10px;
	padding: 12px 16px;
	margin: 0 0 22px;
}

.homefix-partner-form__legal-note {
	font-size: 12.5px;
	line-height: 1.55;
	color: var( --homefix-stone-accessible );
	margin-top: 16px;
}

/* ----- Chips (multi-select checkboxes) ----- */

.homefix-partner-form__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.homefix-partner-form__chip {
	position: relative;
}

.homefix-partner-form__chip input[type="checkbox"] {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect( 0, 0, 0, 0 );
}

.homefix-partner-form__chip label {
	display: inline-flex;
	align-items: center;
	font-weight: 600;
	font-size: 14px;
	color: var( --wp--preset--color--ink );
	background: #fff;
	border: 1.5px solid var( --wp--preset--color--surface-alt );
	border-radius: 999px;
	padding: 10px 18px;
	cursor: pointer;
	transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-partner-form__chip input:checked + label {
	background: var( --wp--preset--color--petrol );
	border-color: var( --wp--preset--color--petrol );
	color: #fff;
}

.homefix-partner-form__chip input:focus-visible + label {
	outline: 2px solid var( --wp--preset--color--brass );
	outline-offset: 2px;
}

/* ----- Toggles (single checkboxes: has_car, consents, etc.) ----- */

.homefix-partner-form__field--inline {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.homefix-partner-form__toggle {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.homefix-partner-form__toggle input[type="checkbox"] {
	appearance: none;
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	border: 1.5px solid var( --wp--preset--color--surface-alt );
	border-radius: 6px;
	background: #fff;
	cursor: pointer;
	position: relative;
	margin-top: 2px;
	transition: background-color 160ms ease, border-color 160ms ease;
}

.homefix-partner-form__toggle input[type="checkbox"]:checked {
	background: var( --wp--preset--color--petrol );
	border-color: var( --wp--preset--color--petrol );
}

.homefix-partner-form__toggle input[type="checkbox"]:checked::after {
	content: "";
	position: absolute;
	left: 6px;
	top: 2px;
	width: 6px;
	height: 11px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate( 45deg );
}

.homefix-partner-form__toggle input[type="checkbox"]:focus-visible {
	outline: 2px solid var( --wp--preset--color--brass );
	outline-offset: 2px;
}

.homefix-partner-form__toggle label {
	font-weight: 500;
	font-size: 14.5px;
	color: var( --wp--preset--color--ink );
	cursor: pointer;
}

/* ----- Summary (step 6) ----- */

.homefix-partner-form__summary {
	background: var( --wp--preset--color--surface-alt );
	border-radius: 14px;
	padding: 20px 22px;
	margin-bottom: 26px;
}

.homefix-partner-form__summary-list div {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 9px 0;
	border-bottom: 1px solid rgba( 27, 36, 32, 0.08 );
	font-size: 14px;
}

.homefix-partner-form__summary-list div:last-child {
	border-bottom: none;
}

.homefix-partner-form__summary-list dt {
	color: var( --homefix-stone-accessible );
	font-weight: 600;
}

.homefix-partner-form__summary-list dd {
	margin: 0;
	color: var( --wp--preset--color--ink );
	font-weight: 700;
	text-align: right;
}

/* ----- Error / nav / success ----- */

.homefix-partner-form__error {
	background: rgba( 168, 64, 44, 0.1 );
	color: var( --wp--preset--color--error );
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 14px;
	font-weight: 600;
	margin: 0 0 20px;
}

.homefix-partner-form__nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	margin-top: 32px;
}

.homefix-partner-form__prev,
.homefix-partner-form__next,
.homefix-partner-form__submit {
	font-family: inherit;
	font-weight: 700;
	font-size: 15px;
	border: none;
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 14px 28px;
	cursor: pointer;
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-partner-form__prev {
	background: none;
	color: var( --wp--preset--color--ink );
	text-decoration: underline;
	text-underline-offset: 3px;
	padding-left: 4px;
	padding-right: 4px;
}

.homefix-partner-form__next,
.homefix-partner-form__submit {
	background: var( --wp--preset--color--brass );
	color: #fff;
	margin-left: auto;
	transition: background-color 160ms ease;
}

.homefix-partner-form__next:hover,
.homefix-partner-form__submit:hover {
	background: var( --wp--custom--brass-hover, #744E20 );
}

.homefix-partner-form__submit:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.homefix-partner-form__prev:focus-visible,
.homefix-partner-form__next:focus-visible,
.homefix-partner-form__submit:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
}

.homefix-partner-form__success {
	text-align: center;
	padding: 48px 24px;
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
}

.homefix-partner-form__success h2 {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 26px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 12px;
}

.homefix-partner-form__success p {
	font-size: 15px;
	color: var( --wp--preset--color--ink );
	max-width: 48ch;
	margin: 0 auto;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-partner-form__step.is-active {
		animation: none;
	}

	.homefix-partner-form__progress-fill {
		transition: none;
	}
}

@media ( max-width: 600px ) {
	.homefix-partner-page {
		padding: 48px 20px 72px;
	}

	.homefix-partner-hero__title {
		font-size: 28px;
	}

	.homefix-partner-form__nav {
		flex-wrap: wrap;
	}

	.homefix-partner-form__next,
	.homefix-partner-form__submit {
		width: 100%;
		margin-left: 0;
	}

	.homefix-partner-form__prev {
		order: 2;
		margin: 0 auto;
	}
}


/* ==========================================================================
   HYDRAULIKA — flagowa strona archiwum kategorii (FINAL IMPLEMENTATION
   BLUEPRINT, 2026-09-13, zatwierdzony przez właściciela; VISUAL POLISH,
   2026-09-14, zatwierdzony przez właściciela — poprzednia wersja była
   technicznie gotowa, ale środek/dół strony czytały się zbyt
   dokumentowo/tekstowo). Namespace `.homefix-hydro-*` w całości nowy i
   osobny od `.homefix-svc-*` używanego przez pozostałych 7 kategorii —
   zero współdzielonych selektorów, zero ryzyka regresji na innych
   stronach. Wyłącznie zamrożone tokeny z theme.json (Petrol/Brass/
   Background/Surface-alt/Ink/Stone-accessible, Figtree/Work Sans,
   promienie 9px/16px).

   VISUAL POLISH — CELOWO WYŁĄCZNIE CSS: żaden PHP/markup w
   service-pages.php nie został dotknięty w tej turze — ten sam HTML
   co przed poprawką, wyłącznie inny wygląd. SEO/schema/treść/slugi
   nietknięte, zgodnie z briefem właściciela.
   ========================================================================== */

.homefix-hydro-page {
	max-width: 1280px;
	margin: 0 auto;
}

.homefix-hydro-section-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 26px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 20px;
}

/* ---------- Hero — PREMIUM REDESIGN, WARIANT TESTOWY (2026-09-15,
   zatwierdzony przez właściciela, tylko ta strona). Poprzednia wersja:
   symetryczny 55/45 split, płaski prostokąt 16:9, zbyt dużo pustego
   tła po lewej. Nowa wersja: tekst węższy (~44%) i skupiony, zdjęcie
   szersze (~56%) i portretowe (4:5), z przesuniętym Surface-alt
   panelem "zza" zdjęcia (warstwowy/overlap efekt zamiast płaskiego
   prostokąta) — patrz `.homefix-hydro-hero__media::before` niżej. H1
   nadal 40px, bez zmian (wyraźnie mocniejszy niż standardowe 36px na
   pozostałych kategoriach, celowo — flagowa strona). ---------- */
.homefix-hydro-hero {
	display: flex;
	align-items: center;
	gap: 56px;
	padding: 56px 24px 64px;
}

.homefix-hydro-hero__copy {
	flex: 1 1 44%;
	min-width: 0;
}

.homefix-hydro-hero__eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 16px;
}

.homefix-hydro-hero__heading {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 40px;
	line-height: 1.12;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 18px;
	max-width: 16ch;
}

.homefix-hydro-hero__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 17px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	max-width: 50ch;
	margin: 0 0 22px;
}

/* Proof points — 3 krótkie stwierdzenia, nie obietnice liczbowe/SLA,
   Brass-akcent zamiast klasycznego checkmarka (spójne z resztą
   systemu, gdzie Brass = "zwróć uwagę"/akcent, nie "zweryfikowane"). */
.homefix-hydro-hero__proof {
	list-style: none;
	margin: 0 0 30px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.homefix-hydro-hero__proof li {
	position: relative;
	padding-left: 22px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14.5px;
	color: var( --wp--preset--color--petrol );
}

.homefix-hydro-hero__proof li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 6px;
	width: 9px;
	height: 9px;
	border-radius: 3px;
	background: var( --wp--preset--color--brass );
}

.homefix-hydro-hero__ctas {
	display: flex;
	align-items: center;
	gap: 22px;
	flex-wrap: wrap;
}

.homefix-hydro-hero__phone {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14.5px;
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: opacity 160ms ease;
}

.homefix-hydro-hero__phone:hover,
.homefix-hydro-hero__phone:focus-visible {
	opacity: 0.72;
}

/* Warstwowy efekt: `.homefix-hydro-hero__media` jest tylko pozycjonującym
   kontenerem (bez overflow:hidden), żeby jego `::before` — przesunięty
   Surface-alt panel — mógł "wystawać" zza właściwej ramki zdjęcia
   zamiast być przycięty. Sama ramka/przycinanie/cień żyją w
   `.homefix-hydro-hero__media-frame` (nowy wewnętrzny wrapper). */
.homefix-hydro-hero__media {
	flex: 1 1 56%;
	min-width: 0;
	position: relative;
}

.homefix-hydro-hero__media::before {
	content: "";
	position: absolute;
	top: 22px;
	right: -22px;
	bottom: -22px;
	left: 22px;
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	z-index: 0;
}

.homefix-hydro-hero__media-frame {
	position: relative;
	z-index: 1;
	border-radius: 20px;
	overflow: hidden;
	aspect-ratio: 4 / 5;
	box-shadow: 0 28px 56px -18px rgba( 18, 51, 57, 0.32 );
}

.homefix-hydro-hero__picture,
.homefix-hydro-hero__picture img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---------- Rozpoznanie problemu — PREMIUM ROUTER (FALA 2, 2026-09-15).
   Kierunek bez zmian względem poprzedniej wersji (Petrol border + Surface-alt),
   wzmocniony: większy padding/gap, mocniejsza waga nazwy problemu (bliżej
   nagłówka niż etykiety), wyraźniejszy hover (tło + border + strzałka razem).
   Bez ikon, bez cienia — zgodnie z briefem. ---------- */
.homefix-hydro-recognize {
	padding: 8px 24px 64px;
}

.homefix-hydro-recognize__lead {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	color: var( --wp--preset--color--ink );
	opacity: 0.75;
	margin: -8px 0 24px;
}

/* GRID FIX (2026-09-15, zatwierdzone przez właściciela): `auto-fit` dawał
   nieregularny układ 4+2 zależnie od dostępnej szerokości ("wygląda
   przypadkowo") — zastąpione jawną liczbą kolumn per breakpoint: desktop
   3×2, tablet 2×3, mobile 1×6 (mobile — patrz `@media (max-width: 780px)`
   niżej, już istniejący, niezmieniony). Równa wysokość kart w obrębie
   wiersza to natywna właściwość CSS Grid (domyślne `align-items: stretch`
   na kontenerze) — nie wymaga dodatkowego CSS. */
.homefix-hydro-recognize__grid {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 16px;
}

@media ( min-width: 781px ) and ( max-width: 1023px ) {
	.homefix-hydro-recognize__grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

.homefix-hydro-recognize__card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: var( --wp--preset--color--surface-alt );
	border-left: 3px solid var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 20px 22px;
	min-height: var( --wp--custom--tap-target-min, 44px );
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 15.5px;
	color: var( --wp--preset--color--petrol );
	text-decoration: none;
	transition: transform 160ms ease, background-color 160ms ease, border-left-width 160ms ease;
}

.homefix-hydro-recognize__card:hover,
.homefix-hydro-recognize__card:focus-visible {
	background: var( --wp--preset--color--background );
	border-left-width: 5px;
	transform: translateX( 3px );
}

.homefix-hydro-recognize__card:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
}

.homefix-hydro-recognize__arrow {
	color: var( --wp--preset--color--brass );
	font-weight: 700;
	flex-shrink: 0;
	transition: transform 160ms ease;
}

.homefix-hydro-recognize__card:hover .homefix-hydro-recognize__arrow,
.homefix-hydro-recognize__card:focus-visible .homefix-hydro-recognize__arrow {
	transform: translateX( 4px );
}

/* ---------- Zakres usług — EDITORIAL PREMIUM LAYOUT (FALA 2, 2026-09-15).
   Kierunek z poprzedniej tury (2-kolumnowa siatka, Brass akcent, oddech
   zamiast obramowań) zostaje, wzmocniony numeracją redakcyjną — mały Brass
   znacznik "01"/"02"/... przez CSS counter, ten sam mechanizm co numery w
   "Jak działa HomeFix?" niżej, dla spójności systemu. Świadomie NIE 6
   ciężkich kart jak w Rozpoznaniu problemu wyżej — inny, bardziej
   redakcyjny charakter tej sekcji. ---------- */
.homefix-hydro-scope {
	padding: 8px 24px 64px;
}

.homefix-hydro-scope__list {
	counter-reset: hydro-scope;
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	column-gap: 56px;
}

.homefix-hydro-scope__list li {
	counter-increment: hydro-scope;
	border-bottom: 1px solid rgba( 27, 36, 32, 0.08 );
}

.homefix-hydro-scope__list a {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 28px 4px 26px;
	text-decoration: none;
}

.homefix-hydro-scope__list a::before {
	content: counter( hydro-scope, decimal-leading-zero );
	order: -1;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.08em;
	color: var( --wp--preset--color--brass );
}

.homefix-hydro-scope__list a:hover .homefix-hydro-scope__name,
.homefix-hydro-scope__list a:focus-visible .homefix-hydro-scope__name {
	color: var( --wp--preset--color--brass );
}

.homefix-hydro-scope__list a:hover .homefix-hydro-scope__name::before,
.homefix-hydro-scope__list a:focus-visible .homefix-hydro-scope__name::before {
	width: 20px;
	background: var( --wp--preset--color--brass );
}

.homefix-hydro-scope__list a:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
	border-radius: 4px;
}

.homefix-hydro-scope__name {
	position: relative;
	display: inline-block;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 19px;
	color: var( --wp--preset--color--petrol );
	padding-left: 22px;
	transition: color 160ms ease;
}

.homefix-hydro-scope__name::before {
	content: "";
	position: absolute;
	left: 0;
	top: 11px;
	width: 12px;
	height: 2px;
	background: var( --wp--preset--color--brass );
	transition: width 160ms ease, background-color 160ms ease;
}

.homefix-hydro-scope__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14px;
	color: var( --wp--preset--color--ink );
	opacity: 0.72;
	padding-left: 22px;
}

/* ---------- Czy to Twój przypadek? (dawniej "Typowe sytuacje") —
   FALA 2 (2026-09-15): usunięty dekoracyjny cudzysłów i box-shadow —
   testimonial-look zastąpiony jawną etykietą "SYTUACJA 0X" (CSS counter)
   + cienkim Petrol borderem, spójnym z Rozpoznaniem problemu wyżej.
   Pod headlinem krótkie, neutralne dopowiedzenie (nowy element). ---------- */
.homefix-hydro-scenarios {
	background: var( --wp--preset--color--surface-alt );
	padding: 64px 24px;
}

.homefix-hydro-scenarios__grid {
	counter-reset: hydro-situation;
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 250px, 1fr ) );
	gap: 24px;
}

.homefix-hydro-scenarios__item {
	counter-increment: hydro-situation;
	position: relative;
	background: var( --wp--preset--color--surface );
	border: 1px solid rgba( 27, 75, 84, 0.16 );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 28px 28px 26px;
	margin: 0;
}

.homefix-hydro-scenarios__item::before {
	content: "SYTUACJA " counter( hydro-situation, decimal-leading-zero );
	display: block;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 11.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin-bottom: 14px;
}

.homefix-hydro-scenarios__headline {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 19px;
	line-height: 1.4;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 10px;
}

.homefix-hydro-scenarios__note {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.72;
	margin: 0;
}

/* ---------- Jak działa HomeFix — VISUAL POLISH: linia łącząca kroki,
   żeby przepływ Zgłaszasz → HomeFix organizuje → Realizujemy czytał
   się jako jedna ciągła ścieżka, nie 4 osobne, niepowiązane kafle. ---------- */
.homefix-hydro-journey {
	padding: 64px 24px;
}

.homefix-hydro-journey__list {
	list-style: none;
	counter-reset: hydro-step;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: flex-start;
	gap: 0;
}

.homefix-hydro-journey__list li {
	counter-increment: hydro-step;
	position: relative;
	flex: 1 1 0;
	padding: 0 20px 0 0;
}

.homefix-hydro-journey__list li:first-child {
	padding-left: 0;
}

/* PREMIUM PROCESS TIMELINE (FALA 2, 2026-09-15) — większe medaliony z
   numerem (34px → 52px) z cienką Brass obwódką, mocniejsze tytuły,
   grubsza łącząca linia. Gradient Petrol→Brass na linii jest CELOWO
   bardzo stonowany (opacity 0.35, ten sam motyw co pasek postępu
   Priority Selectora na homepage, ale bez jego mocnego, "dashboardowego"
   nasycenia) — ma czytać się jako elegancka linia procesu, nie progress
   bar aplikacji. */
.homefix-hydro-journey__list li::before {
	content: counter( hydro-step );
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var( --wp--preset--color--petrol );
	box-shadow: 0 0 0 3px rgba( 137, 92, 37, 0.16 );
	color: #fff;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 19px;
	margin-bottom: 18px;
}

.homefix-hydro-journey__list li:not( :last-child )::after {
	content: "";
	position: absolute;
	top: 25px;
	left: 52px;
	width: calc( 100% - 32px );
	height: 3px;
	background: linear-gradient( 90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass ) );
	opacity: 0.35;
}

.homefix-hydro-journey__list strong {
	display: block;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 17px;
	color: var( --wp--preset--color--ink );
	margin-bottom: 5px;
}

.homefix-hydro-journey__list span {
	display: block;
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.78;
	line-height: 1.55;
}

/* ---------- Bezpieczeństwo i jasny proces — PREMIUM TRUST SECTION
   (FALA 3, 2026-09-15). Petrol panel zostaje, ale zamiast jednego zdania
   na pustym tle: 3 trust points w rzędzie (desktop) / stosie (mobile),
   każdy z małym Brass numerem (CSS counter) — jawne wymaganie
   właściciela, żeby sekcja miała rytm, nie wyglądała jak zwykłe akapity.
   Zero ikon, zero gradientu. ---------- */
.homefix-hydro-trust {
	background: var( --wp--preset--color--petrol );
	color: #fff;
	padding: 56px 40px;
	border-radius: var( --wp--custom--radius--card, 16px );
	margin: 0 24px 64px;
}

.homefix-hydro-trust .homefix-hydro-section-title {
	color: #fff;
	margin-bottom: 36px;
}

.homefix-hydro-trust__list {
	counter-reset: hydro-trust;
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 32px;
}

.homefix-hydro-trust__item {
	counter-increment: hydro-trust;
	position: relative;
	padding-top: 20px;
}

.homefix-hydro-trust__item::before {
	content: counter( hydro-trust, decimal-leading-zero );
	position: absolute;
	top: 0;
	left: 0;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.08em;
	color: var( --wp--preset--color--brass );
}

.homefix-hydro-trust__item::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 34px;
	width: 20px;
	height: 2px;
	background: var( --wp--preset--color--brass );
	opacity: 0.6;
}

.homefix-hydro-trust__item strong {
	display: block;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 17px;
	color: #fff;
	margin-bottom: 8px;
}

.homefix-hydro-trust__item span {
	display: block;
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.55;
	color: #F4F2EA;
	opacity: 0.82;
}

/* ---------- FAQ — PREMIUM BORDER-BASED ACCORDION (FALA 3, 2026-09-15).
   Lekki cień zastąpiony cienką Petrol-tinted ramką (spójnie z resztą
   strony po Fali 2/3, gdzie border wygrał z cieniem wszędzie indziej).
   Więcej oddechu, jawna zamiana +/− (zamiast samego obrotu — czytelniej),
   hover na całej karcie, otwarty stan dostaje subtelny Brass left-border.
   Treść pytań/odpowiedzi i FAQPage schema — bez zmian. ---------- */
.homefix-hydro-faq {
	max-width: 760px;
	margin: 0 auto;
	padding: 64px 24px;
}

.homefix-hydro-faq__item {
	background: var( --wp--preset--color--surface );
	border: 1px solid rgba( 27, 75, 84, 0.14 );
	border-left: 3px solid transparent;
	border-radius: 12px;
	padding: 4px 26px;
	margin-bottom: 14px;
	transition: border-color 160ms ease, background-color 160ms ease;
}

.homefix-hydro-faq__item:last-child {
	margin-bottom: 0;
}

.homefix-hydro-faq__item:hover {
	background: var( --wp--preset--color--surface-alt );
}

.homefix-hydro-faq__item[open] {
	border-left-color: var( --wp--preset--color--brass );
}

.homefix-hydro-faq__item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	list-style: none;
	cursor: pointer;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 16.5px;
	line-height: 1.4;
	color: var( --wp--preset--color--ink );
	min-height: var( --wp--custom--tap-target-min, 44px );
	padding: 20px 0;
}

.homefix-hydro-faq__item summary::-webkit-details-marker {
	display: none;
}

.homefix-hydro-faq__item summary::after {
	content: "+";
	flex-shrink: 0;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	color: var( --wp--preset--color--brass );
}

.homefix-hydro-faq__item[open] summary::after {
	content: "−";
}

.homefix-hydro-faq__item summary:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 4px;
	border-radius: 2px;
}

.homefix-hydro-faq__item p {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.82;
	margin: 0 0 24px;
}

/* ---------- Powiązane usługi — FALA 3 (2026-09-15): z ciężkich, wypełnionych
   pigułek (Surface-alt tło — wyglądały jak filtr/tag UI, "zbyt technicznie")
   na lekkie outline-pills, więcej oddechu. Kanalizacja (cross-link)
   przestaje być kolejną pigułką w tym samym rzędzie — dostaje własny,
   wyraźnie odrębny blok (pytanie + jawny Brass link), priorytet
   kontekstowy. Lista usług i cel cross-linku (SEO/internal linking) —
   bez zmian. ---------- */
.homefix-hydro-related {
	padding: 8px 24px 64px;
}

.homefix-hydro-related__list {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.homefix-hydro-related__list li {
	margin: 0;
}

.homefix-hydro-related__list a {
	display: inline-flex;
	align-items: center;
	background: transparent;
	border: 1.5px solid rgba( 27, 75, 84, 0.25 );
	border-radius: 999px;
	padding: 9px 18px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 13.5px;
	color: var( --wp--preset--color--petrol );
	text-decoration: none;
	min-height: var( --wp--custom--tap-target-min, 44px );
	transition: border-color 160ms ease, color 160ms ease;
}

.homefix-hydro-related__list a:hover,
.homefix-hydro-related__list a:focus-visible {
	border-color: var( --wp--preset--color--brass );
	color: var( --wp--preset--color--brass );
}

.homefix-hydro-related__list a:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
}

.homefix-hydro-related__cross {
	max-width: 440px;
	padding: 20px 24px;
	background: var( --wp--preset--color--surface-alt );
	border-left: 3px solid var( --wp--preset--color--brass );
	border-radius: var( --wp--custom--radius--button, 9px );
}

.homefix-hydro-related__cross-q {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.7;
	margin: 0 0 4px;
}

.homefix-hydro-related__cross a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 15px;
	color: var( --wp--preset--color--brass );
	text-decoration: none;
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-hydro-related__cross a span {
	transition: transform 160ms ease;
}

.homefix-hydro-related__cross a:hover span,
.homefix-hydro-related__cross a:focus-visible span {
	transform: translateX( 3px );
}

.homefix-hydro-related__cross a:focus-visible {
	outline: 2px solid var( --wp--preset--color--brass );
	outline-offset: 3px;
	border-radius: 2px;
}

/* ---------- CTA końcowe — VISUAL POLISH: kontenowana karta Petrol,
   mocny bookend spójny z Hero (zamiast płaskiego tekstu na tle
   strony), akcent Brass na górnej krawędzi dla odróżnienia od sekcji
   Bezpieczeństwa. ---------- */
.homefix-hydro-final-cta {
	max-width: 1280px;
	margin: 0 24px 72px;
	text-align: center;
	background: var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 72px 40px;
	border-top: 3px solid var( --wp--preset--color--brass );
}

/* FALA 3: jedno zdanie -> headline + subline (wyraźniejsza hierarchia). */
.homefix-hydro-final-cta__headline {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 29px;
	line-height: 1.25;
	color: #fff;
	max-width: 26ch;
	margin: 0 auto 14px;
}

.homefix-hydro-final-cta__subline {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16px;
	line-height: 1.55;
	color: #F4F2EA;
	opacity: 0.82;
	max-width: 48ch;
	margin: 0 auto 32px;
}

.homefix-hydro-final-cta__row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 22px;
	flex-wrap: wrap;
}

.homefix-hydro-final-cta__phone {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14.5px;
	color: var( --wp--preset--color--background );
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: opacity 160ms ease;
}

.homefix-hydro-final-cta__phone:hover,
.homefix-hydro-final-cta__phone:focus-visible {
	opacity: 0.8;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-hydro-recognize__card,
	.homefix-hydro-recognize__arrow,
	.homefix-hydro-scope__name::before,
	.homefix-hydro-faq__item,
	.homefix-hydro-hero__phone,
	.homefix-hydro-related__list a,
	.homefix-hydro-related__cross a span,
	.homefix-hydro-final-cta__phone {
		transition: none;
	}
}

/* ---------- Mobile (780px, spójne z resztą serwisu). ---------- */
@media ( max-width: 780px ) {
	.homefix-hydro-hero {
		flex-direction: column;
		align-items: stretch;
		padding: 32px 20px 40px;
		gap: 28px;
	}

	/* PREMIUM REDESIGN (2026-09-15): tekst + proof points + CTA muszą być
	   widoczne pierwsze i szybko, zdjęcie idzie NIŻEJ — odwrotnie niż
	   poprzednia wersja (`order: -1` wymuszało zdjęcie jako pierwsze,
	   wysoki format 4:5 przed CTA). Kolejność w DOM już jest poprawna
	   (copy przed media w PHP) — usunięcie `order` tutaj wystarcza, bez
	   zmiany markupu. Płytszy format 4:3 (zamiast 4:5) i wyłączony
	   przesunięty panel `::before` (zbędny/ciasny na wąskim ekranie) —
	   czysta, mniejsza ramka. */
	.homefix-hydro-hero__media::before {
		display: none;
	}

	.homefix-hydro-hero__media-frame {
		aspect-ratio: 4 / 3;
		border-radius: 16px;
	}

	.homefix-hydro-hero__heading {
		font-size: 30px;
		max-width: none;
	}

	.homefix-hydro-hero__desc {
		max-width: none;
	}

	.homefix-hydro-recognize,
	.homefix-hydro-scope,
	.homefix-hydro-scenarios,
	.homefix-hydro-journey,
	.homefix-hydro-faq,
	.homefix-hydro-related {
		padding-left: 20px;
		padding-right: 20px;
	}

	.homefix-hydro-recognize__grid,
	.homefix-hydro-scenarios__grid {
		grid-template-columns: 1fr;
	}

	.homefix-hydro-scope__list {
		grid-template-columns: 1fr;
		column-gap: 0;
	}

	/* Proces HomeFix: rząd poziomy nie mieści się czytelnie na wąskim
	   ekranie — pionowy tor z łączącą linią po lewej, klasyczny wzorzec
	   timeline, zamiast 4 kolumn ściśniętych do nieczytelności. */
	.homefix-hydro-journey__list {
		flex-direction: column;
		gap: 28px;
	}

	.homefix-hydro-journey__list li {
		padding: 0 0 0 68px;
	}

	.homefix-hydro-journey__list li:first-child {
		padding-left: 68px;
	}

	.homefix-hydro-journey__list li::before {
		position: absolute;
		left: 0;
		top: 0;
		margin-bottom: 0;
	}

	.homefix-hydro-journey__list li:not( :last-child )::after {
		top: 52px;
		left: 25px;
		width: 3px;
		height: calc( 100% + 12px );
	}

	.homefix-hydro-trust {
		margin: 0 20px 40px;
		padding: 36px 24px;
	}

	.homefix-hydro-trust__list {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.homefix-hydro-final-cta {
		margin: 0 20px 48px;
		padding: 44px 24px;
	}

	.homefix-hydro-final-cta__headline {
		font-size: 23px;
	}

	.homefix-hydro-related__cross {
		max-width: none;
	}

	.homefix-hydro-hero__ctas,
	.homefix-hydro-final-cta__row {
		flex-direction: column;
		align-items: stretch;
	}

	.homefix-hydro-hero__ctas .homefix-cta-seam,
	.homefix-hydro-final-cta__row .homefix-cta-seam {
		width: 100%;
	}

	.homefix-hydro-hero__ctas .homefix-cta-seam__btn,
	.homefix-hydro-final-cta__row .homefix-cta-seam__btn {
		width: 100%;
		justify-content: center;
	}
}

/* ==========================================================================
   ELEKTRYKA — PREMIUM REDESIGN (2026-09-15, zatwierdzony przez
   właściciela) — pełna adaptacja finalnego systemu Hydrauliki (Hero
   warstwowy, Z czym się zmagasz, Zakres usług, Czy to Twój przypadek,
   Jak działa HomeFix, Bezpieczeństwo 3-punktowe, FAQ border-based,
   Powiązane usługi outline pills, final CTA headline+subline). Namespace
   `.homefix-elek-*` w całości osobny od `.homefix-hydro-*` i
   `.homefix-svc-*` — zero współdzielonych selektorów, zero ryzyka
   regresji na Hydraulice, Gazie czy pozostałych kategoriach. Te same
   zamrożone tokeny V1.3. Różnice od Hydrauliki, zgodne z charakterem
   Elektryki (bezpieczeństwo/diagnostyka/precyzja) — patrz docblock
   homefix_child_render_elektryka_flagship_content() w service-pages.php:
   trust section pełnoszerokościowa bez zaokrąglenia (mocniejszy ton),
   related ma DWA cross-linki w rzędzie zamiast jednego.
   ========================================================================== */

.homefix-elek-page {
	max-width: 1280px;
	margin: 0 auto;
}

.homefix-elek-section-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 26px;
	line-height: 1.2;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 12px;
}

/* ---------- Hero — premium warstwowy układ, identyczna mechanika co
   finalna Hydraulika: tekst ~44%, zdjęcie ~56% i dominujące, przesunięty
   Surface-alt panel za zdjęciem, proof points. ---------- */
.homefix-elek-hero {
	display: flex;
	align-items: center;
	gap: 56px;
	padding: 56px 24px 64px;
}

.homefix-elek-hero__copy {
	flex: 1 1 44%;
	min-width: 0;
}

.homefix-elek-hero__eyebrow {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin: 0 0 16px;
}

.homefix-elek-hero__heading {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 40px;
	line-height: 1.12;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 18px;
	max-width: 16ch;
}

.homefix-elek-hero__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 17px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	max-width: 50ch;
	margin: 0 0 22px;
}

.homefix-elek-hero__proof {
	list-style: none;
	margin: 0 0 30px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.homefix-elek-hero__proof li {
	position: relative;
	padding-left: 22px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14.5px;
	color: var( --wp--preset--color--petrol );
}

.homefix-elek-hero__proof li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 6px;
	width: 9px;
	height: 9px;
	border-radius: 3px;
	background: var( --wp--preset--color--brass );
}

.homefix-elek-hero__ctas {
	display: flex;
	align-items: center;
	gap: 22px;
	flex-wrap: wrap;
}

.homefix-elek-hero__phone {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14.5px;
	color: var( --wp--preset--color--petrol );
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: opacity 160ms ease;
}

.homefix-elek-hero__phone:hover,
.homefix-elek-hero__phone:focus-visible {
	opacity: 0.72;
}

.homefix-elek-hero__media {
	flex: 1 1 56%;
	min-width: 0;
	position: relative;
}

.homefix-elek-hero__media::before {
	content: "";
	position: absolute;
	top: 22px;
	right: -22px;
	bottom: -22px;
	left: 22px;
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	z-index: 0;
}

.homefix-elek-hero__media-frame {
	position: relative;
	z-index: 1;
	border-radius: 20px;
	overflow: hidden;
	aspect-ratio: 4 / 5;
	box-shadow: 0 28px 56px -18px rgba( 18, 51, 57, 0.32 );
}

.homefix-elek-hero__picture,
.homefix-elek-hero__picture img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---------- Z czym się zmagasz? — premium router, identyczny mechanizm
   co finalna Hydraulika (spłaszczone dawne 4 tryby, 6 kart). ---------- */
.homefix-elek-recognize {
	padding: 8px 24px 64px;
}

.homefix-elek-recognize__lead {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	color: var( --wp--preset--color--ink );
	opacity: 0.75;
	margin: -8px 0 24px;
}

.homefix-elek-recognize__grid {
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 16px;
}

@media ( min-width: 781px ) and ( max-width: 1023px ) {
	.homefix-elek-recognize__grid {
		grid-template-columns: repeat( 2, 1fr );
	}
}

.homefix-elek-recognize__card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	background: var( --wp--preset--color--surface-alt );
	border-left: 3px solid var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--button, 9px );
	padding: 20px 22px;
	min-height: var( --wp--custom--tap-target-min, 44px );
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 15.5px;
	color: var( --wp--preset--color--petrol );
	text-decoration: none;
	transition: transform 160ms ease, background-color 160ms ease, border-left-width 160ms ease;
}

.homefix-elek-recognize__card:hover,
.homefix-elek-recognize__card:focus-visible {
	background: var( --wp--preset--color--background );
	border-left-width: 5px;
	transform: translateX( 3px );
}

.homefix-elek-recognize__card:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
}

.homefix-elek-recognize__arrow {
	color: var( --wp--preset--color--brass );
	font-weight: 700;
	flex-shrink: 0;
	transition: transform 160ms ease;
}

.homefix-elek-recognize__card:hover .homefix-elek-recognize__arrow,
.homefix-elek-recognize__card:focus-visible .homefix-elek-recognize__arrow {
	transform: translateX( 4px );
}

/* ---------- Zakres usług — editorial premium layout, numeracja Brass
   przez CSS counter, identyczny mechanizm co finalna Hydraulika. ---------- */
.homefix-elek-scope {
	padding: 8px 24px 64px;
}

.homefix-elek-scope__list {
	counter-reset: elek-scope;
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	column-gap: 56px;
}

.homefix-elek-scope__list li {
	counter-increment: elek-scope;
	border-bottom: 1px solid rgba( 27, 36, 32, 0.08 );
}

.homefix-elek-scope__list a {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 28px 4px 26px;
	text-decoration: none;
}

.homefix-elek-scope__list a::before {
	content: counter( elek-scope, decimal-leading-zero );
	order: -1;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.08em;
	color: var( --wp--preset--color--brass );
}

.homefix-elek-scope__list a:hover .homefix-elek-scope__name,
.homefix-elek-scope__list a:focus-visible .homefix-elek-scope__name {
	color: var( --wp--preset--color--brass );
}

.homefix-elek-scope__list a:hover .homefix-elek-scope__name::before,
.homefix-elek-scope__list a:focus-visible .homefix-elek-scope__name::before {
	width: 20px;
	background: var( --wp--preset--color--brass );
}

.homefix-elek-scope__list a:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
	border-radius: 4px;
}

.homefix-elek-scope__name {
	position: relative;
	display: inline-block;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 19px;
	color: var( --wp--preset--color--petrol );
	padding-left: 22px;
	transition: color 160ms ease;
}

.homefix-elek-scope__name::before {
	content: "";
	position: absolute;
	left: 0;
	top: 11px;
	width: 12px;
	height: 2px;
	background: var( --wp--preset--color--brass );
	transition: width 160ms ease, background-color 160ms ease;
}

.homefix-elek-scope__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14px;
	color: var( --wp--preset--color--ink );
	opacity: 0.72;
	padding-left: 22px;
}

/* ---------- Czy to Twój przypadek? — SYTUACJA 0X + neutralne
   dopowiedzenie, cienki Petrol border, bez cudzysłowów/cienia. ---------- */
.homefix-elek-scenarios {
	background: var( --wp--preset--color--surface-alt );
	padding: 64px 24px;
}

.homefix-elek-scenarios__grid {
	counter-reset: elek-situation;
	display: grid;
	grid-template-columns: repeat( auto-fit, minmax( 250px, 1fr ) );
	gap: 24px;
}

.homefix-elek-scenarios__item {
	counter-increment: elek-situation;
	position: relative;
	background: var( --wp--preset--color--surface );
	border: 1px solid rgba( 27, 75, 84, 0.16 );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 28px 28px 26px;
	margin: 0;
}

.homefix-elek-scenarios__item::before {
	content: "SYTUACJA " counter( elek-situation, decimal-leading-zero );
	display: block;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 11.5px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var( --wp--preset--color--brass );
	margin-bottom: 14px;
}

.homefix-elek-scenarios__headline {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 19px;
	line-height: 1.4;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 10px;
}

.homefix-elek-scenarios__note {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.72;
	margin: 0;
}

/* ---------- Jak działa HomeFix? — premium process timeline, identyczny
   mechanizm co finalna Hydraulika (duże numery, subtelny gradient
   Petrol→Brass na łączącej linii). ---------- */
.homefix-elek-journey {
	padding: 64px 24px;
}

.homefix-elek-journey__list {
	list-style: none;
	counter-reset: elek-step;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: flex-start;
	gap: 0;
}

.homefix-elek-journey__list li {
	counter-increment: elek-step;
	position: relative;
	flex: 1 1 0;
	padding: 0 20px 0 0;
}

.homefix-elek-journey__list li:first-child {
	padding-left: 0;
}

.homefix-elek-journey__list li::before {
	content: counter( elek-step );
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var( --wp--preset--color--petrol );
	box-shadow: 0 0 0 3px rgba( 137, 92, 37, 0.16 );
	color: #fff;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 19px;
	margin-bottom: 18px;
}

.homefix-elek-journey__list li:not( :last-child )::after {
	content: "";
	position: absolute;
	top: 25px;
	left: 52px;
	width: calc( 100% - 32px );
	height: 3px;
	background: linear-gradient( 90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass ) );
	opacity: 0.35;
}

.homefix-elek-journey__list strong {
	display: block;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 17px;
	color: var( --wp--preset--color--ink );
	margin-bottom: 5px;
}

.homefix-elek-journey__list span {
	display: block;
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.78;
	line-height: 1.55;
}

/* ---------- Bezpieczeństwo przede wszystkim — MOCNIEJSZY ton niż
   Hydraulika (właściciel wprost tego chciał): pełna szerokość
   (edge-to-edge, bez zaokrąglenia), nie kontenowana karta. Ta sama
   mechanika 3 trust points (Brass numeracja) co finalna Hydraulika. ---------- */
.homefix-elek-trust {
	background: var( --wp--preset--color--petrol );
	padding: 56px 40px;
	border-top: 4px solid var( --wp--preset--color--brass );
}

.homefix-elek-trust__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 800;
	font-size: 30px;
	color: #fff;
	max-width: 1280px;
	margin: 0 auto 36px;
}

.homefix-elek-trust__list {
	counter-reset: elek-trust;
	list-style: none;
	margin: 0 auto;
	padding: 0;
	max-width: 1280px;
	display: grid;
	grid-template-columns: repeat( 3, 1fr );
	gap: 32px;
}

.homefix-elek-trust__item {
	counter-increment: elek-trust;
	position: relative;
	padding-top: 20px;
}

.homefix-elek-trust__item::before {
	content: counter( elek-trust, decimal-leading-zero );
	position: absolute;
	top: 0;
	left: 0;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.08em;
	color: var( --wp--preset--color--brass );
}

.homefix-elek-trust__item::after {
	content: "";
	position: absolute;
	top: 3px;
	left: 34px;
	width: 20px;
	height: 2px;
	background: var( --wp--preset--color--brass );
	opacity: 0.6;
}

.homefix-elek-trust__item strong {
	display: block;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 17px;
	color: #fff;
	margin-bottom: 8px;
}

.homefix-elek-trust__item span {
	display: block;
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.55;
	color: #F4F2EA;
	opacity: 0.82;
}

/* ---------- FAQ — premium border-based accordion, identyczny mechanizm
   co finalna Hydraulika. ---------- */
.homefix-elek-faq {
	max-width: 760px;
	margin: 0 auto;
	padding: 64px 24px;
}

.homefix-elek-faq__item {
	background: var( --wp--preset--color--surface );
	border: 1px solid rgba( 27, 75, 84, 0.14 );
	border-left: 3px solid transparent;
	border-radius: 12px;
	padding: 4px 26px;
	margin-bottom: 14px;
	transition: border-color 160ms ease, background-color 160ms ease;
}

.homefix-elek-faq__item:last-child {
	margin-bottom: 0;
}

.homefix-elek-faq__item:hover {
	background: var( --wp--preset--color--surface-alt );
}

.homefix-elek-faq__item[open] {
	border-left-color: var( --wp--preset--color--brass );
}

.homefix-elek-faq__item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	list-style: none;
	cursor: pointer;
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 16.5px;
	line-height: 1.4;
	color: var( --wp--preset--color--ink );
	min-height: var( --wp--custom--tap-target-min, 44px );
	padding: 20px 0;
}

.homefix-elek-faq__item summary::-webkit-details-marker {
	display: none;
}

.homefix-elek-faq__item summary::after {
	content: "+";
	flex-shrink: 0;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 22px;
	line-height: 1;
	color: var( --wp--preset--color--brass );
}

.homefix-elek-faq__item[open] summary::after {
	content: "−";
}

.homefix-elek-faq__item summary:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 4px;
	border-radius: 2px;
}

.homefix-elek-faq__item p {
	font-family: var( --wp--preset--font-family--body );
	font-size: 15px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.82;
	margin: 0 0 24px;
}

/* ---------- Powiązane usługi — outline pills, identyczny mechanizm co
   finalna Hydraulika. DWA cross-linki (Montaż, Naprawy domowe) w
   rzędzie — świadoma różnica od Hydrauliki (tam jeden). ---------- */
.homefix-elek-related {
	padding: 8px 24px 64px;
}

.homefix-elek-related__list {
	list-style: none;
	margin: 0 0 28px;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.homefix-elek-related__list a {
	display: inline-flex;
	align-items: center;
	background: transparent;
	border: 1.5px solid rgba( 27, 75, 84, 0.25 );
	border-radius: 999px;
	padding: 9px 18px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 13.5px;
	color: var( --wp--preset--color--petrol );
	text-decoration: none;
	min-height: var( --wp--custom--tap-target-min, 44px );
	transition: border-color 160ms ease, color 160ms ease;
}

.homefix-elek-related__list a:hover,
.homefix-elek-related__list a:focus-visible {
	border-color: var( --wp--preset--color--brass );
	color: var( --wp--preset--color--brass );
}

.homefix-elek-related__list a:focus-visible {
	outline: 2px solid var( --wp--preset--color--petrol );
	outline-offset: 2px;
}

.homefix-elek-related__cross-row {
	display: grid;
	grid-template-columns: repeat( 2, 1fr );
	gap: 16px;
}

.homefix-elek-related__cross {
	padding: 20px 24px;
	background: var( --wp--preset--color--surface-alt );
	border-left: 3px solid var( --wp--preset--color--brass );
	border-radius: var( --wp--custom--radius--button, 9px );
}

.homefix-elek-related__cross-q {
	font-family: var( --wp--preset--font-family--body );
	font-size: 13.5px;
	color: var( --wp--preset--color--ink );
	opacity: 0.7;
	margin: 0 0 4px;
}

.homefix-elek-related__cross a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 15px;
	color: var( --wp--preset--color--brass );
	text-decoration: none;
	min-height: var( --wp--custom--tap-target-min, 44px );
}

.homefix-elek-related__cross a span {
	transition: transform 160ms ease;
}

.homefix-elek-related__cross a:hover span,
.homefix-elek-related__cross a:focus-visible span {
	transform: translateX( 3px );
}

.homefix-elek-related__cross a:focus-visible {
	outline: 2px solid var( --wp--preset--color--brass );
	outline-offset: 3px;
	border-radius: 2px;
}

/* ---------- CTA końcowe — headline + subline, identyczny mechanizm co
   finalna Hydraulika. ---------- */
.homefix-elek-final-cta {
	max-width: 1280px;
	margin: 0 24px 72px;
	text-align: center;
	background: var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 72px 40px;
	border-top: 3px solid var( --wp--preset--color--brass );
}

.homefix-elek-final-cta__headline {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 29px;
	line-height: 1.25;
	color: #fff;
	max-width: 26ch;
	margin: 0 auto 14px;
}

.homefix-elek-final-cta__subline {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16px;
	line-height: 1.55;
	color: #F4F2EA;
	opacity: 0.82;
	max-width: 48ch;
	margin: 0 auto 32px;
}

.homefix-elek-final-cta__row {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 22px;
	flex-wrap: wrap;
}

.homefix-elek-final-cta__phone {
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 14.5px;
	color: var( --wp--preset--color--background );
	text-decoration: underline;
	text-underline-offset: 3px;
	transition: opacity 160ms ease;
}

.homefix-elek-final-cta__phone:hover,
.homefix-elek-final-cta__phone:focus-visible {
	opacity: 0.8;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-elek-recognize__card,
	.homefix-elek-recognize__arrow,
	.homefix-elek-scope__name::before,
	.homefix-elek-faq__item,
	.homefix-elek-hero__phone,
	.homefix-elek-related__list a,
	.homefix-elek-related__cross a span,
	.homefix-elek-final-cta__phone {
		transition: none;
	}
}

/* ---------- Mobile (780px, spójne z resztą serwisu). ---------- */
@media ( max-width: 780px ) {
	.homefix-elek-hero {
		flex-direction: column;
		align-items: stretch;
		padding: 32px 20px 40px;
		gap: 28px;
	}

	/* Tekst + proof points + CTA przed zdjęciem — kolejność w DOM już
	   jest poprawna (copy przed media w PHP), usunięcie `order`
	   wystarcza, identycznie jak na Hydraulice. */
	.homefix-elek-hero__media::before {
		display: none;
	}

	.homefix-elek-hero__media-frame {
		aspect-ratio: 4 / 3;
		border-radius: 16px;
	}

	.homefix-elek-hero__heading {
		font-size: 30px;
		max-width: none;
	}

	.homefix-elek-hero__desc {
		max-width: none;
	}

	.homefix-elek-recognize,
	.homefix-elek-scope,
	.homefix-elek-scenarios,
	.homefix-elek-journey,
	.homefix-elek-faq,
	.homefix-elek-related {
		padding-left: 20px;
		padding-right: 20px;
	}

	.homefix-elek-recognize__grid,
	.homefix-elek-scenarios__grid {
		grid-template-columns: 1fr;
	}

	.homefix-elek-scope__list {
		grid-template-columns: 1fr;
		column-gap: 0;
	}

	.homefix-elek-journey__list {
		flex-direction: column;
		gap: 28px;
	}

	.homefix-elek-journey__list li {
		padding: 0 0 0 68px;
	}

	.homefix-elek-journey__list li:first-child {
		padding-left: 68px;
	}

	.homefix-elek-journey__list li::before {
		position: absolute;
		left: 0;
		top: 0;
		margin-bottom: 0;
	}

	.homefix-elek-journey__list li:not( :last-child )::after {
		top: 52px;
		left: 25px;
		width: 3px;
		height: calc( 100% + 12px );
	}

	.homefix-elek-trust {
		padding: 36px 24px;
	}

	.homefix-elek-trust__title {
		font-size: 24px;
	}

	.homefix-elek-trust__list {
		grid-template-columns: 1fr;
		gap: 28px;
	}

	.homefix-elek-related__cross-row {
		grid-template-columns: 1fr;
	}

	.homefix-elek-final-cta {
		margin: 0 20px 48px;
		padding: 44px 24px;
	}

	.homefix-elek-final-cta__headline {
		font-size: 23px;
	}

	.homefix-elek-hero__ctas,
	.homefix-elek-final-cta__row {
		flex-direction: column;
		align-items: stretch;
	}

	.homefix-elek-hero__ctas .homefix-cta-seam,
	.homefix-elek-final-cta__row .homefix-cta-seam {
		width: 100%;
	}

	.homefix-elek-hero__ctas .homefix-cta-seam__btn,
	.homefix-elek-final-cta__row .homefix-cta-seam__btn {
		width: 100%;
		justify-content: center;
	}
}

/* ==========================================================================
   GAZ — PREMIUM REDESIGN (2026-09-18, zatwierdzony przez właściciela) —
   pełna adaptacja finalnego systemu Hydrauliki/Elektryki/Montażu/
   Naprawy domowej/Kanalizacji/Mycia ciśnieniowego/Sprzątania. Namespace
   `.homefix-gaz-*` w całości osobny. Duży czerwony SAFETY MODULE
   (background: error) USUNIĘTY — zastąpiony stonowaną
   `.homefix-gaz-safety-notice` (Petrol/neutral, zero koloru
   semantycznego error), patrz docblock w service-pages.php.
   ==================== */

.homefix-gaz-page { max-width: 1280px; margin: 0 auto; }
.homefix-gaz-section-title { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 26px; line-height: 1.2; color: var( --wp--preset--color--petrol ); margin: 0 0 12px; }

/* ---------- Hero — warstwowy układ, identyczna mechanika co finalna Hydraulika/Elektryka. ---------- */
.homefix-gaz-hero { display: flex; align-items: center; gap: 56px; padding: 56px 24px 64px; }
.homefix-gaz-hero__copy { flex: 1 1 44%; min-width: 0; }
.homefix-gaz-hero__eyebrow { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin: 0 0 16px; }
.homefix-gaz-hero__heading { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 40px; line-height: 1.12; color: var( --wp--preset--color--petrol ); margin: 0 0 18px; max-width: 17ch; }
.homefix-gaz-hero__desc { font-family: var( --wp--preset--font-family--body ); font-size: 17px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .85; max-width: 50ch; margin: 0 0 22px; }
.homefix-gaz-hero__proof { list-style: none; margin: 0 0 30px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.homefix-gaz-hero__proof li { position: relative; padding-left: 22px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); }
.homefix-gaz-hero__proof li::before { content: ""; position: absolute; left: 0; top: 6px; width: 9px; height: 9px; border-radius: 3px; background: var( --wp--preset--color--brass ); }
.homefix-gaz-hero__ctas { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.homefix-gaz-hero__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-gaz-hero__phone:hover, .homefix-gaz-hero__phone:focus-visible { opacity: .72; }
.homefix-gaz-hero__media { flex: 1 1 56%; min-width: 0; position: relative; }
.homefix-gaz-hero__media::before { content: ""; position: absolute; top: 22px; right: -22px; bottom: -22px; left: 22px; background: var( --wp--preset--color--surface-alt ); border-radius: var( --wp--custom--radius--card, 16px ); z-index: 0; }
.homefix-gaz-hero__media-frame { position: relative; z-index: 1; border-radius: 20px; overflow: hidden; aspect-ratio: 4/5; box-shadow: 0 28px 56px -18px rgba(18,51,57,.32); }
.homefix-gaz-hero__picture, .homefix-gaz-hero__picture img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Z czym się zmagasz? ---------- */
.homefix-gaz-recognize { padding: 8px 24px 64px; }
.homefix-gaz-recognize__lead { font-family: var( --wp--preset--font-family--body ); font-size: 15px; color: var( --wp--preset--color--ink ); opacity: .75; margin: -8px 0 24px; }
.homefix-gaz-recognize__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
@media ( min-width: 601px ) and ( max-width: 1023px ) { .homefix-gaz-recognize__grid { grid-template-columns: repeat(2, 1fr); } }
.homefix-gaz-recognize__card { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--button, 9px ); padding: 20px 22px; min-height: var( --wp--custom--tap-target-min, 44px ); font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 15.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; transition: transform 160ms ease, background-color 160ms ease, border-left-width 160ms ease; }
.homefix-gaz-recognize__card:hover, .homefix-gaz-recognize__card:focus-visible { background: var( --wp--preset--color--background ); border-left-width: 5px; transform: translateX(3px); }
.homefix-gaz-recognize__card:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-gaz-recognize__arrow { color: var( --wp--preset--color--brass ); font-weight: 700; flex-shrink: 0; transition: transform 160ms ease; }
.homefix-gaz-recognize__card:hover .homefix-gaz-recognize__arrow, .homefix-gaz-recognize__card:focus-visible .homefix-gaz-recognize__arrow { transform: translateX(4px); }

/* ---------- Zakres usług — editorial premium layout (krótka, 1 realna usługa). ---------- */
.homefix-gaz-scope { padding: 8px 24px 64px; }
.homefix-gaz-scope__list { counter-reset: gaz-scope; list-style: none; margin: 0; padding: 0; max-width: 560px; }
.homefix-gaz-scope__list li { counter-increment: gaz-scope; border-bottom: 1px solid rgba(27,36,32,.08); }
.homefix-gaz-scope__list a { display: flex; flex-direction: column; gap: 6px; padding: 28px 4px 26px; text-decoration: none; }
.homefix-gaz-scope__list a::before { content: counter(gaz-scope, decimal-leading-zero); order: -1; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-gaz-scope__list a:hover .homefix-gaz-scope__name, .homefix-gaz-scope__list a:focus-visible .homefix-gaz-scope__name { color: var( --wp--preset--color--brass ); }
.homefix-gaz-scope__list a:hover .homefix-gaz-scope__name::before, .homefix-gaz-scope__list a:focus-visible .homefix-gaz-scope__name::before { width: 20px; background: var( --wp--preset--color--brass ); }
.homefix-gaz-scope__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; border-radius: 4px; }
.homefix-gaz-scope__name { position: relative; display: inline-block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; color: var( --wp--preset--color--petrol ); padding-left: 22px; transition: color 160ms ease; }
.homefix-gaz-scope__name::before { content: ""; position: absolute; left: 0; top: 11px; width: 12px; height: 2px; background: var( --wp--preset--color--brass ); transition: width 160ms ease, background-color 160ms ease; }
.homefix-gaz-scope__desc { font-family: var( --wp--preset--font-family--body ); font-size: 14px; color: var( --wp--preset--color--ink ); opacity: .72; padding-left: 22px; }

/* ---------- Czy to Twój przypadek? ---------- */
.homefix-gaz-scenarios { background: var( --wp--preset--color--surface-alt ); padding: 64px 24px; }
.homefix-gaz-scenarios__grid { counter-reset: gaz-situation; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 24px; }
.homefix-gaz-scenarios__item { counter-increment: gaz-situation; position: relative; background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.16); border-radius: var( --wp--custom--radius--card, 16px ); padding: 28px 28px 26px; margin: 0; }
.homefix-gaz-scenarios__item::before { content: "SYTUACJA " counter(gaz-situation, decimal-leading-zero); display: block; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin-bottom: 14px; }
.homefix-gaz-scenarios__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 19px; line-height: 1.4; color: var( --wp--preset--color--petrol ); margin: 0 0 10px; }
.homefix-gaz-scenarios__note { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; line-height: 1.55; color: var( --wp--preset--color--ink ); opacity: .72; margin: 0; }

/* ---------- Jak działa HomeFix? — premium process timeline. ---------- */
.homefix-gaz-journey { padding: 64px 24px; }
.homefix-gaz-journey__list { list-style: none; counter-reset: gaz-step; margin: 0; padding: 0; display: flex; align-items: flex-start; gap: 0; }
.homefix-gaz-journey__list li { counter-increment: gaz-step; position: relative; flex: 1 1 0; padding: 0 20px 0 0; }
.homefix-gaz-journey__list li:first-child { padding-left: 0; }
.homefix-gaz-journey__list li::before { content: counter(gaz-step); position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: var( --wp--preset--color--petrol ); box-shadow: 0 0 0 3px rgba(137,92,37,.16); color: #fff; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; margin-bottom: 18px; }
.homefix-gaz-journey__list li:not(:last-child)::after { content: ""; position: absolute; top: 25px; left: 52px; width: calc(100% - 32px); height: 3px; background: linear-gradient(90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass )); opacity: .35; }
.homefix-gaz-journey__list strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: var( --wp--preset--color--ink ); margin-bottom: 5px; }
.homefix-gaz-journey__list span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .78; line-height: 1.55; }

/* ---------- Ważna informacja dotycząca bezpieczeństwa — stonowana,
   profesjonalna, NIE dominująca, zero koloru semantycznego error. ---------- */
.homefix-gaz-safety-notice { max-width: 800px; margin: 0 auto 64px; padding: 28px 32px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--button, 9px ); }
.homefix-gaz-safety-notice__heading { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 16.5px; color: var( --wp--preset--color--petrol ); margin: 0 0 10px; }
.homefix-gaz-safety-notice__body { font-family: var( --wp--preset--font-family--body ); font-size: 14.5px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .8; margin: 0; }

/* ---------- Bezpieczeństwo i jasny proces — trust panel, 3 punkty. ---------- */
.homefix-gaz-trust { background: var( --wp--preset--color--petrol ); padding: 56px 40px; border-radius: var( --wp--custom--radius--card, 16px ); margin: 0 24px 64px; }
.homefix-gaz-trust .homefix-gaz-section-title { color: #fff; margin-bottom: 36px; }
.homefix-gaz-trust__list { counter-reset: gaz-trust; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.homefix-gaz-trust__item { counter-increment: gaz-trust; position: relative; padding-top: 20px; }
.homefix-gaz-trust__item::before { content: counter(gaz-trust, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-gaz-trust__item::after { content: ""; position: absolute; top: 3px; left: 34px; width: 20px; height: 2px; background: var( --wp--preset--color--brass ); opacity: .6; }
.homefix-gaz-trust__item strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: #fff; margin-bottom: 8px; }
.homefix-gaz-trust__item span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 14.5px; line-height: 1.55; color: #F4F2EA; opacity: .82; }

/* ---------- FAQ — premium border-based accordion. Grupowanie
   emergency/planned zachowane jako spokojna etykieta, bez czerwieni. ---------- */
.homefix-gaz-faq { max-width: 760px; margin: 0 auto; padding: 64px 24px; }
.homefix-gaz-faq__group-label { font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin: 32px 0 12px; }
.homefix-gaz-faq__group-label:first-of-type { margin-top: 0; }
.homefix-gaz-faq__item { background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.14); border-left: 3px solid transparent; border-radius: 12px; padding: 4px 26px; margin-bottom: 14px; transition: border-color 160ms ease, background-color 160ms ease; }
.homefix-gaz-faq__item:last-child { margin-bottom: 0; }
.homefix-gaz-faq__item:hover { background: var( --wp--preset--color--surface-alt ); }
.homefix-gaz-faq__item[open] { border-left-color: var( --wp--preset--color--brass ); }
.homefix-gaz-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; list-style: none; cursor: pointer; font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 16.5px; line-height: 1.4; min-height: var( --wp--custom--tap-target-min, 44px ); padding: 20px 0; color: var( --wp--preset--color--ink ); }
.homefix-gaz-faq__item summary::-webkit-details-marker { display: none; }
.homefix-gaz-faq__item summary::after { content: "+"; flex-shrink: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 22px; line-height: 1; color: var( --wp--preset--color--brass ); }
.homefix-gaz-faq__item[open] summary::after { content: "−"; }
.homefix-gaz-faq__item summary:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 4px; border-radius: 2px; }
.homefix-gaz-faq__item p { font-family: var( --wp--preset--font-family--body ); font-size: 15px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .82; margin: 0 0 24px; }

/* ---------- Powiązane usługi — outline pills + dwa cross-linki w rzędzie. ---------- */
.homefix-gaz-related { padding: 8px 24px 64px; }
.homefix-gaz-related__list { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.homefix-gaz-related__list a { display: inline-flex; align-items: center; background: transparent; border: 1.5px solid rgba(27,75,84,.25); border-radius: 999px; padding: 9px 18px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 13.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); transition: border-color 160ms ease, color 160ms ease; }
.homefix-gaz-related__list a:hover, .homefix-gaz-related__list a:focus-visible { border-color: var( --wp--preset--color--brass ); color: var( --wp--preset--color--brass ); }
.homefix-gaz-related__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-gaz-related__cross-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.homefix-gaz-related__cross { padding: 20px 24px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--brass ); border-radius: var( --wp--custom--radius--button, 9px ); }
.homefix-gaz-related__cross-q { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .7; margin: 0 0 4px; }
.homefix-gaz-related__cross a { display: inline-flex; align-items: center; gap: 6px; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 15px; color: var( --wp--preset--color--brass ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); }
.homefix-gaz-related__cross a span { transition: transform 160ms ease; }
.homefix-gaz-related__cross a:hover span, .homefix-gaz-related__cross a:focus-visible span { transform: translateX(3px); }
.homefix-gaz-related__cross a:focus-visible { outline: 2px solid var( --wp--preset--color--brass ); outline-offset: 3px; border-radius: 2px; }

/* ---------- CTA końcowe — headline + subline. ---------- */
.homefix-gaz-final-cta { max-width: 1280px; margin: 0 24px 72px; text-align: center; background: var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--card, 16px ); padding: 72px 40px; border-top: 3px solid var( --wp--preset--color--brass ); }
.homefix-gaz-final-cta__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 29px; line-height: 1.25; color: #fff; max-width: 26ch; margin: 0 auto 14px; }
.homefix-gaz-final-cta__subline { font-family: var( --wp--preset--font-family--body ); font-size: 16px; line-height: 1.55; color: #F4F2EA; opacity: .82; max-width: 48ch; margin: 0 auto 32px; }
.homefix-gaz-final-cta__row { display: flex; align-items: center; justify-content: center; gap: 22px; flex-wrap: wrap; }
.homefix-gaz-final-cta__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--background ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-gaz-final-cta__phone:hover, .homefix-gaz-final-cta__phone:focus-visible { opacity: .8; }

@media ( max-width: 780px ) {
	.homefix-gaz-hero { flex-direction: column; align-items: stretch; padding: 32px 20px 40px; gap: 28px; }
	.homefix-gaz-hero__media::before { display: none; }
	.homefix-gaz-hero__media-frame { aspect-ratio: 4/3; border-radius: 16px; }
	.homefix-gaz-hero__heading { font-size: 30px; max-width: none; }
	.homefix-gaz-hero__desc { max-width: none; }
	.homefix-gaz-recognize, .homefix-gaz-scope, .homefix-gaz-scenarios, .homefix-gaz-journey, .homefix-gaz-faq, .homefix-gaz-related { padding-left: 20px; padding-right: 20px; }
	.homefix-gaz-recognize__grid, .homefix-gaz-scenarios__grid { grid-template-columns: 1fr; }
	.homefix-gaz-safety-notice { margin: 0 20px 40px; padding: 24px 22px; }
	.homefix-gaz-journey__list { flex-direction: column; gap: 28px; }
	.homefix-gaz-journey__list li { padding: 0 0 0 68px; }
	.homefix-gaz-journey__list li:first-child { padding-left: 68px; }
	.homefix-gaz-journey__list li::before { position: absolute; left: 0; top: 0; margin-bottom: 0; }
	.homefix-gaz-journey__list li:not(:last-child)::after { top: 52px; left: 25px; width: 3px; height: calc(100% + 12px); }
	.homefix-gaz-trust { margin: 0 20px 40px; padding: 36px 24px; }
	.homefix-gaz-trust__list { grid-template-columns: 1fr; gap: 28px; }
	.homefix-gaz-related__cross-row { grid-template-columns: 1fr; }
	.homefix-gaz-final-cta { margin: 0 20px 48px; padding: 44px 24px; }
	.homefix-gaz-final-cta__headline { font-size: 23px; }
	.homefix-gaz-hero__ctas, .homefix-gaz-final-cta__row { flex-direction: column; align-items: stretch; }
	.homefix-gaz-hero__ctas .homefix-cta-seam, .homefix-gaz-final-cta__row .homefix-cta-seam { width: 100%; }
	.homefix-gaz-hero__ctas .homefix-cta-seam__btn, .homefix-gaz-final-cta__row .homefix-cta-seam__btn { width: 100%; justify-content: center; }
}

/* ==========================================================================
   POZOSTAŁE 5 KATEGORII — Kanalizacja, Sprzątanie, Naprawy domowe,
   Mycie ciśnieniowe, Montaż (FINAL IMPLEMENTATION BLUEPRINT,
   2026-09-17, zatwierdzony przez właściciela). Wszystkie 8 kategorii
   mają dziś dedykowaną treść. Każdy namespace poniżej w całości osobny
   — zero współdzielonych selektorów między kategoriami. Wyłącznie
   zamrożone tokeny V1.3.
   ========================================================================== */

/* ==================== KANALIZACJA — PREMIUM REDESIGN (2026-09-17,
   zatwierdzony przez właściciela) — pełna adaptacja finalnego systemu
   Hydrauliki/Elektryki. Namespace `.homefix-kan-*` w całości osobny.
   ==================== */

.homefix-kan-page { max-width: 1280px; margin: 0 auto; }
.homefix-kan-section-title { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 26px; line-height: 1.2; color: var( --wp--preset--color--petrol ); margin: 0 0 12px; }

/* ---------- Hero — warstwowy układ, identyczna mechanika co finalna Hydraulika/Elektryka. ---------- */
.homefix-kan-hero { display: flex; align-items: center; gap: 56px; padding: 56px 24px 64px; }
.homefix-kan-hero__copy { flex: 1 1 44%; min-width: 0; }
.homefix-kan-hero__eyebrow { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin: 0 0 16px; }
.homefix-kan-hero__heading { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 36px; line-height: 1.16; color: var( --wp--preset--color--petrol ); margin: 0 0 18px; max-width: 18ch; }
.homefix-kan-hero__desc { font-family: var( --wp--preset--font-family--body ); font-size: 17px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .85; max-width: 50ch; margin: 0 0 22px; }
.homefix-kan-hero__proof { list-style: none; margin: 0 0 30px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.homefix-kan-hero__proof li { position: relative; padding-left: 22px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); }
.homefix-kan-hero__proof li::before { content: ""; position: absolute; left: 0; top: 6px; width: 9px; height: 9px; border-radius: 3px; background: var( --wp--preset--color--brass ); }
.homefix-kan-hero__ctas { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.homefix-kan-hero__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-kan-hero__phone:hover, .homefix-kan-hero__phone:focus-visible { opacity: .72; }
.homefix-kan-hero__media { flex: 1 1 56%; min-width: 0; position: relative; }
.homefix-kan-hero__media::before { content: ""; position: absolute; top: 22px; right: -22px; bottom: -22px; left: 22px; background: var( --wp--preset--color--surface-alt ); border-radius: var( --wp--custom--radius--card, 16px ); z-index: 0; }
.homefix-kan-hero__media-frame { position: relative; z-index: 1; border-radius: 20px; overflow: hidden; aspect-ratio: 4/5; box-shadow: 0 28px 56px -18px rgba(18,51,57,.32); }
.homefix-kan-hero__picture, .homefix-kan-hero__picture img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Z czym się zmagasz? — symptom-first. ---------- */
.homefix-kan-recognize { padding: 8px 24px 32px; }
.homefix-kan-recognize__lead { font-family: var( --wp--preset--font-family--body ); font-size: 15px; color: var( --wp--preset--color--ink ); opacity: .75; margin: -8px 0 24px; }
.homefix-kan-recognize__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media ( min-width: 781px ) and ( max-width: 1023px ) { .homefix-kan-recognize__grid { grid-template-columns: repeat(2, 1fr); } }
.homefix-kan-recognize__card { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--button, 9px ); padding: 20px 22px; min-height: var( --wp--custom--tap-target-min, 44px ); font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 15.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; transition: transform 160ms ease, background-color 160ms ease, border-left-width 160ms ease; }
.homefix-kan-recognize__card:hover, .homefix-kan-recognize__card:focus-visible { background: var( --wp--preset--color--background ); border-left-width: 5px; transform: translateX(3px); }
.homefix-kan-recognize__card:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-kan-recognize__arrow { color: var( --wp--preset--color--brass ); font-weight: 700; flex-shrink: 0; transition: transform 160ms ease; }
.homefix-kan-recognize__card:hover .homefix-kan-recognize__arrow, .homefix-kan-recognize__card:focus-visible .homefix-kan-recognize__arrow { transform: translateX(4px); }
.homefix-kan-recognize__note { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .68; margin: 20px 0 0; }

/* ---------- Zakres usług — editorial premium layout (krótsza, tylko 2 usługi — rzeczywisty katalog). ---------- */
.homefix-kan-scope { padding: 8px 24px 64px; }
.homefix-kan-scope__list { counter-reset: kan-scope; list-style: none; margin: 0; padding: 0; max-width: 640px; }
.homefix-kan-scope__list li { counter-increment: kan-scope; border-bottom: 1px solid rgba(27,36,32,.08); }
.homefix-kan-scope__list a { display: flex; flex-direction: column; gap: 6px; padding: 28px 4px 26px; text-decoration: none; }
.homefix-kan-scope__list a::before { content: counter(kan-scope, decimal-leading-zero); order: -1; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-kan-scope__list a:hover .homefix-kan-scope__name, .homefix-kan-scope__list a:focus-visible .homefix-kan-scope__name { color: var( --wp--preset--color--brass ); }
.homefix-kan-scope__list a:hover .homefix-kan-scope__name::before, .homefix-kan-scope__list a:focus-visible .homefix-kan-scope__name::before { width: 20px; background: var( --wp--preset--color--brass ); }
.homefix-kan-scope__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; border-radius: 4px; }
.homefix-kan-scope__name { position: relative; display: inline-block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; color: var( --wp--preset--color--petrol ); padding-left: 22px; transition: color 160ms ease; }
.homefix-kan-scope__name::before { content: ""; position: absolute; left: 0; top: 11px; width: 12px; height: 2px; background: var( --wp--preset--color--brass ); transition: width 160ms ease, background-color 160ms ease; }
.homefix-kan-scope__desc { font-family: var( --wp--preset--font-family--body ); font-size: 14px; color: var( --wp--preset--color--ink ); opacity: .72; padding-left: 22px; }

/* ---------- Czy to Twój przypadek? — konkretne, praktyczne, symptom-first. ---------- */
.homefix-kan-scenarios { background: var( --wp--preset--color--surface-alt ); padding: 64px 24px; }
.homefix-kan-scenarios__grid { counter-reset: kan-situation; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 24px; }
.homefix-kan-scenarios__item { counter-increment: kan-situation; position: relative; background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.16); border-radius: var( --wp--custom--radius--card, 16px ); padding: 28px 28px 26px; margin: 0; }
.homefix-kan-scenarios__item::before { content: "SYTUACJA " counter(kan-situation, decimal-leading-zero); display: block; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin-bottom: 14px; }
.homefix-kan-scenarios__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 19px; line-height: 1.4; color: var( --wp--preset--color--petrol ); margin: 0 0 10px; }
.homefix-kan-scenarios__note { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; line-height: 1.55; color: var( --wp--preset--color--ink ); opacity: .72; margin: 0; }

/* ---------- Jak działa HomeFix? — premium process timeline. ---------- */
.homefix-kan-journey { padding: 64px 24px; }
.homefix-kan-journey__list { list-style: none; counter-reset: kan-step; margin: 0; padding: 0; display: flex; align-items: flex-start; gap: 0; }
.homefix-kan-journey__list li { counter-increment: kan-step; position: relative; flex: 1 1 0; padding: 0 20px 0 0; }
.homefix-kan-journey__list li:first-child { padding-left: 0; }
.homefix-kan-journey__list li::before { content: counter(kan-step); position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: var( --wp--preset--color--petrol ); box-shadow: 0 0 0 3px rgba(137,92,37,.16); color: #fff; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; margin-bottom: 18px; }
.homefix-kan-journey__list li:not(:last-child)::after { content: ""; position: absolute; top: 25px; left: 52px; width: calc(100% - 32px); height: 3px; background: linear-gradient(90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass )); opacity: .35; }
.homefix-kan-journey__list strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: var( --wp--preset--color--ink ); margin-bottom: 5px; }
.homefix-kan-journey__list span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .78; line-height: 1.55; }

/* ---------- Szybka ocena problemu i jasny proces — trust panel, 3 punkty. ---------- */
.homefix-kan-trust { background: var( --wp--preset--color--petrol ); padding: 56px 40px; border-radius: var( --wp--custom--radius--card, 16px ); margin: 0 24px 64px; }
.homefix-kan-trust .homefix-kan-section-title { color: #fff; margin-bottom: 36px; }
.homefix-kan-trust__list { counter-reset: kan-trust; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.homefix-kan-trust__item { counter-increment: kan-trust; position: relative; padding-top: 20px; }
.homefix-kan-trust__item::before { content: counter(kan-trust, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-kan-trust__item::after { content: ""; position: absolute; top: 3px; left: 34px; width: 20px; height: 2px; background: var( --wp--preset--color--brass ); opacity: .6; }
.homefix-kan-trust__item strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: #fff; margin-bottom: 8px; }
.homefix-kan-trust__item span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 14.5px; line-height: 1.55; color: #F4F2EA; opacity: .82; }

/* ---------- FAQ — premium border-based accordion. ---------- */
.homefix-kan-faq { max-width: 760px; margin: 0 auto; padding: 64px 24px; }
.homefix-kan-faq__item { background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.14); border-left: 3px solid transparent; border-radius: 12px; padding: 4px 26px; margin-bottom: 14px; transition: border-color 160ms ease, background-color 160ms ease; }
.homefix-kan-faq__item:last-child { margin-bottom: 0; }
.homefix-kan-faq__item:hover { background: var( --wp--preset--color--surface-alt ); }
.homefix-kan-faq__item[open] { border-left-color: var( --wp--preset--color--brass ); }
.homefix-kan-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; list-style: none; cursor: pointer; font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 16.5px; line-height: 1.4; min-height: var( --wp--custom--tap-target-min, 44px ); padding: 20px 0; color: var( --wp--preset--color--ink ); }
.homefix-kan-faq__item summary::-webkit-details-marker { display: none; }
.homefix-kan-faq__item summary::after { content: "+"; flex-shrink: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 22px; line-height: 1; color: var( --wp--preset--color--brass ); }
.homefix-kan-faq__item[open] summary::after { content: "−"; }
.homefix-kan-faq__item summary:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 4px; border-radius: 2px; }
.homefix-kan-faq__item p { font-family: var( --wp--preset--font-family--body ); font-size: 15px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .82; margin: 0 0 24px; }

/* ---------- Powiązane usługi — outline pills + dwa cross-linki w rzędzie. ---------- */
.homefix-kan-related { padding: 8px 24px 64px; }
.homefix-kan-related__list { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.homefix-kan-related__list a { display: inline-flex; align-items: center; background: transparent; border: 1.5px solid rgba(27,75,84,.25); border-radius: 999px; padding: 9px 18px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 13.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); transition: border-color 160ms ease, color 160ms ease; }
.homefix-kan-related__list a:hover, .homefix-kan-related__list a:focus-visible { border-color: var( --wp--preset--color--brass ); color: var( --wp--preset--color--brass ); }
.homefix-kan-related__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-kan-related__cross-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.homefix-kan-related__cross { padding: 20px 24px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--brass ); border-radius: var( --wp--custom--radius--button, 9px ); }
.homefix-kan-related__cross-q { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .7; margin: 0 0 4px; }
.homefix-kan-related__cross a { display: inline-flex; align-items: center; gap: 6px; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 15px; color: var( --wp--preset--color--brass ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); }
.homefix-kan-related__cross a span { transition: transform 160ms ease; }
.homefix-kan-related__cross a:hover span, .homefix-kan-related__cross a:focus-visible span { transform: translateX(3px); }
.homefix-kan-related__cross a:focus-visible { outline: 2px solid var( --wp--preset--color--brass ); outline-offset: 3px; border-radius: 2px; }

/* ---------- CTA końcowe — headline + subline. ---------- */
.homefix-kan-final-cta { max-width: 1280px; margin: 0 24px 72px; text-align: center; background: var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--card, 16px ); padding: 72px 40px; border-top: 3px solid var( --wp--preset--color--brass ); }
.homefix-kan-final-cta__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 29px; line-height: 1.25; color: #fff; max-width: 26ch; margin: 0 auto 14px; }
.homefix-kan-final-cta__subline { font-family: var( --wp--preset--font-family--body ); font-size: 16px; line-height: 1.55; color: #F4F2EA; opacity: .82; max-width: 48ch; margin: 0 auto 32px; }
.homefix-kan-final-cta__row { display: flex; align-items: center; justify-content: center; gap: 22px; flex-wrap: wrap; }
.homefix-kan-final-cta__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--background ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-kan-final-cta__phone:hover, .homefix-kan-final-cta__phone:focus-visible { opacity: .8; }

@media ( max-width: 780px ) {
	.homefix-kan-hero { flex-direction: column; align-items: stretch; padding: 32px 20px 40px; gap: 28px; }
	.homefix-kan-hero__media::before { display: none; }
	.homefix-kan-hero__media-frame { aspect-ratio: 4/3; border-radius: 16px; }
	.homefix-kan-hero__heading { font-size: 28px; max-width: none; }
	.homefix-kan-hero__desc { max-width: none; }
	.homefix-kan-recognize, .homefix-kan-scope, .homefix-kan-scenarios, .homefix-kan-journey, .homefix-kan-faq, .homefix-kan-related { padding-left: 20px; padding-right: 20px; }
	.homefix-kan-recognize__grid, .homefix-kan-scenarios__grid { grid-template-columns: 1fr; }
	.homefix-kan-journey__list { flex-direction: column; gap: 28px; }
	.homefix-kan-journey__list li { padding: 0 0 0 68px; }
	.homefix-kan-journey__list li:first-child { padding-left: 68px; }
	.homefix-kan-journey__list li::before { position: absolute; left: 0; top: 0; margin-bottom: 0; }
	.homefix-kan-journey__list li:not(:last-child)::after { top: 52px; left: 25px; width: 3px; height: calc(100% + 12px); }
	.homefix-kan-trust { margin: 0 20px 40px; padding: 36px 24px; }
	.homefix-kan-trust__list { grid-template-columns: 1fr; gap: 28px; }
	.homefix-kan-related__cross-row { grid-template-columns: 1fr; }
	.homefix-kan-final-cta { margin: 0 20px 48px; padding: 44px 24px; }
	.homefix-kan-final-cta__headline { font-size: 22px; }
	.homefix-kan-hero__ctas, .homefix-kan-final-cta__row { flex-direction: column; align-items: stretch; }
	.homefix-kan-hero__ctas .homefix-cta-seam, .homefix-kan-final-cta__row .homefix-cta-seam { width: 100%; }
	.homefix-kan-hero__ctas .homefix-cta-seam__btn, .homefix-kan-final-cta__row .homefix-cta-seam__btn { width: 100%; justify-content: center; }
}

/* ==================== SPRZĄTANIE — PREMIUM REDESIGN (2026-09-18,
   zatwierdzony przez właściciela) — pełna adaptacja finalnego systemu
   Hydrauliki/Elektryki/Montażu/Naprawy domowej/Kanalizacji/Mycia
   ciśnieniowego. Namespace `.homefix-sprz-*` w całości osobny.
   Sygnaturowa sekcja "Dwa rodzaje potrzeb" (NA CO DZIEŃ / PO ZDARZENIU)
   zachowana, przestylizowana na dwie premium karty, tuż pod Hero.
   ==================== */

.homefix-sprz-page { max-width: 1280px; margin: 0 auto; }
.homefix-sprz-section-title { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 26px; line-height: 1.2; color: var( --wp--preset--color--petrol ); margin: 0 0 12px; }

/* ---------- Hero — warstwowy układ, identyczna mechanika co finalna Hydraulika/Elektryka. ---------- */
.homefix-sprz-hero { display: flex; align-items: center; gap: 56px; padding: 56px 24px 64px; }
.homefix-sprz-hero__copy { flex: 1 1 44%; min-width: 0; }
.homefix-sprz-hero__eyebrow { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin: 0 0 16px; }
.homefix-sprz-hero__heading { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 40px; line-height: 1.12; color: var( --wp--preset--color--petrol ); margin: 0 0 18px; max-width: 17ch; }
.homefix-sprz-hero__desc { font-family: var( --wp--preset--font-family--body ); font-size: 17px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .85; max-width: 50ch; margin: 0 0 22px; }
.homefix-sprz-hero__proof { list-style: none; margin: 0 0 30px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.homefix-sprz-hero__proof li { position: relative; padding-left: 22px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); }
.homefix-sprz-hero__proof li::before { content: ""; position: absolute; left: 0; top: 6px; width: 9px; height: 9px; border-radius: 3px; background: var( --wp--preset--color--brass ); }
.homefix-sprz-hero__ctas { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.homefix-sprz-hero__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-sprz-hero__phone:hover, .homefix-sprz-hero__phone:focus-visible { opacity: .72; }
.homefix-sprz-hero__media { flex: 1 1 56%; min-width: 0; position: relative; }
.homefix-sprz-hero__media::before { content: ""; position: absolute; top: 22px; right: -22px; bottom: -22px; left: 22px; background: var( --wp--preset--color--surface-alt ); border-radius: var( --wp--custom--radius--card, 16px ); z-index: 0; }
.homefix-sprz-hero__media-frame { position: relative; z-index: 1; border-radius: 20px; overflow: hidden; aspect-ratio: 4/5; box-shadow: 0 28px 56px -18px rgba(18,51,57,.32); }
.homefix-sprz-hero__picture, .homefix-sprz-hero__picture img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Dwa rodzaje potrzeb — sygnaturowa sekcja, zachowana, przestylizowana na dwie karty. ---------- */
.homefix-sprz-modes { padding: 0 24px 56px; }
.homefix-sprz-modes__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.homefix-sprz-modes__col { background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--card, 16px ); padding: 26px 28px; }
.homefix-sprz-modes__label { font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin: 0 0 16px; }
.homefix-sprz-modes__col ul { list-style: none; margin: 0; padding: 0; }
.homefix-sprz-modes__col li { border-top: 1px solid rgba(27,75,84,.1); }
.homefix-sprz-modes__col li:first-child { border-top: none; }
.homefix-sprz-modes__col a { display: block; padding: 12px 0; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 15px; color: var( --wp--preset--color--petrol ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); transition: color 160ms ease; }
.homefix-sprz-modes__col a:hover, .homefix-sprz-modes__col a:focus-visible { color: var( --wp--preset--color--brass ); }
.homefix-sprz-modes__col a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }

/* ---------- Z czym się zmagasz? ---------- */
.homefix-sprz-recognize { padding: 8px 24px 64px; }
.homefix-sprz-recognize__lead { font-family: var( --wp--preset--font-family--body ); font-size: 15px; color: var( --wp--preset--color--ink ); opacity: .75; margin: -8px 0 24px; }
.homefix-sprz-recognize__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media ( min-width: 781px ) and ( max-width: 1023px ) { .homefix-sprz-recognize__grid { grid-template-columns: repeat(2, 1fr); } }
.homefix-sprz-recognize__card { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--button, 9px ); padding: 20px 22px; min-height: var( --wp--custom--tap-target-min, 44px ); font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 15.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; transition: transform 160ms ease, background-color 160ms ease, border-left-width 160ms ease; }
.homefix-sprz-recognize__card:hover, .homefix-sprz-recognize__card:focus-visible { background: var( --wp--preset--color--background ); border-left-width: 5px; transform: translateX(3px); }
.homefix-sprz-recognize__card:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-sprz-recognize__arrow { color: var( --wp--preset--color--brass ); font-weight: 700; flex-shrink: 0; transition: transform 160ms ease; }
.homefix-sprz-recognize__card:hover .homefix-sprz-recognize__arrow, .homefix-sprz-recognize__card:focus-visible .homefix-sprz-recognize__arrow { transform: translateX(4px); }

/* ---------- Zakres usług — editorial premium layout. ---------- */
.homefix-sprz-scope { padding: 8px 24px 64px; }
.homefix-sprz-scope__list { counter-reset: sprz-scope; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 56px; }
.homefix-sprz-scope__list li { counter-increment: sprz-scope; border-bottom: 1px solid rgba(27,36,32,.08); }
.homefix-sprz-scope__list a { display: flex; flex-direction: column; gap: 6px; padding: 28px 4px 26px; text-decoration: none; }
.homefix-sprz-scope__list a::before { content: counter(sprz-scope, decimal-leading-zero); order: -1; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-sprz-scope__list a:hover .homefix-sprz-scope__name, .homefix-sprz-scope__list a:focus-visible .homefix-sprz-scope__name { color: var( --wp--preset--color--brass ); }
.homefix-sprz-scope__list a:hover .homefix-sprz-scope__name::before, .homefix-sprz-scope__list a:focus-visible .homefix-sprz-scope__name::before { width: 20px; background: var( --wp--preset--color--brass ); }
.homefix-sprz-scope__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; border-radius: 4px; }
.homefix-sprz-scope__name { position: relative; display: inline-block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; color: var( --wp--preset--color--petrol ); padding-left: 22px; transition: color 160ms ease; }
.homefix-sprz-scope__name::before { content: ""; position: absolute; left: 0; top: 11px; width: 12px; height: 2px; background: var( --wp--preset--color--brass ); transition: width 160ms ease, background-color 160ms ease; }
.homefix-sprz-scope__desc { font-family: var( --wp--preset--font-family--body ); font-size: 14px; color: var( --wp--preset--color--ink ); opacity: .72; padding-left: 22px; }

/* ---------- Czy to Twój przypadek? ---------- */
.homefix-sprz-scenarios { background: var( --wp--preset--color--surface-alt ); padding: 64px 24px; }
.homefix-sprz-scenarios__grid { counter-reset: sprz-situation; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 24px; }
.homefix-sprz-scenarios__item { counter-increment: sprz-situation; position: relative; background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.16); border-radius: var( --wp--custom--radius--card, 16px ); padding: 28px 28px 26px; margin: 0; }
.homefix-sprz-scenarios__item::before { content: "SYTUACJA " counter(sprz-situation, decimal-leading-zero); display: block; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin-bottom: 14px; }
.homefix-sprz-scenarios__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 19px; line-height: 1.4; color: var( --wp--preset--color--petrol ); margin: 0 0 10px; }
.homefix-sprz-scenarios__note { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; line-height: 1.55; color: var( --wp--preset--color--ink ); opacity: .72; margin: 0; }

/* ---------- Jak działa HomeFix? — premium process timeline. ---------- */
.homefix-sprz-journey { padding: 64px 24px; }
.homefix-sprz-journey__list { list-style: none; counter-reset: sprz-step; margin: 0; padding: 0; display: flex; align-items: flex-start; gap: 0; }
.homefix-sprz-journey__list li { counter-increment: sprz-step; position: relative; flex: 1 1 0; padding: 0 20px 0 0; }
.homefix-sprz-journey__list li:first-child { padding-left: 0; }
.homefix-sprz-journey__list li::before { content: counter(sprz-step); position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: var( --wp--preset--color--petrol ); box-shadow: 0 0 0 3px rgba(137,92,37,.16); color: #fff; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; margin-bottom: 18px; }
.homefix-sprz-journey__list li:not(:last-child)::after { content: ""; position: absolute; top: 25px; left: 52px; width: calc(100% - 32px); height: 3px; background: linear-gradient(90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass )); opacity: .35; }
.homefix-sprz-journey__list strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: var( --wp--preset--color--ink ); margin-bottom: 5px; }
.homefix-sprz-journey__list span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .78; line-height: 1.55; }

/* ---------- Wygodna organizacja i jasny zakres — trust panel, 3 punkty. ---------- */
.homefix-sprz-trust { background: var( --wp--preset--color--petrol ); padding: 56px 40px; border-radius: var( --wp--custom--radius--card, 16px ); margin: 0 24px 64px; }
.homefix-sprz-trust .homefix-sprz-section-title { color: #fff; margin-bottom: 36px; }
.homefix-sprz-trust__list { counter-reset: sprz-trust; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.homefix-sprz-trust__item { counter-increment: sprz-trust; position: relative; padding-top: 20px; }
.homefix-sprz-trust__item::before { content: counter(sprz-trust, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-sprz-trust__item::after { content: ""; position: absolute; top: 3px; left: 34px; width: 20px; height: 2px; background: var( --wp--preset--color--brass ); opacity: .6; }
.homefix-sprz-trust__item strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: #fff; margin-bottom: 8px; }
.homefix-sprz-trust__item span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 14.5px; line-height: 1.55; color: #F4F2EA; opacity: .82; }

/* ---------- FAQ — premium border-based accordion. ---------- */
.homefix-sprz-faq { max-width: 760px; margin: 0 auto; padding: 64px 24px; }
.homefix-sprz-faq__item { background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.14); border-left: 3px solid transparent; border-radius: 12px; padding: 4px 26px; margin-bottom: 14px; transition: border-color 160ms ease, background-color 160ms ease; }
.homefix-sprz-faq__item:last-child { margin-bottom: 0; }
.homefix-sprz-faq__item:hover { background: var( --wp--preset--color--surface-alt ); }
.homefix-sprz-faq__item[open] { border-left-color: var( --wp--preset--color--brass ); }
.homefix-sprz-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; list-style: none; cursor: pointer; font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 16.5px; line-height: 1.4; min-height: var( --wp--custom--tap-target-min, 44px ); padding: 20px 0; color: var( --wp--preset--color--ink ); }
.homefix-sprz-faq__item summary::-webkit-details-marker { display: none; }
.homefix-sprz-faq__item summary::after { content: "+"; flex-shrink: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 22px; line-height: 1; color: var( --wp--preset--color--brass ); }
.homefix-sprz-faq__item[open] summary::after { content: "−"; }
.homefix-sprz-faq__item summary:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 4px; border-radius: 2px; }
.homefix-sprz-faq__item p { font-family: var( --wp--preset--font-family--body ); font-size: 15px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .82; margin: 0 0 24px; }

/* ---------- Powiązane usługi — outline pills + dwa cross-linki w rzędzie. ---------- */
.homefix-sprz-related { padding: 8px 24px 64px; }
.homefix-sprz-related__list { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.homefix-sprz-related__list a { display: inline-flex; align-items: center; background: transparent; border: 1.5px solid rgba(27,75,84,.25); border-radius: 999px; padding: 9px 18px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 13.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); transition: border-color 160ms ease, color 160ms ease; }
.homefix-sprz-related__list a:hover, .homefix-sprz-related__list a:focus-visible { border-color: var( --wp--preset--color--brass ); color: var( --wp--preset--color--brass ); }
.homefix-sprz-related__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-sprz-related__cross-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.homefix-sprz-related__cross { padding: 20px 24px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--brass ); border-radius: var( --wp--custom--radius--button, 9px ); }
.homefix-sprz-related__cross-q { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .7; margin: 0 0 4px; }
.homefix-sprz-related__cross a { display: inline-flex; align-items: center; gap: 6px; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 15px; color: var( --wp--preset--color--brass ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); }
.homefix-sprz-related__cross a span { transition: transform 160ms ease; }
.homefix-sprz-related__cross a:hover span, .homefix-sprz-related__cross a:focus-visible span { transform: translateX(3px); }
.homefix-sprz-related__cross a:focus-visible { outline: 2px solid var( --wp--preset--color--brass ); outline-offset: 3px; border-radius: 2px; }

/* ---------- CTA końcowe — headline + subline. ---------- */
.homefix-sprz-final-cta { max-width: 1280px; margin: 0 24px 72px; text-align: center; background: var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--card, 16px ); padding: 72px 40px; border-top: 3px solid var( --wp--preset--color--brass ); }
.homefix-sprz-final-cta__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 29px; line-height: 1.25; color: #fff; max-width: 26ch; margin: 0 auto 14px; }
.homefix-sprz-final-cta__subline { font-family: var( --wp--preset--font-family--body ); font-size: 16px; line-height: 1.55; color: #F4F2EA; opacity: .82; max-width: 48ch; margin: 0 auto 32px; }
.homefix-sprz-final-cta__row { display: flex; align-items: center; justify-content: center; gap: 22px; flex-wrap: wrap; }
.homefix-sprz-final-cta__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--background ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-sprz-final-cta__phone:hover, .homefix-sprz-final-cta__phone:focus-visible { opacity: .8; }

@media ( max-width: 780px ) {
	.homefix-sprz-hero { flex-direction: column; align-items: stretch; padding: 32px 20px 40px; gap: 28px; }
	.homefix-sprz-hero__media::before { display: none; }
	.homefix-sprz-hero__media-frame { aspect-ratio: 4/3; border-radius: 16px; }
	.homefix-sprz-hero__heading { font-size: 30px; max-width: none; }
	.homefix-sprz-hero__desc { max-width: none; }
	.homefix-sprz-modes__grid { grid-template-columns: 1fr; gap: 16px; }
	.homefix-sprz-modes, .homefix-sprz-recognize, .homefix-sprz-scope, .homefix-sprz-scenarios, .homefix-sprz-journey, .homefix-sprz-faq, .homefix-sprz-related { padding-left: 20px; padding-right: 20px; }
	.homefix-sprz-recognize__grid, .homefix-sprz-scenarios__grid { grid-template-columns: 1fr; }
	.homefix-sprz-scope__list { grid-template-columns: 1fr; column-gap: 0; }
	.homefix-sprz-journey__list { flex-direction: column; gap: 28px; }
	.homefix-sprz-journey__list li { padding: 0 0 0 68px; }
	.homefix-sprz-journey__list li:first-child { padding-left: 68px; }
	.homefix-sprz-journey__list li::before { position: absolute; left: 0; top: 0; margin-bottom: 0; }
	.homefix-sprz-journey__list li:not(:last-child)::after { top: 52px; left: 25px; width: 3px; height: calc(100% + 12px); }
	.homefix-sprz-trust { margin: 0 20px 40px; padding: 36px 24px; }
	.homefix-sprz-trust__list { grid-template-columns: 1fr; gap: 28px; }
	.homefix-sprz-related__cross-row { grid-template-columns: 1fr; }
	.homefix-sprz-final-cta { margin: 0 20px 48px; padding: 44px 24px; }
	.homefix-sprz-final-cta__headline { font-size: 23px; }
	.homefix-sprz-hero__ctas, .homefix-sprz-final-cta__row { flex-direction: column; align-items: stretch; }
	.homefix-sprz-hero__ctas .homefix-cta-seam, .homefix-sprz-final-cta__row .homefix-cta-seam { width: 100%; }
	.homefix-sprz-hero__ctas .homefix-cta-seam__btn, .homefix-sprz-final-cta__row .homefix-cta-seam__btn { width: 100%; justify-content: center; }
}

/* ==================== NAPRAWY DOMOWE — PREMIUM REDESIGN (2026-09-17,
   zatwierdzony przez właściciela) — pełna adaptacja finalnego systemu
   Hydrauliki/Elektryki. Namespace `.homefix-napr-*` w całości osobny.
   ==================== */

.homefix-napr-page { max-width: 1280px; margin: 0 auto; }
.homefix-napr-section-title { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 26px; line-height: 1.2; color: var( --wp--preset--color--petrol ); margin: 0 0 12px; }

/* ---------- Hero — warstwowy układ, identyczna mechanika co finalna Hydraulika/Elektryka. ---------- */
.homefix-napr-hero { display: flex; align-items: center; gap: 56px; padding: 56px 24px 64px; }
.homefix-napr-hero__copy { flex: 1 1 44%; min-width: 0; }
.homefix-napr-hero__eyebrow { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin: 0 0 16px; }
.homefix-napr-hero__heading { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 36px; line-height: 1.16; color: var( --wp--preset--color--petrol ); margin: 0 0 18px; max-width: 18ch; }
.homefix-napr-hero__desc { font-family: var( --wp--preset--font-family--body ); font-size: 17px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .85; max-width: 50ch; margin: 0 0 22px; }
.homefix-napr-hero__proof { list-style: none; margin: 0 0 30px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.homefix-napr-hero__proof li { position: relative; padding-left: 22px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); }
.homefix-napr-hero__proof li::before { content: ""; position: absolute; left: 0; top: 6px; width: 9px; height: 9px; border-radius: 3px; background: var( --wp--preset--color--brass ); }
.homefix-napr-hero__ctas { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.homefix-napr-hero__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-napr-hero__phone:hover, .homefix-napr-hero__phone:focus-visible { opacity: .72; }
.homefix-napr-hero__media { flex: 1 1 56%; min-width: 0; position: relative; }
.homefix-napr-hero__media::before { content: ""; position: absolute; top: 22px; right: -22px; bottom: -22px; left: 22px; background: var( --wp--preset--color--surface-alt ); border-radius: var( --wp--custom--radius--card, 16px ); z-index: 0; }
.homefix-napr-hero__media-frame { position: relative; z-index: 1; border-radius: 20px; overflow: hidden; aspect-ratio: 4/5; box-shadow: 0 28px 56px -18px rgba(18,51,57,.32); }
.homefix-napr-hero__picture, .homefix-napr-hero__picture img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Z czym się zmagasz? ---------- */
.homefix-napr-recognize { padding: 8px 24px 64px; }
.homefix-napr-recognize__lead { font-family: var( --wp--preset--font-family--body ); font-size: 15px; color: var( --wp--preset--color--ink ); opacity: .75; margin: -8px 0 24px; }
.homefix-napr-recognize__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media ( min-width: 781px ) and ( max-width: 1023px ) { .homefix-napr-recognize__grid { grid-template-columns: repeat(2, 1fr); } }
.homefix-napr-recognize__card { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--button, 9px ); padding: 20px 22px; min-height: var( --wp--custom--tap-target-min, 44px ); font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 15.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; transition: transform 160ms ease, background-color 160ms ease, border-left-width 160ms ease; }
.homefix-napr-recognize__card:hover, .homefix-napr-recognize__card:focus-visible { background: var( --wp--preset--color--background ); border-left-width: 5px; transform: translateX(3px); }
.homefix-napr-recognize__card:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-napr-recognize__arrow { color: var( --wp--preset--color--brass ); font-weight: 700; flex-shrink: 0; transition: transform 160ms ease; }
.homefix-napr-recognize__card:hover .homefix-napr-recognize__arrow, .homefix-napr-recognize__card:focus-visible .homefix-napr-recognize__arrow { transform: translateX(4px); }

/* ---------- Zakres usług — editorial premium layout. ---------- */
.homefix-napr-scope { padding: 8px 24px 64px; }
.homefix-napr-scope__list { counter-reset: napr-scope; list-style: none; margin: 0; padding: 0; max-width: 640px; }
.homefix-napr-scope__list li { counter-increment: napr-scope; border-bottom: 1px solid rgba(27,36,32,.08); }
.homefix-napr-scope__list a { display: flex; flex-direction: column; gap: 6px; padding: 28px 4px 26px; text-decoration: none; }
.homefix-napr-scope__list a::before { content: counter(napr-scope, decimal-leading-zero); order: -1; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-napr-scope__list a:hover .homefix-napr-scope__name, .homefix-napr-scope__list a:focus-visible .homefix-napr-scope__name { color: var( --wp--preset--color--brass ); }
.homefix-napr-scope__list a:hover .homefix-napr-scope__name::before, .homefix-napr-scope__list a:focus-visible .homefix-napr-scope__name::before { width: 20px; background: var( --wp--preset--color--brass ); }
.homefix-napr-scope__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; border-radius: 4px; }
.homefix-napr-scope__name { position: relative; display: inline-block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; color: var( --wp--preset--color--petrol ); padding-left: 22px; transition: color 160ms ease; }
.homefix-napr-scope__name::before { content: ""; position: absolute; left: 0; top: 11px; width: 12px; height: 2px; background: var( --wp--preset--color--brass ); transition: width 160ms ease, background-color 160ms ease; }
.homefix-napr-scope__desc { font-family: var( --wp--preset--font-family--body ); font-size: 14px; color: var( --wp--preset--color--ink ); opacity: .72; padding-left: 22px; }

/* ---------- Czy to Twój przypadek? ---------- */
.homefix-napr-scenarios { background: var( --wp--preset--color--surface-alt ); padding: 64px 24px; }
.homefix-napr-scenarios__grid { counter-reset: napr-situation; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 24px; }
.homefix-napr-scenarios__item { counter-increment: napr-situation; position: relative; background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.16); border-radius: var( --wp--custom--radius--card, 16px ); padding: 28px 28px 26px; margin: 0; }
.homefix-napr-scenarios__item::before { content: "SYTUACJA " counter(napr-situation, decimal-leading-zero); display: block; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin-bottom: 14px; }
.homefix-napr-scenarios__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 19px; line-height: 1.4; color: var( --wp--preset--color--petrol ); margin: 0 0 10px; }
.homefix-napr-scenarios__note { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; line-height: 1.55; color: var( --wp--preset--color--ink ); opacity: .72; margin: 0; }

/* ---------- Jak działa HomeFix? — premium process timeline. ---------- */
.homefix-napr-journey { padding: 64px 24px; }
.homefix-napr-journey__list { list-style: none; counter-reset: napr-step; margin: 0; padding: 0; display: flex; align-items: flex-start; gap: 0; }
.homefix-napr-journey__list li { counter-increment: napr-step; position: relative; flex: 1 1 0; padding: 0 20px 0 0; }
.homefix-napr-journey__list li:first-child { padding-left: 0; }
.homefix-napr-journey__list li::before { content: counter(napr-step); position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: var( --wp--preset--color--petrol ); box-shadow: 0 0 0 3px rgba(137,92,37,.16); color: #fff; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; margin-bottom: 18px; }
.homefix-napr-journey__list li:not(:last-child)::after { content: ""; position: absolute; top: 25px; left: 52px; width: calc(100% - 32px); height: 3px; background: linear-gradient(90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass )); opacity: .35; }
.homefix-napr-journey__list strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: var( --wp--preset--color--ink ); margin-bottom: 5px; }
.homefix-napr-journey__list span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .78; line-height: 1.55; }

/* ---------- Jeden kontakt, mniej organizacji po Twojej stronie — trust panel, 3 punkty. ---------- */
.homefix-napr-trust { background: var( --wp--preset--color--petrol ); padding: 56px 40px; border-radius: var( --wp--custom--radius--card, 16px ); margin: 0 24px 64px; }
.homefix-napr-trust .homefix-napr-section-title { color: #fff; margin-bottom: 36px; }
.homefix-napr-trust__list { counter-reset: napr-trust; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.homefix-napr-trust__item { counter-increment: napr-trust; position: relative; padding-top: 20px; }
.homefix-napr-trust__item::before { content: counter(napr-trust, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-napr-trust__item::after { content: ""; position: absolute; top: 3px; left: 34px; width: 20px; height: 2px; background: var( --wp--preset--color--brass ); opacity: .6; }
.homefix-napr-trust__item strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: #fff; margin-bottom: 8px; }
.homefix-napr-trust__item span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 14.5px; line-height: 1.55; color: #F4F2EA; opacity: .82; }

/* ---------- FAQ — premium border-based accordion. ---------- */
.homefix-napr-faq { max-width: 760px; margin: 0 auto; padding: 64px 24px; }
.homefix-napr-faq__item { background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.14); border-left: 3px solid transparent; border-radius: 12px; padding: 4px 26px; margin-bottom: 14px; transition: border-color 160ms ease, background-color 160ms ease; }
.homefix-napr-faq__item:last-child { margin-bottom: 0; }
.homefix-napr-faq__item:hover { background: var( --wp--preset--color--surface-alt ); }
.homefix-napr-faq__item[open] { border-left-color: var( --wp--preset--color--brass ); }
.homefix-napr-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; list-style: none; cursor: pointer; font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 16.5px; line-height: 1.4; min-height: var( --wp--custom--tap-target-min, 44px ); padding: 20px 0; color: var( --wp--preset--color--ink ); }
.homefix-napr-faq__item summary::-webkit-details-marker { display: none; }
.homefix-napr-faq__item summary::after { content: "+"; flex-shrink: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 22px; line-height: 1; color: var( --wp--preset--color--brass ); }
.homefix-napr-faq__item[open] summary::after { content: "−"; }
.homefix-napr-faq__item summary:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 4px; border-radius: 2px; }
.homefix-napr-faq__item p { font-family: var( --wp--preset--font-family--body ); font-size: 15px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .82; margin: 0 0 24px; }

/* ---------- Powiązane usługi — outline pills (bez cross-linku, router niżej pełni tę rolę). ---------- */
.homefix-napr-related { padding: 8px 24px 44px; }
.homefix-napr-related__list { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.homefix-napr-related__list a { display: inline-flex; align-items: center; background: transparent; border: 1.5px solid rgba(27,75,84,.25); border-radius: 999px; padding: 9px 18px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 13.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); transition: border-color 160ms ease, color 160ms ease; }
.homefix-napr-related__list a:hover, .homefix-napr-related__list a:focus-visible { border-color: var( --wp--preset--color--brass ); color: var( --wp--preset--color--brass ); }
.homefix-napr-related__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }

/* ---------- Router — sygnaturowa sekcja tej strony, premium outline pills z Brass hover. ---------- */
.homefix-napr-router { background: var( --wp--preset--color--surface-alt ); padding: 48px 24px 64px; }
.homefix-napr-router__intro { font-family: var( --wp--preset--font-family--body ); font-size: 14.5px; color: var( --wp--preset--color--ink ); opacity: .75; margin: 0 0 24px; }
.homefix-napr-router__grid { display: flex; flex-wrap: wrap; gap: 12px; }
.homefix-napr-router__item { display: inline-flex; align-items: center; background: var( --wp--preset--color--surface ); border: 1.5px solid rgba(27,75,84,.2); border-radius: 999px; padding: 10px 20px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14px; color: var( --wp--preset--color--petrol ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); transition: border-color 160ms ease, color 160ms ease; }
.homefix-napr-router__item:hover, .homefix-napr-router__item:focus-visible { border-color: var( --wp--preset--color--brass ); color: var( --wp--preset--color--brass ); }
.homefix-napr-router__item:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }

/* ---------- CTA końcowe — headline + subline. ---------- */
.homefix-napr-final-cta { max-width: 1280px; margin: 0 24px 72px; text-align: center; background: var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--card, 16px ); padding: 72px 40px; border-top: 3px solid var( --wp--preset--color--brass ); }
.homefix-napr-final-cta__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 29px; line-height: 1.25; color: #fff; max-width: 26ch; margin: 0 auto 14px; }
.homefix-napr-final-cta__subline { font-family: var( --wp--preset--font-family--body ); font-size: 16px; line-height: 1.55; color: #F4F2EA; opacity: .82; max-width: 48ch; margin: 0 auto 32px; }
.homefix-napr-final-cta__row { display: flex; align-items: center; justify-content: center; gap: 22px; flex-wrap: wrap; }
.homefix-napr-final-cta__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--background ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-napr-final-cta__phone:hover, .homefix-napr-final-cta__phone:focus-visible { opacity: .8; }

@media ( max-width: 780px ) {
	.homefix-napr-hero { flex-direction: column; align-items: stretch; padding: 32px 20px 40px; gap: 28px; }
	.homefix-napr-hero__media::before { display: none; }
	.homefix-napr-hero__media-frame { aspect-ratio: 4/3; border-radius: 16px; }
	.homefix-napr-hero__heading { font-size: 28px; max-width: none; }
	.homefix-napr-hero__desc { max-width: none; }
	.homefix-napr-recognize, .homefix-napr-scope, .homefix-napr-scenarios, .homefix-napr-journey, .homefix-napr-faq, .homefix-napr-related, .homefix-napr-router { padding-left: 20px; padding-right: 20px; }
	.homefix-napr-recognize__grid, .homefix-napr-scenarios__grid { grid-template-columns: 1fr; }
	.homefix-napr-journey__list { flex-direction: column; gap: 28px; }
	.homefix-napr-journey__list li { padding: 0 0 0 68px; }
	.homefix-napr-journey__list li:first-child { padding-left: 68px; }
	.homefix-napr-journey__list li::before { position: absolute; left: 0; top: 0; margin-bottom: 0; }
	.homefix-napr-journey__list li:not(:last-child)::after { top: 52px; left: 25px; width: 3px; height: calc(100% + 12px); }
	.homefix-napr-trust { margin: 0 20px 40px; padding: 36px 24px; }
	.homefix-napr-trust__list { grid-template-columns: 1fr; gap: 28px; }
	.homefix-napr-final-cta { margin: 0 20px 48px; padding: 44px 24px; }
	.homefix-napr-final-cta__headline { font-size: 22px; }
	.homefix-napr-hero__ctas, .homefix-napr-final-cta__row { flex-direction: column; align-items: stretch; }
	.homefix-napr-hero__ctas .homefix-cta-seam, .homefix-napr-final-cta__row .homefix-cta-seam { width: 100%; }
	.homefix-napr-hero__ctas .homefix-cta-seam__btn, .homefix-napr-final-cta__row .homefix-cta-seam__btn { width: 100%; justify-content: center; }
}

/* ==================== MYCIE CIŚNIENIOWE — PREMIUM REDESIGN (2026-09-18,
   zatwierdzony przez właściciela) — pełna adaptacja finalnego systemu
   Hydrauliki/Elektryki/Montażu/Naprawy domowej/Kanalizacji. Namespace
   `.homefix-myc-*` w całości osobny. Sygnaturowa sekcja "Zobacz realny
   efekt" (link do porównania przed/po na stronie głównej) zachowana,
   przestylizowana jako karta z akcentem brass.
   ==================== */

.homefix-myc-page { max-width: 1280px; margin: 0 auto; }
.homefix-myc-section-title { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 26px; line-height: 1.2; color: var( --wp--preset--color--petrol ); margin: 0 0 12px; }

/* ---------- Hero — warstwowy układ, identyczna mechanika co finalna Hydraulika/Elektryka. ---------- */
.homefix-myc-hero { display: flex; align-items: center; gap: 56px; padding: 56px 24px 64px; }
.homefix-myc-hero__copy { flex: 1 1 44%; min-width: 0; }
.homefix-myc-hero__eyebrow { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin: 0 0 16px; }
.homefix-myc-hero__heading { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 40px; line-height: 1.12; color: var( --wp--preset--color--petrol ); margin: 0 0 18px; max-width: 17ch; }
.homefix-myc-hero__desc { font-family: var( --wp--preset--font-family--body ); font-size: 17px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .85; max-width: 50ch; margin: 0 0 22px; }
.homefix-myc-hero__proof { list-style: none; margin: 0 0 30px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.homefix-myc-hero__proof li { position: relative; padding-left: 22px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); }
.homefix-myc-hero__proof li::before { content: ""; position: absolute; left: 0; top: 6px; width: 9px; height: 9px; border-radius: 3px; background: var( --wp--preset--color--brass ); }
.homefix-myc-hero__ctas { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.homefix-myc-hero__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-myc-hero__phone:hover, .homefix-myc-hero__phone:focus-visible { opacity: .72; }
.homefix-myc-hero__media { flex: 1 1 56%; min-width: 0; position: relative; }
.homefix-myc-hero__media::before { content: ""; position: absolute; top: 22px; right: -22px; bottom: -22px; left: 22px; background: var( --wp--preset--color--surface-alt ); border-radius: var( --wp--custom--radius--card, 16px ); z-index: 0; }
.homefix-myc-hero__media-frame { position: relative; z-index: 1; border-radius: 20px; overflow: hidden; aspect-ratio: 4/5; box-shadow: 0 28px 56px -18px rgba(18,51,57,.32); }
.homefix-myc-hero__picture, .homefix-myc-hero__picture img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Zobacz realny efekt — sygnaturowa karta, link do porównania przed/po na homepage. ---------- */
.homefix-myc-before-after { margin: 0 24px 56px; padding: 24px 28px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--brass ); border-radius: var( --wp--custom--radius--button, 9px ); display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.homefix-myc-before-after__q { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 16.5px; color: var( --wp--preset--color--petrol ); margin: 0 0 4px; }
.homefix-myc-before-after__desc { font-family: var( --wp--preset--font-family--body ); font-size: 14px; color: var( --wp--preset--color--ink ); opacity: .72; margin: 0; max-width: 46ch; }
.homefix-myc-before-after__link { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 15px; color: var( --wp--preset--color--brass ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); }
.homefix-myc-before-after__link span { transition: transform 160ms ease; }
.homefix-myc-before-after__link:hover span, .homefix-myc-before-after__link:focus-visible span { transform: translateX(3px); }
.homefix-myc-before-after__link:focus-visible { outline: 2px solid var( --wp--preset--color--brass ); outline-offset: 3px; border-radius: 2px; }

/* ---------- Z czym się zmagasz? ---------- */
.homefix-myc-recognize { padding: 8px 24px 64px; }
.homefix-myc-recognize__lead { font-family: var( --wp--preset--font-family--body ); font-size: 15px; color: var( --wp--preset--color--ink ); opacity: .75; margin: -8px 0 24px; }
.homefix-myc-recognize__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media ( min-width: 781px ) and ( max-width: 1023px ) { .homefix-myc-recognize__grid { grid-template-columns: repeat(2, 1fr); } }
.homefix-myc-recognize__card { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--button, 9px ); padding: 20px 22px; min-height: var( --wp--custom--tap-target-min, 44px ); font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 15.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; transition: transform 160ms ease, background-color 160ms ease, border-left-width 160ms ease; }
.homefix-myc-recognize__card:hover, .homefix-myc-recognize__card:focus-visible { background: var( --wp--preset--color--background ); border-left-width: 5px; transform: translateX(3px); }
.homefix-myc-recognize__card:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-myc-recognize__arrow { color: var( --wp--preset--color--brass ); font-weight: 700; flex-shrink: 0; transition: transform 160ms ease; }
.homefix-myc-recognize__card:hover .homefix-myc-recognize__arrow, .homefix-myc-recognize__card:focus-visible .homefix-myc-recognize__arrow { transform: translateX(4px); }

/* ---------- Zakres usług — editorial premium layout. ---------- */
.homefix-myc-scope { padding: 8px 24px 64px; }
.homefix-myc-scope__list { counter-reset: myc-scope; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 56px; }
.homefix-myc-scope__list li { counter-increment: myc-scope; border-bottom: 1px solid rgba(27,36,32,.08); }
.homefix-myc-scope__list a { display: flex; flex-direction: column; gap: 6px; padding: 28px 4px 26px; text-decoration: none; }
.homefix-myc-scope__list a::before { content: counter(myc-scope, decimal-leading-zero); order: -1; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-myc-scope__list a:hover .homefix-myc-scope__name, .homefix-myc-scope__list a:focus-visible .homefix-myc-scope__name { color: var( --wp--preset--color--brass ); }
.homefix-myc-scope__list a:hover .homefix-myc-scope__name::before, .homefix-myc-scope__list a:focus-visible .homefix-myc-scope__name::before { width: 20px; background: var( --wp--preset--color--brass ); }
.homefix-myc-scope__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; border-radius: 4px; }
.homefix-myc-scope__name { position: relative; display: inline-block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; color: var( --wp--preset--color--petrol ); padding-left: 22px; transition: color 160ms ease; }
.homefix-myc-scope__name::before { content: ""; position: absolute; left: 0; top: 11px; width: 12px; height: 2px; background: var( --wp--preset--color--brass ); transition: width 160ms ease, background-color 160ms ease; }
.homefix-myc-scope__desc { font-family: var( --wp--preset--font-family--body ); font-size: 14px; color: var( --wp--preset--color--ink ); opacity: .72; padding-left: 22px; }

/* ---------- Czy to Twój przypadek? ---------- */
.homefix-myc-scenarios { background: var( --wp--preset--color--surface-alt ); padding: 64px 24px; }
.homefix-myc-scenarios__grid { counter-reset: myc-situation; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 24px; }
.homefix-myc-scenarios__item { counter-increment: myc-situation; position: relative; background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.16); border-radius: var( --wp--custom--radius--card, 16px ); padding: 28px 28px 26px; margin: 0; }
.homefix-myc-scenarios__item::before { content: "SYTUACJA " counter(myc-situation, decimal-leading-zero); display: block; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin-bottom: 14px; }
.homefix-myc-scenarios__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 19px; line-height: 1.4; color: var( --wp--preset--color--petrol ); margin: 0 0 10px; }
.homefix-myc-scenarios__note { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; line-height: 1.55; color: var( --wp--preset--color--ink ); opacity: .72; margin: 0; }

/* ---------- Jak działa HomeFix? — premium process timeline. ---------- */
.homefix-myc-journey { padding: 64px 24px; }
.homefix-myc-journey__list { list-style: none; counter-reset: myc-step; margin: 0; padding: 0; display: flex; align-items: flex-start; gap: 0; }
.homefix-myc-journey__list li { counter-increment: myc-step; position: relative; flex: 1 1 0; padding: 0 20px 0 0; }
.homefix-myc-journey__list li:first-child { padding-left: 0; }
.homefix-myc-journey__list li::before { content: counter(myc-step); position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: var( --wp--preset--color--petrol ); box-shadow: 0 0 0 3px rgba(137,92,37,.16); color: #fff; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; margin-bottom: 18px; }
.homefix-myc-journey__list li:not(:last-child)::after { content: ""; position: absolute; top: 25px; left: 52px; width: calc(100% - 32px); height: 3px; background: linear-gradient(90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass )); opacity: .35; }
.homefix-myc-journey__list strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: var( --wp--preset--color--ink ); margin-bottom: 5px; }
.homefix-myc-journey__list span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .78; line-height: 1.55; }

/* ---------- Czysty efekt i jasny proces — trust panel, 3 punkty. ---------- */
.homefix-myc-trust { background: var( --wp--preset--color--petrol ); padding: 56px 40px; border-radius: var( --wp--custom--radius--card, 16px ); margin: 0 24px 64px; }
.homefix-myc-trust .homefix-myc-section-title { color: #fff; margin-bottom: 36px; }
.homefix-myc-trust__list { counter-reset: myc-trust; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.homefix-myc-trust__item { counter-increment: myc-trust; position: relative; padding-top: 20px; }
.homefix-myc-trust__item::before { content: counter(myc-trust, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-myc-trust__item::after { content: ""; position: absolute; top: 3px; left: 34px; width: 20px; height: 2px; background: var( --wp--preset--color--brass ); opacity: .6; }
.homefix-myc-trust__item strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: #fff; margin-bottom: 8px; }
.homefix-myc-trust__item span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 14.5px; line-height: 1.55; color: #F4F2EA; opacity: .82; }

/* ---------- FAQ — premium border-based accordion. ---------- */
.homefix-myc-faq { max-width: 760px; margin: 0 auto; padding: 64px 24px; }
.homefix-myc-faq__item { background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.14); border-left: 3px solid transparent; border-radius: 12px; padding: 4px 26px; margin-bottom: 14px; transition: border-color 160ms ease, background-color 160ms ease; }
.homefix-myc-faq__item:last-child { margin-bottom: 0; }
.homefix-myc-faq__item:hover { background: var( --wp--preset--color--surface-alt ); }
.homefix-myc-faq__item[open] { border-left-color: var( --wp--preset--color--brass ); }
.homefix-myc-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; list-style: none; cursor: pointer; font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 16.5px; line-height: 1.4; min-height: var( --wp--custom--tap-target-min, 44px ); padding: 20px 0; color: var( --wp--preset--color--ink ); }
.homefix-myc-faq__item summary::-webkit-details-marker { display: none; }
.homefix-myc-faq__item summary::after { content: "+"; flex-shrink: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 22px; line-height: 1; color: var( --wp--preset--color--brass ); }
.homefix-myc-faq__item[open] summary::after { content: "−"; }
.homefix-myc-faq__item summary:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 4px; border-radius: 2px; }
.homefix-myc-faq__item p { font-family: var( --wp--preset--font-family--body ); font-size: 15px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .82; margin: 0 0 24px; }

/* ---------- Powiązane usługi — outline pills + dwa cross-linki w rzędzie. ---------- */
.homefix-myc-related { padding: 8px 24px 64px; }
.homefix-myc-related__list { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.homefix-myc-related__list a { display: inline-flex; align-items: center; background: transparent; border: 1.5px solid rgba(27,75,84,.25); border-radius: 999px; padding: 9px 18px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 13.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); transition: border-color 160ms ease, color 160ms ease; }
.homefix-myc-related__list a:hover, .homefix-myc-related__list a:focus-visible { border-color: var( --wp--preset--color--brass ); color: var( --wp--preset--color--brass ); }
.homefix-myc-related__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-myc-related__cross-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.homefix-myc-related__cross { padding: 20px 24px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--brass ); border-radius: var( --wp--custom--radius--button, 9px ); }
.homefix-myc-related__cross-q { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .7; margin: 0 0 4px; }
.homefix-myc-related__cross a { display: inline-flex; align-items: center; gap: 6px; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 15px; color: var( --wp--preset--color--brass ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); }
.homefix-myc-related__cross a span { transition: transform 160ms ease; }
.homefix-myc-related__cross a:hover span, .homefix-myc-related__cross a:focus-visible span { transform: translateX(3px); }
.homefix-myc-related__cross a:focus-visible { outline: 2px solid var( --wp--preset--color--brass ); outline-offset: 3px; border-radius: 2px; }

/* ---------- CTA końcowe — headline + subline. ---------- */
.homefix-myc-final-cta { max-width: 1280px; margin: 0 24px 72px; text-align: center; background: var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--card, 16px ); padding: 72px 40px; border-top: 3px solid var( --wp--preset--color--brass ); }
.homefix-myc-final-cta__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 29px; line-height: 1.25; color: #fff; max-width: 26ch; margin: 0 auto 14px; }
.homefix-myc-final-cta__subline { font-family: var( --wp--preset--font-family--body ); font-size: 16px; line-height: 1.55; color: #F4F2EA; opacity: .82; max-width: 48ch; margin: 0 auto 32px; }
.homefix-myc-final-cta__row { display: flex; align-items: center; justify-content: center; gap: 22px; flex-wrap: wrap; }
.homefix-myc-final-cta__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--background ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-myc-final-cta__phone:hover, .homefix-myc-final-cta__phone:focus-visible { opacity: .8; }

@media ( max-width: 780px ) {
	.homefix-myc-hero { flex-direction: column; align-items: stretch; padding: 32px 20px 40px; gap: 28px; }
	.homefix-myc-hero__media::before { display: none; }
	.homefix-myc-hero__media-frame { aspect-ratio: 4/3; border-radius: 16px; }
	.homefix-myc-hero__heading { font-size: 30px; max-width: none; }
	.homefix-myc-hero__desc { max-width: none; }
	.homefix-myc-before-after { margin: 0 20px 40px; padding: 22px 20px; flex-direction: column; align-items: flex-start; }
	.homefix-myc-recognize, .homefix-myc-scope, .homefix-myc-scenarios, .homefix-myc-journey, .homefix-myc-faq, .homefix-myc-related { padding-left: 20px; padding-right: 20px; }
	.homefix-myc-recognize__grid, .homefix-myc-scenarios__grid { grid-template-columns: 1fr; }
	.homefix-myc-scope__list { grid-template-columns: 1fr; column-gap: 0; }
	.homefix-myc-journey__list { flex-direction: column; gap: 28px; }
	.homefix-myc-journey__list li { padding: 0 0 0 68px; }
	.homefix-myc-journey__list li:first-child { padding-left: 68px; }
	.homefix-myc-journey__list li::before { position: absolute; left: 0; top: 0; margin-bottom: 0; }
	.homefix-myc-journey__list li:not(:last-child)::after { top: 52px; left: 25px; width: 3px; height: calc(100% + 12px); }
	.homefix-myc-trust { margin: 0 20px 40px; padding: 36px 24px; }
	.homefix-myc-trust__list { grid-template-columns: 1fr; gap: 28px; }
	.homefix-myc-related__cross-row { grid-template-columns: 1fr; }
	.homefix-myc-final-cta { margin: 0 20px 48px; padding: 44px 24px; }
	.homefix-myc-final-cta__headline { font-size: 23px; }
	.homefix-myc-hero__ctas, .homefix-myc-final-cta__row { flex-direction: column; align-items: stretch; }
	.homefix-myc-hero__ctas .homefix-cta-seam, .homefix-myc-final-cta__row .homefix-cta-seam { width: 100%; }
	.homefix-myc-hero__ctas .homefix-cta-seam__btn, .homefix-myc-final-cta__row .homefix-cta-seam__btn { width: 100%; justify-content: center; }
}

/* ==================== MONTAŻ — PREMIUM REDESIGN (2026-09-17,
   zatwierdzony przez właściciela) — pełna adaptacja finalnego systemu
   Hydrauliki/Elektryki. Namespace `.homefix-mont-*` w całości osobny.
   ==================== */

.homefix-mont-page { max-width: 1280px; margin: 0 auto; }
.homefix-mont-section-title { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 26px; line-height: 1.2; color: var( --wp--preset--color--petrol ); margin: 0 0 12px; }

/* ---------- Hero — warstwowy układ, identyczna mechanika co finalna Hydraulika/Elektryka. ---------- */
.homefix-mont-hero { display: flex; align-items: center; gap: 56px; padding: 56px 24px 64px; }
.homefix-mont-hero__copy { flex: 1 1 44%; min-width: 0; }
.homefix-mont-hero__eyebrow { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin: 0 0 16px; }
.homefix-mont-hero__heading { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 40px; line-height: 1.12; color: var( --wp--preset--color--petrol ); margin: 0 0 18px; max-width: 16ch; }
.homefix-mont-hero__desc { font-family: var( --wp--preset--font-family--body ); font-size: 17px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .85; max-width: 50ch; margin: 0 0 22px; }
.homefix-mont-hero__proof { list-style: none; margin: 0 0 30px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.homefix-mont-hero__proof li { position: relative; padding-left: 22px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); }
.homefix-mont-hero__proof li::before { content: ""; position: absolute; left: 0; top: 6px; width: 9px; height: 9px; border-radius: 3px; background: var( --wp--preset--color--brass ); }
.homefix-mont-hero__ctas { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.homefix-mont-hero__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--petrol ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-mont-hero__phone:hover, .homefix-mont-hero__phone:focus-visible { opacity: .72; }
.homefix-mont-hero__media { flex: 1 1 56%; min-width: 0; position: relative; }
.homefix-mont-hero__media::before { content: ""; position: absolute; top: 22px; right: -22px; bottom: -22px; left: 22px; background: var( --wp--preset--color--surface-alt ); border-radius: var( --wp--custom--radius--card, 16px ); z-index: 0; }
.homefix-mont-hero__media-frame { position: relative; z-index: 1; border-radius: 20px; overflow: hidden; aspect-ratio: 4/5; box-shadow: 0 28px 56px -18px rgba(18,51,57,.32); }
.homefix-mont-hero__picture, .homefix-mont-hero__picture img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Z czym się zmagasz? ---------- */
.homefix-mont-recognize { padding: 8px 24px 64px; }
.homefix-mont-recognize__lead { font-family: var( --wp--preset--font-family--body ); font-size: 15px; color: var( --wp--preset--color--ink ); opacity: .75; margin: -8px 0 24px; }
.homefix-mont-recognize__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
@media ( min-width: 781px ) and ( max-width: 1023px ) { .homefix-mont-recognize__grid { grid-template-columns: repeat(2, 1fr); } }
.homefix-mont-recognize__card { display: flex; align-items: center; justify-content: space-between; gap: 14px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--button, 9px ); padding: 20px 22px; min-height: var( --wp--custom--tap-target-min, 44px ); font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 15.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; transition: transform 160ms ease, background-color 160ms ease, border-left-width 160ms ease; }
.homefix-mont-recognize__card:hover, .homefix-mont-recognize__card:focus-visible { background: var( --wp--preset--color--background ); border-left-width: 5px; transform: translateX(3px); }
.homefix-mont-recognize__card:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-mont-recognize__arrow { color: var( --wp--preset--color--brass ); font-weight: 700; flex-shrink: 0; transition: transform 160ms ease; }
.homefix-mont-recognize__card:hover .homefix-mont-recognize__arrow, .homefix-mont-recognize__card:focus-visible .homefix-mont-recognize__arrow { transform: translateX(4px); }

/* ---------- Zakres usług — editorial premium layout. ---------- */
.homefix-mont-scope { padding: 8px 24px 64px; }
.homefix-mont-scope__list { counter-reset: mont-scope; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 56px; }
.homefix-mont-scope__list li { counter-increment: mont-scope; border-bottom: 1px solid rgba(27,36,32,.08); }
.homefix-mont-scope__list a { display: flex; flex-direction: column; gap: 6px; padding: 28px 4px 26px; text-decoration: none; }
.homefix-mont-scope__list a::before { content: counter(mont-scope, decimal-leading-zero); order: -1; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-mont-scope__list a:hover .homefix-mont-scope__name, .homefix-mont-scope__list a:focus-visible .homefix-mont-scope__name { color: var( --wp--preset--color--brass ); }
.homefix-mont-scope__list a:hover .homefix-mont-scope__name::before, .homefix-mont-scope__list a:focus-visible .homefix-mont-scope__name::before { width: 20px; background: var( --wp--preset--color--brass ); }
.homefix-mont-scope__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; border-radius: 4px; }
.homefix-mont-scope__name { position: relative; display: inline-block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; color: var( --wp--preset--color--petrol ); padding-left: 22px; transition: color 160ms ease; }
.homefix-mont-scope__name::before { content: ""; position: absolute; left: 0; top: 11px; width: 12px; height: 2px; background: var( --wp--preset--color--brass ); transition: width 160ms ease, background-color 160ms ease; }
.homefix-mont-scope__desc { font-family: var( --wp--preset--font-family--body ); font-size: 14px; color: var( --wp--preset--color--ink ); opacity: .72; padding-left: 22px; }

/* ---------- Czy to Twój przypadek? ---------- */
.homefix-mont-scenarios { background: var( --wp--preset--color--surface-alt ); padding: 64px 24px; }
.homefix-mont-scenarios__grid { counter-reset: mont-situation; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap: 24px; }
.homefix-mont-scenarios__item { counter-increment: mont-situation; position: relative; background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.16); border-radius: var( --wp--custom--radius--card, 16px ); padding: 28px 28px 26px; margin: 0; }
.homefix-mont-scenarios__item::before { content: "SYTUACJA " counter(mont-situation, decimal-leading-zero); display: block; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; color: var( --wp--preset--color--brass ); margin-bottom: 14px; }
.homefix-mont-scenarios__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 19px; line-height: 1.4; color: var( --wp--preset--color--petrol ); margin: 0 0 10px; }
.homefix-mont-scenarios__note { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; line-height: 1.55; color: var( --wp--preset--color--ink ); opacity: .72; margin: 0; }

/* ---------- Jak działa HomeFix? — premium process timeline. ---------- */
.homefix-mont-journey { padding: 64px 24px; }
.homefix-mont-journey__list { list-style: none; counter-reset: mont-step; margin: 0; padding: 0; display: flex; align-items: flex-start; gap: 0; }
.homefix-mont-journey__list li { counter-increment: mont-step; position: relative; flex: 1 1 0; padding: 0 20px 0 0; }
.homefix-mont-journey__list li:first-child { padding-left: 0; }
.homefix-mont-journey__list li::before { content: counter(mont-step); position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 50%; background: var( --wp--preset--color--petrol ); box-shadow: 0 0 0 3px rgba(137,92,37,.16); color: #fff; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 19px; margin-bottom: 18px; }
.homefix-mont-journey__list li:not(:last-child)::after { content: ""; position: absolute; top: 25px; left: 52px; width: calc(100% - 32px); height: 3px; background: linear-gradient(90deg, var( --wp--preset--color--petrol ), var( --wp--preset--color--brass )); opacity: .35; }
.homefix-mont-journey__list strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: var( --wp--preset--color--ink ); margin-bottom: 5px; }
.homefix-mont-journey__list span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .78; line-height: 1.55; }

/* ---------- Precyzyjny montaż i jasny proces — trust panel, 3 punkty. ---------- */
.homefix-mont-trust { background: var( --wp--preset--color--petrol ); padding: 56px 40px; border-radius: var( --wp--custom--radius--card, 16px ); margin: 0 24px 64px; }
.homefix-mont-trust .homefix-mont-section-title { color: #fff; margin-bottom: 36px; }
.homefix-mont-trust__list { counter-reset: mont-trust; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.homefix-mont-trust__item { counter-increment: mont-trust; position: relative; padding-top: 20px; }
.homefix-mont-trust__item::before { content: counter(mont-trust, decimal-leading-zero); position: absolute; top: 0; left: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 12px; letter-spacing: .08em; color: var( --wp--preset--color--brass ); }
.homefix-mont-trust__item::after { content: ""; position: absolute; top: 3px; left: 34px; width: 20px; height: 2px; background: var( --wp--preset--color--brass ); opacity: .6; }
.homefix-mont-trust__item strong { display: block; font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 17px; color: #fff; margin-bottom: 8px; }
.homefix-mont-trust__item span { display: block; font-family: var( --wp--preset--font-family--body ); font-size: 14.5px; line-height: 1.55; color: #F4F2EA; opacity: .82; }

/* ---------- FAQ — premium border-based accordion. ---------- */
.homefix-mont-faq { max-width: 760px; margin: 0 auto; padding: 64px 24px; }
.homefix-mont-faq__item { background: var( --wp--preset--color--surface ); border: 1px solid rgba(27,75,84,.14); border-left: 3px solid transparent; border-radius: 12px; padding: 4px 26px; margin-bottom: 14px; transition: border-color 160ms ease, background-color 160ms ease; }
.homefix-mont-faq__item:last-child { margin-bottom: 0; }
.homefix-mont-faq__item:hover { background: var( --wp--preset--color--surface-alt ); }
.homefix-mont-faq__item[open] { border-left-color: var( --wp--preset--color--brass ); }
.homefix-mont-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; list-style: none; cursor: pointer; font-family: var( --wp--preset--font-family--display ); font-weight: 600; font-size: 16.5px; line-height: 1.4; min-height: var( --wp--custom--tap-target-min, 44px ); padding: 20px 0; color: var( --wp--preset--color--ink ); }
.homefix-mont-faq__item summary::-webkit-details-marker { display: none; }
.homefix-mont-faq__item summary::after { content: "+"; flex-shrink: 0; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 22px; line-height: 1; color: var( --wp--preset--color--brass ); }
.homefix-mont-faq__item[open] summary::after { content: "−"; }
.homefix-mont-faq__item summary:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 4px; border-radius: 2px; }
.homefix-mont-faq__item p { font-family: var( --wp--preset--font-family--body ); font-size: 15px; line-height: 1.6; color: var( --wp--preset--color--ink ); opacity: .82; margin: 0 0 24px; }

/* ---------- Powiązane usługi — outline pills + dwa cross-linki w rzędzie. ---------- */
.homefix-mont-related { padding: 8px 24px 64px; }
.homefix-mont-related__list { list-style: none; margin: 0 0 28px; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.homefix-mont-related__list a { display: inline-flex; align-items: center; background: transparent; border: 1.5px solid rgba(27,75,84,.25); border-radius: 999px; padding: 9px 18px; font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 13.5px; color: var( --wp--preset--color--petrol ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); transition: border-color 160ms ease, color 160ms ease; }
.homefix-mont-related__list a:hover, .homefix-mont-related__list a:focus-visible { border-color: var( --wp--preset--color--brass ); color: var( --wp--preset--color--brass ); }
.homefix-mont-related__list a:focus-visible { outline: 2px solid var( --wp--preset--color--petrol ); outline-offset: 2px; }
.homefix-mont-related__cross-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.homefix-mont-related__cross { padding: 20px 24px; background: var( --wp--preset--color--surface-alt ); border-left: 3px solid var( --wp--preset--color--brass ); border-radius: var( --wp--custom--radius--button, 9px ); }
.homefix-mont-related__cross-q { font-family: var( --wp--preset--font-family--body ); font-size: 13.5px; color: var( --wp--preset--color--ink ); opacity: .7; margin: 0 0 4px; }
.homefix-mont-related__cross a { display: inline-flex; align-items: center; gap: 6px; font-family: var( --wp--preset--font-family--body ); font-weight: 700; font-size: 15px; color: var( --wp--preset--color--brass ); text-decoration: none; min-height: var( --wp--custom--tap-target-min, 44px ); }
.homefix-mont-related__cross a span { transition: transform 160ms ease; }
.homefix-mont-related__cross a:hover span, .homefix-mont-related__cross a:focus-visible span { transform: translateX(3px); }
.homefix-mont-related__cross a:focus-visible { outline: 2px solid var( --wp--preset--color--brass ); outline-offset: 3px; border-radius: 2px; }

/* ---------- CTA końcowe — headline + subline. ---------- */
.homefix-mont-final-cta { max-width: 1280px; margin: 0 24px 72px; text-align: center; background: var( --wp--preset--color--petrol ); border-radius: var( --wp--custom--radius--card, 16px ); padding: 72px 40px; border-top: 3px solid var( --wp--preset--color--brass ); }
.homefix-mont-final-cta__headline { font-family: var( --wp--preset--font-family--display ); font-weight: 700; font-size: 29px; line-height: 1.25; color: #fff; max-width: 26ch; margin: 0 auto 14px; }
.homefix-mont-final-cta__subline { font-family: var( --wp--preset--font-family--body ); font-size: 16px; line-height: 1.55; color: #F4F2EA; opacity: .82; max-width: 48ch; margin: 0 auto 32px; }
.homefix-mont-final-cta__row { display: flex; align-items: center; justify-content: center; gap: 22px; flex-wrap: wrap; }
.homefix-mont-final-cta__phone { font-family: var( --wp--preset--font-family--body ); font-weight: 600; font-size: 14.5px; color: var( --wp--preset--color--background ); text-decoration: underline; text-underline-offset: 3px; transition: opacity 160ms ease; }
.homefix-mont-final-cta__phone:hover, .homefix-mont-final-cta__phone:focus-visible { opacity: .8; }

@media ( max-width: 780px ) {
	.homefix-mont-hero { flex-direction: column; align-items: stretch; padding: 32px 20px 40px; gap: 28px; }
	.homefix-mont-hero__media::before { display: none; }
	.homefix-mont-hero__media-frame { aspect-ratio: 4/3; border-radius: 16px; }
	.homefix-mont-hero__heading { font-size: 30px; max-width: none; }
	.homefix-mont-hero__desc { max-width: none; }
	.homefix-mont-recognize, .homefix-mont-scope, .homefix-mont-scenarios, .homefix-mont-journey, .homefix-mont-faq, .homefix-mont-related { padding-left: 20px; padding-right: 20px; }
	.homefix-mont-recognize__grid, .homefix-mont-scenarios__grid { grid-template-columns: 1fr; }
	.homefix-mont-scope__list { grid-template-columns: 1fr; column-gap: 0; }
	.homefix-mont-journey__list { flex-direction: column; gap: 28px; }
	.homefix-mont-journey__list li { padding: 0 0 0 68px; }
	.homefix-mont-journey__list li:first-child { padding-left: 68px; }
	.homefix-mont-journey__list li::before { position: absolute; left: 0; top: 0; margin-bottom: 0; }
	.homefix-mont-journey__list li:not(:last-child)::after { top: 52px; left: 25px; width: 3px; height: calc(100% + 12px); }
	.homefix-mont-trust { margin: 0 20px 40px; padding: 36px 24px; }
	.homefix-mont-trust__list { grid-template-columns: 1fr; gap: 28px; }
	.homefix-mont-related__cross-row { grid-template-columns: 1fr; }
	.homefix-mont-final-cta { margin: 0 20px 48px; padding: 44px 24px; }
	.homefix-mont-final-cta__headline { font-size: 23px; }
	.homefix-mont-hero__ctas, .homefix-mont-final-cta__row { flex-direction: column; align-items: stretch; }
	.homefix-mont-hero__ctas .homefix-cta-seam, .homefix-mont-final-cta__row .homefix-cta-seam { width: 100%; }
	.homefix-mont-hero__ctas .homefix-cta-seam__btn, .homefix-mont-final-cta__row .homefix-cta-seam__btn { width: 100%; justify-content: center; }
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-napr-router__item,
	.homefix-gaz-recognize__card,
	.homefix-gaz-recognize__arrow,
	.homefix-gaz-faq__item,
	.homefix-gaz-related__list a,
	.homefix-gaz-related__cross a span,
	.homefix-gaz-hero__phone,
	.homefix-gaz-final-cta__phone,
	.homefix-gaz-scope__name,
	.homefix-gaz-scope__name::before,
	.homefix-sprz-recognize__card,
	.homefix-sprz-recognize__arrow,
	.homefix-sprz-faq__item,
	.homefix-sprz-related__list a,
	.homefix-sprz-related__cross a span,
	.homefix-sprz-modes__col a,
	.homefix-sprz-hero__phone,
	.homefix-sprz-final-cta__phone,
	.homefix-sprz-scope__name,
	.homefix-sprz-scope__name::before,
	.homefix-myc-recognize__card,
	.homefix-myc-recognize__arrow,
	.homefix-myc-faq__item,
	.homefix-myc-related__list a,
	.homefix-myc-related__cross a span,
	.homefix-myc-before-after__link span,
	.homefix-myc-hero__phone,
	.homefix-myc-final-cta__phone,
	.homefix-myc-scope__name,
	.homefix-myc-scope__name::before,
	.homefix-mont-recognize__card,
	.homefix-mont-recognize__arrow,
	.homefix-mont-faq__item,
	.homefix-mont-related__list a,
	.homefix-mont-related__cross a span,
	.homefix-mont-hero__phone,
	.homefix-mont-final-cta__phone,
	.homefix-mont-scope__name,
	.homefix-mont-scope__name::before,
	.homefix-napr-recognize__card,
	.homefix-napr-recognize__arrow,
	.homefix-napr-faq__item,
	.homefix-napr-related__list a,
	.homefix-napr-hero__phone,
	.homefix-napr-final-cta__phone,
	.homefix-napr-scope__name,
	.homefix-napr-scope__name::before,
	.homefix-kan-recognize__card,
	.homefix-kan-recognize__arrow,
	.homefix-kan-faq__item,
	.homefix-kan-related__list a,
	.homefix-kan-related__cross a span,
	.homefix-kan-hero__phone,
	.homefix-kan-final-cta__phone,
	.homefix-kan-scope__name,
	.homefix-kan-scope__name::before {
		transition: none;
	}
}

/* ==========================================================================
   EXPLODED HOUSE / X-RAY HOUSE — homepage signature section (ETAP E,
   2026-09-21). Markup: inc/exploded-house.php; behaviour:
   assets/js/exploded-house-boot.js (lazy boot) + exploded-house.js (scene).
   Scroll model: tall `__track` + `position: sticky` 100vh `__stage` — plain
   CSS, never scroll-jacked. Full-bleed via width:100vw + negative margin,
   same family of technique as the other homepage sections (body has
   overflow-x hidden; html does NOT, so the viewport — not body — scrolls
   and sticky keeps working). Poster is visible from first paint; `.is-3d`
   (added after the first rendered WebGL frame) crossfades it out.
   ========================================================================== */

.homefix-xray {
	position: relative;
	width: 100vw;
	margin-left: calc( 50% - 50vw );
	background: var( --wp--preset--color--background );
}

.homefix-xray__track {
	position: relative;
	height: 460vh;
}

.homefix-xray__stage {
	position: sticky;
	top: 0;
	height: 100vh;
	width: 100%;
	overflow: hidden;
	background: var( --wp--preset--color--background );
}

.homefix-xray__poster,
.homefix-xray__poster img,
.homefix-xray__canvas {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
}

.homefix-xray__poster img {
	object-fit: cover;
	object-position: 50% 50%;
}

/* Desktop frame shift: canvas and poster are 124% wide and overflow the
   stage to the right (stage clips), so the house — the centre of the 3D
   frame and of the poster — lands right of centre, leaving the left
   column to the copy. Same box for both = poster→WebGL crossfade lines up. */
@media ( min-width: 781px ) {
	.homefix-xray__poster,
	.homefix-xray__canvas {
		width: 124%;
	}
}

.homefix-xray__canvas {
	opacity: 0;
	transition: opacity 900ms cubic-bezier( 0.22, 0.7, 0.2, 1 );
}

.homefix-xray__poster {
	opacity: 1;
	transition: opacity 900ms cubic-bezier( 0.22, 0.7, 0.2, 1 ) 150ms;
	z-index: 1;
}

.homefix-xray.is-3d .homefix-xray__canvas {
	opacity: 1;
}

.homefix-xray.is-3d .homefix-xray__poster {
	opacity: 0;
	pointer-events: none;
}

/* Copy — left column, breathing room, no panel: the scene is rendered
   shifted right (camera view offset) so text sits over quiet background. */
.homefix-xray__copy {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
}

.homefix-xray__scene {
	position: absolute;
	left: max( 24px, calc( 50vw - 640px + 24px ) );
	top: 50%;
	width: min( 440px, 40vw );
	transform: translateY( calc( -50% + 16px ) );
	opacity: 0;
	transition: opacity 800ms cubic-bezier( 0.22, 0.7, 0.2, 1 ), transform 800ms cubic-bezier( 0.22, 0.7, 0.2, 1 );
}

.homefix-xray__scene.is-active {
	opacity: 1;
	transform: translateY( -50% );
}

.homefix-xray__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: clamp( 1.9rem, 3.2vw, 3rem );
	line-height: 1.08;
	letter-spacing: -0.015em;
	color: var( --wp--preset--color--ink );
	margin: 0;
	text-wrap: balance;
}

.homefix-xray__sub {
	font-family: var( --wp--preset--font-family--body );
	font-size: clamp( 1rem, 1.15vw, 1.15rem );
	line-height: 1.55;
	color: var( --wp--preset--color--stone );
	margin: 14px 0 0;
	max-width: 36ch;
}

.homefix-xray__cta {
	margin-top: 26px;
	pointer-events: auto;
}

.homefix-xray__cta-btn {
	display: inline-flex;
	align-items: center;
	background: var( --wp--preset--color--brass );
	color: #fff;
	font-weight: 700;
	font-size: 15.5px;
	padding: 15px 24px;
	border-radius: var( --wp--custom--radius--button, 9px );
	text-decoration: none;
	min-height: var( --wp--custom--tap-target-min, 44px );
	transition: background 160ms ease;
}

.homefix-xray__cta-btn:hover {
	background: var( --wp--custom--brass-hover, #744e20 );
}

/* Mobile: full 3D, model fills the stage, copy as a calm bottom card. */
@media ( max-width: 780px ) {
	.homefix-xray__track {
		height: 440vh;
	}

	.homefix-xray__scene {
		left: 16px;
		right: 16px;
		width: auto;
		top: auto;
		bottom: max( 20px, env( safe-area-inset-bottom ) );
		transform: translateY( 14px );
		padding: 18px 20px;
		background: rgba( 244, 242, 234, 0.86 );
		-webkit-backdrop-filter: blur( 10px );
		backdrop-filter: blur( 10px );
		border-radius: 16px;
	}

	.homefix-xray__scene.is-active {
		transform: translateY( 0 );
	}

	.homefix-xray__title {
		font-size: clamp( 1.5rem, 6.4vw, 1.9rem );
	}

	.homefix-xray__sub {
		margin-top: 8px;
	}

	.homefix-xray__cta {
		margin-top: 16px;
	}
}


/* ≤600px the site shows the fixed bottom CTA bar (.homefix-sticky-cta,
   ~57px + safe area) — keep the scene copy card above it. */
@media ( max-width: 600px ) {
	.homefix-xray__scene {
		bottom: calc( 72px + env( safe-area-inset-bottom, 0px ) );
	}
}

/* Reduced motion: no scroll story — one static premium x-ray frame (drawn
   by JS once loaded, poster before that), final copy + CTA only. */
@media ( prefers-reduced-motion: reduce ) {
	.homefix-xray__track {
		height: auto;
	}

	.homefix-xray__stage {
		position: relative;
		height: min( 100vh, 760px );
	}

	.homefix-xray__scene,
	.homefix-xray__poster,
	.homefix-xray__canvas {
		transition: none;
	}

	.homefix-xray__scene {
		opacity: 0;
	}

	.homefix-xray__scene--final {
		opacity: 1;
		transform: translateY( -50% );
	}

	@media ( max-width: 780px ) {
		.homefix-xray__scene--final {
			transform: none;
		}
	}
}

/* ==========================================================================
   Formularz współpracy — STAN GATED (2026-09-23, przed cutoverem
   produkcyjnym). Dopóki polityka prywatności nie jest zatwierdzona, nie
   zbieramy publicznie danych osobowych — zwykły odwiedzający nie dostaje
   pól formularza do DOM, tylko tę kartę (patrz
   `homefix_child_partner_form_should_render_live()` w inc/partner-form.php).
   Ten sam język wizualny co karta gated HomeFix Care wyżej — jeden
   rozpoznawalny wzorzec "jeszcze nie uruchomione, ale jest telefon".
   ========================================================================== */

.homefix-partner-gated {
	background: var( --wp--preset--color--surface-alt );
	border-left: 3px solid var( --wp--preset--color--petrol );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 32px 30px;
}

.homefix-partner-gated__heading {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 18px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 10px;
}

.homefix-partner-gated__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.8;
	margin: 0 0 22px;
	max-width: 60ch;
}

.homefix-partner-gated__actions {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.homefix-partner-gated__phone {
	display: inline-flex;
	align-items: center;
	background: var( --wp--preset--color--brass );
	color: #fff;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 700;
	font-size: 15px;
	padding: 14px 22px;
	border-radius: var( --wp--custom--radius--button, 9px );
	text-decoration: none;
	min-height: var( --wp--custom--tap-target-min, 44px );
	transition: background 160ms ease;
}

.homefix-partner-gated__phone:hover {
	background: var( --wp--custom--brass-hover, #744e20 );
}

/* Widoczne WYŁĄCZNIE dla administratora w `?partner_form_preview=1` —
   żeby podgląd nigdy nie został pomylony z działającym publicznie
   formularzem. */
.homefix-partner-form__preview-notice {
	background: var( --wp--preset--color--ink );
	color: #fff;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 12.5px;
	line-height: 1.5;
	padding: 12px 16px;
	border-radius: 10px;
	margin: 0 0 20px;
}

/* ==========================================================================
   ZGODA NA STATYSTYKI — baner + ustawienia prywatności (KROK 4, 2026-09-23)
   --------------------------------------------------------------------------
   Renderowane wyłącznie przez assets/js/analytics.js, a ten ładuje się tylko
   gdy filtr `homefix_public_analytics_enabled` jest włączony. Przy zamkniętej
   bramce te reguły są martwym kodem CSS — świadomie, żeby style były gotowe
   razem z logiką i nie trzeba było dotykać arkusza przy uruchomieniu.

   Zasada projektowa: oba przyciski decyzji mają IDENTYCZNĄ wagę wizualną
   (ten sam rozmiar, padding, wysokość, czcionka). Odmowa nie jest wyszarzona
   ani schowana — to wymóg, nie estetyka.
   ========================================================================== */

.homefix-consent {
	position: fixed;
	z-index: 9999;
	left: 16px;
	right: 16px;
	bottom: 16px;
	max-width: 520px;
	background: #FFFFFF;
	color: #1F2421;
	border: 1px solid rgba( 27, 75, 84, 0.18 );
	border-radius: 14px;
	box-shadow: 0 18px 48px rgba( 27, 75, 84, 0.22 );
	animation: hf-consent-in var( --hf-dur-ui, 350ms ) var( --hf-ease, ease ) both;
}

@keyframes hf-consent-in {
	from { opacity: 0; transform: translateY( 12px ); }
	to   { opacity: 1; transform: none; }
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-consent { animation: none; }
}

.homefix-consent__inner { padding: 22px 22px 18px; }

.homefix-consent__title {
	margin: 0 0 10px;
	font-size: 1.05rem;
	line-height: 1.3;
	color: #1B4B54;
}

.homefix-consent__desc p {
	margin: 0 0 8px;
	font-size: 0.875rem;
	line-height: 1.55;
}

.homefix-consent__desc p:last-child { margin-bottom: 0; }
.homefix-consent__desc a { color: #1B4B54; text-underline-offset: 2px; }

.homefix-consent__actions {
	display: flex;
	flex-wrap: wrap;
	/* `stretch`, nie `center`: przy `center` przycisk z dłuższym tekstem
	   zawija się do dwóch linii i jest wyraźnie wyższy od drugiego (63px
	   vs 45px w pomiarze) — znowu nierówność wizualna między akceptacją
	   a odmową. `stretch` wyrównuje oba do wysokości wyższego. */
	align-items: stretch;
	gap: 10px;
	margin-top: 16px;
}

/* Oba przyciski decyzji — identyczna geometria. */
.homefix-consent__btn {
	/* `1 1 0`, nie `1 1 auto`: przy `auto` przyciski rosną proporcjonalnie
	   do długości tekstu i „Akceptuję analityczne" wychodzi zauważalnie
	   szersze niż „Tylko niezbędne" — czyli dokładnie ta nierówność
	   wizualna, której baner ma unikać. Przy `0` oba dostają dokładnie
	   tyle samo miejsca niezależnie od treści. */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 0;
	min-width: 168px;
	padding: 12px 18px;
	text-align: center;
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.2;
	border-radius: 8px;
	border: 2px solid transparent;
	cursor: pointer;
	transition: background-color var( --hf-dur-ui, 350ms ) var( --hf-ease, ease ),
	            color var( --hf-dur-ui, 350ms ) var( --hf-ease, ease );
}

.homefix-consent__btn--accept { background: #895C25; border-color: #895C25; color: #FFFFFF; }
.homefix-consent__btn--accept:hover { background: #744D1F; border-color: #744D1F; }

.homefix-consent__btn--reject { background: transparent; border-color: #1B4B54; color: #1B4B54; }
.homefix-consent__btn--reject:hover { background: #1B4B54; color: #FFFFFF; }

.homefix-consent__link {
	flex: 0 0 auto;
	padding: 12px 6px;
	background: none;
	border: 0;
	font-size: 0.85rem;
	color: #4A5551;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.homefix-consent__link:hover { color: #1B4B54; }

.homefix-consent__btn:focus-visible,
.homefix-consent__link:focus-visible,
.homefix-consent-footer__link:focus-visible {
	outline: 3px solid #895C25;
	outline-offset: 2px;
}

/* Na wąskich ekranach przyciski jeden pod drugim, nadal równe. */
@media ( max-width: 480px ) {
	.homefix-consent { left: 8px; right: 8px; bottom: 8px; }
	.homefix-consent__inner { padding: 18px 16px 16px; }
	.homefix-consent__btn { flex: 1 1 100%; }
	.homefix-consent__link { width: 100%; text-align: center; }
}

/* Na stronie głównej baner nie może zasłonić sticky CTA na mobile. */
@media ( max-width: 780px ) {
	.homefix-consent { bottom: 84px; }
}

/* --- Ustawienia prywatności --- */

.homefix-consent-modal {
	position: fixed;
	inset: 0;
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background: rgba( 27, 75, 84, 0.45 );
}

.homefix-consent-modal__box {
	width: 100%;
	max-width: 520px;
	max-height: 86vh;
	overflow-y: auto;
	padding: 24px;
	background: #FFFFFF;
	border-radius: 14px;
	box-shadow: 0 24px 64px rgba( 0, 0, 0, 0.3 );
}

.homefix-consent-modal__title { margin: 0 0 18px; font-size: 1.15rem; color: #1B4B54; }

.homefix-consent-modal__row {
	padding: 14px 0;
	border-top: 1px solid rgba( 27, 75, 84, 0.12 );
}

.homefix-consent-modal__label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: 0.95rem;
}

.homefix-consent-modal__always { font-size: 0.8rem; color: var( --homefix-stone-accessible, #6A6458 ); }

.homefix-consent-modal__label input[type="checkbox"] {
	width: 20px;
	height: 20px;
	accent-color: #895C25;
	cursor: pointer;
}

.homefix-consent-modal__help {
	margin: 6px 0 0;
	font-size: 0.82rem;
	line-height: 1.5;
	color: #4A5551;
}

.homefix-consent-modal__state {
	margin: 16px 0 0;
	padding-top: 14px;
	border-top: 1px solid rgba( 27, 75, 84, 0.12 );
	font-size: 0.85rem;
}

.homefix-consent-modal__actions { margin-top: 18px; }
.homefix-consent-modal__actions .homefix-consent__btn { width: 100%; }

/* --- Link w stopce --- */

.homefix-consent-footer { padding: 10px 0 18px; text-align: center; }

.homefix-consent-footer__link {
	background: none;
	border: 0;
	padding: 4px 8px;
	font-size: 0.8rem;
	color: inherit;
	opacity: 0.78;
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

.homefix-consent-footer__link:hover { opacity: 1; }