/**
 * Sekcje z wzorców bloków (strona główna i kolejne). Wartości z theme.json.
 */

/* ---------- Układ sekcji ---------- */

.wm-front {
	padding-block: 0;
}

.wm-front > * {
	margin-block: 0;
}

.wm-band {
	padding-block: var(--wm-s7);
}

.wm-band--tight {
	padding-block: var(--wm-s6);
}

/* Strona kończy się niebieskim pasem: stopka bez ukośnego cięcia, żeby nie było białego klina. */
body:has(.entry-content > .wm-section-blue:last-child) .site-footer {
	margin-top: 0;
	padding-top: var(--wm-s6);
	clip-path: none;
	border-top: var(--wm-border) solid color-mix(in srgb, var(--wm-white) 18%, transparent);
}

.wm-section-blue a:not(.wp-element-button, .wm-button, .wm-badge) {
	color: var(--wm-white);
}

.wm-section-blue a:not(.wp-element-button, .wm-button, .wm-badge):hover {
	color: var(--wm-lime);
}

.wm-section-blue .wm-service-icon--light {
	color: var(--wm-white);
}

/* Podświetlenie z edytora (Wyróżnienie → mark) wygląda jak na banerze. */
mark.wm-highlight,
.wm-hero__title mark {
	--wm-cut: 0.45em;
	color: var(--wm-ink) !important;
	padding: 0.02em 0.5em 0.06em;
	margin-inline: -0.15em;
	background-color: transparent !important;
	background-image: linear-gradient(
		102deg,
		transparent var(--wm-cut),
		var(--wm-orange) var(--wm-cut),
		var(--wm-orange) calc(100% - var(--wm-cut)),
		transparent calc(100% - var(--wm-cut))
	);
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* Wstęp sekcji: tytuł po lewej, opis i przycisk po prawej. */
.wm-intro {
	gap: var(--wm-s4) var(--wm-s6);
	margin-bottom: var(--wm-s6) !important;
}

.wm-intro h2 {
	margin: var(--wm-s3) 0 0;
	font-size: var(--wp--preset--font-size--xx-large);
	line-height: var(--wp--custom--line-height--tight);
}

.wm-intro p:not(.wm-eyebrow) {
	margin-top: 0;
	color: var(--wm-ink-soft);
}

.wm-section-blue .wm-intro p:not(.wm-eyebrow) {
	color: var(--wm-white);
}

/* Ikona przed tekstem (znacznik wm-icon-*). */
.wm-icon-chip {
	display: inline-grid;
	place-items: center;
	flex: none;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 50%;
	background: var(--wm-white);
	color: var(--wm-blue);
	transition: transform var(--wm-base) var(--wm-ease), background-color var(--wm-base);
}

.wm-icon-chip .wm-icon {
	width: var(--wp--custom--icon--medium);
	height: var(--wp--custom--icon--medium);
}

/* Fasety w pasach treści: mniejsze i tylko tam, gdzie margines strony je pomieści (nigdy pod tekstem). */
.wm-band .wm-deco--facets-corner {
	width: clamp(4rem, 6.5vw, 6.25rem);
}

@media (max-width: 1279px) {
	.wm-band .wm-deco--facets-corner {
		display: none;
	}
}

/* ---------- Witacz ---------- */

.wm-hero {
	padding-block: var(--wm-s6) var(--wm-s7);
}

.wm-hero__grid {
	gap: var(--wm-s5) var(--wm-s6);
}

.wm-hero__title {
	margin: var(--wm-s3) 0 var(--wm-s4);
	font-size: var(--wp--preset--font-size--huge);
	line-height: var(--wp--custom--line-height--tight);
	color: var(--wm-white);
}

.wm-hero__lead {
	max-width: 36rem;
	margin: 0 0 var(--wm-s5);
	font-size: var(--wp--preset--font-size--large);
}

.wm-hero__tiles {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--wm-s3);
	margin: 0 0 var(--wm-s4);
}

