/*
Theme Name: edes
Theme URI: https://szalunki.stojeden.pl
Author: mrziom11
Author URI: https://szalunki.stojeden.pl
Description: edes is a lightweight, block-based Full Site Editing theme for EDES Rental Group. Dark UI with an orange accent, built almost entirely with core blocks and theme.json. Security hardened (XML-RPC + comments disabled) with first-class Rank Math SEO support.
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 8.0
Version: 0.9.85
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: edes
Tags: full-site-editing, block-patterns, block-styles, editor-style, translation-ready, wide-blocks, one-column, custom-colors, custom-logo, custom-menu, featured-images, accessibility-ready
*/

/*
 * Almost all styling lives in theme.json. This file only holds:
 *  - progressive-enhancement / upstream bug fixes
 *  - a handful of utility classes referenced by the block templates & patterns
 */

/* --- Base tweaks ------------------------------------------------------------ */

a {
	text-decoration-thickness: 1px;
	text-underline-offset: .15em;
}

::selection {
	background: var(--wp--preset--color--primary);
	color: #fff;
}

:where(.wp-site-blocks *:focus) {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/* Nagłówki łamią się tylko na spacjach — nigdy w środku słowa.
   (rdzeń nadaje np. .wp-block-post-title { word-break: break-word }). */
h1, h2, h3, h4, h5, h6,
.wp-block-heading, .wp-block-post-title {
	word-break: normal;
	overflow-wrap: normal;
	hyphens: manual;
}

:where(pre) {
	overflow-x: auto;
}

/* Nic w treści nie może wypychać strony w poziomie na mobile.
   `clip` (nie `hidden`) nie tworzy kontekstu przewijania — sticky header działa. */
main {
	overflow-x: clip;
}

/* --- Layout: header / main / footer stykają się ------------------------- */
/* Rdzeń generuje z theme.json (spacing.blockGap) regułę
   :where(.wp-site-blocks) > * + * { margin-block-start: 1rem }, przez co pod
   <header> i nad <footer> prześwituje ciemne tło strony. Zerujemy tylko ten
   odstęp — domyślne blockGap w treści zostaje nietknięte. */

.wp-site-blocks > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* --- Sticky header -------------------------------------------------------- */
/* template-part renderuje <header class="wp-block-template-part"> jako bezpośrednie
   dziecko .wp-site-blocks. Sticky musi być NA NIM — jego rodzicem jest cała strona,
   więc jest miejsce na przewijanie. Sticky na .edes-header (dziecko) nie działało,
   bo jego rodzic (ten wrapper) ma dokładnie tę samą wysokość. */
.wp-site-blocks > header {
	position: sticky;
	top: 0;
	z-index: 100;
}

.edes-header {
	position: relative;
	z-index: 100;
}

.wp-block-navigation .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--primary);
}

/* --- Menu mobilne (overlay) -------------------------------------------------- */
/* Tło/kolor tekstu overlaya idą z atrybutów bloku nawigacji
   (overlayBackgroundColor / overlayTextColor w parts/header.html). Tutaj tylko układ. */

/* lista pionowo, wyśrodkowana w pionie i w poziomie */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	width: 100%;
	min-height: 78vh;
	justify-content: center;
	align-items: center;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content > .wp-block-navigation__container {
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	gap: 1.4rem;
	width: 100%;
	text-align: center;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	width: auto;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-family: var(--wp--preset--font-family--heading);
	font-size: 1.6rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .02em;
	padding: 0;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content:hover,
.wp-block-navigation__responsive-container.is-menu-open .current-menu-item > .wp-block-navigation-item__content {
	color: var(--wp--preset--color--primary);
}

/* przycisk CTA w menu — tylko odstęp; rozmiar i padding jak reszta pozycji
   overlaya (font-size dziedziczy 1.6rem, padding .5em/1.1em z is-style-edes-button). */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item.is-style-edes-button > .wp-block-navigation-item__content {
	margin-top: .5rem;
}

/* hamburger w czarnym nagłówku — kolor jak dotąd (contrast), ale własna ikona:
   trzy cienkie linie z zaokrąglonymi końcami, środkowa krótsza (wyrównana do prawej).
   Domyślne <svg> rdzenia (grube prostokąty) chowamy, kształt daje maska. */
.edes-header .wp-block-navigation__responsive-container-open {
	color: var(--wp--preset--color--contrast);
}

/* Offcanvas: logo na górze, pod nim social (FB/IG), potem pozycje menu.
   Widoczność logo/social steruje natywna „Widoczność bloku" (ukryte na
   tablet/desktop). Tu tylko drobne odstępy w overlayu. */
.wp-block-navigation__responsive-container.is-menu-open .edes-menu-logo {
	margin-bottom: -0.6rem;
}

.wp-block-navigation__responsive-container.is-menu-open .edes-menu-logo .wp-block-site-logo,
.wp-block-navigation__responsive-container.is-menu-open .edes-menu-logo img {
	width: 110px;
}

.wp-block-navigation__responsive-container.is-menu-open .edes-menu-social {
	margin-top: 0;
	margin-bottom: 0.6rem;
}

/* Na mobilce telefon i hamburger jako kwadratowe przyciski z ramką — sygnał,
   że są klikalne. (Sama widoczność telefonu: natywna blockVisibility, ≤600px.) */
@media (width <= 600px) {
	.edes-header .wp-block-edes-link[href^="tel:"],
	.edes-header .wp-block-navigation__responsive-container-open {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2.5rem;
		height: 2.5rem;
		padding: 0;
		border: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 40%, transparent);
		border-radius: 4px;
	}

	.edes-header .wp-block-edes-link[href^="tel:"] .wp-block-icon svg {
		width: 1.35rem;
		height: auto;
	}
}

