body {
	padding-top: 0 !important;
}

body header.wp-block-template-part {
	top: 0 !important;
	position: relative !important;
}

/* Wrapper */
.promotion-banner-wrapper {
	width: 100%;
	position: relative;
}

.promotion-banner-wrapper.fse-compatible {
	width: 100vw;
	margin-left: calc(-50vw + 50%);
	max-width: none !important;
}

/* Main banner */
.promotion-banner-top {
	width: 100%;
	height: 140px;
	background: var(--mc-banner-bg) center center / cover no-repeat;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 50px;
	color: #fff;
	font-family: "Chakra Petch", sans-serif;
	text-transform: uppercase;
	gap: 30px;
	flex-wrap: wrap;
	box-sizing: border-box;
}

.promotion-banner-top .left {
	border-right: 1px solid rgba(255, 255, 255, 0.5);
	padding-right: 42px;
}

.promotion-banner-top .right {
	padding-left: 12px;
}

.left-top,
.right-top {
	text-align: center;
	font-family: "Chakra Petch", sans-serif;
	font-weight: 700;
}

.left-top {
	font-size: 19.97px;
	font-style: normal;
	font-weight: 700;
	letter-spacing: -0.486px;
	text-transform: uppercase;
}

.left-bottom {
	font-family: "Chakra Petch", sans-serif;
	font-size: 70.16px;
	font-style: normal;
	font-weight: 700;
	line-height: 57px;
	letter-spacing: -0.486px;
}

.right-top {
	font-size: 32.334px;
	font-style: normal;
	font-weight: 700;
	line-height: 33.237px;
	letter-spacing: -0.497px;
}

.right-bottom {
	color: #f1d500;
	font-family: "Chakra Petch", sans-serif;
	font-size: 63.674px;
	font-weight: 700;
	line-height: 51.237px;
	letter-spacing: -0.497px;
}

/* Countdown banner */
.promotion-countdown-wrapper {
	width: 100%;
	position: relative;
}

.promotion-countdown-wrapper.fse-compatible {
	width: 100vw;
	margin-left: calc(-50vw + 50%);
	max-width: none !important;
}

.promotion-countdown-bar {
	background-color: #000;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	background-image: var(--mc-countdown-bg);
	color: #fff;
	text-align: center;
	font-family: "Chakra Petch", sans-serif;
	padding: 10px 20px;
	font-size: 16px;
	text-transform: uppercase;
	letter-spacing: 2px;
	width: 100%;
	box-sizing: border-box;
}

.promotion-countdown-bar .countdown {
	font-family: "Chakra Petch", sans-serif;
	font-size: 33.97px;
	font-weight: 700;
	line-height: 50.023px;
	letter-spacing: -0.486px;
}

.promotion-countdown-bar .countdown-text {
	font-family: "Chakra Petch", sans-serif;
	font-size: 11.97px;
	font-weight: 700;
	letter-spacing: -0.486px;
}

/* Mobile */
@media (max-width: 768px) {
	.promotion-banner-top {
		padding: 20px;
		gap: 10px;
		background: var(--mc-banner-bg-mobile, var(--mc-banner-bg)) center center /
			cover no-repeat !important;
	}

	.promotion-banner-top .left {
		padding-right: 35px;
	}

	.left-top {
		font-size: 13.501px;
		font-style: normal;
		font-weight: 700;
		line-height: 29.535px;
		letter-spacing: -0.328px;
		text-transform: uppercase;
	}

	.left-bottom {
		font-size: 47.432px;
		font-style: normal;
		font-weight: 700;
		line-height: 38.535px;
		letter-spacing: -0.328px;
	}

	.right-top {
		font-size: 21.062px;
		font-style: normal;
		font-weight: 700;
		line-height: 33.376px;
		letter-spacing: -0.324px;
	}

	.right-bottom {
		font-size: 41.477px;
		font-style: normal;
		font-weight: 700;
		line-height: 33.376px;
		letter-spacing: -0.324px;
	}

	.promotion-countdown-bar .countdown {
		font-size: 19.933px;
		line-height: 29.353px;
		letter-spacing: -0.285px;
	}

	.promotion-countdown-bar .countdown-text {
		font-size: 7.024px;
		letter-spacing: -0.285px;
	}
}

@media (max-width: 450px) {
	.promotion-banner-top .left {
		padding-right: 10px;
	}

	.promotion-banner-top .right {
		padding-left: 0;
	}
}