/* ==========================================================================
   Karmimy Pszczoły – page-specific styles
   Uses theme tokens from main.css (bg-honikan-bubbles, by-honikan, etc.).
   ========================================================================== */

/* Usuń border-left/right z theme bx-sm-honikan żeby obrazy dotykały krawędzi viewport */
main.page-karmimy-pszczoly.bx-sm-honikan {
	border-left: 0 !important;
	border-right: 0 !important;
}

.page-karmimy-pszczoly {
	/* Exact tokens z Figmy */
	--karmimy-honey:        #ed9b2f;
	--karmimy-honey-strong: #e89200;
	--karmimy-honey-2:      #f4b942;
	--karmimy-dark:         #1a1a1a;
	--karmimy-text:         #212529;
	--karmimy-cream:        #fffcf3;
	--karmimy-bg:           #efa92b;
	--karmimy-border:       rgba(26, 26, 26, 0.12);
	--karmimy-card-border:  5px solid #000000;
	--karmimy-card-bg:      var(--karmimy-cream);
}

.page-karmimy-pszczoly,
.page-karmimy-pszczoly p {
	color: var(--karmimy-text);
}

/* generic "white card with black border" used in etapy, plants accordion, quote, stats */
.page-karmimy-pszczoly .karmimy-card {
	background: var(--karmimy-card-bg);
	border: var(--karmimy-card-border);
	border-radius: 4px;
}

/* skewed divider — removed (caused layout breakage) */

/* Tło sekcji — backgroundy z Figmy podzielone na 4 grupy.
   Aspect ratio preserved + repeat-y pattern żeby pokrył wrapper niezależnie od wysokości content. */
.karmimy-bg {
	position: relative;
	background-repeat: repeat-y;
	    background-size: cover;
	background-color: var(--karmimy-bg);
}
.karmimy-bg--1 { background-image: url("../assets/img/karmimy/bg-section-1.png"); background-color: var(--karmimy-cream); }
.karmimy-bg--2 { background-image: url("../assets/img/karmimy/bg-section-2.png"); }
.karmimy-bg--3 { background-image: url("../assets/img/karmimy/bg-section-3.png"); padding-bottom: 105px; }
/* Hero (tylko bg--4): wg Figmy kremowe tło + subtelny wzór heksagonów (nie złoty gradient).
   Wzór na pseudo-elemencie z opacity, żeby był delikatny jak w projekcie. */
.karmimy-bg--4 {
	background-color: var(--karmimy-cream);
	background-image: none;
}
/* Stary powtarzalny wzór heksagonów — wyłączony, bo dekor hero pochodzi teraz
   z ACF hero_decor (Hero section.png) na .karmimy-hero__bg. */
.karmimy-bg--4::before {
	display: none;
}

/* Override bg-honikan-bubbles żeby nie nakładać tapety motywu na page karmimy */
.page-karmimy-pszczoly .bg-honikan-bubbles:not(.row.sticky-top) {
	background-image: none !important;
	background-color: transparent !important;
}

/* Fix poziomego scrolla: .row w #karmimy-content siedzą w kolumnie bez paddingu
   (row g-0 > col), więc ujemne marginesy Bootstrap (-12px) wystają poza viewport.
   Zerujemy je u źródła; clip na main jako zabezpieczenie. */
.page-karmimy-pszczoly {
	overflow-x: clip;
}
.page-karmimy-pszczoly #karmimy-content .row.sticky-top,
.page-karmimy-pszczoly #karmimy-content > .row.g-0,
.page-karmimy-pszczoly .karmimy-info {
	margin-left: 0;
	margin-right: 0;
}

/* sticky banner section header — exact Figma: bg cream, 5px black top/bottom borders, Bebas 28px */
.page-karmimy-pszczoly .row.sticky-top.bg-honikan-bubbles {
	background-color: var(--karmimy-cream) !important;
	background-image: none !important;
	border-top: 5px solid #000000;
	border-bottom: 5px solid #000000;
	padding: 0;
	margin-top: 64px;
	margin-bottom: 24px;
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3);
}

/* Pierwszy banner w BG-3 ("wspieranie pszczół ma znaczenie") nie może mieć górnego
   marginesu: brak paddingu górnego na .karmimy-bg--3 powoduje, że margines dziecka
   "ucieka" przez collapse poza warstwę tła i tworzy biały pasek między mapą a bannerem. */
.page-karmimy-pszczoly .karmimy-bg--3 > .row.sticky-top.bg-honikan-bubbles:first-child {
	margin-top: 0;
}

