/*
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.2.0
Text Domain: homefix-child
*/

/* ==========================================================================
   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;
}

.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: 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__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 — pierwszy ekran sprzedażowy.
   Zbudowany z natywnych bloków Gutenberg (columns/column/heading/
   paragraph/buttons/button/list) — selektory celują w realny markup,
   jaki WordPress generuje dla tych bloków, nie w dowolne własne divy.
   Konsumuje wyłącznie zamrożone tokeny z theme.json.
   ========================================================================== */

.homefix-hero.wp-block-columns {
	max-width: 1280px;
	margin-inline: auto;
	padding: 56px 24px;
	gap: 48px;
	align-items: center;
}

.homefix-hero__heading {
	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 20px;
	max-width: 16ch;
}

.homefix-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 0 20px;
	max-width: 46ch;
}

.homefix-hero__ctas.wp-block-buttons {
	gap: 20px;
	margin: 0 0 20px;
}

/* Secondary CTA (telefon) — celowo wizualnie dużo słabszy: zwykły
   podkreślony link, zero tła/paddingu przycisku. Od ETAPU 14B jest to
   jedyny renderowany CTA w Hero (primary CTA usunięty, patrz docblock
   PHP) — styl pozostaje niezmieniony, bo nigdy nie zależał od obecności
   przycisku obok siebie. Reguły `.homefix-hero__cta` (primary) zostały
   usunięte razem z odpowiadającym im blokiem w markupie — martwy CSS
   po usuniętym elemencie. */
.homefix-hero__secondary.wp-block-button .wp-block-button__link {
	background: none;
	color: var( --wp--preset--color--petrol );
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 15px;
	text-decoration: underline;
	text-underline-offset: 3px;
	padding: 0;
	min-height: auto;
	border-radius: 0;
	transition: opacity 160ms ease;
}

.homefix-hero__secondary.wp-block-button .wp-block-button__link:hover,
.homefix-hero__secondary.wp-block-button .wp-block-button__link:focus-visible {
	opacity: 0.7;
}

.homefix-hero__media {
	/* FINALNE ZDJĘCIE (2026-09-06): kontener trzyma teraz realny
	   <picture>, nie placeholder — proporcja dopasowana do faktycznych
	   assetów (desktop 16:9), nie do dawnego prowizorycznego 3:2.
	   Diagonalny wzór/wyśrodkowany tekst placeholdera usunięte jako
	   martwy kod razem z .homefix-hero__media-label (klasa istniała
	   wyłącznie dla usuniętego akapitu placeholdera). */
	position: relative;
	border-radius: var( --wp--custom--radius--card, 16px );
	overflow: hidden;
	aspect-ratio: 16 / 9;
}

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

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

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

	/* WordPress ustawia flex-basis jako inline style na kolumnie —
	   trzeba !important, żeby go nadpisać na mobile. */
	.homefix-hero__copy,
	.homefix-hero__media {
		flex-basis: 100% !important;
	}

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

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

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

	/* Art-direction mobile: <picture> serwuje tu realnie inny kadr
	   (przycięcie 4:5, nie tylko mniejszy 16:9) — kontener MUSI mieć tę
	   samą proporcję, inaczej object-fit:cover ucina zawias/dłonie z
	   wybranego zdjęcia. Świadomie bez max-height (dawna wartość 200px
	   ściskała 4:5 do wąskiego paska i obcinała kadr) — na szerokość
	   100% kolumny mobile wysokość wynika już z aspect-ratio. */
	.homefix-hero__media {
		aspect-ratio: 4 / 5;
	}
}

/* ==========================================================================
   HomeFix Usługi — „W czym możemy Ci pomóc?"
   Konsumuje wyłącznie zamrożone tokeny z theme.json.
   ========================================================================== */

.homefix-services__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.15;
	color: var( --wp--preset--color--petrol );
	max-width: 1280px;
	margin: 0 auto;
	padding: 64px 24px 28px;
}

.homefix-services.wp-block-columns {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px 64px;
	gap: 20px;
}

