/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/

:root {
	--cnvs-themecolor: #104C8C;
	--cnvs-themecolor-rgb: 36, 145, 235;
	--cnvs-secondary-color: #6986a8;
}

.bg-primary {
	background-color: var(--cnvs-themecolor) !important;
}

.bg-secondary {
	background-color: var(--cnvs-secondary-color) !important;
}

.text-shadow {
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}


.block-hero-8 .image-text {
	background: url("../images/blocks/preview/hero-8.jpg") center;
	background-size: contain;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	font-size: 44px;
	font-weight: 900;
}

@media (min-width: 992px) {
	.block-hero-8 .text-n-right {
		--offset: -15%;
		position: relative;
		z-index: 9;
		margin-left: var(--offset);
		-webkit-transform: translateX(var(--offset));
		transform: translateX(var(--offset));
		padding: 25px 30px;
		background-color: #FFF;
	}

	.block-hero-8 .image-text {
		font-size: 4.8vw;
	}
}

.list-group-item {
	position: absolute;
	top: 0;
	left: 0;
	background-color: #fff !important;
	color: #212529;
	border: 0;
	width: 100%;
	padding: 40px;
	margin: 0;
}

.list-group-item:nth-child(1) {
	z-index: 1;
}

.list-group-item .text-anim {
	transform: translateY(-20px);
	--text-anim-duration: .3s;
	transition-property: opacity, transform;
	transition-duration: var(--text-anim-duration);
	transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
	transition-delay: var(--text-anim-delay, 0s);
}

.list-group-item.active .text-anim {
	opacity: 1;
	transform: translateY(0px);
	background-color: #FFF;
}

.list-group-content>div {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/* WhatsApp BontĆƒÄ£n */
.float {
	position: fixed;
	width: 60px;
	height: 60px;
	bottom: 40px;
	left: 40px;
	background-color: #25d366;
	color: #FFF;
	border-radius: 50px;
	text-align: center;
	font-size: 30px;
	box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
	z-index: 10000000;
	transform: scale(1);
	animation: pulse 2s infinite;
}

.my-float {
	margin-top: 10px;
}

@keyframes pulse {
	0% {
		transform: scale(0.9);
		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
	}

	70% {
		transform: scale(1.2);
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}

	100% {
		transform: scale(0.9);
		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	}
}

@media screen and (max-width:991px) {

	.float {
		position: fixed;
		width: 60px;
		height: 60px;
		bottom: 50px;
		left: 20px;
		background-color: #25d366;
		color: #FFF;
		border-radius: 50px;
		text-align: center;
		font-size: 30px;
		box-shadow: 2px 2px 3px #999;
		z-index: 100;
	}

	.my-float {
		margin-top: 10px;
	}

}

/* Global Mobile Padding Improvements */
@media (max-width: 991px) {
	/* Ultra-aggressive selectors to ensure 30px padding on all containers, EXCLUDING the header */
	#wrapper #content .container,
	#wrapper #contact-section .container,
	#wrapper #footer .container,
	#wrapper #copyrights .container,
	#wrapper #slider .container,
	#wrapper .section .container,
	#wrapper .container-fluid:not(#header-wrap .container-fluid) {
		padding-left: 40px !important;
		padding-right: 40px !important;
	}

	/* Reset row margins and column gutters to ensure content starts exactly at the container's 30px padding edge */
	#wrapper .row,
	#wrapper .section .row,
	#footer .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
		--bs-gutter-x: 0 !important;
	}

	#wrapper .row > *,
	#wrapper .section .row > *,
	#footer .row > * {
		padding-left: 0 !important;
		padding-right: 0 !important;
		--bs-gutter-x: 0 !important;
	}

	/* Adjusting large gutters for mobile to prevent negative margin overlap */
	#wrapper .gutter-50, #wrapper .gutter-40, #wrapper .gutter-sm-50, #wrapper .gutter-sm-40,
	#wrapper .section.gutter-20 {
		--cnvs-custom-gutter: 0 !important;
	}
}

/* Fix Map Height: Absolute positioning to fill flex parent */
#contact-section .fluid-width-video-wrapper,
.map-col-flex .fluid-width-video-wrapper {
	padding-top: 0 !important;
	height: 100% !important;
	position: relative !important;
}

#contact-section iframe,
.map-col-flex iframe {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
}

/* Ensure map column fills height on desktop */
@media (min-width: 992px) {
	.map-col-flex {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
	}
	/* Force the nested div to take full height of the stretched flex column */
	.map-col-flex > div {
		flex: 1 1 auto !important;
		height: 100% !important;
	}
}