/* Wrocław i Legnica: nagłówek bez dolnego marginesu — content przylega bezpośrednio */
.page-karmimy-pszczoly #wroclaw.row.sticky-top.bg-honikan-bubbles,
.page-karmimy-pszczoly #legnica.row.sticky-top.bg-honikan-bubbles {
	margin-bottom: 0;
}

/* Sekcja "Co robimy dla pszczół":
   - padding-top na paśmie = oddech pod mapą w tle pasma (nie biały pasek),
   - banner margin-top:0 (bez ucieczki marginesu / białego paska),
   - banner margin-bottom:0 (video przylega do belki). */
/* Banner "Co robimy": bez marginesów — przylega do ciągłego tła mapy (nad) i do video (pod).
   Odstęp pod mapą pochodzi z własnego (ciągłego) tła sekcji mapy, więc nie ma paska innego koloru. */
.page-karmimy-pszczoly .karmimy-corobimy > .row.sticky-top.bg-honikan-bubbles:first-child {
	margin-top: 0;
	margin-bottom: 0;
}

/* --- Spójny, przestronny rytm pionowy między sekcjami (dopasowanie do projektu docelowego) --- */
/* Sekcje w .container (bez skew-dividerów) dostają oddech góra/dół */
.page-karmimy-pszczoly #karmimy-content .text-start > .container {
	padding-top: 48px;
	padding-bottom: 48px;
}
/* Pełnoszerokie sekcje bez skew (legnica, nature) — properties pomijamy (ma skew).
   margin-top:0 — content ma przylegać do bannera (banner ma już mały margin-bottom). */
.page-karmimy-pszczoly .karmimy-legnica,
.page-karmimy-pszczoly .karmimy-nature {
	margin-top: 0;
	margin-bottom: 40px;
}
/* Wrocław: karta statystyk NACHODZI na dół zdjęcia (ujemny górny margines + z-index nad obrazem) */
.page-karmimy-pszczoly .karmimy-nature {
	margin-bottom: 0;
}
.page-karmimy-pszczoly .karmimy-nature__stats {
	margin-top: -80px;
	margin-bottom: 8px;
	position: relative;
	z-index: 2;
}

.page-karmimy-pszczoly .row.sticky-top .section-header,
.page-karmimy-pszczoly .row.sticky-top h2 {
	font-family: "Bebas Neue", sans-serif !important;
	font-weight: 400 !important;
	font-size: 28px !important;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--karmimy-dark);
	text-align: center;
	margin: 0;
	padding: 1rem 0;
}

.page-karmimy-pszczoly .row.sticky-top .h-quarter {
	padding: 0;
}

/* -------------------- Hero -------------------- */
.karmimy-hero {
	overflow: hidden;
}

.karmimy-hero__bg {
	background-color: var(--karmimy-cream);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: cover;
	position: relative;
	overflow: hidden;
}

/* Hero bg: kremowa baza + dekoracyjny wzór heksagonów z ACF hero_decor (inline background-image).
   Wcześniej background-image:none !important nadpisywał inline style i tło się nie pokazywało. */
.karmimy-hero__bg {
	background-color: var(--karmimy-cream) !important;
}

.karmimy-hero .container {
	position: relative;
	z-index: 1;
}

.karmimy-hero__image {
	max-width: 622px;
	width: 100%;
	height: auto;
	margin: 0 auto 1rem;
	display: block;
}

.karmimy-hero__lead,
.karmimy-hero__lead p {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: normal;
	color: var(--karmimy-text);
	text-align: center;
	max-width: 827px;
	margin-left: auto;
	margin-right: auto;
}

/* Buttony hero — exact Figma: bg #ed9b2f, border 3px BLACK, padding 16x24, Bebas 20px BLACK */
.karmimy-hero__buttons {
	gap: 31px !important;
	margin-top: 2rem;
}

.karmimy-hero__buttons .karmimy-hero__btn,
.karmimy-hero__buttons a.karmimy-hero__btn.btn {
	--bs-btn-bg: var(--karmimy-honey);
	--bs-btn-color: #000000;
	--bs-btn-border-color: #000000;
	--bs-btn-hover-bg: #000000;
	--bs-btn-hover-color: var(--karmimy-honey);
	--bs-btn-hover-border-color: #000000;
	--bs-btn-active-bg: #000000;
	--bs-btn-active-color: var(--karmimy-honey);
	background-color: var(--karmimy-honey);
	color: #000000;
	border: 3px solid #000000;
	padding: 16px 24px;
	font-family: "Bebas Neue", sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: normal;
	letter-spacing: 0;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 0;
}