.edes-header .wp-block-navigation__responsive-container-open svg {
	display: none;
}

.edes-header .wp-block-navigation__responsive-container-open::before {
	content: "";
	display: block;
	width: 1.6rem;
	height: 1.6rem;
	background: currentColor;
	-webkit-mask: var(--edes-burger) center / contain no-repeat;
	        mask: var(--edes-burger) center / contain no-repeat;
	--edes-burger: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='2' y='5' width='20' height='2' rx='1'/%3E%3Crect x='8' y='11' width='14' height='2' rx='1'/%3E%3Crect x='2' y='17' width='20' height='2' rx='1'/%3E%3C/svg%3E");
}

/* przycisk zamknięcia — odsunięty od krawędzi */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
	top: clamp(1rem, 4vw, 1.75rem);
	right: clamp(1rem, 4vw, 1.75rem);
	padding: .25rem;
}

/*
 * Homepage pattern helpers.
 * Styling is kept here (not in block attributes) so the pattern markup stays
 * minimal and never trips Gutenberg's block validation.
 */

/* Eyebrow / small caption labels */

.edes-eyebrow {
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .12em;
	font-size: var(--wp--preset--font-size--small);
}

.edes-label {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-size: .75rem;
	line-height: 1.35;
}

/* Light section on the dark theme */

.edes-light :where(h1, h2, h3, h4, h5, h6) {
	color: var(--wp--preset--color--base);
}

/* Wyróżnienie tekstu (narzędzie „Wyróżnienie" w edytorze → <mark>).
   Kolory bierze z zaznaczenia w Gutenbergu (inline style ma priorytet).
   „Pudełko" pionowo robi box-shadow (spread), nie padding — dzięki temu nie
   rozpycha interlinii ani nie odsuwa kolejnego akapitu. Poziomo: padding +
   ujemny margines z lewej, żeby lewa krawędź pudełka trzymała się tekstu wyżej. */
:where(h1, h2, h3, h4, h5, h6, .wp-block-heading, p) mark {
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--contrast);
	padding: 0 0;
	margin-left: 0;
	border-radius: 2px;
	/* box-shadow: 0 0 0 0.12em var(--wp--preset--color--primary);
	-webkit-box-decoration-break: clone;
	        box-decoration-break: clone; */
}

/* Hero — feature row */

.edes-features {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem 1.25rem;
}

.edes-feature {
	display: flex;
	align-items: center;
	gap: .55rem;
}

.edes-feature + .edes-feature {
	border-left: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 22%, transparent);
	padding-left: 1.25rem;
}

/* mobile: pion — tekst / kreska / tekst / kreska / tekst */
@media (max-width: 600px) {
	.edes-features {
		flex-direction: column;
		align-items: stretch;
		gap: .85rem;
		width: 100%;
	}

	.edes-feature + .edes-feature {
		border-left: 0;
		padding-left: 0;
		border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--contrast) 22%, transparent);
		padding-top: .85rem;
	}
}

/* Rdzeniowy styl przycisku „Kontur" ma padding .667em/1.333em + border 2px, przez
   co jest wyższy niż przycisk pełny (padding motywu 1rem/1.75rem). Wyrównujemy
   padding tak, by ZEWNĘTRZNY box (padding + ramka) zgadzał się z pełnym. */