.homefix-services__card {
	background-color: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 28px 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.homefix-services__icon {
	display: inline-flex;
	width: 30px;
	height: 30px;
	color: var( --wp--preset--color--petrol );
}

.homefix-services__icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.homefix-services__name {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 19px;
	margin: 0;
	color: var( --wp--preset--color--ink );
}

.homefix-services__name a {
	color: inherit;
	text-decoration: none;
}

.homefix-services__name a::after {
	content: "\2192";
	display: inline-block;
	color: var( --wp--preset--color--petrol );
	opacity: 0;
	margin-left: 0;
	transition: opacity 160ms ease, margin-left 160ms ease;
}

.homefix-services__name a:hover,
.homefix-services__name a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.homefix-services__name a:hover::after,
.homefix-services__name a:focus-visible::after {
	opacity: 1;
	margin-left: 6px;
}

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

.homefix-services__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.75;
	margin: 0;
}

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

@media ( max-width: 780px ) {
	.homefix-services__title {
		font-size: 24px;
		padding: 40px 16px 20px;
	}

	.homefix-services.wp-block-columns {
		padding: 0 16px 40px;
		gap: 14px;
		flex-wrap: wrap;
	}

	/* FIX (audyt ETAP 16): karty nie maja jawnego atrybutu "width" w
	   bloku (brak inline stylu do pokonania), wiec !important tutaj
	   bylo niepotrzebne — zwykla regula wystarcza. */
	.homefix-services__card {
		flex-basis: 100%;
		padding: 22px 20px;
	}

	.homefix-services__name a {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}
}

/* ==========================================================================
   HomeFix Jak działa — proces w 4 krokach.
   Świadomie bez linii łączących/progress-bara — biały odstęp zamiast
   dekoracji, zgodnie z zasadą „bez rozbudowanej timeline SaaS".
   ========================================================================== */

.homefix-steps__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.15;
	color: var( --wp--preset--color--petrol );
	max-width: 1280px;
	margin: 0 auto;
	padding: 64px 24px 12px;
}

.homefix-steps__intro {
	font-family: var( --wp--preset--font-family--body );
	font-size: 16px;
	line-height: 1.6;
	color: var( --wp--preset--color--ink );
	opacity: 0.85;
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px 32px;
}

.homefix-steps.wp-block-columns {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px 64px;
	gap: 32px;
}

.homefix-steps__step {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.homefix-steps__number {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 40px;
	line-height: 1;
	color: var( --wp--preset--color--petrol );
	/* FIX (znalezione podczas dalszej pracy nad ETAP 16): 0.35 dawało
	   ~1.84:1 na Background -- ponizej nawet progu 3:1 dla duzego
	   tekstu (a numer kroku niesie realna informacje o kolejnosci, nie
	   jest czysto dekoracyjny). 0.62 daje ~3.29:1, PASS. */
	opacity: 0.62;
	margin: 0;
}

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

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

@media ( max-width: 780px ) {
	.homefix-steps__title {
		font-size: 24px;
		padding: 40px 16px 8px;
	}

	.homefix-steps__intro {
		font-size: 15px;
		padding: 0 16px 24px;
	}

	.homefix-steps.wp-block-columns {
		padding: 0 16px 40px;
		gap: 28px;
		flex-wrap: wrap;
	}

	/* FIX (audyt ETAP 16): jak przy Usługach — brak inline stylu do
	   pokonania, !important zbędny. */
	.homefix-steps__step {
		flex-basis: 100%;
	}

	.homefix-steps__number {
		font-size: 32px;
	}
}

/* ==========================================================================
   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.
   ========================================================================== */

.homefix-why.wp-block-columns {
	max-width: 1280px;
	margin-inline: auto;
	padding: 56px 24px;
	gap: 48px;
	align-items: center;
}

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

.homefix-why__item {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 28px;
}

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

.homefix-why__letter {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 28px;
	line-height: 1;
	color: var( --wp--preset--color--petrol );
	/* FIX (znalezione podczas dalszej pracy nad ETAP 16): 0.4 dawało
	   ~2.04:1 na Background -- ponizej progu 3:1 dla duzego tekstu (a
	   litera A-D niesie informacje strukturalna, nie jest czysto
	   dekoracyjna). 0.62 daje ~3.29:1, PASS. */
	opacity: 0.62;
	margin: 0;
}

.homefix-why__item-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 18px;
	line-height: 1.3;
	color: var( --wp--preset--color--ink );
	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--ink );
	opacity: 0.75;
	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: 32px 16px 40px;
		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: 24px;
		margin-bottom: 24px;
	}

	.homefix-why__item {
		margin-bottom: 20px;
	}

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

