:root {
	--primary: #EE6910;
	--secondary: #D09D5B;
	--white: #fff;
	--black: #000;
	--dark-gray: #959595;
	--light-blue: #F4F7F7;
	--light-black: #222222;
}

body {
	font-family: "Roboto", sans-serif;
	color: var(--black);
	scroll-behavior: smooth;
	will-change: scroll-position;
	-webkit-overflow-scrolling: touch;
	backface-visibility: hidden;
	font-size: 16px;
	overflow-x: hidden;
}


/* Sleek custom scrollbar */
body::-webkit-scrollbar {
	width: 8px;
	/* slightly thicker for better visibility */
}

body::-webkit-scrollbar-track {
	background: #292929;
	/* softer, neutral track */
	border-radius: 10px;
}

body::-webkit-scrollbar-thumb {
	background: linear-gradient(180deg, #333 0%, #000 100%);
	border-radius: 10px;
	border: 2px solid #292929;
	/* creates space around thumb */
	transition: background 0.3s ease;
}

body::-webkit-scrollbar-thumb:hover {
	background: linear-gradient(180deg, #555 0%, #111 100%);
}






html {
	margin-top: 0 !important;
}

a {
	text-decoration: none;
}

.pt-100 {
	padding-top: 75px;
}

.pb-100 {
	padding-bottom: 75px;
}

.p-100 {
	padding: 75px 0;
}

.mt-100 {
	margin-top: 75px;
}

.mb-100 {
	margin-bottom: 75px;
}

.pt-60 {
	padding-top: 60px;
}

.pb-60 {
	padding-bottom: 60px;
}

.pt-50 {
	padding-top: 50px;
}

.pb-50 {
	padding-bottom: 50px;
}

.pt-40 {
	padding-top: 40px;
}

.pb-40 {
	padding-bottom: 40px;
}

.pt-30 {
	padding-top: 30px;
}

.pb-30 {
	padding-bottom: 30px;
}

.mt-60 {
	margin-top: 60px;
}

.mb-30 {
	margin-bottom: 30px;
}

.p-45 {
	padding: 45px 0;
}

.f-40 {
	font-size: 2.08vw;
	font-weight: 800;
	line-height: 1.3;
}

.main-heading {
	font-size: 1.75rem;
	line-height: 1.4;
	font-weight: 600;
	text-transform: capitalize;
}

.main-heading span {
	color: var(--primary);
}

.sub-heading {
	line-height: 1.5;
	margin-bottom: 0;
	font-weight: 600;
	font-size: 1.625rem;
}

.small-heading {
	font-size: 1.3rem;
	font-weight: 600;
	line-height: 1.4;
}

.main-p {
	font-size: 0.875rem;
	line-height: 1.8;
	color: var(--black);
	font-weight: 400;
	margin-bottom: 0;
}

.other-p {
	font-size: 1rem;
	line-height: 1.8;
	color: var(--black);
	font-weight: 400;
	margin-bottom: 0;
}

.section-space {
	padding: 0 50px;
}

.sample:after {
	position: absolute;
	content: "";
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 2px;
	height: 80%;
}

.container {
	max-width: 1420px;
}

.border-r-10 {
	border-radius: 10px;
}

.medium-h {
	font-size: 1.667vw;
	line-height: 1.5;
	font-weight: 400;
}

.btn-1 {
	font-size: 1.15rem;
	border: 1px solid var(--black);
	padding: 8px 30px;
	color: var(--black);
	display: block;
	width: max-content;
	transition: 0.4s;
}

.btn-1:hover {
	background-color: var(--brown);
	color: var(--white);
	border-color: var(--brown);
}

.btn-2 {
	color: var(--primary);
	font-size: 1.2rem;
	line-height: 1.2;
	letter-spacing: 2px;
	position: relative;
	padding-right: 40px;
	overflow: hidden;
	transition: 0.6s;
}

.btn-2:hover {
	letter-spacing: 4px;
}

.btn-2:after {
	position: absolute;
	content: "";
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 26px;
	height: 12px;
	background-image: url('../images/right-red-arrow.svg');
	background-repeat: no-repeat;
	background-size: contain;
	filter: brightness(0) saturate(100%) invert(73%) sepia(61%) saturate(7431%) hue-rotate(358deg) brightness(98%) contrast(90%);
}

.slide-border {
	position: relative;
	padding: 15px 30px;
	font-size: 1.8rem;
	font-weight: 600;
	color: #333;
	background: transparent;
	letter-spacing: 2px;
	text-transform: uppercase;
	overflow: hidden;
}

.slide-border::before {
	content: '';
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	border: 2px solid #ffc107;
	transition: left 0.4s ease;
}

.slide-border:hover::before {
	left: 0;
}

.slide-border:hover {
	color: #ffc107;
}

.btn-3 {
	padding: 8px 28px;
	color: var(--white);
	background-color: var(--primary);
	font-size: 0.9rem;
	display: block;
	width: max-content;
}

.color-gray {
	color: var(--dark-gray);
}

.bg-darks {
	background-color: var(--black);
}

/* ------------circle animation start----------- */
.two-cercle-animate {
	position: relative;
	width: 90px;
	height: 50px;
}

.two-cercle-animate .line {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: var(--black);
}

.two-cercle-animate .circle-gray {
	position: absolute;
	top: 50%;
	left: 20px;
	width: 20px;
	height: 20px;
	background-color: var(--white);
	border: 1px solid var(--black);
	border-radius: 50%;
	transform: translateY(-50%);
	animation: move-right 6s ease-in-out infinite;
}

.two-cercle-animate .circle-black {
	position: absolute;
	top: 50%;
	left: 20px;
	width: 20px;
	height: 20px;
	background-color: var(--black);
	border-radius: 50%;
	transform: translateY(-50%);
	animation: move-left 4s ease-in-out infinite;
	animation-delay: 0.5s;
}

@keyframes move-right {
	0% {
		left: 15px;
	}

	50% {
		left: 50px;
	}

	100% {
		left: 15px;
	}
}

@keyframes move-left {
	0% {
		left: 50px;
	}

	50% {
		left: 20px;
	}

	100% {
		left: 50px;
	}
}

/* ------------circle animation end----------- */

.rotate-swipe-animation {
	margin: 15px 0;
	position: relative;
	bottom: -30px;
}

.rotate-swipe-animation .swipe-container {
	display: flex;
	align-items: center;
	gap: 45px;
	cursor: pointer;
	position: relative;
}

.rotate-swipe-animation .line-left {
	width: 80px;
	height: 1px;
	background-color: var(--white);
	transition: all 0.3s ease;
	position: relative;
	z-index: 0;
}

.rotate-swipe-animation .circles-wrapper {
	position: relative;
	width: 16px;
	height: 16px;
	margin-left: -45px;
}

.rotate-swipe-animation .circle-box {
	display: flex;
	align-items: center;
}

.rotate-swipe-animation .line-through {
	position: absolute;
	width: 60px;
	height: 1px;
	background-color: var(--white);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 0;
	transition: all 0.3s ease;
}

.rotate-swipe-animation .circle {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	position: absolute;
	top: 0;
	left: 0;
	transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.rotate-swipe-animation .circle-black {
	background-color: var(--primary);
	z-index: 2;
}

.rotate-swipe-animation .circle-white {
	background-color: var(--white);
	z-index: 1;
}

.rotate-swipe-animation .swipe-container.swiping .circle-black {
	transform: translateX(30px);
	z-index: 1;
}

.rotate-swipe-animation .swipe-container.swiping .circle-white {
	transform: translateX(-30px);
	z-index: 2;
}

.rotate-swipe-animation .project-text {
	font-size: 12px;
	font-weight: 600;
	line-height: 1.5;
	transition: all 0.3s ease;
}

.rotate-swipe-animation .project-text a {
	color: var(--white);
}

.rotate-swipe-animation .project-text a span {
	color: var(--primary);
}

.rotate-swipe-animation .rotate-swipe .circle-black {
	animation: rotateSwipeBlack 2.5s ease-in-out infinite;
}

.rotate-swipe-animation .rotate-swipe .circle-white {
	animation: rotateSwipeWhite 2.5s ease-in-out infinite;
}


.indestries-white {
	width: 60%;
}

.circle.circle-white.circle-black {
	background: var(--black)
}

.rotate-swipe-animation .line-left.left-black {
	background: var(--black)
}

.rotate-swipe-animation .project-text.with-black a {
	color: var(--black);
}

.indestries-white .swipe-container.rotate-swipe {
	justify-content: end
}

.indestries-white {
	width: 60%;
	display: flex;
	flex-direction: column;
	gap: 20px;
	justify-content: end;

}

@keyframes rotateSwipeBlack {

	0%,
	100% {
		transform: translateX(0) rotate(0deg);
		z-index: 2;
	}

	50% {
		transform: translateX(20px) rotate(180deg);
		z-index: 1;
	}
}

@keyframes rotateSwipeWhite {

	0%,
	100% {
		transform: translateX(0) rotate(0deg);
		z-index: 1;
	}

	50% {
		transform: translateX(-20px) rotate(-180deg);
		z-index: 2;
	}
}

/* ------------rotate-swipe-animation end----------- */

.bg-black-new {
	background-color: var(--black);
}

.p-color {
	color: var(--primary);
}

.f-12 {
	font-size: 0.75rem;
	color: var(--white);
	font-weight: 300;
}

/* ------------bubble animation start----------- */
.bubble {
	width: 150px;
	height: 150px;
	position: relative;
	animation: float-rotate 8s ease-in-out infinite;
}

@keyframes move-up-down {
	0% {
		transform: translateY(30px);
	}

	50% {
		transform: translateY(-30px);
	}

	100% {
		transform: translateY(30px);
	}
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

/* ------------bubble animation end----------- */

/* ------------------------------------------header css------------------------------------ */
.header.fixed-nav {
	position: sticky !important;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
	animation: slideDown 0.4s ease forwards;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	transition: 0.4s;
	background-color: var(--black);
	/* padding: 6px 0; */
}

@keyframes slideDown {
	from {
		transform: translateY(-20px);
	}

	to {
		transform: translateY(0);
	}
}

.menu-btn {
	display: inline-block;
	cursor: pointer;
	border: 1px solid #333333;
	padding: 9px 11px;
	position: relative;
	z-index: 99999;
	background-color: #0A090F;
}

.menu-btn .bar1,
.menu-btn .bar2,
.menu-btn .bar3 {
	width: 24px;
	height: 1px;
	background-color: var(--white);
	margin: 6px 0;
	transition: 0.4s;
	border-radius: 50%;
}

.menu-btn-change .bar1 {
	transform: translate(0, 11px) rotate(-45deg);
}

.menu-btn-change .bar2 {
	opacity: 0;
}

.menu-btn-change .bar3 {
	transform: translate(0, -11px) rotate(45deg);
}

/* .header {
	position: absolute;
	width: 100%;
	z-index: 9;
	padding: 20px 0;
}

.menu-toggle {
	text-align: end;
} */


.header.header-active {
    background: #000;
}


.mega-menu {
	position: relative;
	width: 100%;
	background: rgba(0, 0, 0, 0.9);
	z-index: 1001;

}

.mega-image {
	height: 100%;
	min-height: 300px;
	background-size: cover;
	background-position: center;
	/* max-height: 300px; */
}

.service-item {
	padding: 10px 0;
	cursor: pointer;
	/* border-bottom: 1px solid rgba(255, 255, 255, 0.1); */
	margin-bottom: 10px;
}

.service-item:hover {
	color: var(--primary);
}

.navbar-toggler {
	display: block !important;
	border: none;
}

.nav-link.active {
	color: var(--primary) !important;
}

/* .navbar-nav {
	display: none;
} */


#navbarNav{
	overflow-x: hidden;
}

.navbar-nav {
  opacity: 0;
  transform: translateX(100%);
  transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
}
.navbar-nav.show {
  opacity: 1;
  transform: translateX(0%);
}

.mega-overlay {
	position: fixed;
	top: 106px;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.9);
	z-index: 1000;
	display: none;
	height: 100vh;
}


.navbar-toggler:focus {
	box-shadow: none;
}

.mega-overlay.show {
	display: block;
}


.navbar-toggler {
	background: #000;
	border-radius: 0;
	height: 50px;
}

.uae-navbar .navbar-nav li.nav-item a.nav-link {
	color: #fff;
	transition: 0.3s all ease-in-out;
}

.uae-navbar .navbar-nav li.nav-item a.nav-link:hover {
	color: var(--primary);
}

/* Default transparent navbar */
.header {
	/* background-color: transparent ; */
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
	position: fixed;
	top: 0px;
	width: 100%;
	z-index: 99;
}

#megaMenu .content-outer {
	border-bottom-left-radius: 15px;
}

#megaMenu .subservices-outer {
	border-bottom-right-radius: 15px;
}

/* Scrolled navbar style */
/* .header.scrolled {
    background-color: #1E1E1E !important; 
 
} */

.service-item.active-service {
	color: var(--primary);
}


.navbar.red-bg {
	background-color: #1E1E1E !important;
	transition: background-color 0.3s ease;
}



.navbar-toggler .navbar-toggler-icon {
	filter: brightness(0) invert(1);
}

.uae-navbar .nav-item a {
	font-size: 12px;
}

.uae-navbar .nav-item {
	padding-inline: 20px
}



.subservices-outer {
	column-gap: 22px;
}

.submenue-row {
	gap: 30px;
}

.uae-meg .submenue-row h6 {
	font-size: 14px;
	font-weight: 400;
	margin-bottom: 3px
}

.uae-meg .submenue-row P {
	font-size: 10px;
	font-weight: 300;
	margin-top: 0px
}

.outer-row {
	margin-right: 45px;
}

/* .submenue-row p {
	font-size: 12px;
	margin-bottom: 0;
} */

.submenue-row {
	margin-bottom: 10px;
}

.header .navbar {
	padding-inline: 45px !important;
}

.uae-meg .service-item p {
	font-size: 12px;
	font-weight: 300;
}

.uae-mega .outer-row {
	padding: 30px;
	/* background: #191919; */
	box-shadow: 0px 0px 10px #13131373;
	margin-left: auto;
	margin-right: 20px;
}

.subservices-outer {
	background: #191919;
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 40%;
	padding-left: 45px !important;

}

.image-outer {
	width: 40% !important;
}

.services-outer {
	width: 60%;
	padding-left: 45px !important;
}

.content-outer {
	background-color: #1E1E1E
}

@media (max-width: 768px) {
	.mega-image {
		display: none;
	}
}

.subservice-block {
	margin-bottom: 20px;
}

.subservice-block .submenue-row:hover a {
	color: var(--primary);
}

.subservice-block img {
	max-width: 100%;
	border-radius: 5px;

}

.subservice-block p {
	font-size: 14px;
	margin-top: 5px;
	color: #ccc;
}





header .custom-logo {
	max-width: 7.2vw;
	/* height: auto; */
}

.header.fixed-nav .custom-logo {
	max-width: 85px;
}

.header.fixed-nav .menu-btn {
	padding: 5px 8px;
}





/* ------------------------------------------mobile header  css--------------------------------------- */

/* Mobile Header */


.mobilemenu .mobile-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;

	/* background: #1E1E1E; */
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 15px;
	z-index: 1200;
	display: none;
}

.mobilemenu .mobile-header .logo img {
	max-height: 35px;
}

/* Hamburger Icon (inside header now) */
/* Base hamburger style */
.mobilemenu .hamburger,
.desktopmenu .hamburger {
	background: none;
	border: none;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 10px;
}

.mobilemenu .hamburger span,
.desktopmenu .hamburger span {
	width: 25px;
	height: 3px;
	background: #919191;
	border-radius: 3px;
	transition: all 0.3s ease;
}

/* --- Active animation --- */
/* Mobile */
.mobilemenu .hamburger.active span:nth-child(1) {
	transform: rotate(45deg) translate(5px, 5px);
}

.mobilemenu .hamburger.active span:nth-child(2) {
	opacity: 0;
}

.mobilemenu .hamburger.active span:nth-child(3) {
	transform: rotate(-45deg) translate(6px, -6px);
}

/* Desktop */
.desktopmenu .hamburger.active span:nth-child(1) {
	transform: rotate(45deg) translate(6px, 6px);
}

.desktopmenu .hamburger.active span:nth-child(2) {
	opacity: 0;
}

.desktopmenu .hamburger.active span:nth-child(3) {
	transform: rotate(-45deg) translate(6px, -6px);
}

/* Sidebar Base */
.mobilemenu .sidebar {
	position: fixed;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	background: #fff;
	box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
	padding: 70px 20px 20px;
	/* push down below header */
	transition: left 0.3s ease;
	z-index: 1000;
}

.mobilemenu .sidebar.active {
	left: 0;
}

/* Sub Sidebar */
.mobilemenu .sub-sidebar {
	position: fixed;
	top: 0;
	left: 100%;
	width: 100%;
	height: 100%;
	background: #fff;
	box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
	padding: 70px 20px 20px;
	/* push down below header */
	transition: left 0.3s ease;
	z-index: 1001;
	overflow-y: auto;
}

.mobilemenu .sub-sidebar.active {
	left: 0;
}

/* Menu Styles */
.mobilemenu .menu,
.mobilemenu .sub-menu {
	list-style: none;
	padding: 0;
	margin: 0;
}

.mobilemenu .sub-menu li a {
	color: var(--black);
	display: block;
	width: 100%;
}

.mobilemenu .menu li,
.mobilemenu .sub-menu li {
	padding: 15px 0;
	font-size: 18px;
	border-bottom: 1px solid #eee;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.mobilemenu .menu li.active {
	font-weight: bold;
	color: #0073e6;
}


.mobilemenu .menu li a {
	width: 100%;
	display: block;
}

/* Back Button */
.mobilemenu .back-btn {
	font-size: 18px;
	margin-bottom: 20px;
	display: block;
	cursor: pointer;
}

/* Service Content */
.mobilemenu .service-content {
	display: none;
	margin-top: 20px;
}

.mobilemenu .service-content.active {
	display: block;
}

.mobilemenu .service-content img {
	width: 100%;
	border-radius: 8px;
	margin-bottom: 15px;
}

.mobilemenu .service-content h4 {
	margin: 0 0 10px;
}

.mobilemenu .service-content p {
	color: #555;
}




/* ------------------------------------------hero section css--------------------------------------- */

.hero {
	position: relative;
	background-color: var(--black);
}

.hero-video video {
	width: 100%;
}

.hero .hero-content-container {
	position: absolute;
	top: 50%;
	transform: translateY(-45%);
	left: 0;
	width: 100%;
	color: var(--white);
}

.hero-h {
	font-size: 4.8vw;
	color: var(--white);
	font-weight: 800;
	line-height: 1.2;
}

.hero-h span {
	color: var(--primary);
	letter-spacing: 1px;
}

.hero-p {
	margin-bottom: 35px;
	font-size: 1.2rem;
	letter-spacing: 1px;
	line-height: 1.8;
	margin-top: 14px;
}

.hero-video {
	margin-bottom: -10px;
}

.hero .hero-dot {
	position: absolute;
	bottom: 12px;
	left: 50%;
	transform: translateX(-50%);
}

/* ------------------------------------hero new css start-------------------------- */
.hero-banner {
	position: relative;
	background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
	overflow: hidden;
}

.hero-banner .carousel {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.hero-banner .carousel-item video {
	width: 100%;
	height: 100vh;
	object-fit: cover;
}

.hero-banner .hero-content-new {
	position: absolute;
	top: 50%;
	transform: translateY(-45%);
	left: 0;
	width: 100%;
	color: var(--white);
}

/* Carousel Indicators */
.hero-banner .carousel-indicators {
	bottom: 30px;
	z-index: 2;
	position: absolute;
	width: 100%;
	display: flex;
	justify-content: center;
	margin: 0;
	padding: 0;
	align-items: center;
}

.hero-banner .carousel-indicators [data-bs-target] {
	width: 12px;
	height: 12px;
	background-color: transparent;
	border: 1px solid var(--white);
	border-radius: 50%;
	opacity: 1;
	margin: 0 10px;
	transition: opacity 0.3s ease, background-color 0.3s ease, transform 0.6s ease;
	cursor: pointer;
	position: relative;
}

.hero-banner .carousel-indicators .active {
	background-color: var(--primary);
	border-color: var(--primary);
	opacity: 1;
}

.hero-banner .carousel-indicators.first-slide-moved [data-bs-slide-to="0"],
.hero-banner .carousel-indicators.second-slide-moved [data-bs-slide-to="1"],
.hero-banner .carousel-indicators.third-slide-moved [data-bs-slide-to="2"] {
	background-image: url(https://itxitpro.ae/demo/wp-content/uploads/2025/06/x-header.svg);
	background-repeat: no-repeat;
	background-size: contain;
	border: none;
	height: 16px;
	width: 16px;
	border-radius: 0;
}

/* Move indicators 600px left when not on their respective slides */
.hero-banner .carousel-indicators.first-slide-moved [data-bs-slide-to="0"],
.hero-banner .carousel-indicators.second-slide-moved [data-bs-slide-to="1"],
.hero-banner .carousel-indicators.third-slide-moved [data-bs-slide-to="2"] {
	transform: translateX(-600px);
}

/* Style for lines after each indicator */
.hero-banner .carousel-indicators [data-bs-slide-to="0"]::after,
.hero-banner .carousel-indicators [data-bs-slide-to="1"]::after,
.hero-banner .carousel-indicators [data-bs-slide-to="2"]::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 100%;
	width: 500px;
	height: 1.5px;
	background-color: rgba(255, 255, 255, 0.9);
	transform: translateY(-50%);
	z-index: 2;
	opacity: 0;
	transition: opacity 0.6s ease;
}

/* Show lines smoothly when moved */
.hero-banner .carousel-indicators.first-slide-moved [data-bs-slide-to="0"]::after,
.hero-banner .carousel-indicators.second-slide-moved [data-bs-slide-to="1"]::after,
.hero-banner .carousel-indicators.third-slide-moved [data-bs-slide-to="2"]::after {
	opacity: 1;
}

/* Mega Menu */


/* .mega-menu-section:hover {
background: linear-gradient(180deg, #000000 -14.81%, #FF2F2F 49.36%);
color: #fff;
height: 100%;
} */
.mega-menu-section:hover .mega-menu-heading {
	font-weight: 600;
}

.mega-menu-section ul {
	list-style: none;
	padding: 0;
	position: relative;
	z-index: 1;
	text-align: center;
	padding-top: 48%;
	opacity: 0;
	visibility: hidden;
	transition: 0.6s;
}

.mega-menu-section:hover ul {
	opacity: 1;
	visibility: visible;
}

.mega-menu-section ul:after {
	position: absolute;
	content: "";
	left: 50%;
	transform: translateX(-50%);
	top: 23%;
	background-color: var(--white);
	width: 25%;
	height: 1px;
	opacity: 0;
	visibility: hidden;
	transition: 0.4s;
}

.mega-menu-section:hover ul:after {
	opacity: 1;
	visibility: visible;
}

.mega-menu-section ul li {
	opacity: 0;
	transform: translateX(-50px);

}

.mega-menu-section ul li a {
	font-weight: 600;
	transition: all 0.5s ease;
	font-size: 0.8rem;
	display: block;
	line-height: 1.4;
	color: var(--white);
}

.mega-menu-section ul li:not(:last-child) {
	padding-bottom: 25px;
}

.mega-menu.active .mega-menu-section ul li {
	opacity: 1;
	transform: translateX(0);
}

.mega-menu-section ul li:nth-child(1) {
	transition-delay: 0.1s;
}

.mega-menu-section ul li:nth-child(2) {
	transition-delay: 0.2s;
}

.mega-menu-section ul li:nth-child(3) {
	transition-delay: 0.3s;
}

.mega-menu-section ul li:nth-child(4) {
	transition-delay: 0.4s;
}

.mega-menu-section:hover ul li {
	color: #fff;
}

.mega-menu-section ul .submenu {
	display: none;
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	z-index: 999;
	padding: 10px 0;
}

.mega-menu-section ul li.has-submenu {
	position: relative;
}

.mega-menu-section ul li.has-submenu:hover .submenu {
	display: block;
}

.mega-menu-section ul .submenu li {
	white-space: nowrap;
	padding: 7px 15px;
}

.mega-menu-section ul .submenu li a {
	color: var(--white);
	text-decoration: none;
	font-weight: 300;
	font-size: 0.75rem;
}

/* Hide submenu initially */
/* .submenu {
  display: none;
  position: absolute;
  background: #fff;
  padding: 10px;
  z-index: 10;
} */

/* Show submenu on hover */
.mega-menu-section .has-submenu:hover .submenu {
	display: block;
}

/* Smooth scroll/move animation */
.mega-menu-section .other-menues {
	transition: transform 0.5s ease;
}

/* Move other-menues downward on hover */
.mega-menu-section .has-submenu.webdevmenues:hover~.other-menues {
	transform: translateY(125px);
	/* adjust value as needed */
}



.mega-menu-section .parent-sub-menues::after {
	display: none !important
}







/* Image at Bottom */
.mega-menu-section:hover .section-image {
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.section-image {
	position: absolute;
	bottom: 20px;
	left: 50%;
	transform: translateX(-50%) translateY(20px);
	width: 100px;
	height: 100px;
	opacity: 0;
	object-fit: cover;
	border-radius: 10px;
	z-index: 0;
}

.mega-menu .mega-menu-img img {
	width: 100%;
	height: auto;
	object-fit: cover;
}

.mega-menu .mega-menu-img {
	margin-top: auto;
	opacity: 0;
	visibility: hidden;
	transition: 0.6s;
}

.mega-menu-section:hover .mega-menu-img {
	opacity: 1;
	visibility: visible;
}

/* -------------------------------------hero new css end---------------------------------- */

/* -----------------------------------------------------hero-bottom css------------------------------------------ */
.hero-bottom {
	background-color: var(--black);
	position: relative;
	overflow: hidden;
}

.hero-bottom .text-box a {
	color: var(--primary);
	font-size: 0.9rem;
}

.hero-bottom-flex {
	display: flex;
	gap: 100px;
}

.hero-bottom-flex .col-box {
	width: 100%;
	position: relative;
}

.hero-bottom-flex .col-box:first-child .text-box {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
}

.hero-bottom .shape-circle {
	position: absolute;
	right: -2.5%;
	top: 15%;
}

.hero-bottom .shape-circle .bubble {
	animation: float-rotate 8s ease-in-out infinite;
	width: 7vw;
}

.hero-bottom .main-p {
	font-weight: 300;
}

.arrow-animation {
	position: absolute;
	max-width: fit-content;
	bottom: -15%;
	right: 35%;
}

.arrow-animation .half-border {
	width: 4.95vw;
	height: auto;
}

.arrow-animation .white-arrow {
	position: absolute;
	top: -18%;
	right: -30%;
	width: 3.91vw;
	height: auto;
	animation: arrowMove45 2s ease-in-out infinite;
}

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

	50% {
		transform: translate(10px, -10px) rotate(0deg);
		/* opacity: 1; */
	}

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

/* ---------------------------------------step-section css--------------------------------------------- */
.step-section {
	position: relative;
}

.step-section .step-count {
	font-size: 1rem;
	color: var(--primary);
	margin-bottom: 15px;
}

.step-section .main-heading {
	margin-bottom: 15px;
}

.step-flex {
	display: flex;
	gap: 120px;
}

.step-flex .col-box {
	width: 100%;
}

.step-flex .main-heading {
	font-weight: 700;
}

.step-flex .col-box:first-child {
	margin-top: 8px;
}

.step-flex .col-box:nth-child(2) {
	margin-top: 45px;
}

.step-flex .col-box:nth-child(3) {
	margin-top: 90px;
}

.step-flex .col-box:nth-child(4) {
	margin-top: 135px;
}

.step-flex .col-box ul {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
	margin-top: 15px;
}

.step-flex .col-box ul li {
	font-size: 0.6875rem;
	color: var(--black);
	text-transform: uppercase;
}

.step-flex .col-box ul li:not(:last-child) {
	margin-bottom: 15px;
}

.step-flex .span-p {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--black);
	margin-bottom: 4px;
	display: block;
}

.step-section .circle-move-box {
	display: flex;
	align-items: center;
	gap: 15px;
	justify-content: end;
	margin-bottom: -4%;
	position: relative;
}

.step-section .circle-move-box .text {
	font-size: 0.8rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--black);
}