.wm-hero__tiles > * {
	margin: 0;
}

/* Ikona serwisu obok tekstu (tekst i link to osobne węzły, więc ikona jest pozycjonowana). */
.wm-hero__service {
	position: relative;
	min-height: var(--wp--custom--icon--large);
	margin: 0;
	padding-left: calc(var(--wp--custom--icon--large) + var(--wm-s3));
	font-size: var(--wp--preset--font-size--small);
}

.wm-hero__service .wm-service-icon {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

.wm-hero__service a {
	font-weight: 600;
}

.wm-hero__photo {
	position: relative;
	margin: 0;
}

.wm-hero__photo img {
	aspect-ratio: 4 / 5;
	object-position: 50% 45%;
}

.wm-block-badge {
	position: absolute;
	left: var(--wm-s4);
	bottom: var(--wm-s5);
	z-index: 2;
}

.wm-hero .wm-section-dots {
	top: auto;
	bottom: var(--wm-s6);
	left: 48%;
}

@media (max-width: 781px) {
	.wm-hero {
		padding-block: var(--wm-s4) var(--wm-s6);
	}

	.wm-hero__title {
		margin-block: var(--wm-s2) var(--wm-s3);
	}

	.wm-hero__lead {
		margin-bottom: var(--wm-s4);
		font-size: var(--wp--preset--font-size--medium);
	}

	.wm-hero__photo img {
		aspect-ratio: 4 / 3;
	}

	.wm-hero .wm-section-dots {
		display: none;
	}
}

/* Niskie telefony: zagęszczony witacz, żeby kafle były na pierwszym ekranie (warunek etapu 2). */
@media (max-width: 599px) and (max-height: 700px) {
	.wm-hero {
		padding-top: var(--wm-s3);
	}

	.wm-hero .wm-eyebrow {
		margin-bottom: 0;
	}

	.wm-hero__lead {
		font-size: var(--wp--preset--font-size--small);
		line-height: 1.5;
	}
}

/* Kafle działów: cały kafel jest linkiem (rozciągnięty link w nagłówku).
   Strzałka jako data URI: maski z plików nie działają przy otwarciu strony z dysku. */
.wm-tile {
	position: relative;
	padding: var(--wm-s4);
	border-radius: var(--wm-radius-l);
	background: var(--wm-white);
	color: var(--wm-ink);
	transition: transform var(--wm-base) var(--wm-ease), box-shadow var(--wm-base) var(--wm-ease);
}

.wm-tile::after {
	content: "";
	position: absolute;
	top: var(--wm-s3);
	right: var(--wm-s3);
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	background: var(--wm-tint-2) no-repeat center / 1.1rem;
	transition: transform var(--wm-base) var(--wm-ease), background-color var(--wm-base);
}

.wm-tile::before {
	content: "";
	position: absolute;
	z-index: 1;
	top: var(--wm-s3);
	right: var(--wm-s3);
	width: 2.25rem;
	height: 2.25rem;
	background: var(--wm-ink);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M7 17L17 7M8.5 7H17v8.5%22/%3E%3C/svg%3E") no-repeat center / 1.1rem;
	mask: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22M7 17L17 7M8.5 7H17v8.5%22/%3E%3C/svg%3E") no-repeat center / 1.1rem;
	transition: transform var(--wm-base) var(--wm-ease);
}

.wm-tile:hover {
	transform: translateY(-4px);
	box-shadow: var(--wp--preset--shadow--card);
}

.wm-tile:hover::after {
	background-color: var(--wm-orange);
	transform: rotate(45deg);
}

.wm-tile:hover::before {
	transform: rotate(45deg);
}

.wm-tile:focus-within {
	outline: var(--wp--custom--focus--width) solid var(--wm-lime);
	outline-offset: var(--wp--custom--focus--offset);
}

.wm-tile__title {
	display: flex;
	align-items: center;
	gap: var(--wm-s3);
	margin: 0;
	padding-right: 2.5rem;
	font-size: var(--wp--preset--font-size--x-large);
	color: var(--wm-blue);
}

.wm-tile__title a {
	color: var(--wm-blue) !important;
	text-decoration: none;
}

.wm-tile__title a:focus-visible {
	outline: none;
}

.wm-tile__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 2;
	border-radius: inherit;
}