/* ==========================================================================
   HomeFix Standard / Express / Emergency — tryby obsługi wg pilności.
   Trzy karty, jeden spokojny język wizualny: brak czerwieni, gradientów,
   Brass i ciężkich cieni. Różnicowanie wyłącznie obramowaniem i labelem
   — Standard neutralnie, Express z lekko mocniejszym akcentem (grubsza
   ramka + label w kolorze petrol), Emergency z wypełnionym labelem
   (priorytet), ale bez alarmistycznego tonu.
   ========================================================================== */

.homefix-modes__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 32px;
	line-height: 1.15;
	color: var( --wp--preset--color--petrol );
	max-width: 1280px;
	margin: 0 auto;
	padding: 64px 24px 8px;
}

.homefix-modes.wp-block-columns {
	max-width: 1280px;
	margin: 0 auto;
	padding: 32px 24px 64px;
	gap: 28px;
	flex-wrap: wrap;
}

.homefix-modes__item {
	flex-basis: calc( 33.333% - 19px );
	flex-grow: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 28px 24px;
	border: 1px solid rgba( 27, 36, 32, 0.14 );
	border-radius: var( --wp--custom--radius--card, 16px );
	background: var( --wp--preset--color--background );
}

.homefix-modes__item--express {
	border: 2px solid var( --wp--preset--color--petrol );
}

.homefix-modes__item--emergency {
	border: 1px solid var( --wp--preset--color--petrol );
}

.homefix-modes__label {
	display: inline-block;
	align-self: flex-start;
	font-family: var( --wp--preset--font-family--body );
	font-weight: 600;
	font-size: 12.5px;
	line-height: 1;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	margin: 0;
	padding: 6px 12px;
	border-radius: 999px;
	background: var( --wp--preset--color--surface-alt );
	color: var( --wp--preset--color--ink );
}

.homefix-modes__item--express .homefix-modes__label {
	background: rgba( 27, 75, 84, 0.1 );
	color: var( --wp--preset--color--petrol );
}

.homefix-modes__item--emergency .homefix-modes__label {
	background: var( --wp--preset--color--petrol );
	color: var( --wp--preset--color--background );
}

.homefix-modes__name {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 20px;
	line-height: 1.3;
	color: var( --wp--preset--color--ink );
	margin: 0;
}

.homefix-modes__item--express .homefix-modes__name {
	font-weight: 700;
}

.homefix-modes__desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.75;
	margin: 0;
}

@media ( max-width: 980px ) {
	.homefix-modes__item {
		flex-basis: calc( 50% - 14px );
	}
}

@media ( max-width: 780px ) {
	.homefix-modes__title {
		font-size: 24px;
		padding: 40px 16px 4px;
	}

	.homefix-modes.wp-block-columns {
		padding: 20px 16px 40px;
		gap: 20px;
	}

	.homefix-modes__item {
		flex-basis: 100%;
	}
}

/* ==========================================================================
   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;
}

.homefix-local__panel-city {
	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;
}

@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__panel-city {
		font-size: 24px;
	}
}

/* ==========================================================================
   HomeFix Dowody / Realizacje — sekcja dowodu społecznego i wizualnego.
   Wyłącznie developerskie placeholdery (przerywana ramka + wyśrodkowana
   etykieta) — nie do pomylenia z prawdziwym zdjęciem/opinią/statystyką.
   Photo-loud, editorial, przełamuje rytm siatek 4-kart z ETAP 6/8/9.
   Bez Brass, bez ciężkich cieni, bez karuzeli, bez gwiazdek.
   ========================================================================== */

.homefix-proof-section {
	max-width: 1280px;
	margin: 0 auto;
	padding: 64px 24px;
	display: flex;
	flex-direction: column;
	gap: 40px;
}

.homefix-proof__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;
}

.homefix-proof__featured-inner.wp-block-columns {
	gap: 40px;
	align-items: stretch;
}

.homefix-proof__featured-photo {
	flex-basis: 58%;
	flex-grow: 0;
}