.karmimy-hero__buttons .karmimy-hero__btn:hover,
.karmimy-hero__buttons .karmimy-hero__btn:focus,
.karmimy-hero__buttons a.karmimy-hero__btn.btn:hover {
	background-color: #000000;
	color: var(--karmimy-honey);
	border-color: #000000;
}

/* -------------------- Map -------------------- */
.karmimy-map {
	overflow: hidden;
}

/* Interaktywna mapa Google (Maps JS API) — kontener musi mieć realną wysokość.
   Węższa niż kolumna (max-width + auto), proporcje bardziej "mapowe". */
.karmimy-map__canvas {
	width: 100%;
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	aspect-ratio: 16 / 10;
	border: 5px solid #000000;
	border-radius: 4px;
	overflow: hidden;
	background: var(--karmimy-cream);
}

@media (max-width: 767.98px) {
	.karmimy-map__canvas {
		max-width: 100%;
		aspect-ratio: 1 / 1; /* bardziej kwadratowa na mobile */
	}
}

.karmimy-map__bee {
	position: absolute;
	left: -2rem;
	bottom: -1rem;
	max-width: 26%;
	pointer-events: none;
}

@media (max-width: 767.98px) {
	.karmimy-map__bee {
		max-width: 38%;
		left: -1rem;
	}
}

/* -------------------- Info boxes -------------------- */
.karmimy-info {
	position: relative;
	overflow: hidden;
}

.karmimy-info > .col-12 {
	position: relative;
	z-index: 2;
}

.karmimy-info__section-title {
	font-family: "Bebas Neue", sans-serif;
	font-size: clamp(1.5rem, 3vw, 2.25rem);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--karmimy-dark);
	margin: 0;
}

.karmimy-info__header {
	border-bottom: 1px solid var(--karmimy-border);
	margin-bottom: 1rem;
}

.karmimy-info__box {
	position: relative;
}

/* Większe odstępy pionowe między podsekcjami (zgodnie z Figmą) */
.karmimy-info__box + .karmimy-info__box {
	margin-top: 44px;
}

/* Większy górny/dolny padding kontenera treści (48px → 80px) */
.page-karmimy-pszczoly .karmimy-info > .col-12 {
	padding-top: 96px;
	padding-bottom: 96px;
}

.karmimy-info__icon {
	max-width: 64px;
	height: auto;
	display: block;
}

/* Section titles z Figmy: Bebas Neue Regular 36px #1a1a1a */
.karmimy-info__title,
.karmimy-article__title,
.karmimy-plants__title,
.karmimy-etapy__title,
.karmimy-legnica__title,
.karmimy-preparation__title,
.karmimy-nature__title,
.karmimy-closing__title {
	font-family: "Bebas Neue", sans-serif;
	font-weight: 400;
	font-size: 36px;
	line-height: normal;
	letter-spacing: 0;
	text-transform: uppercase;
	color: var(--karmimy-dark);
	margin-bottom: 1rem;
}

.karmimy-info__text,
.karmimy-info__text p {
	font-family: "Lato", sans-serif;
	font-weight: 400;
	font-size: 16px;
	line-height: normal;
	color: var(--karmimy-text);
	margin-bottom: 1em;
}

.karmimy-info__decor {
	position: absolute;
	height: auto;
	pointer-events: none;
	z-index: 1;
	max-width: 18%;
}

/* Honi_mob_2 — top right (bliżej kolumny tekstu) */
.karmimy-info__decor--top {
	top: 5%;
	right: 12%;
	max-width: 18%;
}

/* honikan-kaszel-junior — middle left (bliżej tekstu) */
.karmimy-info__decor--middle {
	top: 38%;
	left: 12%;
	max-width: 12%;
}

/* pszczola-honikan — bottom right (bliżej tekstu) */
.karmimy-info__decor--bottom {
	bottom: 5%;
	right: 8%;
	max-width: 14%;
}

/* -------------------- Articles -------------------- */
.karmimy-article__title {
	margin-bottom: 0.5rem;
}

.page-karmimy-pszczoly .karmimy-article__subtitle,
.page-karmimy-pszczoly .karmimy-article__subtitle-secondary {
	font-family: "Bebas Neue", sans-serif;
	font-size: 32px;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: uppercase;
	color: rgba(198, 90, 46, 0.7);
	opacity: 1;
	margin: 0 0 1.25rem;
	font-style: normal;
	line-height: normal;
}

.karmimy-article__title + .karmimy-article__subtitle {
	margin-top: -0.5rem;
}

