@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css");
*{
box-sizing: border-box;
padding: 0;
margin: 0;
font-family: "Inter", sans-serif;
}

audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
display: block;
height: auto;
max-width: 100%;
width: 100%;
}

summary {
display: list-item;
}

body,
html {
height: 100%;
}

html {
font-size: 100%;
scroll-behavior: smooth;
}

body {
line-height: 1.4;

-webkit-overflow-scrolling: touch;

-ms-overflow-style: scrollbar;

background-color: #ffffff;
}

body::-webkit-scrollbar {
width: 10px;
}

body::-webkit-scrollbar-track {
background-color: #e7e7e7;
}

body::-webkit-scrollbar-thumb {
background-color: #9f6300;;

border: 1px solid #9f6300;

border-radius: 10px;
}

p { 
font-size: 15px;
color: #1c1c1c;
line-height: 1.55;
margin-bottom: 1rem;
font-weight: 500;
}
a, a:hover, a:focus, button:hover, button:focus, input:focus{outline:none!important; text-decoration: none !important;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {color: #000;  }

/*------Parallax Css----------*/
.parallax {
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-x: center;
}
.animation {
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: 1;
    animation-direction: normal;
    animation-fill-mode: forwards;
    animation-play-state: running;
}
@keyframes slide-up {
    from {opacity:0; top:100px;}
    to {opacity:1; top:0;}
}
.animation_slide-up {
    animation-name: slide-up;
}
@keyframes slide-down {
    from {opacity:0; bottom:100px;}
    to {opacity:1; bottom:0;}
}
.animation_slide-down {
    animation-name: slide-down;
}
@keyframes slide-left {
    from {opacity:0; left:100px;}
    to {opacity:1; left:0;}
}
.animation_slide-left {
    animation-name: slide-left;
}
@keyframes slide-right {
    from {opacity:0; right:100px;}
    to {opacity:1; right:0;}
}
.animation_slide-right {
    animation-name: slide-right;
}
@keyframes flip-x {
    from {opacity:0;transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -180deg);}
    to {opacity:1;transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);}
}
.animation_flip-x {
    backface-visibility: visible;
    animation-name: flip-x;
}
@keyframes flip-y {
    from {opacity: 0;transform: perspective(400px) rotate3d(1, 0, 0, 90deg);}
    to {opacity:1;transform: perspective(400px);}
}
.animation_flip-y {
    backface-visibility: visible !important;
    animation-name: flip-y;
}
@keyframes zoom {
    from {opacity: 0;transform: scale3d(0.3, 0.3, 0.3);}
    to {opacity: 1;}
}
.animation_zoom {
    animation-name: zoom;
}
/*-----Custome Css Area----*/

.sec_padding{padding:30px 0}

/*------Main Header--------*/

.main_header{
position: relative;
background-color: #fff;
}
.main_header.sticky{
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 9;
/* -webkit-animation: smoothScroll 1s forwards;
animation: smoothScroll 1s forwards; */
box-shadow: var(--bs-box-shadow) !important;
}

@-webkit-keyframes smoothScroll {
0% {
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
}
100% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
}