.homefix-proof__featured-details {
	flex-basis: 38%;
	flex-grow: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10px;
}

.homefix-proof__photo-slot {
	aspect-ratio: 4 / 3;
	border: 1px dashed rgba( 27, 36, 32, 0.3 );
	border-radius: var( --wp--custom--radius--card, 16px );
	background: var( --wp--preset--color--surface-alt );
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.homefix-proof__slot-label {
	font-family: var( --wp--preset--font-family--body );
	font-style: italic;
	font-size: 13px;
	line-height: 1.4;
	color: var( --homefix-stone-accessible );
	text-align: center;
	margin: 0;
}

.homefix-proof__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;
}

.homefix-proof__field {
	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;
}

.homefix-proof__cards.wp-block-columns {
	gap: 28px;
}

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

.homefix-proof__testimonial {
	max-width: 720px;
	background: var( --wp--preset--color--surface-alt );
	border-radius: var( --wp--custom--radius--card, 16px );
	padding: 40px 32px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.homefix-proof__quote-slot {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-style: italic;
	font-size: 19px;
	line-height: 1.5;
	color: var( --wp--preset--color--ink );
	margin: 0;
}

@media ( max-width: 980px ) {
	.homefix-proof__featured-inner.wp-block-columns {
		gap: 28px;
	}
}

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

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

	.homefix-proof__featured-photo,
	.homefix-proof__featured-details {
		flex-basis: 100%;
	}

	.homefix-proof__card {
		flex-basis: 100%;
	}

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

	.homefix-proof__quote-slot {
		font-size: 17px;
	}
}

/* ==========================================================================
   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;
}

.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;
	}
}

@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;
}

.homefix-final-cta__title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 700;
	font-size: 36px;
	line-height: 1.2;
	color: var( --wp--preset--color--background );
	max-width: 20ch;
	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;
}

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

.homefix-final-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;
	justify-content: center;
	text-decoration: none;
	transition: background-color 160ms ease, transform 160ms ease;
}

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

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

/* FIX (audyt ETAP 16): brakujące pokrycie reduced-motion dla hover
   tego przycisku (transform/background-color). */
@media ( prefers-reduced-motion: reduce ) {
	.homefix-final-cta__phone.wp-block-button .wp-block-button__link {
		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__phone.wp-block-button {
		width: 100%;
	}

	.homefix-final-cta__phone.wp-block-button .wp-block-button__link {
		width: 100%;
	}

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

/* ==========================================================================
   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/ (HomeFix Care Implementation V1,
   2026-09-07). Osobna, samodzielna Strona WP (page), NIE CPT `usluga` —
   patrz docs/strategy/HOMEFIX_CARE_WEBSITE_ARCHITECTURE_V1.md §0.
   Reużywa gdzie to możliwe istniejące komponenty (Jak działa → .homefix-
   steps, FAQ → .homefix-faq-section) zamiast duplikować CSS — patrz
   care-landing.php dla przypisania klas w markupie.
   ========================================================================== */

/* Wspólna lista punktowana — używana w 3 miejscach: 3 korzyści na
   homepage (.homefix-homecare), elementy Home Passport i rezultaty
   "Dlaczego HomeFix Care" na landingu. Jeden zestaw reguł zamiast
   trzech kopii (zasada "minimalny nowy CSS"). */
.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 );
}

/* Hero landingu — struktura identyczna z .homefix-hero (główny Hero
   HomeFix), ale osobna klasa: żadna przyszła zmiana jednego Hero nie
   może przypadkiem dotknąć drugiego. */
.homefix-care-hero.wp-block-columns {
	max-width: 1280px;
	margin-inline: auto;
	padding: 56px 24px;
	gap: 48px;
	align-items: center;
}

.homefix-care-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 14px;
}

.homefix-care-hero__heading {
	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 20px;
	max-width: 16ch;
}

.homefix-care-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 0 28px;
	max-width: 46ch;
}

.homefix-care-hero__ctas.wp-block-buttons {
	margin: 0;
}

.homefix-care-hero__cta.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--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-care-hero__cta.wp-block-button .wp-block-button__link:hover {
	background-color: var( --wp--preset--color--ink );
	transform: translateY( -1px );
}

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

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

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