.wp-block-button.is-style-outline > .wp-block-button__link {
	padding: calc(1rem - 2px) calc(1.75rem - 2px);
}

/* Szybki pasek pod hero (patterns/hero.php): pełnoszerokościowy prostokąt
   (górna + dolna linia), w środku kontener alignwide z 3 blokami i pionowymi
   dzielnikami. (Border bloków `column` zawodzi — has-border-color rysuje ramkę
   na wszystkich bokach — więc kreski robimy tu.) */
.edes-quicklinks-band {
	border-block: 1px solid var(--wp--preset--color--border);
}

.edes-quicklinks {
	border-inline: 1px solid var(--wp--preset--color--border);
}

.edes-quicklinks > .wp-block-column + .wp-block-column {
	border-left: 1px solid var(--wp--preset--color--border);
}

@media (max-width: 781px) {
	.edes-quicklinks > .wp-block-column + .wp-block-column {
		border-left: 0;
		border-top: 1px solid var(--wp--preset--color--border);
	}
}

/* Ikony w kafelkach paska (wp:html — SVG FontAwesome / lucide, dziedziczą kolor). */
.edes-ql-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	color: var(--wp--preset--color--primary);
}

.edes-ql-icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

/* Banner (cover z klasą „edes-hero") — druga nakładka: czerń z lewej → przezroczysta
   w prawo, z załamaniem ~w środku. Pionowy gradient bloku zostaje bez zmian. */

.edes-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(
		90deg,
		rgb(15, 15, 15) 0%,
		rgba(15, 15, 15, .82) 20%,
		rgba(15, 15, 15, 0) 50%
	);
}

/* treść nad obiema nakładkami */
.edes-hero > .wp-block-cover__inner-container {
	position: relative;
	z-index: 2;
}

/* Hero — stat cards. Layout (1-col grid, icon|text row) is set on the blocks;
   only the look lives here. */

/* tło / zaokrąglenie / padding karty ustawiane w bloku (Gutenberg) — tu tylko
   rozmycie tła, którego blok nie potrafi. */
.edes-stat {
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}

.edes-stat .wp-block-icon {
	flex: 0 0 auto;
}

.edes-stat__body {
	min-width: 0;
}

.edes-stat__num {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 800;
	font-size: 1.9rem;
	line-height: 1;
	color: var(--wp--preset--color--primary);
	margin: 0 0 .15rem;
}

/* Etykieta na zdjęciu (patterns/process.php) — węższa niż kolumna, dosunięta w prawo.
   Gutenberg nie potrafi zmniejszyć grupy do własnej szerokości bez CSS. */

.edes-caption-box {
	max-width: min(24rem, 82%);
	margin-inline-start: auto;
}

/* Podstrona oferty — karty rozwiązań (patterns/offer-page.php) */

.edes-offer-card {
	background: var(--wp--preset--color--contrast);
	border: 1px solid #e6e6e6;
	border-radius: 12px;
	padding: var(--wp--preset--spacing--50);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--wp--preset--spacing--30);
}

/* ikona i tag kurczą się do treści, reszta na całą szerokość karty */
.edes-offer-card > .edes-icon-tile,
.edes-offer-card > .edes-tag {
	align-self: flex-start;
}

/* kreska nad listą punktów zamiast bloku separatora */
.edes-offer-card .wp-block-list {
	margin: 0;
	padding-top: var(--wp--preset--spacing--30);
	border-top: 1px solid #e6e6e6;
}

/* w kartach lżejszy znacznik — sam „ptaszek", bez kółka */
.edes-offer-card .is-style-edes-check li {
	padding-inline-start: 1.6em;
	margin-block: .35em;
}

.edes-offer-card .is-style-edes-check li::before {
	border: 0;
	width: auto;
	height: auto;
	top: 0;
	font-size: 1em;
}

.edes-offer-card__cta {
	margin-top: auto;
	padding-top: .25rem;
}

.edes-offer-card__cta a {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	text-decoration: none;
}

.edes-icon-tile {
	width: 64px;
	height: 64px;
	border-radius: 8px;
	background: #f5f5f5;
	display: flex;
	align-items: center;
	justify-content: center;
}

.edes-tag {
	display: inline-block;
	padding: .3em .7em;
	border-radius: 5px;
	background: color-mix(in srgb, var(--wp--preset--color--primary) 12%, transparent);
	color: var(--wp--preset--color--primary);
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: .68rem;
	letter-spacing: .07em;
	text-transform: uppercase;
	line-height: 1;
}