.step-section .circle-move-box .text span {
	color: var(--primary);
}

.step-section .step-vertical-line {
	position: absolute;
	left: 12%;
	top: 0;
	background: #efefefcc;
	width: 1px;
	height: 100%;
}

.step-section .step-vertical-line:nth-child(2) {
	left: 38%;
}

.step-section .step-vertical-line:nth-child(3) {
	left: unset;
	right: 38%;
}

.step-section .step-vertical-line:last-child {
	left: unset;
	right: 12%;
}

/* ---------------------------------------------home-solution css--------------------------------------- */
.home-solution {
	background-color: var(--black);
	padding-top: 40px;
}

.solution-div .third-box ul {
	padding-left: 20px;
	margin-bottom: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	column-gap: 20px;
	max-height: 0;
	overflow: hidden;
	opacity: 0;
	transition: opacity 1s, max-height 1s;
}

.solution-div.active .third-box ul {
	max-height: 300px;
	opacity: 1;
}

.solution-div .third-box ul li {
	padding-bottom: 10px;
}

.solution-div .third-box ul li a {
	color: var(--white);
	transition: 0.3s all ease-in-out;
}

.solution-div .third-box ul li:hover::marker {
	color: var(--primary);
	background-color: var(--primary);
	transition: 0.3s all ease-in-out;

}

.solution-div .third-box ul li:hover a {
	color: var(--primary);
}



.solution-div {
	display: flex;
	gap: 5%;
	padding: 20px 0;
	transition: 1s ease-in-out;
}

.solution-div:not(:last-child) {
	border-bottom: 1px solid #ffffff38;
}

.solution-div .first-box {
	width: 30%;
	display: flex;
	align-items: center;
	gap: 25px;
	height: fit-content;
}

.solution-div .second-box {
	width: 20%;
	text-align: center;
}

.solution-div .third-box {
	width: 40%;
}

.solution-div .first-box .solution-h {
	font-size: 1.8rem;
	font-weight: 700;
}

.solution-div .first-box .solution-h a {
	color: var(--white);
}

.solution-div .first-box img {
	max-width: 25px;
}

.solution-div .second-box .img-box {
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.solution-div .second-box img {
	width: 0;
	height: 0;
	opacity: 0;
	filter: blur(10px);
	transition: width 1s, height 1s, opacity 1s, filter 1s ease;
	object-fit: cover;
}

.solution-div.active .second-box img {
	width: 80%;
	height: 220px;
	opacity: 1;
	filter: blur(0);
	object-fit: contain;
}

.solution-div-col {
	padding-top: 35px;
}


/* ---------------------------------------home-project section css---------------------------------------------- */

.home-mbl-portfolio-section .item {
	transition: transform 0.3s ease;
}

.home-mbl-portfolio-section .item img {
	width: 100%;
	height: auto;
	display: block;

}

.home-mbl-portfolio-section .item:hover {
	transform: scale(1.02);
}

.portfolio-mobile {
	background-image: url("../images/mobie-portfolio-bg-case-deatils.png");
	background-size: cover;
	/* Image poore area me fit hogi */
	background-position: center;
	/* Center align hoga */
	background-repeat: no-repeat;
	/* Repeat nahi hoga */
	width: 100%;
	padding-block: 50px;
	margin-block: 40px;
}


/* ---------------------------------------home-project section css---------------------------------------------- */
.home-project {
	background-color: var(--black);
	padding-top: 40px;
}

.home-project-slider-1 {
	margin-top: 20px;
	padding-left: 50px;
}

.home-project-slider .item {
	position: relative;
}

.home-project-slider .item:hover .overlay .right a {
	color: var(--primary);
}

.home-project-slider .item:hover .right a:after {
	background-color: var(--primary);
}

/* .home-project-slider .overlay  {
} */

.home-project-slider .item:after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	background: linear-gradient(to top, #000000f7 5%, transparent 95%);
	height: 50%;
	width: 100%;
}

.home-project-slider .overlay {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: 30px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	z-index: 2;
}


.home-project-slider .overlay.first {
	flex-direction: row-reverse;
}

.home-project-slider .overlay.first .left {
	text-align: left;
}

.home-project-slider .overlay p {
	margin-bottom: 0;
	font-size: 0.8rem;
	font-weight: 300;
	margin-top: 2px;
}

.home-project-slider .overlay .right a {
	color: var(--white);
	font-size: 0.9rem;
	position: relative;
	padding-right: 35px;
	transition: 0.3s all ease-in-out
}

.home-project-slider .overlay .right a:hover {
	color: var(--primary);
}

/* .home-project-slider .overlay .right a */

.home-project-slider .overlay .right a:after {
	position: absolute;
	content: "";
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	background-color: var(--white);
	height: 1px;
	width: 30px;
	transition: 0.3s all ease-in-out
}

.home-project-slider .overlay .right a:hover:after {
	background-color: var(--primary)
}

.home-project-slider-2 {
	margin-top: 40px;
	padding-right: 50px;
}

.home-project-slider-2 .overlay {
	flex-direction: row-reverse;
	text-align: left;
}

/* new  */

.home-project-slider-1 .owl-stage-outer.no-padding {
	padding-left: 0 !important;
	padding-right: 0 !important;
}



/* ----------------------------------home-counter section css----------------------------- */
.happy-client {
	font-size: 1.1458vw;
	line-height: 1.2;
	letter-spacing: 10px;
	text-transform: uppercase;
	cursor: pointer;
}

.happy-client span:nth-child(5) {
	margin-right: 15px
}

.happy-client span {
	display: inline-block;
	transform: translateY(0);
	/* reset position */
}

.happy-client:hover span {
	animation: subtle-lift 0.4s ease-in-out forwards;
}

/* Hover Animations with delay */
.happy-client:hover span:nth-child(1) {
	animation: subtle-lift 0.4s ease-in-out 0s forwards;
}

.happy-client:hover span:nth-child(2) {
	animation: subtle-lift 0.4s ease-in-out 0.05s forwards;
}

.happy-client:hover span:nth-child(3) {
	animation: subtle-lift 0.4s ease-in-out 0.1s forwards;
}

.happy-client:hover span:nth-child(4) {
	animation: subtle-lift 0.4s ease-in-out 0.15s forwards;
}

.happy-client:hover span:nth-child(5) {
	animation: subtle-lift 0.4s ease-in-out 0.2s forwards;
}

.happy-client:hover span:nth-child(6) {
	animation: subtle-lift 0.4s ease-in-out 0.25s forwards;
}

.happy-client:hover span:nth-child(7) {
	animation: subtle-lift 0.4s ease-in-out 0.3s forwards;
}

.happy-client:hover span:nth-child(8) {
	animation: subtle-lift 0.4s ease-in-out 0.35s forwards;
}

.happy-client:hover span:nth-child(9) {
	animation: subtle-lift 0.4s ease-in-out 0.4s forwards;
}

.happy-client:hover span:nth-child(10) {
	animation: subtle-lift 0.4s ease-in-out 0.45s forwards;
}

.happy-client:hover span:nth-child(11) {
	animation: subtle-lift 0.4s ease-in-out 0.5s forwards;
}

.happy-client:hover span:nth-child(12) {
	animation: subtle-lift 0.4s ease-in-out 0.55s forwards;
}

.happy-client:hover span:nth-child(13) {
	animation: subtle-lift 0.4s ease-in-out 0.6s forwards;
}

.happy-client:hover span:nth-child(14) {
	animation: subtle-lift 0.4s ease-in-out 0.65s forwards;
}

.happy-client:hover span:nth-child(15) {
	animation: subtle-lift 0.4s ease-in-out 0.7s forwards;
}

@keyframes subtle-lift {
	0% {
		transform: translateY(0);
		text-shadow: none;
	}

	100% {
		transform: translateY(-12px);
		text-shadow: 0 4px 12px rgba(255, 255, 255, 0.3);
	}
}

.counter-unique-main {
	display: flex;
	font-size: 5.21vw;
	color: #fff;
	letter-spacing: 5px;
}

.counter-unique-static {
	font-weight: bold;
}

.counter-unique-digit-container {
	position: relative;
	width: 65px;
	height: 120px;
	overflow: hidden;
	display: inline-block;
	color: #434343;
}

.counter-unique-tens {
	/* margin-top: 10px; */
	position: relative;
}

.counter-unique-ones {
	/* margin-top: -10px; */
	position: relative;
}

.counter-unique-tens:after,
.counter-unique-ones:after {
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
	width: 100%;
	height: 70%;
	background: linear-gradient(180deg, rgba(99, 99, 99, 0) 37.03%, #000000 69.58%);
}

.counter-unique-tens:before,
.counter-unique-ones:before {
	position: absolute;
	content: "";
	top: 0;
	left: 0;
	width: 100%;
	height: 70%;
	background: linear-gradient(0deg, rgba(99, 99, 99, 0) 37.03%, #000000 69.58%);
	z-index: 1;
}

.counter-unique-digit {
	position: absolute;
	font-weight: bold;
	text-align: center;
	width: 100%;
	top: 0;
}

.counter-unique-animate-in {
	animation: counter-unique-slide-in 0.5s ease-in-out alternate forwards;
}

.counter-unique-animate-out {
	animation: counter-unique-slide-out 0.5s ease-in-out alternate forwards;
}

@keyframes counter-unique-slide-in {
	0% {
		top: 100%;
		opacity: 0;
	}

	100% {
		top: 0;
		opacity: 1;
	}
}

@keyframes counter-unique-slide-out {
	0% {
		top: 0;
		opacity: 1;
	}

	100% {
		top: -100%;
		opacity: 0;
	}
}

.counter-right .text {
	line-height: 1.6;
	font-weight: 300;
}

.stats-counter {
	display: flex;
	gap: 40px;
	justify-content: space-between;
	margin-top: 20px;
}

.stats-counter .stats-item {
	background-color: #0F0F0F;
	border-radius: 4px;
	padding: 15px 35px;
	text-align: center;
	width: 100%;
}

.stats-counter .stats-number {
	font-size: 2.5vw;
	font-weight: bold;
	color: var(--primary);
	margin: 0;
}

.stats-counter .stats-label {
	font-size: 0.875rem;
	color: var(--white);
	margin-bottom: 0;
	line-height: 1.3;
}

.marquee-section {
	background: var(--black);
}

.marquee-container {
	width: 100%;
	overflow: hidden;
	box-sizing: border-box;
	border-top: 1px solid #262626;
}

.marquee-container .marquee-content {
	display: inline-flex;
	white-space: nowrap;
	animation: marqueeMove 30s linear infinite;
}

.marquee-container .marquee-text {
	font-size: 5vw;
	color: #434343;
	letter-spacing: 2px;
	font-weight: bold;
	margin: 0 30px;
	white-space: nowrap;
	line-height: 1.5;
}

.marquee-container .marquee-text span {
	color: #555555;
	opacity: 0.4;
}

@keyframes marqueeMove {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-50%);
	}
}

/* --------------------------------------home-why-us css---------------------------------- */
.home-why-us .content-box {
	position: sticky;
	top: 70px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	height: 100%;
}

.home-why-us .cta-2-btn .img-box {
	position: relative;
	width: max-content;
	border-radius: 50%;
	width: 9.58vw;
	margin-top: 20px !important;
	margin: auto;
}

.home-why-us .cta-2-btn .img-box span img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	filter: brightness(0) saturate(100%) invert(31%) sepia(64%) saturate(5460%) hue-rotate(347deg) brightness(103%) contrast(98%);
}

.home-why-us .cta-2-btn .img-box>a>img {
	animation: rotate360 10s linear infinite;
}

.home-why-us .main-heading {
	margin-bottom: 4px;
}

.home-why-us .box-content {
	border: 1px solid var(--dark-gray);
	border-radius: 16px;
	transition: 0.4s;
	margin-right: 15px;
}

.home-why-us .box-content:hover {
	background-color: var(--black);
	box-shadow: rgba(0, 0, 0, 0.2) 0px 60px 40px -7px;
}



.home-why-us .box-content .small-heading {
	padding: 25px 17px;
	border-bottom: 1px solid var(--dark-gray);
	color: var(--light-black);
	font-size: 1.12rem;
	transition: 0.4s;
}

.home-why-us .box-content:hover .small-heading {
	color: var(--white);
}

.home-why-us .box-content .main-p {
	transition: 0.4s;
}

.home-why-us .box-content:hover .main-p {
	color: var(--white);
}

.home-why-us .box-content .bottom-box {
	position: relative;
	padding: 15px 17px 40px;
	min-height: 256px;
}

.home-why-us .box-content .bottom-box img {
	position: absolute;
	bottom: 0;
	left: calc(100% - 135px);
	width: 135px;
	transition: 0.8s;
}

.home-why-us .box-content:hover .bottom-box img {
	filter: invert(1);
	left: 0;
}

/* ------------------------------------industries section css--------------------------------- */
.industries {
	overflow: hidden;
}

.industries .main-heading {
	margin-bottom: 0;
}

.industries .industries-top .main-p {
	padding-right: 10%;
	padding-left: 6%;
}

.industries-slider {
	display: flex;
	margin-top: 25px;
	gap: 35px;
}

.industries-slider .left-list {
	width: 24%;
}

.industries-slider .list-item {
	padding: 15px 20px;
	cursor: pointer;
	display: flex;
	align-items: center;
	color: #333;
	font-weight: 500;
	border-radius: 4px;
	background-color: var(--light-blue);
	transition: 0.4s;
	gap: 14px;
	text-transform: uppercase;
}

.industries-slider .list-item:not(:last-child) {
	margin-bottom: 10px;
}

.industries-slider .list-item img {
	max-width: 34px;
	height: auto;
}

.industries-slider .list-item.active,
.industries-slider .list-item:hover {
	background-color: var(--white);
	/* box-shadow: 0px 16px 32px 0px #16223329;
box-shadow: 0px 4px 12px -4px #1622331F; */
	box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
	position: relative;
	z-index: 2;
}

.industries-slider .list-item i {
	margin-right: 10px;
	font-size: 18px;
}

.industries-slider .carousel-container {
	flex: 1;
	width: calc(100% - 24% - 35px);
	height: 100%;
	background-color: var(--light-blue);
}

.industries-slider .owl-carousel .item {
	background-color: var(--light-blue);
	padding: 24px;
}

.industries-slider .owl-carousel .item .indestries-white li {
	margin-bottom: 8px;
}

.right-side-flex {
	display: flex;
	align-items: end;
	gap: 25px;
}

.right-side-flex img {
	width: 16.875vw !important;
	height: auto;
}

.right-side-flex ul li {
	font-size: 1rem;
	color: var(--light-black);
}

.industries-slider .carousel-container .small-heading {
	margin-top: 18px;
}

.industries-slider .item .main-p {
	width: 91%;
	line-height: 2;
	margin-top: 10px;

}

/* new */
body.scroll-locked {
	overflow: hidden;
	/* disable page scroll when locked */
}

.swipe-section {
	position: relative;
	overflow: hidden;
	height: 100vh;
	/* or whatever height */
}

.swipe-section .panel {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	transition: transform 0.75s ease;
	/* initial transforms set by JS */
}


/* ------------------------------------------------------testimonial section css------------------------------------------------ */
.new-testimonial {
	background-color: var(--black);
}

.new-testimonial .options {
	display: flex;
	flex-direction: row;
	align-items: center;
	overflow: hidden;
	min-width: 600px;
	width: 100%;
	height: 400px;
	margin: auto;
}

.new-testimonial .options .option {
	position: relative;
	overflow: hidden;
	width: 100px;
	margin: 10px;
	background: var(--optionBackground, var(--defaultBackground, var(--primary)));
	background-size: auto 120%;
	background-position: center;
	cursor: pointer;
	transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
	height: 360px;
}

.new-testimonial .options .option.active {
	flex-grow: 10000;
	transform: scale(1.1);
	max-width: 675px;
	width: 675px;
	margin: 0px;
	background-size: cover;
	margin: 0 45px;
	height: 364px;
}

.new-testimonial .options .option.active .label {
	bottom: 20px;
	left: 20px;
	background-color: transparent;
}

.new-testimonial .options .option.active .label .info>div {
	left: 0px;
	opacity: 1;
}

.new-testimonial .options .option:not(.active) {
	flex-grow: 1;
}

.new-testimonial .options .option:not(.active) .label {
	bottom: 10px;
	left: 10px;
}

.new-testimonial .options .option:not(.active) .label .info>div {
	left: 20px;
	opacity: 0;
}

.new-testimonial .options .option .shadow {
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: 120px;
	transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
}

.new-testimonial .options .option .label {
	display: flex;
	position: absolute;
	right: 0px;
	height: 40px;
	transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95);
	background-color: transparent;
}

.new-testimonial .options .option .label .info {
	display: flex;
	flex-direction: column;
	justify-content: center;
	margin-left: 10px;
	color: white;
	white-space: normal;
}

.new-testimonial .options .option .label .info>div {
	position: relative;
	transition: 0.5s cubic-bezier(0.05, 0.61, 0.41, 0.95), opacity 0.5s ease-out;
}

.new-testimonial .options .option .label .info .main {
	font-weight: bold;
	font-size: 1.2rem;
}

.new-testimonial .options .option .label .info .sub {
	transition-delay: 0.1s;
	font-size: 0.9rem;
	font-weight: 400;
}

.new-testimonial .option .video-box {
	height: 100%;
	position: relative;
	display: none;
	width: 100%;
}

.new-testimonial .option .video-box video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.new-testimonial .option.active .video-box {
	display: block;
}

.new-testimonial .option.active .video-box::after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	width: 100%;
	height: 50%;
	background: linear-gradient(to top, #000000e3, #00000070, #22222200);
	pointer-events: none;
}

.new-testimonial .option .video-box .video-play {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	background: #fff;
	padding: 5px;
	border-radius: 50%;
	max-width: 60px;
	transition: 0.3s ease;
}

.new-testimonial .option .video-play.hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.new-testimonial .option .video-box .video-play a {
	display: flex;
	height: 10%;
	width: 100%;
	align-items: center;
	justify-content: center;
}

.new-testimonial .option .video-box .video-play .img-2 {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	max-width: 12px;
}

.new-testimonial .option .video-box .video-play .img-1 {
	animation: rotate360 6s linear infinite;
	transform-origin: center center;
}

@keyframes rotate360 {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

.new-testimonial .option .main-text {
	transform: rotate(270deg);
	color: var(--white);
	font-weight: bold;
	white-space: nowrap;
}

.new-testimonial .option {
	display: flex;
	align-items: center;
	justify-content: center;
}

.new-testimonial .option.active .main-text {
	display: none;
}

/* .new-testimonial .option:last-child .main-text,
.new-testimonial .option:nth-last-child(2) .main-text {
	transform: rotate(90deg);
} */

/* --------------------------------------------home-skills section slider css----------------------------------------- */
.home-skills {
	overflow: hidden;
	background-color: #0A0A0A;
}

.home-skills .left-side-h {
	font-size: 1rem;
	line-height: 1.4;
	font-weight: 600;
}

.home-skills .left-side-p {
	font-size: 1rem;
	line-height: 1.4;
	margin-bottom: 0;
	font-weight: 300;
}

.home-skills-slider .items {
	display: flex;
	align-items: center;
	gap: 15px;
}

.home-skills-slider .items img {
	/* max-width: 35px; */
	height: auto;
}

.home-skills-box {
	display: flex;
	align-items: center;
}

.home-skills-box .left-side {
	width: 20%;
	padding: 20px 0;
	padding-right: 25px;
	border-right: 1px solid #212121;
}

.home-skills-box .marquee-box {
	overflow: hidden;
	width: calc(100% - 20%);
}

.home-skills-slider.marquee-content {
	display: inline-flex;
	white-space: nowrap;
	animation: marqueeMove 20s linear infinite;
}

.home-skills-slider.marquee-content .items {
	margin: 0 35px;
}

.marquee-box.less-than-10 {
    display: flex;
    justify-content: center;
}

/* .marquee-box.less-than-10 .home-skills-slider.marquee-content{
    animation:unset
} */

@keyframes marqueeMove {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-50%);
	}
}

