:root {
			--primary-color: #93d105;
			--primary-dark: #7bb004;
			--secondary-color: #333333;
			--light-color: #f8f9fa;
			--dark-color: #222222;
			--gray-color: #6c757d;
			--light-gray: #e9ecef;
			--border-radius: 8px;
			--box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
			--transition: all 0.3s ease;
		}

		* {
			margin: 0;
			padding: 0;
			box-sizing: border-box;
		}

		body {
			font-family: 'Poppins', sans-serif;
			line-height: 1.6;
			color: var(--secondary-color);
			background-color: #fff;
			overflow-x: hidden;
		}

		h1,
		h2,
		h3,
		h4,
		h5 {
			font-family: 'Montserrat', sans-serif;
			font-weight: 700;
			line-height: 1.3;
			margin-bottom: 1rem;
		}

		.container {
			width: 100%;
			max-width: 1200px;
			margin: 0 auto;
			padding: 0 20px;
		}

		.btn {
			display: inline-block;
			background-color: var(--primary-color);
			color: white;
			padding: 12px 28px;
			border-radius: var(--border-radius);
			text-decoration: none;
			font-weight: 600;
			border: none;
			cursor: pointer;
			transition: var(--transition);
			font-size: 1rem;
			text-align: center;
		}

		.btn:hover {
			background-color: var(--primary-dark);
			transform: translateY(-3px);
			box-shadow: var(--box-shadow);
		}

		.btn-secondary {
			background-color: var(--secondary-color);
			color: white;
		}

		.btn-secondary:hover {
			background-color: var(--dark-color);
		}

		.section-title {
			text-align: center;
			font-size: 2.5rem;
			margin-bottom: 3rem;
			position: relative;
		}

		.section-title::after {
			content: '';
			position: absolute;
			width: 80px;
			height: 4px;
			background-color: var(--primary-color);
			bottom: -10px;
			left: 50%;
			transform: translateX(-50%);
		}

		/* Navbar Styles */
		.navbar {
			background-color: white;
			box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			z-index: 1000;
			padding: 15px 0;
		}

		.navbar .container {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.logo {
			display: flex;
			align-items: center;
			text-decoration: none;
		}

		.logo-icon {
			color: var(--primary-color);
			font-size: 2.2rem;
			margin-right: 10px;
		}

		.logo-text {
			font-family: 'Montserrat', sans-serif;
			font-weight: 900;
			font-size: 1.8rem;
			color: var(--dark-color);
		}

		.logo-text span {
			color: var(--primary-color);
		}

		.nav-links {
			display: flex;
			list-style: none;
		}

		.nav-links li {
			margin-left: 30px;
		}

		.nav-links a {
			text-decoration: none;
			color: var(--dark-color);
			font-weight: 600;
			font-size: 1.05rem;
			transition: var(--transition);
			position: relative;
			padding: 5px 0;
		}

		.nav-links a:hover {
			color: var(--primary-color);
		}

		.nav-links a::after {
			content: '';
			position: absolute;
			width: 0;
			height: 3px;
			background-color: var(--primary-color);
			bottom: 0;
			left: 0;
			transition: var(--transition);
		}

		.nav-links a:hover::after {
			width: 100%;
		}

		.mobile-menu-btn {
			display: none;
			background: none;
			border: none;
			font-size: 1.5rem;
			color: var(--dark-color);
			cursor: pointer;
		}

		
		/* Services Section */
		.services {
			padding: 100px 0;
		}

		.services-grid {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 30px;
			margin-bottom: 60px;
		}

		.service-item {
			background-color: white;
			border-radius: var(--border-radius);
			padding: 30px;
			box-shadow: var(--box-shadow);
			transition: var(--transition);
			border-top: 4px solid var(--primary-color);
		}

		.service-item:hover {
			transform: translateY(-10px);
			box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
		}

		.service-icon {
			font-size: 2.5rem;
			color: var(--primary-color);
			margin-bottom: 20px;
		}

		.service-item h3 {
			font-size: 1.5rem;
			margin-bottom: 15px;
		}

		/* Detailed Services Section */
		.detailed-services {
			padding: 80px 0;
			background-color: var(--light-color);
		}

		.detailed-services-grid {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 40px;
		}

		.detailed-service {
			background-color: white;
			border-radius: var(--border-radius);
			padding: 40px;
			box-shadow: var(--box-shadow);
		}

		.detailed-service h3 {
			color: var(--primary-color);
			font-size: 1.8rem;
			margin-bottom: 20px;
			display: flex;
			align-items: center;
		}

		.detailed-service h3 i {
			margin-right: 15px;
		}

		/* Service Areas Section */
		.service-areas {
			padding: 100px 0;
		}

		.areas-container {
			max-height: 400px;
			overflow-y: auto;
			padding: 20px;
			background-color: white;
			border-radius: var(--border-radius);
			box-shadow: var(--box-shadow);
		}

		.areas-grid {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			gap: 15px;
		}

		.area-item {
			padding: 12px 15px;
			background-color: var(--light-gray);
			border-radius: var(--border-radius);
			transition: var(--transition);
			font-weight: 500;
		}

		.area-item:hover {
			background-color: var(--primary-color);
			color: white;
			transform: translateX(5px);
		}

		.area-item.highlight {
			background-color: var(--primary-color);
			color: white;
			font-weight: 600;
		}

		/* FAQ Section */
		.faq {
			padding: 100px 0;
			background-color: var(--light-color);
		}

		.faq .container {
			display: flex;
			align-items: flex-start;
			gap: 50px;
		}

		.faq-content {
			flex: 1;
		}

		.faq-list {
			flex: 1;
		}

		.faq-item {
			margin-bottom: 20px;
			background-color: white;
			border-radius: var(--border-radius);
			overflow: hidden;
			box-shadow: var(--box-shadow);
		}

		.faq-question {
			padding: 20px;
			font-weight: 600;
			font-size: 1.1rem;
			cursor: pointer;
			display: flex;
			justify-content: space-between;
			align-items: center;
			background-color: white;
		}

		.faq-question i {
			color: var(--primary-color);
			transition: var(--transition);
		}

		.faq-question.active i {
			transform: rotate(180deg);
		}

		.faq-answer {
			padding: 0 20px;
			max-height: 0;
			overflow: hidden;
			transition: var(--transition);
		}

		.faq-answer.open {
			padding: 0 20px 20px;
			max-height: 300px;
		}

		/* Contact Section */
		.contact {
			padding: 100px 0;
		}

		.contact .container {
			display: flex;
			gap: 50px;
		}

		.contact-info {
			flex: 1;
		}

		.contact-map {
			flex: 1;
			border-radius: var(--border-radius);
			overflow: hidden;
			box-shadow: var(--box-shadow);
		}

		.contact-map iframe {
			width: 100%;
			height: 100%;
			min-height: 400px;
			border: none;
		}

		.contact-item {
			display: flex;
			align-items: flex-start;
			margin-bottom: 30px;
		}

		.contact-icon {
			background-color: var(--primary-color);
			color: white;
			width: 50px;
			height: 50px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 1.2rem;
			margin-right: 15px;
			flex-shrink: 0;
		}

		/* Footer */
		.footer {
			background-color: var(--dark-color);
			color: white;
			padding: 70px 0 30px;
		}

		.footer-content {
			display: flex;
			justify-content: space-between;
			margin-bottom: 50px;
		}

		.footer-logo {
			flex: 1;
		}

		.footer-logo .logo-text {
			color: white;
		}

		.footer-contact {
			flex: 1;
		}

		.footer-contact h3 {
			color: var(--primary-color);
			margin-bottom: 20px;
		}

		.footer-contact p {
			margin-bottom: 10px;
			display: flex;
			align-items: center;
		}

		.footer-contact p i {
			margin-right: 10px;
			color: var(--primary-color);
		}

		.footer-bottom {
			text-align: center;
			padding-top: 30px;
			border-top: 1px solid rgba(255, 255, 255, 0.1);
		}

		/* Responsive Design */
		@media (max-width: 992px) {

			.header .container,
			.about .container,
			.faq .container,
			.contact .container {
				flex-direction: column;
			}

			.header-content,
			.about-content {
				padding-right: 0;
				margin-bottom: 50px;
			}

			.header h1 {
				font-size: 2.8rem;
			}

			.services-grid {
				grid-template-columns: repeat(2, 1fr);
			}

			.areas-grid {
				grid-template-columns: repeat(2, 1fr);
			}
		}

		@media (max-width: 768px) {
			.navbar .container {
				padding: 0 15px;
			}

			.nav-links {
				position: fixed;
				top: 70px;
				left: 0;
				width: 100%;
				background-color: white;
				flex-direction: column;
				align-items: center;
				padding: 20px 0;
				box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
				transform: translateY(-100%);
				opacity: 0;
				transition: var(--transition);
				z-index: 999;
			}

			.nav-links.active {
				transform: translateY(0);
				opacity: 1;
			}

			.nav-links li {
				margin: 15px 0;
			}

			.mobile-menu-btn {
				display: block;
			}

			.header {
				padding: 130px 0 60px;
			}

			.header h1 {
				font-size: 2.3rem;
			}

			.services-grid {
				grid-template-columns: 1fr;
			}

			.detailed-services-grid {
				grid-template-columns: 1fr;
			}

			.areas-grid {
				grid-template-columns: 1fr;
			}

			.footer-content {
				flex-direction: column;
			}

			.footer-logo,
			.footer-contact {
				margin-bottom: 30px;
			}
		}





		.header {
			background: linear-gradient(135deg, #1a2a3a 0%, #2d3e50 100%);
			color: white;
			padding: 90px 0;
			overflow: hidden;
			position: relative;
		}

		.container {
			max-width: 1200px;
			margin: 0 auto;
			padding: 0 20px;
			display: flex;
			align-items: center;
			justify-content: space-between;
			flex-wrap: wrap;
		}

		.header-content {
			flex: 1;
			min-width: 300px;
			max-width: 600px;
			padding-right: 40px;
			z-index: 2;
		}

		.header-content h1 {
			font-size: 3.2rem;
			line-height: 1.2;
			margin-bottom: 25px;
			font-weight: 800;
		}

		.header-content h1 span {
			color: #93d105;
			position: relative;
		}

		.header-content h1 span::after {
			content: '';
			position: absolute;
			bottom: 5px;
			left: 0;
			width: 100%;
			height: 4px;
			background: rgba(248, 183, 57, 0.3);
			border-radius: 2px;
		}

		.header-content p {
			font-size: 1.2rem;
			line-height: 1.6;
			margin-bottom: 35px;
			color: #e0e6ed;
		}

		.featured-badge {
			display: inline-flex;
			align-items: center;
			background: linear-gradient(to right, #ffe599, #ffd54f);
			color: #6d4c06;
			font-weight: 700;
			padding: 10px 18px;
			border-radius: 12px;
			font-size: 1.1rem;
			margin: 15px 0 25px;
			box-shadow: 0 4px 12px rgba(255, 213, 79, 0.3);
			border: 2px solid #ffca28;
		}

		.featured-badge span {
			color: #d6861e;
			margin-left: 5px;
		}

		.featured-badge i {
			margin-right: 8px;
			font-size: 1.2rem;
		}

		.btn {
			display: inline-block;
			background: linear-gradient(to right, #93d105, #ff9800);
			color: #1a2a3a;
			padding: 16px 32px;
			border-radius: 50px;
			font-weight: 700;
			font-size: 1.1rem;
			text-decoration: none;
			transition: all 0.3s ease;
			box-shadow: 0 6px 15px rgba(248, 183, 57, 0.3);
			border: none;
			cursor: pointer;
			margin-right: 15px;
			margin-bottom: 15px;
		}

		.btn:hover {
			transform: translateY(-5px);
			box-shadow: 0 10px 20px rgba(248, 183, 57, 0.4);
			background: linear-gradient(to right, #ffc107, #ff9800);
		}

		.btn-secondary {
			background: transparent;
			color: white;
			border: 2px solid #93d105;
			box-shadow: none;
		}

		.btn-secondary:hover {
			background: rgba(248, 183, 57, 0.1);
			transform: translateY(-5px);
			box-shadow: 0 5px 15px rgba(248, 183, 57, 0.2);
		}

		.header-image {
			flex: 1;
			min-width: 300px;
			position: relative;
			z-index: 1;
		}

		.header-image img {
			width: 100%;
			height: auto;
			border-radius: 20px;
			box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
			transform: perspective(1000px) rotateY(-10deg);
			transition: transform 0.5s ease;
			border: 8px solid #2d3e50;
		}

		.header-image:hover img {
			transform: perspective(1000px) rotateY(0deg);
		}

		.cta-boxes {
			position: absolute;
			bottom: -30px;
			right: 20px;
			display: flex;
			gap: 20px;
			z-index: 3;
		}

		.cta-box {
			background: white;
			padding: 20px;
			border-radius: 15px;
			box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
			width: 180px;
			text-align: center;
			transition: all 0.3s ease;
		}

		.cta-box:hover {
			transform: translateY(-10px);
			box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
		}

		.cta-box i {
			font-size: 2.2rem;
			color: #93d105;
			margin-bottom: 10px;
		}

		.cta-box h4 {
			color: #1a2a3a;
			font-size: 1.1rem;
			margin-bottom: 5px;
		}

		.cta-box p {
			color: #666;
			font-size: 0.9rem;
			line-height: 1.4;
		}

		.guarantee-badge {
			position: absolute;
			top: 20px;
			left: -10px;
			background: linear-gradient(45deg, #4CAF50, #8BC34A);
			color: white;
			padding: 10px 20px;
			border-radius: 0 20px 20px 0;
			font-weight: 700;
			box-shadow: 0 5px 15px rgba(76, 175, 80, 0.3);
			z-index: 2;
		}

		.guarantee-badge i {
			margin-right: 8px;
		}

		@media (max-width: 992px) {
			.container {
				flex-direction: column;
				text-align: center;
			}

			.header-content {
				padding-right: 0;
				margin-bottom: 50px;
			}

			.header-content h1 {
				font-size: 2.5rem;
			}

			.cta-boxes {
				position: relative;
				bottom: auto;
				right: auto;
				justify-content: center;
				margin-top: 40px;
				flex-wrap: wrap;
			}

			.header-image img {
				transform: perspective(1000px) rotateY(0deg);
			}
		}

		@media (max-width: 576px) {
			.header {
				padding: 40px 0 60px;
			}

			.header-content h1 {
				font-size: 2rem;
			}

			.btn {
				padding: 14px 24px;
				font-size: 1rem;
				margin-right: 10px;
			}

			.cta-box {
				width: 100%;
				max-width: 250px;
			}
		}



      
		.about-section {
			padding: 100px 0;
			background: linear-gradient(to bottom, #ffffff 0%, #f8f9fa 100%);
			position: relative;
			overflow: hidden;
		}

		.container {
			max-width: 1200px;
			margin: 0 auto;
			padding: 0 20px;
		}

		.section-header {
			text-align: center;
			margin-bottom: 60px;
		}

		.section-subtitle {
			color: #93d105;
			font-size: 1.1rem;
			font-weight: 600;
			letter-spacing: 2px;
			text-transform: uppercase;
			margin-bottom: 15px;
			display: block;
		}

		.section-title {
			font-size: 2.8rem;
			color: #1a2a3a;
			margin-bottom: 20px;
			position: relative;
			display: inline-block;
		}

		.section-title:after {
			content: '';
			position: absolute;
			bottom: -10px;
			left: 50%;
			transform: translateX(-50%);
			width: 80px;
			height: 4px;
			background: linear-gradient(to right, #93d105, #93d105);
			border-radius: 2px;
		}

		.section-description {
			color: #666;
			font-size: 1.2rem;
			max-width: 700px;
			margin: 0 auto;
			line-height: 1.6;
		}

		.about-content {
			display: flex;
			align-items: center;
			justify-content: space-between;
			flex-wrap: wrap;
			margin-bottom: 80px;
			gap: 50px;
		}

		.about-image {
			flex: 1;
			min-width: 300px;
			position: relative;
		}

		.image-main {
			width: 100%;
			height: 500px;
			border-radius: 20px;
			object-fit: cover;
			box-shadow: 0 25px 50px rgba(0, 0, 0, 0.1);
			border: 8px solid white;
		}

		.experience-badge {
			position: absolute;
			bottom: -30px;
			right: -30px;
			background: linear-gradient(45deg, #1a2a3a, #2d3e50);
			color: white;
			padding: 25px;
			border-radius: 50%;
			width: 150px;
			height: 150px;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			text-align: center;
			box-shadow: 0 15px 30px rgba(26, 42, 58, 0.3);
			z-index: 2;
		}

		.experience-years {
			font-size: 2.8rem;
			font-weight: 800;
			line-height: 1;
			color: #93d105;
		}

		.experience-text {
			font-size: 1rem;
			font-weight: 600;
			margin-top: 5px;
		}

		.about-text {
			flex: 1;
			min-width: 300px;
		}

		.about-text h3 {
			font-size: 2.2rem;
			color: #1a2a3a;
			margin-bottom: 25px;
			line-height: 1.3;
		}

		.about-text h3 span {
			color: #93d105;
		}

		.about-text p {
			color: #555;
			line-height: 1.8;
			margin-bottom: 20px;
			font-size: 1.1rem;
		}

		.highlight-box {
			background: linear-gradient(to right, rgba(248, 183, 57, 0.1), rgba(255, 152, 0, 0.05));
			border-left: 4px solid #93d105;
			padding: 25px;
			border-radius: 0 10px 10px 0;
			margin: 30px 0;
		}

		.highlight-box p {
			font-style: italic;
			color: #1a2a3a;
			font-weight: 500;
			margin: 0;
			font-size: 1.2rem;
		}

		.about-features {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
			gap: 30px;
			margin-top: 40px;
		}

		.feature-item {
			display: flex;
			align-items: flex-start;
			gap: 15px;
		}

		.feature-icon {
			background: linear-gradient(135deg, #93d105, #93d105);
			color: white;
			width: 60px;
			height: 60px;
			border-radius: 12px;
			display: flex;
			align-items: center;
			justify-content: center;
			flex-shrink: 0;
			font-size: 1.5rem;
			box-shadow: 0 8px 16px rgba(248, 183, 57, 0.2);
		}

		.feature-content h4 {
			font-size: 1.3rem;
			color: #1a2a3a;
			margin-bottom: 8px;
		}

		.feature-content p {
			color: #666;
			font-size: 1rem;
			line-height: 1.6;
			margin: 0;
		}

		/* Mission & Values Section */
		.mission-section {
			background: linear-gradient(135deg, #1a2a3a 0%, #2d3e50 100%);
			padding: 80px 0;
			border-radius: 30px;
			margin-top: 50px;
			color: white;
			position: relative;
			overflow: hidden;
		}

		.mission-container {
			display: flex;
			align-items: center;
			justify-content: space-between;
			flex-wrap: wrap;
			gap: 50px;
		}

		.mission-text {
			flex: 1;
			min-width: 300px;
		}

		.mission-text h3 {
			font-size: 2.2rem;
			margin-bottom: 25px;
			color: white;
		}

		.mission-text h3 span {
			color: #93d105;
		}

		.mission-text p {
			color: #e0e6ed;
			line-height: 1.8;
			margin-bottom: 20px;
			font-size: 1.1rem;
		}

		.values-grid {
			flex: 1;
			min-width: 300px;
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
			gap: 25px;
		}

		.value-card {
			background: rgba(255, 255, 255, 0.1);
			backdrop-filter: blur(10px);
			border-radius: 15px;
			padding: 25px;
			text-align: center;
			transition: transform 0.3s ease;
			border: 1px solid rgba(255, 255, 255, 0.1);
		}

		.value-card:hover {
			transform: translateY(-10px);
			background: rgba(255, 255, 255, 0.15);
		}

		.value-card i {
			font-size: 2.5rem;
			color: #93d105;
			margin-bottom: 15px;
		}

		.value-card h4 {
			font-size: 1.3rem;
			margin-bottom: 10px;
			color: white;
		}

		.value-card p {
			color: #d0d7e2;
			font-size: 0.95rem;
			line-height: 1.6;
			margin: 0;
		}

		/* CTA Section */
		.cta-section {
			text-align: center;
			margin-top: 80px;
			padding: 50px;
			background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
			border-radius: 20px;
			position: relative;
			overflow: hidden;
		}

		.cta-section h3 {
			font-size: 2.2rem;
			color: #1a2a3a;
			margin-bottom: 20px;
		}

		.cta-section p {
			color: #666;
			font-size: 1.2rem;
			max-width: 700px;
			margin: 0 auto 30px;
			line-height: 1.6;
		}

		.cta-btn {
			display: inline-block;
			background: linear-gradient(to right, #93d105, #93d105);
			color: #1a2a3a;
			padding: 18px 40px;
			border-radius: 50px;
			font-weight: 700;
			font-size: 1.2rem;
			text-decoration: none;
			transition: all 0.3s ease;
			box-shadow: 0 10px 25px rgba(248, 183, 57, 0.3);
			border: none;
			cursor: pointer;
		}

		.cta-btn:hover {
			transform: translateY(-5px);
			box-shadow: 0 15px 30px rgba(248, 183, 57, 0.4);
			background: linear-gradient(to right, #93d105, #93d105);
		}

		/* Responsive Design */
		@media (max-width: 992px) {

			.about-content,
			.mission-container {
				flex-direction: column;
			}

			.about-image,
			.about-text,
			.mission-text,
			.values-grid {
				width: 100%;
			}

			.experience-badge {
				right: 20px;
				bottom: -40px;
			}

			.section-title {
				font-size: 2.3rem;
			}
		}

		@media (max-width: 768px) {
			.about-section {
				padding: 60px 0;
			}

			.section-title {
				font-size: 2rem;
			}

			.about-text h3 {
				font-size: 1.8rem;
			}

			.experience-badge {
				position: relative;
				bottom: auto;
				right: auto;
				margin: -40px auto 30px;
				width: 130px;
				height: 130px;
			}

			.experience-years {
				font-size: 2.3rem;
			}

			.mission-section {
				padding: 50px 20px;
				border-radius: 20px;
			}

			.cta-section {
				padding: 40px 20px;
			}
		}

		@media (max-width: 480px) {
			.section-title {
				font-size: 1.8rem;
			}

			.about-text h3 {
				font-size: 1.6rem;
			}

			.feature-item {
				flex-direction: column;
				text-align: center;
				align-items: center;
			}

			.cta-btn {
				padding: 15px 30px;
				font-size: 1.1rem;
			}
		}



        
	

    .services-section {
        padding: 100px 0;
        background: linear-gradient(to bottom, #ffffff 0%, #f8f9fa 100%);
        position: relative;
    }

    .container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 20px;
    }

    .section-header {
        text-align: center;
        margin-bottom: 80px;
    }

    .section-subtitle {
        color: #93d105;
        font-size: 1.1rem;
        font-weight: 600;
        letter-spacing: 2px;
        text-transform: uppercase;
        margin-bottom: 15px;
        display: block;
    }

    .section-title {
        font-size: 2.8rem;
        color: #1a2a3a;
        margin-bottom: 20px;
        position: relative;
        display: inline-block;
    }

    .section-title:after {
        content: '';
        position: absolute;
        bottom: -10px;
        left: 50%;
        transform: translateX(-50%);
        width: 80px;
        height: 4px;
        background: linear-gradient(to right, #93d105, #93d105);
        border-radius: 2px;
    }

    .section-description {
        color: #666;
        font-size: 1.2rem;
        max-width: 800px;
        margin: 0 auto;
        line-height: 1.6;
    }

    /* Service Card Layout */
    .service-card {
        display: flex;
        align-items: center;
        background: white;
        border-radius: 20px;
        overflow: hidden;
        margin-bottom: 60px;
        box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
        transition: transform 0.4s ease, box-shadow 0.4s ease;
    }

    .service-card:hover {
        transform: translateY(-10px);
        box-shadow: 0 25px 60px rgba(0, 0, 0, 0.12);
    }

    .service-image {
        flex: 1;
        min-width: 300px;
        position: relative;
        overflow: hidden;
    }

    .service-image img {
        width: 100%;
        height: 400px;
        object-fit: cover;
        transition: transform 0.5s ease;
    }

    .service-card:hover .service-image img {
        transform: scale(1.05);
    }

    .service-badge {
        position: absolute;
        top: 20px;
        left: 20px;
        background: linear-gradient(to right, #93d105, #93d105);
        color: #1a2a3a;
        padding: 8px 20px;
        border-radius: 30px;
        font-weight: 700;
        font-size: 0.9rem;
        box-shadow: 0 5px 15px rgba(248, 183, 57, 0.3);
        z-index: 2;
    }

    .service-content {
        flex: 1.2;
        padding: 40px;
        min-width: 300px;
    }

    .service-icon {
        width: 70px;
        height: 70px;
        background: linear-gradient(135deg, rgba(248, 183, 57, 0.1), rgba(255, 152, 0, 0.05));
        border-radius: 15px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 25px;
    }

    .service-icon i {
        font-size: 2rem;
        color: #93d105;
    }

    .service-content h3 {
        font-size: 2rem;
        color: #1a2a3a;
        margin-bottom: 15px;
        line-height: 1.3;
    }

    .service-content p {
        color: #666;
        line-height: 1.7;
        margin-bottom: 25px;
        font-size: 1.1rem;
    }

    .service-features {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
        margin: 25px 0;
    }

    .feature-item {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .feature-item i {
        color: #93d105;
        font-size: 1.1rem;
    }

    .feature-item span {
        color: #555;
        font-weight: 500;
    }

    .service-cta {
        margin-top: 30px;
    }

    .service-btn {
        display: inline-block;
        background: linear-gradient(to right, #93d105, #93d105);
        color: #1a2a3a;
        padding: 14px 28px;
        border-radius: 50px;
        font-weight: 700;
        font-size: 1rem;
        text-decoration: none;
        transition: all 0.3s ease;
        box-shadow: 0 6px 15px rgba(248, 183, 57, 0.2);
        border: none;
        cursor: pointer;
    }

    .service-btn:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 20px rgba(248, 183, 57, 0.3);
        background: linear-gradient(to right, #ffc107, #93d105);
    }

    /* Alternate Layout */
    .service-card:nth-child(even) {
        flex-direction: row-reverse;
    }

    /* Service Areas Section */
    .areas-section {
        background: linear-gradient(135deg, #1a2a3a 0%, #2d3e50 100%);
        padding: 80px 0;
        border-radius: 30px;
        margin-top: 80px;
        color: white;
        text-align: center;
    }

    .areas-title {
        font-size: 2.5rem;
        margin-bottom: 20px;
        color: white;
    }

    .areas-title span {
        color: #93d105;
    }

    .areas-description {
        color: #e0e6ed;
        font-size: 1.2rem;
        max-width: 800px;
        margin: 0 auto 40px;
        line-height: 1.6;
    }

    .areas-container {
        max-width: 1000px;
        margin: 0 auto;
    }

    .areas-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 20px;
        margin-bottom: 40px;
    }

    .area-item {
        background: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(10px);
        border-radius: 15px;
        padding: 20px;
        text-align: center;
        transition: all 0.3s ease;
        border: 1px solid rgba(255, 255, 255, 0.1);
    }

    .area-item:hover {
        transform: translateY(-5px);
        background: rgba(255, 255, 255, 0.15);
        border-color: rgba(248, 183, 57, 0.3);
    }

    .area-item i {
        font-size: 1.5rem;
        color: #93d105;
        margin-bottom: 10px;
    }

    .area-item h4 {
        font-size: 1.2rem;
        color: white;
    }

    .counties-section {
        margin-top: 50px;
    }

    .counties-title {
        font-size: 1.8rem;
        margin-bottom: 25px;
        color: #93d105;
    }

    .counties-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        gap: 15px;
    }

    .county-item {
        background: rgba(255, 255, 255, 0.05);
        padding: 12px;
        border-radius: 10px;
        font-weight: 500;
    }

    /* Emergency Banner */
    .emergency-banner {
        background: linear-gradient(135deg, #ff6b6b 0%, #ff5252 100%);
        color: white;
        padding: 25px;
        border-radius: 15px;
        margin: 60px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 20px;
        box-shadow: 0 15px 30px rgba(255, 107, 107, 0.2);
    }

    .emergency-content {
        flex: 1;
        min-width: 300px;
    }

    .emergency-content h3 {
        font-size: 1.8rem;
        margin-bottom: 10px;
    }

    .emergency-content p {
        font-size: 1.1rem;
        opacity: 0.9;
    }

    .emergency-btn {
        background: white;
        color: #ff5252;
        padding: 16px 35px;
        border-radius: 50px;
        font-weight: 700;
        font-size: 1.1rem;
        text-decoration: none;
        transition: all 0.3s ease;
        box-shadow: 0 8px 20px rgba(255, 255, 255, 0.2);
    }

    .emergency-btn:hover {
        transform: translateY(-3px);
        box-shadow: 0 12px 25px rgba(255, 255, 255, 0.3);
        background: #f8f9fa;
    }

    /* Responsive Design */
    @media (max-width: 992px) {
        .service-card {
            flex-direction: column !important;
        }

        .service-image,
        .service-content {
            width: 100%;
        }

        .service-image {
            height: 300px;
        }

        .service-image img {
            height: 300px;
        }

        .section-title {
            font-size: 2.3rem;
        }

        .areas-grid {
            grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        }
    }

    @media (max-width: 768px) {
        .services-section {
            padding: 60px 0;
        }

        .section-title {
            font-size: 2rem;
        }

        .service-content h3 {
            font-size: 1.7rem;
        }

        .service-features {
            grid-template-columns: 1fr;
        }

        .areas-title {
            font-size: 2rem;
        }

        .emergency-banner {
            text-align: center;
            justify-content: center;
        }
    }

    @media (max-width: 480px) {
        .section-title {
            font-size: 1.8rem;
        }

        .service-content {
            padding: 25px;
        }

        .service-btn,
        .emergency-btn {
            padding: 12px 25px;
            font-size: 1rem;
        }

        .areas-grid {
            grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
        }
    }



    
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        font-family: 'Segoe UI', system-ui, sans-serif;
    }

    body {
        background-color: #f8f9fa;
    }

    .service-areas-section {
        padding: 100px 0;
        background: linear-gradient(to bottom, #ffffff 0%, #f8f9fa 100%);
        position: relative;
    }

    .container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 20px;
    }

    .section-header {
        text-align: center;
        margin-bottom: 60px;
    }

    .section-subtitle {
        color: #93d105;
        font-size: 1.1rem;
        font-weight: 600;
        letter-spacing: 2px;
        text-transform: uppercase;
        margin-bottom: 15px;
        display: block;
    }

    .section-title {
        font-size: 2.8rem;
        color: #1a2a3a;
        margin-bottom: 20px;
        position: relative;
        display: inline-block;
    }

    .section-title:after {
        content: '';
        position: absolute;
        bottom: -10px;
        left: 50%;
        transform: translateX(-50%);
        width: 80px;
        height: 4px;
        background: linear-gradient(to right, #93d105, #93d105);
        border-radius: 2px;
    }

    .section-description {
        color: #666;
        font-size: 1.2rem;
        max-width: 800px;
        margin: 0 auto;
        line-height: 1.6;
    }

    /* Hero Map Section */
    .map-hero {
        display: flex;
        align-items: center;
        background: white;
        border-radius: 20px;
        overflow: hidden;
        margin-bottom: 60px;
        box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
    }

    .map-visual {
        flex: 1;
        min-width: 300px;
        height: 450px;
        background: linear-gradient(135deg, #2d3e50, #1a2a3a);
        position: relative;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .map-center {
        position: relative;
        width: 200px;
        height: 200px;
    }

    .center-city {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 80px;
        height: 80px;
        background: linear-gradient(135deg, #93d105, #93d105);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #1a2a3a;
        font-weight: 800;
        font-size: 1.2rem;
        box-shadow: 0 0 0 15px rgba(248, 183, 57, 0.2);
        z-index: 3;
    }

    .surrounding-city {
        position: absolute;
        width: 60px;
        height: 60px;
        background: rgba(255, 255, 255, 0.9);
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 600;
        font-size: 0.9rem;
        color: #1a2a3a;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        transition: all 0.3s ease;
    }

    .surrounding-city:hover {
        transform: scale(1.2);
        background: white;
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    }

    .city-1 {
        top: 10%;
        left: 20%;
    }

    .city-2 {
        top: 15%;
        left: 70%;
    }

    .city-3 {
        top: 40%;
        left: 85%;
    }

    .city-4 {
        top: 70%;
        left: 75%;
    }

    .city-5 {
        top: 85%;
        left: 40%;
    }

    .city-6 {
        top: 65%;
        left: 15%;
    }

    .city-7 {
        top: 35%;
        left: 10%;
    }

    .map-info {
        flex: 1;
        min-width: 300px;
        padding: 40px;
    }

    .map-info h3 {
        font-size: 2rem;
        color: #1a2a3a;
        margin-bottom: 15px;
    }

    .map-info h3 span {
        color: #93d105;
    }

    .map-info p {
        color: #666;
        line-height: 1.7;
        margin-bottom: 25px;
        font-size: 1.1rem;
    }

    .coverage-badge {
        display: inline-flex;
        align-items: center;
        background: linear-gradient(to right, rgba(248, 183, 57, 0.1), rgba(255, 152, 0, 0.05));
        color: #1a2a3a;
        padding: 12px 25px;
        border-radius: 50px;
        font-weight: 600;
        margin-bottom: 25px;
        border: 2px solid rgba(248, 183, 57, 0.3);
    }

    .coverage-badge i {
        color: #93d105;
        margin-right: 10px;
        font-size: 1.2rem;
    }

    /* Cities Grid Section */
    .cities-section {
        margin-bottom: 60px;
    }

    .cities-title {
        text-align: center;
        font-size: 2rem;
        color: #1a2a3a;
        margin-bottom: 40px;
    }

    .cities-title span {
        color: #93d105;
    }

    .cities-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
        gap: 20px;
    }

    .city-card {
        background: white;
        border-radius: 15px;
        padding: 25px;
        text-align: center;
        transition: all 0.3s ease;
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
        border: 2px solid transparent;
        position: relative;
        overflow: hidden;
    }

    .city-card:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 5px;
        background: linear-gradient(to right, #93d105, #93d105);
    }

    .city-card:hover {
        transform: translateY(-10px);
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        border-color: rgba(248, 183, 57, 0.3);
    }

    .city-card i {
        font-size: 2rem;
        color: #93d105;
        margin-bottom: 15px;
    }

    .city-card h4 {
        font-size: 1.3rem;
        color: #1a2a3a;
        margin-bottom: 10px;
    }

    .city-card p {
        color: #666;
        font-size: 0.95rem;
        line-height: 1.5;
    }

    .primary-city {
        background: linear-gradient(135deg, rgba(248, 183, 57, 0.05), rgba(255, 152, 0, 0.02));
        border: 2px solid rgba(248, 183, 57, 0.2);
    }

    /* Counties Section */
    .counties-section {
        background: linear-gradient(135deg, #1a2a3a 0%, #2d3e50 100%);
        padding: 60px;
        border-radius: 20px;
        margin-bottom: 60px;
        color: white;
    }

    .counties-title {
        text-align: center;
        font-size: 2rem;
        color: white;
        margin-bottom: 40px;
    }

    .counties-title span {
        color: #93d105;
    }

    .counties-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 40px;
    }

    .counties-info {
        flex: 1;
        min-width: 300px;
    }

    .counties-info p {
        color: #e0e6ed;
        line-height: 1.7;
        margin-bottom: 25px;
        font-size: 1.1rem;
    }

    .counties-list {
        flex: 1;
        min-width: 300px;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        gap: 15px;
    }

    .county-item {
        background: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(10px);
        border-radius: 12px;
        padding: 20px;
        text-align: center;
        transition: all 0.3s ease;
        border: 1px solid rgba(255, 255, 255, 0.1);
    }

    .county-item:hover {
        transform: translateY(-5px);
        background: rgba(255, 255, 255, 0.15);
        border-color: rgba(248, 183, 57, 0.3);
    }

    .county-item i {
        font-size: 1.5rem;
        color: #93d105;
        margin-bottom: 10px;
    }

    .county-item h4 {
        font-size: 1.2rem;
        color: white;
    }

    /* Service Promise */
    .promise-section {
        background: linear-gradient(to right, rgba(248, 183, 57, 0.05), rgba(255, 152, 0, 0.02));
        padding: 50px;
        border-radius: 20px;
        text-align: center;
        border: 2px solid rgba(248, 183, 57, 0.2);
    }

    .promise-title {
        font-size: 1.8rem;
        color: #1a2a3a;
        margin-bottom: 25px;
    }

    .promise-title span {
        color: #93d105;
    }

    .promise-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 25px;
        margin-top: 40px;
    }

    .promise-item {
        background: white;
        padding: 25px;
        border-radius: 15px;
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
    }

    .promise-item i {
        font-size: 2.2rem;
        color: #93d105;
        margin-bottom: 15px;
    }

    .promise-item h4 {
        font-size: 1.3rem;
        color: #1a2a3a;
        margin-bottom: 10px;
    }

    /* Responsive Design */
    @media (max-width: 992px) {
        .map-hero {
            flex-direction: column;
        }

        .map-visual,
        .map-info {
            width: 100%;
        }

        .map-visual {
            height: 350px;
        }

        .cities-grid {
            grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        }

        .section-title {
            font-size: 2.3rem;
        }

        .counties-container {
            flex-direction: column;
        }
    }

    @media (max-width: 768px) {
        .service-areas-section {
            padding: 60px 0;
        }

        .section-title {
            font-size: 2rem;
        }

        .map-info h3 {
            font-size: 1.7rem;
        }

        .cities-title {
            font-size: 1.7rem;
        }

        .counties-section {
            padding: 40px 20px;
        }

        .promise-section {
            padding: 40px 20px;
        }
    }

    @media (max-width: 480px) {
        .section-title {
            font-size: 1.8rem;
        }

        .cities-grid {
            grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        }

        .city-card {
            padding: 20px;
        }

        .promise-grid {
            grid-template-columns: 1fr;
        }
    }



	.guarantee-badge {
		display: flex;
		align-items: center;
		gap: 0.6em;
		background: linear-gradient(90deg,#fff,#f5f8ec 70%, #eaf8ce 100%);
		color: #3c4d14;
		border: none;
		border-radius: 2.5em;
		font-size: 1.08rem;
		font-family: 'Segoe UI', 'Arial', sans-serif;
		font-weight: 500;
		box-shadow: 0 3px 18px 0 rgba(147,209,5,0.11);
		padding: 0.7em 1.6em 0.7em 1.2em;
		transition: box-shadow 0.2s, background 0.2s, color 0.1s;
		cursor: pointer;
		outline: none;
		white-space: nowrap;
	}
	.guarantee-badge .badge-icon {
		display: flex;
		align-items: center;
		justify-content: center;
		background: #93d105;
		color: #fff;
		width: 2em;
		height: 2em;
		border-radius: 50%;
		box-shadow: 0 2px 6px 0 rgba(147,209,5,0.16);
		font-size: 1.2em;
		transition: background 0.2s, color 0.15s;
	}
	.guarantee-badge .badge-text {
		letter-spacing: 0.02em;
	}
	.guarantee-badge:hover,
	.guarantee-badge:focus {
		background: linear-gradient(90deg, #f4ffe4, #ddec90 100%);
		box-shadow: 0 7px 28px 2px rgba(147,209,5,0.22);
		color: #153200;
	}
	.guarantee-badge:hover .badge-icon,
	.guarantee-badge:focus .badge-icon {
		background: #b0e040;
		color: #1b2e08;
	}