.karmimy-article__image {
	object-fit: cover;
	object-position: center center;
	width: 100%;
	height: auto;
	display: block;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

/* neutralize Bootstrap .ratio padding hack when applied directly on img */
img.karmimy-article__image.ratio {
	--bs-aspect-ratio: 0;
	padding: 0;
	aspect-ratio: auto;
}

/* Mapa — obraz mapy (prod: image-11.png) ma własną ramkę wbudowaną w grafikę.
   Bez CSS-borderu, żeby nie powstawał podwójny border. */
.karmimy-map__image {
	border: 0;
}

/* Plants image — czarna ramka 5px jak akordeon (wypalona cienka ramka i tak zostaje przycięta na desktopie) */
.karmimy-plants__group-image {
	border: 5px solid #000000;
	border-radius: 0;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	height: auto;
}

/* Legnica: ograniczenie szerokości tekstu (było rozlane na całą kolumnę col-md-8) */
.page-karmimy-pszczoly .karmimy-legnica__title,
.page-karmimy-pszczoly .karmimy-legnica__text {
	max-width: 620px;
}

/* Section images — bez CSS shadow/radius (PNG mają własne) */
.karmimy-legnica__image,
.karmimy-preparation__image,
.karmimy-nature__image,
.karmimy-closing__image {
	border: 0;
	border-radius: 0;
	box-shadow: none;
	object-fit: cover;
	width: 100%;
	height: auto;
}

/* Carousels — bez CSS shadow/radius (PNG mają własne) */
.karmimy-preparation__carousel,
.karmimy-closing__carousel,
.karmimy-plants__carousel {
	border-radius: 0;
	overflow: hidden;
	box-shadow: none;
	position: relative;
}

/* Carousel controls — round white 46px buttons (Figma 22:142/22:145) */
.karmimy-preparation__carousel .carousel-control-prev,
.karmimy-preparation__carousel .carousel-control-next,
.karmimy-closing__carousel .carousel-control-prev,
.karmimy-closing__carousel .carousel-control-next,
.karmimy-plants__carousel .carousel-control-prev,
.karmimy-plants__carousel .carousel-control-next {
	width: 46px;
	height: 46px;
	border: 1px solid #ffffff;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.15);
	top: auto;
	bottom: 16px;
	opacity: 1;
}

.karmimy-preparation__carousel .carousel-control-prev,
.karmimy-closing__carousel .carousel-control-prev,
.karmimy-plants__carousel .carousel-control-prev {
	left: auto;
	right: 78px;
}

.karmimy-preparation__carousel .carousel-control-next,
.karmimy-closing__carousel .carousel-control-next,
.karmimy-plants__carousel .carousel-control-next {
	right: 16px;
}

.karmimy-preparation__carousel .carousel-control-prev-icon,
.karmimy-preparation__carousel .carousel-control-next-icon,
.karmimy-closing__carousel .carousel-control-prev-icon,
.karmimy-closing__carousel .carousel-control-next-icon,
.karmimy-plants__carousel .carousel-control-prev-icon,
.karmimy-plants__carousel .carousel-control-next-icon {
	width: 16px;
	height: 16px;
	background-size: 100% 100%;
}

.karmimy-preparation__carousel .carousel-control-prev:hover,
.karmimy-preparation__carousel .carousel-control-next:hover,
.karmimy-closing__carousel .carousel-control-prev:hover,
.karmimy-closing__carousel .carousel-control-next:hover,
.karmimy-plants__carousel .carousel-control-prev:hover,
.karmimy-plants__carousel .carousel-control-next:hover {
	background: rgba(0, 0, 0, 0.4);
}

.karmimy-article__icon-rows {
	margin: 1.5rem 0;
	padding: 0;
}

.karmimy-article__icon-row {
	display: flex;
	align-items: flex-start;
	gap: 1rem;
	padding: 0.6rem 0;
}

.karmimy-article__icon-row-icon {
	flex: 0 0 auto;
	width: 60px;
	height: auto;
	margin-top: 0.15rem;
	object-fit: contain;
}

.karmimy-article__icon-row-text {
	flex: 1 1 auto;
	font-size: 0.95rem;
	line-height: 1.5;
}

.karmimy-article__icon-row-text p {
	margin-bottom: 0;
}

.karmimy-article__content--after {
	margin-top: 1rem;
}

/* -------------------- Properties divider SVG -------------------- */
.karmimy-properties__divider {
	display: block;
	position: absolute;
	top: -105px;
	left: 0;
	width: 100%;
	height: 120px;
	margin: 0;
	z-index: 2;
	overflow: visible;
}

.karmimy-properties__divider--bottom {
	display: block;
	width: 100%;
	height: 120px;
	margin-top: -1px;
	overflow: visible;
}

/* -------------------- Properties (statystyki) -------------------- */
/* Properties section ma BIAŁE tło zgodnie z Figmą (NIE honey) */
.karmimy-properties {
	background: #ffffff;
}

.karmimy-properties__title {
	font-family: "Bebas Neue", sans-serif;
	font-size: clamp(2rem, 5vw, 3.5rem);
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--karmimy-honey-strong);
	line-height: 1.05;
	margin-bottom: 2rem;
}

