/* BZ-42 wariant 4 - baner centroom (blog 2).
   Slajdy maja ROZNE proporcje (1.93:1 do 3.73:1), karuzela AUTO-przewija, a captiony sa
   kotwiczone do starej wysokosci 264px. Czysty wariant 4 (wysokosc = proporcje zdjecia)
   dawalby ciagly skok wysokosci co ~5s i wyrzucalby captiony poza baner.
   Rozwiazanie: stala proporcja baneru 2.2:1 (wysokosc nie skacze, zmienia sie tylko z szerokoscia),
   obraz object-fit:contain (CALE zdjecie, bez przycinania), a letterbox wypelniony ROZMYTA kopia
   tego samego zdjecia (--bimg ustawia nfinity-bz42-banner-variant4-centroom.js) - zamiast plaskich
   pasow. Captiony przeniesione na dol. Zakres: mobile + tablet (<=1199px); desktop bez zmian. */
@media (max-width: 1199.98px) {
	.banner {
		height: auto !important;
		min-height: 0 !important;
		aspect-ratio: 2.2 / 1 !important;
		overflow: hidden !important;
	}

	.banner .carousel,
	.banner .carousel-inner,
	.banner .carousel-item {
		height: 100% !important;
	}

	.banner .carousel-item {
		position: relative !important;
	}

	/* rozmyte wypelnienie letterboxa = to samo zdjecie w tle (URL z JS) */
	.banner .carousel-item::before {
		content: "" !important;
		position: absolute !important;
		inset: 0 !important;
		background: var(--bimg) center / cover no-repeat !important;
		filter: blur(22px) brightness(0.55) !important;
		transform: scale(1.15) !important;
		z-index: 0 !important;
	}

	.banner .banner_img {
		position: relative !important;
		z-index: 1 !important;
		height: 100% !important;
		width: 100% !important;
		object-fit: contain !important;
		background: transparent !important;
	}

	.banner .carousel-caption {
		z-index: 2 !important;
		top: auto !important;
		bottom: 12px !important;
	}
}