/* Sekcja „Cztery kroki" (patterns/steps.php) — rząd kroków w jednej ramce */

.edes-steps-row {
	background: var(--wp--preset--color--contrast);
	border: 1px solid #e6e6e6;
	border-radius: 12px;
}

.edes-steps-row > .wp-block-column {
	position: relative;
	padding: var(--wp--preset--spacing--50);
	border-left: 1px solid #e6e6e6;
	display: flex;
	flex-direction: column;
	gap: .5rem;
}

.edes-steps-row > .wp-block-column:first-child {
	border-left: 0;
}

.edes-step-num {
	position: absolute;
	top: var(--wp--preset--spacing--40);
	right: var(--wp--preset--spacing--50);
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 800;
	font-size: 1.9rem;
	line-height: 1;
	color: #dcdcdc;
}

.edes-step-icon {
	display: block;
	margin-bottom: .4rem;
	color: var(--wp--preset--color--primary);
}

.edes-step-icon svg {
	display: block;
	width: 26px;
	height: 26px;
}

@media (max-width: 781px) {
	.edes-steps-row > .wp-block-column {
		border-left: 0;
		border-top: 1px solid #e6e6e6;
	}

	.edes-steps-row > .wp-block-column:first-child {
		border-top: 0;
	}
}

/* Sekcja „Formularz zapytania" (patterns/quote-form.php) — biała karta z formularzem */

.edes-form-card {
	background: #fff;
	color: var(--wp--preset--color--base);
	border-radius: 14px;
	padding: clamp(1.75rem, 3vw, 2.75rem);
	box-shadow: 0 30px 60px rgba(0, 0, 0, .3);
}

.edes-form-card .edes-tag {
	margin: 0 0 1.25rem;
}

.edes-form-card__title {
	margin: 0 0 .5rem;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 700;
	font-size: 1.75rem;
	line-height: 1.15;
	text-transform: none;
}

.edes-form-card__lead {
	margin: 0 0 1.75rem;
	color: var(--wp--preset--color--tertiary);
	font-size: .95rem;
	line-height: 1.6;
}

.edes-form {
	display: flex;
	flex-direction: column;
	gap: 1.1rem;
}

/* WordPress (CF7's shortcode/Shortcode-block rendering) sometimes wraps each
   field's <label> in a stray <p> and turns its line breaks into <br> — strip
   that back out so the intended flex layout above still applies. */
.edes-form > p {
	margin: 0;
	display: contents;
}

.edes-form br {
	display: none;
}

.edes-field {
	display: flex;
	flex-direction: column;
	gap: .4rem;
}

.edes-field > span {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: .82rem;
}

.edes-field input,
.edes-field select {
	box-sizing: border-box;
	display: block;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0;
	padding: .85rem 1rem;
	border: 1px solid #dcdcdc;
	border-radius: 8px;
	background: #f7f7f5;
	font: inherit;
	font-size: .95rem;
	line-height: 1.3;
	color: var(--wp--preset--color--base);
}

/* input[type=date] — iOS Safari ma bardzo nachalny domyślny wygląd tego pola
   (potrafi ignorować nasz border/padding i wychodzić poza ramkę); reset
   appearance oddaje kontrolę nad wyglądem naszemu CSS, tak jak przy select. */
.edes-field input[type="date"] {
	-webkit-appearance: none;
	appearance: none;
	min-height: 3.05rem;
}

/* select — własna strzałka, żeby wysokość i wygląd zgadzały się z inputami */
.edes-field select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23555' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	padding-right: 2.5rem;
}

.edes-field input::placeholder {
	color: #9a9a9a;
}

.edes-form__submit {
	margin-top: .6rem;
	width: 100%;
	padding: 1.05rem 1.5rem;
	border: 0;
	border-radius: 8px;
	background: var(--wp--preset--color--primary);
	color: #fff;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: .9rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	transition: background-color .2s ease;
}