.karmimy-stat {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.karmimy-stat__icon {
	max-width: 72px;
	height: auto;
	flex: 0 0 auto;
}

.karmimy-stat__body {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.karmimy-stat__value {
	font-family: "Bebas Neue", sans-serif;
	font-size: clamp(1.75rem, 3vw, 2.4rem);
	font-weight: 700;
	color: var(--karmimy-dark);
}

.karmimy-stat__unit {
	font-size: 0.6em;
	margin-left: 0.25em;
	font-weight: 400;
}

.karmimy-stat__label {
	font-size: 0.95rem;
	color: var(--karmimy-dark);
}

.karmimy-properties__title-image {
	max-width: 763px;
	width: 100%;
	height: auto;
}

.karmimy-properties__grid {
	justify-content: center;
}

.karmimy-properties__stat {
	display: flex;
	justify-content: center;
	align-items: center;
}

.karmimy-properties__stat img {
	max-width: 361px;
	width: 100%;
	height: auto;
}

.karmimy-properties__footnotes {
	margin-top: 1.5rem;
	color: #5a5028;
}

/* -------------------- Plants (accordion + image left) -------------------- */
/* tytuł .karmimy-plants__title używa unified section-title rule */

.karmimy-plants__text {
	max-width: 900px;
	margin: 0 auto;
	font-family: "Bebas Neue", sans-serif;
	font-weight: 400;
	font-size: 36px;
	line-height: 1;
	letter-spacing: 0;
	text-align: center;
	color: var(--karmimy-dark);
}

.karmimy-plants__text p {
	margin-bottom: 0;
}

.karmimy-plants__group {
	margin-bottom: 1.5rem;
	align-items: flex-start;
}

.karmimy-plants__group-image-wrap {
	display: flex;
	align-items: flex-start;
	padding-right: 1rem;
}

/* Desktop: zdjęcie wypełnia wysokość akordeonu (dół ramki zdjęcia wyrównany z dołem akordeonu).
   border-right:0 — kolumny stykają się (px-0), więc prawy border zdjęcia + lewy border akordeonu
   dawały podwójną linię; wspólną krawędzią jest lewy border akordeonu. */
@media (min-width: 768px) {
	.karmimy-plants__group {
		align-items: stretch;
	}
	.karmimy-plants__group-image-wrap {
		align-items: stretch;
	}
	.karmimy-plants__group-image {
		aspect-ratio: auto;
		height: 100%;
		object-fit: cover;
		border-right: 0;
	}
}

@media (max-width: 767.98px) {
	.karmimy-plants__group-image-wrap {
		padding-right: 0;
		margin-bottom: 1rem;
	}
}

/* duplikat \.karmimy-plants__group-image — reguła powyżej (border:0 z Figmy) */

.karmimy-plants__accordion {
	background: transparent;
}

.karmimy-plants__item {
	background: #ffffff;
	border: 5px solid #000000;
	border-radius: 0;
	overflow: hidden;
}

/* nie-pierwsze pozycje: brak górnego bordera → linia między pozycjami = 5px dolny
   bordera poprzedniej pozycji (bez podwajania, bez zakrywania) */
.karmimy-plants__item:not(:first-child) {
	border-top: 0;
}

.karmimy-plants__btn {
	background: #ffffff !important;
	color: #000000 !important;
	font-family: "Bebas Neue", sans-serif;
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 0;
	text-transform: uppercase;
	padding: 1rem 1.25rem;
	text-align: center;
	border: 0 !important;
	box-shadow: none !important;
}

.karmimy-plants__btn:not(.collapsed) {
	background: #ffffff;
	color: #000000;
}

.karmimy-plants__btn:focus {
	border-color: transparent;
	box-shadow: none;
}

.karmimy-plants__btn::after {
	filter: brightness(0);
}

.karmimy-plants__body {
	padding: 1rem 1.25rem;
	color: #000000;
	background: #ffffff;
	font-family: "Lato", sans-serif;
	font-size: 16px;
	font-weight: 400;
	/* Równa wysokość rozwiniętych pozycji → stała wysokość akordeonu → brak skoku przy przełączaniu */
	min-height: 130px;
}

/* -------------------- Etapy -------------------- */
.karmimy-etapy__grid {
	margin: 0;
}

.karmimy-etapy__step {
	position: relative;
	text-align: center;
	background: var(--karmimy-card-bg);
	border: var(--karmimy-card-border);
	border-radius: 4px;
	margin: 0.5rem;
	padding: 0 1rem 1.25rem !important;
}

.karmimy-etapy__number {
	display: inline-block;
	font-family: "Bebas Neue", sans-serif;
	font-weight: 700;
	font-size: 20px;
	letter-spacing: 0;
	text-transform: uppercase;
	color: #000000;
	margin: 0 0 1rem;
	padding: 0.25rem 0.75rem;
	background: transparent;
	border: 0;
}

.page-karmimy-pszczoly .karmimy-etapy__step-title {
	font-family: "Bebas Neue", sans-serif !important;
	font-weight: 700 !important;
	font-size: 20px !important;
	letter-spacing: 0;
	text-transform: uppercase;
	color: #000000;
	text-align: center;
	margin-top: 1rem;
	margin-bottom: 0.5rem;
}

.page-karmimy-pszczoly .karmimy-etapy__desc {
	font-family: "Lato", sans-serif !important;
	font-size: 16px !important;
	font-weight: 400;
	line-height: 1.4;
	color: var(--karmimy-text);
	text-align: center;
}

.karmimy-etapy__image {
	border-radius: 8px;
	margin: 0.5rem 0 1rem;
	object-fit: cover;
	width: 100%;
	aspect-ratio: 1 / 1;
}

.karmimy-etapy__step-title {
	font-size: 1rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 0.5rem;
}

.karmimy-etapy__desc {
	font-size: 0.92rem;
	color: #2a2515;
}

.karmimy-etapy__care {
	margin-top: 2rem;
}

/* Care text: ograniczona, czytelna szerokość (było na całą szerokość containera) */
.karmimy-etapy__care-text {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

/* -------------------- Quote (legnica) -------------------- */
.karmimy-quote {
	position: relative;
	padding: 1.75rem 3rem 1.5rem 4.5rem;
	background: var(--karmimy-card-bg);
	border: var(--karmimy-card-border);
	border-radius: 4px;
	margin: 1.5rem 0;
}

.karmimy-quote__mark {
	position: absolute;
	top: 1rem;
	left: 1.25rem;
	font-size: 4.5rem;
	line-height: 1;
	font-family: "Bebas Neue", sans-serif;
	color: var(--karmimy-honey-strong);
}

.karmimy-quote__text {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	font-size: 25px;
	line-height: normal;
	margin: 0;
	color: #000000;
	text-align: center;
	font-style: normal;
}

.karmimy-quote__author {
	margin-top: 0.75rem;
	font-weight: 700;
	font-size: 0.95rem;
}

.karmimy-quote__bee {
	position: absolute;
	right: -6rem;
	top: -2.5rem;
	max-width: 170px;
	height: auto;
	pointer-events: none;
	z-index: 2;
	transform: scaleX(-1);
}

@media (max-width: 767.98px) {
	.karmimy-quote__bee {
		max-width: 90px;
		right: -1rem;
		top: -2rem;
	}
}

/* -------------------- Preparation + Closing carousels -------------------- */
.karmimy-preparation__carousel,
.karmimy-closing__carousel {
	border-radius: 8px;
	overflow: hidden;
	max-width: 538px;
	margin: 0 auto;
}

.karmimy-preparation__carousel img,
.karmimy-closing__carousel img {
	aspect-ratio: 538 / 360;
	object-fit: cover;
}

/* -------------------- Nature section title + subtitle -------------------- */
.karmimy-nature__section-title {
	font-family: "Bebas Neue", sans-serif;
	font-size: clamp(1.5rem, 3vw, 2rem);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	margin: 0;
}

.karmimy-nature__subtitle {
	font-family: "Lato", sans-serif !important;
	font-size: 16px !important;
	font-weight: 400 !important;
	line-height: normal;
	margin-bottom: 1rem;
	color: var(--karmimy-text);
}

/* Nature text col — wyrównaj lewy margin do container (1320px centered) gdy parent jest container-fluid */
@media (min-width: 1200px) {
	.page-karmimy-pszczoly .karmimy-nature > .col-md-6.order-md-1 {
		padding-left: calc((100vw - 1320px) / 2 + 1rem) !important;
		padding-right: 2rem !important;
	}
}

/* -------------------- Nature stats (Figma 22:289: 1230px centered, NIE full-width) -------------------- */
.karmimy-nature__stats {
	align-items: center;
	background: var(--karmimy-card-bg);
	border: var(--karmimy-card-border);
	border-radius: 4px;
	max-width: 1230px;
	margin: 1.5rem auto;
	padding: 1.25rem 0;
}

.karmimy-nature__stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0.75rem 0.5rem;
}

.karmimy-nature__stat--divider {
	position: relative;
}

.karmimy-nature__stat--divider::after {
	content: "";
	position: absolute;
	right: 0;
	top: 15%;
	bottom: 15%;
	width: 2px;
	background: var(--karmimy-dark);
}

@media (max-width: 767.98px) {
	.karmimy-nature__stat--divider::after {
		display: none;
	}
}

/* Stats wrocław — Figma exact: Lato Black 39px value + Lato Bold 32px label */
.karmimy-nature__value {
	font-family: "Lato", sans-serif;
	font-weight: 900;
	font-size: 39px;
	line-height: normal;
	color: #000000;
}

.karmimy-nature__label {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	font-size: 24px;
	line-height: 1.15;
	color: #000000;
	margin-top: 0.35rem;
}

/* ==========================================================================
   MOBILE RESPONSIVE (< 768px)
   ========================================================================== */
@media (max-width: 767.98px) {

	/* HERO */
	.page-karmimy-pszczoly .karmimy-hero__image {
		max-width: 80vw;
	}
	.page-karmimy-pszczoly .karmimy-hero__lead,
	.page-karmimy-pszczoly .karmimy-hero__lead p {
		font-size: 16px !important;
		padding: 0 1rem;
	}
	.page-karmimy-pszczoly .karmimy-hero__buttons {
		gap: 12px !important;
		padding: 0 1rem;
	}
	.page-karmimy-pszczoly .karmimy-hero__buttons .karmimy-hero__btn {
		font-size: 14px !important;
		padding: 12px 16px !important;
		width: 100%;
		text-align: center;
	}

	/* STICKY BANNER */
	.page-karmimy-pszczoly .row.sticky-top .section-header,
	.page-karmimy-pszczoly .row.sticky-top h2 {
		font-size: 20px !important;
		padding: 0.75rem 1rem !important;
	}

	/* INFO BOXES — center + smaller */
	.page-karmimy-pszczoly .karmimy-info__box {
		text-align: center;
		padding: 1.5rem 1rem !important;
	}
	.page-karmimy-pszczoly .karmimy-info__title {
		font-size: 24px !important;
		text-align: center;
	}
	.page-karmimy-pszczoly .karmimy-info__text,
	.page-karmimy-pszczoly .karmimy-info__text p {
		text-align: center;
		font-size: 15px !important;
	}

	/* ARTICLES */
	.page-karmimy-pszczoly .karmimy-article {
		padding: 1rem 0 !important;
	}
	.page-karmimy-pszczoly .karmimy-article > [class*="col-"] {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
		text-align: center;
	}
	.page-karmimy-pszczoly .karmimy-article__title {
		font-size: 28px !important;
		text-align: center;
	}
	.page-karmimy-pszczoly .karmimy-article__subtitle,
	.page-karmimy-pszczoly .karmimy-article__subtitle-secondary {
		font-size: 22px !important;
		text-align: center;
	}
	.page-karmimy-pszczoly .karmimy-article__content,
	.page-karmimy-pszczoly .karmimy-article__content p {
		text-align: left;
		font-size: 15px;
	}
	.page-karmimy-pszczoly .karmimy-article__icon-row {
		flex-direction: column;
		text-align: center;
		gap: 0.5rem;
	}
	.page-karmimy-pszczoly .karmimy-article__icon-row-icon {
		margin: 0 auto;
	}

	/* PROPERTIES */
	.page-karmimy-pszczoly .karmimy-properties {
		padding: 1rem !important;
	}
	.page-karmimy-pszczoly .karmimy-properties__title {
		font-size: 1.5rem !important;
	}
	.page-karmimy-pszczoly .karmimy-properties__stat {
		padding: 0.5rem !important;
	}

	/* PLANTS */
	.page-karmimy-pszczoly .karmimy-plants__group {
		padding: 1rem !important;
	}
	.page-karmimy-pszczoly .karmimy-plants__group-image-wrap {
		padding-right: 0;
		margin-bottom: 1rem;
	}
	.page-karmimy-pszczoly .karmimy-plants__group-image {
		max-height: 300px;
	}
	.page-karmimy-pszczoly .karmimy-plants__btn {
		font-size: 18px !important;
		padding: 0.75rem 1rem !important;
	}

	/* ETAPY */
	.page-karmimy-pszczoly .karmimy-etapy__step {
		margin: 0.5rem 1rem !important;
	}
	.page-karmimy-pszczoly .karmimy-etapy__step-title {
		font-size: 18px !important;
	}
	.page-karmimy-pszczoly .karmimy-etapy__care {
		padding: 1.5rem 1rem !important;
	}
	.page-karmimy-pszczoly .karmimy-etapy__care-title {
		font-size: 24px !important;
	}

	/* LEGNICA / PREPARATION / NATURE / CLOSING */
	.page-karmimy-pszczoly .karmimy-legnica,
	.page-karmimy-pszczoly .karmimy-preparation,
	.page-karmimy-pszczoly .karmimy-nature,
	.page-karmimy-pszczoly .karmimy-closing {
		padding: 0 !important;
		text-align: center;
	}
	.page-karmimy-pszczoly .karmimy-legnica > [class*="col-"],
	.page-karmimy-pszczoly .karmimy-preparation > [class*="col-"],
	.page-karmimy-pszczoly .karmimy-nature > [class*="col-"],
	.page-karmimy-pszczoly .karmimy-closing > [class*="col-"] {
		padding: 1rem !important;
		text-align: center;
	}
	.page-karmimy-pszczoly .karmimy-legnica__title,
	.page-karmimy-pszczoly .karmimy-preparation__title,
	.page-karmimy-pszczoly .karmimy-nature__title,
	.page-karmimy-pszczoly .karmimy-closing__title {
		font-size: 26px !important;
		text-align: center;
	}
	.page-karmimy-pszczoly .karmimy-legnica__text,
	.page-karmimy-pszczoly .karmimy-preparation__text,
	.page-karmimy-pszczoly .karmimy-nature__text,
	.page-karmimy-pszczoly .karmimy-closing__text {
		text-align: left;
		font-size: 15px;
	}

	/* QUOTE */
	.page-karmimy-pszczoly .karmimy-quote {
		padding: 1.5rem 1rem 1rem 2.5rem !important;
	}
	.page-karmimy-pszczoly .karmimy-quote__mark {
		font-size: 3rem;
		left: 0.5rem;
		top: 0.5rem;
	}
	.page-karmimy-pszczoly .karmimy-quote__text {
		font-size: 16px !important;
	}

	/* STATS WROCŁAW — 2 columns na mobile */
	.page-karmimy-pszczoly .karmimy-nature__stats {
		margin: 1rem !important;
		padding: 0.75rem 0;
	}
	.page-karmimy-pszczoly .karmimy-nature__stat {
		padding: 0.5rem 0.25rem !important;
	}
	.page-karmimy-pszczoly .karmimy-nature__stat--divider::after {
		display: none;
	}
	.page-karmimy-pszczoly .karmimy-nature__value {
		font-size: 22px !important;
	}
	.page-karmimy-pszczoly .karmimy-nature__label {
		font-size: 14px !important;
	}

	/* CAROUSEL CONTROLS */
	.page-karmimy-pszczoly .karmimy-preparation__carousel .carousel-control-prev,
	.page-karmimy-pszczoly .karmimy-preparation__carousel .carousel-control-next,
	.page-karmimy-pszczoly .karmimy-closing__carousel .carousel-control-prev,
	.page-karmimy-pszczoly .karmimy-closing__carousel .carousel-control-next {
		width: 36px;
		height: 36px;
		bottom: 8px;
	}

	/* DECORATIONS hide on mobile */
	.page-karmimy-pszczoly .karmimy-info__decor {
		display: none !important;
	}

	/* MAPA */
	.page-karmimy-pszczoly .karmimy-map__bee {
		max-width: 35%;
	}

	/* CONTAINER — reset full-bleed padding na mobile (nie potrzeba bleed na małym ekranie) */
	.page-karmimy-pszczoly main.bx-sm-honikan.page-karmimy-pszczoly {
		border: 0 !important;
	}
}

/* ==========================================================================
   TABLET (768px - 991px) — etapy 2-3 col, articles stack
   ========================================================================== */
@media (min-width: 768px) and (max-width: 991.98px) {
	.page-karmimy-pszczoly .karmimy-info__title {
		font-size: 28px !important;
	}
	.page-karmimy-pszczoly .karmimy-article__title,
	.page-karmimy-pszczoly .karmimy-legnica__title,
	.page-karmimy-pszczoly .karmimy-nature__title,
	.page-karmimy-pszczoly .karmimy-closing__title {
		font-size: 30px !important;
	}
	.page-karmimy-pszczoly .karmimy-nature__value {
		font-size: 28px !important;
	}
	.page-karmimy-pszczoly .karmimy-nature__label {
		font-size: 22px !important;
	}
}