/* ------------------------------------------------------home blog section css------------------------------------------------ */

.home-blog {
	overflow: hidden;
}

.blog-slider {
	margin-top: 25px;
}

.blog-slider .owl-stage-outer {
	overflow: visible;
	padding: 0 16%;
}

.blog-slider .items a {
	height: 100%;
	display: inline-block;
	width: 100%;
}

.blog-slider .items a img {
	height: 100%;
	object-fit: cover;
	width: 100%;
}

.blog-slider .items {
	position: relative;
	display: flex;
	height: 100%;
	min-height: 100%;
	max-height: 450px;
	min-height: 450px;
}



.blog-slider .items:after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(to top, #000000, #00000070, #2222223d);
}

.blog-slider .text-box {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	padding: 25px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	z-index: 2;
}

.blog-slider .sub-heading {
	font-weight: 700;
	color: var(--white);
	padding-right: 10%;
}

.blog-slider .date {
	font-size: 1rem;
	text-transform: uppercase;
	margin-bottom: 5px;
	color: var(--white);
}

.blog-slider .blog-tag {
	display: flex;
	gap: 20px;
}

.blog-slider .blog-tag a {
	font-size: 0.9rem;
	color: var(--white);
	font-weight: 300;
	border: 1px solid var(--white);
	padding: 2px 10px;
	width: auto;
}

.blog-slider .blog-tag .blog-tag-1 {
	background-color: var(--primary);
	box-shadow: 0px 8.87px 21.29px 0px #FF878994;
	width: auto;
}

.blog-slider .blog-tag .blog-tag-2 {
	background-color: transparent;
}

.home-blog-dark {
	background-color: var(--black);
}

/* -------------------------------------faq section css---------------------------------- */
.faq {
	position: relative;
	overflow: hidden;
}

.faq .faq-h {
	display: block;
	color: var(--primary);
	font-size: 1rem;
	margin-bottom: 15px;
	text-transform: uppercase;
}

.faq .content-box {
	padding-right: 5%;
}

/* .faq-accordian {
    max-height: 400px;
    overflow-y: auto;
} */

.faq .faq-accordian {
	padding-left: 10%;
}

.faq .accordion-item {
	background: #0F0F0F;
	border: none;
	padding: 20px;
	border-radius: 4px;
}

.faq .accordion-item:not(:last-child) {
	margin-bottom: 25px;
}

.faq-accordian .accordion-button {
	font-size: 1rem;
	color: var(--white);
	padding: 0;
	background: transparent;
	box-shadow: none;
	padding-right: 50px;
	font-weight: 300;
}

.faq-accordian .accordion-button:focus {
	box-shadow: none;
}

.faq .accordion-body {
	padding: 0px 0px;
	padding-top: 18px;
	font-size: 0.875rem;
	color: var(--white);
	padding-right: 50px;
	line-height: 2;
	font-weight: 300;
}

.faq .accordion-body p {
	margin-bottom: 0;
}

.faq-accordian .accordion-button.collapsed:after {
	background-image: url('https://itxitpro.ae/demo/wp-content/uploads/2025/06/plus.png');
	box-shadow: none;
	background-color: transparent;
}

.faq-accordian .accordion-button:after {
	background-image: url('https://itxitpro.ae/demo/wp-content/uploads/2025/06/minus.png');
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	transition: 0.4s;
	height: 35px;
	width: 35px;
	background-position: center;
}

/* .faq .content-box {
position: sticky;
top: 70px;
} */
.faq .shape-circle {
	position: absolute;
	left: -2.5%;
	bottom: 3%;
}

.faq .shape-circle .bubble {
	animation: float-rotate 8s ease-in-out infinite;
	width: 7vw;
}

/* ---------------------------------------------cta-1 css-------------------------------------------- */
.cta-1 {
	padding: 45px 0 70px;
	background-image: url(../images/cta-1-bg.jpg);
	position: relative;
	overflow: hidden;
	cursor: none;
}

.cta-1 .top-text {
	display: flex;
	gap: 5%;
}

.cta-1 .top-text .top-h {
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.7;
}

.cta-1 .top-text .top-p {
	font-size: 0.75rem;
	font-weight: 300;
	line-height: 1.6;
	display: block;
}

.cta-1 .top-text .top-text-img img {
	filter: brightness(0) saturate(100%) invert(73%) sepia(61%) saturate(7431%) hue-rotate(358deg) brightness(98%) contrast(90%);
}

.cta-1 .cta-1-heading {
	color: var(--white);
	font-size: 3.6458vw;
	font-weight: 600;
	line-height: 1.3;
	padding: 45px 0;
}

.cta-1 .cta-1-heading span {
	color: var(--primary);
	letter-spacing: 1px;
	letter-spacing: 3px;
}

.outer-bottom-layer {
	background: #292929;
	padding-block: 10px;
}

.cta-1 .bottom-box .small-heading {
	color: #676767;
	font-weight: 500;
	letter-spacing: 1.5px;
	transition: 0.4s;
}

.cta-1 .bottom-box {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.cta-1 .bottom-box ul {
	padding-left: 0;
	display: inline-flex;
	gap: 4rem;
	list-style: none;
	margin-bottom: 0;
}

.cta-1 .bottom-box ul a {
	color: var(--white);
	font-size: 1rem;
	font-weight: 300;
	transition: 0.4s;
}

.cta-1 .bottom-box ul a:hover,
.cta-1 .bottom-box .small-heading:hover {
	color: var(--primary);
}

.cta-1 .cta-1-btn .img-box {
	position: absolute;
	width: max-content;
	background: var(--primary);
	border-radius: 50%;
	padding: 8px;
	right: 14%;
	width: 7.5vw;
}

.cta-1 .cta-1-btn .img-box span img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.cta-1 .cta-1-btn .img-box>a>img {
	animation: rotate360 10s linear infinite;
}

@keyframes rotate360 {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

.cta-1-btn {
	position: absolute !important;
	/* opacity: 0; */
	top: 0;
	left: 0;
	pointer-events: none;
	z-index: 2;
	transform: translate(-50%, -50%);
	transition: opacity 0.3s ease;
	will-change: transform;
}

/* cta-1 btn for mobile */

.cta-1-btn-mobile .img-box {
	position: absolute;
	width: max-content;
	background: var(--primary);
	border-radius: 50%;
	padding: 8px;
	right: 14%;
	width: 7.5vw;
}

.cta-1-btn-mobile .img-box span img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.cta-1-btn-mobile .img-box > a > img {
	animation: rotate360 10s linear infinite;
}

@keyframes rotate360 {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

.cta-1-btn-mobile {
	position: absolute !important;
	/* opacity: 0; */
top: 30%;
    pointer-events: none;
    z-index: 2;
    transform: translate(-50%, -50%);
    transition: opacity 0.3s 
ease;
    right: 5%;
    will-change: transform;
	display: none;
}



/* ----------------------------------------------footer-top css-------------------------------------------------- */
.footer-top .content-box {
	background-color: #55555569;
	border: 1px solid #434343;
	border-radius: 10px;
	padding: 20px;
	text-align: center;
	height: 100%;
}

.footer-top .country-n {
	color: var(--primary);
	display: block;
	font-weight: 600;
	font-size: 1rem;
	padding: 3px 0 5px;
	text-transform: uppercase;
}

.footer-top .heading-n {
	font-weight: 500;
	font-size: 1rem;
	padding: 3px 0 5px;
	text-transform: uppercase;
}

.footer-top .address-n {
	font-weight: 300;
	font-size: 0.8rem;
	line-height: 1.5 !important;
	display: block;
}

.main-footer {
	position: relative;
	overflow: hidden;
}

.main-footer .bubble {
	position: absolute;
	right: 0;
	max-width: 130px;
	height: auto;
	top: 25%;
	animation: float-rotate 8s ease-in-out infinite;
}

@keyframes float-rotate {
	0% {
		transform: translateY(0) rotate(0deg);
	}

	50% {
		transform: translateY(-50px) rotate(180deg);
	}

	100% {
		transform: translateY(0) rotate(360deg);
	}
}

.main-footer .row {
	position: relative;
}

.main-footer .row:after {
	position: absolute;
	content: "";
	top: -45px;
	left: 50%;
	transform: translateX(-50%);
	background-color: #4B4B4B;
	width: calc(100% - 24px);
	height: 1px;
}

.main-footer .about-p {
	color: var(--white);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.4;
	margin: 0;
	padding: 15px 0;
}

.main-footer .footer-about img {
	width: 4.84375vw;
	height: auto;
}

.footer-h {
	font-size: 1rem;
	color: var(--white);
	font-weight: 500;
	margin-bottom: 18px;
	text-transform: uppercase;
}

.footer-menu {
	padding-left: 0;
	list-style: none;
	margin-bottom: 0;
}

.footer-menu a {
	font-size: 0.75rem;
	color: var(--white);
	font-weight: 300;
	transition: 0.4s;
}

.footer-menu a:hover {
	color: var(--primary);
}

.footer-menu li {
	position: relative;
	padding-left: 12px;
}

.footer-menu li:after {
	position: absolute;
	content: "";
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 3px;
	height: 3px;
	background-color: var(--white);
	border-radius: 50%;
}

.footer-menu li:not(:last-child) {
	margin-bottom: 12px;
}

.footer-menu-col-2 {
	width: max-content;
	margin-left: auto;
}

.footer-bottom .row {
	border: 1px solid #4B4B4B;
	border-radius: 10px;
	padding: 6px 2px;
	margin: 0;
}

.footer-bottom .footer-rating {
	background-color: #282828;
	padding: 6px 10px;
	width: max-content;
	border-radius: 4px;
	margin-left: -8px;
}

.footer-bottom .bottom-text {
	align-content: center;
}

.footer-bottom .bottom-text .f-12 {
	border-left: 1px solid #252525;
	padding-left: 25px;
}

.subscriber {
	margin-right: -6px;
}

.subscriber form {
	text-align: end;
	align-content: center;
}

.subscriber form input {
	background-color: transparent;
	border: none;
	border-bottom: 1px solid #ccc;
	padding: 5px 0;
	font-size: 0.75rem;
	color: var(--white);
	max-width: 260px;
	width: 100%;
}

.subscriber form input::placeholder {
	color: #B1B1B1;
	font-size: 0.75rem;
	font-weight: 300;
	margin-right: 15px;
}

.subscriber form input:focus {
	outline: none;
}

.subscriber form button {
	padding: 5px 15px;
	background-color: var(--white);
	color: var(--primary);
	font-size: 0.75rem;
	width: max-content;
	border: none;
	font-weight: 600;
}

/*  --------------------preloader css ----------------------*/
#preloader {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(0deg, #EE6910, #000);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 9999;
}

#preloader.hide {
	animation: fadeOutBg 1s ease forwards;
}

@keyframes fadeOutBg {
	to {
		opacity: 0;
		visibility: hidden;
	}
}

.preloader-content {
	text-align: center;
	animation: contentFadeIn 0.5s ease forwards;
}

#preloader.hide {
	animation: fadeOutBg 0.8s ease forwards;
}

@keyframes contentFadeIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

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

@keyframes fadeOutBg {
	0% {
		opacity: 1;
		visibility: visible;
	}

	100% {
		opacity: 0;
		visibility: hidden;
	}
}

.preloader-logo {
	width: 100px;
	height: auto;
	opacity: 0;
	animation: popIn 1s ease forwards;
}

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

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

.preloader-tagline {
	margin-top: 15px;
	font-size: 1.5rem;
	display: flex;
	justify-content: center;
	gap: 8px;
	color: #fff;
}

.preloader-tagline span {
	opacity: 0;
	transform: translateY(20px);
	animation: waveFade 0.6s forwards;
}

.preloader-tagline span:nth-child(1) {
	animation-delay: 0.3s;
}

.preloader-tagline span:nth-child(2) {
	animation-delay: 0.6s;
}

.preloader-tagline span:nth-child(3) {
	animation-delay: 0.9s;
}

.preloader-tagline span:nth-child(4) {
	animation-delay: 1.2s;
}

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

/*  --------------------preloader css end ----------------------*/

/* -----------------------------------------service page css---------------------------------- */
.inner-hero-banner {
	position: relative;
}

/* .inner-hero-banner::after {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 0.8;
} */

.inner-hero-banner .container-fluid {
	position: absolute;
	left: 0;
	top: 55%;
	transform: translateY(-50%);
	z-index: 1;
}

.hero-inner-video {
	text-align: center;
	position: relative;
}

.hero-inner-video::after {
	position: absolute;
	content: "";
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 30%;
	height: 60%;
	background-color: var(--primary);
	opacity: 0.5;
	filter: blur(110px);
}

.hero-inner-video img {
	max-width: 65%;
	position: relative;
	z-index: 1;
	transform: rotate(30deg);
}

/* service-about css */
.service-about .other-p {
	font-weight: 300;
}

.service-about {
	background-color: var(--black);
	padding: 0 5%;
	position: relative;
	overflow-x: hidden;
}

.service-about .shape-circle {
	position: absolute;
	right: -50px;
	top: 30%;
}

.service-about-box {
	background-color: #191919;
	padding: 100px 9%;
	position: relative;
}

.service-about-box::after {
	position: absolute;
	content: "";
	left: 0;
	bottom: 0;
	width: 80%;
	height: 80%;
	background-image: url(https://itxitpro.ae/demo/wp-content/uploads/2025/07/service-about-shape.png);
	background-repeat: no-repeat;
	background-size: contain;
	z-index: 0;
	opacity: 0.05;
	pointer-events: none;
}

.service-about-accordian {
	position: relative;
	z-index: 1;
}

.service-about .box-heading {
	font-size: 2.34375vw;
	font-weight: 800;
	color: var(--white);
	text-transform: uppercase;
	border: 1px solid var(--black);
	border-radius: 15px;
	padding: 4px 25px;
	line-height: 1.2;
	cursor: pointer;
}

.service-about .box.active .box-heading {
	background-color: var(--black);
	cursor: pointer;
}

.service-about .box:not(:last-child) {
	margin-bottom: 25px;
}

.service-about .box {
	transition: all 0.5s ease;
}

.service-about .box .other-p {
	padding-top: 15px;
}


.service-accordian .accordion-item {
	border: none;
	background: none;
}

.service-accordian .accordion-item:not(:last-child) {
	margin-bottom: 25px;
}

.service-accordian .accordion-button {
	font-size: 2.34375vw;
	font-weight: 800;
	color: var(--white);
	text-transform: uppercase;
	border: 1px solid var(--black);
	border-radius: 15px !important;
	padding: 4px 25px;
	line-height: 1.2;
	box-shadow: none;
	background: var(--black);
}

.service-accordian .accordion-button.collapsed {
	background-color: transparent;
}

.service-accordian .accordion-button:focus {
	box-shadow: none;
}

.service-accordian .accordion-button a img {
	width: 30px !important;
}

.accordion-button a img {
	transition: width 0.3s ease;
}

.accordion-button:hover a img {
	filter: brightness(0) saturate(100%) invert(51%) sepia(93%) saturate(3241%) hue-rotate(358deg) brightness(98%) contrast(91%);
}

.service-accordian .accordion-button a {
	display: flex;
	align-items: center;

}

.service-accordian .accordion-body {
	padding: 12px 25px 0;
	font-size: 1rem;
	color: var(--white);
	line-height: 1.8;
	font-weight: 300;
}

.service-accordian .accordion-body p {
	margin-bottom: 0;
}

.service-accordian .accordion-button.collapsed:after {
	display: none;
}

.service-accordian .accordion-button:after {
	display: none;
}

/* === Wrapper styles === */
.client-video-carousel .portfolio-card {
	padding: 10px;
}

/* === Responsive video box with aspect ratio === */
.client-video-carousel .video-box {
	position: relative;
	width: 100%;
	overflow: hidden;
	border-radius: 10px;
	background-color: #000;
}

/* === Video fills the container === */
.client-video-carousel .video-box video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 10px;
}

/* === Gradient overlay at bottom === */
/* .client-video-carousel .video-box::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  height: 50%;
  width: 100%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.9), rgba(0, 0, 0, 0.5), transparent);
  pointer-events: none;
  border-radius: 10px;
} */


section.client-video-section {
	position: relative;
	display: block;
	float: left;
	height: auto;
	width: 100%;
	padding: 0;
	margin: 0;
}

/* === Play button styling === */
.client-video-carousel .video-box .video-play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: #fff;
	padding: 6px;
	border-radius: 50%;
	width: 60px;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.3s ease;
	z-index: 2;
}

.video-play.hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.video-play img {
	max-width: 100%;
	height: auto;
	display: block;
}




.about-counter {
	position: relative;
	background-color: var(--light-black);
}

.about-counter h2 {
	font-size: 3rem;
	font-weight: 700;
	position: relative;
}

.about-counter p {
	font-size: 1rem;
	text-transform: uppercase;
	color: var(--white);
}

/* Divider lines */
.about-counter .col-md-4:not(:last-child) {
	border-right: 1px solid rgba(255, 255, 255, 0.2);
}



/* service-marquee  */
.service-marquee .small-heading {
	font-weight: 300;
	margin-bottom: 20px;
}

.service-marquee {
	overflow: hidden;
	background-color: var(--black);
	padding: 35px 0;
}

.service-marquee .items {
	margin: 0 25px;
	border-radius: 8px;
	border: 1px solid #2F2F2F;
	width: 240px;
	height: 80px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.service-marquee .items img {
	max-height: 90%;
	padding: 10px;
	width: auto;
	opacity: 0.5;

}

.service-marquee .items img:hover {
	opacity: 1;
}

.service-marquee .service-marquee-box {
	overflow: hidden;
}

.service-marquee .marquee-content {
	display: flex;
	animation: marqueeMove 20s linear infinite;
	width: max-content;
}

@keyframes marqueeMove {
	0% {
		transform: translateX(0);
	}

	100% {
		transform: translateX(-50%);
	}
}

/* service-marquee end  */

/* -----------------------------key services section css--------------------------- */
.key-services {
	position: relative;
	padding-top: 25px;
	min-height: 890px;
}

.key-services .scroll-container {
	position: relative;
}

.scroll-container::-webkit-scrollbar {
	display: none;
}

.scroll-container {
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.key-services-section {
	position: relative;
}

.scroll-container .service-row .third-booton-img {
	position: absolute;
	bottom: 0;
	right: 0;
	max-width: 220px;
	transition: 0.5s all ease-in-out;
	transform: translateX(0);
}

.key-services-section::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 85px;
	height: 245px;
	background: url("../images/end-to-top.png") no-repeat center center;
	background-size: contain;
}

.key-services .service-row {
	position: absolute;
	background: var(--white);
	border-radius: 15px;
	border: 1px solid var(--black);
	z-index: 1;
	transition: height 0.5s ease;
}

.key-services .service-row:nth-child(1) {
	top: 0px;
	z-index: 1;
	border-top: none;
	overflow: hidden;
	border-top-right-radius: 0;
	/* min-height: 280px; */
}

.key-services .service-row:nth-child(2) {
	top: 265px;
	z-index: 2;
	margin-top: -20px;
	box-shadow: rgba(33, 35, 38, 0.1) 0px -10px 20px 0px;
	/* min-height:300px; */
}

.key-services .service-row:nth-child(3) {
	top: 560px !important;
	z-index: 3;
	margin-top: -60px;
	box-shadow: rgba(33, 35, 38, 0.1) 0px -10px 20px 0px;
	transition: 0.5s all ease-in-out;
	width: 100%;
	/* min-height: 320px; */
	overflow-x: hidden;
}


.key-services .service-row:nth-child(3):hover .third-booton-img {
	transform: translateX(-600%);
	transition: transform 0.3s ease;
	/* optional for smooth effect */
}



.keyservices-mobile .item {
	padding: 20px;
	position: relative;
	display: none;
}

.keyservices-mobile .item .service-card {
	border: 1px solid #ccc;
	padding: 10px;
	border-radius: 15px;
	margin-bottom: 15px;
}


.key-services .service-row:nth-child(1)::after {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	width: 22%;
	height: 1px;
	background-color: var(--black);
	border-radius: 15px;
}

.key-services .service-card {
	padding: 40px 30px;
	height: 100%;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	position: relative;
}

.key-services .service-card::after {
	position: absolute;
	content: "";
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: calc(100% - 80px);
	background-color: var(--dark-gray);
}

.key-services .service-card .small-heading {
	font-weight: 700;
	margin-bottom: 15px;
}

.key-services .service-card .service-card-p {
	font-size: 13px;
	line-height: 2;
	margin: 0;
	min-height: 135px;
	max-height: 135px;
	display: -webkit-box;
	-webkit-line-clamp: 5;
	overflow: hidden;
	-webkit-box-orient: vertical;

}

.key-services .row div:last-child .service-card::after {
	display: none;
}

.key-services .key-heading-box {
	display: flex;
	gap: 12px;
	position: sticky;
	top: 80px;
}

.key-services .key-heading-box .border-div {
	border: 1px solid var(--black);
	border-bottom: 15px;
	width: calc(100% - 22% - 12px);
	border-radius: 15px;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	position: relative;
}

.key-services .key-heading-box .border-div::after {
	position: absolute;
	content: "";
	left: -1px;
	bottom: 0;
	width: 1px;
	height: 10px;
	background-color: #fff;
}

.key-services .key-heading-box .main-heading {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
	border: 1px solid var(--black);
	border-radius: 15px;
	padding: 12px 40px;
	width: 22%;
	margin-bottom: 12px;
}

.key-services .key-heading-box .main-heading::after {
	position: absolute;
	content: "";
	right: -14px;
	bottom: -14px;
	width: 50px;
	height: 40px;
	border: 1px solid var(--black);
	border-radius: 15px;
	border-top: none;
	border-left: none;
	border-top-right-radius: 0;
	border-bottom-left-radius: 0;
}

.key-services .key-heading-box .flashing {
	width: 25px;
	height: 25px;
	transform: translateY(0%);
}

.key-services .key-heading-box .flashing:before {
	animation: flashing 2s 2s ease-out;
	border: 3px solid #ffffd0;
}

.key-services .key-heading-box .flashing:after {
	animation: flashing 2s 1s ease-in;
	border: 3px solid var(--primary);
}

.key-services .key-heading-box .flashing:before,
/* .uae-key-services .service-box .key-heading-box .flashing::before,
.uae-key-services .service-box .key-heading-box .flashing:after, */
.key-services .key-heading-box .flashing:after {
	content: "";
	width: 70%;
	height: 70%;
	display: block;
	border-radius: 50%;
	background: var(--primary);
	opacity: 0;
	animation-iteration-count: infinite;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}

@keyframes flashing {
	0% {
		-webkit-transform: scale(.1, .1);
		opacity: 0
	}

	50% {
		opacity: 1
	}

	100% {
		-webkit-transform: scale(1.2, 1.2);
		opacity: 0
	}
}

.key-services .service-row {
	animation: slideUp 0.6s ease-out;
}

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

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


.service-row {
	transition: background-color 0.6s ease-in-out;
	transition: all 0.6s all ease-in-out;
}

.service-row.active {
	transition: 0.5s all ease-in-out;
}

/* 
.key-services .service-row:nth-child(1) {
	height: 100px;
} */

/* .key-services .service-row:nth-child(1).active {
	height: 270px;
}

.key-services .service-row:nth-child(2) {
	height: 150px;
	overflow: hidden;
	transition: height 0.3s ease;
}

.key-services .service-row:nth-child(2).active {
	height: auto;
	overflow-y: auto;
}

.key-services .service-row:nth-child(3) {
	height: 90px;
	overflow-y: hidden;
}

.key-services .service-row:nth-child(3).active {
	height: auto;
	overflow-y: hidden;
} */


/* -----------------------------------service-stories section css----------------------------------- */
.service-stories {
	background-color: var(--black);
}

.service-stories-slider {
	position: relative;
}

.service-stories-slider .owl-carousel {
	position: relative;
}

.service-stories-slider .owl-stage-outer {
	overflow: hidden;
}

.service-stories-slider .owl-item {
	opacity: 0;
	transition: opacity 0.6s ease-in-out;
}

.service-stories-slider .owl-item.active {
	opacity: 1;
}

.service-stories-slider .slide-content {
	display: flex;
	height: 100%;
}

.service-stories-slider .left-content {
	padding-right: 20px;
	width: 34%;
	height: auto;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
}

.service-stories-slider .company-title {
	margin-bottom: 14px;
	color: var(--white);
	border-bottom: 1px solid #ffffff36;
	padding-bottom: 10px;
	text-transform: uppercase;
}

.service-stories-slider .company-subtitle {
	font-size: 1.85rem;
	margin-bottom: 15px;
	color: var(--white);
	font-weight: 600;
}

.service-stories-slider .services-title {
	margin-bottom: 12px;
	color: var(--white);
}

.service-stories-slider .slide-item {
	background: #191919;
	padding: 40px;
	border-radius: 16px;
}

.service-stories-slider .services-grid {
	display: flex;
	gap: 10px 45px;
	flex-wrap: wrap;
}

.service-stories-slider .service-item {
	position: relative;
	color: var(--white);
	font-size: 0.875rem;
	margin-bottom: 0;
	padding-bottom: 0;
}

.service-stories-slider .service-item::after {
	content: '|';
	position: absolute;
	right: -20px;
	color: var(--white);
}

.service-stories-slider .service-item:last-child::after {
	display: none;
}

.service-stories-slider .right-content {
	position: relative;
	width: 66%;
	display: flex;
}

.service-stories-slider .image-container {
	position: relative;
	width: 70%;
	height: 100%;
	object-fit: cover;
	border-radius: 16px;
	overflow: hidden;
}

.service-stories-slider .slide-image {
	object-fit: cover;
	aspect-ratio: 1 / 0.9;
}

.service-stories-slider .stats-section {
	width: 30%;
	padding-left: 40px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
}

.service-stories-slider .stats-box .stat-item:last-child {
	margin-top: 40px;
}

.service-stories-slider .stat-number {
	font-size: 5vw;
	font-weight: 700;
	line-height: 1;
	color: var(--white);
}

.service-stories-slider .stat-label {
	color: var(--white);
}

.service-stories-slider .slider-nav {
	display: flex;
	align-items: center;
	gap: 20px;
	justify-content: space-between;
	margin-bottom: 10px;
}

.service-stories-slider .nav-text {
	color: var(--white);
}

.service-stories-slider .nav-arrow {
	background: transparent;
	border: none;
	color: #ffffff;
	font-size: 1.2rem;
}

.service-stories-slider .nav-arrow:hover {
	background: rgba(255, 255, 255, 0.2);
	transform: scale(1.1);
}

.service-stories-slider .slider-btn-box {
	width: 9.11vw;
}

.service-stories-slider .thumbnail-preview img {
	object-fit: cover;
	aspect-ratio: 35 / 22;
}

.service-stories-slider .owl-nav {
	display: none !important;
}

.service-stories-slider .owl-dots {
	display: none !important;
}

.service-stories-slider .owl-carousel .owl-item {
	opacity: 0;
	transition: opacity 0.8s ease-in-out;
}

.service-stories-slider .owl-carousel .owl-item.active {
	opacity: 1;
}

.service-happy {
	overflow-x: hidden;
}

.service-happy .counter-box .box-p {
	font-weight: 300;
	letter-spacing: 20px;
}

.service-happy .shape-circle {
	position: absolute;
	right: -70px;
	top: 40%;
	z-index: 1;
}

.service-happy .counter-box {
	padding-left: 10%;
	width: max-content;
	margin: auto;
}

.service-happy .two-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 50px;
	margin-top: 20px;
}