.edes-form__submit:hover {
	background: color-mix(in srgb, var(--wp--preset--color--primary) 88%, #000);
}

.edes-form__submit:disabled {
	opacity: .6;
	cursor: not-allowed;
}

.edes-form__submit:disabled:hover {
	background: var(--wp--preset--color--primary);
}

/* Contact Form 7 — komunikaty walidacji i odpowiedzi w stylu karty formularza
   (nadpisuje domyślny, "admin-style" wygląd wtyczki: niebieska/żółta ramka
   bez zaokrągleń itd.) */

.edes-field .wpcf7-not-valid {
	border-color: #e0453c;
}

.wpcf7-not-valid-tip {
	margin-top: .35rem;
	font-family: var(--wp--preset--font-family--body);
	font-size: .78rem;
	font-weight: 400;
	color: #e0453c;
}

.wpcf7-form.edes-form .wpcf7-response-output {
	margin: 0;
	padding: .85rem 1rem;
	border: 1px solid #e0453c;
	border-radius: 8px;
	background: #fdf1f0;
	font-size: .85rem;
	line-height: 1.5;
	color: #7a231e;
}

.wpcf7-form.edes-form.sent .wpcf7-response-output {
	border-color: #2f9e58;
	background: #f0faf3;
	color: #1d6b3b;
}

.wpcf7-form.edes-form.invalid .wpcf7-response-output,
.wpcf7-form.edes-form.unaccepted .wpcf7-response-output,
.wpcf7-form.edes-form.payment-required .wpcf7-response-output {
	border-color: #d98a10;
	background: #fdf6ea;
	color: #7a4e0a;
}

.edes-form-card__note {
	margin: 1rem 0 0;
	font-size: .8rem;
	color: var(--wp--preset--color--tertiary);
}

/* Offer + any image card */

.edes-card {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 6px;
	overflow: hidden;
	transition: transform .25s ease, border-color .25s ease;
}

.edes-card:hover,
.edes-card:focus-within {
	transform: translateY(-4px);
	border-color: var(--wp--preset--color--primary);
}

.edes-card .wp-block-cover__image-background {
	transition: transform .4s ease;
}

.edes-card:hover .wp-block-cover__image-background {
	transform: scale(1.05);
}

.edes-card .edes-label a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.edes-card .edes-label a:hover {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}

/* "Dlaczego EDES" — cienka linia na całą szerokość sekcji (góra+dół) oraz
   pionowe dzielniki TYLKO między wyróżnikami. */

.edes-why-section {
	border-block: 1px solid #e2e4e2;
}

.edes-why-item {
	text-align: center;
	padding: 1.4rem 1rem;
	border-left: 1px solid #e2e4e2;
}

.edes-why-item:first-child {
	border-left: 0;
}

.edes-why-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	margin-bottom: .6rem;
	color: var(--wp--preset--color--primary);
}

.edes-why-icon svg {
	width: auto;
	height: 100%;
	max-width: 100%;
}

/* Blokowa siatka nie zawija się — na węższych ekranach mniej kolumn, a kreski
   przenosimy na początek rzędu / dokładamy poziome. */