@keyframes smoothScroll {
0% {
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
}
100% {
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
}

.main_header .navbar-brand{

margin-top: 8px;
padding: 5px 10px 0;
background-color: #fff;
z-index: 0;
-webkit-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out;
}
.main_header .navbar-brand .logo-2{display:none}

.main_header.sticky .navbar-brand{
padding: 5px 10px 0;
background-color: #fff;
z-index: 0;
-webkit-box-shadow: none;
box-shadow: none;
-webkit-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out;
}
.main_header.sticky .navbar-brand .logo-1{display:none}
.main_header.sticky .navbar-brand .logo-2{display:block}
.main_header.sticky .navbar-brand::after{display: none;}

/* .main_header .navbar-brand::after{
content: '';
position: absolute;
left: 0;
bottom: -38%;
width: 100%;
height: 46px;
background: url(../images/bg/logo-shape.png);
background-position: bottom center;
background-size: cover;
background-repeat: no-repeat;
} */

.main_header .quote_btn{
display: -webkit-box;
display: -ms-flexbox;
display: flex;
vertical-align: middle;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.main_header .quote_btn a{ 
background-color: #00379C;
width:auto;
padding: 0px 5px; 
color: #fff;
text-align: center;
text-transform: uppercase;
font-weight: 600;
font-size: 25px;
-webkit-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out;
border-radius: 50px;
}

.main_header .quote_btn a:hover{ 
    background-color: #9f6300;
    -webkit-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out;
}
/*---------Home Main Video------*/

.home_video_sec{
width: 100%;
/*position: relative;*/
}
/* .home_video_sec::after{
content:'';
background: url(../js/videooverlay1.png);
background-repeat: repeat;
background-size: initial;
opacity: 0.4;
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
display: block;
} */
/*---------About Us Area------*/
.about_sec{

margin: 0rem 0 0;
padding-top: 80px;
padding-bottom: 30px; background:#fff;}
.about_right{position: relative;}
.about_right h1{ font-size: 48px; color: #242424; font-weight: 600; }

.what_wedo_main{ margin-top: 40px;}
.what_wedo_main .nav-tabs { border: none; margin-bottom: 40px ;}
.what_wedo_main .nav-tabs li button{font-size: 18px; font-weight: 700; border-radius: 40px!important; color: #838383; padding: 16px 36px;border: none;}
.what_wedo_main .nav-tabs li button:hover{border-radius: 40px!important; border: none;}
.what_wedo_main .nav-tabs li button.active{ background: #00459E; font-size: 18px; font-weight: 600; border-radius: 40px!important; color: #fff; padding: 16px 36px;border: none;
}
.whatwe_title{ border-bottom: solid 1px #ddd;}
.whatwe_title h2{ color: #242424; font-size: 48px; font-weight: 700; margin-bottom: 20px;}
.whatwe_title p{ color: #6E6E6E; font-size: 20px; font-weight: 500; margin-bottom: 20px;}
.customer_listmain{display: flex; justify-content: space-between; padding: 30px 0; border-bottom: solid 1px #ddd; }

.customer_listleft{color: #242424; font-size: 40px; font-weight: 600;min-width: 578px;}
.customer_listright{}

.soluction_listmain{display: flex;  padding: 20px 12px; border-bottom: solid 1px #ddd;gap: 30px; margin-bottom: 15px; transition: all 0.8s ease;}
 /* .soluction_listmain:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);  background: rgba(255, 255, 255, 0.2); border-radius: 8px; 
    padding: 20px 12px;} */
.soluction_listleft{max-width: 82px;}
.soluction_listright{}
.soluction_title{ font-size: 24px;font-weight: 600; color: #242424; margin-bottom: 10px; display: inline-flex; gap: 10px;}
.soluction_title span{ font-size: 12px;font-weight: 700;background: #E2FFFB; color: #239F8E; border: solid 1px #239F8E; border-radius: 15px; padding: 3px 12px;
  display: inline-flex; align-items: center; justify-content: center;}
.soluction_dec{font-size: 18px; font-weight: 400; color: #6E6E6E;}
.soluction_dec h4{ margin-top: 15px; font-size: 18px; font-weight: 700; color: #474747;}
.soluction_dec ul{ padding: 0px;margin-left: 15px;}
.soluction_dec li{ margin-bottom: 8px;}
.button_list{}
.button_list a{ background: #F7F8FA; padding: 7px 16px; border-radius: 20px; border: solid 1px #00000033; font-size: 14px; font-weight: 500; color: #242424;display: inline-flex
; margin-bottom: 8px;}
.register_butt{ background: #00459E; padding: 18px 32px; border-radius: 40px; color: #fff; font-size: 16px; font-weight: 600;display: inline-flex; margin-top: 15px;}
.soluction_listmain:last-child{ border-bottom: none;}
.load_morese{border-bottom: solid 1px #ddd; text-align: center; padding: 15px 0;}
.load_morese button{ color: #242424; font-size: 20px; font-weight: 600; border: none; background: none;font-family: "Inter", sans-serif;}

.rounded-shape {clip-path: polygon(50% 2.45%, 100% 38.77%, 100% 100%, 0% 100%, 0% 38.77%);
background-color: #e0f4ff;-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px; transform: rotate(15deg);padding: 14px 8px;
    width: 82px;
    height: 82px;
}
.rounded-shape img{}

/*-----we believe in Start-------*/
.bg_weblive{background: linear-gradient(to right, #003A84, #004DB0);overflow: hidden;
            height: 100%;}
            .wetitle{ color: #FCC020; font-size: 64px; font-weight: 800; text-align: center; position:absolute; top: 10%; right: 0;}
.unlockinggrowth__sliderwrap {
            position: relative;
            width: 100%;
            min-height: 100vh;
            overflow: hidden;
        }
        
        .unlockinggrowth__sliderwrap .slick-slide {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            position: relative;
            min-height: 100vh;
        }
        
        .unlockinggrowth__sliderwrap .img__wrap {
            width: 45vw;
            min-height: 80vh;
            overflow: clip;
            display: flex;
            flex-wrap: wrap;
            position: relative;
        }
        
        .unlockinggrowth__sliderwrap .img__wrap img {
            position: absolute;
            width: 100%;
            height: 100% !important;
            object-fit: cover;
            transform: scale(1.2);
            transform-origin: left;
        }
        
        .unlockinggrowth__sliderwrap .text__slider.change__triggered .img__wrap img {
            transition: all 20000ms linear;
        }
        
        /* Slides 1, 3, and 4 have transform-origin: right */
        .unlockinggrowth__sliderwrap .text__slider.change__triggered .slick-slide.slick-active.slick-current:nth-child(1) .img__wrap img,
        .unlockinggrowth__sliderwrap .text__slider.change__triggered .slick-slide.slick-active.slick-current:nth-child(3) .img__wrap img,
        .unlockinggrowth__sliderwrap .text__slider.change__triggered .slick-slide.slick-active.slick-current:nth-child(4) .img__wrap img {
            transform-origin: right;
        }
        
        /* Slide 2 has transform: scale(1) */
        .unlockinggrowth__sliderwrap .text__slider.change__triggered .slick-slide.slick-active.slick-current:nth-child(2) .img__wrap img {
            transform: scale(1);
        }
        
        .unlockinggrowth__sliderwrap .content {
            font-size: 40px;
            line-height: 1;
            padding: 80px 100px 80px 100px;
            max-width: 740px;
            min-height: 480px;
            float: right;
            position: absolute;
            right: 0;
            margin: auto;
            z-index: 1;
        }
        
        .unlockinggrowth__sliderwrap .content:after {
            position: absolute;
            content: "";
            top: 0;
            left: 0;
            width: 0%;
            height: 100%;
            background: #ffffff;
            z-index: -1;
            transition: all 1000ms 0.5s cubic-bezier(.48,.05,.21,.98);
        }
        
        .et_pb_section__believe.showWhiteBox .unlockinggrowth__sliderwrap .content:after {
            width: 100%;
        }
        
        .et_pb_section__believe.showWhiteBox .unlockinggrowth__sliderwrap .content {
            opacity: 1;
        }
        
        .unlockinggrowth__sliderwrap .content span.common {
            margin-bottom: 50px;
            display: block;
            letter-spacing: -1px;
            font-size: 40px;
            color: #242424;
            font-weight: 800;
            text-align: center;
            line-height: 1.2;
            opacity: 0;
            transform: translateY(30px);
            transition: all 1000ms 1s cubic-bezier(.48,.05,.21,.98);
        }
        
        .et_pb_section__believe.showWhiteBox .unlockinggrowth__sliderwrap .content span.common {
            opacity: 1;
            transform: translateY(0px);
        }
        
        .et_pb_section__believe .content span.dynamic {
            display: flex;
            flex-wrap: wrap;
            position: relative;
            padding-left: 6vw;
            opacity: 0;
            transform: translateY(30px);
            transition: all 1000ms 1.3s cubic-bezier(.48,.05,.21,.98);
        }
        
        .et_pb_section__believe.showWhiteBox .unlockinggrowth__sliderwrap .content span.dynamic {
            opacity: 1;
            transform: translateY(0px);
        }
        
        .et_pb_section__believe.showWhiteBox .text__slider.change__triggered .slick-slide:not(:first-of-type) .content span.dynamic {
            opacity: 0;
            transform: translateY(30px);
        }
        
        .et_pb_section__believe.showWhiteBox .text__slider.change__triggered .slick-slide:not(:first-of-type).slick-active.slick-current .content span.dynamic {
            opacity: 1;
            transform: translateY(0px);
            transition: all 1000ms 0.5s cubic-bezier(.48,.05,.21,.98);
        }
        
        .et_pb_section__believe .content span.number {
            color: #00459E;
            font-size: 40px; font-weight: 800;             
            position: absolute;
            left: 0;
            top: 0;
        }
        
        .unlockinggrowth__sliderwrap .content span.value {
            letter-spacing: -0.5px;
            color: #242424; font-size: 40px; font-weight: 700; margin-bottom: 15px;
        }
        .des_text{color: #555555; font-size: 20px; font-weight: 400;}
        

/* .slider-container {display: flex; width: 100%;    height: 100%;      margin: 5vh auto;  overflow: hidden; position: relative;        }

        .image-section {
            flex: 1;
            position: relative;
            overflow: hidden;
        }

        .image-slider {
            display: flex;
            width: 400%;
            height: 100%;
            transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94); 
        }

        .image-slide {
            width: 25%;
            height: 100%;
            background-size: cover;
            background-position: center;border-radius: 4%;
            transition: all 20000ms linear;
        }

        .content-section {
            flex: 1;
            position: relative;
            overflow: hidden;
            padding: 0px 0 40px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            margin-left: -100px;
        }

        .content-slider {
            display: flex;
            width: 400%;
            
            transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
            
        }

        .content-slide {
            width: 25%;
            height: 100%;
            padding: 20px 50px;
            display: flex;
            flex-direction: column;
            justify-content: center;background: #fff; 
        }

        .content-slide h2 {
            font-size: 40px; font-weight: 800;
            text-align: center;
            margin-bottom: 80px;
            color: #242424;
        }
        .content-slide h3 {
            font-size: 40px; font-weight: 700;
            text-align: left;
            margin-bottom: 10px;
            color: #242424;
        }
        .content-slide h3 span{ color: #00459E; margin-right: 20px;}

        .content-slide p {
            font-size: 20px;
            line-height: 1.6;
            font-weight: 400;
            margin-top: 15px;
            color: #555;
            padding: 0 0 0 80px;
        }

       .slide-counter{ display: none;}

        .slide-indicators {
            position: absolute;
            right: 30px;
            top: 50%;
            transform: translateY(-50%);
            display: flex;
            flex-direction: column;
            gap: 15px;
            z-index: 10;
        }

        .indicator {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: rgba(26, 42, 108, 0.4);
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .indicator.active {
            background: #1a2a6c;
            transform: scale(1.3);
        }

        .scroll-indicator {
            position: absolute;
            bottom: 30px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            flex-direction: column;
            align-items: center;
            z-index: 10;
        }

        .scroll-text {
            color: #1a2a6c;
            margin-bottom: 10px;
            font-size: 0.9rem;
            opacity: 0.8;
        }

        .mouse {
            width: 24px;
            height: 40px;
            border: 2px solid #1a2a6c;
            border-radius: 12px;
            position: relative;
        }

        .wheel {
            width: 4px;
            height: 8px;
            background: #1a2a6c;
            border-radius: 2px;
            position: absolute;
            top: 6px;
            left: 50%;
            transform: translateX(-50%);
            animation: scroll 1.5s infinite;
        }

        @keyframes scroll {
            0% {
                transform: translateX(-50%) translateY(0);
                opacity: 1;
            }
            100% {
                transform: translateX(-50%) translateY(16px);
                opacity: 0;
            }
        } */

        /*-------Our Online Community Forum and Knowledge base-------*/

.online_community_title h2{ color: #242424; font-size: 48px; font-weight: 700; margin-top: 30px;}
.online_community_title p{color: #555; font-size: 20px; font-weight: 400;}
 .image-cards-container {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
            gap: 30px;
        }
        
        .image-card {
            background: white;
            border-radius: 12px;
            overflow: hidden;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        /* .image-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
        } */
        
        .card-img {
            width: 100%;
            object-fit: cover;
            display: block; position: relative;
        }
        .card-img img{ width: 100%;}
        
        .card-img-1 {
            background: linear-gradient(45deg, #3498db, #2ecc71);
        }
        
        .card-img-2 {
            background: linear-gradient(45deg, #e74c3c, #f39c12);
        }
        
        .card-img-3 {
            background: linear-gradient(45deg, #9b59b6, #34495e);
        }
        
        .card-img-4 {
            background: linear-gradient(45deg, #1abc9c, #3498db);
        }
        .avarena{padding: 7px 16px; border-radius: 20px; position: absolute; background: #fff; bottom: 20px;  left: 20px; color: #239F8E; font-size: 16px; font-weight: 700;}
        
        .image-card-content {
            padding: 25px;
        }
        
        .image-card-title {
            font-size: 20px;
            font-weight: 700;
            margin-bottom: 10px;
            color: #242424;
        }
        
        .image-card-text {
            color: #555;
            font-size: 16px;
            font-weight: 400;
            margin-bottom: 20px;
        }
        .image-card-link {}
        .image-card-link a{ background: #F7F8FA; border: solid 1px #00000033; border-radius: 20px; padding: 7px 16px; display: inline-flex; gap: 8px; margin-bottom: 8px;
        color: #242424; font-size: 14px; font-weight: 500;}
        
        .image-card-btn {
            display: inline-block;
            color: #fff;
            text-decoration: none;
            font-weight: 600;
            transition: all 0.3s ease;
            font-size: 16px;
            background: #00459E; border-radius: 40px; padding: 10px 28px; margin: 10px 0px;
        }
        
        .image-card-btn:hover {
            color: #fff;
        }
        
        .image-card-btn i {
            margin-left: 5px;
            transition: transform 0.3s ease;
        }
        
        .image-card-btn:hover i {
            transform: translateX(5px);
        }

/*-------impact we make Area-------*/
.impact_title h2{ color: #242424; font-size: 48px; font-weight: 700; margin-top: 30px;}
 .testimonial-card { padding: 0px;  margin: 0;  transition: transform 0.3s ease;
    display: flex;  gap: 30px;  justify-content: center;   align-items: center;        }
        
        /* .testimonial-card:hover {
            transform: translateY(-5px);
        } */
        
        .client-info {
            display: flex;
            align-items: center;
            margin-bottom: 20px;
        }
        
        .client-avatar {
            width: 100%;           
            margin-right: 15px;
        }
        
        .client-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover; border-radius: 4%;
        }
        .testimonil_title{ color: #A3A3A3; font-size: 24px; font-weight: 500; margin-bottom: 30px; text-align: center;}
        .testimonil_title span{color: #242424; font-size: 24px; font-weight: 600; margin-right: 5px;}
        
        .testimonial-text {
            color: #555;
            line-height: 1.6;
            font-size: 16px;
            font-style: italic;
            position: relative;
             background: #F5F8FF;
            border-radius: 12px;
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
                padding: 48px 125px 110px;
                width: 60%;
        }
        
         .testimonial-text p {
            font-size: 20px;
            color: #242424;
            font-weight: 400;
            text-align: center;
        }
        .testimonial-text:before {
            content: """;
            position: absolute;
            left: 0;
            top: -10px;
            font-size: 40px;
            color: #4a6cf7;
            font-family: Georgia, serif;
        }
        
        .owl-dots {
            text-align: center;
            margin-top: 30px;
        }
        
        .owl-dot {
            display: inline-block;
            margin: 0 5px;
            width: 12px;
            height: 12px;
            border-radius: 50%;
            background: #ddd;
            transition: background 0.3s ease;
        }
        
        .owl-dot.active {
            background: #4a6cf7;
        }
        
        .owl-nav {
            display: flex;
            justify-content: center;
             margin-top: -110px!important;
    position: relative;
    left: -20%;
        }
        
        .owl-prev, .owl-next {
            background: #C3C3C3 !important;
            color: white !important;
            width: 64px;
            height: 64px;
            border-radius: 100%!important;
            display: flex;
            justify-content: center;
            align-items: center;
            margin: 0 10px;
            font-size: 18px !important;
            transition: all 0.3s ease;
        }
        
        .owl-prev:hover, .owl-next:hover {
            background: #00379C !important;
            transform: scale(1.1);
        }

/*========Get AVA App Start==========*/


.app-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 80px 0%;
  gap: 40px;
}

.app-content {
  flex: 1;
}

.app-content h2 {
  font-size: 64px;
  font-weight: 700;
  color: #242424;
  margin-bottom: 10px;
}

.app-content h3 {
  font-size: 26px;
  font-weight: 700;
  color: #242424;
  margin-bottom: 20px;
}

.app-content p {
  font-size: 20px;
  color: #242424;
  font-weight: 400;
  line-height: 1.6;
  margin-bottom: 30px;
  max-width: 556px;
}

.app-links {
  display: flex;
  align-items: center;
  gap: 20px;
}

.app-links img{ width: auto;}

.play-badge {
  width: 279px;
  cursor: pointer;
}

.qr-code {
  width: 109px;
}

.app-mockup {
  position: relative;
  flex: 1;
  display: flex;
  justify-content: center;
}

/* .blue-bg {
  position: absolute;
  top: 20%;
  right: 10%;
  width: 300px;
  height: 300px;
  background: #d8f0ff;
  border-radius: 50px;
  transform: rotate(15deg);
  z-index: 1;
} */

.mockup-img {
  width: 520px;
  max-width: 100%;
  z-index: 2;
}

/*-------footer Area-------*/
.footer_section{ display: inline-block; width: 100%;}
.footer_bg{ background: #F3F4F6; padding-bottom: 0px;}
.footer_mainsection{  padding: 40px 0%;}
.footer_logo{ margin-bottom: 15px;}
.footer_contact h4 {font-size: 12px; font-weight: 700; color: #4B5563;  margin-bottom: 10px;}
.footer_contact p {font-size: 14px; font-weight: 400; color: #4B5563;  margin-bottom: 10px;}
.footer_contact p a {font-size: 14px; font-weight: 600; color: #4B5563;  }
.footer_contact h5 {font-size: 14px; font-weight: 500; color: #4B5563;  margin-bottom: 10px; margin-top: 20px;}
.follow_us {display: flex; gap: 15px;}
.follow_us a{}
.follow_us a:hover img{ transform: scale(1.05) rotate(2deg);filter: brightness(1.1) contrast(1.1);   box-shadow: 0 5px 15px rgba(0,0,0,0.3);transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.footer_about h4 {font-size: 16px; font-weight: 700; color: #239F8E;  margin-bottom: 10px;}
.footer_about ul{ list-style: none; padding: 0;}
.footer_about li{}
.footer_about li a{ font-size: 14px; font-weight: 400; color: #4B5563; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out;}
.footer_about li a:hover{color: #239F8E; padding-left: 2px;}

.footer_quicklink h4 {font-size: 16px; font-weight: 700; color: #239F8E;  margin-bottom: 10px;}
.footer_quicklink ul{ list-style: none; padding: 0;}
.footer_quicklink li{}
.footer_quicklink li a{ font-size: 14px; font-weight: 400; color: #4B5563; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out;}
.footer_quicklink li a:hover{color: #239F8E;}
.boder_lefq { padding-left: 15px; border-left: solid 1px #d4d0d0;}
.partner li a{ color: #00379C; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out; border: solid 1px #00379C; border-radius: 6px; padding: 5px 10px;}


.footer_soluction h4 {font-size: 16px; font-weight: 700; color: #239F8E;  margin-bottom: 10px;}
.footer_soluction ul{ list-style: none; padding: 0;}
.footer_soluction li{}
.footer_soluction li a{ font-size: 14px; font-weight: 400; color: #4B5563; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out;}
.footer_soluction li a:hover{color: #239F8E;padding-left: 2px;}

.footer_community h4 {font-size: 16px; font-weight: 700; color: #239F8E;  margin-bottom: 10px;}
.footer_community ul{ list-style: none; padding: 0;}
.footer_community li{}
.footer_community li a{ font-size: 14px; font-weight: 400; color: #4B5563; margin-bottom: 12px; display: block;transition: all 0.3s ease-in-out;}
.footer_community li a:hover{color: #239F8E;}
.footer_community li a span{font-size: 11px; font-weight: 500; background: #E2FFFB; color: #239F8E; border: solid 1px #239F8E;  border-radius: 15px;  padding: 1px 8px;
    display: inline-flex; align-items: center;justify-content: center;}
.lang_but{ text-align: center;margin-bottom: 45px;}
.lang_but img{ width: auto; display: inline-block;}

.copy_main{ background: #0B1E48; padding: 16px 0; }
.copy_mainse{ display: flex; justify-content: space-between;}
.copy_left{display: flex; gap: 20px;}
.copy_left p{ font-size: 12px; font-weight: 700; color: #fff;  margin-bottom:0px;}
.copy_right{ gap: 15px; display: flex;}
.copy_right a{font-size: 12px; font-weight: 400; color: #fff; }
.copy_right a:hover{color: #239F8E;}

/*-------Testimonial Sec------*/


/*-------Request Form Area----------*/

/*-----Srory Area--------*/

.myscroll{ position:absolute; bottom: 128px; right: -50px;}
    .spin-1 {
            animation: spin1 6s linear infinite;
        }

        .spin-2 {
            animation: spin2 3s ease-in-out infinite;
        }

        .spin-3 {
            animation: spin3 1.5s linear infinite;
        }

        .spin-4 {
            animation: spin4 2.5s cubic-bezier(0.68, -0.55, 0.27, 1.55) infinite;
        }

        @keyframes rotate {
            from {
                transform: translate(-50%, -50%) rotate(0deg);
            }
            to {
                transform: translate(-50%, -50%) rotate(360deg);
            }
        }

        @keyframes pulse {
            from {
                transform: translate(-50%, -50%) scale(1);
            }
            to {
                transform: translate(-50%, -50%) scale(1.2);
            }
        }

        @keyframes orbit {
            from {
                transform: rotate(0deg) translateX(125px) rotate(0deg);
            }
            to {
                transform: rotate(360deg) translateX(125px) rotate(-360deg);
            }
        }

        @keyframes spin1 {
            from {
                transform: rotate(0deg);
            }
            to {
                transform: rotate(360deg);
            }
        }

        @keyframes spin2 {
            0%, 100% {
                transform: rotate(0deg);
            }
            50% {
                transform: rotate(180deg);
            }
        }
 

    /*========Scroll Top======*/

    .scrollToTop {
        width: 34px;
        height: 34px;
        border-radius: 25px;
        text-align: center;
        font-weight: bold;
        background: #fff;
        text-decoration: none;
        position: fixed;
        bottom: 20px;
        right: 0;
        z-index: 33;
        display: none;
    }


    /* Animation 1: Bounce */
        .animation-bounce .soluction_listmain:hover .soluction_listleft {
            animation: bounce 0.8s ease;
        }
        
        @keyframes bounce {
            0%, 20%, 60%, 100% {
                transform: translateY(0);
            }
            40% {
                transform: translateY(-15px);
            }
            80% {
                transform: translateY(-7px);
            }
        }
        
        /* Animation 2: Pulse */
        .animation-pulse .soluction_listmain:hover .soluction_listleft {
            animation: pulse 1s infinite;
        }
        
        @keyframes pulse {
            0% {
                transform: scale(1);
            }
            50% {
                transform: scale(1.1);
            }
            100% {
                transform: scale(1);
            }
        }
        
        /* Animation 3: Rotate */
        .animation-rotate .soluction_listmain:hover .soluction_listleft {
            animation: rotate 0.8s ease;
        }
        
        @keyframes rotate {
            0% {
                transform: rotate(0);
            }
            100% {
                transform: rotate(360deg);
            }
        }
        
        /* Animation 4: Color Change */
        .animation-color .soluction_listmain:hover .soluction_listleft {
            background: rgba(255, 255, 255, 0.2);
        }
        
        .animation-color .soluction_listmain:hover .soluction_listleft img {
            filter: brightness(0) invert(1) sepia(1) saturate(5) hue-rotate(180deg);
        }
        
        /* Animation 5: Shake */
        .animation-shake .soluction_listmain:hover .soluction_listleft {
            animation: shake 0.5s ease;
        }
        
        @keyframes shake {
            0%, 100% {
                transform: translateX(0);
            }
            20%, 60% {
                transform: translateX(-5px);
            }
            40%, 80% {
                transform: translateX(5px);
            }
        }
        
        /* Animation 6: Glow */
       .animation-glow .soluction_listmain:hover .soluction_listleft img {
    filter: drop-shadow(0 5px 15px rgba(28, 116, 202, 0.5));
}

        
        /* Animation 7: Slide Up */
        .animation-slide .soluction_listmain:hover .soluction_listleft img {
            transform: translateY(-10px);
        }
        
        /* Animation 8: Flip */
        .animation-flip .soluction_listmain:hover .soluction_listleft {
            animation: flip 0.8s ease;
        }
        
        @keyframes flip {
            0% {
                transform: perspective(400px) rotateY(0);
            }
            50% {
                transform: perspective(400px) rotateY(180deg);
            }
            100% {
                transform: perspective(400px) rotateY(360deg);
            }
        }
        
        .footer_logo img {
    width: 250px;
    margin: auto;
}
/*Header Cta Button Start */
.get_in_touch_btn {
    position: absolute;
    left: -70px;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    background: #000;
    color: #fff;
    padding: 12px 28px;
    font-weight: 600;
    letter-spacing: 1px;
    text-decoration: none;
    z-index: 50;
    border-radius: 0px;
    display: inline-block;
}

/*Header Cta Button End*/

/*New Css Starts*/
.cb-scrolly-section {
    background-color: #00459E;
    font-family: 'Inter', sans-serif;
    position: relative;
    width: 100%;
}

/* --- THE TRACK & STICKY LOGIC --- */
.cb-scroll-track {
    width: 100%;
    position: relative;
    /* Height is inline in HTML */
}

.cb-sticky-viewport {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    height: 100vh; /* Full viewport height */
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* --- TITLE --- */
.cb-main-title {
    position: absolute;
    top: 90px;
    right: 120px;
    font-size: 64px;
    color: #FCC020;
    font-weight: 800;
    z-index: 999;
    line-height: 1;
    margin: 0;
}

/* --- LAYOUT WRAPPER --- */
.cb-content-wrapper {
    display: flex;
    height: 100%;
    align-items: center;
    position: relative;
}

/* --- IMAGE LAYERS --- */
/*.cb-images-container {*/
/*    position: relative;*/
/*    overflow: hidden;*/
    /* Desktop Default */
/*    width: 60%; */
/*    height: 70vh;*/
/*}*/

/*.cb-img-layer {*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    opacity: 0;*/
/*    transform: scale(1.1);*/
/*    transition: opacity 0.6s ease, transform 0.8s ease;*/
/*    z-index: 1;*/
/*}*/

/*.cb-img-layer img {*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    object-fit: cover;*/
/*    border-radius: 20px;*/
/*    overflow: clip;*/
/*}*/

/*.cb-img-layer.active {*/
/*    opacity: 1;*/
/*    transform: scale(1);*/
/*    z-index: 2;*/
/*    overflow: clip;*/
    /*transition: all 20000ms linear;*/
/*    transform: scale(1.2);*/
/*    transform-origin: right;*/
/*}*/

/* --- IMAGE LAYERS --- */
.cb-images-container {
    /* ... existing styles ... */
    position: relative;
    overflow: hidden;
    /* Desktop Default */
    width: 60%; 
    height: 70vh;
}

.cb-img-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    /* Image starts zoomed slightly in, will be scaled up by JS */
    transform: scale(1.1); 
    transition: opacity 0.6s ease, transform 0.8s ease; 
    z-index: 1;
    border-radius: 20px;
    overflow: hidden; /* Ensure image zoom stays within the container */
}

.cb-img-layer img {
    /* Set transition for the smooth, slow zoom effect */
    transition: transform 20000ms linear; 
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
    overflow: clip;
    /* Image starts zoomed in relative to its container to create the pan/zoom effect */
    transform: scale(1.2); 
    transform-origin: right; /* This determines the direction of the "pan" effect */
}

.cb-img-layer.active {
    opacity: 1;
    /* Reset transform here to its initial state before JS takes over */
    transform: scale(1);
    z-index: 2;
    overflow: clip;
}
/*.cb-img-layer img.active {*/
/*    transform: scale(1.2);*/
/*    transform-origin: left;*/
    /*transform-origin: right;*/
/*        transition: all 20000ms linear;*/
/*}*/

/* --- CARD CONTAINER --- */
.cb-card-container {
    /* Desktop Default */
    width: 40%;
    position: relative;
    z-index: 20;
    display: flex;
    align-items: center;
}

.cb-white-card {
    background: white;
    box-shadow: 0 30px 60px rgba(0,0,0,0.15);
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 740px;
    min-height: 480px;
    padding: 80px 100px 80px 100px;
    margin-left: -100px; /* Overlap */
    min-height: 400px;
}

.cb-card-header {
    font-weight: 800;
    color: #242424;
    line-height: 1.2;
    /* Desktop Default */
    font-size: 32px;
    margin-bottom: 40px;
}

/* --- TEXT LAYERS --- */
.cb-text-stack {
    position: relative;
    /* Desktop Default */
    min-height: 150px; 
}

.cb-text-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.5s ease;
    pointer-events: none;
}

.cb-text-layer.active {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
    transition: all 1500ms 0.5s cubic-bezier(.48, .05, .21, .98);
}

/* --- TEXT DETAILS --- */
.cb-meta-row { display: flex; align-items: center; gap: 15px; margin-bottom: 15px; }
.cb-num { font-weight: 800; color: #00459E; font-size: 40px; }
.cb-item-title { font-weight: 700; color: #242424; margin: 0; font-size: 24px; }
.cb-body-text p { color: #555; line-height: 1.6; margin: 0; font-size: 16px; }

/* --- BADGE --- */
.cb-badge { position: absolute; bottom: 30px; right: 20px; z-index: 50; }
.spin { width: 100%; animation: spin 10s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }

/* =========================================
   MOBILE & TABLET ADJUSTMENTS (Max-width: 991px)
   ========================================= */
@media (max-width: 991px) {
    
    .cb-main-title {
        font-size: 36px;
        top: 20px;
        width: 100%;
        text-align: center;
        right: 0;
    }

    .cb-content-wrapper {
        flex-direction: column; /* Stack vertically */
        justify-content: center;
        padding-top: 60px; /* Space for title */
    }

    /* Resize Images for Mobile */
    .cb-images-container {
        width: 100%;
        height: 40vh; /* Take top 40% of screen */
        border-radius: 12px 12px 0 0;
    }

    /* Resize Card for Mobile */
    .cb-card-container {
        width: 100%;
        margin-top: -30px; /* Slight overlap upwards */
        padding: 0 15px; /* Side padding */
    }

    .cb-white-card {
        margin-left: 0; /* Remove horizontal overlap */
        width: 100%;
        padding: 30px 25px;
        min-height: 250px;
        border-radius: 12px;
    }

    .cb-card-header {
        font-size: 22px;
        margin-bottom: 20px;
    }

    .cb-num { font-size: 32px; }
    .cb-item-title { font-size: 20px; }
    .cb-body-text p { font-size: 14px; }
    .cb-badge { width: 60px; bottom: 10px; right: 10px; }
    .spin { width: 60px; }
}
/*New Css Ends*/