/* Base required imports
--------------------------------------------- */
/* Bootstrap
--------------------------------------------- */
/* Import variables and mixins
--------------------------------------------- */
/* Bootsrap required imports & components
--------------------------------------------- */
.block-banner-hp {
	height: 650px;
	border-bottom: 9.375rem solid #222b37;
}

.block-banner-hp .banner-caption .banner-title {
	font-family: "GothamRounded-Bold", "GothamRounded-Medium-fallback", Arial, sans-serif;
	font-weight: normal;
	font-size: clamp(30px, 6vw, 60px);
	color: #fff;
	text-align: center;
	margin-bottom: 0;
	line-height: 1.2;
}

.block-banner-hp .banner-caption .banner-subtitle {
	font-family: "GothamRounded-Medium", "GothamRounded-Medium-fallback", Arial, sans-serif;
	font-weight: normal;
	font-size: clamp(20px, 3vw, 30px);
	color: #fff;
	text-align: center;
}

.block-banner-hp .products {
	left: 50%;
	translate: -50%;
	bottom: -100px;
	list-style: none;
}

.block-banner-hp .product {
	position: relative;
	width: 200px;
	height: 200px;
	background: #fff;
	border-radius: 0.5rem;
}

.block-banner-hp .product:hover {
	background: #f6ad40;
}

.block-banner-hp .product:hover .img-cover {
	display: block;
}

.block-banner-hp .product:hover .img-default {
	display: none;
}

.block-banner-hp .product .img-default,
.block-banner-hp .product .img-cover {
	width: 6.25rem;
	height: 6.25rem;
}

.block-banner-hp .product img,
.block-banner-hp .product svg {
	display: block;
	max-width: 100%;
}

.block-banner-hp .product .img-cover {
	display: none;
}

.block-banner-hp .product .product-name {
	font-family: "GothamRounded-Medium", "GothamRounded-Medium-fallback", Arial, sans-serif;
	font-weight: normal;
	font-size: clamp(16px, 2.4vw, 24px);
	color: #000;
	text-align: center;
	line-height: 1.2;
}

@media (max-width: 1499.98px) {
	.block-banner-hp .banner-caption .banner-title {
		font-size: clamp(30px, 5.5vw, 55px);
	}
	.block-banner-hp .product {
		width: 11rem;
		height: 11rem;
	}
}

@media (max-width: 1199.98px) {
	.block-banner-hp .banner-caption .banner-title {
		font-size: clamp(30px, 5vw, 50px);
		margin-bottom: 1rem;
	}
	.block-banner-hp .banner-caption .banner-subtitle {
		font-size: clamp(20px, 2.6vw, 26px);
	}
}

@media (max-width: 389.98px) {
	.block-banner-hp .product {
		width: 8rem;
		height: 8rem;
	}
	.block-banner-hp .product .img-default,
	.block-banner-hp .product .img-cover {
		width: 5rem;
		height: 5rem;
	}
}

/*# sourceMappingURL=banner-hp.css.map */