@media (max-width: 1024px) {
	.edes-light .edes-why-items {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.edes-why-item:nth-child(3n+1) {
		border-left: 0;
	}

	.edes-why-item:nth-child(n+4) {
		border-top: 1px solid #e2e4e2;
	}
}

@media (max-width: 460px) {
	.edes-light .edes-why-items {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.edes-why-item {
		border-left: 1px solid #e2e4e2;
	}

	.edes-why-item:nth-child(2n+1) {
		border-left: 0;
	}

	.edes-why-item:nth-child(n+3) {
		border-top: 1px solid #e2e4e2;
	}
}

/* Calculator — process steps */

.edes-steps {
	container-type: inline-size;
	/* Sized off the row's own (container-query) width, not the viewport — the row
	   only ever gets half the viewport here, so vw units alone caused overflow. */
	--edes-badge-size: clamp(40px, 13cqw, 88px);
	display: flex;
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: clamp(.5rem, 2cqw, 1rem);
}

.edes-step {
	flex: 1 1 0;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: .55rem;
}

.edes-step-arrow {
	flex: 0 0 auto;
	/* Same height as the badge circle (its default flex align-items:center then
	   lands the arrow on the badge's vertical middle, whatever size it renders at). */
	height: var(--edes-badge-size);
}

.edes-badge {
	width: var(--edes-badge-size);
	height: var(--edes-badge-size);
	border-radius: 50%;
	background: var(--wp--preset--color--contrast);
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	align-self: center;
}

.edes-badge.is-lg {
	width: 80px;
	height: 80px;
}

/* mobile: 4 kroki nie mieszczą się w rzędzie — 2×2 bez strzałek */
@media (max-width: 640px) {
	.edes-steps {
		flex-wrap: wrap;
		justify-content: center;
		gap: 1.5rem 1rem;
	}

	.edes-steps .edes-step {
		flex: 0 1 calc(50% - 1rem);
	}

	.edes-steps .edes-step-arrow {
		display: none;
	}
}

/* Realizacje — details card overlaid on the photo */

.edes-realization {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 6px;
	padding: var(--wp--preset--spacing--40);
	max-width: 320px;
}

.edes-realization__row {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

/* Realizacje — slider (patterns/calc-projects.php + assets/js/edes-slider.js) */

.edes-slider {
	position: relative;
}

.edes-slider__viewport {
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	border-radius: 6px;
}

.edes-slider__viewport::-webkit-scrollbar {
	display: none;
}

.edes-slider__track {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
}

.edes-slide {
	scroll-snap-align: start;
	flex: 0 0 100%;
	min-width: 0;
	display: flex;
	flex-wrap: wrap;
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 6px;
	overflow: hidden;
}

.edes-slide__media {
	flex: 1 1 240px;
	min-height: 240px;
	background: var(--wp--preset--color--base);
}

.edes-slide__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.edes-slide__panel {
	flex: 1 1 220px;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: var(--wp--preset--spacing--50);
}

.edes-slide__title {
	margin: 0;
	color: var(--wp--preset--color--primary);
	font-size: var(--wp--preset--font-size--large, 1.4rem);
	line-height: 1.2;
}

/* każdy wiersz = etykieta | wartość; jednakowe odstępy między wierszami */
.edes-slide__rows {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: .9rem;
}

.edes-slide__row {
	display: grid;
	grid-template-columns: 40% minmax(0, 1fr);
	align-items: baseline;
	column-gap: 1rem;
}

.edes-slide__row dt {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-size: .72rem;
	color: var(--wp--preset--color--tertiary);
}

.edes-slide__row dd {
	margin: 0;
	font-weight: 700;
	font-size: .9rem;
	text-align: left;
}

/* Nawigacja */

.edes-slider__nav {
	position: absolute;
	top: 120px;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 50%;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
	transition: background-color .2s ease, border-color .2s ease, opacity .2s ease;
}

.edes-slider__nav:hover:not(:disabled) {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
}

.edes-slider__nav:disabled {
	opacity: .35;
	cursor: default;
}

.edes-slider__nav--prev {
	left: -12px;
}

.edes-slider__nav--next {
	right: -12px;
}

.edes-slider__dots {
	display: flex;
	justify-content: center;
	gap: .5rem;
	margin-top: 1rem;
}

.edes-slider__dot {
	width: 26px;
	height: 6px;
	padding: 0;
	border: 0;
	border-radius: 3px;
	background: var(--wp--preset--color--border);
	cursor: pointer;
	transition: background-color .2s ease;
}

.edes-slider__dot[aria-selected="true"] {
	background: var(--wp--preset--color--primary);
}

@media (max-width: 600px) {
	.edes-slider__nav--prev {
		left: 8px;
	}

	.edes-slider__nav--next {
		right: 8px;
	}
}

/* Slider obrazów (inc/slider.php, [edes_slider]) — wygląd jak Realizacje.
   Widocznych --edes-slides kadrów na raz, auto-krok co N s (JS: data-edes-autoplay),
   przewijanie o jeden kadr (scroll-snap). Współdzieli .edes-slider / .edes-slide /
   edes-slider.js z Realizacjami. Liczba kadrów schodzi z szerokością ekranu. */

.edes-slider--images {
	--edes-slides: 3;
	--edes-slide-gap: var(--wp--preset--spacing--30, 1rem);
}

.edes-slider--images .edes-slider__track {
	gap: var(--edes-slide-gap);
}

.edes-slider--images .edes-slide {
	flex: 0 0 calc((100% - (var(--edes-slides) - 1) * var(--edes-slide-gap)) / var(--edes-slides));
	display: block;
	background: var(--wp--preset--color--base);
}

.edes-slide__link {
	display: block;
	height: 100%;
	cursor: zoom-in;
}

.edes-slider--images .edes-slide img {
	display: block;
	width: 100%;
	aspect-ratio: var(--edes-slide-ratio, 16 / 9);
	object-fit: cover;
}

.edes-slider--images .edes-slider__nav {
	top: calc(50% - .75rem);
	transform: translateY(-50%);
}

/* Szeroki slider — strzałki wewnątrz kadru, nie wystają poza sekcję. */
.edes-slider--images .edes-slider__nav--prev {
	left: 12px;
}

.edes-slider--images .edes-slider__nav--next {
	right: 12px;
}

@media (max-width: 900px) {
	.edes-slider--images {
		--edes-slides: 2;
	}
}

@media (max-width: 600px) {
	.edes-slider--images {
		--edes-slides: 1;
	}
}

/* Opinie — sekcja: ocena zbiorcza + slider (inc/opinie.php, [edes_opinie]) */

.edes-opinie {
	/* Pomarańczowy akcent przy lewej krawędzi sekcji. */
	border-left: 4px solid var(--wp--preset--color--primary);
}

.edes-opinie-inner {
	max-width: var(--wp--style--global--wide-size, 1400px);
	margin-inline: auto;
	display: grid;
	grid-template-columns: minmax(200px, 26%) 1fr;
	align-items: center;
	gap: clamp(1.5rem, 5vw, 4rem);
}

.edes-opinie__summary {
	text-align: center;
}

/* zeruje domyślne marginesy <p> (font 3.25rem robił ~3rem szpary) */
.edes-opinie__summary > p,
.edes-opinie__summary > .edes-stars {
	margin: 0;
}

.edes-opinie__summary .edes-eyebrow {
	display: block;
	text-align: left;
	margin-bottom: 1rem;
}

.edes-opinie__count {
	margin: .35rem 0 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-size: .72rem;
	color: var(--wp--preset--color--tertiary);
}

.edes-opinie__count strong {
	color: var(--wp--preset--color--base);
}

.edes-rating-num {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 800;
	font-size: 3.25rem;
	line-height: 1;
	color: var(--wp--preset--color--primary);
}

.edes-rating-num span {
	font-size: 1.5rem;
	color: var(--wp--preset--color--tertiary);
}

/* Gwiazdki */

.edes-stars {
	display: inline-flex;
	gap: .15rem;
}

.edes-star {
	fill: var(--wp--preset--color--primary);
}

.edes-star.is-empty {
	fill: #d9d9d9;
}

.edes-opinie__summary .edes-stars {
	margin: .9rem 0 .55rem;
}

.edes-opinie__summary .edes-star {
	width: 26px;
	height: 26px;
}

/* Slider opinii — używa .edes-slider (assets/js/edes-slider.js) */

.edes-opinie .edes-slider__viewport {
	padding: 6px;
	margin: -6px;
}

.edes-opinie .edes-slider__track {
	gap: 1.5rem;
}

.edes-opinie .edes-slide {
	flex: 0 0 calc(50% - .75rem);
	background: transparent;
	border: 0;
	border-radius: 0;
	overflow: visible;
	flex-wrap: nowrap;
}

.edes-review-slide {
	scroll-snap-align: start;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-start;
	gap: 1rem;
	background: #fafafa;
	border: 1px solid #e6e6e6;
	border-radius: 12px;
	padding: var(--wp--preset--spacing--40);
	box-shadow: 0 4px 14px rgba(0, 0, 0, .04);
	color: var(--wp--preset--color--base);
}

.edes-review-slide__media {
	flex: 0 0 90px;
	align-self: stretch;
	min-height: 140px;
	max-height: 100%;
	border-radius: 8px;
	overflow: hidden;
	background: #e9e9ec;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #b3b3ba;
}

.edes-review-slide__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.edes-review-slide__body {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: .55rem;
}

.edes-review-slide__text {
	margin: 0;
	font-size: .8125rem;
	line-height: 1.6;
	color: var(--wp--preset--color--base);
}

.edes-review-slide__author {
	margin: auto 0 0;
	padding-top: .35rem;
	font-weight: 700;
	font-size: .8125rem;
	color: var(--wp--preset--color--base);
}

.edes-opinie .edes-slider__dot[aria-selected="true"] {
	background: var(--wp--preset--color--primary);
}

@media (max-width: 900px) {
	.edes-opinie-inner {
		grid-template-columns: 1fr;
		gap: 1.75rem;
	}

	/* na mobile całe podsumowanie wyśrodkowane */
	.edes-opinie__summary,
	.edes-opinie__summary .edes-eyebrow {
		text-align: center;
	}

	.edes-opinie__summary .edes-stars {
		justify-content: center;
	}

	/* jedna opinia na widok — 2 kolumny robiły się za ciasne, tekst uciekał */
	.edes-opinie .edes-slide {
		flex-basis: 100%;
	}

	/* bez trika z ujemnym marginesem (na mobile cień i tak nieistotny) */
	.edes-opinie .edes-slider__viewport {
		margin: 0;
		padding: 0;
	}

	.edes-opinie .edes-slider__track {
		gap: 0;
	}

	.edes-review-slide {
		overflow: hidden;
	}

	.edes-review-slide__text {
		overflow-wrap: anywhere;
	}

	.edes-review-slide__media {
		flex-basis: 76px;
		min-height: 0;
	}
}

/* Footer link lists */

.edes-footer .is-style-edes-plain a {
	color: var(--wp--preset--color--tertiary);
	text-decoration: none;
}

.edes-footer .is-style-edes-plain a:hover {
	color: var(--wp--preset--color--primary);
}

/* --- Floating contact bar (inc/contact-bar.php) ------------------------- */

.edes-contact-bar {
	position: fixed;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	z-index: 90;
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--primary);
	border-radius: 12px 0 0 12px;
	overflow: hidden;
	box-shadow: 0 8px 30px rgba(0, 0, 0, .25);
}

.edes-contact-bar a {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .45rem;
	padding: 1.1rem 1.35rem;
	color: #fff;
	text-decoration: none;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 700;
	font-size: .72rem;
	letter-spacing: .04em;
	text-transform: uppercase;
	line-height: 1;
	transition: background-color .2s ease;
}

.edes-contact-bar a + a {
	border-top: 1px solid rgba(255, 255, 255, .28);
}

.edes-contact-bar a:hover,
.edes-contact-bar a:focus-visible {
	background: rgba(0, 0, 0, .14);
	color: #fff;
}

.edes-contact-bar svg {
	width: 26px;
	height: 26px;
}

/* Theme icons (assets/icons) have hard-coded colours — force the bar's white. */
.edes-contact-bar svg [fill]:not([fill="none"]) {
	fill: currentColor;
}

.edes-contact-bar svg [stroke]:not([stroke="none"]) {
	stroke: currentColor;
}

@media (max-width: 900px) {
	.edes-contact-bar {
		display: none;
	}
}

/* --- Rank Math breadcrumbs ------------------------------------------------ */
/* Blok „Shortcode" [edes_breadcrumbs] w page/single/archive.html → wprost
   rank_math_the_breadcrumbs(); wrap <nav class="edes-breadcrumbs"> nadaje filtr
   rank_math/frontend/breadcrumb/args. Cała stylizacja i odstęp na <nav> — gdy
   Rank Math nic nie zwróci, nie ma pustego elementu ani szpary. */

.edes-breadcrumbs {
	/* TODO: breadcrumbs tymczasowo wyłączone w edes_render_breadcrumbs() (return ''),
	   więc ten <nav> i tak się nie renderuje. */
	display: block;
	margin-block: var(--wp--preset--spacing--40, 1.25rem) var(--wp--preset--spacing--50, 2rem);
	color: var(--wp--preset--color--tertiary);
	font-size: var(--wp--preset--font-size--small, .85rem);
	line-height: 1.4;
}

.edes-breadcrumbs a {
	text-decoration: none;
	color: var(--wp--preset--color--tertiary);
}

.edes-breadcrumbs a:hover {
	color: var(--wp--preset--color--primary);
}

.edes-breadcrumbs__sep {
	opacity: .5;
	margin: 0 .4em;
}

/* --- Lightbox (assets/js/edes-lightbox.js) ------------------------------- */
/* Klik w zdjęcie slidera ([data-edes-lightbox]) otwiera powiększenie. */

.edes-lightbox {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(1rem, 4vw, 3rem);
	background: rgba(6, 16, 25, .93);
	-webkit-backdrop-filter: blur(3px);
	        backdrop-filter: blur(3px);
}

.edes-lightbox[hidden] {
	display: none;
}

.edes-lightbox__img {
	max-width: 100%;
	max-height: 100%;
	border-radius: 4px;
	box-shadow: 0 24px 70px rgba(0, 0, 0, .55);
}

.edes-lightbox__close {
	position: absolute;
	top: clamp(.5rem, 2.5vw, 1.5rem);
	right: clamp(.5rem, 2.5vw, 1.5rem);
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .14);
	color: #fff;
	font-size: 1.7rem;
	line-height: 1;
	cursor: pointer;
	transition: background-color .2s ease;
}

.edes-lightbox__close:hover {
	background: var(--wp--preset--color--primary);
}

/* --- Utility: kolumny w odwrotnej kolejności na mobile ------------------- */
/* Klasa dodatkowa na bloku „Kolumny" (Zaawansowane → Dodatkowe klasy CSS).
   Odwraca kolejność kolumn tam, gdzie rdzeń układa je już w pionie. */
@media (max-width: 782px) {
	.wp-block-columns.reverse-mobile {
		flex-direction: column-reverse;
	}
}