/* =====================================================================
   BREVE – odświeżenie layoutu katalogu (2026-06)
   Osobny arkusz ładowany po style.css (wp_enqueue_style w functions.php).
   Usunięcie pliku + wyrejestrowanie w functions.php przywraca stary wygląd.
   Kolory marki: zielony #709319 / akcent #3b6d11 / tinty #eaf3de #f4f7ee.
   ===================================================================== */

/* --- Karta produktu: nagłówek z akcentem --- */
.blog .content.single h1.tytul-produktu {
	border-left: 4px solid #709319;
	padding: 2px 0 2px 16px;
	margin-bottom: 22px;
	font-weight: 400;
	line-height: 1.2;
}

/* --- Przycisk rozwijający listę wykonań --- */
.sklepowy-buton {
	border-radius: 8px !important;
	margin: 18px 0 !important;
	width: auto !important;
	float: none !important;
	display: inline-flex !important;
	align-items: center;
}
.sklepowy-buton:before { border-radius: 8px 0 0 8px; }

/* --- Lista wykonań: karty zamiast płaskiej listy z kreskami --- */
.produkty-sklepu-powiazane { padding-bottom: 30px; }

.produkty-sklepu-powiazane li {
	border: 1px solid #e7e7e7 !important;
	border-radius: 10px;
	background: #fff;
	margin-bottom: 8px !important;
	padding: 10px 16px !important;
	transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.produkty-sklepu-powiazane li:hover {
	border-color: #709319 !important;
	box-shadow: 0 3px 14px rgba(112,147,25,.13);
	transform: translateX(2px);
}

.produkty-sklepu-powiazane li > a {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0 16px;
	text-decoration: none;
}

.produkty-sklepu-powiazane .tabela-powiazana { width: auto !important; }

/* Kolumna nazwy rośnie i wypełnia środek (w stronę kolumny Moc) – równa szerokość w każdym
   wierszu. overflow+nowrap sprawiają, że treść nazwy NIE wpływa na szerokości kolumn
   (deterministyczny układ = ta sama "jedna kolumna" w każdym wierszu). */
.produkty-sklepu-powiazane .nazwa-prod { flex: 1 1 0; min-width: 0; overflow: hidden; }
.produkty-sklepu-powiazane .nazwa-prod .tytul-produktu {
	font-size: 15px;
	font-weight: bold;
	color: #3b6d11;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* "Nr artykułu" w swojej kolumnie; sam numer ląduje w linii POD etykietą (nie łamie się w połowie). */
.produkty-sklepu-powiazane .numer-prod {
	flex: 0 0 150px;
	font-size: 12px;
	color: #8a8a8a;
	line-height: 1.35;
}
.produkty-sklepu-powiazane .numer-prod span { display: block; }
.produkty-sklepu-powiazane .numer-prod span { color: #444; font-weight: bold; }

/* status magazynowy – pigułka z kropką */
.produkty-sklepu-powiazane .stan-prod {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: bold;
	padding: 3px 11px;
	border-radius: 20px;
	text-transform: none;
}
.stan-prod .stan-kropka { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.stan-prod.stan-magazyn { background: #eaf3de; color: #27500a; }
.stan-prod.stan-magazyn .stan-kropka { background: #639922; }
.stan-prod.stan-produkcja { background: #faeeda; color: #854f0b; }
.stan-prod.stan-produkcja .stan-kropka { background: #ef9f27; }

/* Status magazynowy ("W magazynie") pochodzi z osobnej wtyczki – usuwamy go z listy wykonań */
.produkty-sklepu-powiazane .stan-prod { display: none !important; }

/* parametry jako RÓWNE KOLUMNY – każdy atrybut to osobna kolumna tej samej szerokości,
   więc wartości pokrywają się pionowo we wszystkich wierszach (koniec ze "schodami"). */
.produkty-sklepu-powiazane .atrybuty-prod { flex: 0 0 340px; }
.produkty-sklepu-powiazane .product_attributes {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	gap: 6px;
}
.produkty-sklepu-powiazane .product_attributes .col {
	width: auto !important;
	padding: 4px 10px !important;
	margin: 0;
	background: #f4f7ee;
	border: 1px solid #e3ebd5;
	border-radius: 6px;
	font-size: 12px;
	display: flex;
	align-items: center;
	justify-content: space-between;   /* etykieta z lewej, wartość z prawej – wyrównane */
	gap: 5px;
}
.produkty-sklepu-powiazane .att_label { color: #777; font-weight: 400; }
.produkty-sklepu-powiazane .att_value,
.produkty-sklepu-powiazane .att_value p { color: #3b6d11; font-weight: bold; }

/* link "Więcej" jako zielony przycisk ze strzałką */
.produkty-sklepu-powiazane .link-prod {
	flex: 0 0 auto;
	margin-left: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: #709319;
	color: #fff;
	padding: 6px 14px;
	border-radius: 6px;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	transition: background .15s ease;
}
.produkty-sklepu-powiazane .link-prod:after {
	content: "\f105";
	font-family: FontAwesome;
	font-size: 14px;
}
.produkty-sklepu-powiazane li:hover .link-prod { background: #5c7a14; }

/* --- Paginacja listy wykonań (budowana przez katalog-refresh.js) ---
   Wygląd dopasowany 1:1 do żywej paginacji wtyczki stanów (.breve-stany .bs-pager),
   wyrównana DO LEWEJ. */
.wykonania-paginacja {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;   /* do lewej */
	align-items: center;
	gap: 8px;
	margin: 18px 0 4px;
}
.wykonania-paginacja .wp-page {
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	min-width: 42px;
	padding: 10px 14px !important;
	border: 2px solid #4f8a1f !important;
	background: #fff !important;
	color: #2f5511 !important;
	border-radius: 7px;
	cursor: pointer;
	box-shadow: none !important;
	text-shadow: none !important;
	text-transform: none !important;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.wykonania-paginacja .wp-page:hover:not(:disabled):not(.is-active) {
	background: #5b9b2f !important;
	border-color: #5b9b2f !important;
	color: #fff !important;
}
.wykonania-paginacja .wp-page.is-active {
	background: #5b9b2f !important;
	border-color: #5b9b2f !important;
	color: #fff !important;
	cursor: default;
}
.wykonania-paginacja .wp-page:disabled {
	border-color: #c2ccb4 !important;
	color: #aab59a !important;
	background: #f3f5ee !important;
	cursor: default;
}
.wykonania-paginacja .wp-dots {
	border: none;
	background: transparent;
	color: #7a8a64;
	padding: 0 2px;
}

/* Węższe ekrany: zamiast sztywnych kolumn – zawijanie, by nic nie wychodziło poza ekran */
@media (max-width: 1080px) {
	.produkty-sklepu-powiazane li > a { flex-wrap: wrap; gap: 6px 12px; }
	.produkty-sklepu-powiazane .nazwa-prod { flex: 1 1 100%; }
	.produkty-sklepu-powiazane .numer-prod { flex: 0 0 auto; }
	.produkty-sklepu-powiazane .numer-prod span { display: inline; }
	.produkty-sklepu-powiazane .atrybuty-prod { flex: 1 1 100%; }
	.produkty-sklepu-powiazane .product_attributes {
		grid-auto-flow: row;
		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	}
}

/* --- Pasek akcji (karta katalogowa PDF / 3D / certyfikaty / wróć) --- */
.breve-akcje-katalog {
	clear: both;
	float: left;
	width: 100%;
	margin-top: 10px;
	padding: 18px 20px;
	background: #f7f8f4;
	border: 1px solid #e7ebdd;
	border-radius: 12px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 22px;
}
.breve-akcje-katalog .kart-katalog,
.breve-akcje-katalog .pol.column.posts.obrazek {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}
.breve-akcje-katalog .pol.column.posts.obrazek { margin-left: auto !important; }
.breve-akcje-katalog .ikony-dcgz { float: none !important; width: auto !important; margin: 0 !important; }
.breve-akcje-katalog .katalog-karta img,
.breve-akcje-katalog .przycisk-wroc img {
	transition: transform .15s ease, filter .15s ease;
}
.breve-akcje-katalog a:hover img { transform: translateY(-2px); filter: brightness(.96); }

/* --- Siatka kategorii (category.php / katalog.php) – odświeżone kafelki --- */
html body .kategoria-strona .related-posts li,
html body #kategorie-produktow .kategoria-strona .related-posts li {
	border-radius: 12px !important;
	overflow: hidden;
	box-shadow: 0 1px 4px rgba(0,0,0,.10) !important;
	transition: box-shadow .18s ease, transform .18s ease;
}
html body .kategoria-strona .related-posts li:hover {
	box-shadow: 0 8px 22px rgba(0,0,0,.16) !important;
	transform: translateY(-4px);
}
.kategoria-strona .related-posts li .okno-produktu { overflow: hidden; }
.kategoria-strona .related-posts-obrazek {
	overflow: hidden;
	background: #fff;
	padding: 10px 0;
}
.kategoria-strona .related-posts-obrazek img {
	transition: transform .25s ease;
}
.kategoria-strona .related-posts li:hover .related-posts-obrazek img { transform: scale(1.05); }

/* górny pasek tytułu – delikatnie złagodzony */
.kategoria-strona .related-posts li .tytul-powiazany span {
	letter-spacing: .02em;
}
/* dolny podtytuł – z ciężkiego zielonego bloku na jasny tint (więcej oddechu) */
/* Stała (równa) wysokość paska – mieści 1 i 2 linie, koniec ze "schodami".
   Element jest display:table-cell + vertical-align:middle (ze style.css),
   więc stała wysokość wyśrodkowuje tekst w pionie i wyrównuje kafelki. */
.related-posts li .tytul-powiazany-pod span {
	background: #eaf3de !important;
	color: #3b6d11 !important;
	text-transform: none !important;
	font-weight: bold;
	box-sizing: border-box;
	height: 64px !important;        /* równa wysokość dla 1 i 2 linii tytułu */
	padding: 9px 16px !important;
	line-height: 1.35;
}

/* --- Wyszukiwarka w menu ---
   Baner: wysuwany "kafelek" wyszukiwania z prawej (samodzielny wrapper) – WYŁĄCZONY.
   Stopka: lupka w dolnym menu – WYŁĄCZONA.
   Górne menu nagłówka – ZOSTAJE (nie ruszamy). */
.astm-search-menu-wrapper { display: none !important; }   /* baner – wysuwany kafelek z prawej (add-search-to-menu) */
.footMenu .wyszukaj-head { display: none !important; }    /* stopka */
.wyszukiwarka-lupa { display: none !important; }          /* baner – formularz wyszukiwania motywu */
/* Zielony przycisk-grafika "WYSZUKIWARKA" na banerze = widget obrazkowy (wyszukaj-2.png, wp-image-382241). */
.widget_media_image:has(img.wp-image-382241) { display: none !important; }
img.wp-image-382241 { display: none !important; }

/* Logo w nagłówku: motyw składa URL przez [site_url_secure] => https://localhost:8080,
   a lokalny serwer nie ma HTTPS -> logo znika. URL względny działa i po http (lokalnie),
   i po https (produkcja). */
.main-nav-logo.has-logo-image {
	background-image: url('/pliki/2019/01/LOGO-BREVE-1989-min.png') !important;
}

/* Galeria zdjęć na dole (WPBakery image grid #asd) – WYŚRODKOWANIE.
   Nadpisujemy pozycjonowanie isotope (absolutne) na inline-block, dzięki czemu kafelki
   układają się w rzędzie i są wyśrodkowane (zdjęcia mają jednakowy rozmiar 320×240). */
#asd .wpb_image_grid_ul {
	text-align: center !important;
	width: auto !important;
	height: auto !important;
}
#asd .wpb_image_grid_ul .isotope-item {
	position: static !important;
	float: none !important;
	display: inline-block !important;
	left: auto !important;
	top: auto !important;
	vertical-align: top;
}

/* Kafelki-przyciski na stronie głównej (Wyszukiwarka / Produkty / Katalog PDF) –
   zaokrąglone rogi w nawiązaniu do pozostałych elementów strony (kafelki 12px, przyciski 6–8px).
   overflow:hidden przycina tło/pseudo-elementy (przyciski z ikoną „primary") do zaokrąglonych rogów. */
.vc_btn3.vc_btn3-shape-square.vc_btn3-block,
.vc_btn3.vc_btn3-shape-square.vc_btn3-block.vc_btn3-color-primary,
.vc_btn3.vc_btn3-shape-square.vc_btn3-block.vc_btn3-icon-left {
	border-radius: 10px !important;
	overflow: hidden !important;
}
/* Niebieskie kafelki (Wyszukiwarka / Katalog PDF): niebieskie tło (#0E90FD) jest na KONTENERZE
   .vc_btn3-container.niebieskie, a nie na <a> – dlatego zaokrąglenie samego <a> nie było widać.
   Zaokrąglamy kontener i przycinamy zawartość. */
#kategorie-produktow .vc_btn3-container.niebieskie,
.vc_btn3-container.niebieskie {
	border-radius: 10px !important;
	overflow: hidden !important;
}

/* Przełącznik języków (flagi PL/EN/DE) w górnym pasku – wyśrodkowane w pionie na całej wysokości paska */
.gorny-pasek {
	display: flex;
	align-items: center;              /* wyśrodkowanie w pionie na całej wysokości paska */
}
.gorny-pasek > .container {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}
.gorny-pasek-prawy .widget { margin-bottom: 0 !important; margin-top: 0 !important; vertical-align: middle; }
.gorny-pasek-prawy {
	display: flex;
	align-items: center;              /* wyśrodkowanie w pionie: telefon / mail / flagi w jednej linii */
	justify-content: flex-end;
	flex-wrap: wrap;
	gap: 4px 14px;
}
.gorny-pasek-prawy .jezyki-flagi {
	list-style: none;
	margin: 0 0 0 20px;                             /* odstep od maila */
	padding: 0 0 0 20px;
	border-left: 1px solid rgba(255,255,255,.45);  /* separator, zeby sie nie zlewalo */
	display: inline-flex;
	gap: 9px;
	align-items: center;
	vertical-align: middle;
	position: relative;
	top: 8px;                                      /* delikatne obnizenie flag */
}
.gorny-pasek-prawy .jezyki-flagi li { margin: 0; padding: 0; display: inline-flex; align-items: center; }
.gorny-pasek-prawy .jezyki-flagi a { display: block; line-height: 0; }
.gorny-pasek-prawy .jezyki-flagi img {
	display: block;
	width: 22px;              /* rozmiar flag (zapas nad/pod, nie dotyka krawedzi paska) */
	height: auto;
	border-radius: 3px;
	box-shadow: 0 0 2px rgba(0,0,0,.35);
	opacity: .85;
	transition: opacity .15s ease, transform .15s ease;
	vertical-align: middle;
}
.gorny-pasek-prawy .jezyki-flagi a:hover img { opacity: 1; transform: translateY(-1px); }
.gorny-pasek-prawy .jezyki-flagi .aktywny img { opacity: 1; outline: 2px solid rgba(255,255,255,.9); }

/* Sekcja kategorii na stronie głównej: wyśrodkuj kafle (ostatni niepełny rząd na środku, nie do lewej).
   Kafle są float:left, więc text-align nie wystarczy – flexbox na <ul> (float ignorowany, rzędy wyśrodkowane). */
body.home .related-posts > ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
body.home .related-posts > ul > li { float: none; }

/* Przycisk "Wyślij wiadomość" (formularz kontaktowy Gravity Forms) – zaokrąglone rogi */
.gform_button,
input[type="submit"].gform_button,
#gform_submit_button_1 {
	border-radius: 8px !important;
}

/* Logo: zielony sygnet jako obracająca się BRYŁA 3D (WebGL / Three.js).
   Canvas renderuje się w .breve3d; biała maska zakrywa statyczny sygnet.
   Zmienne = pozycja/rozmiar (do dostrojenia). */
.breve-logo-link {
	position: relative;
	display: inline-block;
	/* Pozycje w % szerokości logo (odporne na skalę/breakpoint).
	   Z analizy pliku logo: sygnet zajmuje 0–25,2% szer., napis "BREVE" od ~29,6%. */
	--syg-cx: 11%;      /* środek bryły 3D (lekko w lewo od środka sygnetu ~12,6%) */
	--syg-3d-w: 50px;   /* rozmiar bryły – proporcja ~0,89 (bez przycięcia w WebGL) */
	--syg-3d-h: 56px;
	--syg-mask-w: 27%;  /* maska kryje lewą kolumnę z sygnetem, kończy przed "BREVE" */
}
/* biała maska zakrywa STATYCZNY sygnet – TYLKO gdy 3D wystartowało (klasa breve3d-on).
   Gdy WebGL nie działa, maski nie ma i statyczne logo zostaje (fallback). */
.breve-logo-link.breve3d-on .main-nav-logo.has-logo-image::after {
	content: "";
	position: absolute;
	left: 0; top: 0;
	width: var(--syg-mask-w); height: 100%;
	background: #ffffff;
	z-index: 1;
}
.breve3d {
	position: absolute;
	left: var(--syg-cx); top: 50%;
	width: var(--syg-3d-w); height: var(--syg-3d-h);
	transform: translate(-50%, -50%);
	z-index: 2;
	pointer-events: none;
	line-height: 0;
}
.breve3d canvas { display: block; width: 100% !important; height: 100% !important; }

/* =====================================================================
   Odświeżenie kafelków-przycisków na stronie głównej (Wyszukiwarka /
   Produkty / Katalog pdf). Selektor z #kategorie-produktow (ID), żeby
   wygrać z drobiazgowymi regułami motywu (wymuszają font 13px i radius
   przez ...color-primary). Zmiana WYRAŹNA: większy font, mocniejsze
   zaokrąglenie, wyższe kafle, hover. KOLORY BEZ ZMIAN, układ rzędu
   zostaje siatce motywu. DOM: tło niebieskie na .vc_btn3-container.niebieskie,
   zielone na samym <a>.vc_btn3-color-green. */
#kategorie-produktow .pasek-przyc .vc_btn3-container.niebieskie,
#kategorie-produktow .pasek-przyc .vc_btn3-color-green {
	border-radius: 16px !important;
	overflow: hidden;
	box-shadow: 0 3px 12px rgba(0, 0, 0, .12);
	transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}
#kategorie-produktow .pasek-przyc .vc_btn3-container.niebieskie:hover,
#kategorie-produktow .pasek-przyc .vc_btn3-color-green:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 30px rgba(0, 0, 0, .20);
	filter: brightness(1.05);
}
#kategorie-produktow .pasek-przyc .vc_btn3.vc_btn3-block {
	min-height: 88px !important;
	width: 100%;
	display: flex !important;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 18px 22px !important;
	border-radius: 16px !important;
	font-size: 19px !important;
	font-weight: 700 !important;
	letter-spacing: .02em;
	line-height: 1.15;
	box-sizing: border-box;
}
#kategorie-produktow .pasek-przyc .vc_btn3.vc_btn3-block > i {
	font-size: 22px !important;
	margin: 0 !important;
}

/* =====================================================================
   Strona główna – nowe sekcje pod banerem (wstrzykiwane przez
   breve_home_refresh() w header.php): pasek zaufania + karty skrótów.
   Stary pasek guzików .pasek-przyc zastąpiony kartami → ukryty.
   ===================================================================== */
#kategorie-produktow .pasek-przyc { display: none !important; }

.breve-refresh { margin: 0 0 8px; }

/* pasek zaufania (atuty) */
.breve-trust { background: #eaf3de; border-top: 3px solid #709319; border-bottom: 1px solid #d7e6c0; }
.breve-trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.breve-trust .bt-item {
	display: flex; flex-direction: column; align-items: center; text-align: center;
	gap: 1px; padding: 16px 12px; border-left: 1px solid #d7e6c0;
}
.breve-trust .bt-item:first-child { border-left: 0; }
.breve-trust .bt-item .fa { font-size: 22px; color: #3b6d11; margin-bottom: 5px; }
.breve-trust .bt-item .bt-h { font-size: 17px; font-weight: 700; color: #27500a; line-height: 1.2; }
.breve-trust .bt-item .bt-s { font-size: 12px; color: #3b6d11; }

/* karty skrótów */
.breve-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; padding: 22px 0 6px; }
.breve-card {
	display: flex; flex-direction: column; align-items: flex-start;
	background: #fff; border: 1px solid #e4e4e4; border-radius: 14px; padding: 10px 18px;
	text-decoration: none;
	transition: box-shadow .16s ease, transform .16s ease, border-color .16s ease;
}
.breve-card:hover { border-color: #709319; box-shadow: 0 12px 28px rgba(0, 0, 0, .12); transform: translateY(-3px); }
.breve-card .bc-head {
	display: flex; align-items: center; gap: 12px;
	align-self: stretch; margin-bottom: 6px;
}
.breve-card .bc-textcol { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.breve-card .bc-ico {
	width: 44px; height: 44px; border-radius: 12px; background: #eaf3de;
	display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
}
.breve-card .bc-ico .fa { font-size: 22px; color: #3b6d11; }
.breve-card .bc-title { font-size: 18px; font-weight: 700; color: #1f1f1f; line-height: 1.2; }
.breve-card .bc-desc { font-size: 13px; color: #666; line-height: 1.4; margin: 0; }
.breve-card .bc-btn {
	align-self: stretch; margin-top: auto; text-align: center; background: #709319; color: #fff;
	font-weight: 700; font-size: 14px; padding: 11px 0; border-radius: 10px;
	transition: filter .15s ease, background .15s ease;
}
.breve-card:hover .bc-btn { background: #5c7a14; }

/* Slider banera – wysokość mniejsza DOKŁADNIE o 80px, niezależnie od paska przewijania.
   aspect-ratio 4:1 = wysokość = szerokość obrazu/4 (bez wpływu scrollbara), a clip-path + ujemny
   margines ucinają i podnoszą treść o 80px. padding-top #slajder (pod nagłówek) zostaje. */
#slajder .owl-carousel .owl-item img,
#slajder .owl-carousel img {
	width: 100%;
	height: auto;
	aspect-ratio: 1920 / 480;
	clip-path: inset(0 0 80px 0);
	margin-bottom: -80px;
	display: block;
}
.breve-card:hover .bc-btn { filter: brightness(1.06); }
.breve-card .bc-btn .fa { margin-left: 4px; }

/* Kafelki kategorii (TRANSFORMATORY / REGULATORY / …) podniesione wyżej –
   przerwa od 3 kart = 20px (zerujemy dolne odstępy kart + top sekcji kategorii). */
.breve-refresh { margin-bottom: 0 !important; }
.breve-cards { padding-bottom: 0 !important; }
#kategorie-produktow.page-section { padding-top: 2px !important; }
/* pusty <p> (artefakt wpautop, zawiera biały znak → :empty nie łapie) nad kafelkami
   dokładał 20px. W tym kontenerze bezpośredni <p> to tylko ten artefakt – chowamy. */
#kategorie-produktow .container > p { display: none !important; margin: 0 !important; }
/* pusty blok tekstowy WPBakery ma domyślny margin-bottom:35px – zerujemy (jest tylko ten jeden, pusty) */
#kategorie-produktow .wpb_text_column { margin: 0 !important; }

@media (max-width: 1100px) {
	.breve-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
	.breve-trust-grid { grid-template-columns: repeat(2, 1fr); }
	.breve-trust .bt-item:nth-child(3) { border-left: 0; }
}
@media (max-width: 560px) {
	.breve-cards { grid-template-columns: 1fr; }
}

/* Sekcja „Zadaj pytanie" (formularz w stopce, #formularz.stopka-formularz) – ukryta
   TYLKO na stronie głównej. Na podstronach (w tym kartach produktów) zostaje.
   (Menu „Kontakt" prowadzi do sekcji „Nasz zespół" #zespol, nie do formularza.) */
body.home #formularz.stopka-formularz { display: none !important; }

/* ==========================================================================
   Sekcja „Breve w liczbach" (wstawka pod „O firmie", page-section 54).
   Szkice ołówkiem + statyczna mapa świata (rynki na jasnozielono) + liczniki.
   ========================================================================== */
.breve-liczby { margin: 34px 0 4px; padding-top: 28px; border-top: 1px solid #dfe4d5; text-align: center; }
.breve-liczby .bl-title { margin: 0; font-size: 28px; font-weight: 800; color: #2f3d22; letter-spacing: .3px; }
.breve-liczby .bl-rule { display: inline-block; width: 58px; height: 3px; background: #709319; border-radius: 2px; margin: 11px 0 0; }
.breve-liczby .bl-grid { display: grid; grid-template-columns: 0.65fr 3.3fr 0.65fr; gap: 4px; align-items: center; margin-top: 24px; }
.breve-liczby .bl-col { margin: 0; }
.breve-liczby .bl-sketch { position: relative; z-index: 2; }
.breve-liczby .bl-map { position: relative; z-index: 1; }
.breve-liczby .bl-sketch img { display: inline-block; max-width: 100%; height: auto; max-height: 210px; }
.breve-liczby .bl-sketch figcaption { font-size: 13px; font-weight: 700; color: #3b4a2a; margin-top: 6px; }
.breve-liczby .bl-map-wrap { line-height: 0; margin: 0 -40px; }
.breve-liczby .bl-map-wrap svg { width: 100%; height: auto; display: block; }
.breve-liczby .bl-map .m-base { fill: #e0e4d8; stroke: #f4f6ef; stroke-width: .6; }
.breve-liczby .bl-map .m-mkt  { fill: #a4c65b; stroke: #f4f6ef; stroke-width: .6; }
.breve-liczby .bl-map .m-home { fill: #5f8a1a; stroke: #f4f6ef; stroke-width: .6; }
.breve-liczby .bl-map-cap { font-size: 14px; font-weight: 700; color: #3b4a2a; margin-top: 8px; }
.breve-liczby .bl-map-cap b { color: #709319; }
.breve-liczby .bl-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 26px; padding-top: 22px; border-top: 1px solid #dfe4d5; }
.breve-liczby .bl-num { display: block; font-size: 34px; font-weight: 800; color: #709319; line-height: 1; }
.breve-liczby .bl-lbl { display: block; font-size: 12px; color: #5b6a45; margin-top: 7px; font-weight: 600; }
@media (max-width: 768px) {
  .breve-liczby .bl-grid { grid-template-columns: 1fr; gap: 22px; }
  .breve-liczby .bl-map-wrap { margin: 0; }
  .breve-liczby .bl-sketch img { max-height: 240px; }
  .breve-liczby .bl-stats { grid-template-columns: repeat(2, 1fr); gap: 18px; }
}

/* ==========================================================================
   Blog (archive-blog.php, .blog-glowny) – układ redakcyjny, 3 w rzędzie:
   płaskie karty (bez ramek/tła), obraz zaokrąglony 3:2, data, tytuł + krótka
   zielona kreska, zajawka, tekstowy link „Czytaj więcej →". Konwencja Breve.
   ========================================================================== */
#blog.blog-glowny { background: #fff; }
.blog-glowny .kategoria-strona.column.posts,
.blog-glowny .leftpadding.ajaxed { width: 100% !important; float: none !important; padding: 0 !important; margin: 0 !important; }

.blog-glowny .kategoria-strona h1.tytul-produktu { font-size: 34px; line-height: 1.15; font-weight: 800; color: #1f1f1f; margin: 0 0 6px; }
.blog-glowny .taxonomy-description { max-width: 900px; color: #666; font-size: 15px; line-height: 1.65; margin-bottom: 4px; }
.blog-glowny .column.szukaj { float: none; width: auto; max-width: 380px; margin: 10px 0 0; }

.blog-glowny .blog-posts .row { margin: 0 !important; }
.blog-glowny .blog-posts ul { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 46px 34px; list-style: none; margin: 30px 0 10px; padding: 0; }
.blog-glowny .wpis-blog-post { width: auto !important; max-width: none !important; display: block !important; padding: 0 !important; margin: 0 !important; }

.blog-glowny .blog-okno-produktu { display: flex; flex-direction: column; height: 100%; background: transparent; border: 0; border-radius: 0; overflow: visible; box-shadow: none; }
.blog-glowny .wpis-blog-post:hover .blog-okno-produktu { box-shadow: none; transform: none; }

.blog-glowny .blog-posts-obrazek { margin: 0; border-radius: 12px; overflow: hidden; }
.blog-glowny .blog-posts-obrazek a { display: block; }
.blog-glowny .wpis-blog-post img.nowe-mini { width: 100% !important; height: auto; aspect-ratio: 3 / 2; object-fit: cover; display: block; float: none !important; margin: 0 !important; border: 0 !important; transition: transform .3s ease; }
.blog-glowny .wpis-blog-post:hover img.nowe-mini { transform: scale(1.04); }

.blog-glowny .blog-card-body { display: flex; flex-direction: column; flex: 1; padding: 18px 0 0; }
.blog-glowny .blog-meta { font-size: 13px; color: #8a8a8a; margin: 0 0 12px; }
.blog-glowny .blog-meta .bm-author { color: #6a6a6a; }

.blog-glowny .blog-tytul-link { display: block; text-decoration: none; }
.blog-glowny .blog-okno-produktu a h2 { font-size: 22px; line-height: 1.28; font-weight: 700; color: #1f1f1f; margin: 0 !important; float: none !important; width: auto !important; transition: color .15s; }
.blog-glowny .blog-tytul-link:hover h2 { color: #709319; }
.blog-glowny .blog-tytul-link::after { content: ""; display: block; width: 38px; height: 2px; background: #709319; margin: 16px 0 0; }

.blog-glowny .zajawka-blogowa { font-size: 14.5px; line-height: 1.7; color: #555; margin: 16px 0 18px !important; float: none !important; width: auto !important; flex: 1 0 auto; }

.blog-glowny a.link-do-postu { align-self: flex-start; margin: 0 !important; padding: 10px 22px !important; border-radius: 24px !important; background: #709319 !important; border: 0 !important; color: #fff !important; font-size: 13.5px; font-weight: 700; line-height: 1; float: none !important; text-decoration: none; transition: background .15s; }
.blog-glowny a.link-do-postu:hover { background: #5b7d14 !important; color: #fff !important; }
.blog-glowny a.link-do-postu::after { content: " \2192"; }

@media (max-width: 900px) { .blog-glowny .blog-posts ul { grid-template-columns: repeat(2, 1fr) !important; gap: 36px 26px; } }
@media (max-width: 560px) { .blog-glowny .blog-posts ul { grid-template-columns: 1fr !important; } }

/* ==========================================================================
   Sekcja „Z bloga" na stronie głównej (pod „Breve w liczbach") – 3 artykuły.
   Ten sam redakcyjny styl kart co archiwum bloga.
   ========================================================================== */
.breve-blog-teaser { margin: 38px 0 6px; padding-top: 28px; border-top: 1px solid #e3e8dc; }
.breve-blog-teaser .bt-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 4px; }
.breve-blog-teaser .bt-head h2 { margin: 0; font-size: 26px; font-weight: 800; color: #2f3d22; }
.breve-blog-teaser .bt-all { font-size: 14px; font-weight: 700; color: #709319; text-decoration: none; white-space: nowrap; }
.breve-blog-teaser .bt-all:hover { color: #5b7d14; }
.breve-blog-teaser .bt-all::after { content: " \2192"; }
.breve-blog-teaser .bt-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-top: 22px; }
.breve-blog-teaser .bt-card { display: flex; flex-direction: column; }
.breve-blog-teaser .bt-img { display: block; border-radius: 12px; overflow: hidden; }
.breve-blog-teaser .bt-img img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; display: block; transition: transform .3s ease; }
.breve-blog-teaser .bt-card:hover .bt-img img { transform: scale(1.04); }
.breve-blog-teaser .bt-body { display: flex; flex-direction: column; flex: 1; padding-top: 16px; }
.breve-blog-teaser .bt-meta { font-size: 12.5px; color: #8a8a8a; margin-bottom: 10px; }
.breve-blog-teaser .bt-title { display: block; text-decoration: none; }
.breve-blog-teaser .bt-title h3 { margin: 0; font-size: 19px; line-height: 1.3; font-weight: 700; color: #1f1f1f; transition: color .15s; }
.breve-blog-teaser .bt-title:hover h3 { color: #709319; }
.breve-blog-teaser .bt-title::after { content: ""; display: block; width: 34px; height: 2px; background: #709319; margin: 13px 0 0; }
.breve-blog-teaser .bt-excerpt { font-size: 14px; line-height: 1.65; color: #555; margin: 14px 0 14px; flex: 1 0 auto; }
.breve-blog-teaser .bt-more { align-self: flex-start; padding: 10px 22px; border-radius: 24px; background: #709319; color: #fff; font-size: 13.5px; font-weight: 700; line-height: 1; text-decoration: none; transition: background .15s; }
.breve-blog-teaser .bt-more:hover { background: #5b7d14; color: #fff; }
.breve-blog-teaser .bt-more::after { content: " \2192"; }
@media (max-width: 900px) { .breve-blog-teaser .bt-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (max-width: 560px) { .breve-blog-teaser .bt-grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   Strona KONTAKT – zespół w nowym stylu + formularz, dane, mapa.
   Opisy i zdjęcia bez zmian (treść przeniesiona z sekcji „Nasz zespół").
   ========================================================================== */
/* justify-content: center – rzędy niepełne (np. 2 kafle) stoją na środku;
   rzędy pełne wypełniają szerokość co do piksela, więc nic się nie przesuwa. */
.page-kontakt ul.team { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: center; gap: 24px; list-style: none; margin: 20px 0 0; padding: 0; }
/* Motyw daje .team klasę .clearfix, której ::before/::after w kontenerze flex
   liczą się jako elementy flex i dokładają dwa gapy – trzeci kafel zawijał się
   wtedy do nowego rzędu, a pierwszy był przesunięty o szerokość gapa. */
.page-kontakt ul.team::before,
.page-kontakt ul.team::after { content: none !important; display: none !important; }
.page-kontakt ul.team li { float: none !important; width: auto !important; flex: 0 0 calc(33.333% - 16px); max-width: calc(33.333% - 16px); margin: 0 !important; padding: 24px 18px; background: #f4f8ec; border: 1px solid #dde8c9; border-radius: 14px; text-align: center; box-sizing: border-box; font-size: 13.5px; line-height: 1.75; color: #5b6a45; transition: box-shadow .18s ease, transform .18s ease, background .18s ease; }
.page-kontakt ul.team li:hover { background: #eef4e0; }
.page-kontakt ul.team li:hover { box-shadow: 0 8px 22px rgba(47,61,34,.12); transform: translateY(-3px); }
/* Motyw nadaje span.img-wrap białe tło i border-radius:0 – na zielonym kaflu
   dawało to biały kwadrat za okrągłym zdjęciem. Zerujemy tło i wymuszamy okrąg. */
.page-kontakt ul.team li .img-wrap { display: block; width: 112px; height: 112px; margin: 0 auto 16px; border-radius: 50% !important; overflow: hidden; background: transparent !important; border: 0 !important; box-shadow: none !important; }
.page-kontakt ul.team li .img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 50% !important; border: 0 !important; }
.page-kontakt ul.team li h3 { font-size: 16px; font-weight: 800; color: #2f3d22; margin: 0 0 4px; line-height: 1.3; }
.page-kontakt ul.team li a[href^="mailto"] { color: #709319; text-decoration: none; }
.page-kontakt ul.team li a[href^="mailto"]:hover { text-decoration: underline; }

.breve-kontakt-dol { display: grid; grid-template-columns: 1.15fr 1fr; gap: 30px; margin-top: 46px; padding-top: 32px; border-top: 1px solid #e3e8dc; }
.breve-kontakt-dol h3 { font-size: 20px; font-weight: 800; color: #2f3d22; margin: 0 0 16px; }

/* Formularz Gravity Forms (legacy markup) w kolumnie „Napisz do nas".
   Motyw i GF układają pola na floatach (gf_left_half / gf_right_half) – w tej
   węższej kolumnie rozjeżdżają się, więc ustawiamy je w jedną kolumnę. */
.breve-kontakt-dol .bkd-form .gform_wrapper,
.breve-kontakt-dol .bkd-form .gform_wrapper form { margin: 0; padding: 0; }
.breve-kontakt-dol .bkd-form .gform_wrapper ul.gform_fields { display: block; list-style: none; margin: 0; padding: 0; }
.breve-kontakt-dol .bkd-form .gform_wrapper ul.gform_fields > li.gfield { float: none !important; clear: both; width: 100% !important; max-width: 100% !important; margin: 0 0 16px !important; padding: 0 !important; }
.breve-kontakt-dol .bkd-form .gform_wrapper li.gfield_visibility_hidden,
.breve-kontakt-dol .bkd-form .gform_wrapper li.gform_validation_container { display: none !important; }
.breve-kontakt-dol .bkd-form .gform_wrapper .gfield_label { display: block; font-size: 13px; font-weight: 700; color: #3b4a2a; margin: 0 0 6px; }
.breve-kontakt-dol .bkd-form .gform_wrapper .gfield_required { color: #709319; margin-left: 3px; }
.breve-kontakt-dol .bkd-form .gform_wrapper .ginput_container { margin: 0 !important; }
.breve-kontakt-dol .bkd-form .gform_wrapper input[type="text"],
.breve-kontakt-dol .bkd-form .gform_wrapper input[type="email"],
.breve-kontakt-dol .bkd-form .gform_wrapper textarea { width: 100% !important; box-sizing: border-box; border: 1px solid #d7e0c9; border-radius: 9px; padding: 11px 13px; font-size: 14px; line-height: 1.5; background: #f9fbf5; color: #333; transition: border-color .15s, background .15s; }
.breve-kontakt-dol .bkd-form .gform_wrapper textarea { height: 232px; min-height: 232px; resize: vertical; }
.breve-kontakt-dol .bkd-form .gform_wrapper input[type="text"]:focus,
.breve-kontakt-dol .bkd-form .gform_wrapper textarea:focus { outline: none; border-color: #709319; background: #fff; }
.breve-kontakt-dol .bkd-form .gform_wrapper .gfield_description { font-size: 12px; color: #8a9472; padding-top: 4px; }
.breve-kontakt-dol .bkd-form .gform_wrapper .gform_footer { margin: 4px 0 0; padding: 0; }
/* Promień rogów przycisku ustawia wspólna reguła #gform_submit_button_1 wyżej w tym pliku
   (8px !important) – ten sam formularz jest też w stopce, trzymamy jeden wygląd. */
.breve-kontakt-dol .bkd-form .gform_wrapper .gform_button { background: #709319; color: #fff; border: 0; font-weight: 700; font-size: 14px; padding: 13px 30px; cursor: pointer; transition: background .15s; }
.breve-kontakt-dol .bkd-form .gform_wrapper .gform_button:hover { background: #5b7d14; }
.breve-kontakt-dol .bkd-form .gform_wrapper .gform_ajax_spinner { margin-left: 12px; vertical-align: middle; }
.breve-kontakt-dol .bkd-form .gform_wrapper .validation_error { border: 0; background: #fdecea; color: #a3241c; font-size: 13px; font-weight: 600; border-radius: 9px; padding: 10px 14px; margin: 0 0 16px; }
.breve-kontakt-dol .bkd-form .gform_wrapper li.gfield.gfield_error { background: transparent; border: 0; padding: 0 !important; }
.breve-kontakt-dol .bkd-form .gform_wrapper .validation_message { font-size: 12px; font-weight: 600; color: #a3241c; padding-top: 4px; }
.breve-kontakt-dol .bkd-form .gform_confirmation_message { font-size: 15px; color: #3b4a2a; background: #f1f6e6; border: 1px solid #d7e0c9; border-radius: 12px; padding: 18px 20px; }
.breve-kontakt-dol .bkd-dane { font-size: 14px; line-height: 1.9; color: #3b4a2a; }
.breve-kontakt-dol .bkd-dane a { color: #709319; text-decoration: none; }
.breve-kontakt-dol .bkd-hours { margin-top: 12px; padding-top: 12px; border-top: 1px solid #eef2e6; color: #709319; font-weight: 700; }
.breve-kontakt-dol .bkd-map { margin-top: 18px; border-radius: 12px; overflow: hidden; border: 1px solid #dce4cf; }
.breve-kontakt-dol .bkd-map iframe { display: block; width: 100%; height: 240px; border: 0; }

@media (max-width: 900px) {
  .breve-kontakt-dol { grid-template-columns: 1fr; }
  .page-kontakt ul.team li { flex: 0 0 calc(50% - 12px); max-width: calc(50% - 12px); }
}
@media (max-width: 600px) {
  .page-kontakt ul.team li { flex: 0 0 100%; max-width: 100%; }
}

/* ==========================================================================
   Baner kontaktowy na stronie głównej (w miejscu dużej sekcji zespołu).
   ========================================================================== */
.breve-kontakt-baner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; background: #f4f6ef; border: 1px solid #e2e8d6; border-radius: 14px; padding: 26px 30px; margin: 10px 0; }
.breve-kontakt-baner .bkb-kicker { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #709319; font-weight: 700; }
.breve-kontakt-baner .bkb-title { font-size: 23px; font-weight: 800; color: #2f3d22; margin: 5px 0 10px; }
.breve-kontakt-baner .bkb-contacts { display: flex; gap: 24px; flex-wrap: wrap; font-size: 15px; }
.breve-kontakt-baner .bkb-contacts a { color: #3b4a2a; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.breve-kontakt-baner .bkb-contacts a:hover { color: #709319; }
.breve-kontakt-baner .bkb-ico { color: #709319; font-size: 17px; }
.breve-kontakt-baner .bkb-btn { background: #709319; color: #fff !important; font-weight: 700; font-size: 14px; padding: 13px 26px; border-radius: 24px; white-space: nowrap; text-decoration: none; transition: background .15s; }
.breve-kontakt-baner .bkb-btn::after { content: " \2192"; }
.breve-kontakt-baner .bkb-btn:hover { background: #5b7d14; color: #fff !important; }
@media (max-width: 700px) { .breve-kontakt-baner { padding: 22px; } .breve-kontakt-baner .bkb-btn { width: 100%; text-align: center; } }