
	.footer-social {
		display: flex;
		gap: 12px;
		align-items: center;
	}


	.footer-social a {

		width: 40px;
		height: 40px;

		display: flex;
		align-items: center;
		justify-content: center;

		border-radius: 50%;

		background: #08213f;

		color: #fff;

		text-decoration: none !important;

		transition: all .3s ease;

	}


	.footer-social a i {
		font-size: 16px;
	}


	.footer-social a:hover {

		background: #ff9800;

		color: #fff;

		transform: translateY(-3px);

	}


	.footer-social a:hover i {
		color: #fff;
	}
</style>


	.cta-links li a {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		text-decoration: none;
		font-size: 14px;
		font-weight: 600;
		padding: 8px 16px;
		border-radius: 50px;
		transition: all .3s ease;
	}


	/* Call Icon */

	.cta-links li a .call {

		width: 28px;
		height: 28px;

		display: flex;
		align-items: center;
		justify-content: center;

		background: #0b1f3a;

		color: #fff;

		border-radius: 50%;

		font-size: 13px;

	}


	.cta-links li a:hover .call {

		background: #ff9800;

		transform: rotate(15deg);

	}



	/* WhatsApp Icon */

	.cta-links li a .whatsapp {

		width: 28px;
		height: 28px;

		display: flex;
		align-items: center;
		justify-content: center;

		background: #25D366;

		color: #fff;

		border-radius: 50%;

		font-size: 15px;

	}


	.cta-links li a:hover .whatsapp {

		background: #128C7E;

		transform: scale(1.1);

	}