.service-happy .two-box .box {
	background-color: #191919;
	padding: 10px 40px;
	width: max-content;
	border-radius: 10px;
	outline: 4px solid #191919;
	outline-offset: 1px;
	margin-bottom: 10px;
}

.service-happy .box-h {
	font-size: 7vw;
	line-height: 1;
	font-weight: 900;
	text-align: center;
	display: inline-block;
	background-image: url('https://itxitpro.ae/demo/wp-content/uploads/2025/07/masking-img.jpg');
	background-size: 200% auto;
	background-repeat: repeat-x;
	background-position: 0% 50%;
	background-attachment: scroll;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	color: transparent;
	animation: bgMove 10s linear infinite;
	will-change: background-position;
}

@keyframes bgMove {
	0% {
		background-position: 0% 50%;
	}

	100% {
		background-position: 100% 50%;
	}
}

/* ----------------------------------cta-2 css------------------------------------ */
.cta-2 {
	background-image: url('https://itxitpro.ae/demo/wp-content/uploads/2025/07/cta-2-bg.jpg');
	position: relative;
	overflow: hidden;
}

.cta-2::after {
	position: absolute;
	content: "";
	right: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg, rgba(17, 16, 16, 0.7) 1.28%, #A44709 100%);
	z-index: 0;
}

.cta-2-h {
	font-size: 2.86vw;
	font-weight: 800;
	line-height: 1.5;
}

.cta-2 .img-box {
	transform: translateX(200%);
	/* start off-screen to right */
	opacity: 0;
	transition: all 1.3s ease;
}

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

.cta-2.hovered .img-box {
	transform: translateX(0);
	opacity: 1;
	position: relative;
	z-index: 1;
	text-align: end;
	height: 100%;
}

.cta-2 .img-box img {
	width: 38vw;
	height: 100%;
}

.cta-2 .small-heading {
	font-weight: 400;
	line-height: 1.8;
}

.cta-2 .btn-arrow.btn-2 {
	color: #fff;
	border: 1px solid #ccc;
	padding: 15px 24px;
	width: 250px;
	display: inline-block;
	border-radius: 30px;
	letter-spacing: 4px;
	cursor: pointer;
	font-size: 15px;
}



.cta-2 .btn-arrow.btn-2::after {
	right: 20px;
	filter: brightness(0) invert(1);
}

/* ------------------------------tool-tab-sec----------------------- */
.tool-tab-sec {
	background-color: var(--black);
	overflow: hidden;
	position: relative;
}

.tool-tab-sec .bubble {
	position: absolute;
	top: 50%;
	left: 2%;
}


.tool-tab-sec .rotate-swipe-animation {
	position: absolute;
	top: 60%;
	right: 2%;
	margin: auto;
}

.tool-tab-sec .tab-box-ul {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	list-style: none;
	padding-left: 0;
	background: #191919;
	border-radius: 10px;
	margin-bottom: 0;
	overflow-x: auto;
	white-space: nowrap;
}

.tool-tab-sec .tab-box-ul .tab-item {
	flex: 1;
	text-align: center;
	position: relative;
}

.tool-tab-sec .tab-box-ul .tab-item::after {
	position: absolute;
	content: "";
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1px;
	height: 70%;
	background-color: #585858;
}

.tool-tab-sec .tab-box-ul .tab-item:last-child:after {
	display: none;
}

.tool-tab-sec .tab-box-ul button {
	border: none;
	color: var(--white);
	background-color: transparent;
	padding: 0;
	line-height: 1.2;
	padding: 12px 10px;
}

.tool-tab-sec .tab-box-ul button.active,
.tool-tab-sec .tab-box-ul button:hover {
	color: var(--primary);
}

.tool-tab-sec .tabs-content .grid-box {
	display: flex;
	width: 85%;
	margin: auto;
	gap: 60px;
	flex-wrap: wrap;
	justify-content: center;
}

.tool-tab-sec .tabs-content .grid-box .img-box {

	display: flex;
	align-items: center;
	justify-content: center;
	transition: 0.4s;
	position: relative;
	overflow: hidden;
	border: 1px solid #d9d9d924;
	padding-inline: 10px;
	min-height: 70px;
	border-radius: 8px;
	margin: 0 25px;
	min-width: 100px;
	text-align: center;

}

.tool-tab-sec .tabs-content .grid-box .img-box::before {
	content: '';
	position: absolute;
	top: 0;
	left: -150%;
	width: 200%;
	height: 100%;
	background: linear-gradient(45deg, transparent 45%, rgba(255, 255, 255, 0.3) 50%, transparent 55%);
	transform: translateX(0);
	transition: transform 0.8s ease;
	pointer-events: none;
	opacity: 0;
}

.tool-tab-sec .tabs-content .grid-box .img-box:hover::before {
	transform: translateX(110%);
	opacity: 0.5;
}

.tool-tab-sec .tabs-content .grid-box .img-box img {
	max-width: 45px;
	height: auto;
	transition: 0.4s;
}

.tool-tab-sec .tabs-content .grid-box .img-box:hover img {
	transform: scale(1.1);
}

.tool-tab-sec .tabs-content {
	padding-top: 45px;
}

.tool-tab-sec .tabs-content .tabcontent-box {
	display: none;
}

.tool-tab-sec .tabs-content .tabcontent-box.active {
	display: block;
}

/* ------------------------------------------our-process css------------------------------------------- */
.our-process {
	background-color: #F0F2F4;
	overflow: hidden;
	position: relative;
}

.our-process .box {
	display: flex;
	position: relative;
	z-index: 1;
	align-items: center;
	padding: 40px 0px;
}


#timelineSVG {
	position: absolute;
	top: 0;
	left: -60px;
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 0;
}

/* .our-process .box:not(:last-child) {
	margin-bottom: 35px;
} */

/* .our-process .box {
	padding-bottom: 35px;
} */

.our-process .box::after {
	position: absolute;
	content: "";
	right: -55px;
	bottom: 0;
	width: 91.5%;
	height: 1px;
	border-bottom: 1px solid var(--dark-gray);
}

.our-process .box:last-child::after {
	display: none;
}

