.banner-hero {
	text-align: center;
}

@media screen and (min-width: 782px) {
	.banner-hero {
		text-align: left;
	}
}

.banner-hero .banner-hero-bg {
	height: 100%;
	min-height: 399px;
	background: url('./../images/banner-hero-mobile.jpg') center 50% / cover no-repeat;
  	padding-top: 1.5rem;
	position: relative;
}

@media screen and (min-width: 576px) {
	.banner-hero .banner-hero-bg {
		min-height: 500px;
	}
}

@media screen and (min-width: 780px) {
	.banner-hero .banner-hero-bg {
		min-height: 575px;
		background-image: url('./../images/banner-hero.jpg');
		background-size: cover;
		background-position: top center;
		padding-top: 4.5rem;
	}
}

.banner-hero .banner-hero-bg::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 200px;
	background: linear-gradient(0deg, rgba(123, 0, 0, 0.00) 0%, rgba(123, 0, 0, 0.60) 50%, #500000 100%);
}

@media screen and (min-width: 780px) {
	.banner-hero .banner-hero-bg::before {
		content: none;
	}
}

.banner-hero .banner-hero-bg::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 80px;
	background: linear-gradient(180deg, rgba(60, 0, 0, 0.00) 0%, rgba(60, 0, 0, 0.80) 60%, #3C0000 90%);
}

@media screen and (min-width: 780px) {
	.banner-hero .banner-hero-bg::after {
		content: none;
	}
}

.banner-hero .banner-hero-cta {
	display: none;
}

@media screen and (min-width: 782px) {
	.banner-hero .banner-hero-cta {
		display: flex;
	}
}

.banner-hero .promo-counter {
	display: none;
}

@media screen and (min-width: 782px) {
	.banner-hero .promo-counter {
		display: block;
	}
}

.banner-hero .terms-note {
	display: none;
}

@media screen and (min-width: 782px) {
	.banner-hero .terms-note {
		display: block;
	}
}

.banner-hero .banner-hero-wrapper {
	width: calc(100% + 1.5rem);
	margin-top: -55px;
	padding-right: 0 !important;
	margin-right: -1.5rem !important;
	margin-left: -1.5rem !important;
}

@media screen and (min-width: 782px) {
	.banner-hero .banner-hero-wrapper {
		width: 100%;
		margin-top: -70px;
		margin-right: auto !important;
		margin-left: auto !important;
		padding-right: var(--wp--style--root--padding-right) !important;
	}
}

.banner-hero .swiper {
	padding-bottom: 1.75rem;
}

@media screen and (min-width: 782px) {
	.banner-hero .swiper {
		padding-bottom: 0;
	}
}

@media screen and (min-width: 782px) {
	.banner-hero .swiper-slide {
		width: 100% !important;
		max-width: 404px;
		flex-shrink: 1;
		margin-right: 0 !important;
	}
}

.banner-hero .swiper-wrapper {
	gap: 0;
}

@media screen and (min-width: 782px) {
	.banner-hero .swiper-wrapper {
		gap: 0.75rem;
		transform: none !important;
		justify-content: center;
	}
}

.banner-hero .swiper-pagination {
	bottom: 0 !important;
	font-size: 0;
	margin: 0;
}

.banner-hero .swiper-pagination .swiper-pagination-bullet {
	outline: none;
	opacity: 0.3;
}

.banner-hero .swiper-pagination .swiper-pagination-bullet-active {
	opacity: 1;
	background: var(--wp--preset--color--red-300);
}

@media screen and (min-width: 782px) {
	.banner-hero .swiper-pagination {
		display: none;
	}
}
