.section-bg{position: absolute;top: 0;left: 0;width: 100%;height: auto;z-index: -1;}
.section-bg img{width: 100%;}

/*=============== Banner Slider ===============*/
.banner-area{padding: 0;position: relative;z-index: 0;}
.banner-area .carousel-item{width: 100%;aspect-ratio: 1920/1000;position: relative;z-index: 0;}
.banner-area .carousel-item img{max-width: 100%;}
.banner-area .carousel-item::before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgb(0 0 0 /26%);}
.banner-area .carousel-item .banner-caption{position: absolute;top: 0;left: 50%;transform: translateX(-50%);height: 100%;display: flex;flex-direction: column;justify-content: center;color: #fff;}
.banner-area .carousel-item .banner-caption h3{font-size: 47px;font-weight: 600;line-height: 1.04;}
.banner-area .carousel-item .banner-caption p{font-size: 23px;font-weight: 400;line-height: 1.35;}

.banner-area .carousel-control-prev,
.banner-area .carousel-control-next{bottom: 20px;top: unset;width: 35px;height: 35px;background: var(--theme-yellow);border-radius: 0 50% 50% 0;opacity: .8;transition: 0.5s;}
.banner-area .carousel-control-prev{right: 65px;left: unset;transform: rotate(180deg);}
.banner-area .carousel-control-next{right: 30px;}
.banner-area .carousel-control-prev img, 
.banner-area .carousel-control-next img{padding: 0;width: 18px;height: auto;filter: brightness(1) invert(1);}
.banner-area:not(:hover) .carousel-control-prev,
.banner-area:not(:hover) .carousel-control-next{opacity: 0;}
.banner-area .carousel-control-next:hover, 
.banner-area .carousel-control-prev:hover{opacity: 1;}



/*=============== Services Area ===============*/
.services{background: #fff;position: relative;z-index: 1;}
.services .owl-carousel{margin: 48px 0;}
.services .owl-carousel .item{padding: 2px;width: 100%;}

.service-card{padding: 47px 5px 72px 5px;height: 100%;width: 100%;background: rgb(255 253 243);border: 1px solid #F8EDB4;border-radius: 10px;position: relative;transform-style: preserve-3d;transition: all 1s ease-in-out;}
.services [class*=col]:nth-child(even) .service-card,
.services .owl-item:nth-child(even) .service-card{background: rgb(248 251 255);border-color: #D4E3F2;}
/* .service-card .card-icon{padding: 0 0 30px 35px;height: 94px;width: 100%;max-width: fit-content !important;filter: invert(69%) sepia(56%) saturate(5439%) hue-rotate(160deg) brightness(103%) contrast(90%);vertical-align: unset;display: inline-block !important;} */
.services img.card-icon{margin: 0 0 30px 35px;padding: 0;max-width: 75%;width: auto;height: 65px;text-align: left;display: flex;justify-content: flex-start;}


.service-card h4{margin-bottom: 30px;padding: 0 15px 15px 35px;border-bottom: 1px solid #C1C1C1;font-size: 20px;font-weight: 600;line-height: 1.4;white-space: pre-line;}
.service-card p{padding: 0 17px 5px 35px;font-size: 16px;}
.service-card .card-link{position: absolute;left: 40px;bottom: 27px;width: 45px;height: 45px;background: var(--theme-lightblue);border-radius: 50%;display: flex;justify-content: center;align-items: center;transition: 0.5s;}
.service-card .card-link img{padding: 0;width: 18px;height: auto;filter: brightness(1) invert(1);}
.service-card:hover,
.services [class*=col]:nth-child(even) .service-card:hover,
.services .owl-item:nth-child(even) .service-card:hover{border-color: transparent;}
/*--------- Caption Area ---------*/
.services .theme-btn{margin: 0 auto;}
.services .caption{margin: 20px auto 0;width: 90%;font-size: 16px;font-weight: 500;line-height: 1.2;color: #444;text-align: center;}
.services .caption a{display: inline-flex;color: var(--theme-lightblue);position: relative;overflow: hidden;transition: 0.5s;}
.services .caption a::after{content: '';position: absolute;left: -100%;bottom: 0;width: 200%;height: 1px;background-image: linear-gradient(to right, var(--theme-yellow) 50%, var(--theme-lightblue) 50%);transition: 0.5s;}
/*--------- Front/Back Area ---------*/
.service-card .front{transition: 0.4s 0.4s all;}
.service-card:hover .front{opacity: 0;transition: 0.4s 0s all;}

.service-card .back{position: absolute;top: 0;left: 0;width: 100%;height: 100%;padding: 0;border-radius: 10px;backface-visibility: hidden;overflow: hidden;opacity: 0;z-index: -1;transition: 0.4s;}
.service-card .back img{width: 100%;height: 100%;object-fit: cover;border: 1px solid transparent;border-radius: 10px;}
.service-card .back:before{content: '';position: absolute;left: 0;bottom: 0;width: 100%;height: 100%;z-index: 1;background: rgb(255 253 243);
    background: -moz-linear-gradient(0deg, rgb(255 253 243/1) 0%, rgb(255 253 243/1) 60%, rgb(255 253 243/0) 100%);
    background: -webkit-linear-gradient(0deg, rgb(255 253 243/1) 0%, rgb(255 253 243/1) 60%, rgb(255 253 243/0) 100%);
    background: linear-gradient(0deg, rgb(255 253 243/1) 0%, rgb(255 253 243/1) 60%, rgb(255 253 243/0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffffff",GradientType=1);
    transform: scaleY(2);transform-origin: bottom;transition: 0.6s all;}
.service-card .back .card-link{background: var(--theme-yellow);}
.service-card .back .card-link img{width: 18px;height: auto;object-fit: unset;}
.service-card:hover .back{opacity: 1;}
.service-card:hover .back:before{transform: scaleY(1);height: 0%;}


.services [class*=col]:nth-child(even) .service-card .back:before,
.services .owl-item:nth-child(even) .service-card .back:before{background: rgb(248 251 255);
    background: -moz-linear-gradient(0deg, rgb(248 251 255/1) 0%, rgb(248 251 255/1) 60%, rgb(248 251 255/0) 100%);
    background: -webkit-linear-gradient(0deg, rgb(248 251 255/1) 0%, rgb(248 251 255/1) 60%, rgb(248 251 255/0) 100%);
    background: linear-gradient(0deg, rgb(248 251 255/1) 0%, rgb(248 251 255/1) 60%, rgb(248 251 255/0) 100%);}


/*=============== WhoWeAre Area ===============*/
.whoweare{background: var(--theme-blue);position: relative;z-index: 0;overflow: hidden;}
.whoweare .section-bg{opacity: 15%;}
.whoweare .sec-title{width: 92%;}
.whoweare h4, .whoweare p{color: #fff;}
.whoweare .theme-btn{margin-top: 37px;}
.whoweare .theme-btn span{border-color: var(--theme-yellow);color: #fff;}
.whoweare .theme-btn::after{background: var(--theme-yellow);border-color: var(--theme-yellow);color: #444;}
/*--------- Image Area ---------*/
.whoweare .img-area{position: relative;}
.whoweare .img-area .shape{content: '';position: absolute;left: -15px;bottom: 10px;width: 86px;height: 86px;background: var(--theme-yellow);border-radius: 10px 0 10px 10px;}
.whoweare .img-area img{border-radius: 10px;}



/*=============== Technology Area ===============*/
.technology .sec-title{max-width: 690px;}
.technology .technology-list{margin-bottom: 2px;border-bottom: 1px solid #D4D4D4;display: flex;justify-content: space-evenly;}
.technology .technology-list li{padding: 0 22px 20px 22px;font-size: 15px;font-weight: 500;line-height: 1;color: #444;position: relative;transition: 0.5s;cursor: pointer;}
.technology .technology-list li::before{content: '';position: absolute;bottom: -2px;left: 50%;width: 0;height: 3px;border-radius: 10px;background: var(--theme-blue);transform: translateX(-50%);transition: 0.5s;}
.technology .technology-list li::after{content: '';position: absolute;bottom: -8px;left: calc(50% - 6px);width: 12px;height: 12px;background: linear-gradient(to bottom right, var(--theme-lightblue) 50%, transparent 50%);border-radius: 2px;border: 1px solid #fff;border-width: 1px 0 0 1px;transform: scale(0) rotate(45deg);transition: 0.5s 0s;}
.technology .technology-list li:not(.collapsed){ color: var(--theme-blue);}
.technology .technology-list li:not(.collapsed)::before{width: 100%;}
.technology .technology-list li:not(.collapsed)::after{transform: scale(1) rotate(45deg);transition: 0.5s 0.2s;}
/*--------- Icon Area ---------*/
.technology .icon-card{display: flex;flex-direction: column;align-items: center;text-align: center;}
.technology .icon-card img{margin-bottom: 12px;height: 70px;}
.technology .icon-card p{font-size: 17px;font-weight: 500;line-height: 1;color: #444;}
/*--------- Accordion Area ---------*/
.technology .accordion{margin-top: 55px;padding: 0 30px;}
.technology .accordion-item{border: none;border-radius: 0;}
.technology .accordion-header{display: none;}
.technology .accordion-button{font-size: 15px;font-weight: 500;line-height: 1;}
.technology .accordion-button::after{display: none;}
.technology .accordion-button::before{content: '';position: absolute;top: calc(50% - 9px);right: 22px;width: 12px;height: 12px;background: linear-gradient(to bottom right, var(--theme-lightblue) 50%, transparent 50%);border-radius: 2px;border: 1px solid #fff;border-width: 1px 0 0 1px;transform: rotate(-135deg);transition: 0.5s;}
.technology .accordion-button:not(.collapsed)::before{top: calc(50% - 3px);transform: rotate(45deg);}
.technology .accordion-body{padding: 85px 0 25px;}



/*=============== Counter Area ===============*/
.counter-area{padding: 135px 0;background: #000;position: relative;z-index: 0;overflow: hidden;}
.counter-area .section-bg{opacity: 34%;}

.counter-area .owl-theme .owl-nav [class*=owl-]{border: 1px solid rgb(255 255 255/ 70%);}
.counter-area .owl-theme .owl-nav [class*=owl-] img{filter: invert(1) opacity(0.7);}
.counter-area .owl-theme .owl-nav [class*=owl-]:hover{background: transparent;border-color: rgb(255 255 255);}
.counter-area .owl-theme .owl-nav [class*=owl-]:hover img{filter: invert(1) opacity(1);}

.counter-area .owl-carousel .item{width: 100%;}
.counter-card{padding: 10px 13px 0 13px;width: 100%;}
.counter-card h6{margin-bottom: 0;padding: 0 0 9px 20px;font-size: 45px;font-weight: 500;line-height: 1;color: #fff;letter-spacing: 0.77px;display: flex;}
.counter-card h6 sup{font-size: 22px;font-weight: 500;line-height: 1;color: var(--theme-yellow);top: -12px;left: -2px;}
.counter-card p{padding: 13px 0 0 20px;border-top: 1px solid rgb(255 255 255/40%);font-size: 18px;font-weight: 500;line-height: 1;color: #fff;}

.counter-card .counter{position: relative;display: flex;align-items: center;overflow: hidden;height: 40px;}
.counter-card .counter > span{z-index: 1;display: flex;flex-direction: column;height: 100%;width: 30px;text-align: right;transition: transform 2s ease;transform: translateY(0);}
.counter-card .counter > span span{flex: 0 0 100%;height: 100%;}



/*=============== Why Choose Area ===============*/
section.whychoose{padding-bottom: 28px;}
.whychoose .owl-carousel{margin: 45px 0;}
.whychoose .owl-carousel .item{width: 100%;}
.whychoose-card{margin-top: 26px;padding: 50px 37px 50px 28px;height: calc(100% - 26px);background: var(--theme-yellow);border-radius: 10px;position: relative;}
.whychoose-card::before,
.whychoose-card::after{content: '';position: absolute;top: -26px;right: 18px;width: 53px;aspect-ratio: 1/1;background-size: contain;transition: 0.5s;}

.whychoose-card::before{background: url(../img/logo-icon.svg)no-repeat center center;background-size: contain;}
.whychoose-card::after{background: url(../img/logo-icon-2.png)no-repeat center center;background-size: contain;opacity: 0;}
.whychoose-card:hover::before,
.whychoose-card:hover::after{top: -15px;}
.whychoose-card:hover::after{opacity: 1;}


.whychoose-card .title{padding: 0 0 16px 14px;font-size: 22px;font-weight: 600;color: #444;position: relative;}
.whychoose-card .title::after{content: '';position: absolute;bottom: 0;left: 0;width: 84%;height: 1px;background: rgb(255 255 255/ 58%);}
.whychoose-card p{padding: 20px 0 0 14px;font-size: 16px;font-weight: 400;line-height: 1.5;color: #444;}


/* 19-05-2025 */
.footer h6.webplus img {filter: invert(1) grayscale(1) brightness(2); opacity: 0.55; transition: 0.5s all; }
.footer h6.webplus:hover img {opacity: 0.8; }