/* Banner Hero */
.section-banner-hero {
	position: relative;
	width: 100%;
	gap: 8px;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	margin-bottom: 64px;
}

/* Jeśli jest tło, ustaw stałą wysokość */
.section-banner-hero--with-image {
	height: 390px;
}

/* Jeśli NIE MA tła, zadbaj o padding i minimalną wysokość */
.section-banner-hero--without-image {
	min-height: 250px;
	text-align: center;
	margin-bottom: 24px!important;
}
.section-banner-hero.section-banner-hero--without-image .heading
{
	color: var(--grey-900);
}
.section-banner-hero.section-banner-hero--without-image #breadcrumbs{
	text-align: left!important;
}
.section-banner-hero.section-banner-hero--without-image .breadcrumbs-container .container a{
	color: var(--grey-500);
}
.section-banner-hero.section-banner-hero--without-image .breadcrumbs-container .container span{
	color: var(--grey-500);
}

.section-banner-hero.section-banner-hero--remove-margin{
	margin-bottom: 0;
}
.section-banner-hero--shadow.section-banner-hero::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background:
		linear-gradient(
			45deg,
			rgba(35, 34, 34, 0.7) 0%,
			rgba(35, 34, 34, 0.45) 50%
		);
	pointer-events: none;
	z-index: 1;
}
.section-banner-hero > .container {
	position: relative;
	display: flex;
    justify-content: flex-start;
	align-items: center;
	gap: 64px;
	z-index: 2;
	height: 100%;
}

.section-banner-hero .heading {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	color: var(--white);
	margin: 0 0 28px 0;

	font-size: 28px;
	margin: 0;
    line-height: 36px;
    font-weight: 500;
    color: var(--grey-900);
    text-align: left;
    font-family: var(--accent-font);
}

.section-banner-hero--without-image .section-banner-hero__content{
	max-width: 100%;
}

.section-banner-hero__content {
	display: flex;
	flex-direction: column;
	max-width: 750px;
	color: var(--white);
}
.section-banner-hero__content p {
	font-size: 18px;
	margin: 0;
}
.section-banner-hero #breadcrumbs,
.section-banner-hero .breadcrumbs-container,
.section-banner-hero .breadcrumbs-container .container {
	padding: 0;
}
.section-banner-hero .breadcrumbs-container .container  a{
	color: var(--white);
	transition: color var(--transition);
}
.section-banner-hero .breadcrumbs-container .container  a:hover{
	color: var(--primary-500);
	text-decoration: none;
}
.section-banner-hero .breadcrumbs-container {
	width: 100%;
	margin-top: 24px;
}



@media (max-width: 1240px) {

	.section-banner-hero__content p {
		font-size: 16px;
	}
}

@media (max-width: 992px) {


	.section-banner-hero--pos-40 {
		background-position: 40% center;
	  }
	  .section-banner-hero--pos-45 {
		background-position: 45% center;
	  }
	  .section-banner-hero--pos-50 {
		background-position: 50% center;
	  }
	  .section-banner-hero--pos-55 {
		background-position: 55% center;
	  }
	  .section-banner-hero--pos-60 {
		background-position: 60% center;
	  }
	  .section-banner-hero--pos-65 {
		background-position: 65% center;
	  }
	  .section-banner-hero--pos-70 {
		background-position: 70% center;
	  }

}

@media (max-width: 768px) {

	.section-banner-hero{
		margin-bottom: 24px;
	}
}


@media (max-width: 576px) {
	.section-banner-hero{
		margin-bottom: 12px;
	}
	
}

@media (max-width: 440px) {
	.section-banner-hero .heading {
		margin: 0 0 12px 0;
	}
	.section-banner-hero__content p{
		margin: 24px 0 10px;
	}
}


@media (max-width: 420px) {
	.section-banner-hero .heading {
		margin: 0;
	}
}
@media (max-width: 380px) {
	.section-banner-hero__content p{
		font-size: 14px;
		line-height: 24px;
	}

}