/* Sekcje tekstowe wąskiej miary — Problem klienta, Czym jest HomeFix
   Care, Dlaczego HomeFix Care. Jedna klasa zamiast trzech kopii. */
.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: 30px;
	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: 16.5px;
	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-top: 22px;
}

/* Co obejmuje opieka — siatka 6 kart, ten sam wzorzec co Usługi
   (.homefix-services__card) ale osobna klasa (treść inna, brak ikon —
   patrz decyzja w content spec: nie tworzymy nowych SVG bez potrzeby). */
.homefix-care-scope__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 );
	max-width: 1280px;
	margin: 0 auto;
	padding: 48px 24px 28px;
}

.homefix-care-scope.wp-block-columns {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px;
	gap: 20px;
}

.homefix-care-scope.wp-block-columns + .homefix-care-scope.wp-block-columns {
	margin-top: 20px;
	padding-bottom: 48px;
}

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

.homefix-care-scope__card-title {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 17px;
	color: var( --wp--preset--color--petrol );
	margin: 0 0 8px;
}

.homefix-care-scope__card-desc {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	line-height: 1.55;
	color: var( --wp--preset--color--ink );
	opacity: 0.8;
	margin: 0;
}

/* Dla kogo — 3 karty równorzędne (Home / Investor / Business). Żadna
   karta nie jest wizualnie ważniejsza — zgodnie z zamrożoną decyzją
   (brak osobnych podstron/CTA per segment w V1). */
.homefix-care-segments__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 );
	max-width: 1280px;
	margin: 0 auto;
	padding: 48px 24px 28px;
}

.homefix-care-segments.wp-block-columns {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 24px 48px;
	gap: 20px;
	align-items: stretch;
}

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

.homefix-care-segments__label {
	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;
}

.homefix-care-segments__for {
	font-family: var( --wp--preset--font-family--display );
	font-weight: 600;
	font-size: 18px;
	color: var( --wp--preset--color--ink );
	margin: 0;
}

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

.homefix-care-segments__needs {
	list-style: none;
	margin: 4px 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.homefix-care-segments__needs li {
	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;
	padding-left: 14px;
	position: relative;
}

.homefix-care-segments__needs li::before {
	content: "\2013";
	position: absolute;
	left: 0;
	color: var( --wp--preset--color--petrol );
	opacity: 0.7;
}

/* Final CTA landingu — reużywa bazowy .homefix-final-cta (tło Petrol/
   padding/radius), ale bez wewnętrznych kolumn: ta sekcja nie ma obrazu
   (jeden asset Care już użyty w Hero), więc treść jest wyśrodkowana. */
.homefix-care-final-cta__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 20px;
	max-width: 640px;
	margin: 0 auto;
}

.homefix-care-final-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;
}

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

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

.homefix-care-final-cta__button.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;
	justify-content: center;
	text-decoration: none;
	transition: background-color 160ms ease, transform 160ms ease;
}

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

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

.homefix-care-final-cta__phone {
	font-family: var( --wp--preset--font-family--body );
	font-size: 14.5px;
	color: var( --wp--preset--color--background );
	opacity: 0.75;
	margin: 0;
}

@media ( prefers-reduced-motion: reduce ) {
	.homefix-care-hero__cta.wp-block-button .wp-block-button__link,
	.homefix-care-final-cta__button.wp-block-button .wp-block-button__link {
		transition: none;
	}
}

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

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

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

	.homefix-care-hero__support {
		font-size: 15.5px;
		max-width: none;
	}

	.homefix-care-hero__ctas.wp-block-buttons {
		width: 100%;
	}

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

	.homefix-care-hero__cta.wp-block-button .wp-block-button__link {
		width: 100%;
	}

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

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

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

	.homefix-care-scope__title,
	.homefix-care-segments__title {
		font-size: 24px;
		padding: 40px 16px 20px;
	}

	.homefix-care-scope.wp-block-columns,
	.homefix-care-segments.wp-block-columns {
		padding-left: 16px;
		padding-right: 16px;
		flex-wrap: wrap;
	}

	.homefix-care-scope__card,
	.homefix-care-segments__card {
		flex-basis: 100%;
	}

	.homefix-care-final-cta__title {
		font-size: 26px;
	}
}

/* ==========================================================================
   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;
	}
}