</style>

	/* Quote Popup */

	.quote-modal-content {
		border-radius: 20px;
		overflow: hidden;
		border: none;
		box-shadow: 0 20px 50px rgba(0, 0, 0, .25);
		width: 70%;
		margin-left: 70px;
	}


	.quote-modal-header {
		background: linear-gradient(135deg, #ff6d12, #e65c00);
		padding: 20px 25px;
		border: none;
	}


	.quote-modal-header .modal-title {
		color: #fff;
		font-size: 22px;
		font-weight: 700;
	}


	.quote-modal-header .btn-close {
		filter: brightness(0) invert(1);
	}


	.quote-modal-body {
		padding: 25px;
		background: #fff;
	}


	.quote-popup-card {
		width: 100%;
	}


	.quote-popup-form {
		width: 100%;
	}


	.quote-popup-field {

		display: flex;
		align-items: center;
		gap: 12px;

		height: 42px;

		border: 1px solid #ddd;
		border-radius: 12px;

		padding: 0 15px;

		margin-bottom: 15px;

		transition: .3s;

	}


	.quote-popup-field:focus-within {

		border-color: #ff6d12;
		box-shadow: 0 0 8px rgba(255, 109, 18, .25);

	}


	.quote-popup-field i {

		color: #ff6d12;
		font-size: 16px;
		width: 20px;

	}


	.quote-popup-field input,
	.quote-popup-field select,
	.quote-popup-field textarea {

		width: 100%;
		height: 100%;

		border: none;
		outline: none;

		font-size: 15px;

		background: transparent;

	}


	.quote-popup-field select {

		cursor: pointer;

	}


	.quote-popup-textarea {

		height: 100px;
		align-items: flex-start;

	}


	.quote-popup-textarea i {

		margin-top: 15px;

	}


	.quote-popup-field textarea {

		padding-top: 15px;
		resize: none;

	}



	.quote-popup-btn {

		width: 100%;

		background: linear-gradient(135deg, #ff6d12, #e65c00);

		color: #fff;

		border: none;

		padding: 14px;

		border-radius: 12px;

		font-size: 16px;

		font-weight: 600;

		cursor: pointer;

		transition: .3s;

	}


	.quote-popup-btn:hover {

		background: linear-gradient(135deg, #e65c00, #ff6d12);

	}



	/* Mobile */

	@media(max-width:576px) {

		.quote-modal-body {
			padding: 18px;
		}


		.quote-modal-header .modal-title {
			font-size: 18px;
		}


		.quote-popup-field {
			height: 48px;
		}

	}
</style>

	/* Quote Popup Open Button */

	.quote-nav-button {
		display: flex;
		align-items: center;
	}


	.quote-open-btn {

		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 8px;

		padding: 10px 20px;

		background: linear-gradient(135deg, #ff6d12, #e65c00);

		color: #fff;

		font-size: 14px;

		font-weight: 600;

		text-decoration: none;

		border-radius: 8px;

		transition: .3s;

		cursor: pointer;

	}


	.quote-open-btn i {

		font-size: 15px;

	}


	.quote-open-btn:hover {

		background: linear-gradient(135deg, #e65c00, #ff6d12);

		color: #fff;

		transform: translateY(-2px);

	}


	/* Mobile */

	@media(max-width:576px) {

		.quote-open-btn {

			padding: 9px 15px;

			font-size: 13px;

		}

	}


	
		.video-image {
			overflow: hidden;
			border-radius: 18px;
		}

		.video-link {
			position: relative;
			display: block;
		}

		.video-play-btn {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			width: 70px;
			height: 70px;
			background: #ff7a00;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #fff;
			font-size: 24px;
			box-shadow: 0 10px 25px rgba(0, 0, 0, .25);
		}
	</style>
	</style>

	
		/* Orange Button */

		.btn-orange {

			display: inline-flex;
			align-items: center;
			justify-content: center;
			gap: 8px;

			padding: 12px 28px;

			background: linear-gradient(135deg, #ff9800, #ff6d00);

			color: #fff !important;

			border: 2px solid transparent;

			border-radius: 8px;

			font-size: 15px;

			font-weight: 600;

			text-decoration: none;

			cursor: pointer;

			transition: all .3s ease;

		}


		.btn-orange:hover {

			background: linear-gradient(135deg, #ff6d00, #ff9800);

			color: #fff !important;

			transform: translateY(-2px);

			box-shadow: 0 8px 20px rgba(255, 109, 0, .3);

		}


		.btn-orange i {

			font-size: 16px;

		}


		/* Small Button */

		.btn-orange.btn-sm {

			padding: 9px 18px;

			font-size: 14px;

		}


		/* Full Width Button */

		.btn-orange.btn-block {

			width: 100%;

		}


		/* Mobile */

		@media(max-width:576px) {

			.btn-orange {

				padding: 11px 22px;

				font-size: 14px;

			}

		}
	</style>
	
		/* Hero Action Buttons */

		.hero-actions {
			display: flex;
			align-items: center;
			gap: 15px;
			margin-top: 30px;
			flex-wrap: wrap;
		}


		.hero-actions .btn {

			display: inline-flex;
			align-items: center;
			justify-content: center;
			gap: 8px;

			padding: 13px 28px;

			border-radius: 8px;

			font-size: 15px;

			font-weight: 600;

			text-decoration: none;

			transition: all .3s ease;

		}


		/* Call Button */

		.hero-actions .btn-navy {

			background: #0b1f3a;

			color: #fff;

			border: 2px solid #0b1f3a;

		}


		.hero-actions .btn-navy:hover {

			background: #fff;

			color: #0b1f3a;

		}


		/* WhatsApp Button */

		.hero-actions .btn-green {

			background: #25D366;

			color: #fff;

			border: 2px solid #25D366;

		}


		.hero-actions .btn-green:hover {

			background: #fff;

			color: #25D366;

		}


		/* About Button */

		.hero-actions .btn-outline {

			background: #fff;

			color: #ff9800;

			border: 2px solid #ff9800 !important;

		}


		.hero-actions .btn-outline:hover {

			background: #ff9800 !important;

			color: #fff !important;

		}


		/* Button Icons */

		.hero-actions i {

			font-size: 16px;

		}


		/* Hero Slider Dots */

		.hero-dots {

			display: flex;

			align-items: center;

			gap: 10px;

			margin-top: 35px;

		}


		.hero-dots span {

			width: 10px;

			height: 10px;

			border-radius: 50%;

			background: rgba(255, 255, 255, .5);

			cursor: pointer;

			transition: .3s;

		}


		.hero-dots span.active {

			width: 30px;

			border-radius: 10px;

			background: #ff9800;

		}


		/* Mobile Responsive */

		@media(max-width:576px) {

			.hero-actions {

				gap: 10px;

				margin-top: 20px;

			}


			.hero-actions .btn {

				width: 100%;

				padding: 12px 20px;

			}


			.hero-dots {

				margin-top: 25px;

			}

		}
	</style>
	
		/* Hero Animation */

		.hero-copy {
			animation: slideLeft 1s ease forwards;
			opacity: 0;
		}


		.quote-card {
			animation: slideRight 1s ease forwards;
			opacity: 0;
			animation-delay: .3s;
		}


		/* Text Animation */

		.hero-copy .eyebrow {
			animation: fadeDown .8s ease forwards;
			opacity: 0;
		}


		.hero-copy h1 {
			animation: fadeUp 1s ease forwards;
			animation-delay: .2s;
			opacity: 0;
		}


		.hero-copy p {
			animation: fadeUp 1s ease forwards;
			animation-delay: .4s;
			opacity: 0;
		}


		.hero-features li {
			animation: fadeUp .8s ease forwards;
			opacity: 0;
		}


		/* Feature delay */

		.hero-features li:nth-child(1) {
			animation-delay: .5s;
		}

		.hero-features li:nth-child(2) {
			animation-delay: .6s;
		}

		.hero-features li:nth-child(3) {
			animation-delay: .7s;
		}

		.hero-features li:nth-child(4) {
			animation-delay: .8s;
		}



		.hero-actions {
			animation: fadeUp 1s ease forwards;
			animation-delay: .9s;
			opacity: 0;
		}


		/* Quote Card Animation */

		.quote-card-head {
			animation: fadeDown .8s ease forwards;
		}


		.field {
			animation: fadeUp .7s ease forwards;
		}


		.quote-form .field:nth-child(1) {
			animation-delay: .2s;
		}

		.quote-form .field:nth-child(2) {
			animation-delay: .3s;
		}

		.quote-form .field:nth-child(3) {
			animation-delay: .4s;
		}

		.quote-form .field:nth-child(4) {
			animation-delay: .5s;
		}

		.quote-form .field:nth-child(5) {
			animation-delay: .6s;
		}

		.quote-form .field:nth-child(6) {
			animation-delay: .7s;
		}

		.quote-form .field:nth-child(7) {
			animation-delay: .8s;
		}



		/* Button Hover Animation */

		.btn-orange {
			transition: all .3s ease;
		}


		.btn-orange:hover {

			transform: translateY(-4px);

			box-shadow: 0 10px 25px rgba(255, 152, 0, .35);

		}



		/* Floating Arrow */

		.hero-arrow {

			/* animation: bounce 1.5s infinite; */

		}



		/* Keyframes */


		@keyframes slideLeft {

			from {
				opacity: 0;
				transform: translateX(-80px);
			}

			to {
				opacity: 1;
				transform: translateX(0);
			}

		}



		@keyframes slideRight {

			from {
				opacity: 0;
				transform: translateX(80px);
			}

			to {
				opacity: 1;
				transform: translateX(0);
			}

		}



		@keyframes fadeUp {

			from {
				opacity: 0;
				transform: translateY(30px);
			}

			to {
				opacity: 1;
				transform: translateY(0);
			}

		}



		@keyframes fadeDown {

			from {
				opacity: 0;
				transform: translateY(-30px);
			}

			to {
				opacity: 1;
				transform: translateY(0);
			}

		}



		@keyframes bounce {

			0%,
			100% {
				transform: translateX(0);
			}

			50% {
				transform: translateX(10px);
			}

		}



		/* Mobile */

		@media(max-width:768px) {

			.hero-copy,
			.quote-card {

				animation: none;
				opacity: 1;

			}

		}
	</style>
	
		.hero {
			position: relative;
			overflow: hidden;
		}


		.hero-bg {
			position: absolute;
			inset: 0;
			opacity: 0;
			transition: opacity 1s ease-in-out;
			z-index: -1;
		}


		.hero-bg.active {
			opacity: 1;
		}
	</style>
	
		.hero {
			position: relative;
			overflow: hidden;
			min-height: 700px;
			display: flex;
			align-items: center;
		}

		.hero .container {
			position: relative;
			z-index: 10;
		}

		.hero-bg {
			position: absolute;
			inset: 0;
			background-size: cover !important;
			background-position: center !important;
			opacity: 0;
			visibility: hidden;
			transition: all .8s ease-in-out;
			transform: scale(1.08);
		}

		.hero-bg.active {
			opacity: 1;
			visibility: visible;
			transform: scale(1);
		}

		/* Navigation Buttons */

		.hero-nav {
			position: absolute;
			top: 50%;
			left: 0;
			width: 100%;
			transform: translateY(-50%);
			z-index: 20;
			pointer-events: none;
		}

		.hero-prev,
		.hero-next {
			pointer-events: auto;
			position: absolute;
			width: 52px;
			height: 52px;
			border: none;
			border-radius: 50%;
			background: rgba(255, 255, 255, .18);
			backdrop-filter: blur(8px);
			color: #fff;
			font-size: 20px;
			cursor: pointer;
			transition: .3s;
		}

		.hero-prev:hover,
		.hero-next:hover {
			background: #ff9800;
		}

		.hero-prev {
			left: 30px;
		}

		.hero-next {
			right: 30px;
		}

		/* Right Side Dots */

		.hero-dots {
			position: absolute;
			right: 35px;
			top: 50%;
			transform: translateY(-50%);
			display: flex;
			flex-direction: column;
			gap: 12px;
			z-index: 20;
		}

		.hero-dots span {
			width: 13px;
			height: 13px;
			border-radius: 50%;
			background: rgba(255, 255, 255, .4);
			cursor: pointer;
			transition: .3s;
		}

		.hero-dots span.active {
			background: #ff9800;
			transform: scale(1.4);
		}

		/* Mobile */

		@media(max-width:768px) {

			.hero {
				min-height: auto;
				padding: 60px 0;
			}

			.hero-prev,
			.hero-next {
				width: 42px;
				height: 42px;
				font-size: 16px;
			}

			.hero-prev {
				left: 10px;
			}

			.hero-next {
				right: 10px;
			}

			.hero-dots {
				right: 12px;
			}

		}
	