.wm-tile__text {
	margin: var(--wm-s3) 0 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wm-ink-soft);
}

.wm-tile .wm-service-icon {
	color: var(--wm-blue);
}

@media (max-width: 599px) {
	.wm-tile {
		padding: var(--wm-s3);
	}

	.wm-tile::before,
	.wm-tile::after {
		top: var(--wm-s2);
		right: var(--wm-s2);
		width: 1.75rem;
		height: 1.75rem;
	}

	.wm-tile__title {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--wm-s2);
		padding-right: 0;
		font-size: var(--wp--preset--font-size--large);
	}

	/* Na telefonie kafel to ikona i nazwa: oba mieszczą się na pierwszym ekranie. */
	.wm-tile__text {
		display: none;
	}
}

/* ---------- Pasek haseł ---------- */

.wm-front > .wm-ticker {
	background: var(--wm-blue-dark);
}

/* ---------- Karty linii ---------- */

.wm-lines {
	gap: var(--wm-s4) !important;
}

.wm-line-card {
	position: relative;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding-bottom: var(--wm-s4);
	border-radius: var(--wm-radius-l);
	background: var(--wm-tint-1);
	border: var(--wm-border) solid var(--wm-tint-3);
	transition: transform var(--wm-base) var(--wm-ease), box-shadow var(--wm-base) var(--wm-ease);
}

.wm-line-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--wp--preset--shadow--card);
}

.wm-line-card:focus-within {
	outline: var(--wp--custom--focus--width) solid var(--wm-blue);
	outline-offset: var(--wp--custom--focus--offset);
}

.wm-line-card > * {
	margin-inline: var(--wm-s4);
}

.wm-line-card .wm-line-card__media {
	margin: 0 0 var(--wm-s4);
	overflow: hidden;
}

.wm-line-card__media img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	transition: transform var(--wm-slow) var(--wm-ease);
}

.wm-line-card:hover .wm-line-card__media img {
	transform: scale(1.05);
}

.wm-line-card__placeholder {
	position: relative;
	display: grid;
	place-items: center;
	aspect-ratio: 3 / 2;
	padding: var(--wm-s4);
	background: var(--wm-blue);
	color: var(--wm-white);
	text-align: center;
	font-weight: 600;
}

.wm-line-card .wm-line-card__placeholder p:not(.wm-line-card__tag) {
	position: relative;
	color: var(--wm-white);
	max-width: 16rem;
	margin: 0;
}

.wm-line-card__placeholder .wm-section-drops {
	top: var(--wm-s4);
	right: var(--wm-s4);
}

.wm-line-card__tag {
	align-self: flex-start;
	margin-bottom: var(--wm-s2);
	padding: var(--wm-s1) var(--wm-s3);
	border-radius: var(--wm-radius-pill);
	background: var(--wm-white);
	font-size: var(--wp--preset--font-size--x-small);
	font-weight: 600;
	letter-spacing: var(--wp--custom--letter-spacing--caps);
	text-transform: uppercase;
	color: var(--wm-ink-soft);
}

.wm-line-card__title {
	margin-block: 0 var(--wm-s2);
	font-size: var(--wp--preset--font-size--x-large);
}

.wm-line-card__title a {
	text-decoration: none;
}

.wm-line-card__title a:focus-visible {
	outline: none;
}

.wm-line-card__title a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.wm-line-card p:not(.wm-line-card__tag) {
	margin-block: 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wm-ink-soft);
}