.our-process .box::before {
	position: absolute;
	content: "";
	right: -55px;
	top: 0px;
	width: 0%;
	height: calc(100% + 2px);
	background: linear-gradient(90deg, rgba(240, 242, 244, 0) 0%, #FFFFFF 73.24%);
	z-index: -1;
	transition: 0.4s;
}

.our-process .box:hover::before {
	width: 100%;
}

.our-process .left {
	width: 60%;
	padding-right: 5%;
	padding-left: 4%;
	display: flex;
	align-items: center;
	gap: 10%;
	height: fit-content;
}

.our-process .left img {
	width: 50px;
	background: #F0F2F4;
	border-radius: 50%;
	height: 50px;
	padding: 3px;
}

.our-process .right {
	width: 40%;
}

.our-process .heading-box {
	padding-right: 18%;
}

/* --------------------------------------------------industries-service section css--------------------------------------- */

.industries-service {
	background-color: var(--light-blue);
	padding-bottom: 100px;
}

.industries-service .rotate-swipe-animation .circle-white,
.industries-service .rotate-swipe-animation .line-left {
	background-color: var(--black);
}

.industries-service .rotate-swipe-animation .swipe-container {
	justify-content: end;
}

.industries-service .rotate-swipe-animation .project-text a {
	color: var(--black);
}

.industries-service .rotate-swipe-animation {
	bottom: 0;
	margin-top: 30px;
	margin-bottom: 0;
}

.industries-service .heading-box {
	padding-right: 10%;
	position: sticky;
	top: 190px;
	transition: 0.3s all ease-in-out;
}

.ind-srv .box {
	padding: 35px 40px 0;
	border: 1px solid var(--primary);
	border-radius: 10px;
	display: flex;
	gap: 50px;
	justify-content: space-between;
	background: var(--white);
	position: sticky;
	transition: transform 0.5s ease-in-out;
}

section.industries-service .ind-srv .container {
	max-width: 90%;
}

.ind-srv .box .left {
	width: calc(65% - 50px);
	padding-bottom: 40px;
}

.ind-srv .box .right {
	width: 35%;
}

.ind-srv .box:nth-child(1) {
	top: 80px;
}

.ind-srv .icon-box {
	display: flex;
	align-items: center;
	gap: 10px;
}

.ind-srv .icon-box .icon img {
	max-width: 40px;
}

.ind-srv .box ul {
	margin-bottom: 0;
	list-style: none;
	font-size: 13px;
	margin-top: 18px;
	padding-left: 0;
}

.ind-srv .box ul li {
	position: relative;
	padding-left: 26px;
}

.ind-srv .box ul li::after {
	position: absolute;
	content: "";
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	background-size: contain;
	background-image: url(../images/checked.svg);
}

.ind-srv .box ul li {
	margin-bottom: 18px;
}

/* --------------------------------------service-client section css--------------------------------------- */
.service-client {
	background-color: var(--black);
	overflow-x: hidden;
}

.scs-heading {
	font-size: 3vw;
	font-weight: 700;
	line-height: 1.3;
}

.srv-slider-box .content-box {
	background-color: #191919;
	border-radius: 10px;
	height: 100%;
	padding: 30px;
}

.srv-slider-box .content-box .box {
	display: flex;
	align-items: center;
	gap: 50px;
}

.srv-slider-box .content-box .box:first-child {
	padding-bottom: 20px;
}

.srv-slider-box .content-box .box:not(:first-child) {
	padding-top: 20px;
	border-top: 1px solid #95959545;
}

.srv-slider-box .content-box .box .img-box {
	width: 90px;
	height: 90px;
	background-color: var(--black);
	border-radius: 12px;
	padding: 13px;
}

.srv-slider-box .content-box .box .text-box {
	width: calc(100% - 50px - 90px);
}

.srv-slider-box .content-box .box .text-box .box-heading {
	font-size: 4.688vw;
	font-weight: 700;
	line-height: 1;
	margin-bottom: 5px;
}

.srv-slider-box {
	border: 1px solid #D9D9D9;
	border-radius: 20px;
	padding: 10px;
}

.srv-slider-box .items {
	display: flex;
	gap: 3%;
}

.srv-slider-box .items .left {
	width: calc(70% - 3%);
	padding: 25px 0 30px 35px;
	position: relative;
}

.srv-slider-box .items .right {
	width: 30%;
}

.service-client-slider .slider-div {
	width: 90%;
}

.service-quote {
	position: absolute;
	right: 0;
	bottom: 30px;
	width: 5.208vw;
}

.slider-btns {
	display: flex;
	align-items: center;
	gap: 30px;
}

.slider-btns .slider-btn {
	width: 45px;
	height: 45px;
	display: inline-flex;
	border: 1px solid #585858;
	border-radius: 6px;
	align-items: center;
	justify-content: center;
}

.slider-btns .slider-btn img {
	width: 16px;
}

.slider-btns .prev.slider-btn img {
	transform: scaleX(-1);
}

/* ---------------------------------------service details page css-------------------------------- */

.inner-detail-hero .hero-h {
	font-size: 3.125vw;
	line-height: 1.5;
}

.inner-detail-hero .hero-p {
	font-size: 1rem;
}

.hero-inner-image {
	text-align: center;
}

.hero-inner-image img {
	width: 65%;
}

/* -------------------------------we-are section css--------------------------------- */
.we-are {
	background-color: var(--black);
	overflow-x: hidden;
}

.we-are .shape-circle {
	position: absolute;
	right: 0;
	top: 30%;
}

.we-are .left-bubble {
	position: absolute;
	bottom: 30%;
	left: 0;
	animation: float-rotate 8s ease-in-out infinite;
}

.we-are .rotate-swipe-animation {
	position: absolute;
	bottom: 70px;
	left: 180px;
}


.we-are-heading {
	font-size: 7vw;
	line-height: 0.7;
	font-weight: 900;
	text-align: center;
	display: inline-block;
	background-image: url('https://itxitpro.ae/demo/wp-content/uploads/2025/07/masking-img.jpg');
	background-size: 200% auto;
	background-repeat: repeat-x;
	background-position: 0% 50%;
	background-attachment: scroll;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	color: transparent;
	animation: bgMove 10s linear infinite;
	will-change: background-position;
}

.we-are .icon-box {
	display: flex;
	gap: 15px;
	align-items: center;
	justify-content: space-between;
	background-color: #0F0F0F;
	padding: 15px;
	min-height: 100px;
}

.we-are .icon-box img {
	width: 35px;
	height: auto;
}

.we-are .icon-box .p {
	width: calc(100% - 15px - 35px);
}

.we-are .icon-box:not(:first-child) {
	margin-top: 20px;
}

/* ------------------------srv-slr-1-sec css--------------------- */
.srv-slr-1 .items {
	position: relative;
}


.srv-slr-1 .items .srv-slr-1-img {
	height: 100%;
	max-height: 450px;
	min-height: 450px;
	object-fit: cover;
}

.srv-slr-1 .items .content-box {
	position: absolute;
	left: 0;
	height: 100%;
	top: 0;
	width: 40%;
	z-index: 1;
	display: flex;
	flex-direction: column;
	gap: 30px;
	justify-content: space-between;
	padding: 35px;
	background: linear-gradient(90deg, #000000 7.81%, rgba(0, 0, 0, 0.8495) 99.31%, rgba(0, 0, 0, 0) 100%);
}

.srv-slr-1 .content-box .f-40 {
	margin-bottom: 0;
	padding-bottom: 15px;
	position: relative;
}

.srv-slr-1 .content-box .f-40:after {
	position: absolute;
	content: "";
	bottom: 0;
	left: 0;
	width: 20%;
	height: 1px;
	background-color: var(--white);
}

.srv-slr-1 .content-box .other-p {
	padding-top: 20px;
}

.srv-slr-1 .content-box .icon-box-1 {
	width: 45px;
}

.srv-slr-1 .content-box .icon-box-2 {
	width: 9vw;
	position: absolute;
	bottom: 0;
	right: 0;
}

/* ----------------------------srv-dls-process css------------------------ */
.srv-dls-process {
	background-color: var(--black);
}

.srv-dls-process .shape-circle {
	position: absolute;
	left: 0;
	top: 10%;
}

.srv-dls-process .top-box .overlay-image {
	text-align: center;
}

.srv-dls-process .top-box .overlay-image img {
	width: 7.29vw;
}

.srv-dls-process .top-box .top-box-h {
	font-size: 3vw;
	line-height: 1;
	position: relative;
	margin-top: 25px;
	margin-bottom: 60px;
}

.srv-dls-process .top-box .top-box-h a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.srv-dls-process .top-box .top-box-h span {
	width: 13vw;
	height: 30px;
	background: linear-gradient(90deg, #FF5400 0%, rgba(0, 0, 0, 0) 53.37%);
	display: block;
}

.srv-dls-process .top-box .top-box-h span.span-1 {
	background: linear-gradient(-90deg, #FF5400 0%, rgba(0, 0, 0, 0) 53.37%);
}

.middle-box .content-box {
	text-align: center;
	overflow: hidden;
}

.middle-box .content-box .box-h {
	font-size: 10.417vw;
	line-height: 1;
	color: var(--white);
	font-weight: 900;
	transition: 0.4s;
}

.middle-box .content-box:hover .box-h {
	color: var(--primary);
}

.middle-box .content-box p {
	font-size: 1.2rem;
	color: var(--white);
	margin-bottom: 0;
	line-height: 1.5;
	position: relative;
	margin-top: -72px;
	background: var(--black);
	padding: 8px 0;
	z-index: 1;
	overflow: hidden;
}

.middle-box .content-box p::after {
	position: absolute;
	content: "";
	top: -50%;
	left: 50%;
	transform: translateX(-50%);
	width: 95%;
	height: 110%;
	background: radial-gradient(circle, #585858f0 0%, transparent 100%);
	filter: blur(6px);
	z-index: -1;
	border-radius: 50%;
	transition: 0.4s;
}

.middle-box .content-box:hover p::after {
	opacity: 0;
}

.middle-box .content-box p::before {
	position: absolute;
	content: "";
	top: -50%;
	left: 50%;
	transform: translateX(-50%);
	width: 95%;
	height: 110%;
	background: radial-gradient(circle, var(--primary) 0%, transparent 100%);
	filter: blur(6px);
	z-index: -1;
	border-radius: 50%;
	opacity: 0;
	transition: opacity 0.4s ease;
	pointer-events: none;
}

.middle-box .content-box:hover p::before {
	opacity: 1;
}

/* -------------------------------srv-why-choose css---------------------------------- */
.srv-why-choose {
	background-color: var(--black);
	overflow: hidden;
}

.srv-why-choose .bottom-row {
	padding: 25px 0;
	margin-top: 25px;
	position: relative;
	z-index: 0;
}

.srv-why-choose .bottom-row .srv-why-choose {
	position: absolute;
	right: -100%;
	bottom: 0;
	width: auto;
	height: 100%;
	object-fit: contain;
	z-index: -1;
	transition: 0.8s;
	opacity: 0;
}

.srv-why-choose.active .srv-why-choose {
	right: -4%;
	opacity: 1;
}

.srv-why-choose .bottom-row .img-box {
	height: 100%;
	position: relative;
}

.srv-why-choose .bottom-row .img-box::after {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: var(--primary);
	background: linear-gradient(-90deg, rgba(17, 16, 16, 0.192) 1.28%, var(--primary) 100%);
}

.srv-why-choose .bottom-row .img-box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.srv-why-choose .bottom-row .content-box {
	background-color: #191919;
	padding: 47px;
	height: 100%;
	position: relative;
}

.srv-why-choose .bottom-row .content-box .box-shape {
	position: absolute;
	right: 20%;
	top: 0;
	height: 35px;
	width: auto;
	filter: invert(1);
	transform: scaleY(-1);
	transition: 0.8s;
}

.srv-why-choose .bottom-row .content-box:hover .box-shape {
	right: 0%;
}

.srv-why-choose .bottom-row .content-box .small-heading {
	line-height: 1.7;
	margin-bottom: 0;
	padding: 40px 0;
}

.srv-why-choose .bottom-row .content-box .icon {
	width: 50px;
}

.srv-why-choose .bottom-row .content-box ul {
	margin-bottom: 0;
	padding-left: 0;
	list-style: none;
}

.srv-why-choose .bottom-row .content-box ul li {
	color: var(--white);
	font-size: 1rem;
	font-weight: 300;
	margin-bottom: 20px;
	padding-left: 22px;
	position: relative;
}

.srv-why-choose .bottom-row .content-box ul li::after {
	position: absolute;
	content: "";
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 10px;
	height: 2px;
	background-color: var(--primary);
	border-radius: 30px;
}

/* .srv-why-choose .right-side .row div:nth-child(3) {
	padding-right: 0;
	border-right: 2px solid #2B2B2B;
}

.srv-why-choose .right-side .row div:nth-child(4) {
	padding-left: 0;
} */


/* --------------------------------------------dls-testimonial css------------------------------------- */
.dls-testimonial {
	background-color: var(--black);
	position: relative;
	overflow-x: hidden;
}

.dls-testimonial .shape-circle {
	position: absolute;
	right: 0;
	top: 20%;

}

.dls-testimonial-h.pt-30 {
	position: relative;
}

.dls-testimonial-h.pt-30::after {
	position: absolute;
	content: "";
	height: 100%;
	width: 100%;
	left: 0;
	right: 0;
	top: 0;
	background: radial-gradient(circle, rgb(255 255 255 / 0%) 0%, rgb(0 0 0 / 87%) 44%);
}


.dls-testimonial .dls-quote {
	width: 4.95vw;
	height: auto;
}

.dls-testimonial .dls-testimonial-h {
	font-size: 12.5vw;
	color: var(--white);
	font-weight: 300;
	line-height: 1;
}

.dls-testimonial-slider {
	background-color: #191919eb;
	padding: 60px;
	border: 1px solid #6E6E6E;
	border-radius: 10px;
	max-width: 900px;
	width: 100%;
	margin: auto;
	position: absolute;
	top: 52%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.dls-testimonial-slider .small-heading {
	line-height: 1.8;
}

.dls-testimonial .testimonial-main {
	position: relative;
}

.dls-testimonial-slider .small-heading {
	width: 90%;
	margin: auto;
}

.dls-testimonial-slider-2 .img-box {
	text-align: center;
}

.dls-testimonial-slider-2 .img-box img {
	width: 100px;
	height: 100px;
	border-radius: 50%;
	object-fit: cover;
	margin: auto;
	border: 5px solid #cccccc2e;
}

.dls-testimonial-slider-2 {
	max-width: 500px;
	margin: auto;
	margin-top: 40px;
}

.dls-testimonial-slider-2 .img-box {
	cursor: pointer;
}

.dls-testimonial-slider-2 .owl-item.center .img-box img {
	border-color: var(--primary);
}

.dls-testimonial .container {
	position: relative;
}

.dls-testimonial .rotate-swipe-animation {
	margin: 15px 0;
	position: absolute;
	bottom: 0;
	left: 4%;
}

/* ----------------------------------------------------cta-3 css----------------------------------------------- */
.cta-3 {
	overflow: hidden;
}

.cta-3 .container-fluid {
	padding-right: 0;
}

.cta-3 .content-box {
	width: 80%;
	padding-left: 12%;
}

.cta-3 .cta-3-h {
	font-size: 3vw;
	font-weight: 700;
}


/* ----------------------------------------------------case study page css----------------------------------------------- */

.case-study-banner .hero-inner-image img {
	width: 55%;
	object-fit: contain;
}

section.study-outer-main {
	display: flex;
	flex-direction: column;
	row-gap: 40px;
	margin-block: 0px;
}

.study-sec {
	position: relative;
	transition: 0.4s ease-in-out;
	background: linear-gradient(45deg, #000000, #000000cb, #00000000);
}

.study-sec:hover {
	background: linear-gradient(45deg, #000000, #000000, #000000);
}

.study-img-box img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	max-height: 600px;
	object-position: 100% 0%;
}

.study-sec .content-box {
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 40px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	transition: 0.4s ease-in-out;
	width: 40%;
	overflow: hidden;
	z-index: 3;
	left: 0;
	height: 100%;
}

.study-sec .content-box::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 12.9) 0%, /* solid black at bottom */ rgba(0, 0, 0, 0.8) 40%, /* medium black in middle */ rgba(0, 0, 0, 0.1) 100% /* fully transparent at top */);
  transition: 0.6s;
  z-index: -1;
}

.study-sec:hover .content-box::after {
	height: 100%;
}

/* .study-sec .content-box::before {
	position: absolute;
	content: "";
	width: 100%;
	height: 35%;
	bottom: 0;
	left: 0;
	background: linear-gradient(to right, #000000bd, #00000014, #22222200);
	z-index: -1;
} */

.study-sec .details-btn {
	display: inline-block;
}

.custom-cursor-img {
	position: absolute;
	width: 100px;
	height: 100px;
	pointer-events: none;
	z-index: 10000;
	/* Increased z-index to ensure visibility */
	transition: transform 0.3s ease-out;
	/* Smooth movement */
	display: none;
	/* Hidden by default */
	transform: translate(-50%, -50%);
	/* Center the image */
	opacity: 0.7;
	/* Semi-transparent for background-like effect */
	object-fit: contain;
	/* Ensure image is not distorted */
}

/* Ensure default cursor is visible */
.study-sec .custom-cursor {
	cursor: auto;
}

.study-sec .content-box>p {
	font-weight: 400;

}

.study-sec .content-box h3 {
	font-weight: 400;
}

.study-sec .content-box h3+p {
	font-weight: 600;
}

.study-sec .details-btn {
	margin-top: 30px;
}

.study-sec .details-btn img {
	object-fit: contain
}

/* .custom-cursor-img {
position: absolute;
pointer-events: none;
width: 150px;
height: 150px;
display: none;
z-index: 1000;
} */



section.study-outer-main .study-sec {
	position: relative;
}

section.study-outer-main .study-sec:nth-child(even) .content-box {
	left: auto;
	right: 0px;
}

section.study-outer-main .study-sec:last-child {
	margin-bottom: 50px;
}

.custom-cursor-img {
	position: absolute;
	display: none;
	width: 200px;
	height: 200px;
	pointer-events: none;
	z-index: 10;
	transform: translate(-50%, -50%);
}


/* for new cursor */
.content-box {
	position: relative;
	z-index: 10;
}

/* .content-box>* {
	position: relative;
	z-index: 15;
} */

.cursor {
	position: absolute;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	pointer-events: none;
	background-color: #fb0404;
	height: 2px;
	width: 2px;
	z-index: 20;
	transition: all 0.3s linear;
}

.cursor2 {
	position: absolute;
	border-radius: 50%;
	transform: translate(-50%, -50%);
	pointer-events: none;
	width: 150px;
	height: 150px;
	object-fit: contain;
	z-index: 0;
	transition: all 0.3s ease-out;
	filter: brightness(150%) contrast(120%);
	mix-blend-mode: screen;
}



/* casse study banner details page css start here */
.case-study-banner-details .hero-inner-image img {
	width: 90%;
	object-fit: contain;
}

.case-study-banner-details {
	position: relative;
}

.case-study-banner-details::before {
	position: absolute;
	content: "";
	width: 100%;
	left: 0;
	top: 0;
	background-color: #000000d4;
	height: 100%;
}

.container-fluid.section-space .det-left-box p {
	color: #fff;
}

.container-fluid.section-space .det-right-box {
	color: #fff;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	row-gap: 15px
}

.case-study-det-sec .outer-first .col-md-8 {
	position: relative;
}

.case-study-det-sec .outer-first .col-md-8::before {
	position: absolute;
	width: 1px;
	height: 165px;
	top: -25px;
	right: 18px;
	content: "";
	background: #fff;
	height: 340px;
}

.case-study-det-sec .main-outer-row {
	padding-block: 35px;
}

.case-study-det-sec .outer-first {
	border: 1px solid #fff;
	padding-inline: 25px;
	background: #191919;
	padding-block: 20px;
	overflow: hidden;
}

.case-study-det-sec .outer-second {
	border: 1px solid #fff;
	border-top: none;
	padding: 25px;
}

.case-study-det-sec .det-img-box {
	position: relative
}

.case-study-det-sec .det-img-box h3 {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 7.8125vw;
	color: #fff;
	width: 100%;
	text-align: center;
	    text-align: center;
    display: flex
;
    justify-content: center;
    align-items: center;
    gap: 80px;

}

.case-study-det-sec .det-left-box {
	padding-right: 30px;
}

.case-study-det-sec .det-right-box h4.other-p {
	margin: 0;
	color: #fff;
	font-weight: 600;
}

.case-study-det-sec .det-right-box p.main-p {
	color: #fff;
	font-weight: 300;
}


/* delevered section css */
section.delevered {
	background: black;
	position: relative;
}

section.delevered .feature-box p {
	text-align: left;
	margin-bottom: 0;
}


.delevered .shape-circle {
	position: absolute;
	bottom: 0;
	top: 30%;
	margin: auto;
	left: -50px;
}

.delevered .feature-box {
	border: 1px solid #fff;
	border-radius: 10px;
	padding: 10px 15px;
	text-align: center;
	height: 150px;
	display: flex;
	align-items: self-start;
	justify-content: space-between;
	margin-bottom: 50px;
	flex-direction: column;
}

.delevered .feature-box .check {
	font-size: 17px;
	margin-right: 10px;
	background: #fff;
	border-radius: 100%;
	width: 26px;
	height: 26px;
	display: flex;
	justify-content: center;
	align-items: center;
}





/* Left images */
.services-short-services .feature-images {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 40px;
}

.services-short-services .feature-img {
	max-width: 200px;
	opacity: 0.2;
	transform: scale(0.5);
	transition: opacity 0.6s ease, transform 0.5s ease;
}

.services-short-services .feature-img.active {
    opacity: 1 !important;
    max-width: 230px;
    transform: scale(0.7) rotate(360deg);
}

.services-short-services.has-many-features .row {
	max-height: 600px;
	overflow-y: auto;
}

.services-short-services.scrollable-section.custom-scrollbar {
	max-height: 70vh;
}



.services-short-services .feature-box {
	background: transparent;
	cursor: pointer;
	transition: background 0.3s;
	border-bottom: 1px solid #464646;
	height: auto;
	border-inline: none;
	border-top: none;
	border-radius: 0;
	margin-bottom: 0;
	padding-bottom: 50px !important;
}

.services-short-services .feature-box.active {
	/* background: rgba(255, 255, 255, 0.08); */
	border-color: #f18c025e;
}

.services-short-services .feature-box h3 {
	margin: 0 0 10px;
	color: #fff;
	font-size: 20px;
}

.services-short-services .feature-box p {
	margin: 0;
	line-height: 1.5;
	color: var(--white);
	;
	text-align: left;
}


.mobile-service-details {
	background: #121212;
	/* dark section bg */
	padding: 50px 20px;
	border-radius: 12px;
	display: none;
}



/* Accordion */
.mobile-service-details .accordion {
	background: transparent;
}

.mobile-service-details .accordion-item {
	background: #1e1e1e;
	border: none;
	margin-bottom: 12px;
	border-radius: 10px;
	overflow: hidden;
}

.mobile-service-details .accordion-button {
	background: #262626;
	color: #f1f1f1;
	font-weight: 600;
	font-size: 1rem;
	transition: all 0.3s ease;
}

.mobile-service-details .accordion-button:not(.collapsed) {
	background: var(--primary);
	color: #fff;
	box-shadow: none;
}


.mobile-service-details .accordion-button:not(.collapsed)::after {
	filter: brightness(0) invert(1);
}

.mobile-service-details .accordion-body {
	background: #1a1a1a;
	color: #ddd;
	font-size: 0.95rem;
	padding: 20px;
}

.mobile-service-details .feature-img {
	max-width: 250px;
	border-radius: 12px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.mobile-service-details .feature-img:hover {
	transform: scale(1.05);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
}





/* .feature-box p {
margin: 0;
font-size: 18px;
color: #fff;
} */

/* study-details services section */

section.study-det-serv {
	background: black;
	padding-top: 70px;
	position: relative;
	padding-bottom: 70px;
}

.study-det-serv .content-box {
	display: flex;
	flex-direction: column;
	justify-content: start;
	color: #fff;

}

.study-det-serv .content-box .section-title {
	text-align: left;
}

section.study-det-serv .img-box {
	position: absolute;
	top: 0px;
	width: 36%;
	right: 5%;
}

/* stats section here */

.stats-counter-section {
	background-image: url('../images/station-bg.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-color: #1a1a1a;
	color: white;
	padding: 0px 0;
	background-position: center;
}

.stats-counter-section .stat-item {
	padding: 10px 20px;
	position: relative;
}

.stats-counter-section .stat-item:not(:last-child)::after {
	position: absolute;
	content: "";
	width: 1px;
	height: 100%;
	background-color: #fff;
	right: 40px;
	top: 0;
	max-height: 45%;
	margin: auto;
	bottom: 0;
}


.stats-counter-section .stat-item:first-child {
	border-left: none;
}

.stats-counter-section .stat-value {
	font-size: 6.25vw;
	font-weight: bold;
	opacity: 0;
	transition: opacity 0.5s ease-in;
	font-weight: 900;
}

.stats-counter-section .stat-label {
	font-size: 1rem;
	text-transform: uppercase;
	color: #ccc;
}

.visible .stat-value {
	opacity: 1;
}

/* case details chalanges css */
section.home-solution.case-Challenges {
	background: #fff;
	color: #fff;
	padding-top: 100px;
	padding-bottom: 80px;
}

section.home-solution.case-Challenges .solution-h.text-black {
	font-size: 1.5rem;
}


.home-solution.case-Challenges .solution-div {
	justify-content: space-between;
}

.home-solution.case-Challenges .solution-div .first-box .solution-h a {
	color: black;
}


.home-solution.case-Challenges .solution-box.third-box .main-p.mb-0.text-white {
	color: #000 !important;
}

/* .home-solution.case-Challenges .solution-box .content-box span
{
color: var(--primary)
} */

section.home-solution .solution-box .content-box span {
	color: var(--primary)
}

.home-solution.case-Challenges .solution-div .first-box img {
	filter: brightness(0) saturate(100%) invert(0%) sepia(100%) saturate(0%) hue-rotate(121deg) brightness(101%) contrast(100%);
}

.home-solution.case-Challenges .solution-div:not(:last-child) {
	border-bottom: 1px solid #000;
}

.home-solution.case-Challenges .solution-div-col {
	border: 1px solid #000;
	border-radius: 20px;
}

.home-solution.case-Challenges .solution-div-col .solution-div {
	padding-inline: 20px;
}


/* case study -blog */

.home-blog.case-study-blog .text-box {
	position: absolute;
	left: 0;
	width: 100%;
	padding: 25px;
	display: flex;
	z-index: 2;
	bottom: 0;
	top: auto;
	bottom: o;
	height: auto;
}

.home-blog.case-study-blog .sub-heading {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-right: 0;
}

.home-blog.case-study-blog .sub-heading img {
	width: 40px;
}

.srv-slider-box.case-details-slider-box .left-content-box img {
	max-width: 200px;
}

/* home page slider */


/* use for gsap and scroll triger */
/* .primary-text-color {
color: #101828;
}

.secondary-text-color {
color: #3065fa;
}

.text-gray {
color: #344054;
}

.text-gray-light {
color: #667085;
}

.bg-blue {
background: #3065fa;
}

.bg-purple {
background: #9a93f4;
}

.bg-skyblue-light {
background: #bce5f6;
}

.bg-orange-light {
background: #fcd1a6;
}

.bg-green-light {
background: #b5e5b8;
}

.bg-light {
background: #fefdf6 !important;
}

.btn-primary {
background: #3065fa;
}
.btn-primary:hover {
background: #3065fa;
color: #fff;
}

.btn-secondary {
background: #fff;
color: #101828;
position: relative;
z-index: 1;
}
.btn-secondary:hover {
color: #101828;
background: #fff;
} */

.btn-black-shadow::before {
	content: "";
	width: 100%;
	height: 100%;
	box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.8);
	position: absolute;
	left: 0;
	top: 0;
	border-radius: 8px;
	transition: box-shadow 0.2s linear;
}

.btn-black-shadow:hover::before {
	box-shadow: 6px 6px 0px rgba(0, 0, 0, 0.8);
}

.btn-blue-shadow::before {
	content: "";
	width: 100%;
	height: 100%;
	box-shadow: 0px 0px 0px rgba(47, 121, 227, 0.8);
	position: absolute;
	left: 0;
	top: 0;
	border-radius: 8px;
	transition: box-shadow 0.2s linear;
}

.btn-blue-shadow:hover::before {
	box-shadow: 6px 6px 0px rgba(47, 121, 227, 0.8);
}

/* .container {
max-width: 100rem;
} */

/* .btn {
padding: 0.625rem 1.875rem;
border: none;
font-weight: 600;
position: relative;
}

.btn-large {
padding: 1.125rem 3.125rem;
font-size: 1.125rem;
}

.btn-outline {
border: 1px solid #101828;
}
.btn-outline:hover {
border: 1px solid #101828;
}

.spacer-y {
padding: 7.5rem 0;
}

.spacer-top {
padding-top: 7.5rem;
}

.spacer-bottom {
padding-bottom: 7.5rem;
}

.spacer-md {
padding: 3.75rem 0px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: 700;
}

h2 {
font-size: 3.125rem;
} */

/* h3 {
font-size: 2.125rem;
}

.f-12 {
font-size: 12px;
}

.font-20 {
font-size: 1.25rem;
}

.font-18 {
font-size: 1.125rem;
} */

html.lenis {
	height: auto;
}

.lenis.lenis-smooth {
	scroll-behavior: auto;
}

.lenis.lenis-smooth [data-lenis-prevent] {
	overscroll-behavior: contain;
}

.lenis.lenis-stopped {
	overflow: hidden;
}

.lenis.lenis-scrolling iframe {
	pointer-events: none;
}

/* img {
	max-width: 100%;
} */

/* PANELS */
.panel {
	position: relative;
	z-index: 9;
}

.panel__options {
	display: flex;
	justify-content: center;
	gap: 10px;
	align-items: center;
}

.panel__options span {
	font-size: 14px;
}

/* .panel__options span:first-child:hover {
color: #9a93f4;
}
.panel__options span:nth-child(2):hover {
color: #bce5f6;
}
.panel__options span:nth-child(3):hover {
color: #fcd1a6;
}
.panel__options span:last-child:hover {
color: #b5e5b8;
} */

.panel__stack {
	--spacer: 20px;
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	grid-column-gap: 0px;
	grid-row-gap: 0px;
	align-items: center;
	justify-items: center;
	overflow-y: visible;
}

.panel__stack .panel__card {
	grid-area: 1/1/2/2;
	border-radius: 30px;
	padding-inline: 2.5rem;
	padding-top: 2.5rem;
	position: absolute;
	/* height: 35.625rem; */
	will-change: transform;
	border: 1px solid var(--primary);
	border-radius: 10px;
}

.panel__card ul li {
	position: relative;
	list-style: none;
	padding-left: 0;
}

.panel__card ul li::after {
	position: absolute;
	content: "";
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	background-size: contain;
	background-image: url(../images/checked.svg);
}

.panel__card ul+p {
	margin-top: 20px;
}

.panel__card .icon-box {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 12px;
}

.panel__stack .panel__card:first-child {
	top: calc(var(--spacer) * 1);
	/* 20px */
	z-index: 1;
}

.panel__stack .panel__card:nth-child(2) {
	top: calc(var(--spacer) * 2);
	/* 40px */
	z-index: 2;
}

.panel__stack .panel__card:nth-child(3) {
	top: calc(var(--spacer) * 3);
	/* 60px */
	z-index: 3;
}

.panel__stack .panel__card:nth-child(4) {
	top: calc(var(--spacer) * 4);
	/* 80px */
	z-index: 4;
}

.panel__stack .panel__card:nth-child(5) {
	top: calc(var(--spacer) * 5);
	/* 100px */
	z-index: 5;
}

.panel__stack .panel__card:nth-child(6) {
	top: calc(var(--spacer) * 6);
	/* 120px */
	z-index: 6;
}

.panel__stack .panel__card ul {
	margin: 0;
	padding-right: 30px;
	padding-left: 0;
}

.panel__stack .panel__card ul li {
	position: relative;
	margin-bottom: 15px;
	font-size: 14px;
	padding-left: 28px;
}

/* .panel__stack .panel__card ul li::before {
content: url(../images/listing-icon.svg);
position: absolute;
top: 0px;
left: 0;
} */
.panel__stack .panel__card ul li:last-child {
	margin-bottom: 0;
}

/* .panel__stack .panel__card .green-bullets li::before {
content: url(../images/green-list-icon.svg);
position: absolute;
top: 0px;
left: 0;
} */
/* .panel__stack .panel__card .orange-bullets li::before {
content: url(../images/orange-list-icon.svg);
position: absolute;
top: 0px;
left: 0;
} */
.panel__stack .panel__card picture {
	position: relative;
	right: -10px;
}

.panel__content {
	width: 48%;
}

.panel__image {
	width: 52%;
}

.panel__image img {
	max-height: 30rem;
}

.panel__card__img {
	border-radius: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 60px 48px;
	max-width: 450px;
	width: 100%;
	margin-left: auto;
	position: relative;
}

.sticky-notes {
	width: 209px;
	padding: 10px 15px;
	position: absolute;
	background: #fff;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	left: -70px;
	bottom: 30px;
}

.sticky-notes .draw-line {
	position: absolute;
	top: -70px;
	left: -80px;
}

.sticky-notes__items {
	gap: 10px;
}

.sticky-notes__items div {
	padding: 10px 30px;
	border-radius: 8px;
}

.sticky-notes__items div:first-child {
	background-color: #fad1d1;
	color: #d92d20;
}

.sticky-notes__items div:nth-child(2) {
	background-color: #f4fad1;
	color: #f79009;
}

.sticky-notes__items div:last-child {
	background-color: #d1fadf;
	color: #039855;
}

.sticky-card {
	padding: 10px 15px;
	position: absolute;
	background: #fff;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	gap: 5px;
	right: -70px;
	top: 30px;
	max-width: 210px;
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}

.sticky-card .checkbox {
	width: 16px;
	height: 16px;
	display: inline-block;
	border: 1px solid #d0d5dd;
	border-radius: 5px;
	vertical-align: middle;
}

.sticky-cards__items {
	gap: 10px;
}

.sticky-card.sticky-card-left {
	bottom: 50px;
	left: -100px;
	top: initial;
}


/* crausel for mobile healthcare */

.healthcare-carousel {
	display: none;
}

.healthcare-carousel .custom-list {
	list-style: none;
	padding-left: 0;
}

.healthcare-carousel .custom-list li {
	position: relative;
	padding-left: 30px;
	margin-bottom: 12px;
	font-weight: 500;
}

.healthcare-carousel .custom-list li::before {
	position: absolute;
	content: "";
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
	background-size: contain;
	background-image: url(../images/checked.svg);
}


.healthcare-slider .item {
	background: #fff;
	padding-inline: 25px;
	overflow: hidden;
	padding-block: 20px;
}

.healthcare-carousel .owl-nav {
	text-align: center;
	margin-top: 20px;
}

.healthcare-slider {
	border: 1px solid var(--primary);
	overflow: hidden;
	border-radius: 20px;
}

.healthcare-carousel .owl-nav button {
	background: var(--primary);
	border: none;
	padding: 10px 20px;
	color: white;
	margin: 0 5px;
	border-radius: 5px;
}

.healthcare-carousel .icon-box img {
	width: 40px;
}

/* horizontal slider */
.home-project-slider-2 .overlay {
	flex-direction: unset;
}

.home-project-slider {
	overflow-x: hidden;
}

.home-project-slider .pin-wrap,
.home-project-slider .animation-wrap {
	display: flex;
	position: relative;
	/* gap: 40px; */
}

.home-project-slider .item {
	flex: 0 0 65%;
}



/* home slidr buttons css nav */
.home-project-slider-2 .owl-nav {
	flex-direction: row-reverse;
}

.owl-nav {
	justify-content: center;
	display: flex;
	gap: 20px;
	margin-top: 30px;

}

/* .owl-nav button.owl-prev , button.owl-next  {
    background: #fff !important;
    padding: 20px;
    color: #fff;
     border-radius:100%
} */

.owl-nav span.nav-btn {
	width: 45px;
	height: 45px;
	display: inline-flex;
	border: 1px solid #585858;
	border-radius: 6px;
	align-items: center;
	justify-content: center;
}

/* Style for the left navigation button (Previous) */
.owl-prev .nav-btn img.nav-img {
	filter: unset;
	transform: scaleX(1);
	/* Flip horizontally for left arrow */
	max-width: 20px;
}

/* Style for the right navigation button (Next) */
.owl-next .nav-btn img.nav-img {
	filter: unset;
	transform: scaleX(-1);
	/* No flip for right arrow */
	max-width: 20px;
}


/* ------------------------------------------------------contact us page css start here------------------------------------------------ */

.contactform-main {
	background: url('https://via.placeholder.com/1500x500') no-repeat center center;
	background-size: cover;
	padding: 40px;
	max-width: 940px;
	margin: 50px auto;
	margin-top: -132px;
	background-color: #fff;
	box-shadow: 3px 4px 12px #0000002b;
	position: relative;
}

::-webkit-input-placeholder {
	font-size: 14px;
}

::placeholder {
	font-size: 14px;
}

.inner-hero-banner.inner-detail-hero.contact-banner h1.hero-h,
.inner-hero-banner.inner-detail-hero.blog-page h1.hero-h {
	font-size: 8.19vw;
}


.contactform-main .form-control:focus {
	box-shadow: none;
	border-color: #000;
}

.contactform-main .form-control {
	border-radius: 5px;
	border: 1px solid #6a6a6a;
	font-size: 14px;
}

.contactform-main .form-label {
	font-size: 14px;
	font-weight: 400;
	margin-bottom: 6px;
	color: var(--black);
}

.contactform-main .captcha {
	background-color: #f7ae47;
	color: white;
	padding: 10px;
	border-radius: 5px;
	display: inline-block;
	min-width: 100px;
	text-align: end;
	border-radius: 0;
	margin-left: 20px !important;
}

.contactform-main .btn {
	border-radius: 20px;
	padding: 8px 15px;
	font-size: 14px;
	background-color: var(--primary);
	min-width: 140px;
	color: var(--white);
	font-weight: 400;
}

.input-group #captcha {
	border-top-right-radius: 5px !important;
	border-bottom-right-radius: 5px !important;
}



.uae-map,
.india-map,
.canada-map,
.usa-map {
	position: relative;
	z-index: 1;
}

.uae-map::before,
.india-map::before,
.canada-map::before,
.usa-map::before {
	content: "";
	position: absolute;
	inset: 0;
	/* shorthand for top:0; right:0; bottom:0; left:0 */
	background-repeat: no-repeat;
	background-position: center;
	background-size: 45%;
	z-index: -1;
	opacity: 0.9;
	/* fixed (9 was invalid) */
}

/* individual background images */
.uae-map::before {
	background-image: url("../images/uae-contact.png");
}

.india-map::before {
	background-image: url("../images/india-contact.png");
}

.canada-map::before {
	background-image: url("../images/canada-contact.png");
}

.usa-map::before {
	background-image: url("../images/usa-contact.png");
	background-size: 20%;
}




/* location seciton css  */



.location .nav {
	justify-content: space-between;
	border-bottom: none;

}

.location .nav-tabs .nav-link {
	color: #000;
	border: none;
	border-bottom: 2px solid transparent;
}

.location .nav-tabs .nav-link.active {
	color: var(--primary);
	background-color: var(--white);
	border-bottom: 2px solid var(--primary);
}

.location .tab-content {
	height: 400px;
	overflow: hidden;
}

.location .location-info {
	background: var(--black);
	color: var(--white);
	padding: 20px;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.location .location-info h3 {
	color: var(--primary);
}

.location .location-info .social-icons a {
	color: var(--white);
	margin-right: 10px;
}

.location .map-container {
	height: 100%;
}

.map-container,
.map-box {
	height: 100%;
}

.tab-pane {
	padding-top: 20px;
}


.location iframe {
	border: 0;
	width: 100%;
	height: 100%;
	min-height: 362px;
}


.location-info .d-flex p,
.location-info .d-flex p a {
	font-size: 13px;
	color: var(--white);
}

.location-info .d-flex p strong {
	margin-bottom: 15px
}

.location .location-info h3 {
	color: var(--primary);
	font-weight: 600;
	font-size: 20px;
}

.location .left p span {
	font-weight: 300;
	font-size: 18px;
}

.location .left p {
	font-size: 40px;
	font-weight: 400;

}

.location .right span i {
	padding: 7px;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 10px;
	color: #000;
	background: var(--white);
}


.location .social-icons a i {
	background: var(--white);
	padding: 10px;
	color: #000;
	border-radius: 50%;
	width: 22px;
	height: 22px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 10px;
}

.location .left .social-icons p {
	font-size: 14px;
	color: var(--white);
	font-weight: 400;
	margin-bottom: 10px
}

.about-tabs-main .brand-content .main-p {
	line-height: 2 !important;
}

.text-white.brand-content .title {
	font-size: 4vw;
}

.about-tabs-main .leader-discreption .main-p {
	line-height: 2 !important;
}

.team-card img {
	transition: transform 0.3s ease;
}

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

section.team-section h3 {
	font-size: 4vw;
}

.team-img {
	position: relative;
	/* keeps pseudo element positioned relative to this */
	z-index: 1;
}

.team-section .team-img-outer {
	margin-top: 90px;
	position: relative;
	/* Ensure child absolute positioning works */
	overflow: hidden;
	/* Hide the box when it's outside */
}


.team-image-inner-box{
	margin-top: 120px;
}

.team-section .team-img::before {
	content: "Our Team";
	position: absolute;
	top: -190px;
	left: 0;
	font-size: 12.42vw;
	font-weight: normal;
	background: linear-gradient(to right, #565656, black);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	z-index: -1;
	right: 0;
	text-align: center;
	font-weight: 300;

}


/* Team Image Styling */
.team-section .team-image {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  cursor: pointer;
}

.team-section .team-image img {
  width: 100%;
  display: block;
  transition: transform 0.4s ease;
}

.team-section .team-image:hover img {
  transform: scale(1.05);
}

/* Overlay with Name + Designation */
.team-section .overlay {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.85);
  padding: 10px 10px;
  opacity: 0;
  transform: translateY(100%);
  transition: all 0.3s ease;
}

.team-section .team-image:hover .overlay {
  opacity: 1;
  transform: translateY(0);
}

.team-section .overlay-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1.3;
}

.team-section .overlay .name {
  color: #fff;
  font-size: 0.9rem;
  font-weight: 700;
  text-transform: uppercase;
}

.team-section .overlay .designation {
  color: #ddd;
  font-size: 0.75rem;
  font-weight: 400;
  margin-top: 4px;
}

/* Fram Box Animation */
.team-img-outer {
  position: relative;
}

.team-img-outer .fram-box {
  position: absolute;
  top: 0;
  right: 0;
  /* width: 100%; */
  height: 100%;
  transform: translateX(100%);
  transition: transform 0.5s ease;
  z-index: 2;
}



.team-img-outer.hovered .fram-box {
  transform: translateX(0%);
}


/* blog page css start here */

.blog-navbar {
	background: #1a1a1a;
	border: none;
	margin-bottom: 0;
}

.blog-navbar .nav-link {
	color: var(--dark-gray);
	font-weight: 500;
	margin-right: 20px;
	transition: color 0.2s;
}

.blog-navbar .nav-link.active,
.blog-navbar .nav-link:focus {
	color: var(--primary);
	background: transparent;
	border: unset;
}

.blog-navbar .nav-link:hover {
	color: #fff;
	border: unset;
	outline: unset;
}

.tab-content-sec {
	background-color: #000;
}

.section-title {
	font-size: 1.4rem;
	font-weight: 700;
	letter-spacing: 1px;
	margin: 40px 0 30px 0;
	color: var(--white);
}

.blog-card {
	background: #232323;
	border: none;
	box-shadow: none;
	padding: 30px;
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: space-between;
}

.blog-card .blog-date {
	color: #959595;
	font-size: .92rem;
}

.blog-card .blog-title {
	font-size: 1.07rem;
	color: #fff;
	font-weight: 600;
	margin-bottom: 9px;
	line-height: 1.6;
}

.blog-card .blog-desc {
	font-size: 0.93rem;
	color: #bbb;
	margin-bottom: 8px;
	line-height: 1.7;
	margin-top: 15px;
}

.blog-card .card-btn {
	background: none;
	border: none;
	color: #888;
	font-size: 1.1rem;
}

.blog-row .img-card {
	background: #181818;
	overflow: hidden;
	display: flex;
	height: 100%;
}

.blog-row .img-card img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	max-height: 450px;
	object-position: 100% 0%;
}

.blog-row-outer {
	padding-bottom: 60px;
}


.row.blog-row:nth-child(even) .blog-card {
	background: #fff
}

.row.blog-row:nth-child(even) {
	flex-direction: row-reverse;
}

.row.blog-row:nth-child(even) .blog-title {
	color: #000;
}

.row.blog-row:nth-child(even) .blog-desc {
	color: #000
}

.row.blog-row button {
	border: 1px solid #fff;
	height: max-content;
	border-radius: 4px;
}

.row.blog-row span img {
	width: 17px;
}

.row.blog-row:not(:last-child) {
	margin-bottom: 24px;
}

.outer-date {
	align-items: center;
	justify-content: space-between;
}

.row.blog-row:nth-child(even) button.card-btn span img {
	filter: brightness(0) saturate(100%) invert(0%) sepia(2%) saturate(0%) hue-rotate(200deg) brightness(98%) contrast(104%);

}

.row.blog-row:nth-child(even) button.card-btn {
	border-color: #000;
}


/* blog details page css start here */

.main-content-box {
	background: #000;
}

.sticky-fix {
	top: 90px;
	position: sticky;
}


.blog-sidebar {
	background: #cccccc2e;
	padding: 25px;
	margin-top: 0px;
}

.outer-blog-slider {
	margin-right: 20px;
	padding-right: 20px;
	margin-bottom: 20px;
}

.middle-img-box img {
	width: 100%;
	position: relative;
}

.trending-blogs .outer-blog-slider,
.empwer-box {
	margin-left: 20px;
	padding-left: 20px;
	margin-right: 0;
	padding-right: 0;
}

.empower-img-box img {
	width: 100%;
}


.blog-sidebar ul li {
	list-style: none;

}

.blog-sidebar ul {
	padding-left: 0;
}

.blog-sidebar ul li a {
	color: #fff;
	font-size: 14px;

}

.blog-sidebar ul li {
	padding-block: 15px;
	border-bottom: 1px solid #414141
}

.outer-blog-slider h2 {
	background: #191919;
	color: #fff;
	margin-bottom: 0;
	padding: 20px 25px;
	font-size: 16px;
}

.sticky-fix.trending-blogs .outer-blog-slider h2 {
	background: #252525;
}



.trending-blogs .img-box-content h5 {
	color: #fff;
	font-size: 11px;
	line-height: 18px;
	font-weight: 800;
}

.trending-blogs .img-box-content h5 span,
.main-content-box .middle-img-ontent h3 span {
	color: var(--primary);
}

.trending-blogs .blog-sidebar .img-box img {
	height: 100%;
	min-height: 50px;
	max-height: 50px;
}

.main-content-box .middle-img-ontent {
	margin-top: 30px;
}


.main-content-box .middle-img-ontent h3 {
	margin-bottom: 20px;
}

.main-content-box .middle-img-ontent p {
	line-height: 26px;
	font-size: 14px
}


.main-content-box .middle-img-ontent p img {
	width: 100%;
}
.main-content-box .middle-img-ontent h5 {
	line-height: 26px;
	font-size: 18px;
	color: #fff;
}

.main-content-box .shape-circle {
	left: -30px;
}

.main-content-box .middle-img-ontent h3,
.main-content-box .middle-img-ontent p {
	color: var(--white);
}

.main-content-box .middle-img-ontent ul {
	color: var(--white);
}

.main-content-box .middle-img-ontent table,
.main-content-box .middle-img-ontent th,
.main-content-box .middle-img-ontent td {
	border: 1px solid var(--white);
	padding: 10px;
	color: var(--white);
}

.main-content-box .middle-img-ontent table {
	margin-bottom: 15px;
}


.lets-go {
	background: var(--primary);
	padding: 20px;
	text-align: center;
	color: var(--white);
	position: relative;
	padding-bottom: 70px
}

.half-rounded {
	position: absolute;
	background: var(--black);
	width: 26%;
	height: 76%;
	bottom: -43px;
	margin-inline: auto;
	left: 0;
	right: 0;
	/* border-top-left-radius: 100%;
    border-top-right-radius: 100%; */
	display: flex;
	align-items: baseline;
	justify-content: center;
	border-radius: 100%;
	padding-top: 20px;
}

.half-rounded .arrow-animate {
	display: inline-block;
	animation: slideX 1.5s ease-in-out infinite;
}

@keyframes slideX {
	0% {
		transform: translateX(0);
	}

	50% {
		transform: translateX(8px);
		/* Adjust for more/less movement */
	}

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


.author-bio-section {
	margin-top: 80px;
}


.author-container {
	background: linear-gradient(90deg, black, #161616, #000);
	padding: 50px;

}

.author-container .author-title {
	text-align: center;
	font-style: italic;
	font-weight: 800;
}

.author-container .author-description>p {
	font-size: 14px;
}

.author-container .author-name {
	background: linear-gradient(45deg, #191919, #70707047, #191919);
	padding-block: 10px;
	max-width: max-content;
	margin-inline: auto;
	padding-inline: 50px;
	margin-bottom: 0;
	font-weight: 300;
	font-style: italic;
}



/* about us page css start here */



.success-section {
	background-color: #fff;
}

.success-section .left-box {
	background-color: #f6f8f9 !important;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

.success-section .left-box img {
	width: 100%;
	height: 100%;
}


.success-section .right-box h4 {
	line-height: 38px;
	font-size: 28px;
}

.success-section .right-box p.other-p {
	line-height: 36px;
	font-weight: 500;
}

.success-section .row.content-row {
	margin-top: 40px;
}

.success-section .right-box span {
	color: var(--primary);
	margin-bottom: 20px
}

.success-section .right-box .main-p {
	margin-bottom: 20px
}

.main-section {
	min-height: 100vh;
	position: relative;
	padding: 80px 0;
	background-image: url(../images/bg-about.png);
	background-repeat: no-repeat;
	background-position: -10% 100%;
	background-size: auto;
	background-color: var(--black);
	width: 100%;
	height: auto;
}

.main-section::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 200px;
	height: 200px;
	background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="8" height="8" patternUnits="userSpaceOnUse"><path d="M 8 0 L 0 0 0 8" fill="none" stroke="%23333" stroke-width="0.5"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');
	opacity: 0.4;
}

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

.section-title h2 {
	font-size: 42px;
	font-weight: 300;
	margin-bottom: 15px;
	letter-spacing: 2px;
}



.section-title .highlight {
	color: #ff6b35;
	font-weight: 700;
}

.section-subtitle {
	font-size: 18px;
	color: #ccc;
	margin-bottom: 10px;
}

.section-description {
	font-size: 14px;
	color: #888;
	max-width: 600px;
	margin: 0 auto;
	line-height: 1.6;
}


.about-tabs-main {
	background-color: var(--black);
	padding: 30px 0 50px 0px;
}

.about-tabs-main .left-box h3 {
	color: var(--white);
	font-size: 2.604vw;
}

/* .about-tabs-main .right-box p {
	color: var(--white);
} */

.about-tabs-main .left-box p.first-title {
	color: var(--white);
}


.about-tabs-main .custom-tabs .nav-tabs {
	border-bottom: none;
	justify-content: center;
	margin-bottom: 20px;
}

.about-tabs-main .custom-tabs .nav-link {
	color: var(--white);
	background-color: transparent;
	border: none;
	margin: 0 35px;
	font-size: 14px;
	cursor: pointer;
}


.about-tabs-main .custom-tabs .nav-link.active {
	color: var(--primary);

}

/* .about-tabs-main .custom-tabs .tab-content {
	padding: 20px;
} */

.about-tabs-main .custom-tabs .highlight {
	color: var(--primary);
	font-weight: bold;
}

.about-tabs-main .custom-tabs .tab-pane p {
	line-height: 1.6;

}


.about-tabs-main .tab-content>.tab-pane.active:not(:first-child) {
	padding-inline: 65px;
}



/* client crowusel */


/* 
.carousel-item:hover {
	box-shadow: 0 0 25px #ffeb3b, 0 0 5px #fff;
} */

.carousel-caption {
	background: rgba(0, 0, 0, 0.7);
	padding: 10px;
	border-radius: 5px;
}

/* .owl-nav button {
	color: #ffeb3b !important;
}

.owl-dots .owl-dot.active span {
	background: #ffeb3b !important;
} */

/* Location Cards */
.locations-section {
	margin-bottom: 120px;
}

.location-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	/* Always 2 columns */
	gap: 30px;
	margin-top: 60px;
}


.location-card {
	background: transparent;
	/* border: 1px solid rgba(255, 255, 255, 0.1); */
	border-radius: 10px;
	padding: 30px;
	backdrop-filter: blur(10px);
	transition: all 0.4s ease;
	position: relative;
	overflow: hidden;
}

.location-card:hover {
	background-color: #191919;
}

/* .location-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	background: linear-gradient(90deg, #ff6b35 0%, #ff8e53 100%);
	transform: scaleX(0);
	transition: transform 0.4s ease;
}

.location-card:hover::before {
	transform: scaleX(1);
} */

.location-card:hover {
	transform: translateY(-10px);
	/* border-color: rgba(255, 107, 53, 0.3);
	box-shadow: 0 20px 40px rgba(255, 107, 53, 0.1); */
}

.location-header {
	display: flex;
	align-items: center;
	margin-bottom: 20px;
}

.location-icon {
	width: 50px;
	height: 50px;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 15px;
	font-size: 20px;
	color: #fff;
}

.location-status {
	color: var(--primary);
	padding: 4px 12px;
	border-radius: 15px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.location-address {
	color: #ccc;
	font-size: 16px;
	line-height: 1.6;
	margin-bottom: 20px;
	border-bottom: 1px solid;
	padding-bottom: 10px;
}

.location-phone {
	color: var(--white);
	font-size: 14px;
	font-weight: 400;
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 10px;
	transition: all 0.3s ease;
}

.location-phone:hover {

	transform: translateX(5px);
}


.trested-main-box {
	display: flex;
	grid-template-columns: repeat(6, 1fr);
	gap: 20px;
	padding: 0;
	margin: 0 auto;
	list-style: none;
	max-width: 1200px;
	justify-content: center;
	flex-wrap: wrap;
}


.trested-main-box li {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 12%;
}

.trested-main-box a {
	display: block;
	width: 100%;
	text-align: center;
}

.trested-main-box img {
	max-width: 100%;
	height: auto;
	transition: transform 0.3s ease;
}

.trested-main-box img:hover {
	transform: scale(1.05);
}

/* Section Wrapper */
.business-expert-section {
	position: relative;
	background-image: url(../images/business-image.png);
	background-size: cover;
	background-repeat: no-repeat;
	color: #fff;
	padding: 80px 40px;
	display: flex;
	align-items: center;
	overflow: hidden;
	background-position: top;
	height: 450px;
}

/* Dark overlay for contrast */
.business-expert-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to right,
			rgba(0, 0, 0, 0.9) 0%,
			rgba(0, 0, 0, 0.6) 25%,
			rgba(0, 0, 0, 0.3) 50%,
			rgba(0, 0, 0, 0.6) 75%,
			rgba(0, 0, 0, 0.9) 100%),
		linear-gradient(to bottom,
			rgba(0, 0, 0, 0.6) 0%,
			rgba(0, 0, 0, 0.3) 50%,
			rgba(0, 0, 0, 0) 100%);
	z-index: 1;
}


/* Main container */
.business-expert-container {
	position: relative;
	z-index: 2;
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 40px;
}



.blinking-dot {
	width: 1.2vw;
	height: 1.2vw;
	border-radius: 50%;
	background-color: var(--primary);
	border: 0.2vw solid var(--black);
	box-shadow: 0 0 0.8vw var(--primary);
	animation: blink 1s infinite;
}


/* Blinking animation */
@keyframes blink {

	0%,
	100% {
		opacity: 1;
	}

	50% {
		opacity: 0;
	}
}


/* Left Content */
.business-expert-left {
	flex: 1 1 45%;
}

.business-subtitle {
	font-size: 14px;
	text-transform: uppercase;
	display: inline-block;
	margin-bottom: 10px;
	font-weight: 500;
}

.business-expert-left h3 {
	font-size: 3.125vw;
	font-weight: 700;
	line-height: 1.3;
}

.highlight-text {
	background-color: var(--primary);
	padding: 0 10px;
	color: #fff;
}

/* Right Content */
.business-expert-right {
	flex: 1 1 30%;
}

.business-expert-right p {
	color: var(--white);
	line-height: 1.6;
	margin-bottom: 15px;
}

.business-expert-right .btn-2 {
	margin-top: 30px;
}

/* CTA Button */
.business-cta {
	color: var(--primary);
	font-weight: bold;
	text-decoration: none;
	font-size: 18px;
	display: inline-block;
	margin-top: 20px;
	transition: color 0.3s ease;
}

.business-cta:hover {
	color: #fff;
	text-decoration: underline;
}

/* Responsive */
@media (max-width: 768px) {
	.business-expert-container {
		flex-direction: column;
	}

	.business-expert-left,
	.business-expert-right {
		flex: 1 1 100%;
	}

	.business-expert-left h1 {
		font-size: 32px;
	}
}



/* Timeline Section */
.timeline-section {
	position: relative;
}

.timeline-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 80px;
	position: relative;
	overflow-x: auto;
	padding: 40px 0;
}

/* .timeline-line {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	height: 2px;
	background: linear-gradient(90deg, #333 0%, #ff6b35 50%, #333 100%);
	transform: translateY(-50%);
	z-index: 1;
} */




.hover-box {
	display: block;
	/* Change to block for opacity transition */
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 0;
	opacity: 0;
	/* Hidden by default via opacity */
	transition: opacity 0.3s ease;
	/* Smooth fade-in */
}

.hover-box img {
	width: 50px;
	height: 50px;
	border-radius: 50%;
	object-fit: cover;
}

.timeline-circle:hover .hover-box {
	opacity: 1;
	/* Show on hover */
}





/* .time-line-outer {
	padding-left: 200px;
} */

.timeline-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
	z-index: 2;
	min-width: 200px;
	opacity: 0;
	transform: translateY(30px);
	animation: fadeInUp 0.8s ease forwards;
}

.timeline-item:nth-child(1) {
	animation-delay: 0.2s;
}

.timeline-item:nth-child(2) {
	animation-delay: 0.4s;
}

.timeline-item:nth-child(3) {
	animation-delay: 0.6s;
}

.timeline-item:nth-child(4) {
	animation-delay: 0.8s;
}

.timeline-item:nth-child(5) {
	animation-delay: 1.0s;
}

.timeline-circle {
	width: 180px;
	height: 180px;
	border-radius: 50%;
	border: 2px solid var(--primary);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 30px;
	position: relative;
	transition: all 0.4s ease;
	background-image: url('../images/hoverd-image.png');
	background-size: contain;
	background-repeat: no-repeat;
}



.timeline-year {
	font-size: 32px;
	font-weight: 900;
	color: var(--white);

}

.timeline-content {
	text-align: center;
	max-width: 200px;
}

.timeline-title {
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	margin-bottom: 8px;
	letter-spacing: 0.5px;
}

.timeline-subtitle {
	font-size: 14px;
	color: #ff6b35;
	font-weight: 500;
	margin-bottom: 12px;
}

.timeline-description {
	font-size: 12px;
	color: #aaa;
	line-height: 1.4;
}

/* Floating Elements */
.floating-elements {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	overflow: hidden;
}

.floating-shape {
	position: absolute;
	opacity: 0.1;
}

.floating-circle {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: linear-gradient(135deg, #ff6b35 0%, #ff8e53 100%);
	animation: float 15s infinite ease-in-out;
}

.floating-square {
	width: 60px;
	height: 60px;
	background: linear-gradient(135deg, #ff6b35 0%, #ff8e53 100%);
	transform: rotate(45deg);
	animation: float 20s infinite ease-in-out reverse;
}

.floating-shape:nth-child(1) {
	top: 10%;
	left: 5%;
	animation-delay: 0s;
}

.floating-shape:nth-child(2) {
	top: 70%;
	right: 10%;
	animation-delay: -5s;
}

.floating-shape:nth-child(3) {
	bottom: 20%;
	left: 15%;
	animation-delay: -10s;
}

@keyframes float {

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

	33% {
		transform: translateY(-20px) rotate(120deg);
	}

	66% {
		transform: translateY(10px) rotate(240deg);
	}
}

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

/* Responsive Design */
@media (max-width: 768px) {
	.section-title h2 {
		font-size: 28px;
	}

	.location-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.timeline-container {
		flex-direction: column;
		gap: 40px;
	}

	.timeline-line {
		display: none;
	}

	.timeline-item {
		min-width: auto;
		width: 100%;
	}
}


/* digital markting page css start here */

.comman-overlay-main-banne {
	position: relative;
}

.comman-overlay-main-banner::before {
	position: absolute;
	content: "";
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: #000000e0;
}


.markting-sec {
	background: var(--black);
	position: relative;
	overflow-x: hidden;
}

.markting-sec .shape-circle {
	position: absolute;
	right: -4%;
	top: 0;
}

.markting-sec .digital-img-box img {
	width: 100%;
	max-height: 418px;
	object-fit: cover;
}

.digital-content-box span {
	color: var(--primary);
}

.dm-section {
	background-color: var(--black);
	position: relative;
}

.dm-section .bubble {
	position: absolute;
	top: 10%
}


.digital-row-outer {
	background: #191919;
	padding: 60px 30px 0px 30px;
	border-radius: 8px;
	position: relative;
}

.dm-title {
	font-size: 1.6rem;
	font-weight: 700;
	text-align: center;
	margin-bottom: 4px;
	letter-spacing: 0.01em;
}

.dm-title .orange {
	color: var(--primary);
}

.dm-subtitle {
	color: #BFC1C7;
	text-align: center;
	font-size: 1.02rem;
	margin-bottom: 30px;
}

.dm-card {
	border: 1px solid #d9d9d924;
	padding: 30px 20px 30px 20px;
	transition: box-shadow .16s, border-color .16s;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	position: relative;
	/* overflow: hidden; */

}

.dm-hover-box {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	display: none;
	transition: 0.3s all ease-in-out;
}

.dm-card:hover {
	border-color: var(--primary);
	box-shadow: rgba(0, 0, 0, 0.90) 0px 25px 20px -20px;
}

.dm-hover-box img {
	width: 100%;
}

.dm-card:hover .dm-hover-box {
	display: block
}

.dm-card::before {
	position: absolute;
	content: "";
	width: 100%;
	height: 4px;
	background: #959595;
	left: 0;
	bottom: -2px;
	max-width: 90%;
	margin: auto;
	left: 0;
	right: 0;
}

.dm-card:hover::before {

	background-color: var(--primary);
}

.dm-card h6 {
	margin-bottom: 0.5rem;
	font-weight: 600;
	font-size: 1rem;
	color: #fff;
	letter-spacing: 0.01em;
}

.dm-card p {
	color: #fff;
	font-size: 0.97rem;
	margin-bottom: 0.6rem;
	flex: 1 1 auto;
}

.dm-card a:hover {
	text-decoration: none;
}

.dm-card a {
	color: var(--white);
	font-weight: 500;
	font-size: 0.96rem;
	text-decoration: none;
	transition: color .13s;
	position: relative;
	z-index: 9;

}




/* portfolio seciton css */

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

.highlight {
	color: var(--primary);
}

.subtitle {
	color: #555;
	margin-bottom: 30px;
}

.portfolio-section .portfolio-card {
	background: var(--white);
	border-radius: 10px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	/* box-shadow: rgba(0, 0, 0, 0.2) 0px 60px 40px -7px; */
	border: 1px solid #161616;
	border-radius: 12px;
	overflow: hidden;
}

.portfolio-section .portfolio-card a.btn-2 {
    max-width: max-content;
}


section.portfolio-section .portfolio-card .row {
    width: 100%;
}
section.portfolio-section .portfolio-card .row .col-md-6:nth-child(2) {
  padding-right: 0 !important;
}


 .portfolio-section .portfolio-card .text-side {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.portfolio-section .portfolio-card .text-side h3 {
	font-weight: 800;
}

.portfolio-section .image-side img {
	max-width: 100%;
	border-radius: 5px;
}

.portfolio-section .owl-nav {
	flex-direction: row-reverse;
}

.portfolio-section .owl-nav span.nav-btn img {
	filter: brightness(0) saturate(100%) invert(0%) sepia(83%) saturate(7500%) hue-rotate(210deg) brightness(115%) contrast(115%);
}

section.portfolio-section {
	padding: 70px 0px;
	position: relative;
	background: var(--light-blue);
}

.portfolio-section .image-box-outer .left {
	background: var(--primary);
	height: 100%;
	width: 10px;
	min-height: 100%;
}

.portfolio-section .image-box-outer .right {
	background: var(--primary);
	height: 100%;
	width: 20px;
	min-height: 100%;
}

.portfolio-section .image-box-outer {
	display: flex;
	height: 100%;
	justify-content: end;
}


.portfolio-card .image-side img {
	max-height: 360px;
	text-align: right;
}

.portfolio-card .row.flex-column-reverse.flex-md-row {
	/* width: 100%; */
	justify-content: space-between;
}

.portfolio-section .content-box h2,
.portfolio-section .content-box p {
	text-align: left;
}

.portfolio-section .owl-nav {
	gap: 40px;
	margin-top: 0px;
	position: absolute;
	top: -100px;
	right: 50px;
}

.text-side p {
	font-size: 14px;
	font-weight: 400;
	line-height: 30px;
}

.label {
	/* margin-left: 10px; */
	font-weight: bold;
	background: #F4F7F7;
	padding: 12px;
}

.percentage {
	font-size: 24px;
	font-weight: bold;
	background: green;
	color: white;
	padding: 5px 10px;
}

.lead-increase {
	margin: 25px 0;
	align-items: center;
	display: flex;
}

.text-side {
	width: 50%;
	text-align: left;
	padding-right: 20px;
	padding: 30px;
}

.case-study-link {
	color: var(--primary);
	text-decoration: none;
	font-weight: bold;
}


/* scroll waraper css start */
.digital-services-section {
	min-height: 100vh;
	/* background: linear-gradient(135deg, #000 0%, #1a1a1a 100%); */
	background-color: var(--black);
	position: relative;
	overflow: hidden;
	padding-bottom: 40px;
}

.digital-services-section.with-seo {
	height: auto;
	min-height: auto;
}

section.digital-services-section .bubble {
	position: absolute;
	left: 2%;
	top: 50%;
}

.digital-services-section .container {
	margin-top: 65px;
}

.digital-services-section::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 100px;
	height: 100px;
	background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grid" width="10" height="10" patternUnits="userSpaceOnUse"><path d="M 10 0 L 0 0 0 10" fill="none" stroke="%23333" stroke-width="0.5"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');
	opacity: 0.3;
}

/* Navigation Styling */
.top-nav {
	padding: 40px 0;
	text-align: center;
}

.digital-services-section .top-nav .nav-items {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 30px;
	gap: 80px;
	flex-wrap: nowrap;
}

.top-nav .nav-item {
	color: #fff;
	text-decoration: none;
	font-size: 28px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	position: relative;
	transition: all 0.3s ease;
	white-space: nowrap;
}

.digital-services-section nav.top-nav {
	background: #191919;
	margin-top: 0px;
	margin-bottom: 35px;
}

.top-nav .nav-item::after {
	content: '';
	position: absolute;
	bottom: -45px;
	left: 50%;
	transform: translateX(-50%);
	width: 16px;
	height: 16px;
	background: #fff;
	border-radius: 50%;
	/* opacity: 0; */
	transition: all 0.3s ease;
	border: 3px solid #000;
}

.top-nav .nav-item:not(:last-child)::before {
	content: '';
	position: absolute;
	height: 30px;
	width: 1px;
	background-color: #fff;
	top: 0;
	bottom: 0;
	margin: auto;
	right: -20%;
}


.top-nav .nav-items:hover::after {
	background-color: var(--primary);
}

/* .top-nav .nav-item::after{
	background-color: #fff;
} */

.top-nav .nav-item:hover,
/* .top-nav .nav-item.active {
	color: #ff6b35;
	transform: translateY(-2px);
} */
/* .top-nav .nav-item:hover .nav-item::after{
	background-color: var(--primary);
} */

.top-nav .nav-item:hover::after,
.top-nav .nav-item.active::after {
	opacity: 1;
}

.top-nav .nav-item:hover::after {
	background-color: var(--primary)
}

/* Services Section Styling */
.services-section {
	padding: 0px 0 30px 0px;
	position: relative;
	min-height: 100%;
	overflow-y: auto;
	max-height: 50vh;
	margin-top: 50px;
}

.services-section .service-item {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
	border-radius: 20px;
	padding: 10px 30px;
	opacity: 1;
	gap: 20px;
	transition: all 0.3s ease;
}

.services-section .service-item.animate {
	transform: translateX(0);
}

.services-section::-webkit-scrollbar {
	width: 0px;
}

.services-section::-webkit-scrollbar-track {
	background: #f5f5f5;
}

.services-section::-webkit-scrollbar-thumb {
	background: #000000;
}

.services-section .service-number {
	font-size: 80px;
	/* Reduced size for better visibility */
	font-weight: 900;
	color: #fff;
	text-align: center;
	position: relative;
	background: #191919;
	min-height: 140px;
	width: 12%;
	padding-inline: 20px;
	overflow: hidden;
}

.services-section .service-number p {
	margin-bottom: 0;
	position: absolute;
	/* top: 0; */
	bottom: -45px;
	left: 0;
	margin-inline: 0;


}

.services-section .service-content {
	width: 85%;
	background-color: #1a1a1a;
	padding: 22px;
	border-radius: 0px;
	display: flex;
	min-height: 140px;
}

.services-section .service-title {
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	margin-bottom: 15px;
	letter-spacing: 1px;
	width: 24%;
	line-height: 1.6;
	padding-inline: 15px;
	margin-bottom: 0;
}

.services-section .service-description {
	font-size: 16px;
	color: var(--white);
	line-height: 1.8;
	width: 62%;
	margin-bottom: 0;
	margin-left: auto;
	margin-right: 50px;
}

/* Floating Elements */
.floating-elements {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	overflow: hidden;
}

.floating-elements .floating-circle {
	position: absolute;
	border-radius: 50%;
	background: linear-gradient(135deg, rgba(255, 107, 53, 0.1) 0%, rgba(255, 107, 53, 0.05) 100%);
	animation: float 20s infinite linear;
}

.floating-elements .floating-circle:nth-child(1) {
	width: 100px;
	height: 100px;
	top: 20%;
	left: 10%;
	animation-delay: 0s;
}

.floating-elements .floating-circle:nth-child(2) {
	width: 60px;
	height: 60px;
	top: 60%;
	right: 15%;
	animation-delay: -7s;
}

.floating-elements .floating-circle:nth-child(3) {
	width: 80px;
	height: 80px;
	bottom: 30%;
	left: 20%;
	animation-delay: -14s;
}

@keyframes float {
	0% {
		transform: translateY(0px) rotate(0deg);
	}

	50% {
		transform: translateY(-20px) rotate(180deg);
	}

	100% {
		transform: translateY(0px) rotate(360deg);
	}
}

/* Scroll Indicator */
.scroll-indicator {
	position: fixed;
	right: 30px;
	top: 50%;
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	gap: 15px;
	z-index: 1000;
}

.scroll-indicator .scroll-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.3);
	cursor: pointer;
	transition: all 0.3s ease;
}

.scroll-indicator .scroll-dot.active {
	background: #ff6b35;
	transform: scale(1.3);
}

/* Responsive Design */
@media (max-width: 768px) {
	.top-nav .nav-items {
		gap: 20px;
	}

	.top-nav .nav-item {
		font-size: 14px;
	}

	.services-section .service-item {
		flex-direction: column;
		text-align: center;
		padding: 20px;
	}

	.services-section .service-number {
		margin-right: 0;
		margin-bottom: 20px;
		font-size: 100px;
		min-width: auto;
		width: 75%;
	}

	.scroll-indicator {
		display: none;
	}
}

/* indestries seciton */

.industries-section {
	padding: 60px 20px;
	text-align: center;
	background: #111111;
}

.industries-section h3 {
	margin-bottom: 24px;
	font-weight: bold;
	color: #fff;
}

.industry-card {
	background-color: var(--black);
	padding: 60px 20px;
	margin-bottom: 30px;
	position: relative;
	transition: transform 0.3s ease;
	z-index: 1;
	display: flex;
	flex-direction: column;
	height: 100%;

}

/* Border effect with before + after */
.industry-card::before,
.industry-card::after {
	content: "";
	position: absolute;
	z-index: -1;
	width: 1px;
}

/* Gradient border layer */
.industry-card::before {
	background: linear-gradient(to bottom,
			black 0%,
			gray 30%,
			#555 50%,
			gray 70%,
			black 100%);
	right: 0px;
	top: 0;
	width: 1px;
	height: 100%;
}

/* Inner background layer (to create border thickness) */
.industry-card::after {

	left: 0px;
	top: 0;
	width: 1px;
	background: linear-gradient(to bottom,
			black 0%,
			gray 30%,
			#555 50%,
			gray 70%,
			black 100%);
	height: 100%;

}


.industry-card {
	position: relative;
	transition: 0.3s all ease-in-out;
}

.industry-card .industry-box-hover {
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px) scale(0.98); /* ✅ thoda neeche se aayega */
  transition: 
    opacity 0.5s ease-out,
    transform 0.5s cubic-bezier(0.4, 0, 0.2, 1),
    visibility 0s linear 0.5s; /* ✅ delay visibility remove hone ka */
  z-index: -9;
  top: 0;
  left: 0;
  position: absolute;
  right: 0;
  margin: auto;
  bottom: 0;
  max-width: 85%;
}

.industry-card:hover .industry-box-hover {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1); /* ✅ smoothly move up & grow */
  transition-delay: 0s; /* ✅ hover pe turant visible ho */
}

