.sol-hero-section {background: url(../images/slider.jpg); padding:212px 0 150px 0; position: relative; background-size: 100%; }


.sol-hero-section:before {content: ''; position: absolute; left: 0; right: 0; bottom: 0; top: 0; background: linear-gradient(45deg, rgba(8, 88, 151, 0.9) 0%, rgb(228 213 29 / 80%) 100%); }


.sol-hero-content {position: relative; z-index: 9;    padding: 5rem 0; }
.sol-hero-media{position: relative;z-index: 9}
.sol-hero-media img {width: 100%; box-shadow: 20px 20px 0px var(--green); }

.sol-hero-title {color: var(--white); font-size: 70px; margin: 0; font-weight: 600; }
.sol-hero-content p{color: var(--white); font-size: 20px; margin: 0 0 1rem 0; font-weight: 500; }

.sol-hero-title span {color:var(--white);  text-transform: capitalize;}
.sol-hero-title1 {color: #FFF; font-size: 35px;  margin: 0;  font-weight:600; }

.sol-hero-title1 i {color:var(--white);    font-weight: normal; font-size: 35px; font-style: normal; display: inline-block; -moz-transform: translateY(-5px); -o-transform: translateY(-5px); -ms-transform: translateY(-5px); -webkit-transform: translateY(-5px); transform: translateY(-5px); }




.lp-hero-shape-1 {top: 370px; left: -50px; z-index: 1; position: absolute; }
.lp-hero-shape-5 {left: 580px; top: 300px; z-index: 1; position: absolute; }


.featured-logo-section {background: var(--lightgray); padding: 1rem 0; position: relative; z-index: 2; }
.featured-logo-image { padding: 10px; justify-content: center; display: flex ; border-radius: 5px; align-items: center; min-height: 158px; }
.featured-logo-image img{width:100%}



.bg-shape-image {position: absolute; bottom: 55%; left: 0; z-index: -1; right: 0; width: 100%; }
 .bg-shape-image img {width: 100%; height: 100%; }




/*----------------------------------------*/
/* product
/*----------------------------------------*/
.product-section {padding: 40px 0; background: var(--lightgray) url(../images/bg-dot.png); background-position: right; background-repeat: no-repeat; background-size:contain; }
.heading-title{display: flex; align-items: center; justify-content: space-between; margin-bottom: 1rem}
.heading-title  .heading-aera h1 {color: var(--orange);font-size: 50px;margin: 0;font-weight: 600;}
.heading-title .heading-aera p {color: var(--black);line-height: 25px;font-size: 16px;margin: 0 0 1rem 0;font-weight: 500;}
.heading-action{text-align: end; }



.product-card {max-width: 100%; max-height: 932px; position: relative; border-radius: 10px; padding: 15px; box-shadow: 0 4px 10px hsl(0deg 0% 0% / 5%); background: var(--white); }

.product-card .bg-shape {top: -5px; left: -5px; z-index: -1; width: 95%; height: 95%; position: absolute; border-radius: 10px; transform: rotate(-1deg); background-color: #d2dfa4; }
.product-title-main {z-index: 2; }
.product-tabs {position: sticky; top: 0; }
.product-tabs ul.nav.nav-tabs {border: none; }
.product-tabs {counter-reset: my-sec-counter; margin-top: 0rem; list-style: none; }
.product-tabs ul li{margin-bottom: 5px; display: block;width: 100%; }
/*.product-tabs ul li:not(:last-child) {margin-bottom: 5px; display: block;width: 100%; }*/
.product-tabs-link {padding: 15px 15px;box-shadow: 0 5px 20px hsl(0deg 0% 0% / 5%);border-radius: 10px;position: relative;display: flex;border-left: 3px solid var(--orange);align-items: center;cursor: pointer;width: 100%;background-size: cover;background-position: center;}
.product-tabs-link::before {content: ""; position: absolute !important; right: 0; top: 0; border-radius: 5px; transition: all .3s; background: linear-gradient(90deg, #E4701D 0%, hsl(0deg 0% 0% / 56%) 91%); left: 0; bottom: 0; }


.product-tabs li a.active .product-tabs-link { border-left: 3px solid var(--black); }
.product-tabs li:hover .product-tabs-link { border-left: 3px solid var(--black);}

.product-tabs-link .icn {width: 38px;height: 38px;position: relative;margin-right: 10px;background: var(--black);text-align: center;line-height: 38px;border-radius: 50px;color: var(--white);font-weight: bold;}
.product-tabs-link h3 {margin: 0;font-size: 14px;font-weight: 600;color: var(--white);padding: 0;position: relative;}


.product-tab-content-box {max-width: 100%; max-height: 932px; position: relative; border-radius: 10px; padding: 15px; box-shadow: 0 4px 10px hsl(0deg 0% 0% / 5%); background: var(--white); }

.product-tab-content-box h4 {margin: 0 0 1rem 0; padding: 0; color: var(--orange); font-size: 32px; font-weight: 600; }
.product-tab-content-box p {margin: 0 0 1rem 0; font-size: 14px; font-weight: normal; text-align: justify; color: var(--black); padding: 0; }

.product-tab-content-box{ /*height: 100%; */vertical-align: middle; position: absolute; -webkit-transition: opacity .25s linear; transition: opacity .25s linear; top: 0; color: #fff; }
.product-inners {position: sticky; top: 12vw; left: 0; height: 60vh; }

.product-item{background: transparent; padding-left:35px; margin-bottom: 35px; animation-duration: 1.25s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); position: relative; width: 100%; }


.product-item::before {transform: perspective(500px) rotateY(-4deg); position: absolute; width: calc(100% + -100px); height: calc(100% + -4px); top: calc(25px + -1px); content: ""; border: 3px solid #000345; z-index: -1; right: calc(25px - -60px); box-shadow: 0 0 1px transparent; opacity: 0; }
.product-item-inner {position: relative; z-index: 2; background: #fff; margin: 0 auto; padding:40px 20px; box-shadow: 0 0 30px #eee; will-change: transform; transform: perspective(1000px) rotateX(0deg) rotateY(0deg); }
.producticon{position: relative; height: 100px; width: 120px; z-index: 2; margin: 0 auto; -webkit-perspective: 100px; perspective: 100px; margin-bottom: 45px; }
.producticon::before {background: var(--green); position: absolute; content: ""; right: 44%; top: -15%; height: 100%; width: 88px; z-index: -1; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; box-shadow: 0 0 1px transparent; transform: rotateY(7deg); }
.producticon-inner {position: relative; width: 72px; height: 72px; text-align: center; line-height: 72px; border-radius: 100%; background: var(--white); left: 30px; box-shadow:0 0 30px hsl(73.69deg 60.32% 51.57% / 25%); }
.producticon-inner > img {position: absolute; top: 13px; right: 12px; width: 44px; }
.product-item:hover::before{ opacity: 1;}
.product-item:hover{will-change: transform; transform: perspective(1000px) rotateX(-2deg) rotateY(6deg) scale3d(1, 1, 1);}


.product-item-content h4{font-size: 16px; font-weight: 600; transition: all .4s ease 0s; margin: 0 0 1rem 0; padding: 0;font-family: "Federo", sans-serif; color: var(--darkblue); background: radial-gradient(42.24% 2817.5% at 52.45% 54.17%, rgb(172 206 57) 0%, #3C7FFF 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.product-item-content p {font-size: 14px; line-height: 24px; color: var(--darkblue); margin-bottom: 30px; transition: all .4s ease 0s; text-align: justify; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; }
.lp-howitwork-btn {font-size: 14px; position: relative; padding: 10px 30px; margin-bottom: 0px; color: var(--darkblue); display: inline-flex; justify-content: center; gap: 10px; text-decoration: none; border-radius: 5px; font-weight: bold; border: 2px solid var(--darkblue); }


.product-image {width: 100%; height: 400px; border-radius: 10px; position: relative; background: #f8f8f8; display: flex ; align-items: center; justify-content: center; }
.product-image img {max-width: 100%; max-height: 100%; }

/*----------------------------------------*/
/* Service Agreement
/*----------------------------------------*/
.serviceagreement-section {position: relative; background: var(--darkblue) url(../images/serviceagreement-bg.png); background-position: top right; background-repeat: no-repeat; background-size: 100%; padding: 2rem 0; }

.serviceagreement-heading {margin-bottom: 2rem }
.serviceagreement-heading  h2 {color: var(--orange); font-size: 50px; margin: 0; font-weight: 600; }
.serviceagreement-heading  p {color: var(--white); line-height: 25px; font-size: 16px; margin: 0 0 1rem 0; font-weight: 500; }

.serviceagreement-page-item {margin-bottom: 10px; padding-left: 28px;}

.serviceagreement-inner-box {display: flex ; gap: 25px; align-items: center; }
.serviceagreement-icon {position: relative; margin-left: -38px; display: -webkit-box; display: -ms-flexbox; display: flex ; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 50px; height: 50px; font-size: 24px; background-color: var(--orange); color: var(--white); -webkit-transition: all .3sease; transition: all .3sease; z-index: 3; }
.serviceagreement-icon:after {content: ""; position: absolute; top: 50%; right: -10px; width: 0; height: 0; border-top: 10px solid transparent; border-left: 10px solid var(--orange); border-bottom: 10px solid transparent; -webkit-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all .3sease; transition: all .3sease; }

.serviceagreement-page-head a.accordion-button {position: relative; padding: 10px 10px 10px 10px; width: 100%; font-size: 24px; color: var(--black); margin: 0 0 0rem 0; font-weight: 500; text-transform: none; background: #fff; }
.serviceagreement-page-head a.accordion-button::after {flex-shrink: 0; width: 1.25rem; height: 1.25rem; margin-left: auto; content: ""; background-image: url(../images/arrow-down.svg); background-repeat: no-repeat; background-size: 1.25rem; transition: transform 0.2s ease-in-out; }
.serviceagreement-page-head a.accordion-button:not(.collapsed)::after {background-image: url(../images/arrow-down.svg); transform: rotate(-180deg); }
.serviceagreement-content h4 {margin: 0; padding: 0; color: var(--black); line-height: 25px; font-size: 16px; font-weight: 500; }
.serviceagreement-page-body {padding: 10px; background: #fff; }


.serviceagreement-page-body  p {color: var(--black); line-height: 25px; font-size: 14px; margin: 0 0 1rem 0; font-weight: 500; }
.serviceagreement-page-body ul{margin: 0; padding: 0 0 0 20px; list-style: disc;}
.serviceagreement-page-body ul li {color: var(--black); line-height: 25px; font-size: 14px; font-weight: 500; }

/*----------------------------------------*/
/* blogs
/*----------------------------------------*/

.blogs-section {padding: 40px 0; background: var(--lightgray) ; }
.blogs-heading{ width: 50%; margin:0 auto 2rem auto;}
.blogs-heading h2 {color: var(--orange);font-size: 50px;margin: 0;font-weight: 600; text-align: center;}
.blogs-heading p {color: var(--black);line-height: 25px;font-size: 16px;margin: 0 0 1rem 0;font-weight: 500;text-align: center}

.blogs-card {background: var(--white); position: relative; margin-bottom: 10px; box-shadow: 0 4px 20px hsl(0deg 0% 0% / 5%); }
.blogs-card-image {width: 100%; height: 200px; position: relative; overflow: hidden; }
.blogs-card-image img {width: 100%; height: 100%; object-fit: cover; }
.blogs-card-content{padding: 10px;}
.blogs-card-content h4 {color: var(--black); line-height: 25px; font-size: 18px; margin: 0 0 10px 0; font-weight: 700; padding: 0; }
.blogs-card-content p {color: var(--black); line-height: 25px; font-size: 14px; margin: 0 0 10px 0; font-weight:400; text-align: justify;}
.blogs-date-auther {display: flex ; gap: 20px; align-items: center; margin-bottom: 10px; }
.blogs-auther,
.blogs-date {color: var(--black); line-height: 25px; font-size: 14px; margin: 0; font-weight: 500; display: flex ; gap: 10px; }

.sol-blogs-btn {font-size: 14px; position: relative; padding: 10px 20px; margin-bottom: 0px; color: var(--white); display: inline-block; text-decoration: none; border-radius: 0; font-weight: bold; border: none; background: var(--orange); }

.blogs-action{text-align: center; margin-top: 1rem;}

/*----------------------------------------*/
/* about
/*----------------------------------------*/
.about-section {padding: 40px 0; background: var(--white) ; }


.about-image-card{position: relative;}
.about-image-media-1 {border: 5px solid var(--orange); position: relative; width: 300px; overflow: hidden; border-radius: 0; box-shadow: 0 4px 12px hsl(0deg 0% 0% / 5%); }
.about-image-media-2 {border: 5px solid var(--white); width: 300px; overflow: hidden; position: absolute; right: 0; top: 70%; box-shadow: 0 4px 12px hsl(0deg 0% 0% / 5%); }
.about-image-media-1 img, .about-image-media-2 img{width: 100%; }


.about-content-card h3 {color: var(--black); line-height: 25px; font-size: 18px; margin: 0 0 10px 0; font-weight: 700; padding: 0; }
.about-content-card h2 {color: var(--orange); line-height: 40px; font-size: 40px; margin: 0 0 10px 0; font-weight: 700; padding: 0; }
.about-content-card p {color: var(--black); line-height: 25px; font-size: 14px; margin: 0 0 10px 0; font-weight:400; text-align: justify;}



/*----------------------------------------*/
/* gallery
/*----------------------------------------*/
.gallery-section {padding: 40px 0; background: var(--white) ; }
.gallery-heading{ width: 50%; margin:0 auto 2rem auto;}
.gallery-heading h2 {color: var(--orange);font-size: 50px;margin: 0;font-weight: 600; text-align: center;}
.gallery-heading p {color: var(--black);line-height: 25px;font-size: 16px;margin: 0 0 1rem 0;font-weight: 500;text-align: center}



.gallery-card-image{height: 400px; width: 100%; position: relative; overflow: hidden; margin-bottom: 1rem}
.gallery-card-image a img {width: 100%; height: 100%; object-fit: cover; }

/*----------------------------------------*/
/* testimonials
/*----------------------------------------*/
.testimonials-section{ background:url(../images/testimonials-bg.jpg); padding:2rem 0; position:relative; background-size:100%; }

.testimonials-heading-box h2 {color: var(--black); line-height: 34px; font-size: 26px; margin: 0 0 10px 0; font-weight: 700; padding: 0; }

.testimonials-card {position: relative; background: var(--white); padding: 1rem;}

.testimonials-card-head h2 {color: var(--black);font-size: 16px;margin: 0 0 10px 0;font-weight: 600; padding: 0;}
.testimonials-card-head p {color: var(--gray);font-size: 14px;margin: 0 0 10px 0;font-weight: 600; padding: 0;}
/* .testimonials-card-content p {color: #292D32; line-height: 25px; font-size: 14px; margin: 0 0 0 0; font-weight: 500; text-align: justify; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 11; -webkit-box-orient: vertical; height: 20rem; } */


.mx-box-height{
    max-height: 24rem;
}
.testimonials-card-content {
    position: relative;
    overflow: hidden;
    min-height: 24rem;
    
    transition: max-height 0.4s ease-in-out; /* Fixed typo */
}

.testimonials-card-content.expanded {
    max-height: none !important; /* Remove height restriction */
}


.read-more {
    display: inline-block;
    color: #007bff;
    cursor: pointer;
    margin-top: 5px;
    font-weight: bold;
}

/* Optional: Fade Effect Before Expansion */
.testimonials-card-content::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 50px; /* Adjust fade area */
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, white 100%);
    pointer-events: none;
}

.testimonials-card-content.expanded::after {
    display: none; /* Remove fade effect when expanded */
}

.read-more-toggle {
    display: inline-block;
    color: #007bff;
    cursor: pointer;
    margin-top: 5px;
    font-weight: bold;
    background: transparent;
    border: 1px solid;
    padding: 5px;
}


#testimonials .owl-nav {position: absolute; left: -20%; top: 65%; }
#testimonials  .owl-nav button.owl-next, 
#testimonials .owl-nav button.owl-prev {margin: 1px; border: 0; background: #E4701D; width: 40px; height: 40px; line-height: 40px; display: inline-block; }

#testimonials  .owl-nav button.owl-next span, 
#testimonials .owl-nav button.owl-prev span{color: #fff; font-size: 30px; line-height: 35px; }


/*----------------------------------------*/
/* contact us
/*----------------------------------------*/


.contact-us-card {margin-bottom: 1rem; padding: 1rem 2rem; box-shadow: 0 4px 10px hsl(0deg 0% 0% / 5%); background: var(--white); border-radius: 10px; }
.contact-us-card h2{    margin: 0 0 1rem 0; padding: 0; color: var(--orange); font-size: 32px; font-weight: 600;}

.contact-us-card  label{    font-size: 14px; font-weight: 600; margin: 0; color:var(--black); }
.contact-us-card  input.form-control {font-size: 14px;background: #FFFFFF;border: 1px solid #E7EEE7;border-radius: 4px;position: relative;padding: 12px;outline: none;box-shadow: 0 5px 13px rgb(240 240 241 / 46%);outline: 0;width: 100%;display: inline-block;color: #455A64;}
.contact-us-card  select.form-control {font-size: 14px; appearance: auto; background: #FFFFFF;border: 1px solid #E7EEE7;border-radius: 4px;position: relative;padding: 12px;outline: none;box-shadow: 0 5px 13px rgb(240 240 241 / 46%);outline: 0;width: 100%;display: inline-block;color: #455A64;}
.contact-us-card  textarea.form-control {font-size: 14px;background: #FFFFFF;border: 1px solid #E7EEE7;border-radius: 4px;position: relative;padding: 12px;box-shadow: 0 5px 13px rgb(240 240 241 / 46%);outline: 0;width: 100%;display: inline-block;color: #455A64;min-height: calc(5em + .75rem + 2px);}
.contact-us-card .wpcf7-submit {border: none; text-align: center; border-radius: 5px; padding: 10px 40px; color: var(--white); font-size: 13px; font-weight: 500; background: var(--orange); display: inline-block; }

.contact-us-card-body p{    margin: 0 0 0rem 0; padding: 0; color: var(--black); font-size:14px; }
.contact-us-card-body p a{  color: var(--orange);  }