/* Tablet: kolumny są już ułożone pionowo, więc karta poziomo (zdjęcie obok tekstu). */
@media (min-width: 600px) and (max-width: 781px) {
	.wm-line-card {
		display: grid;
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		align-content: start;
		column-gap: var(--wm-s4);
		padding-block: 0;
	}

	.wm-line-card > * {
		grid-column: 2;
		margin-inline: 0 var(--wm-s4);
	}

	.wm-line-card > .wm-line-card__tag {
		justify-self: start;
		margin-top: var(--wm-s4);
	}

	.wm-line-card > :last-child {
		margin-bottom: var(--wm-s4);
	}

	.wm-line-card .wm-line-card__media {
		grid-column: 1;
		grid-row: 1 / span 4;
		margin: 0;
	}

	.wm-line-card__media img,
	.wm-line-card__placeholder {
		height: 100%;
		aspect-ratio: auto;
	}
}

/* ---------- Liczby ---------- */

.wm-stats {
	gap: var(--wm-s4) !important;
}

/* Elementy rozciągnięte na całą szerokość (WordPress generuje auto-fill z pustymi kolumnami). */
.wm-stats.is-layout-grid {
	grid-template-columns: repeat(auto-fit, minmax(min(7rem, 100%), 1fr)) !important;
}

.wm-trust.is-layout-grid {
	grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr)) !important;
}

.wm-stat {
	padding-top: var(--wm-s4);
	border-top: var(--wm-border) solid color-mix(in srgb, var(--wm-white) 30%, transparent);
}

.wm-stat .wm-stat__number {
	margin: 0;
	font-size: var(--wp--preset--font-size--huge);
	font-weight: 700;
	line-height: 1;
	color: var(--wm-lime);
}

.wm-stat .wm-stat__label {
	margin: var(--wm-s2) 0 0;
}

/* ---------- Pasek zaufania ---------- */

.wm-trust {
	gap: var(--wm-s4) !important;
}

.wm-trust__title {
	display: flex;
	align-items: center;
	gap: var(--wm-s3);
	margin: 0 0 var(--wm-s2);
	font-size: var(--wp--preset--font-size--large);
}

.wm-trust__item:hover .wm-icon-chip {
	background: var(--wm-orange);
	color: var(--wm-ink);
	transform: rotate(-8deg);
}

.wm-trust__text {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wm-ink-soft);
}

/* ---------- Film ---------- */

.wm-video-section {
	gap: var(--wm-s5) var(--wm-s6);
}

.wm-video {
	margin: 0;
}

.wm-video__button {
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	border-radius: var(--wm-radius-l);
	overflow: hidden;
	background: var(--wm-blue);
	cursor: pointer;
}

.wm-video__button img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	transition: transform var(--wm-slow) var(--wm-ease), opacity var(--wm-base);
}

.wm-video__button:hover img {
	transform: scale(1.04);
	opacity: 0.85;
}

.wm-video__play {
	position: absolute;
	top: 50%;
	left: 50%;
	display: grid;
	place-items: center;
	width: 5rem;
	height: 5rem;
	border-radius: 50%;
	background: var(--wm-orange);
	color: var(--wm-ink);
	transform: translate(-50%, -50%);
	box-shadow: 0 0 0 0.75rem color-mix(in srgb, var(--wm-orange) 30%, transparent);
	transition: transform var(--wm-base) var(--wm-ease), box-shadow var(--wm-base) var(--wm-ease);
}

.wm-video__play .wm-icon {
	width: 2rem;
	height: 2rem;
	margin-left: 0.2rem;
}

.wm-video__button:hover .wm-video__play {
	transform: translate(-50%, -50%) scale(1.08);
	box-shadow: 0 0 0 1.25rem color-mix(in srgb, var(--wm-orange) 22%, transparent);
}

.wm-video__button:focus-visible {
	outline: var(--wp--custom--focus--width) solid var(--wm-blue);
	outline-offset: var(--wp--custom--focus--offset);
}

.wm-video__frame {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	border: 0;
	border-radius: var(--wm-radius-l);
}