.industry-box-hover img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	filter: brightness(150%) contrast(120%);
	mix-blend-mode: screen;
}


.industry-card .industry-box-hoverimg {
	width: 100%;
	height: 100%;
}

/* .industry-card:hover::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../images/cursor-image.png);
	background-size: 20px 20px;
	pointer-events: none;
	z-index: 1;
} */

.industry-card .icon {
	font-size: 40px;
	margin-bottom: 20px;
	color: #fff;
}

.industry-card h5 {
	color: var(--primary);
	font-weight: bold;
}

.industry-card p {
	font-size: 14px;
	color: var(--white);
}

/* solutions-section  css */
.digital-solutions {
	background-color: var(--light-blue);
	padding-bottom: 120px;
}

.digital-solutions .digital-row {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	padding-inline: 20px;
	/* 3 equal columns */

}


/* .digital-solutions .section-title {
	color: #ff6200;
	font-weight: bold;
	margin-bottom: 20px;
} */

.digital-solutions .sub-title {
	color: #666;
	font-style: italic;
	margin-bottom: 40px;
}

.digital-solutions .card-custom {
	border: none;
	padding: 20px;
	/* border-left: 2px solid #000; */
	border-radius: 0;
	display: flex;
	flex-direction: column;
	height: 100%;
	background: transparent;
	transition: 0.3s all ease-in-out;
	overflow-x: hidden;
}

