/* Base Styles */
		:root {
			--primary: #6e8efb;
			--secondary: #a777e3;
			--dark: #2d3748;
			--light: #f8f9fa;
		}

		body {
			font-family: 'Poppins', sans-serif;
			overflow-x: hidden;
		}

		h1,
		h2,
		h3,
		h4,
		h5,
		h6 {
			font-weight: 700;
			color: var(--dark);
		}

		/* Banner Styles */
		.page__banner {
			position: relative;
			padding: 100px 0;
			background: linear-gradient(135deg, #01008c, #28abdd);
			color: white;
			overflow: hidden;
		}

		.page__banner-shape {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 1;
		}

		.page__banner-shape img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			opacity: 0.1;
		}

		.page__banner-content {
			position: relative;
			z-index: 2;
		}

		.page__banner-content h1 {
			font-size: 3rem;
			margin-bottom: 20px;
			color: white;
		}

		.page__banner-content .lead {
			font-size: 1.25rem;
			margin-bottom: 30px;
		}

		.page__banner-img {
			position: relative;
			border-radius: 15px;
			overflow: hidden;
			/* box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
			transform: rotate(3deg); */
			transition: all 0.5s ease;
		}

		.page__banner-img:hover {
			transform: rotate(0deg) scale(1.05);
		}

		.page__banner-img img {
			width: 100%;
			height: auto;
			border-radius: 15px;
		}

		/* Shimla Section */
		.shimla-section {
			position: relative;
			padding: 80px 0;
			overflow: hidden;
		}

		.shimla-blob {
			position: absolute;
			width: 600px;
			height: 600px;
			border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
			background: rgba(110, 142, 251, 0.1);
			z-index: 1;
			animation: float 15s infinite ease-in-out;
		}

		.shimla-blob-1 {
			top: -200px;
			right: -200px;
			background: linear-gradient(135deg, rgba(110, 142, 251, 0.1) 0%, rgba(167, 119, 227, 0.1) 100%);
		}

		.shimla-blob-2 {
			bottom: -150px;
			left: -150px;
			width: 500px;
			height: 500px;
			animation-delay: 2s;
			animation-direction: reverse;
		}

		.shimla-content h2 {
			font-size: 2.5rem;
			margin-bottom: 20px;
		}

		.shimla-content .lead {
			font-size: 1.25rem;
			color: var(--dark);
			margin-bottom: 20px;
		}

		.shimla-img-container {
			position: relative;
			perspective: 1000px;
		}

		.shimla-img {
			border-radius: 20px;
			box-shadow: 0 30px 50px rgba(0, 0, 0, 0.15);
			transform: rotateY(-10deg) rotateX(5deg);
			transition: all 0.5s ease;
			position: relative;
			z-index: 3;
			width: 100%;
			height: auto;
		}

		.shimla-img-container:hover .shimla-img {
			transform: rotateY(0deg) rotateX(0deg) scale(1.05);
			box-shadow: 0 40px 70px rgba(0, 0, 0, 0.2);
		}

		.shimla-img-decoration {
			position: absolute;
			width: 100%;
			height: 100%;
			border: 3px dashed var(--primary);
			border-radius: 20px;
			top: 20px;
			left: 20px;
			z-index: 2;
			transition: all 0.5s ease;
		}

		.shimla-img-container:hover .shimla-img-decoration {
			top: 15px;
			left: 15px;
		}

		/* Tech Bubbles */
		.tech-bubbles {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			gap: 20px;
			margin: 40px 0;
		}

		.tech-bubble {
			width: 120px;
			height: 120px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			background: linear-gradient(135deg, var(--primary), var(--secondary));
			color: white;
			font-weight: bold;
			text-align: center;
			padding: 10px;
			box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
			transition: all 0.3s ease;
			position: relative;
			overflow: hidden;
		}

		.tech-bubble:hover {
			transform: translateY(-10px) scale(1.1);
			box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
		}

		.tech-bubble::before {
			content: '';
			position: absolute;
			top: -50%;
			left: -50%;
			width: 200%;
			height: 200%;
			background: rgba(255, 255, 255, 0.1);
			transform: rotate(45deg);
			transition: all 0.5s ease;
		}

		.tech-bubble:hover::before {
			left: 100%;
		}

		.tech-bubble .tech-tooltip {
			position: absolute;
			bottom: -50px;
			left: 0;
			width: 100%;
			background: rgba(0, 0, 0, 0.8);
			color: white;
			padding: 10px;
			border-radius: 10px;
			font-size: 14px;
			opacity: 0;
			transition: all 0.3s ease;
		}

		.tech-bubble:hover .tech-tooltip {
			bottom: -70px;
			opacity: 1;
		}

		/* Cards */
		.why-choose-card {
			border: none;
			border-radius: 15px;
			overflow: hidden;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			transition: all 0.4s ease;
			height: 100%;
			background: white;
		}

		.why-choose-card:hover {
			transform: translateY(-10px) rotate(1deg);
			box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
		}

		.why-choose-card .card-icon {
			font-size: 50px;
			color: var(--primary);
			margin-bottom: 20px;
			transition: all 0.3s ease;
		}

		.why-choose-card:hover .card-icon {
			transform: scale(1.1);
			color: var(--secondary);
		}

		.industry-card {
			background: white;
			border-radius: 15px;
			overflow: hidden;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			transition: all 0.4s ease;
			position: relative;
			height: 100%;
		}

		.industry-card:hover {
			transform: translateY(-10px) rotate(-1deg);
			box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
		}

		.industry-card::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 5px;
			background: linear-gradient(90deg, var(--primary), var(--secondary));
		}

		.industry-card .card-icon {
			font-size: 40px;
			color: var(--primary);
			margin-bottom: 15px;
			transition: all 0.3s ease;
		}

		.industry-card:hover .card-icon {
			transform: scale(1.1);
			color: var(--secondary);
		}

		/* Stats Section */
		.stats-container {
			position: relative;
			padding: 60px 0;
			background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
			overflow: hidden;
		}

		.stat-blob {
			position: absolute;
			width: 300px;
			height: 300px;
			border-radius: 30% 70% 70% 30% / 30% 30% 70% 70%;
			background: rgba(110, 142, 251, 0.1);
			z-index: 1;
		}

		.stat-blob:nth-child(1) {
			top: -100px;
			left: -100px;
			animation: float 15s infinite ease-in-out;
		}

		.stat-blob:nth-child(2) {
			bottom: -100px;
			right: -100px;
			background: rgba(167, 119, 227, 0.1);
			animation: float 18s infinite ease-in-out reverse;
		}

		.stat-item {
			background: white;
			padding: 30px;
			border-radius: 15px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			text-align: center;
			transition: all 0.3s ease;
			position: relative;
			z-index: 2;
			height: 100%;
		}

		.stat-item:hover {
			transform: translateY(-5px);
			box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
		}

		.stat-number {
			font-size: 50px;
			font-weight: 700;
			color: var(--primary);
			margin-bottom: 10px;
		}

		.stat-item::after {
			content: '';
			position: absolute;
			bottom: 0;
			left: 0;
			width: 0;
			height: 4px;
			background: linear-gradient(90deg, var(--primary), var(--secondary));
			transition: all 0.5s ease;
		}

		.stat-item:hover::after {
			width: 100%;
		}

		/* Process Steps */
		.process-step {
			position: relative;
			padding-left: 100px;
			margin-bottom: 40px;
		}

		.process-step::before {
			content: '';
			position: absolute;
			left: 30px;
			top: 0;
			bottom: -40px;
			width: 2px;
			background: #e0e0e0;
		}

		.process-step:last-child::before {
			display: none;
		}

		.step-number {
			position: absolute;
			left: 0;
			top: 0;
			width: 60px;
			height: 60px;
			border-radius: 50%;
			background: linear-gradient(135deg, #01008c, #28abdd);
			color: white;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 24px;
			font-weight: bold;
			transition: all 0.3s ease;
		}

		.process-step:hover .step-number {
			transform: scale(1.1) rotate(10deg);
			box-shadow: 0 10px 25px rgba(110, 142, 251, 0.3);
		}

		/* Tech Slider */
		.tech-slider {
			padding: 60px 0;
			background: url('assets/img/tech-pattern.png') center/cover;
			position: relative;
		}

		.tech-slider::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: rgba(255, 255, 255, 0.9);
		}

		.tech-slide {
			padding: 30px;
			text-align: center;
			transition: all 0.3s ease;
		}

		.tech-slide:hover {
			transform: translateY(-10px);
		}

		.tech-slide img {
			height: 80px;
			width: auto;
			margin: 0 auto 20px;
			filter: grayscale(100%);
			transition: all 0.3s ease;
		}

		.tech-slide:hover img {
			filter: grayscale(0%);
			transform: scale(1.1);
		}

		/* Testimonials */
		.testimonial-card {
			background: white;
			padding: 30px;
			border-radius: 15px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			position: relative;
			margin: 20px;
			height: 100%;
			transition: all 0.3s ease;
		}

		.testimonial-card:hover {
			transform: translateY(-10px);
			box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
		}

		.testimonial-card::before {
			content: '"';
			position: absolute;
			top: 20px;
			left: 20px;
			font-size: 60px;
			color: rgba(110, 142, 251, 0.1);
			font-family: serif;
			line-height: 1;
		}

		.client-img {
			width: 70px;
			height: 70px;
			border-radius: 50%;
			object-fit: cover;
			border: 3px solid var(--primary);
			transition: all 0.3s ease;
		}

		.testimonial-card:hover .client-img {
			border-color: var(--secondary);
			transform: scale(1.1);
		}

		.rating {
			color: #ffc107;
		}

		/* CTA Section */
		.cta-section {
			padding: 80px 0;
			background: linear-gradient(135deg, #01008c, #28abdd);
			color: white;
			position: relative;
			overflow: hidden;
		}

		.cta-section h2 {
			color: white;
		}

		.btn-primary,
		.bg-primary {
			background-color: #20a7dd !important;
			border-color: #1ea9d7;
		}

		.text-primary {
			color: rgb(1 0 140) !important;
		}

		.cta-section .btn-light {
			background: white;
			color: var(--primary);
			font-weight: 600;
		}

		.cta-section .btn-outline-light {
			border: 2px solid white;
			color: white;
			font-weight: 600;
		}

		.cta-section .btn-outline-light:hover {
			background: white;
			color: var(--primary);
		}

		/* Floating Elements */
		.floating-element {
			position: absolute;
			opacity: 0.7;
			z-index: 1;
			animation: float 8s infinite ease-in-out;
		}

		.floating-element.shape-1 {
			width: 100px;
			height: 100px;
			background: url('assets/img/abstract-shape-1.png') center/contain no-repeat;
			top: 20%;
			left: 5%;
			animation-delay: 0s;
		}

		.floating-element.shape-2 {
			width: 80px;
			height: 80px;
			background: url('assets/img/abstract-shape-2.png') center/contain no-repeat;
			bottom: 15%;
			right: 8%;
			animation-delay: 1s;
			animation-direction: reverse;
		}

		/* Animations */
		@keyframes float {
			0% {
				transform: translate(0, 0) rotate(0deg);
			}

			50% {
				transform: translate(20px, 20px) rotate(5deg);
			}

			100% {
				transform: translate(0, 0) rotate(0deg);
			}
		}

		@keyframes pulse {
			0% {
				transform: scale(1);
			}

			50% {
				transform: scale(1.05);
			}

			100% {
				transform: scale(1);
			}
		}

		.pulse-animation {
			animation: pulse 4s infinite ease-in-out;
		}

		/* Responsive Adjustments */
		@media (max-width: 1199.98px) {
			.page__banner-content h1 {
				font-size: 2.5rem;
			}

			.shimla-content h2 {
				font-size: 2rem;
			}
		}

		@media (max-width: 991.98px) {
			.page__banner {
				padding: 80px 0;
				text-align: center;
			}

			.page__banner-img {
				margin-top: 40px;
				max-width: 400px;
				margin-left: auto;
				margin-right: auto;
			}

			.shimla-section {
				text-align: center;
			}

			.shimla-img-container {
				margin-top: 40px;
			}

			.process-step {
				padding-left: 80px;
			}
		}

		@media (max-width: 767.98px) {
			.page__banner-content h1 {
				font-size: 2rem;
			}

			.page__banner-content .lead {
				font-size: 1.1rem;
			}

			.shimla-content h2 {
				font-size: 1.75rem;
			}

			.tech-bubble {
				width: 90px;
				height: 90px;
				font-size: 14px;
			}

			.stat-number {
				font-size: 40px;
			}

			.process-step {
				padding-left: 70px;
			}

			.step-number {
				width: 50px;
				height: 50px;
				font-size: 20px;
			}
		}

		@media (max-width: 575.98px) {
			.page__banner {
				padding: 60px 0;
			}

			.page__banner-content h1 {
				font-size: 1.75rem;
			}

			.shimla-content h2 {
				font-size: 1.5rem;
			}

			.tech-bubble {
				width: 80px;
				height: 80px;
				font-size: 12px;
			}

			.tech-bubble .tech-tooltip {
				font-size: 12px;
				padding: 5px;
				bottom: -40px;
			}

			.tech-bubble:hover .tech-tooltip {
				bottom: -60px;
			}
		}
        /* next section */
        	/* Custom Styles for Tech Stack Section */
		.tech-stack-section {
			background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
			position: relative;
			overflow: hidden;
		}

		.tech-stack-section::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"><path fill="rgba(0,123,255,0.03)" d="M0,0 L100,0 L100,100 L0,100 Z" /></svg>');
			background-size: cover;
			opacity: 0.5;
		}

		.text-gradient {
			background: linear-gradient(135deg, #01008c, #01008c);
			-webkit-background-clip: text;
			background-clip: text;
			color: transparent;
			display: inline-block;
		}

		.title-decoration {
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 1rem;
		}

		.title-decoration .dot {
			width: 8px;
			height: 8px;
			background: #3a7bd5;
			border-radius: 50%;
		}

		.title-decoration .line {
			width: 60px;
			height: 2px;
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			margin: 0 10px;
		}

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

		.tech-card {
			background: white;
			border-radius: 12px;
			padding: 30px 25px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			transition: all 0.4s ease;
			position: relative;
			overflow: hidden;
			z-index: 1;
			text-align: center;
		}

		.tech-card::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 5px;
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			transition: all 0.4s ease;
		}

		.tech-card:hover {
			transform: translateY(-10px);
			box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
		}

		.tech-card:hover::before {
			height: 100%;
			opacity: 0.1;
		}

		.tech-icon {
			width: 80px;
			height: 80px;
			margin: 0 auto 20px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 36px;
			color: white;
			position: relative;
			transition: all 0.3s ease;
		}

		.tech-card:hover .tech-icon {
			transform: scale(1.1);
		}

		.pulse-effect {
			position: absolute;
			width: 100%;
			height: 100%;
			border-radius: 50%;
			opacity: 0;
			border: 2px solid currentColor;
			animation: pulse 2s infinite;
		}

		@keyframes pulse {
			0% {
				transform: scale(0.8);
				opacity: 0.5;
			}

			70% {
				transform: scale(1.2);
				opacity: 0;
			}

			100% {
				transform: scale(0.8);
				opacity: 0;
			}
		}

		.tech-card h3 {
			font-weight: 600;
			margin-bottom: 15px;
			position: relative;
			z-index: 2;
		}

		.tech-details p {
			color: #666;
			font-size: 14px;
			margin-bottom: 15px;
			position: relative;
			z-index: 2;
		}

		.tech-progress {
			height: 4px;
			border-radius: 2px;
			background: #f0f0f0;
			overflow: hidden;
			position: relative;
		}

		.tech-progress::after {
			content: '';
			position: absolute;
			left: 0;
			top: 0;
			height: 100%;
			width: 90%;
			animation: progressBar 1.5s ease-in-out;
		}

		/* Technology Specific Colors */
		.html-bg {
			background-color: #e34f26;
		}

		.css-bg {
			background-color: #2965f1;
		}

		.js-bg {
			background-color: #f7df1e;
			color: #333;
		}

		.react-bg {
			background-color: #61dafb;
			color: #333;
		}

		.vue-bg {
			background-color: #42b883;
		}

		.angular-bg {
			background-color: #dd0031;
		}

		.bootstrap-bg {
			background-color: #7952b3;
		}

		.tailwind-bg {
			background-color: #38b2ac;
		}

		.wordpress-bg {
			background-color: #21759b;
		}

		.shopify-bg {
			background-color: #96bf48;
		}

		.html-progress::after {
			background-color: #e34f26;
			width: 95%;
		}

		.css-progress::after {
			background-color: #2965f1;
			width: 90%;
		}

		.js-progress::after {
			background-color: #f7df1e;
			width: 85%;
		}

		.react-progress::after {
			background-color: #61dafb;
			width: 88%;
		}

		.vue-progress::after {
			background-color: #42b883;
			width: 82%;
		}

		.angular-progress::after {
			background-color: #dd0031;
			width: 80%;
		}

		.bootstrap-progress::after {
			background-color: #7952b3;
			width: 85%;
		}

		.tailwind-progress::after {
			background-color: #38b2ac;
			width: 83%;
		}

		.wordpress-progress::after {
			background-color: #21759b;
			width: 78%;
		}

		.shopify-progress::after {
			background-color: #96bf48;
			width: 75%;
		}

		@keyframes progressBar {
			0% {
				width: 0;
			}

			100% {
				width: var(--progress-width);
			}
		}

		.tech-cta {
			background: white;
			padding: 30px;
			border-radius: 12px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			max-width: 700px;
			margin: 0 auto;
			position: relative;
			z-index: 1;
		}

		.btn-gradient-primary {
			background: linear-gradient(135deg, #01008c, #28abdd);
			border: none;
			color: white;
			padding: 12px 30px;
			border-radius: 50px;
			font-weight: 600;
			transition: all 0.3s ease;
			position: relative;
			overflow: hidden;
		}

		.btn-gradient-primary:hover {
			transform: translateY(-3px);
			box-shadow: 0 10px 20px rgba(58, 123, 213, 0.3);
		}

		.btn-gradient-primary.with-icon i {
			margin-left: 10px;
			transition: transform 0.3s ease;
		}

		.btn-gradient-primary.with-icon:hover i {
			transform: translateX(5px);
		}

		.mt-6 {
			margin-top: 4rem !important;
		}

		/* Responsive Adjustments */
		@media (max-width: 992px) {
			.tech-grid {
				grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
				gap: 20px;
			}
		}

		@media (max-width: 768px) {
			.tech-grid {
				grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
			}
		}

		@media (max-width: 576px) {
			.tech-grid {
				grid-template-columns: 1fr;
				max-width: 350px;
				margin-left: auto;
				margin-right: auto;
			}

			.tech-card {
				padding: 25px 20px;
			}
		}
        /* next  */
        	/* Statistics Section Styles */
		.stats-section {
			position: relative;
			background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
			overflow: hidden;
		}

		.stat-blob {
			position: absolute;
			border-radius: 50%;
			background: linear-gradient(135deg, rgba(58, 123, 213, 0.1) 0%, rgba(0, 210, 255, 0.05) 100%);
			filter: blur(40px);
			z-index: 0;
		}

		.stat-blob-1 {
			width: 400px;
			height: 400px;
			top: -100px;
			left: -100px;
		}

		.stat-blob-2 {
			width: 600px;
			height: 600px;
			bottom: -200px;
			right: -200px;
		}

		.stat-blob-3 {
			width: 300px;
			height: 300px;
			top: 50%;
			left: 30%;
		}

		.text-gradient {
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			-webkit-background-clip: text;
			background-clip: text;
			color: transparent;
			display: inline-block;
		}

		.header-decoration {
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 1rem;
		}

		.header-decoration .dot {
			width: 8px;
			height: 8px;
			background: #3a7bd5;
			border-radius: 50%;
		}

		.header-decoration .line {
			width: 60px;
			height: 2px;
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			margin: 0 10px;
		}

		.stats-grid {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
			gap: 25px;
			position: relative;
			z-index: 1;
		}

		.stat-card {
			background: white;
			border-radius: 15px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			transition: all 0.4s ease;
			overflow: hidden;
			position: relative;
		}

		.stat-card:hover {
			transform: translateY(-10px);
			box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
		}

		.stat-content {
			padding: 30px;
			position: relative;
			z-index: 2;
		}

		.stat-number-container {
			display: flex;
			align-items: flex-end;
			margin-bottom: 15px;
		}

		.stat-number {
			font-size: 48px;
			font-weight: 700;
			line-height: 1;
			color: #3a7bd5;
			transition: color 0.3s ease;
		}

		.stat-card:hover .stat-number {
			color: #00d2ff;
		}

		.stat-symbol {
			font-size: 24px;
			font-weight: 600;
			margin-left: 5px;
			color: #666;
			line-height: 1.2;
		}

		.stat-card h3 {
			font-size: 18px;
			font-weight: 600;
			margin-bottom: 10px;
			color: #333;
		}

		.stat-description {
			color: #666;
			font-size: 14px;
			margin-bottom: 15px;
			line-height: 1.5;
		}

		.stat-meta {
			display: flex;
			align-items: center;
			font-size: 13px;
			color: #666;
			margin-top: 15px;
		}

		.stat-meta i {
			margin-right: 8px;
			color: #3a7bd5;
		}

		.stat-meta .stars i {
			color: #ffc107;
			margin-right: 3px;
			font-size: 12px;
		}

		.stat-wave {
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 5px;
			background: linear-gradient(90deg, transparent, rgba(58, 123, 213, 0.5), transparent);
			opacity: 0;
			transition: all 0.3s ease;
		}

		.stat-card:hover .stat-wave {
			opacity: 1;
			animation: wave 1.5s infinite linear;
		}

		@keyframes wave {
			0% {
				background-position-x: 0;
			}

			100% {
				background-position-x: 200px;
			}
		}

		/* Responsive Adjustments */
		@media (max-width: 1200px) {
			.stats-grid {
				grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
			}
		}

		@media (max-width: 992px) {
			.stats-grid {
				grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
				gap: 20px;
			}

			.stat-content {
				padding: 25px;
			}

			.stat-number {
				font-size: 42px;
			}
		}

		@media (max-width: 768px) {
			.stats-grid {
				grid-template-columns: repeat(2, 1fr);
			}
		}

		@media (max-width: 576px) {
			.stats-grid {
				grid-template-columns: 1fr;
			}

			.stat-number {
				font-size: 38px;
			}

			.stat-content {
				padding: 20px;
			}
		}
        /* web-development / */
        	/* Custom Styles for Tech Stack Section */
		.tech-stack-section {
			background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
			position: relative;
			overflow: hidden;
		}

		.tech-stack-section::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"><path fill="rgba(0,123,255,0.03)" d="M0,0 L100,0 L100,100 L0,100 Z" /></svg>');
			background-size: cover;
			opacity: 0.5;
		}

		.text-gradient {
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			-webkit-background-clip: text;
			background-clip: text;
			color: transparent;
			display: inline-block;
		}

		.title-decoration {
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 1rem;
		}

		.title-decoration .dot {
			width: 8px;
			height: 8px;
			background: #3a7bd5;
			border-radius: 50%;
		}

		.title-decoration .line {
			width: 60px;
			height: 2px;
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			margin: 0 10px;
		}

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

		.tech-card {
			background: white;
			border-radius: 12px;
			padding: 30px 25px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			transition: all 0.4s ease;
			position: relative;
			overflow: hidden;
			z-index: 1;
			text-align: center;
		}

		.tech-card::before {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 5px;
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			transition: all 0.4s ease;
		}

		.tech-card:hover {
			transform: translateY(-10px);
			box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
		}

		.tech-card:hover::before {
			height: 100%;
			opacity: 0.1;
		}

		.tech-icon {
			width: 80px;
			height: 80px;
			margin: 0 auto 20px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 36px;
			color: white;
			position: relative;
			transition: all 0.3s ease;
		}

		.tech-card:hover .tech-icon {
			transform: scale(1.1);
		}

		.pulse-effect {
			position: absolute;
			width: 100%;
			height: 100%;
			border-radius: 50%;
			opacity: 0;
			border: 2px solid currentColor;
			animation: pulse 2s infinite;
		}

		@keyframes pulse {
			0% {
				transform: scale(0.8);
				opacity: 0.5;
			}

			70% {
				transform: scale(1.2);
				opacity: 0;
			}

			100% {
				transform: scale(0.8);
				opacity: 0;
			}
		}

		.tech-card h3 {
			font-weight: 600;
			margin-bottom: 15px;
			position: relative;
			z-index: 2;
		}

		.tech-details p {
			color: #666;
			font-size: 14px;
			margin-bottom: 15px;
			position: relative;
			z-index: 2;
		}

		.tech-progress {
			height: 4px;
			border-radius: 2px;
			background: #f0f0f0;
			overflow: hidden;
			position: relative;
		}

		.tech-progress::after {
			content: '';
			position: absolute;
			left: 0;
			top: 0;
			height: 100%;
			width: 90%;
			animation: progressBar 1.5s ease-in-out;
		}

		/* Technology Specific Colors */
		.html-bg {
			background-color: #e34f26;
		}
		
		.node-bg {
			background-color: #68a063;
		}
		
		.db-bg {
			background-color: #336791;
		}
		
		.cloud-bg {
			background-color: #ff9900;
		}
		
		.mobile-bg {
			background-color: #61dafb;
		}
		
		.cms-bg {
			background-color: #21759b;
		}
		
		.devops-bg {
			background-color: #2496ed;
		}
		
		.ai-bg {
			background-color: #ff6b00;
		}

		.html-progress::after {
			background-color: #e34f26;
			width: 95%;
		}
		
		.node-progress::after {
			background-color: #68a063;
			width: 90%;
		}
		
		.db-progress::after {
			background-color: #336791;
			width: 88%;
		}
		
		.cloud-progress::after {
			background-color: #ff9900;
			width: 85%;
		}
		
		.mobile-progress::after {
			background-color: #61dafb;
			width: 82%;
		}
		
		.cms-progress::after {
			background-color: #21759b;
			width: 80%;
		}
		
		.devops-progress::after {
			background-color: #2496ed;
			width: 78%;
		}
		
		.ai-progress::after {
			background-color: #ff6b00;
			width: 75%;
		}

		@keyframes progressBar {
			0% {
				width: 0;
			}

			100% {
				width: var(--progress-width);
			}
		}

		.tech-cta {
			background: white;
			padding: 30px;
			border-radius: 12px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			max-width: 700px;
			margin: 0 auto;
			position: relative;
			z-index: 1;
		}

		.btn-gradient-primary {
			background: linear-gradient(135deg, #01008c, #28abdd);
			border: none;
			color: white;
			padding: 12px 30px;
			border-radius: 50px;
			font-weight: 600;
			transition: all 0.3s ease;
			position: relative;
			overflow: hidden;
		}

		.btn-gradient-primary:hover {
			transform: translateY(-3px);
			box-shadow: 0 10px 20px rgba(58, 123, 213, 0.3);
		}

		.btn-gradient-primary.with-icon i {
			margin-left: 10px;
			transition: transform 0.3s ease;
		}

		.btn-gradient-primary.with-icon:hover i {
			transform: translateX(5px);
		}

		.mt-6 {
			margin-top: 4rem !important;
		}

		/* Responsive Adjustments */
		@media (max-width: 992px) {
			.tech-grid {
				grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
				gap: 20px;
			}
		}

		@media (max-width: 768px) {
			.tech-grid {
				grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
			}
		}

		@media (max-width: 576px) {
			.tech-grid {
				grid-template-columns: 1fr;
				max-width: 350px;
				margin-left: auto;
				margin-right: auto;
			}

			.tech-card {
				padding: 25px 20px;
			}
		}
        /* next  */
        	/* Statistics Section Styles */
		.stats-section {
			position: relative;
			background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
			overflow: hidden;
		}

		.stat-blob {
			position: absolute;
			border-radius: 50%;
			background: linear-gradient(135deg, rgba(58, 123, 213, 0.1) 0%, rgba(0, 210, 255, 0.05) 100%);
			filter: blur(40px);
			z-index: 0;
		}

		.stat-blob-1 {
			width: 400px;
			height: 400px;
			top: -100px;
			left: -100px;
		}

		.stat-blob-2 {
			width: 600px;
			height: 600px;
			bottom: -200px;
			right: -200px;
		}

		.stat-blob-3 {
			width: 300px;
			height: 300px;
			top: 50%;
			left: 30%;
		}

		.text-gradient {
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			-webkit-background-clip: text;
			background-clip: text;
			color: transparent;
			display: inline-block;
		}

		.header-decoration {
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: 1rem;
		}

		.header-decoration .dot {
			width: 8px;
			height: 8px;
			background: #3a7bd5;
			border-radius: 50%;
		}

		.header-decoration .line {
			width: 60px;
			height: 2px;
			background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
			margin: 0 10px;
		}

		.stats-grid {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
			gap: 25px;
			position: relative;
			z-index: 1;
		}

		.stat-card {
			background: white;
			border-radius: 15px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
			transition: all 0.4s ease;
			overflow: hidden;
			position: relative;
		}

		.stat-card:hover {
			transform: translateY(-10px);
			box-shadow: 0 15px 40px rgba(0, 0, 0, 0.1);
		}

		.stat-content {
			padding: 30px;
			position: relative;
			z-index: 2;
		}

		.stat-number-container {
			display: flex;
			align-items: flex-end;
			margin-bottom: 15px;
		}

		.stat-number {
			font-size: 48px;
			font-weight: 700;
			line-height: 1;
			color: #3a7bd5;
			transition: color 0.3s ease;
		}

		.stat-card:hover .stat-number {
			color: #00d2ff;
		}

		.stat-symbol {
			font-size: 24px;
			font-weight: 600;
			margin-left: 5px;
			color: #666;
			line-height: 1.2;
		}

		.stat-card h3 {
			font-size: 18px;
			font-weight: 600;
			margin-bottom: 10px;
			color: #333;
		}

		.stat-description {
			color: #666;
			font-size: 14px;
			margin-bottom: 15px;
			line-height: 1.5;
		}

		.stat-meta {
			display: flex;
			align-items: center;
			font-size: 13px;
			color: #666;
			margin-top: 15px;
		}

		.stat-meta i {
			margin-right: 8px;
			color: #3a7bd5;
		}

		.stat-meta .stars i {
			color: #ffc107;
			margin-right: 3px;
			font-size: 12px;
		}

		.stat-wave {
			position: absolute;
			bottom: 0;
			left: 0;
			width: 100%;
			height: 5px;
			background: linear-gradient(90deg, transparent, rgba(58, 123, 213, 0.5), transparent);
			opacity: 0;
			transition: all 0.3s ease;
		}

		.stat-card:hover .stat-wave {
			opacity: 1;
			animation: wave 1.5s infinite linear;
		}

		@keyframes wave {
			0% {
				background-position-x: 0;
			}

			100% {
				background-position-x: 200px;
			}
		}

		/* Responsive Adjustments */
		@media (max-width: 1200px) {
			.stats-grid {
				grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
			}
		}

		@media (max-width: 992px) {
			.stats-grid {
				grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
				gap: 20px;
			}

			.stat-content {
				padding: 25px;
			}

			.stat-number {
				font-size: 42px;
			}
		}

		@media (max-width: 768px) {
			.stats-grid {
				grid-template-columns: repeat(2, 1fr));
			}
		}

		@media (max-width: 576px) {
			.stats-grid {
				grid-template-columns: 1fr;
			}

			.stat-number {
				font-size: 38px;
			}

			.stat-content {
				padding: 20px;
			}
		}
        /* digital marketing  */
            /* Custom Styles for Tech Stack Section */
        .tech-stack-section {
            background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
            position: relative;
            overflow: hidden;
        }

        .tech-stack-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"><path fill="rgba(0,123,255,0.03)" d="M0,0 L100,0 L100,100 L0,100 Z" /></svg>');
            background-size: cover;
            opacity: 0.5;
        }

        .text-gradient {
            background: linear-gradient(135deg, #01008c, #01008c);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            display: inline-block;
        }

        .title-decoration {
            display: flex;
            align-items: center;
            justify-content: center;
            margin-top: 1rem;
        }

        .title-decoration .dot {
            width: 8px;
            height: 8px;
            background: #3a7bd5;
            border-radius: 50%;
        }

        .title-decoration .line {
            width: 60px;
            height: 2px;
            background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
            margin: 0 10px;
        }

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

        .tech-card {
            background: white;
            border-radius: 12px;
            padding: 30px 25px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
            transition: all 0.4s ease;
            position: relative;
            overflow: hidden;
            z-index: 1;
            text-align: center;
        }

        .tech-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 5px;
            background: linear-gradient(90deg, #3a7bd5 0%, #00d2ff 100%);
            transition: all 0.4s ease;
        }

        .tech-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
        }

        .tech-card:hover::before {
            height: 100%;
            opacity: 0.1;
        }

        .tech-icon {
            width: 80px;
            height: 80px;
            margin: 0 auto 20px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 36px;
            color: white;
            position: relative;
            transition: all 0.3s ease;
        }

        .tech-card:hover .tech-icon {
            transform: scale(1.1);
        }

        .pulse-effect {
            position: absolute;
            width: 100%;
            height: 100%;
            border-radius: 50%;
            opacity: 0;
            border: 2px solid currentColor;
            animation: pulse 2s infinite;
        }

        @keyframes pulse {
            0% {
                transform: scale(0.8);
                opacity: 0.5;
            }

            70% {
                transform: scale(1.2);
                opacity: 0;
            }

            100% {
                transform: scale(0.8);
                opacity: 0;
            }
        }

        .tech-card h3 {
            font-weight: 600;
            margin-bottom: 15px;
            position: relative;
            z-index: 2;
        }

        .tech-details p {
            color: #666;
            font-size: 14px;
            margin-bottom: 15px;
            position: relative;
            z-index: 2;
        }

        .tech-progress {
            height: 4px;
            border-radius: 2px;
            background: #f0f0f0;
            overflow: hidden;
            position: relative;
        }

        .tech-progress::after {
            content: '';
            position: absolute;
            left: 0;
            top: 0;
            height: 100%;
            width: 90%;
            animation: progressBar 1.5s ease-in-out;
        }

        /* Technology Specific Colors */
        .html-bg {
            background-color: #e34f26;
        }

        .css-bg {
            background-color: #2965f1;
        }

        .js-bg {
            background-color: #f7df1e;
            color: #333;
        }

        .react-bg {
            background-color: #61dafb;
            color: #333;
        }

        .vue-bg {
            background-color: #42b883;
        }

        .angular-bg {
            background-color: #dd0031;
        }

        .bootstrap-bg {
            background-color: #7952b3;
        }

        .tailwind-bg {
            background-color: #38b2ac;
        }

        .wordpress-bg {
            background-color: #21759b;
        }

        .shopify-bg {
            background-color: #96bf48;
        }

        .html-progress::after {
            background-color: #e34f26;
            width: 95%;
        }

        .css-progress::after {
            background-color: #2965f1;
            width: 90%;
        }

        .js-progress::after {
            background-color: #f7df1e;
            width: 85%;
        }

        .react-progress::after {
            background-color: #61dafb;
            width: 88%;
        }

        .vue-progress::after {
            background-color: #42b883;
            width: 82%;
        }

        .angular-progress::after {
            background-color: #dd0031;
            width: 80%;
        }

        .bootstrap-progress::after {
            background-color: #7952b3;
            width: 85%;
        }

        .tailwind-progress::after {
            background-color: #38b2ac;
            width: 83%;
        }

        .wordpress-progress::after {
            background-color: #21759b;
            width: 78%;
        }

        .shopify-progress::after {
            background-color: #96bf48;
            width: 75%;
        }

        @keyframes progressBar {
            0% {
                width: 0;
            }

            100% {
                width: var(--progress-width);
            }
        }

        .tech-cta {
            background: white;
            padding: 30px;
            border-radius: 12px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
            max-width: 700px;
            margin: 0 auto;
            position: relative;
            z-index: 1;
        }

        .btn-gradient-primary {
            background: linear-gradient(135deg, #01008c, #28abdd);
            border: none;
            color: white;
            padding: 12px 30px;
            border-radius: 50px;
            font-weight: 600;
            transition: all 0.3s ease;
            position: relative;
            overflow: hidden;
        }

        .btn-gradient-primary:hover {
            transform: translateY(-3px);
            box-shadow: 0 10px 20px rgba(58, 123, 213, 0.3);
        }

        .btn-gradient-primary.with-icon i {
            margin-left: 10px;
            transition: transform 0.3s ease;
        }

        .btn-gradient-primary.with-icon:hover i {
            transform: translateX(5px);
        }

        .mt-6 {
            margin-top: 4rem !important;
        }

        /* Responsive Adjustments */
        @media (max-width: 992px) {
            .tech-grid {
                grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
                gap: 20px;
            }
        }

        @media (max-width: 768px) {
            .tech-grid {
                grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
            }
        }

        @media (max-width: 576px) {
            .tech-grid {
                grid-template-columns: 1fr;
                max-width: 350px;
                margin-left: auto;
                margin-right: auto;
            }

            .tech-card {
                padding: 25px 20px;
            }
        }
        /* next  */ 
        /* header animation  */

        /* header animation  */