.wm-video__caption {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--wm-s1) var(--wm-s3);
	margin-top: var(--wm-s2);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.wm-video__note {
	font-weight: 400;
	color: var(--wm-ink-soft);
}

/* ---------- Blok kontaktowy ---------- */

.wm-cta h2 {
	margin: var(--wm-s3) 0 var(--wm-s3);
	font-size: var(--wp--preset--font-size--xx-large);
	line-height: var(--wp--custom--line-height--tight);
}

.wm-cta__contact {
	position: relative;
	display: grid;
	gap: var(--wm-s3);
	justify-items: start;
}

.wm-cta__phone {
	display: flex;
	align-items: center;
	gap: var(--wm-s3);
	margin: 0;
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
}

.wm-cta__phone a {
	text-decoration: none;
}

.wm-cta__phone a:hover {
	text-decoration: underline;
}

.wm-cta .wm-icon-chip {
	background: var(--wm-lime);
	color: var(--wm-ink);
}

.wm-cta .wm-block-badge {
	left: auto;
	right: 0;
	bottom: auto;
	top: 50%;
	transform: translateY(-50%);
}

.wm-cta .wm-block-badge:hover {
	transform: translateY(-50%) scale(1.06);
}

.wm-cta .wm-section-drops {
	top: var(--wm-s5);
	right: 40%;
}

@media (max-width: 781px) {
	.wm-cta .wm-block-badge {
		display: none;
	}
}

/* ---------- Przycisk bloku „Ze strzałką” ---------- */

.wp-block-button.is-style-arrow .wp-block-button__link {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	gap: var(--wm-s2);
	padding-right: 0.45em;
}

.wp-block-button.is-style-arrow .wp-block-button__link::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--wm-lime);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform var(--wm-base) var(--wm-ease);
}

.wp-block-button.is-style-arrow .wp-block-button__link:hover {
	background: var(--wm-orange);
}

.wp-block-button.is-style-arrow .wp-block-button__link:hover::before {
	transform: scaleX(1);
}

.wp-block-button.is-style-arrow .wp-block-button__link:hover .wm-button__arrow .wm-icon:first-child {
	transform: translate(150%, -150%);
}

.wp-block-button.is-style-arrow .wp-block-button__link:hover .wm-button__arrow .wm-icon + .wm-icon {
	transform: translate(0, 0);
}

/* ---------- Strona „W budowie” (tryb tymczasowy) ---------- */

.wm-construction {
	padding-block: var(--wm-s6) var(--wm-s7);
}

.wm-construction__inner {
	position: relative;
}

.wm-construction .wm-breadcrumbs ol,
.wm-construction .wm-breadcrumbs li + li::before {
	color: var(--wm-white);
}

.wm-construction .wm-breadcrumbs a {
	color: var(--wm-white);
}

.wm-construction .wm-breadcrumbs__icon {
	color: var(--wm-lime);
}

.wm-construction .wm-eyebrow {
	margin-top: var(--wm-s5);
}

.wm-construction__title {
	max-width: 18ch;
	margin: var(--wm-s3) 0 var(--wm-s4);
	font-size: var(--wp--preset--font-size--huge);
	line-height: var(--wp--custom--line-height--tight);
	color: var(--wm-white);
}

.wm-construction__lead {
	max-width: 36rem;
	margin: 0 0 var(--wm-s5);
	font-size: var(--wp--preset--font-size--large);
}

.wm-construction__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wm-s3);
}

.wm-construction__badge {
	position: absolute;
	right: var(--wp--style--root--padding-right);
	bottom: 0;
}

@media (max-width: 781px) {
	.wm-construction__badge {
		display: none;
	}
}

body:has(.wm-construction) .site-footer {
	margin-top: 0;
	padding-top: var(--wm-s6);
	clip-path: none;
	border-top: var(--wm-border) solid color-mix(in srgb, var(--wm-white) 18%, transparent);
}