/* Make the slider height fixed and scale images to fit without cropping */
.responsive-slider-slide {
	height: 800px !important;
	display: block !important;
	position: relative !important;
}
.responsive-slider-image {
	position: absolute !important;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important; /* Changed to cover so it fills the screen width */
	object-position: center center !important; /* Keep the focal point centered */
}
.responsive-slider-text {
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	width: 90% !important;
	z-index: 2;
}
.responsive-slider-plus-btn {
	position: absolute !important;
	bottom: 30px !important;
	right: 30px !important;
	padding: 10px 25px !important; /* Replaced fixed width/height with padding for text */
	background-color: #2E3192 !important;
	color: #fff !important;
	border-radius: 30px !important; /* Pill shape */
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	z-index: 10 !important;
	box-shadow: 0 4px 15px rgba(0,0,0,0.3) !important;
	text-decoration: none !important;
	transition: all 0.3s ease !important;
}
.responsive-slider-plus-btn:hover {
	transform: scale(1.05) !important;
	color: #fff !important;
	background-color: #FAB713 !important;
}
@media (max-width: 991px) {
	/* Let the slide height be driven by the image natural size */
	.responsive-slider-slide {
		height: auto !important;
		min-height: unset !important;
	}
	/* Override framework's fixed 500px on the swiper container */
	.witr_swiper_height {
		height: auto !important;
		overflow: visible !important;
	}
	/* Allow the swiper area to expand with content */
	.witr_swiper_area {
		overflow: visible !important;
	}
	.swiper-container, .swiper-wrapper {
		height: auto !important;
	}
	/* Switch image from absolute-fill to normal flow so it sizes the container */
	.responsive-slider-image {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		width: 100% !important;
		height: auto !important;
		object-fit: unset !important; /* Let the image display at its natural aspect ratio */
		display: block !important;
	}
	/* The text overlay now sits below the image in flow; hide it to keep the clean banner look */
	.responsive-slider-text {
		position: relative !important;
		top: auto !important;
		left: auto !important;
		transform: none !important;
		width: 100% !important;
		display: none !important; /* Banner images already contain the text baked in */
	}
	.responsive-slider-plus-btn {
		padding: 8px 20px !important;
		font-size: 14px !important;
		bottom: 15px !important;
		right: 15px !important;
	}
}
/* --- Enhanced Countdown/Statistics Area --- */
.countdown12 .autob {
	display: inline-flex !important;
	max-width: 100% !important;
	flex-wrap: nowrap !important;
	overflow-x: auto !important;
	gap: 20px !important;
	padding: 20px 0 50px 0 !important;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none; /* Firefox */
}
.countdown12 .autob::-webkit-scrollbar {
	display: none; /* Safari and Chrome */
}
.countdown12 span.cdowns {
	flex: 0 0 auto !important; /* Keep cards their intrinsic size and prevent squishing */
	width: 180px !important;
	height: auto !important;
	margin: 0 !important;
	padding: 30px 15px !important;
	background: rgba(255, 255, 255, 0.05) !important;
	border-radius: 15px !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	backdrop-filter: blur(5px) !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	transition: all 0.3s ease !important;
}
.countdown12 span.cdowns:hover {
	transform: translateY(-8px) !important;
	background: rgba(255, 255, 255, 0.15) !important;
	border-color: rgba(255, 255, 255, 0.3) !important;
	box-shadow: 0 10px 25px rgba(0,0,0,0.2) !important;
}
.countdown12 span.cdowns::before, .countdown12 span.cdowns::after {
	display: none !important; /* Hide the old trailing dots */
}
.countdown12 .font_awsom_numbers i {
	font-size: 45px !important;
	color: #fff !important;
	margin-bottom: 15px !important;
}
.countdown12 span.time-counts {
	font-size: 16px !important;
	font-weight: 600 !important;
	color: #fff !important;
	margin-bottom: 10px !important;
	text-align: center !important;
	text-transform: uppercase !important;
	letter-spacing: 1px !important;
}
.countdown12 .cdowns p {
	font-size: 36px !important;
	font-weight: bold !important;
	color: #FAB713 !important; /* Brand yellow/gold */
	margin: 0 !important;
}
@media (max-width: 991px) {
	.countdown12 span.cdowns {
		width: 150px !important; /* Slightly smaller cards on mobile to show more items */
		padding: 20px 10px !important;
	}
	.countdown12 .autob {
		gap: 15px !important;
	}
}

/* Custom arrows for countdown container */
.custom-slider-prev, .custom-slider-next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 40px;
	height: 40px;
	background-color: rgba(255, 255, 255, 0.2);
	color: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10;
	transition: all 0.3s ease;
	font-size: 18px;
}
.custom-slider-prev:hover, .custom-slider-next:hover {
	background-color: #FAB713;
}
.custom-slider-prev {
	left: 5px;
}
.custom-slider-next {
	right: 5px;
}