.digital-solutions .card-custom:not(:last-child) {
	border-right: none;
	/* make sure only last gets it */
}


.digital-solutions .digital-row .col:not(:first-child) {
	border-left: 2px solid #000;
	/* ya jo bhi color chahiye */
}





.digital-solutions .card-custom:hover {
	background: linear-gradient(to top, rgba(255, 255, 255, 0.8), transparent);

}

.digital-solutions .card-custom:hover img {
	transform: translateX(100%);
}


.digital-solutions .card-custom img {
	width: 100%;
	max-width: 150px;
	margin-bottom: 15px;
	transition: 0.3s all ease-in-out;
}

.digital-solutions .card-custom p {
	color: #333;
	font-size: 14px;
}

/* digital testimonials slider */
.testimonials {
	background-color: var(--black);
	padding: 270px 0 80px 0px;
	margin-top: -65px;
}

.digital-testimoniall {
	position: relative;
}

.digital-testimoniall::before {
	position: absolute;
	content: "";
	background-image: url(../images/circle.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	height: 470px;
	top: 0;
	left: 0;
	width: 400px;
	bottom: 0;
	margin: auto;
	right: 0;
	z-index: -9;
}

.digital-testimoniall::after {

	position: absolute;
	content: "Testimonials";
	width: 100%;
	height: 100%;
	font-size: 10vw;
	color: #fff;
	inset: 0;
	font-weight: 300;
	text-align: center;
	top: -145px;
	z-index: -1;
	background: linear-gradient(to top, #000000, #565656);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;

}


.home-skills.digital-skills .home-skills-box .marquee-box {
	width: 100%;
}

.home-skills.digital-skills .section-space {
	padding: 0px
}

.home-skills.digital-skills {
	padding-block: 30px;
}

.home-skills.digital-skills h2 {
	font-size: 24px;
	margin-bottom: 20px;
}

.home-skills.digital-skills .home-skills-box .items {
	border: 1px solid #d9d9d924;
	padding-inline: 10px;
	min-height: 70px;
	border-radius: 8px;
	margin: 0 25px;
	min-width: 100px;
	text-align: center;
	display: flex;
	justify-content: center;
}

.testimonials h3 {
	color: var(--white);
	font-size: 4rem;
	opacity: 0.1;
	z-index: 1;
	text-align: center;
	position: relative;
	z-index: 9;
}

.digital-testimoniall .item {
	background: var(--black);
	margin: 50px 0px;
	padding: 20px;
	border-radius: 10px;
	text-align: center;
	display: flex;
	align-items: center;
	gap: 15px;
	min-height: 220px;
}



.digital-testimoniall .mg-box {
	width: 20%;
	height: 20%;
	border: 2px solid var(--primary);
	border-radius: 100%;
}

.des {
	text-align: start;
	color: var(--white);
}

.digital-testimoniall .owl-stage-outer {
	position: relative !important;
}

.digital-testimoniall .owl-stage-outer::before {
	position: absolute !important;
	content: "";
	width: 100%;
	height: 90%;
	background: #191919;
	z-index: -1;
	padding: 20px;
	max-width: 50%;
	margin: auto;
	left: 0;
	right: 0;
	min-height: 300px;
	top: 0;
	bottom: 0;
	border-radius: 10px;
}

.digital-testimoniall .item img {
	border-radius: 50%;
	width: 100%;
	height: 100%;
}

.digital-testimoniall .item p {
	font-size: 1.1rem;
	margin-bottom: 10px;
}

.digital-testimoniall .item span {
	color: #ff6200;
}

.nav-images {
	display: flex;
	justify-content: center;
	margin-top: 20px;
	position: relative;
	z-index: 9;
}


.nav-images img {
	width: 50px;
	height: 50px;
	margin: 0 10px;
	cursor: pointer;
	border-radius: 100%;
	border: 2px solid var(--primary);

}

/* achivements section css */

.achievements-section {
	position: relative;
	overflow: hidden;
	color: #fff;
	margin-top: -98px;
}

.achievements-section .overlay-orange {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 55%;
	background: rgba(241, 104, 7, 0.92);
	clip-path: polygon(22% 0, 100% 0, 100% 100%, 0% 100%);
	z-index: 1;
	pointer-events: none;
}

.achievements-section .content {
	position: relative;
	z-index: 2;
	/* padding: 3rem 0 2.5rem 0; */
	background-color: #151515;
	background-image: url(../images/cta-2-bg.jpg);
	background-size: cover;
	width: 100%;
	height: 100%;
	overflow: hidden;
	padding: 30px 50px 40px 50px;
}

.achievements-section .content::before {
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	background-color: var(--light-black);
	left: 0;
	top: 0;
	z-index: -1;
}

.fram-box {
	position: absolute;
	z-index: 9;
	top: 0;
	right: -100%;
	height: 100%;
	transition: 0.3s all ease-in-out;
}

.achievements-section.hovered .fram-box {
	right: 0%;
}

.fram-box img {
	width: 600px;
	height: 100%;
}

.achievements-section .content .row.position-relative {
	z-index: 99
}

.achievements-section .title-large {
	font-size: 7rem;
	font-weight: 300;
	color: #fff;
	position: absolute;
	left: 40px;
	top: 45px;
	letter-spacing: 1px;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(180deg, rgb(255 255 255) 0%, rgb(32 32 32) 57%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
}


.achievements-section .header {
	font-size: 1.6rem;
	margin-left: 35px;
	margin-bottom: 2.5rem;
	margin-top: 1.8rem;
	font-weight: 400;
	position: relative;
	z-index: 2;
}

.achievement-card {
	background: transparent;
	padding: 0 0.8rem;
	text-align: left;
	min-height: 200px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
	z-index: 2;
}

.achievement-number {
	font-size: 4rem;
	font-weight: 900;
	color: #fff;
	display: inline-block;
	margin-bottom: 0.25rem;
}

.plus {
	font-size: 2rem;
	color: #fff;
	vertical-align: top;
}

.achievement-desc {
	text-transform: uppercase;
	font-size: 1rem;
	color: #fff;
	opacity: .92;
	margin-top: 0.3rem;
	letter-spacing: .5px;
}

.arrow-icon {
	color: #f16807;
	font-size: 1.35rem;
	margin-right: 0.4rem;
	vertical-align: middle;
}

/* checkbox toggle css start */

.toggle-section h3 {
	font-size: 45px;
	margin-bottom: 0;
	font-weight: 800;
}

.toggle-section .container .row {
	align-items: center;
}

section.toggle-section {
	padding: 60px;
	background: var(--primary);
	color: #fff;
	background-image: url(../images/toggle-section-bg.png);
	background-size: cover;
	position: relative;
	z-index: 1;
}

section.toggle-section::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: var(--primary);
	opacity: 0.9;
}

/* From Uiverse.io by Shoh2008 */
.checkbox-wrapper-25 input[type="checkbox"] {
	background-image: -webkit-linear-gradient(hsla(0, 0%, 0%, .1), hsla(0, 0%, 100%, .1)),
		-webkit-linear-gradient(left, #f66 50%, #6cf 50%);
	background-size: 100% 100%, 200% 100%;
	background-image: url(../images/toggle-image.png);
	background-size: cover;
	background-position: 0 0, 40px 0;
	border-radius: 100px;
	cursor: pointer;
	height: 125px;
	width: 300px;
	padding-right: 100px;
	-webkit-appearance: none;
	-webkit-transition: .25s;
}

.checkbox-wrapper-25 input[type="checkbox"]:after {
	background-color: #ffffffd9;
	background-image: -webkit-linear-gradient(hsla(0, 0%, 100%, .1), hsla(0, 0%, 0%, .1));
	border-radius: 100px;
	content: 'Contact us →';
	/* <-- Added arrow */
	color: var(--primary);
	letter-spacing: 2px;
	display: flex;
	align-items: center;
	font-size: 20px;
	justify-content: center;
	font-size: 18px;
	/* Adjust for better visibility */
	font-weight: 400;
	height: 125px;
	width: 200px;
	text-align: center;
}


.checkbox-wrapper-25 input[type="checkbox"]:checked {
	background-position: 0 0, 100px 0;
	padding-left: 100px;
	padding-right: 0;
}



/* video slider  */

.video-slider-section {
	padding: 3rem 0;
	position: relative;
	background-color: var(--white);


}



.video-slider-section.seo-video-slider {
	background-color: var(--black);
}

.section-title {
	text-align: center;
	margin-bottom: 3rem;
}

.section-title h2 {
	font-size: 2.5rem;
	font-weight: 700;
	color: #fff;
	margin-bottom: 1rem;
}

.section-title .highlight {
	color: #ff6b35;
}

.section-title p {
	font-size: 1.1rem;
	color: #ccc;
	max-width: 600px;
	margin: 0 auto;
}

/* .owl-carousel .item-video {
	position: relative;
	overflow: hidden;
	border-radius: 0px;
	border: 1px solid #ccc;
	transition: transform 0.3s ease;
} */



.video-info {
	border-radius: 0 !important;
}

.video-info {
	color: #000;
}

.video-wrapper {
	position: relative;
	padding-bottom: 56.25%;
	min-height: 290px;
	height: auto;
	overflow: hidden;
}

.video-wrapper video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.video-slider-section .owl-video-play-icon {
	display: none !important;
	/* always hide default play icon */
}

.video-slider-section .item-video .video-info {
	position: absolute;
	z-index: 9;
	bottom: 0;
	padding: 20px;
	color: #fff;
}

.testimonial-box {
	height: 100%;
}

.video-slider-section .item-video.no-video {
	height: 100%;
	min-height: 100%;
	max-height: 100%;
	min-height: 370px;
	border: 1px solid #959595;
}

.about-video-carousel .owl-prev .nav-btn img.nav-img,
.about-video-carousel .owl-next .nav-btn img.nav-img {
	filter: brightness(0) saturate(100%) invert(0%) sepia(0%) saturate(15%) hue-rotate(67deg) brightness(99%) contrast(102%);

}

.about-video-carousel .nav-btn {
	transform: rotate(180deg);
}


.about-video-carousel {
	position: unset;
}

.about-video-carousel .owl-nav {
	position: absolute;
	top: 45px;
	right: 45px;
}

/* .owl-nav {
    flex-direction: row-reverse;
} */

/* .item-video:hover .video-info {
      transform: translateY(0);
    }
     */
/* .video-info h5 {
      color: #fff;
      margin-bottom: 0.5rem;
      font-size: 1.1rem;
      font-weight: 600;
    }
    
    .video-info p {
      color: #ccc;
      margin: 0;
      font-size: 0.9rem;
    } */

/* When no video, show testimonial style */
.no-video {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	/* min-height: 300px; */
	padding: 0rem;
	text-align: left;
	/* box-shadow: 0 10px 30px rgba(0,0,0,0.1); */
}


section.video-slider-section.seo-video-slider .no-video {
	background-color: var(--light-black);
}

.section.video-slider-section.seo-video-slider .testimonial-text {
	color: var(--white);
}

.section.video-slider-section.seo-video-slider .testimonial-box {
	color: white;
}

.video-slider-section .item-video.no-video img.fram-image {
	position: absolute;
	width: 200px !important;
	bottom: 0;
	right: -0px;
	filter: brightness(0) saturate(100%) invert(0%) sepia(6%) saturate(7477%) hue-rotate(269deg) brightness(105%) contrast(105%)
}

.video-slider-section.seo-video-slider .item-video.no-video img.fram-image {
	filter: unset;
}

section.video-slider-section.seo-video-slider .about-video-carousel .owl-prev .nav-btn img.nav-img,
section.video-slider-section.seo-video-slider .about-video-carousel .owl-next .nav-btn img.nav-img {
	filter: unset
}

.testimonial-box {
	max-width: 90%;
	margin: auto;
}

.testimonial-text {
	font-size: 14px;
	color: #333;
	line-height: 1.6;
	margin-bottom: 1.5rem;
}

.testimonial-author h5 {
	font-weight: bold;
	margin-bottom: 0.3rem;
}

.testimonial-author span {
	font-size: 0.9rem;
	color: #777;
}

/* Ensure no-video items match the carousel height */
.owl-carousel .no-video {
	height: 100%;
}


.play-button {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80px;
	height: 80px;
	background: rgba(255, 107, 53, 0.9);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: all 0.3s ease;
	z-index: 10;
}

.play-button:hover {
	background: rgba(255, 107, 53, 1);
	/* transform: translate(-50%, -50%) scale(1.1); */
}

.play-button::before {
	content: '';
	width: 0;
	height: 0;
	border-left: 20px solid #fff;
	border-top: 12px solid transparent;
	border-bottom: 12px solid transparent;
	margin-left: 4px;
}

/* Custom Owl Navigation */
.owl-nav {
	margin-top: 2rem;
	text-align: center;
}

/* .owl-nav button {
	background: #ff6b35 !important;
	color: #fff !important;
	border-radius: 50% !important;
	width: 50px !important;
	height: 50px !important;
	margin: 0 10px !important;
	font-size: 18px !important;
	transition: all 0.3s ease !important;
}

.owl-nav button:hover {
	background: #e55a2b !important;
	transform: scale(1.1) !important;
} */

.owl-dots {
	text-align: center;
	margin-top: 1.5rem;
}

.owl-dot {
	width: 12px !important;
	height: 12px !important;
	background: #666 !important;
	border-radius: 50% !important;
	margin: 0 5px !important;
	transition: all 0.3s ease !important;
}

.owl-dot.active {
	background: #ff6b35 !important;
	transform: scale(1.2) !important;
}

/* digital markting css start */

.seo-success-section {
	background-color: var(--black);
	padding: 60px 20px;
	overflow-x: hidden;
}

.sec-inner .seo-sucess-img-box img {
	width: 100%;
}

.seo-success-section .bubble {
    top: 10% !important;
}


.seo-success-section .sec-inner .main-heading {
    text-transform: math-auto;
}


.seo-success-section .sec-inner {
	background: #191919;
	padding: 20px;
	border-radius: 10px;
}

.seo-success-section .subtext {
	color: #cccccc;
	font-size: 0.95rem;
	margin-bottom: 30px;
}

.seo-success-section .custom-img {
	width: 100%;
	border-radius: 12px;
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
	margin-bottom: 35px;
}

.seo-success-section .main-text {
	font-size: 1.05rem;
	line-height: 1.7;
	color: #e0e0e0;
}

.seo-success-section .brand-name {
	color: #f97316;
	font-weight: 600;
}

.seo-success-section .lead-section {
	font-weight: 400;
	margin-bottom: 16px;
	margin-top: 30px;
	font-size: 14px;
}


/* markting important */

.marketing-business {
	padding: 60px 20px;
	overflow-x: hidden;

}




.markting-row {
	background-image: url(../images/business-ip-fram.png);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: -350% center;
	/* Start hidden to the left */
	transition: background-position 1s ease-in-out;
	overflow: hidden;
	/* Ensures anything overflowing is clipped */
}

.marketing-business.hovered .markting-row {
	background-position: center center;
	/* Slides to center on hover */
}



.marketing-business .marketing-card {
	background-color: #E8E8E9ED;
	padding: 30px 25px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	background-size: 200% 200%;
	min-height: 280px;
	display: flex;
	flex-direction: column;
	height: 100%;

}

.marketing-business .marketing-card:hover {
	/* transform: translateY(-6px); */
	box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
}

.marketing-business .card-subtitle {
	color: var(--black);
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 12px;
}

.marketing-business .card-title {
	font-size: 1.25rem;
	font-weight: 700;
	color: hsl(0, 0%, 15%);
	margin-bottom: 15px;
	text-transform: capitalize;
	min-height: 50px;
}

.marketing-business .card-description {
	font-size: 0.95rem;
	color: #5D5D5D;
	line-height: 1.6;

}



.marketing-card.orange .card-title,
.marketing-card.orange .card-description,
.marketing-card.orange .card-subtitle {
	color: #ffffff;
}


/* marktng business */

.seo-steps-section {
	background-color: var(--black);
}

.seo-steps-section .step-card {
	background: #36302E;
	position: relative;
	padding: 20px;
	min-height: 324px;
	overflow: hidden;
	transition: 0.3s all ease-in-out;
}

.seo-steps-section .step-card .step-title {
	margin-top: 20px;
	max-width: 70%;
}

.seo-steps-section .step-card:hover .step-number {
	color: var(--primary) !important;
}


/* .seo-steps-section .step-row {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 20px;
	margin-top: 40px !important;
} */

.seo-steps-section .step-row {
	display: flex;
	justify-content: center;
	/* center the children horizontally */
	flex-wrap: wrap;
	/* allow wrapping on smaller screens */
	gap: 20px;
	/* spacing between items */
	margin-top: 40px !important;
}

.seo-steps-section .step-row>* {
	flex: 0 0 calc(20% - 20px);
	/* 5 columns on large screens */
	max-width: calc(20% - 20px);
}

.step-row .col-md-3.col-sm-6 {
	width: 100%;
}

.seo-steps-section .step-card::before {
	content: "";
	position: absolute;
	top: -10px;
	left: 6%;
	transform: translateX(-50%);
	width: 50px;
	height: 50px;
	background-color: #000;
	/* Match page background or choose another */
	border-radius: 50%;
	/* Makes it fully rounded */
	z-index: 1;
}

.seo-steps-section .step-card .step-desc {
	background: #191919;
	color: #fff;
	font-size: 12px;
	position: absolute;
	bottom: 0;
	width: 100%;
	left: 0;
	padding: 20px;
	text-align: left;
	line-height: 25px;
	max-height: 215px;
	min-height: 215px;
	overflow-y: auto;
}



.seo-steps-section .step-card .inner-box .step-number {
	font-size: 75px;
	font-weight: 700;
	transition: 0.3s all ease-in-out;
	position: absolute;
	right: 0;
	top: 45px;
}


.seo-steps-section .step-card .inner-box {
	align-items: center;
	justify-content: space-between;
	margin-top: 20px;
}

/* why seo markting section */

.why-seo-marketing {
	padding: 60px 0;
	background-color: #F4F7F7;
}

.why-seo-marketing .header-text {
	text-align: left;
	max-width: 900px;
	margin-bottom: 40px;
}

.why-seo-marketing .header-text h2 {
	font-size: 28px;
	font-weight: bold;
	margin-bottom: 15px;
}

.why-seo-marketing .header-text h2 span {
	color: var(--primary);
	/* Orange accent */
}

.why-seo-marketing .header-text p {
	color: #666;
	font-size: 16px;
	line-height: 1.6;
}

.why-seo-marketing .features {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	/* 3 columns */
}

.why-seo-marketing .feature-box {
	border-bottom: 1px solid #eee;
	padding: 30px;
	transition: all 0.3s ease;
	border-left: 1px solid #eee;
	border-radius: 0;
	margin-bottom: 0;
	transition: all 0.3s ease, background 0.3s ease;
	height: auto;

}


.why-seo-marketing .feature-box:nth-child(3n+1) {
	border-left: none;
	padding-left: 0;
}

.why-seo-marketing .feature-box:nth-last-child(-n+3) {
	border-bottom: none;
}

.why-seo-marketing .feature-box:nth-last-child(n+3) {
	border-right: none;
}

.why-seo-marketing .feature-box:nth-child(-n+3) {
	border-top: 0;
}



.why-seo-marketing .feature-box:hover {
	background: linear-gradient(to bottom, #F4F7F7, #ffffff);
}


.why-seo-marketing .feature-box h3 {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
}

.why-seo-marketing .feature-box p {
	font-size: 15px;
	color: #555;
	text-align: left;
}


/* seo achivments */

.seo-achievements {
	background: #000;
	position: relative;
	overflow-x: hidden;
}

section.seo-achievements .shape-circle {
	position: absolute;
	right: -50px;
	overflow: hidden;
	top: 15%;
}

.seo-achievements .achievement-box {
	position: relative;
	text-align: center;
}

.seo-achievements .circle {
	position: relative;
	display: inline-block;
	width: 130px;
	height: 130px;
	border-radius: 50%;
	background: var(--primary);
	;
	/* Orange center */
	color: #fff;
	font-size: 22px;
	font-weight: bold;
	line-height: 130px;
	z-index: 1;
}

.achievement-box::before {
	position: absolute;
	content: "";
	width: 2px;
	height: 100%;
	background: linear-gradient(to bottom, black, gray);
	left: 0;
}

.seo-achievements .col-md-4:nth-child(3n+1) .achievement-box::before {
	display: none;
}

.business-expert-section.seo-cta .highlight-text {
	padding: 0px 0px;
}

.seo-achievements .achievement-box p {
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	margin-top: 15px;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 24px;
}

/* Large transparent number behind the circle */
/* .seo-achievements .achievement-box::after {
	content: attr(data-big-num);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 120px;
	font-weight: 900;
	color: rgba(255, 255, 255, 0.08);
	z-index: 0;
} */


.achievement-box .img-box {
	position: relative;
}

.achievement-box .img-box span {
	position: absolute;
	z-index: 11;
	left: 50%;
	color: #fff;
	top: 50%;
	transform: translate(-50%, -50%);
	margin: auto;
	font-size: 30px;
	font-weight: 900;
}

.seo-achievements h2 {
	font-size: 24px;
	margin-bottom: 20px;
}

.business-expert-section.seo-cta {
	padding: 80px 20px;
	background-image: url('../images/seo-cta.png');
	/* Replace with correct path */
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	color: #fff;
	border-block: 1px solid #525252;
}

.service-details.seo-case-study {
	background-color: var(--black);
	position: relative;
}

.service-details.seo-case-study .case-study-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 100px;
	background-color: #000;
	flex-direction: column;
	height: 100%;
	max-height: 60%;
	align-items: end;
}

section.service-details.seo-case-study .srv-d-slider-cta .owl-nav {
	justify-content: center;
	display: flex;
	flex-direction: row-reverse;
	right: 3%;
	top: 35%;
}

section.service-details.seo-case-study .srv-d-slider-cta .owl-nav .owl-prev {
	transform: rotate(180deg)
}

.srv-d-slider-cta .owl-nav span.nav-btn {
	border: none;
}


section.service-details.seo-case-study .col-lg-4 {
	display: flex;
	justify-content: end;
	align-items: center;
}

.service-details.seo-case-study .case-study-content h3 {
	color: white;
	border-bottom: 2px solid var(--primary);
	padding-bottom: 5px;
	margin: 0;
	font-size: 42px;
	text-transform: uppercase;
}

.service-details.seo-case-study .srv-d-slider-cta .owl-nav {
	justify-content: center;
	display: flex;
	flex-direction: row-reverse;
	gap: 20px;
	margin-top: 30px;
	position: absolute;
	right: 14%;
	top: 25%;
}

.service-details.seo-case-study .srv-d-slider-cta .owl-nav .owl-prev {
	background-color: transparent;
}

.service-details.seo-case-study .srv-d-slider-cta {
	position: unset;
}

.service-details.seo-case-study .srv-d-slider-cta .box {
	position: relative;
}

.service-details.seo-case-study .srv-d-slider-cta .box .img-box img {
	max-height: 700px;
	height: 700px;
	object-fit: cover;
}

.service-details.seo-case-study .srv-d-slider-cta .content-box {
	color: #fff;
	bottom: 0px;
	;
	padding: 15px;
	position: absolute;
	background: linear-gradient(to top, #000000 8%, transparent 95%);
}

.service-details.seo-case-study .srv-d-slider-cta .content-box p {
	color: #fff
}

.business-expert-section.seo-cta .business-expert-left h3 {
	font-size: 3.125vw;
	font-weight: 700;
	margin-bottom: 60px;
}


.business-expert-section.seo-cta .highlight-text {
	background-color: transparent;
	padding: 0 10px;
	color: var(--primary);
}

.business-expert-section.seo-cta .business-expert-right h3 a {
	color: #fff;
	border-bottom: 2px solid var(--primary);
	padding-bottom: 10px;
	font-size: 40px;
	text-transform: uppercase;
}

.business-expert-section.seo-cta .business-expert-right {
	display: flex;
	justify-content: end;
	align-items: center;
	padding-right: 100px;
}









.itxit-cursor {
	position: absolute;
	width: 180px;
	height: 180px;
	pointer-events: none;
	transform: translate(-50%, -50%);
	z-index: 99;
	display: none;
	opacity: 1;
	visibility: visible;
	transition: transform 0.15s ease-out;
	filter: brightness(150%) contrast(120%);
	mix-blend-mode: exclusion;
}

.itxit-cursor.click-effect {
	transform: translate(-50%, -50%) scale(1.5);
	transition: transform 0.2s ease;

}

/* Section where image cursor should work */
.custom-cursor-section {
	cursor: none;
	/* hide default cursor only inside this section */
}

.single-service-details {
	background-image: url("../images/circle-bg.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 100%;
	z-index: -1;
}

.poupform-main {
	background: url(https://via.placeholder.com/1500x500) no-repeat center center;
	background-size: cover;
	padding: 40px;
	max-width: 940px;
	background-color: #fff;
	box-shadow: 3px 4px 12px #0000002b;
	position: relative;
}


.poupform-main .btn {
	border-radius: 20px;
	padding: 8px 15px;
	font-size: 14px;
	background-color: var(--primary);
	min-width: 140px;
	color: var(--white);
	font-weight: 400;
}



.itxit-scroll::-webkit-scrollbar-track {
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
	background-color: #F5F5F5;
}

.itxit-scroll::-webkit-scrollbar {
	width: 6px;
	background-color: #F5F5F5;
}

.itxit-scroll::-webkit-scrollbar-thumb {
	background-color: #000;

}


/* model popup start here */

/* Modal general look */
.modal-content {
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
	border: none;
}

/* Form fields */
.poupform-main input[type="text"],
.poupform-main input[type="email"],
.poupform-main input[type="tel"],
.poupform-main textarea,
.poupform-main select {
	border-radius: 8px;
	border: 1px solid #ddd;
	padding: 10px 14px;
	font-size: 14px;
	width: 100%;
	margin-bottom: 15px;
	transition: all 0.3s ease;
}

.poupform-main input:focus,
.poupform-main textarea:focus,
.poupform-main select:focus {
	border-color: #ee6910;
	box-shadow: 0 0 6px rgba(238, 105, 16, 0.4);
	outline: none;
}

/* Submit button */
.poupform-main input[type="submit"] {
	background-color: #ee6910;
	border: none;
	padding: 12px 25px;
	font-size: 15px;
	font-weight: 600;
	color: #fff;
	border-radius: 8px;
	transition: background 0.3s ease;
}

.poupform-main input[type="submit"]:hover {
	background-color: #d65c0f;
}


/* custom-scroll-bar */
.scrollable-section {
	max-height: 50vh;
	/* or any fixed height */
	overflow-y: auto;
	overscroll-behavior: contain;
	/* prevents default scroll chaining issues */
	overflow-x: hidden;
}

.custom-scrollbar::-webkit-scrollbar {
	width: 0px;
}

.custom-scrollbar::-webkit-scrollbar-track {
	background: #f5f5f5;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
	background: #000000;
}


/* new key service seciotn start here */


.uae-key-services h2 {
	font-size: 1.75rem;
}

.uae-key-services .highlight {
	color: var(--primary-color);
}

/* Key Services Box with :before circle */
.uae-key-services .key-services {
	display: inline-block;
	background: #fff;
	padding: 8px 20px;
	border: 1px solid var(--border-color);
	border-radius: 6px;
	font-size: 1rem;
}

.uae-key-services .key-services::before {
	content: "";
	position: absolute;
	left: -12px;
	top: 50%;
	transform: translateY(-50%);
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 3px solid var(--primary-color);
	background: #fff;
}

/* Service Box */
.uae-key-services .service-box {
	border: 1px solid #959595;
	border-radius: 12px;
	background: #fff;
	position: relative;
}

/* Decorative lines with :after */


.uae-key-services .service-box h6 {

	margin-bottom: 15px;
}

.uae-key-services .service-box p {
	color: #000000;
	font-size: 13px;
	line-height: 2;
}

.uae-key-services .custom-outer-row:nth-child(3):hover .third-booton-img {
	transform: translateX(85%);
	transition: 0.5s all ease-in-out;
}

.uae-key-services .custom-outer-row:nth-child(3) .third-booton-img img {
	max-width: 200px;
}


.uae-key-services .custom-outer-row:nth-child(3) .third-booton-img {
	transform: translateX(0);

	transition: 0.5s all ease-in-out;
	position: absolute;
	bottom: 0
}





/* Outer rows */



.uae-key-services .custom-outer-row {
	padding-inline: 30px;
	padding-block: 40px;
}

/* .uae-key-services .custom-outer-row:last-child {
    padding-bottom: 0;
} */

/* No border on first row */
.uae-key-services .custom-outer-row:not(:first-child) {
	border-top: 1px solid #959595;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
}

/* Vertical divider lines */
.uae-key-services .custom-outer-row .col-md-3.col-sm-6,
.uae-key-services .custom-outer-row .col-md-6.col-sm-12 {
	position: relative;
}

.uae-key-services .custom-outer-row .col-md-3.col-sm-6:not(:last-child)::after,
.uae-key-services .custom-outer-row .col-md-6.col-sm-12:not(:last-child)::after {
	position: absolute;
	content: "";
	width: 1px;
	height: 100%;
	background: #959595;
	right: 0;
	top: 0;

}


.uae-key-services .custom-outer-row:nth-child(3) {
	background-image: url("../images/end-to-bottom.png");
	background-repeat: no-repeat;
	background-position: right bottom;
	/* start from right */
	background-size: 200px;
	transition: background-position 0.5s ease-in-out;
	/* smooth animation */
}

.uae-key-services .custom-outer-row:nth-child(3):hover {
	background-position: left bottom;
	/* slide to left on hover */
}


.uae-key-services .outer-box {
	overflow: hidden;
}


.uae-key-services .custom-outer-row .inner-content {
	padding: 40px 15px;
}

.uae-key-services .key-heading-box {
	border: 1px solid #959595;
	max-width: 22%;
	margin: auto;
	text-align: center;
	border-radius: 15px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0;
	padding: 12px 12px;
	margin-top: -1px;
}


.uae-key-services .key-heading-box .main-heading {
	margin-bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

.uae-key-services .key-heading-box .flashing {
	width: 20px;
	height: 20px;
	transform: translateY(0%);
}

.uae-key-services .key-heading-box .flashing:before {
	animation: flashing 2s 2s ease-out;
	border: 3px solid #ffffd0;
}

.uae-key-services .key-heading-box .flashing:after {
	animation: flashing 2s 1s ease-in;
	border: 3px solid var(--primary);
}


.uae-key-services .key-heading-box .flashing {
	position: relative;
	/* necessary for absolute pseudo-elements */
	display: inline-block;
	/* ensures pseudo-elements can center properly */
	margin-right: 20px;
}

.uae-key-services .key-heading-box .flashing::before,
.uae-key-services .key-heading-box .flashing::after {
	content: "";
	width: 70%;
	height: 70%;
	display: block;
	border-radius: 50%;
	background: var(--primary);
	opacity: 0;
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	animation: flashing 1.5s infinite;

}

@keyframes flashing {
	0% {
		transform: scale(0.1);
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

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


.port-folio-large img {
	width: 100%;
	height: 100%;
}

.mbl-testimonial-slider {
	background-color: var(--black);
	margin-top: 50px;
}


.home-mbl-testimonial-videos .item-video {
	height: 300px;
	/* adjust as needed */
}


.home-mbl-testimonial-videos .owl-carousel .owl-video-tn {
	background-size: cover;
	padding-bottom: 56.25%;
	/* 16:9 */
	padding-top: 25px;
}

.home-mbl-testimonial-videos .owl-video-frame {
	position: relative;
	padding-bottom: 56.25%;
	/* 16:9 */
	padding-top: 25px;
	height: 0;
}

.home-mbl-testimonial-videos .owl-video-frame iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.home-mbl-testimonial-videos .owl-dots {
	text-align: center;
	margin-top: 20px;
}

.home-mbl-testimonial-videos .owl-dot {
	display: inline-block;
}


/* .home-mbl-testimonial-videos .owl-carousel.item-video{
	border: none !important;
}
 */




.mbl-home-video-testimonials {
	max-width: 1000px;
	margin: 0 auto;
	text-align: center;
	padding: 0 15px;

	background-color: var(--black);
}

/* ✅ Title & Subtitle */
.mbl-home-video-testimonials .video-section-title {
	font-size: 28px;
	font-weight: bold;
	color: #222;
	margin-bottom: 5px;
}

.mbl-home-video-testimonials .video-section-subtitle {
	font-size: 16px;
	color: #666;
	margin-bottom: 30px;
}

/* ✅ Slider Items */
.mbl-home-video-testimonials .video-section .item {
	opacity: 0.4;
	transition: 0.4s ease all;
	margin: 0 20px;
	transform: scale(0.8);
}


.plyr__control--overlaid {
	background-color: var(--primary) !important;
}

/* @media (max-width: 1000px) {
      .mbl-home-video-testimonials .video-section .item {
        margin: 0;
        transform: scale(0.9);
      }
    } */

.mbl-home-video-testimonials .video-section .active .item {
	opacity: 1;
	transform: scale(1);
}

.mbl-home-video-testimonials .video-section .owl-item {
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateZ(0) scale(1.0, 1.0);
}

.mbl-home-video-testimonials .video-section video {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}

/* ✅ Navigation Styling */
.mbl-home-video-testimonials .owl-nav button {
	position: absolute;
	top: 40%;
	background: rgba(0, 0, 0, 0.5) !important;
	color: #fff !important;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	font-size: 20px !important;
}

.mbl-home-video-testimonials .owl-nav .owl-prev {
	left: -50px;
}

.mbl-home-video-testimonials .owl-nav .owl-next {
	right: -50px;
}


.mbl-testimonials .owl-item {
	background-size: contain;
	background-image: url(../images/blog-card.png);
	background-size: 200% auto;
	background-repeat: repeat-x;
	background-position: 0% 50%;

}




/* flip animation for single case study page */

.flip-container {
    perspective: 1000px;
    display: inline-block;
    margin: 0 2px;
}

.flip-letter {
    position: relative;
    display: inline-block;
    width: auto;
    height: 1.2em;
    text-align: center;
    transition: transform 0.6s;
    transform-style: preserve-3d;
}

.flip-letter.flipped {
    transform: rotateX(180deg);
}

.flip-letter .front,
.flip-letter .back {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flip-letter .front {
    color: inherit;
}

.flip-letter .back {
    color: var(--primary); /* Orange highlight for flip */
    transform: rotateX(180deg);
}


/* Custom AOS-like slide */
/* [data-aos="menu-slide"] {
  opacity: 0;
  transform: translateY(-15px);
  transition: all 0.4s ease;
}

[data-aos="menu-slide"].aos-animate {
  opacity: 1;
  transform: translateY(0);
} */


/* Make collapse work like an off-canvas from right */
/* Start hidden (translate right) */




.page-id-3708 .main-heading {
    text-transform: math-auto;
}


@media (max-width: 768px) {
	.section-title h2 {
		font-size: 2rem;
	}

	.play-button {
		width: 60px;
		height: 60px;
	}

	.play-button::before {
		border-left: 15px solid #fff;
		border-top: 9px solid transparent;
		border-bottom: 9px solid transparent;
	}
}