@font-face {
    font-family: 'Gordita';
    src: url('../fonts/Gordita-Bold.eot');
    src: url('../fonts/Gordita-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gordita-Bold.woff2') format('woff2'),
        url('../fonts/Gordita-Bold.woff') format('woff'),
        url('../fonts/Gordita-Bold.ttf') format('truetype'),
        url('../fonts/Gordita-Bold.svg#Gordita-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gordita';
    src: url('../fonts/Gordita-Black.eot');
    src: url('../fonts/Gordita-Black.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gordita-Black.woff2') format('woff2'),
        url('../fonts/Gordita-Black.woff') format('woff'),
        url('../fonts/Gordita-Black.ttf') format('truetype'),
        url('../fonts/Gordita-Black.svg#Gordita-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gordita';
    src: url('../fonts/Gordita-BlackItalic.eot');
    src: url('../fonts/Gordita-BlackItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gordita-BlackItalic.woff2') format('woff2'),
        url('../fonts/Gordita-BlackItalic.woff') format('woff'),
        url('../fonts/Gordita-BlackItalic.ttf') format('truetype'),
        url('../fonts/Gordita-BlackItalic.svg#Gordita-BlackItalic') format('svg');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gordita';
    src: url('../fonts/Gordita-Medium.eot');
    src: url('../fonts/Gordita-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gordita-Medium.woff2') format('woff2'),
        url('../fonts/Gordita-Medium.woff') format('woff'),
        url('../fonts/Gordita-Medium.ttf') format('truetype'),
        url('../fonts/Gordita-Medium.svg#Gordita-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gordita';
    src: url('../fonts/Gordita-Light.eot');
    src: url('../fonts/Gordita-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gordita-Light.woff2') format('woff2'),
        url('../fonts/Gordita-Light.woff') format('woff'),
        url('../fonts/Gordita-Light.ttf') format('truetype'),
        url('../fonts/Gordita-Light.svg#Gordita-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gordita';
    src: url('../fonts/Gordita-Regular.eot');
    src: url('../fonts/Gordita-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gordita-Regular.woff2') format('woff2'),
        url('../fonts/Gordita-Regular.woff') format('woff'),
        url('../fonts/Gordita-Regular.ttf') format('truetype'),
        url('../fonts/Gordita-Regular.svg#Gordita-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gordita';
    src: url('../fonts/Gordita-Italic.eot');
    src: url('../fonts/Gordita-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Gordita-Italic.woff2') format('woff2'),
        url('../fonts/Gordita-Italic.woff') format('woff'),
        url('../fonts/Gordita-Italic.ttf') format('truetype'),
        url('../fonts/Gordita-Italic.svg#Gordita-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
.dflex2{ 
display: grid;
  place-content: center; /* Centers the content area on screen */
  justify-items: start;  /* Keeps the heading/paragraph left-aligned */
  height: 100%;     /* Centers text lines inside the elements */

}
.hero-title {font-family: 'Gordita';}  
h1, .h1 {
        font-size: calc(1.28205vw + 24.4615px); font-weight: 500;
    }

.footer-links li{float:left; margin-left:5px; margin-right:5px; font-weight: 500;}
footer hr{border-top:1px solid #f3e7d8; opacity: 9;}
.footer-links{ list-style:none; padding:0; margin:8px auto 0 auto; display:inline-block;}
.hero-title{ font-size: 62px;}
.s-banner{ background-image:url("../images/ss-banner-img.jpg"); background-repeat:no-repeat; background-position:right bottom; background-color:#90d6d9; min-height:419px; border-radius:20px;}
.tech-stack-bg{ background:#90a737;}
body {
	font-family: 'Gordita';
	font-style: normal;
	overflow-x: hidden;
	
	
}
.overflow-text{ padding:15px 30px; position: absolute; top:-50px; color:#000; background: #fff; text-align:center;}
.pink{color:#d8135f;}
.team-right-banner-img{background-image:url("../images/team-page-banner.jpg"); background-repeat:no-repeat; background-position:right bottom; background-color:#fef8dd; min-height:419px; border-radius:20px; background-size: contain;}
.certifications-banner-img{background-image:url("../images/certifications-banner-img.jpg"); background-repeat:no-repeat; background-position:right top; background-size: 100%;}
.workforce-management-banner-img{background:#08e8de;}
.fyd-bg{background:#0998ec;}
.data-security-bg{background:#fb7900;}
.sticky-top {background:none;;}
.mega-menu a:hover{color:#c32427;}
.certificate-list{ list-style:none;}
.disclaimer-block h5{font-size:12px; margin-bottom:0;}
.disclaimer-block p{font-size:11px; padding-bottom: 0;
    margin-bottom: 0;}
.disclaimer-block{background:#fffde6; margin-bottom: 35px; float: left;
    padding: 15px;}
.certificate-list li{background:#fff; padding:20px;  border-radius:15px; display: flex; margin-bottom:10px;
    flex-direction: row;}
.certificate-left-side-sticky{    position: sticky;
    height:611px;
    top: 109px;}
.certificate-list li img{ padding-right:18px;}
.bg-light{background:#f5f5f5!important;}
.esg-bg{ background:#fece09;}
/*Menu hove*/
/*Careers Page*/
.form-group input {
    appearance: none;
    z-index: 2;
    background-color: #f7f4f0;
    border: 0;
    border-radius: 8px;
    width: 100%;
    min-height: 50px;
    padding: 14px 15px;
    font-size: 13px;
}
.success-bg{ background:#5cb85c;}
.contact-address-section{ background:url("../images/contact-img.jpg"); background-repeat:no-repeat; background-position:left top; background-size:cover; min-height:420px; background-attachment:fixed;}
.section-yellow-tr{ background:rgba(236,192,11,0.6); padding-top: 8px;
    margin-bottom: 6px;
    padding-left: 16px;
    padding-bottom: 1px; margin-bottom:6px;}
 select {
    appearance: none;
    z-index: 2;
    background-color: #f7f4f0;
    border: 0;
    border-radius: 8px;
    width: 100%;
    min-height: 50px;
    padding: 14px 15px;
    font-size: 13px;
}
 .form-group textarea {
    appearance: none;
    z-index: 2;
    background-color: #f7f4f0;
    border: 0;
    border-radius: 8px;
    width: 100%;
    min-height: 50px;
    padding: 14px 15px;
    font-size: 13px;
}
.dropdown {
    appearance: none;
    z-index: 2;
    background-color: #f7f4f0;
    border: 0;
    border-radius: 8px;
    width: 100%;
    min-height: 50px;
    padding: 14px 15px;
    font-size: 13px;
}
.f-11{font-size:11px;}
.btn-default{background:#fece09; display:inline-block; color:#000; border: 0; min-width: 130px; text-align:center;  padding: 11px 0; border-radius: 30px; font-weight: 500; text-decoration:none;}
.btn-default:hover{ background:#c32427; color:#fff;}
label{ font-weight:500;}
.current-opening-container{background: #f7f4f0; padding: 39px; margin-top: 27px; margin-left: 30px;}
.current-opening-container ul{padding:0; margin:20px 0 0 0;}
.current-opening-container ul li{background-color: #fff; margin-bottom:15px; font-weight:500;
    border-radius: 8px;
    align-items: center;
    
    width: 100%;
    padding:17px;
    display: flex;}
/*End Careers Page*/
/* --- Navbar Styling --- */
       
.navbar-nav {
	border:1px solid #f6f6f6;
	border-radius:35px;
	padding:4px 16px;
}
.navbar-brand span {
	font-size: 1.5rem;
}
.nav-link {
	color: var(--brand-black) !important;
	font-weight: 500;
	padding: 0.5rem 1rem !important;
	transition: color 0.3s;
}
.nav-link:hover, .nav-link.active {
	color: var(--brand-yellow) !important;
}

.ico-dropdown a:after{display:none!important;}
.mega-drop-down a{position:relative;}
/* --- Rest of Page Styling (From previous request) --- */
        .hero-section {
	
	border-radius: 20px;
	padding: 3rem 2rem;

	position: relative;
}
.hero-img {
	max-width: 100%;
	height: auto;
	border-radius: 0 0 20px 20px;
}
.section-title {
	font-weight:500;
	margin-bottom: 3rem;
	text-align: center;

}
#serviceCarousel{margin-top:75px; margin-bottom:60px;}
.icon-circle {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem;
	margin-bottom: 1rem;
	flex-shrink: 0;
}
.bg-icon-yellow {
	background-color: #FFE082;
	color: black;

}
.bg-icon-teal {
	background-color: #B2EBF2;
	color: black;
	
}
.why-us-card {
	background-color: #f5f5f5;
	border-radius: 15px;
	padding: 2rem;
	height: 100%;
	transition: transform 0.3s ease;
}
.why-us-card:hover {
	transform: translateY(-5px);

}
.why-us-icon {
	width: 50px;
	height: 50px;
	background-color: black;
	border-radius: 50%;
	color: var(--brand-yellow);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	margin-bottom: 1.5rem;
}
footer {
	background-color: #f4f4f4;
	padding:2rem 0;
	text-align: center;
	background:url("../images/footer-bg.jpg"); background-repeat:repeat-x;
}
footer a {
	text-decoration: none;
	color: #333;
	margin: 0 3px;
}
.about-right-banner-img {
	background-image:url(../images/about-banner-img.jpg);
	background-position:right bottom;
	background-repeat:no-repeat;
	min-height:419px;
	background-size:contain;
	background-color:#fece09;
}
.whatsapp-icon-footer{background:#000; width:30px; height:30px; border-radius:5px;}
.whatsapp-icon-footer:hover{background:#c32427;}
.whatsapp-icon-footer i{ color:#fff; font-size:22px; line-height:29px;}
.f27{ font-size:27px; line-height:43px;}
.navbar-brand svg a:focus{outline:0;}
p{font-size:16px; color:#000;}
.text-secondary{color:#000!important;}
.text-muted{color:#000!important;}
.footer-social-list{ list-style:none; margin-bottom:0;}
.footer-social-list li{ float:left;} 
.footer-social-list li a{ width:30px; height:30px; background:#000; display:flex; justify-content:center; align-items: center; border-radius:6px;}
footer a:hover{ color:#c32427;}
.footer-social-list li a:hover{ background:#c32427;}
.dropdown-menu span{font-size:12px;}
.navbar-nav .dropdown-menu {border-top: 3px solid var(--brand-yellow);}
.dropdown-menu li{min-width:270px;}
.dropdown-menu li a{font-size:0.9rem; transition: color 0.2s, padding-left 0.2s;}
.dropdown-menu li a:hover{padding-left:20px;}
.dropdown-menu li {position: relative; margin-bottom: 7px; margin-top: 7px;}
.hero-text{ font-size:20px;}
.ol-list{ padding-left:12px;}
.ol-list li{ margin-top:15px;}
/*menu test*/
.exo-menu{
    margin-bottom:0;
	float: left;
	list-style: none;
	border:1px solid #f6f6f6;
    border-radius: 35px;
    padding-left:0;
    border: 1px solid #f6f6f6; background:#fff;
	padding-left: 21px;
    padding-right: 21px;
}
/*Home Banner*/

.who-we-are{padding:67px 0; }
        .hero-banner {
            /* Using a smooth, subtle gradient */
           
            min-height:100vh; /* Full viewport height */
            color: #212529; /* Dark text for contrast */
            display: flex; /* Flexbox for centering and alignment */
            align-items: flex-end; /* Align content to the bottom */
            padding-bottom: 50px; /* Padding for the bottom content area */
          
            /* Add an optional subtle grain/noise effect */
           
            
        }
.hero-bg{ background: url("../images/home-page-banner-background.jpg"); background-size: cover; overflow:hidden;}
.certified-section-bg{ background:url(../images/certified-section-bg.jpg); background-position:left top; background-repeat:no-repeat; background-size:contain; background-color:#e6edf7; min-height:250px; padding-right:72px;}
.relative{ position:relative;}
.bg-grey{background:#f5f5f5;}
.bold{ font-weight: bold;}
        /* Styling for the main headline */
        .hero-title {
           
            color: black; /* Specifically set to black/very dark */
        }

        /* Styling for the subtitle */
        .hero-subtitle {
            font-size: 1.50rem;
            margin-bottom: 2rem;
            color: #343a40; /* Slightly lighter dark color */
        }

        /* Button styling to match the dark aesthetic */
        .btn-custom-dark {
            background-color: black;
            color: white;
            border: 1px solid black;
            padding: 0.75rem 1.5rem;
            transition: background-color 0.3s;
        }

        .btn-custom-dark:hover {
            background-color: #c32427;
            color: white;
        }

        /* Cursor blinking animation from Typed.js */
        .typed-cursor {
            opacity: 1;
            -webkit-animation: blink 0.7s infinite;
            -moz-animation: blink 0.7s infinite;
            animation: blink 0.7s infinite;
            color: black; /* Set cursor color */
            font-size: 4rem;
        }
        @keyframes blink {
            0% { opacity: 1; }
            50% { opacity: 0; }
            100% { opacity: 1; }
        }
/*Home Banner Animation*/
.f50{ font-size:50px;}
.full-height{ height:100vh;}
.our-team-banner-section{ background:url("../images/our-team.jpg"); background-size:100%; background-repeat:no-repeat; background-position:left top;}
.about-hero-section{ background:url("../images/about-hero-section-bg.jpg"); background-size:100%; background-repeat:no-repeat; background-position:left top;}

.scrolled{background:#fff!important; transition: background-color 0.5s ease-in-out; /* Fades over 1 second */}
#container-inside {
    position: relative;
    min-width: 960px;
    max-width: 1280px;
    height: auto;
    min-height: 100%;
    margin: 0px auto;
    padding: 0px auto;
    overflow: visible;
}
/************/


@keyframes pulse {
  0% {
    transform: scale(0.5);
    opacity: 0.8;
  }
  100% {
    transform: scale(2.5);
    opacity: 0;
  }
}
/********/
#circle-small {
    -webkit-animation: circle-small-scale 3s ease-in-out infinite alternate;
    animation: circle-small-scale 3s ease-in-out infinite alternate;
	animation-timing-function: cubic-bezier(.6, 0, .4, 1);
	animation-delay: 0s;
	position: absolute;
	bottom: 200px;
	right: -150px;
  
    width: 300px;
    height: 300px;
    border-radius: 50%;
 
}

#circle-medium {
    -webkit-animation: circle-small-scale 3s ease-in-out infinite alternate;
    animation: circle-small-scale 3s ease-in-out infinite alternate;
	animation-timing-function: cubic-bezier(.6, 0, .4, 1);
	animation-delay: 0.3s;
	position: absolute;
	bottom: 50px;
	right: -300px;
    background: #fff;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    opacity: 0.3;
}

#circle-large {
    -webkit-animation: circle-small-scale 3s ease-in-out infinite alternate;
    animation: circle-small-scale 3s ease-in-out infinite alternate;
	animation-timing-function: cubic-bezier(.6, 0, .4, 1);
	animation-delay: 0.6s;
	position: absolute;
	bottom: -100px;
	right: -450px;
    background: #fff;
    width: 900px;
    height: 900px;
    border-radius: 50%;
    opacity: 0.2;
}

#circle-xlarge {
    -webkit-animation: circle-small-scale 3s ease-in-out infinite alternate;
    animation: circle-small-scale 3s ease-in-out infinite alternate;
	animation-timing-function: cubic-bezier(.6, 0, .4, 1);
	animation-delay: 0.9s;
	position: absolute;
	bottom: -250px;
	right: -600px;
    background: #fff;
    width: 1200px;
    height: 1200px;
    border-radius: 50%;
    opacity: 0.1;
}

#circle-xxlarge {
    -webkit-animation: circle-small-scale 3s ease-in-out infinite alternate;
    animation: circle-small-scale 3s ease-in-out infinite alternate;
	animation-timing-function: cubic-bezier(.6, 0, .4, 1);
	animation-delay: 1.2s;
	position: absolute;
	bottom: -400px;
	right: -750px;
    background: #fff;
    width: 1500px;
    height: 1500px;
    border-radius: 50%;
    opacity: 0.05;
}

@-webkit-keyframes circle-small-scale {
    0% {
        -webkit-transform: scale(1.0);
    }
    100% {
        -webkit-transform: scale(1.1);
    }
}

@keyframes circle-small-scale {
    0% {
        transform: scale(1.0);
    }
    100% {
        transform: scale(1.1);
    }
}

/*End Home Banner*/
/*Home Page CSS*/
	.stats-bar .odometer {
		font-family: inherit; 
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
	}

.carousel-control-prev-icon{background-image:url("../images/slider-btn-left.png"); backgrou-repeat:no-repeat;}
.carousel-control-next-icon{background-image:url("../images/slider-btn-right.png"); backgrou-repeat:no-repeat;}
.carousel-control-prev-icon { width: 3rem; height: 3rem;}
.carousel-control-next-icon { width: 3rem; height: 3rem;}
.carousel-control-prev{ width:auto; opacity:9;}
.carousel-control-next{ width:auto; opacity:9;}
.carousel-control-next, .carousel-control-prev {bottom:125px;}
.icon-bg-yellow{background:#ffda43;}
#serviceCarousel .carousel-inner{width:93%; margin-left:auto; margin-right:auto;}
.btn-learn-more{background:#ffda43;}
.stats-bar .container{background:#ffda43; padding:25px 15px;}
.icon-bg-green{background:#48d6d2;}
     
        
        .service-icon-wrapper {
            width:180px;
            height:180px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 50%;
            margin: 0 auto 15px;
            font-size: 30px;
            color: white;
        }
        
        /* Icon color variations based on the image */
        .icon-custom-software { background-color: #ffda43; } /* Yellow-Orange */
        .icon-mobile { background-color: #1ed7b4; } /* Teal-Green */
        .icon-cloud { background-color: #ffc107; } /* Bright Yellow */
        .icon-iot { background-color: #49d0ff; } /* Bright Blue */
        .icon-ai { background-color: #f07b3d; } /* Orange */

        .service-card {
            text-align: center;
        }

        /* Smart Solution Section */
        .smart-solution-section {
            padding: 40px 0;
        }

        .solution-img {
            max-height: 300px;
            width: 100%;
            object-fit: cover;
            border-radius: 8px;
        }

        .btn-learn-more {
            background-color: var(--secondary-yellow);
            color: var(--dark-color);
            border: none;
            font-weight: 600;
        }

        /* Stats Bar */
        .stats-bar {
            background-color: var(--secondary-yellow);
          
            text-align: center;

        }
        
        .stat-number {
            font-size: 2.5rem;
            font-weight: 700;
            line-height: 1;
        }
        
        .stat-text {
            font-size: 1rem;
            font-weight: 500;
			margin-bottom:0;
        }
.odometer-divider{position:relative;}
.odometer-divider::after{position:absolute; width:36px; height: 94px; right: -16px; top: 12px; content:""; background: url("../images/odometer-divider.png"); background-repeat: no-repeat; background-position:right top;}
/* Certification Section */
        .certification-section {
            padding: 0 0 100px 0 ;
        }
        
        .cert-card {
            max-width:100%;
            margin: 0 auto;
         
          
            padding: 30px;
            display: flex;
            align-items: center;
        
            position: relative;
          
        }

        .cert-ribbon {
            position: absolute;
            top: 0;
            right: 20px;
            background-color: #ff2c2c; /* Red ribbon color */
            color: white;
            padding: 5px 15px;
            font-size: 0.9rem;
            font-weight: 700;
            border-bottom-left-radius: 8px;
            border-bottom-right-radius: 8px;
			width:125px;
        }

        .star-rating {
            font-size: 2.5rem;
            color: #ffc107; /* Yellow stars */
        }
        
        .cert-text {
            flex-grow: 1;
            padding-left: 30px;
        }

.certification-section p{ font-size:20px; line-height:35px;}
/*End Home Page CSS*/
.exo-menu > li {	display: inline-block;float:left; padding: 7px;}
.exo-menu > li > a{
    color:#000;
	text-decoration: none;
    font-size:16px;
	-webkit-transition: color 0.2s linear, background 0.2s linear;
	-moz-transition: color 0.2s linear, background 0.2s linear;
	-o-transition: color 0.2s linear, background 0.2s linear;
	transition: color 0.2s linear, background 0.2s linear;
	font-weight: 500;
}
.exo-menu > li > a.active,
.exo-menu > li > a:hover,
li.drop-down ul > li > a:hover{
	
	color:#c32427;
}

.exo-menu i {

  font-size: 18px;
  margin-right: 6px;
  line-height: 20px !important;
}
li.drop-down,
.flyout-right,
.flyout-left{position:relative;}
li.drop-down:before {

  font-style: normal;
  display: inline;
  position: absolute;
  right: 6px;
  top: 20px;
  font-size: 14px;
}
li.drop-down>ul{
	left: 0px;
	min-width:262px;
border-radius: 10px;
    background: #fff; padding-left:0; border:1px solid #f6f6f6;
}
.drop-down-ul{display:none;}
.flyout-right>ul,
.flyout-left>ul{
  top: 0;
  min-width:258px;
  display: none;
  border-left: 1px solid #365670;
  }

li.drop-down>ul>li>a,
.flyout-right ul>li>a ,
.flyout-left ul>li>a {
	color: #000;
	display: block;
	padding:11px 17px;
	text-decoration: none;
	font-size:14px;
	-webkit-transition: color 0.2s linear, background 0.2s linear;
	-moz-transition: color 0.2s linear, background 0.2s linear;
	-o-transition: color 0.2s linear, background 0.2s linear;
	transition: color 0.2s linear, background 0.2s linear; 

}
.flyout-right ul>li>a ,
.flyout-left ul>li>{
	border-bottom: 1px solid #f6f6f6;
}


/*Flyout Mega*/
.flyout-mega-wrap {
	top: 0;
	right: 0;
	left: 100%;
	width: 100%;
	display:none;
	height: 100%;
	padding: 15px;
	min-width: 742px;

}
h4.row.mega-title {
  color:#eee;
  margin-top: 0px;
  font-size: 14px;
  padding-left: 15px;
  padding-bottom: 13px;
  text-transform: uppercase;
  border-bottom: 1px solid #ccc;
 }
.flyout-mega ul > li > a {
  font-size: 90%;
  line-height: 25px;
  color: #fff;
  font-family: inherit;
}
.flyout-mega ul > li > a:hover,
.flyout-mega ul > li > a:active,
.flyout-mega ul > li > a:focus{
  text-decoration: none;
  background-color: transparent !important;
  color: #ccc !important
}
/*mega menu*/
.mega-menu ul{ list-style:none; padding-left:0;}
.mega-menu {
  left: 0;
  right: 0;
  padding: 15px;
  display:none;
  padding-top: 0;
  min-height: 100%;

}
h4.row.mega-title {
  color: #eee;
  margin-top: 0px;
  font-size: 14px;
  padding-left: 15px;
  padding-bottom: 13px;
  text-transform: uppercase;
 
  padding-top: 15px;

  }
 .mega-menu ul li a {
  line-height: 20px; font-size:14px;

  display: block;
}
ul.stander li a {
    padding: 3px 0px;
}

ul.description li {
    padding-bottom: 12px;
    line-height: 8px;
}

ul.description li span {
    color: #ccc;
    font-size: 85%;
}
a.view-more{
  border-radius: 1px;
  margin-top:15px;
  background-color: #009FE1;
  padding: 2px 10px !important;
  line-height: 21px !important;
  display: inline-block !important;
}
a.view-more:hover{
	color:#fff;
	background:#0DADEF;
}
ul.icon-des li a i {
    color: #fff;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    text-align: center;
    background-color: #009FE1;
    line-height: 35px !important;
}

ul.icon-des li {
    width: 100%;
    display: table;
    margin-bottom: 11px;
}
/*Blog DropDown*/
.Blog{
	left:0;
	display:none;
	color:#fefefe;
	padding-top:15px;
	background:#547787;
	padding-bottom:15px;
}
.Blog .blog-title{
	color:#fff;
	font-size:15px;
	text-transform:uppercase;

}
.Blog .blog-des{
	color:#ccc;
	font-size:90%;
	margin-top:15px;
}
.Blog a.view-more{
	margin-top:0px;
}
/*Images*/
.Images{
	left:0;
   width:100%;
	 display:none;
	color:#fefefe;
	padding-top:15px;
	background:#547787;
	padding-bottom:15px;
}
.Images h4 {
  font-size: 15px;
  margin-top: 0px;
  text-transform: uppercase;
}
/*common*/

.mega-menu{
	background-color: #ffffff; border:1px solid #f6f6f6; border-radius:25px; padding:30px;
}
.mega-menu a{ color:#000; text-decoration:none;}
.mega-menu span{ font-size:12px;}
/*hover*/
.Blog:hover,
.Images:hover,
.mega-menu:hover,
.drop-down-ul:hover,
li.flyout-left>ul:hover,
li.flyout-right>ul:hover,
.flyout-mega-wrap:hover,
li.flyout-left a:hover +ul,
li.flyout-right a:hover +ul,
.blog-drop-down >a:hover+.Blog,
li.drop-down>a:hover +.drop-down-ul,
.images-drop-down>a:hover +.Images,
.mega-drop-down a:hover+.mega-menu,
li.flyout-mega>a:hover +.flyout-mega-wrap{
	display:block;
}
/*responsive*/
 @media (min-width:767px){
	.exo-menu > li > a{
	display:block;
	padding: 9px 18px;
 }
.mega-menu, .flyout-mega-wrap, .Images, .Blog,.flyout-right>ul,
.flyout-left>ul, li.drop-down>ul{
		position:absolute;
}
 .flyout-right>ul{
	left: 100%;
	}
	.flyout-left>ul{
	right: 100%;
}
 }
@media (max-width:767px){

	.exo-menu {
		min-height: 58px;
		background-color: #23364B;
		width: 100%;
	}
	
	.exo-menu > li > a{
		width:100% ;
	    display:none ;
	
	}
	.exo-menu > li{
		width:100%;
	}
	.display.exo-menu > li > a{
	  display:block ;
	  	padding:15px 22px;
	}
	
.mega-menu, .Images, .Blog,.flyout-right>ul,
.flyout-left>ul, li.drop-down>ul{
		position:relative;
}

}
a.toggle-menu{
    position: absolute;
    right: 0px;
    padding: 20px;
    font-size: 27px;
    background-color: #ccc;
    color: #23364B;
    top: 0px;
}
.blink-soft {
  animation: blinker 1.5s linear infinite;
}
@keyframes blinker {
  50% {
    opacity: 0;
  }
}
.visit-my-blog {
    background: #379fe1;
}
   

.drop-down-ul{ list-style:none;}
.flyout-right>ul{padding-left:0; list-style:none; border-left: 0; background: #fff; border-radius: 15px;}
.flyout-right > a {
    display: flex;
    justify-content: space-between; /* Pushes the icon to the end */
    align-items: center;
}
.flyout-right > a i {
   
   
}
/* 1. Default State: Setup the transition */
.flyout-right > a .bi-chevron-right {
    display: inline-block; /* Essential for rotation */
    transition: transform 0.3s ease; /* Smooth animation over 0.3 seconds */
}

/* 2. Hover State: Apply the rotation */
.flyout-right:hover > a .bi-chevron-right {
    /* Rotates the right-facing chevron 90 degrees to point down (or up, depending on your preferred orientation) */
    transform: rotate(90deg); 
}
/* --- Founder Section Custom Styles --- */

.founders-title {
    font-size: 2.2rem;
    color: #333;
    letter-spacing: 1px;
}

.founder-card {
    /* Removes Bootstrap's default background and border */
    border: 1px solid transparent; 
}

/* Custom styles for Navin's card (Light Green/Cyan) */
.founder-card.navin {
    background-color: #e3fcf9; /* Light cyan background */
    border-color: #8cfff2;      /* Matching light blue/green border */
}

/* Custom styles for Kumud's card (Light Beige/Gray) */
.founder-card.kumud {
    background-color: #fcf9f7; /* Very light beige/off-white background */
    border-color: #f7e4d8;      /* Matching light gray/tan border */
}

.founder-card .card-title {
    font-size: 1.75rem;
    margin-bottom: 0.5rem;
    color: #333;
}

.founder-card .card-text {
    line-height: 1.6;
}

/* Image Container Sizing and Positioning */
.founder-image-container {
    flex-shrink: 0;
    max-width: 150px; /* Limits the size of the image container */
    width: 100%;
    /* On mobile, center the image */
    display: flex; 
    justify-content: center;
}

/* Ensure the image takes up the space without distortion */
.founder-image {
    width: 100%;
    height: auto;
    object-fit: contain; /* Ensures the illustration is fully visible */
}

/* Responsive adjustment for mobile stacking */
@media (max-width: 767.98px) {
    .founder-image-container {
        /* On small screens, allow the image container to span the width, 
           and ensure the image is centered */
        max-width: 100%; 
    }
    .founder-details {
        text-align: center;
    }
}
.mega-menu ul li{margin-top:15px; margin-bottom:15px;}

/**********************************Team Animation*****************************************************/
.main {
    width: 90%;
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    padding: 0 30px 50px 30px;
    margin-top: 3%;
}
.st-wrapper {
	width: 100%;
	height:360px;
	position: relative;
	margin: 0 auto;
	-webkit-perspective: 1200px;
	-webkit-perspective-origin : 50% 100%;
	-moz-perspective: 1200px;
	-moz-perspective-origin : 50% 100%;
	-o-perspective: 1200px;
	-o-perspective-origin : 50% 100%;
	-ms-perspective: 1200px;
	-ms-perspective-origin : 50% 100%;
	perspective: 1200px;
	perspective-origin : 50% 100%;
	margin-top:161px;
}

.st-stack {
	position: absolute;
	height: 10px;
	bottom: 0px;
	background-image: url(../images/gradient.png);
	background-image: -webkit-linear-gradient(top, #fff 50%, #e7ae38 50%);
	background-image: -moz-linear-gradient(top, #fff 50%, #e7ae38 50%);
	background-image: -o-linear-gradient(top, #fff 50%, #e7ae38 50%);
	background-image: -ms-linear-gradient(top, #fff 50%, #e7ae38 50%);
	background-image: linear-gradient(to bottom, #fff 50%, #e7ae38 50%);
	-webkit-background-size: 5px 5px;
	-moz-background-size: 5px 5px;
	background-size: 5px 5px;
	background-position: bottom center;
}

.st-stack:before {
	content: '';
	position: absolute;
	width: 140%;
	left: -20%;
	bottom: -10px;
	height: 20px;
	z-index: -1;
	background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
	background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
	background: -o-radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
	background: -ms-radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
	background: radial-gradient(center, ellipse cover, rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 60%);
}

.st-stack-left {
	left: 0px;
}

.st-stack-right {
	right: 0px;
}

.st-wrapper .st-title,
.st-wrapper nav {
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
	text-align: center;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.st-wrapper .st-title {
	padding: 0 10% 60px;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
}

.st-wrapper .st-title h2 {
	padding: 0 20px;
	font-size: 28px;
	color: #dc4e2a;
	font-weight: 400;
	letter-spacing: 3px;
	
	line-height: 38px;
	text-shadow: 0 1px 1px rgba(255,255,255,0.6);
}

.st-wrapper .st-title h3 {
	font-size: 16px;

	color: #000;

}

.st-wrapper nav span {
	color: transparent;
	position: absolute;
	width: 40px;
	height: 40px;
	left: 50%;
	bottom: 0;
	cursor: pointer;
}

.st-wrapper nav span:first-child {
	margin-left: -45px;
}

.st-wrapper nav span:last-child {
	margin-left: 5px;
}

.st-wrapper nav span:before {
	font-family: 'icomoon';
	font-style: normal;
	speak: none;
	font-weight: normal;
	line-height: 1;
	font-size: 30px;
	line-height: 40px;
	text-align: center;
	-webkit-font-smoothing: antialiased;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	color: #fff;
	background: #dc4e2a;
	border-radius: 50%;
	cursor: pointer;
	text-shadow: 0 1px 1px rgba(255,255,255,0.5);
	box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

.st-wrapper nav span:first-child:before {
	font-family:'FontAwesome';
	content: "\f104";
}

.st-wrapper nav span:last-child:before {
	font-family:'FontAwesome';
	content: "\f105";
}

.st-wrapper nav span:hover:before {
	color: #333;
}

.st-wrapper .st-item {
	position: absolute;
	-webkit-transform-style : preserve-3d;
	-moz-transform-style : preserve-3d;
	-o-transform-style : preserve-3d;
	-ms-transform-style : preserve-3d;
	transform-style : preserve-3d;
	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-o-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
}

.st-wrapper .st-item.st-center {
	-webkit-transform: rotateZ(0deg) rotateY(0deg);
	-moz-transform: rotateZ(0deg) rotateY(0deg);
	-o-transform: rotateZ(0deg) rotateY(0deg);
	-ms-transform: rotateZ(0deg) rotateY(0deg);
	transform: rotateZ(0deg) rotateY(0deg);
}

.st-wrapper .st-item.st-right,
.st-wrapper .st-item.st-rightflow {
	opacity: 0;
	-webkit-transform: rotateZ(90deg) rotateY(-90deg);
	-moz-transform: rotateZ(90deg) rotateY(-91deg);
	-o-transform: rotateZ(90deg) rotateY(-90deg);
	-ms-transform: rotateZ(90deg) rotateY(-90deg);
	transform: rotateZ(90deg) rotateY(-91deg);
	pointer-events: none;
}

.st-wrapper .st-item.st-left,
.st-wrapper .st-item.st-leftflow {
	opacity: 0;
	-webkit-transform: rotateZ(-90deg) rotateY(90deg);
	-moz-transform: rotateZ(-90deg) rotateY(91deg);
	-o-transform: rotateZ(-90deg) rotateY(90deg);
	-ms-transform: rotateZ(-90deg) rotateY(90deg);
	transform: rotateZ(-90deg) rotateY(91deg);
	pointer-events: none;
}
.st-wrapper .st-item.st-rightflow,
.st-wrapper .st-item.st-leftflow,
.st-wrapper .st-item.st-center {
	opacity: 1;
}

.st-wrapper .st-item a,
.st-wrapper .st-item img {
	border: none;
	max-width: 100%;
	display: block;
}

.st-wrapper .st-item a {
	background: #fff;
	box-shadow: 0 0 0 9px #fff, 0 1px 3px 9px rgba(0,0,0,0.3);
}
/*Web Application*/
.yellow-1{ background:#fff9d1;}
 .feature-icon{background: #ffe319;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    font-size: 32px;
    display: flex;
    justify-content: center;
    vertical-align: middle;
    align-items: center;}
        .bg-teal {
            background-color: #48d6d2;
        }
        .text-yellow-dark {
            color: #d8c300; 
        }
        .bg-yellow-light {
            background-color: #fffac2; 
        }
       .content-border{ border:1px solid #f5f5f5!important;}
        .custom-card {
            min-height: 200px; 
        }
        .custom-padding {
            padding:2rem 0 0 0;
        }
        .feature-icon {
           
            margin-bottom: 0.5rem;
        }
        .custom-image-wrapper {
            /* Positioning for the image/tablet within the banner */
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 40%; /* Adjust size as needed */
        }
        .custom-image {
            max-width: 100%;
            height: auto;
        }

        /* Adjusting banner text width to accommodate the image */
        .banner-text-area {
            max-width: 55%; 
        }

        @media (max-width: 991.98px) {
            .custom-image-wrapper {
                position: relative;
                width: 100%;
                margin-top: 1rem;
                transform: none;
                top: auto;
            }
            .banner-text-area {
                max-width: 100%; 
            }
            .custom-padding {
                padding: 3rem 0;
            }
        }
.black{color:#000;}

/*End*/	
.mobile-app-development{background-color:#b2ebf2; background-repeat:no-repeat; background-position:right top; background-size: contain; min-height:400px; padding:3rem 2rem; border-radius:15px; background-image:url(../images/mobile-app-development.jpg); display: flex;
    justify-content: center;
    vertical-align: middle;
    flex-direction: row;
    align-items: center;}
.cta-section .container{ border-radius:15px; background-image:url(../images/streamline--business-banner.jpg); background-repeat:no-repeat; background-position:left top; background-position:left top; background-attachment:fixed; color:#fff; display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 4px; height:400px; text-align:center;}
.home-banner{ background:url("../images/home-page-banner-background.jpg")}
.btn-yellow{ background:#ffce08; font-size:18px; font-weight:bold; padding: 10px 24px; border-radius:25px;}
.btn-yellow:hover{background:#c32427;}
.text-primary-codez { color: #f7b500 !important; }
.feature-box {font-weight:500; background-color:#f7f4f0; border-radius: 1rem; padding: 1.5rem; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); margin-bottom: 1rem; text-align:center;}
.card-benefit { border-left: 5px solid #f7b500;}
.workforce-management-right-banner-img {
    background-image: url(../images/workforce-management-img.jpg);
    background-position: right bottom;
    background-repeat: no-repeat;
    min-height: 419px;
    background-size: contain; background-color:#fece39;
}
.yellow{color:#ffce39;}
.robotic-process-banner{ background:#ff2626; }
.values-section{ background:#fff;}
.border-all{border:1px solid #eee;}
.why-us-card ul{ padding:0; margin:20px 0 0 17px;}
.icon-check{ background:#fece09; width:35px; height:35px; display:block; border-radius:50%;}
.list-unstyled{font-weight:500;}
.list-unstyled li{margin-bottom: 1rem; background: url(../images/list-icon.svg) no-repeat left top; padding:3px 0 3px 42px; background-size:30px;}

h3{line-height: 1.5;}

@media screen and (max-width: 1310px){
	.st-wrapper .st-item {
		width: 300px;
	}
	.st-wrapper {
		height: 460px;
	}
}

@media screen and (max-width: 1050px){
	.st-wrapper .st-item {
		width: 260px;
	}
	.st-wrapper {
		height: 380px;
	}
}

@media screen and (max-width: 935px){
	.st-wrapper .st-item {
		width: 240px;
	}
	.st-wrapper {
		height: 380px;
	}
}

@media screen and (max-width: 880px){
	.st-wrapper .st-item {
		width: 220px;
	}
	.st-wrapper .st-title {
		bottom: 280px;
	}
	.st-wrapper {
		height: 420px;
	}
}

@media screen and (max-width: 740px){
	.st-wrapper .st-item {
		width: 200px;
	}
	.st-wrapper .st-title {
		bottom: 240px;
	}
	.st-wrapper {
		height: 370px;
	}
}

@media screen and (max-width: 650px){
	.st-stack {
		display: none;
	}
	.st-wrapper nav {
		bottom: 220px;
	}
}

@media screen and (max-width: 450px){
	.st-wrapper .st-item {
		width: 200px;
	}
	.st-wrapper .st-title {
		bottom: 150px;
		padding-left: 0px;
		padding-right: 0px;
	}
	.st-wrapper .st-title h2 {
		font-size: 22px;
		line-height: 32px;
	}
	.st-wrapper nav {
		bottom: 140px;
	}
	.st-wrapper {
		height: 300px;
	}
}	
/* Ensure the original dropdowns are hidden on mobile first */
@media (max-width: 991px) {
    .exo-menu .drop-down-ul,
    .exo-menu .flyout-right ul {
        display: none;
    }
}

/* --- Mobile/Touch Fix: FORCED OPEN STATE --- */
/* (Adjust 991px if your menu collapses at a different width) */
@media (max-width: 991px) { 
    
    /* 1. First-Level Dropdowns (shows the .drop-down-ul) */
    .exo-menu .drop-down.tap-to-open.open > .drop-down-ul {
        display: block !important;
        /* Re-apply the animation if the original CSS removed it */
        animation-name: fadeIn;
        animation-duration: 0.5s; 
    }
    
    /* 2. Second-Level Flyout Menus (shows the nested UL inside .flyout-right) */
    .exo-menu .flyout-right.tap-to-open.open > ul {
        display: block !important;
        /* Re-apply the animation */
        animation-name: fadeIn;
        animation-duration: 0.5s;
    }
	/* 1. Ensure the Mega Menu content is hidden by default on mobile */
    .exo-menu .mega-drop-down .mega-menu {
        display: none !important; 
    }
    
    /* 2. FORCE the Mega Menu DIV to show when the 'open' class is tapped/added */
    .exo-menu .mega-drop-down.tap-to-open.open > .mega-menu {
        display: block !important;
        /* Re-apply the animation */
        animation-name: fadeIn;
        animation-duration: 0.5s;
        
        /* Optional: Add basic mobile styling to make the mega menu look like a standard dropdown */
        position: static !important;
        width: 100% !important;
        border: none !important;
        padding: 10px 0;
    }
}
/* --- LOADER STYLES --- */
#page-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background-image:url("../images/lodder-bg.jpg"); background-size:100%; background-repeat:no-repeat;*/
    z-index: 99999; /* Ensure it covers everything */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 1;
    transition: opacity 0.5s ease-out; /* Smooth fade-out effect */
	background-color: #f3e5f5; 
  
  /* Multi-layered Radial Gradients for the Mesh Effect */
  background-image: 
    radial-gradient(at 0% 0%, hsla(328, 73%, 80%, 1) 0px, transparent 50%),
    radial-gradient(at 100% 0%, hsla(47, 95%, 83%, 1) 0px, transparent 50%),
    radial-gradient(at 100% 100%, hsla(190, 80%, 85%, 1) 0px, transparent 50%),
    radial-gradient(at 0% 100%, hsla(202, 90%, 75%, 1) 0px, transparent 50%),
    radial-gradient(at 50% 50%, hsla(40, 100%, 90%, 1) 0px, transparent 50%);
}

/* Spinner Design (A simple circle border spinner) */
.spinner {
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-top: 4px solid #66fcf1; /* A tech-like light cyan/green color */
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
    margin-bottom: 15px;
}

/* Loading Text Style */
#page-loader p {
    color: #c5c6c7; /* Light gray text */
    font-size: 1.1rem;
    font-weight: bold;
    font-family: sans-serif;
}

/* Keyframes for the Spinning Animation */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Class to hide the loader smoothly */
.loaded #page-loader {
    opacity: 0;
    visibility: hidden;
    pointer-events: none; /* Prevents clicking on the hidden element */
}
/*Background-css*/
.bg-white{ background:#fff;}
.cpd-section-bg{ background:#00308d;}
.mad-bg{background:#feca06;}
.smsupport-section-bg{ background:#007c00;}
.noise-bg-texture{padding-bottom:90px; background:url("../images/noise-bg.png"); background-repeat:no-repeat; background-position:left top; background-size:100%;}
.firmware-embedded-bg{ background:#a301af;}
.smart-system-solution-bg{ background:#2a01af;}
.cloud-migration-and-integration-bg{ background:#00d8c1;}
.list-group{ list-style:none; padding-left:0!important;}
.cicd-bg-img{ background:#3c9af1;}
.ia-bg{ background:#d53cf1;}
.pa-bg{ background:#eb593b;}
.npl-mpl{ background:#c6c5a3;}
.ai-chatbots-bg{ background:#86c442;}
.ai-model-bg{ background:#083a79;}
.ai-data-bg{ background:#21a586;}
.utility-and-energy-payment-suite-bg{ background:#fece0a;}
.why-us-icon{ color:#fece09;}
.legacy-modernization-bg{ background:#ccc;}
.bg-yellow{ background:#fece09;}
.text-white{ color:#fff;}
.white-block-sr{ background:#fff; margin:15px; padding:10px 34px; border-radius:15px 25px; min-height:430px;}
.legacy-bg-section{position:relative;  background-image:url("../images/legacy-modernization-bg.jpg"); background-repeat:no-repeat; background-size:cover; background-position:left top; background-attachment:fixed;}
.form-group select  {
    appearance: none;
    z-index: 2;
    background-color: #f7f4f0;
    border: 0;
    border-radius: 8px;
    width: 100%;
    min-height: 50px;
    padding: 14px 15px;
    font-size: 13px;
}
.form-group textarea {
   
    background-color: #f7f4f0;
    border: 0;
    border-radius: 8px;
    width: 100%;
    min-height: 50px;
    padding: 14px 15px;
    font-size: 13px;
	height:180px;
}
.contact-details-block{border:1px solid #efefef; padding:25px; border-radius:25px;}
.contact-details-block a{ color:#000; text-decoration:none;}
.contact-details-block a:hover{color:#c32427;}
.contact-bg{ background:#0152af;}
/*Page Lodder*/
.preloader {
	position: fixed;
	top: 0;
	left: 0;
	margin: auto;
	width: 100vw;
	height: 100vh;
	background: #797979;
	opacity: 1;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	transition-duration: 500ms;
	-webkit-transition-duration: 500ms;
	transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
	-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
	z-index: 99;
	transition-delay: 0.65s;
}
.preloader .inner {
	width: 100vw;
	height: 100vh;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.preloader:before {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 200px 100vh 0;
	border-color: transparent #797979 transparent transparent;
	position: absolute;
	left: -200px;
	top: 0;
}
.preloader:after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 100vh 0 0 200px;
	border-color: transparent transparent transparent #797979;
	position: absolute;
	right: -200px;
	top: 0;
}
.preloader * {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	transition-duration: 500ms;
	-webkit-transition-duration: 500ms;
	transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
	-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}
.transition-overlay {
	width: 100vw;
	height: 100vh;
	position: fixed;
	right: calc(-100% - 200px);
	bottom: 0;
	background: #797979;
	z-index: 9999;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	transition-duration: 500ms;
	-webkit-transition-duration: 500ms;
	transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
	-webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
	visibility: hidden;
}
.preloader .inner .percentage {
	width: 100%;
	font-size: 28vw;
	line-height: 1;
	font-weight: 800;
	color: #fff;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
	opacity: 0.2;
	transition-delay: 0.10s;
}
.navigation__transparent.navbar{
	visibility: hidden;
}
.page-loaded .preloader .percentage {
	margin-left: 100px;
	opacity: 0;
}
.page-loaded .preloader {
	left: calc(-100% - 200px);
	visibility: hidden;
}
/*End Page Lodder*/
.bg-suite-unique-section{ background: url("../images/bg-suite-unique-section.jpg"); background-repeat:no-repeat; background-position:left top; background-size:cover;}
.footer-logo{ position:absolute; left:0; top:-12px; width:162px;}
.footer-social-list{ position:absolute; right:0; top:0; width:162px;}
#scrollToTopBtn {
  display: none;          /* Hidden by default */
  position: fixed;       /* Fixed position */
  bottom: 20px;          /* 20px from bottom */
  right: 30px;           /* 30px from right */
  z-index: 99;           /* Sit on top of other elements */
  border: none;          
  outline: none;
  background-color:#ffda43; /* Button color */
  color: black;          /* Text color */
  cursor: pointer;
  width:50px; height:50px;
  border-radius: 50%;    /* Round button */
  font-size: 18px;
  transition: opacity 0.3s;
}

#scrollToTopBtn:hover {
  background-color: #c2272b; /* Darker grey on hover */ color:#fff;
}
/*End Backgroubnd CSS*/
.ptb{
	padding-top: 136px;
    padding-bottom: 65px;
}
.platform-works-section{ background:#252525; padding:100px 0;}
.white{ color:#fff;}
@media only screen and (min-width:2880px) and (max-width:6120px) {
	
	.hero-banner{min-height:32vh;}
}
@media only screen and (min-width:768px) and (max-width:1024px) {
	body, html{overflow-x:hidden;}
	.noise-bg-texture{background-size:cover;}
	.navbar-brand {width: 100px;  margin-left: auto;  margin-right: auto; margin-bottom: 11px;}
	.navbar-toggler{display:none;}
	    .exo-menu > li > a {
        display: block;
        padding: 9px 3px;
    }
	.footer-logo { position: relative;  width: 100%;}
	.footer-social-list{ position:relative;}
	.footer-social-list {
    position: static;
    margin-left: auto;
    margin-right: auto;
}
}
@media only screen and (min-width:320px) and (max-width: 640px) {
.m-space-benefits-delivered .col-md-4{margin-bottom:15px;}    
    .certificate-left-side-sticky {
    position: static;
    height: auto;
  
}
	
	.footer-logo{ position:relative; width:100%;}
	.footer-social-list{ position:relative; width:100%; margin-top:10px;}
	.footer-social-list .footer-social-list{    margin-left: auto;  margin-right: auto;  width: 110px;}
	.mmt-20{ margin-top:20px;}
	.mp-0{ padding:0!important;}
	.hero-banner{ min-height:78vh;}
	.current-opening-container{ padding: 30px;}
	.current-opening-container{ margin-left:0;}
	.bg-white{ padding:25px;}
	.bg-light{padding:25px;}
	.bg-grey{padding:25px;}
	.mp-t30{ padding-top:30px;}
	.mm-t30{ margin-top:30px;}
	.mm-t156{ margin-top:156px;}
	 html, body {overflow-x: hidden!important;}
	.noise-bg-texture{ background-size:auto;}
	.feature-box{ margin-left:0!important; margin-right:0!important;}
	.certifications-banner-img{background-size:auto;}
	.certificate-list{ padding-left:0;}
	.m-text-left{text-align:left!important;}
	.m-mb-50{margin-bottom:50px!important;}
	.m-ptb30{ padding:0 30px;}
	.hero-subtitle {font-size: 16px; margin-bottom: 2rem;}
	.st-wrapper{ position:relative; height:555px; margin-top:0;}
	.st-wrapper .st-item{ top:0px!important; display:none;}
	.m-founder-photo{ margin:40px 0;}
	.our-team-banner-section{ background-size:auto;}
	.our-team-banner-section .custom-padding .hero-banner{ padding-bottom:0;}
	.section-title{ font-size:40px;}
	.about-hero-section .custom-padding{ padding:10px;}
	
	.icon-circle{ display:none;} 
	footer .col-sm-7{ margin-bottom:20px;}
	.about-hero-section{ background-size:auto;}
	.footer-links li{ display:contents; margin-bottom:25px;}
	.footer-social-list{ float:none; margin-left: auto;
        margin-right: auto;
        display: inline-block;
        margin-left: 0;
        padding-left: 0;}
	.certified-section-bg{ background-image:none; min-height:354px; padding-right: 20px;
        padding-left: 20px;
        text-align: center;}

	.hero-title{ font-size:44px;}
	.cert-text{margin-top:10px;}
	.certification-section{margin-left:15px; margin-right:15px; }
	.stats-bar {margin-left:15px; margin-right:15px; }
	.cert-text{margin-top:10px;}
	.navbar{ position:absolute!important; top: 0; z-index: 999;}
	.m-hide{display:none!important;} 
	.stats-bar .col-md-4{ margin-bottom:20px;}
	.odometer-divider::after{display:none;}
	.tap-to-open ul{display:none!important;}
	.sticky-top{ position:static;}

	.m-show-dropdown ul{display:block!important; margin-bottom:15px; background:#f7f4f0; border-radius:15px; padding:15px;}
	.drop-down-ul{background:#f7f4f0!important; border-radius:15px; padding:15px;}
	.exo-menu .drop-down.tap-to-open.open > .drop-down-ul{ padding: 2px;
        margin: 10px;}
	.navbar-nav li{width:100%;}
	.navbar-nav { padding: 19px 16px; border-radius: 8px;}
	.dropdown-menu .dropdown-menu{margin-left:0;}
	.exo-menu{display:none;}
	.display{display:block!important;}
	.exo-menu{background:#fff; border-radius:13px; }

	li.drop-down:before{right:34px;}
	li.mega-drop-down a:after{right:34px;}
	li.drop-down>ul{padding-left:0;}

	.drop-down li a{font-weight:normal;}
	/* 1. Force the carousel inner content to display all items */
    .carousel-inner {
        display: flex;
        flex-direction: column;
    }

    /* 2. Make all carousel items visible and full width */
    .carousel-item {
        display: block !important;
        opacity: 1; /* Ensure no opacity fade issue */
        position: static !important; /* Remove carousel positioning */
        transform: none !important; /* Disable slide animation/transform */
        width: 100% !important;
        margin-right: 0;
        margin-bottom: 20px; /* Add some spacing between groups of services */
    }

    /* 3. Ensure the inner rows wrap vertically, showing all service cards */
    .carousel-item .row {
        display: flex;
        flex-direction: column; /* Stack services vertically on mobile */
    }

    /* 4. Ensure service cards themselves take full width */
    .service-card {
        width: 100%;
        text-align: center; /* Center content of each service card */
    }
	}