.text-primary-dark {
            color: var(--primary-dark);
        }

        div#faq-items .accordion-header .accordion-button {
            background-color: var(--primary-dark);
            color: var(--white);
            box-shadow: none !important;
            border-top-right-radius: 10px;
            border-bottom-right-radius: 10px;
        }

        .accordion-item:first-of-type .accordion-button {
            border-top-left-radius: 0;
            border-top-right-radius: var(--bs-accordion-inner-border-radius);
            border-bottom-right-radius: var(--bs-accordion-inner-border-radius);
        }

        .accordion-header {
            border-left: 4px solid var(--primary-dark);
        }

        .accordion-button:not(.collapsed) {
            background-color: var(--primary-dark);
            color: var(--white);

            box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
        }

        .every div#faq-items .accordion-header .accordion-button {
            background-color: var(--primary-dark);
            color: var(--white);
            box-shadow: none !important;
            border-top-right-radius: 10px;
            border-bottom-right-radius: 10px;
        }

        .every div#faq-items .accordion-header .accordion-button.collapsed {
            color: black;
            background-color: white;
            border-top-right-radius: 10px;
            border-bottom-right-radius: 10px;
        }

        .solution-video .carousel-image {
            width: 100%;
        }

        #keyfeatures {
            width: 80%;
            margin: auto;
        }

        #keyfeatures .carousel-image h4 {
            color: var(--primary-dark);
            font-weight: bold;
        }

        div#keyfeatures .slide .carousel-image {
            /* box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1); */
            border-radius: 10px;
            height: 250px;
            width: 90%;
            margin: auto;
            padding: 25px 15px;
            /* height: 100%; */
            background-color: var(--section-bg);
            /* background-color: red; */

        }

        .key-features .slick-next {
            display: block;
            position: absolute;
            right: -50px;
            font-size: 30px;
            cursor: pointer;
            bottom: 43%;
        }

        .key-features .slick-prev {
            display: block;
            font-size: 30px;
            position: absolute;
            cursor: pointer;
            left: -50px;
            top: 38%;
        }

        .features-mobile .slick-next {
            display: block;
            position: absolute;
            right: 0;
            font-size: 30px;
            cursor: pointer;
            bottom: 50%;
            z-index: 1 !important;
        }

        .features-mobile .slick-prev {
            display: block;
            font-size: 30px;
            position: absolute;
            cursor: pointer;
            left: 0;
            z-index: 1 !important;
            top: 42%;
        }

        .solution-slide-mob .slick-next {
            display: none !important;
            position: absolute;
            right: 10px;
            font-size: 30px;
            cursor: pointer;
            bottom: 50%;
            z-index: 1 !important;
        }

        .solution-slide-mob .slick-prev {
            display: none !important;
            font-size: 30px;
            position: absolute;
            cursor: pointer;
            left: 10px;
            z-index: 1 !important;
            top: 24%;
        }

        .solution-slide-mob .carousel-image {
            /* width: 47%; */
            /* margin: auto; */
            margin: 5px 12px;
        }

        .key-hero {
            height: 450px;
        }

        .everything-oneplace {
            background-color: var(--section-bg);
            /* padding: 40px 0px; */
        }

        .everything-oneplace .solutions-animations {
            height: 100%;
            margin: auto;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: auto;
        }


        .key-id .key-capabilities {
            position: relative;
            cursor: pointer;
            border-top-left-radius: 10px;
            transition: 0.3s;
            border-bottom-left-radius: 10px;
            border-top-right-radius: 0px;
            border-bottom-right-radius: 0px;
            box-shadow: 0px 0px 5px 1px var(--shadow);
        }

        .accordion-button {
            color: black;
        }

        .key-id .active {
            transition: 0.3s;
            transform: scale(1.1) !important;
            animation-timing-function: ease;
        }

        .solutions-features {
            transition: 0.5s;
            /* transform: scale(1.1) !important; */
        }

        .solutions-features .active {
            transition: 0.5s;
            transform: scale(1.1) !important;
        }

        .key-id .key-capabilities::before {
            content: "";
            position: absolute;
            right: -3px !important;
            top: -5px !important;
            height: calc(100% + 10px);
            width: 3px;
            background-color: var(--primary-bg-light);
            left: auto;
        }



        .solution-box {
            height: 100%;
        }

        .carousel-image .solution-box {
            height: 300px;
        }

        .input-box {
            position: absolute;
            max-width: 30px;
            height: 32px;
            transition: all 0.5s ease-in-out;
            display: inline-table;
            right: 20px;
            top: 10px;
        }

        iframe {
            width: 92%;
            height: 445px;
            border-radius: 20px;
            border: 4px solid var(--primary-color);
        }

        .features-mobile .carousel-image {
            width: 80% !important;
            margin: auto !important;
        }

        .mobile {
            display: none;
        }

        .solutions-features .solutions-animations img {
            height: 390px;
            width: 100%;
            margin: auto;
        }

        .laptop-solution {
            position: relative;
        }

        .laptop-over {
            position: absolute;
            top: 17.3%;
            width: 16.9% !important;
            left: 13.8%;
            transform: rotate(0.2deg);
        }

        .features-mobile .laptop-solution {
            position: relative;
        }

        .features-mobile .laptop-over {
            position: absolute;
            top: 11.3%;
            width: 6.6% !important;
            left: 20.8%;
            transform: rotate(0.2deg);
        }

        .solutions-banner .carousel-item .banner {
            width: 60%;
            /* margin-left: -100px; */
            height: 500px;
        }

        .solutions-banner-right {
            position: absolute;
            right: 5%;
            top: 45%;
            transform: translateY(-50%);
            width: 45%;
            text-align: center;
            z-index: -1;
        }

        .solutions-banner-right img {
            width: 100%;
            transform: scale(1.3);
        }


        div#carouselExampleDark .carousel-caption h1 span,
        div#carouselExampleDark .carousel-caption h2 span {

            color: transparent;

        }

        @media (min-width:2555px) {
            .solution-box {
                height: 300px;
            }

            .solutions-banner .carousel-item .banner {
                width: 60% !important;
                /* margin-left: -100px; */
                height: 700px;
            }

            .laptop-over {
                position: absolute !important;
                top: 21% !important;
                width: 11.5% !important;
                left: 25.5% !important;
                transform: rotate(0.2deg);
            }

            .splide__slide img {
                width: 100%;
                height: 90%;
                padding: 0 65px;
                border-radius: 10px;
                box-shadow: 0 4px 5px rgba(0, 0, 0, .12);
            }
        }

        @media (min-width:1979px) and (max-width:2553px) {
            .solution-box {
                height: 300px;
            }

            .solutions-banner .carousel-item .banner {
                width: 60% !important;
                /* margin-left: -100px; */
                height: 500px;

            }

            .laptop-over {
                position: absolute !important;
                top: 22% !important;
                width: 14.5% !important;
                left: 18.5% !important;
                transform: rotate(0.2deg);
            }

            .splide__slide img {
                width: 100%;
                height: 90%;
                padding: 0 40px;
                border-radius: 10px;
                box-shadow: 0 4px 5px rgba(0, 0, 0, .12);
            }
        }

        @media (min-width:1919px) and (max-width:1925px) {
            .solution-box {
                height: 300px;
            }

            .solutions-banner .carousel-item .banner {
                width: 60% !important;
                /* margin-left: -100px; */
                height: 500px;

            }

            .laptop-over {
                position: absolute !important;
                top: 22% !important;
                width: 14.7% !important;
                left: 17.6% !important;
                transform: rotate(0.2deg);
            }

            .splide__slide img {
                width: 100%;
                height: 90%;
                /* padding: 0 40px; */
                border-radius: 10px;
                box-shadow: 0 4px 5px rgba(0, 0, 0, .12);
            }
        }

        @media (min-width:1727px) and (max-width:1800px) {
            .laptop-over {
                position: absolute;
                top: 21%;
                width: 17.5% !important;
                left: 13.5% !important;
                transform: rotate(0.2deg);
            }
        }

        @media (min-width:1600px) and (max-width:1918px) {
            .solution-box {
                height: 300px;
            }

            .laptop-over {
                position: absolute;
                top: 21%;
                width: 11.5% !important;
                left: 25.5%;
                transform: rotate(0.2deg);
            }

            .solutions-banner .carousel-item .banner {
                width: 60% !important;
                height: 544px !important;
            }

            div#carouselExampleDark img {
                width: 80%;
            }

            .solutions-banner-right {
                position: absolute;
                right: 0;
                top: 45%;
                transform: translateY(-50%);
                width: 45%;
                text-align: center;
            }

            .solutions-banner-right img {
                transform: scale(1.5);
            }
        }

        @media (min-width:1301px) and (max-width:1400px) {
            .footer-top .social-links a {
                margin-top: 5px !important;
            }
        }

        @media (min-width:1200px) and (max-width:1300px) {
            .laptop-over {
                position: absolute;
                top: 26.3%;
                width: 17.9% !important;
                left: 10.8%;
                transform: rotate(0.2deg);
            }

            div#business-sliders .slick-prev.slick-arrow {
                position: absolute;
                left: 48%;
                bottom: -45px;
                width: auto;
                display: table;
                cursor: pointer;
            }
        }

        @media (min-width:1024px) and (max-width:1100px) {
            .laptop-over {
                position: absolute;
                top: 29.3%;
                width: 17.5% !important;
                left: 11.5%;
                transform: rotate(0.2deg);
            }
        }

        @media (min-width:770px) and (max-width:915px) {
            div#faq-items .accordion-body img {
                width: 100%;
            }

            .mobile {
                display: block;
            }

            .desktop {
                display: none;
            }
        }

        .pos .slick-next {
            top: 30% !important;
            display: block !important;
            position: absolute !important;
            right: -5% !important;
            font-size: 30px !important;
            cursor: pointer !important;
            bottom: 0 !important;
            z-index: 1 !important;
        }

        .pos .slick-prev {
            top: 30% !important;
            display: block !important;
            position: absolute !important;
            left: -5% !important;
            font-size: 30px !important;
            cursor: pointer !important;
            /* z-index: 9999; */
            /* bottom: 43%; */
            z-index: 1;
        }

        @media (max-width:768px) {
            .solutions-banner .carousel-item .banner {
                width: 60%;
                /* margin-left: -100px; */
                height: 350px;
            }

            /* .solutions-banner .carousel-item .mobilebanner {
                position: relative;
                width: 100%;
                height: 100vh !important;
            } */

            div#carouselExampleDark .carousel-caption {
                left: 5%;
                top: 15%;
                top: 45%;
                padding: 0px;
                /* margin-top: 25px; */
            }

            .solution-video {
                margin-top: 0;
            }

            .solutions-banner-mobileitem {
                position: absolute;
                bottom: -30px;
                right: 0;
                width: 100%;
            }

            .solutions-banner-mobileitem img {
                height: 430px;
                width: 100%;
            }

            .solutions-banner .carousel-item {
                position: relative;
                width: 100%;
            }

            .business-sliders-solutions .post-img:hover::before {
                /* background: transparent !important; */
                background: linear-gradient(360deg, rgba(0, 0, 0, 0.90) 10%, rgba(0, 0, 0, 0.50) 25%, rgba(0, 0, 0, 0.20) 50%, rgba(255, 255, 255, 0) 100%);
            }

            .solution-box {
                height: 350px;
                border-radius: 10px;
            }

            .solution-box h4 {
                font-size: 16px;
            }

            .solution-box::before {
                position: absolute;
                content: "";
                display: none;
                left: 0px;
                top: 0px;
                height: 100%;
                width: 3px;
                background-color: var(--primary-dark);
            }

            .solution-box img {
                width: 45px;
                height: 45px;
            }

            .desktop {
                display: none;
            }

            .mobile {
                display: block;
            }

            .business-sliders-solutions .post-img .text-start {
                bottom: 10px;
            }



            iframe {
                width: 91%;
                height: 300px !important;
                border-radius: 20px;
                border: 4px solid var(--primary-color);
            }

            .key-hero {
                height: 250px;
                margin-bottom: 30px;
            }

            div#faq-items .accordion-header .accordion-button {
                font-size: 16px;
            }

            .key-features .slick-next {
                display: block;
                position: absolute;
                right: -35px;
                font-size: 30px;
                cursor: pointer;
                bottom: 43%;
            }

            .key-features .slick-prev {
                display: block;
                font-size: 30px;
                position: absolute;
                cursor: pointer;
                left: -35px;
                top: 40%;
            }

            .solution-features .slick-next {
                display: block;
                position: absolute;
                right: -35px;
                font-size: 30px;
                cursor: pointer;
                bottom: 43%;
            }

            .solution-features .slick-prev {
                display: block;
                font-size: 30px;
                position: absolute;

                cursor: pointer;
                left: -35px;
                top: 40%;
            }

            .pos .slick-next {
                top: 23% !important;
                display: block !important;
                position: absolute !important;
                right: 0 !important;
                font-size: 30px !important;
                cursor: pointer !important;
                bottom: 0 !important;
                z-index: 1 !important;
            }

            .pos .slick-prev {
                top: 23% !important;
                display: block !important;
                position: absolute !important;
                left: 0 !important;
                font-size: 30px !important;
                cursor: pointer !important;
                /* z-index: 9999; */
                /* bottom: 43%; */
                z-index: 1;
            }

            .everything-oneplace .solutions-animations {
                height: 100%;
                margin: auto;
                display: flex;
                align-items: center;
                justify-content: center;
                margin: auto;
                margin-top: 20px;
            }
        }

        @media (min-width: 640px) and (max-width: 761px) {
            .solutions-banner .carousel-item .mobilebanner {
                position: relative;
                width: 100%;
                height: 690px;
            }
        }

        @media (max-width:650px) {
            div#carouselExampleDark .carousel-caption {
                width: 90%;
                left: 5%;
                top: 41px;
                padding: 0px;
                /* margin-top: 25px; */
            }
        }

        @media (min-width:520px) and (max-width:550px) {
            .solutions-banner-mobileitem {
                bottom: -1px;
                right: 0;
                width: 100%;
                left: 0;
                text-align: center;
            }

            .solutions-banner-mobileitem img {
                height: 430px;
                width: 100%;
            }
        }

        @media (min-width: 415px) and (max-width: 433px) {
            .circle canvas {
                position: absolute;
                top: -7px;
                left: -13px;
                height: 150px !important;
                width: 150px !important;
            }
        }

        @media (max-width:400px) {
            iframe {
                width: 76%;
                height: 155px !important;
                border-radius: 20px;
                border: 4px solid var(--primary-color);
            }
        }

        @media (min-width: 360px) and (max-width: 385px) {
            .solutions-banner-mobileitem img {
                height: 380px !important;
                width: 100% !important;
            }
        }

        @media (max-width:320px) {
            iframe {
                width: 91%;
                height: 155px !important;
                border-radius: 20px;
                border: 4px solid var(--primary-color);
            }

            .solutions-banner .carousel-item .mobilebanner {
                position: relative;
                width: 100%;
                height: 600px;
            }

            div#keyfeatures .slide .carousel-image {
                /* box-shadow: 0 0 5px 3px rgba(0, 0, 0, 0.1); */
                border-radius: 10px;
                height: 350px;
                width: 90%;
                margin: auto;
                padding: 25px 15px;
                /* height: 100%; */
                background-color: var(--section-bg);
                /* background-color: red; */
            }

        }
    

        .tabKP {
            position: relative;
        }

        .tabKP .nav-pills .nav-link {
            display: flex;
        }

        .tabKP .nav-pills .nav-link h5 {
            color: #d7d6e9;
        }

        .tabKP .nav-pills .nav-link p {
            color: #c3c3c3;
        }

        .tabKP .nav-pills .nav-link p a {
            color: #d7d6e9;
        }

        .tabKP .nav-pills .nav-link.active p a {
            color: #060173;
        }

        .tabKP .nav-pills .nav-link.active p {
            color: #000;
        }

        .tabKP .nav-pills .nav-link.active h5 {
            color: #060173;
        }

        .tabKP .nav-pills .nav-link.active,
        .tabKP .nav-pills .show>.nav-link {
            background-color: transparent !important;
            color: unset !important;
        }

        .tabKP .tabs-navigation__icon-wrap {
            margin-bottom: 8px;
            position: relative;
            width: 82px;
            display: block;
            /* width: 230px; */
            opacity: 0;
            height: 82px;
        }

        .tabKP .nav-pills .nav-link.active .tabs-navigation__icon-wrap {
            border-right: 5px solid #060173;
            opacity: 1;
            z-index: 2;
        }

        /* .tabKP .tabs-navigation__icon-wrap img{
            padding-right: 10px;
            border-right: 5px solid red;
            z-index: 2;
            position: absolute;
            top: 50%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            left: 0;
            right: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            visibility: hidden;
        }
        .tabKP .nav-pills .nav-link.active .tabs-navigation__icon-wrap img{
            opacity: 1;
            visibility: visible;
        } */
        .tabKP .tabs-navigation__icon-wrap img {
            width: 74px;
            height: 74px;
            padding-right: 8px;
        }

        .tabKP .tabs-navigation__content {
            cursor: pointer;
            margin-left: 20px;
        }

        .tabKP .tab-content {
            width: 100%;
            height: 100%;
        }

        /* .tab-pane{width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;} */
        .tabKP .tab-pane {
            position: relative;
            width: 100%;
            height: 100%;
        }

        .tabKP .tab-pane img {
            position: absolute;
            width: 70%;
            height: auto;
            top: 50%;
            left: 50%;
            content: '';
            -webkit-transform: translateY(-50%);
            transform: translate(-50%, -50%);
        }

        .tabKP .tab-content>.active {
            display: flex;
        }

        /* .tabKP .tab-content img{width:70%;margin: auto;} */
        .tabKP .indicator {
            position: absolute;
            content: '';
            background: #dddcec;
            width: 1px;
            height: 100%;
            left: 92px;
            z-index: 1;
        }

        .tabKP:after {
            content: '';
            position: absolute;
            right: 0px;
            top: 50%;
            height: 100%;
            width: 30%;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
            background-color: var(--primary-dark);
            border-top-left-radius: 10px;
            border-bottom-left-radius: 10px;
            z-index: -1;
        }

        .tabKP .mobileAdvanceSoftware {
            display: none;
        }

        @media screen and (min-width: 2000px) {
            .tabKP:after {
                width: 35%;
            }
        }

        @media screen and (max-width: 992px) {

            .tabKP .desktopAdvanceSoftware,
            .tabKP:after {
                display: none;
            }

            .tabKP .mobileAdvanceSoftware {
                display: block;
            }
        }

        @media screen and (max-width: 576px) {
            .tabKP .mobileAdvanceSoftware .accordion-item {
                padding-left: 0;
            }

            .tabKP .mobileAdvanceSoftware .accordion-header {
                border: none;
            }

            .tabKP .mobileAdvanceSoftware .accordion-item .accordion-button {
                box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
                border-top-left-radius: 0;
                border-bottom-left-radius: 0 !important;
                border-top-right-radius: var(--bs-accordion-inner-border-radius);
                border-bottom-right-radius: var(--bs-accordion-inner-border-radius);
            }
        }
    

        .comprehnsiveRight {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%;
        }

        .kplist {
            list-style-type: none;
            width: 100%;
            padding: 0;
        }

        .kplist li {
            margin-top: 15px;
            margin-bottom: 15px;
            width: 400px;
            position: relative;
        }

        .kplist li img {
            width: 100%;
            height: 100%;
        }

        .kplist li:nth-child(1),
        .kplist li:nth-child(5) {
            margin-left: 0;
            height: 78px;
        }

        .kplist li:nth-child(2),
        .kplist li:nth-child(4) {
            margin-left: 15%;
            height: 76px;
        }

        .kplist li:nth-child(3) {
            margin-left: 24%;
            height: 80px;
        }

        .kplist li h6 {
            position: absolute;
            top: 50%;
            left: 50%;
            -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
            margin: 0;
            color: var(--primary-dark);
            font-weight: bold;
            font-size: 17px;
        }

        .comprehnsiveLeft {
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .comprehnsiveLeft img {
            width: 400px;
            height: 400px;
        }

        /* mobile responsive start */
        .mobileComprehensiveimg img {
            width: 300px;
            height: 300px;
        }

        .bsb-timeline-4 {
            --bsb-tl-color: #060173
        }

        .bsb-timeline-4 .timeline>.timeline-item .card-subtitle {
            font-weight: bold;
            color: #060173;
        }

        .bsb-timeline-4 .timeline>.timeline-item.left .card-subtitle {
            text-align: right;
        }

        .bsb-timeline-4 .timeline>.timeline-item {
            width: 50%;
        }

        .bsb-timeline-4 .timeline>.timeline-item.left {
            left: 0;
        }

        .bsb-timeline-4 .timeline>.timeline-item.left:after {
            left: auto;
            right: calc(var(--bsb-tl-circle-offset)* -1);
        }

        .bsb-timeline-4 .timeline>.timeline-item.right {
            left: 50%;
        }

        .bsb-timeline-4 .timeline>.timeline-item.right {
            left: 50%;
        }

        .bsb-timeline-4 .timeline:after {
            left: 50%;
            bottom: 30px;
        }

        .bsb-timeline-4 .timeline .timeline-item::after {
            height: 70px;
            width: 70px;
            top: 50%;
            border: var(--bsb-tl-circle-border-size) solid var(--bsb-tl-circle-border-color);
            border-radius: 50%;
            content: "";
            position: absolute;
            transform: translateY(-50%);
            z-index: 1;
        }

        .bsb-timeline-4 .timeline .timeline-item.right::after {
            left: -35px;
        }

        .bsb-timeline-4 .timeline .timeline-item.left::after {
            right: -35px;
        }

        .bsb-timeline-4 .timeline .timeline-item.cns::after {
            background: url('../creditNotenew.png') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item.awr::after {
            background: url('../images/amountWiseReportMobile.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item.il::after {
            background: url('../images/invoiceListMobile.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item.co::after {
            background: url('../images/customerOutstandingMobile.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item.dwb::after {
            background: url('../images/departmentWiseBillMobile.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item .timeline-indicator:after {
            display: none;
        }

        .bsb-timeline-4 .timeline .timeline-item .timeline-indicator .card {
            background: transparent;
        }

        /* mobile responsive end */

        .mobileComprehensive {
            display: none;
        }

        @media screen and (max-width: 767px) and (min-width: 576px) {
            .bsb-timeline-4 .timeline .timeline-item::after {
                height: 60px;
                width: 60px;
            }

            .bsb-timeline-4 .timeline .timeline-item.right::after {
                left: -30px;
            }

            .bsb-timeline-4 .timeline .timeline-item.left::after {
                right: -30px;
            }

            .bsb-timeline-4 .timeline>.timeline-item.right .timeline-content {
                padding: 1.5rem 0 1.5rem 1.5rem;
            }

            .bsb-timeline-4 .timeline>.timeline-item.left .timeline-content {
                padding: 1.5rem 1.5rem 1.5rem 0;
            }
        }

        @media screen and (max-width: 575px) {
            .bsb-timeline-4 .timeline .timeline-item::after {
                height: 40px;
                width: 40px;
            }

            .bsb-timeline-4 .timeline .timeline-item.right::after {
                left: -20px;
            }

            .bsb-timeline-4 .timeline .timeline-item.left::after {
                right: -20px;
            }

            .bsb-timeline-4 .timeline>.timeline-item.right .timeline-content {
                padding: 0.5rem 0 0.5rem 12px;
            }

            .bsb-timeline-4 .timeline>.timeline-item.left .timeline-content {
                padding: 0.5rem 12px 0.5rem 0;
            }

            .space {
                padding: 0;
            }
        }

        @media screen and (max-width: 1024px) and (min-width: 992px) {
            .kplist li {
                margin-top: 10px;
                margin-bottom: 10px;
                width: 350px;
            }

            .kplist li:nth-child(1),
            .kplist li:nth-child(5) {
                height: 70px;
                width: 340px;
            }

            .kplist li:nth-child(2),
            .kplist li:nth-child(4) {
                height: 68px;
            }

            .kplist li:nth-child(3) {
                margin-left: 24%;
                height: 71px;
            }

            .comprehnsiveLeft img {
                width: 350px;
                height: 350px;
            }

            .kplist li h6 {
                font-size: 15px;
            }
        }

        @media screen and (max-width: 1600px) and (min-width: 1500px) {
            .kplist li {
                width: 480px;
            }

            .kplist li:nth-child(1),
            .kplist li:nth-child(5) {
                height: 91px;
                width: 480px;
            }

            .kplist li:nth-child(2),
            .kplist li:nth-child(4) {
                height: 89px;
            }

            .kplist li:nth-child(3) {
                margin-left: 24%;
                height: 93px;
            }

            .comprehnsiveLeft img {
                width: 450px;
                height: 450px;
            }

            .kplist li h6 {
                font-size: 19px;
            }
        }

        @media screen and (min-width: 1600px) {
            .kplist li {
                width: 550px;
            }

            .kplist li:nth-child(1),
            .kplist li:nth-child(5) {
                height: 101px;
                width: 550px;
            }

            .kplist li:nth-child(2),
            .kplist li:nth-child(4) {
                height: 99px;
            }

            .kplist li:nth-child(3) {
                margin-left: 24%;
                height: 103px;
            }

            .comprehnsiveLeft img {
                width: 500px;
                height: 500px;
            }

            .kplist li h6 {
                font-size: 22px;
            }
        }

        @media screen and (max-width: 992px) {
            .desktopComprehensive {
                display: none;
            }

            .mobileComprehensive {
                display: block;
            }
        }
    

        /* global */
        .solutions-banner .btn-primary,
        .solutions-main .btn-brand {
            padding: 15px 20px;
            text-transform: none;
        }

        .cursor-pointer {
            cursor: pointer;
        }

        .section-title {
            padding-bottom: 60px;
        }

        /* solutions start*/
        .solutions-banner h1,
        .solutions-banner .h1 {
            font-size: clamp(1.75rem, 1.4769rem + 1.165vw, 2.875rem) !important;
            margin-bottom: 20px;
        }

        .solutions-main h2,
        .solutions-main .h2 {
            font-size: clamp(1.375rem, 1.1323rem + 1.0356vw, 2.375rem);
            font-weight: 700 !important;
            line-height: 48px;
            color: var(--secondary-color);
            text-transform: none;
            margin-bottom: 20px;
        }

        /* .solutions-main h3, .solutions-main .h3 {
                font-size: clamp(1.25rem, 1.1893rem + 0.2589vw, 1.5rem);
                font-weight: 700 !important;
                line-height: 30px;
                color: var(--secondary-color);
            } */
        .solutions-main p,
        .solutions-main .p {
            font-size: clamp(1rem, 0.9697rem + 0.1294vw, 1.125rem) !important;
            font-weight: 400 !important;
            line-height: 23px;
        }

        /* solutions end */

        /* btn margin top for hole page where it's needed */
        #vasy-counter .btn-brand {
            margin-top: 60px;
        }

        /* hero banner */
        .carousel-inner {
            padding: 130px 0px 120px 0px;
        }

        .carousel-caption {
            color: var(--secondary-color);
        }

        div#carouselExampleDark .carousel-caption {
            left: 8%;
        }

        .carousel-caption .carousel-caption-wrapper {
            width: 60%;
        }

        /* .carousel-caption h1{
            font-size: clamp(1.75rem, 1.4769rem + 1.165vw, 2.875rem) !important;
            margin-bottom: 20px;
        } */
        .carousel-caption h3 {
            margin-bottom: 70px !important;
        }

        /* erp challange */
        .erp-challanges {
            margin-bottom: 34px;
        }

        /* .erp-challanges .section-title h2 {
            text-transform: capitalize;
            color: var(--secondary-color);
            margin-bottom: 20px;
        } */
        .erp-challanges .section-title {
            padding-bottom: 60px;
        }

        .erp-challanges .section-title h2 {
            margin: 0px;
        }

        .erp-challanges .solutions-list img {
            max-width: 78px;
            margin-bottom: 40px;
        }

        img#challanges-1 {
            width: 100%;
            left: 0px;
            top: 15%;
            z-index: -1;
        }

        .challanges-img {
            text-align: center;
        }

        .challanges-img img {
            max-width: 532px;
        }

        /* title with description */
        /* .title-with-description .section-title h2 {
            font-size: clamp(1.375rem, 1.1323rem + 1.0356vw, 2.375rem);
            font-weight: 700 !important;
            line-height: 48px;
            color: var(--secondary-color);
            text-transform: none;
            margin-bottom: 20px;
        }
        .title-with-description .section-title p {
            font-size: clamp(1rem, 0.9697rem + 0.1294vw, 1.125rem) !important;
            font-weight: 400 !important;
            line-height: 23px;
        } */

        /* solutions features */
        .solutions-features:after {
            background-color: var(--secondary-color);
        }

        /* features */
        .features .solution-box {
            border: 1px solid var(--secondary-color);
        }

        .features .solution-box:hover {
            box-shadow: 0px 0px 5px 1px var(--secondary-color);
        }

        .features .solution-box::before {
            background-color: var(--secondary-color);
        }

        .features .solution-box h4 a {
            color: var(--secondary-color);
        }

        /* tabKP */
        .tabKP:after {
            background-color: var(--secondary-color);
        }

        .tabKP .nav-pills .nav-link.active h5 {
            color: var(--secondary-color);
            font-weight: 700;
        }

        .tabKP .nav-pills .nav-link h5 {
            color: #c3c3c3;
            font-weight: 700;
        }

        .tabKP .nav-pills .nav-link.active .tabs-navigation__icon-wrap {
            border-right: 5px solid var(--secondary-color);
        }

        .tabKP .indicator {
            background: #c3c3c3;
        }

        .accordion-button:not(.collapsed) {
            background-color: var(--secondary-color);
        }

        .accordion-button:not(.collapsed)::after {
            filter: brightness(30);
        }

        .accordion-header {
            border-left: 4px solid var(--secondary-color);
        }

        /* business types slider */
        .business-sliders-solutions .post-img:hover::before {
            background: linear-gradient(360deg, rgb(82 88 90 / 90%) 25%, rgba(255, 255, 255, 0) 100%);
        }

        .business-sliders-solutions .post-img .text-start {
            left: 30px;
            bottom: 30px;
        }

        .text-start i {
            position: absolute;
            right: -27px;
            top: 12px;
            font-size: 13px;
        }

        #business-sliders {
            margin-bottom: 45px;
        }

        div#business-sliders .slick-arrow i {
            border-radius: 2px;
            background-color: var(--secondary-color);
        }

        #business-types .search-box i {
            color: var(--secondary-color);
            border: 2px solid var(--secondary-color);
            background: transparent;
        }

        #business-types .search-box {
            left: 18px;
        }

        #business-types .search-box i {
            color: var(--secondary-color);
            border: 2px solid var(--secondary-color);
            background: transparent;
        }

        /* key features */
        .key-features .section-title {
            padding-bottom: 10px;
        }

        #keyfeatures .carousel-image h4 {
            color: var(--secondary-color);
        }

        /* billing reports */
        .bsb-timeline-4 .timeline .timeline-item.cns::after {
            background: url('../images/creditNoteMobile.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item.awr::after {
            background: url('../images/amountWiseReportMobilenew.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item.il::after {
            background: url('../images/invoiceListMobilenew.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item.co::after {
            background: url('../images/OutstandingMobilenew.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline .timeline-item.dwb::after {
            background: url('../images/departmentWiseBillMobilenew.svg') no-repeat center center;
            background-size: cover;
        }

        .bsb-timeline-4 .timeline>.timeline-item:after {
            border: none;
        }

        .bsb-timeline-4 .timeline>.timeline-item .card-subtitle {
            color: var(--secondary-color);
        }

        .bsb-timeline-4 .timeline:after {
            background-color: var(--secondary-color);
            top: -16px;
        }

        .billing-reports .kplist {
            margin: 0px;
        }

        .kplist li:nth-child(1) {
            margin-top: 0px;
        }

        .kplist li:nth-child(5) {
            margin-bottom: 0px;
        }

        .kplist li h6 {
            color: var(--secondary-color);
        }

        /* integrations */
        .integration-logos {
            border: 1px solid var(--secondary-color);
        }

        .integration-logos::before {
            background-color: var(--secondary-color);
        }

        .integration-logos:hover::before {
            background-color: var(--secondary-color);
        }

        /* Everything One Place Section */
        .key-capabilities.active::before {
            background-color: var(--secondary-color) !important;
        }

        .every div#faq-items .accordion-header .accordion-button {
            background-color: var(--secondary-color);
        }

        div#faq-items .accordion-header {
            border-left: 4px solid var(--secondary-color);
        }

        /* vasy counter */
        #vasy-counter .friend .circle .bg,
        #vasy-counter .ceo .circle .bg {
            background-color: var(--white);
        }

        #vasy-counter .circle .chart {
            color: var(--secondary-color);
        }


        /* whypos */
        .whypos .section-title {
            padding: 0px;
        }

        /* why vasy */
        #why-vasy .about-vasy b,
        .about-vasy p {
            margin-bottom: 20px;
            display: block;
        }

        #why-vasy .section-title {
            padding-bottom: 20px;
        }

        /* cta */
        .background-image {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-image: url('../images/ctabg.webp');
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
        }

        .content {
            position: relative;
            z-index: 1;
        }

        .new-btn-white {
            border: 2px solid #fff;
            color: #fff;
            background-color: transparent;
        }

        .new-btn-white:hover {
            color: #000;
            background-color: #fff;
        }

        /* faqs */
        .faqs .accordion-button.collapsed::after {
            filter: brightness(0.1);
        }

        .accordion-item .accordion-header {
            margin: 0px;
        }

        .accordion-button:focus {
            border-color: black;
            box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.25);
        }

        .accordion-button:not(.collapsed) {
            box-shadow: none;
        }

        /* footer */
        #footer {
            background: var(--secondary-color);
        }

        @media (max-width: 1399px) {

            /* cta */
            .background-image {
                background-image: url(../images/ctabgmobile.webp);
            }
        }

        @media (min-width:992px) and (max-width:1050px) {
            .pos .slick-next {
                right: -20px !important;
            }

            .pos .slick-prev {
                left: -20px !important;
                /* z-index: 1; */
            }
        }

        /* media query min width*/
        @media (min-width: 768px) {

            /* business types slider */
            div#business-sliders .slick-next.slick-arrow {
                left: 52%;
            }
        }

        /* media query max width*/
        @media (max-width: 1600px) {
            .input-box.open {
                right: -100px;
            }
        }

        @media (max-width: 991px) {

            /* global */
            .solutions-banner .btn-primary,
            .solutions-main .btn-brand {
                padding: 10px 15px;
            }

            .section-title {
                padding-bottom: 40px;
            }

            /* solutions strat */
            .solutions-main h2,
            .solutions-main .h2 {
                line-height: 38px;
                margin-bottom: 15px;
            }

            /* solutions end */

            /* hero banner */
            .carousel-inner {
                padding: 100px 0px 60px;
            }

            .carousel-caption .carousel-caption-wrapper {
                width: 90%;
            }

            .carousel-caption h3 {
                margin-bottom: 50px !important;
            }

            div#carouselExampleDark .carousel-caption {
                left: 5%;
            }

            /* youtube video */
            iframe {
                height: 400px;
            }

            /* erp challange */
            .erp-challanges {
                margin-bottom: 20px;
            }

            .erp-challanges .section-title {
                padding-bottom: 40px;
            }

            .erp-challanges .solutions-list img {
                margin-bottom: 25px;
                width: 60px;
            }

            img#challanges-1 {
                display: none;
            }

            /* btn margin top for hole page where it's needed */
            #vasy-counter .btn-brand {
                margin-top: 40px;
            }

            #why-vasy .about-vasy b,
            .about-vasy p {
                margin-bottom: 15px;
            }

            .new-cta-content h3 {
                font-size: 20px;
            }

            .new-cta-content p {
                font-size: 13px !important;
            }
        }

        @media (max-width: 767px) {

            /* global */
            /* .solutions-banner .btn-primary ,.solutions-main .btn-brand {
                padding: 5px 10px;
            } */
            .section-title {
                padding-bottom: 20px;
            }

            /* hero banner */
            .carousel-inner {
                padding: 20px 0px 100px 0px;
            }

            .solutions-banner .carousel-item {
                height: 100vh;
            }

            /* solutions strat */
            .solutions-main h2,
            .solutions-main .h2 {
                line-height: 28px;
                margin-bottom: 10px;
            }

            .solutions-main p,
            .solutions-main .p {
                line-height: 20px;
            }

            /* solutions end */
            .carousel-caption {
                width: 85% !important;
                left: 7% !important;
            }

            .carousel-caption .carousel-caption-wrapper {
                width: 100%;
            }

            div#carouselExampleDark .carousel-caption .carousel-caption-wrapper h3,
            div#carouselExampleDark .carousel-caption .carousel-caption-wrapper h1 {
                margin-bottom: 25px !important;
            }

            div#carouselExampleDark .carousel-caption {
                left: 5%;
            }

            .solutions-banner-mobileitem img {
                position: absolute;
                bottom: 0px
            }

            .solutions-banner-mobileitem img:nth-child(1) {
                z-index: 1;
            }


            /* erp challange */
            /* .erp-challanges .section-title h2{
                margin-bottom: 10px;
            } */
            .erp-challanges .section-title {
                padding-bottom: 20px;
            }

            .erp-challanges .solutions-list {
                display: flex;
                justify-content: center;
                align-items: start;
            }

            .erp-challanges .solutions-list img {
                width: 30px;
                margin-right: 10px;
            }

            .solutions-list {
                margin-bottom: 15px;
                padding-bottom: 15px;
            }

            /* title with description */

            /* .title-with-description .section-title h2 {
                line-height: 28px;
                margin-bottom: 10px;
            } */
            /* .title-with-description .section-title p {
                line-height: 20px;
            } */

            /* business types slider */
            .business-sliders-solutions .post-img .text-start {
                left: 15px;
                bottom: 10px;
            }

            #business-sliders {
                margin-bottom: 25px;
            }

            /* key features */
            div#keyfeatures .slide .carousel-image {
                overflow: auto;
            }

            /* btn margin top for hole page where it's needed */
            #vasy-counter .btn-brand {
                margin-top: 20px;
            }

            /* why vasy */
            .about-vasy p {
                margin-bottom: 15px;
            }

            .about-vasy b {
                font-size: 15px;
            }

            /* cta */
            .new-cta-content {
                text-align: center;
            }

            /* iframe video for mobile */
            .video-overlay iframe {
                height: 75% !important;
            }
        }

        @media (min-width: 360px) and (max-width: 385px) {
            .solutions-banner-mobileitem img {
                bottom: -30px !important;
            }
        }

        @media (max-width: 360px) {
            .carousel-image .solution-box {
                height: 400px;
            }
        }


        /* comparison section start */

        /* .comparison-badge {
            border-color: #e7e6f1 !important;
        }

        .comparison-badge img {
            width: 18px;
            height: 18px;
            object-fit: contain;
        }

        .comparison-badge span {
            display: flex;
            align-items: center;
            justify-content: center;
            line-height: 1;
        } */

        /* Comparison Section Heading */
        #comparison_section .section-title h2 {
            font-size: 40px;
            font-weight: 700;
            line-height: 1.15;
            color: var(--secondary-color);
            margin-bottom: 16px;
        }

        #comparison_section .section-title p {
            align-items: center;
            font-size: 17px !important;
            line-height: 1.7;
            color: #6c757d;
            max-width: 720px;
            margin: 0 auto;
        }

        /* Responsive */
        @media (max-width: 991px) {
            #comparison_section .section-title h2 {
                font-size: 38px;
            }
        }

        @media (max-width: 767px) {
            #comparison_section .section-title h2 {
                font-size: 30px;
                line-height: 1.3;
            }

            #comparison_section .section-title p {
                font-size: 16px;
            }
        }

        /* Comparison Table */

        #comparison_section .comparison-table>:not(caption)>*>* {
            /* background: transparent;
            border-bottom: 1px solid #ebeaf4; */
            padding: 16px 22px;
            vertical-align: middle;
        }

        /* Header */
        #comparison_section .comparison-table thead th {
            font-size: 20px;
            font-weight: 700;
            color: #2b2b2b;
            border-bottom: 1px solid #e1e0ee;
        }

        /* Metrics Column */
        #comparison_section .metric-title {
            font-size: 18px;
            font-weight: 700;
            rgb(0, 0, 0) #2f2f2f;
            min-width: 170px;
        }

        /* Highlighted Vasy Heading */
        #comparison_section .vasy-heading {
            background: linear-gradient(90deg, #060173 0%, #060173 100%);
            color: #fff;
            border-radius: 0 0 18px 18px;

            width: 100%;
            margin: 0 auto 5px;

            padding: 18px 12px;

            text-align: center;
            font-size: 20px;
            font-weight: 700;
        }

        /* Highlighted Vasy Content Pills */
        #comparison_section .vasy-pill {
            background: #faf9fc;
            border: 1px solid #e4e3f0;
            border-radius: 16px;
            padding: 14px 16px;
            font-weight: 500;
            color: black;
        }

        /* Hover Effect */

        #comparison_section .comparison-table tbody tr {
            transition:
                transform 0.15s ease,
                box-shadow 0.15s ease;
        }

        #comparison_section .comparison-table tbody tr td {
            transition: background-color 0.1s ease;
        }

        #comparison_section .comparison-table tbody tr:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 14px #edecf5;
        }

        #comparison_section .comparison-table tbody tr:hover td {
            background-color: #f7f7f7;
        }

        /* Body Text */
        #comparison_section .comparison-table tbody td:not(.metric-title) {
            color: #7a7a7a !important;
            font-size: 14px;
            font-weight: 500;
            /* text-align: center; */
        }

        /* Responsive */
        @media (max-width: 991px) {

            #comparison_section .comparison-table thead th {
                font-size: 18px;
            }

            #comparison_section .comparison-table tbody td {
                font-size: 15px;
            }

            #comparison_section .metric-title {
                min-width: 140px;
            }
        }

        @media (max-width: 767px) {

            #comparison_section .comparison-table>:not(caption)>*>* {
                padding: 18px 14px;
            }

            #comparison_section .comparison-table thead th {
                font-size: 16px;
            }

            #comparison_section .comparison-table tbody td {
                font-size: 14px;
            }

            #comparison_section .vasy-pill {
                padding: 12px;
                border-radius: 14px;
            }
        }

        /* comparison section end */

        /* Card Styling */
        #pos-software .slide {
            height: 100%;
        }

        #pos-software .carousel-image {
            border: 1px solid #ebeaf4;
            box-shadow: 0 4px 18px rgba(0, 0, 0, 0.06);
            transition: all 0.3s ease;
        }

        #pos-software .carousel-image:hover {
            transform: translateY(-4px);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
        }

        /* Title */
        #pos-software h4 {
            font-size: 1.4rem;
            line-height: 1.4;
        }

        /* Description */
        #pos-software p {
            font-size: 1rem;
            line-height: 1.8;
            color: #6c757d;
        }

        /* Slick spacing fix */
        #pos-software .slick-list {
            margin: 0 -12px;
        }

        /* Image top section background */
        #pos-software .carousel-image .image {
            background: #f0eff6;
        }

        /* Optional */
        #pos-software .carousel-image {
            overflow: hidden;
            border-radius: 24px;
        }

        /* Make slick track flex */
        #pos-software .slick-track {
            display: flex !important;
        }

        /* Make every slide equal height */
        #pos-software .slick-slide {
            height: inherit !important;
            display: flex !important;
        }

        /* Make slide wrapper full height */
        #pos-software .slide {
            height: auto;
            display: flex !important;
        }

        /* Actual card */
        #pos-software .carousel-image {
            display: flex;
            flex-direction: column;
            width: 100%;
            height: 100%;
        }

        /* Content grows equally */
        #pos-software .content {
            flex-grow: 1;
        }

        /* Optional cleaner card look */
        #pos-software .carousel-image {
            border: 1px solid #ebeaf4;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
            background: #fff;
        }

        /* Top image section bg */
        #pos-software .carousel-image .image {
            background: #f0eff6;
        }


        /* hero section start */
        .hero-section {
            padding: 120px 0 160px;
            padding-bottom: 0;
            background-image: url("../images/pos/koda-hero-bg.webp");
            background-size: 100% 100%;
            background-position: top center;
            background-repeat: no-repeat;
        }

        /* Vector Group */
        .vector-group {
            position: relative;
            width: 100%;
            max-width: 280px;
            margin: auto;
        }

        /* Vector */
        .vector-image {
            width: 117%;
            height: auto;
            display: block;
        }

        /* Floating Cards */
        .floating-card {
            width: clamp(68px, 5vw, 82px);
            height: clamp(68px, 5vw, 82px);
            background: #fff;
            border-radius: 50%;

            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;

            text-align: center;

            position: absolute;

            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
        }

        /* Icon */
        .floating-icon {
            width: clamp(18px, 1.5vw, 22px);
            margin-bottom: 6px;
        }

        /* Text */
        .floating-text {
            font-size: clamp(9px, 0.7vw, 11px);
            font-weight: 600;
            line-height: 1.3;
        }

        /* LEFT GROUP */
        .vector-group-left .card-one {
            top: -24%;
            left: 17%;
            animation: pulseScale 4s ease-in-out infinite;
            transform-origin: center center;

        }

        .vector-group-left .card-two {
            bottom: -22%;
            right: 21%;
            animation: pulseScale 4s ease-in-out infinite;
            transform-origin: center center;
        }


        /* RIGHT GROUP */
        .vector-group-right .card-one {
            top: -16%;
            right: -14%;

            animation: pulseScale 4s ease-in-out infinite;

            transform-origin: center center;
        }

        @keyframes pulseScale {

            0% {
                transform: scale(1);
            }

            50% {
                transform: scale(1.12);
            }

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

        .vector-group-right .card-two {
            bottom: -14%;
            left: 17%;
            animation: pulseScale 4s ease-in-out infinite;
            transform-origin: center center;
        }

        /* MOBILE FLOATING GROUPS */

        @media (min-width: 576px) and (max-width: 1053px) {

            .vector-image {
                width: 112%;
                height: auto;
                display: block;
            }

            .hero-section {
                padding: 120px 0 160px;
                background-image: url("../images/pos/koda-hero-bg.webp");
                background-size: 100% 100%;
                background-position: top center;
                background-repeat: no-repeat;
            }

            .mobile-floating-groups {
                margin-top: 60px;

                display: flex;
                flex-direction: row;
                align-items: center;
                gap: 70px;
            }

            .mobile-floating-groups .vector-group {
                position: relative;

                width: 100%;
                max-width: 220px;

                display: flex;
                justify-content: center;
            }

            .mobile-floating-groups .vector-image {
                width: 100%;
                height: auto;
            }

            /* Cards */
            .mobile-floating-groups .floating-card {
                width: 72px;
                height: 72px;

                padding: 8px;
            }

            .mobile-floating-groups .floating-icon {
                width: 18px;
                margin-bottom: 4px;
            }

            .mobile-floating-groups .floating-text {
                font-size: 10px;
                line-height: 1.2;
            }

            /* LEFT MOBILE GROUP */

            .mobile-floating-groups .vector-group-left .card-one {
                top: -18%;
                left: 10%;
            }

            .mobile-floating-groups .vector-group-left .card-two {
                bottom: -14%;
                right: 8%;
            }

            /* RIGHT MOBILE GROUP */

            .mobile-floating-groups .vector-group-right .card-one {
                top: -23%;
                right: -8%;
            }

            .mobile-floating-groups .vector-group-right .card-two {
                bottom: -14%;
                left: 8%;
            }

            /* RIGHT GROUP */
            .vector-group-right .card-one {
                top: -16%;
                right: -12%;

                animation: pulseScale 4s ease-in-out infinite;

                transform-origin: center center;
            }
        }

        /* MOBILE (below 576px) */

        @media (max-width: 575.98px) {

            .hero-section {
                padding: 90px 0 120px;
                background-size: cover;
                background-position: center top;
            }

            .mobile-floating-groups {
                margin-top: 50px;

                display: flex;
                flex-direction: row;
                align-items: center;

                gap: 60px;
            }

            .mobile-floating-groups .vector-group {
                position: relative;

                width: 100%;
                max-width: 180px;

                display: flex;
                justify-content: center;
            }

            .mobile-floating-groups .vector-image {
                width: 110%;
                height: auto;
            }

            /* Cards */

            .mobile-floating-groups .floating-card {
                width: 44px;
                height: 44px;

                padding: 4px;
            }

            .mobile-floating-groups .floating-icon {
                width: 10px;
                height: 10px;

                margin-bottom: 2px;

                object-fit: contain;
            }

            .mobile-floating-groups .floating-text {
                font-size: 6px;
                line-height: 1.1;

                font-weight: 600;

                text-align: center;
            }

            /* LEFT GROUP */

            .mobile-floating-groups .vector-group-left .card-one {
                top: -16%;
                left: 8%;
            }

            .mobile-floating-groups .vector-group-left .card-two {
                bottom: -12%;
                right: 6%;
            }

            /* RIGHT GROUP */

            .mobile-floating-groups .vector-group-right .card-one {
                top: -16%;
                right: -6%;
            }

            .mobile-floating-groups .vector-group-right .card-two {
                bottom: -12%;
                left: 6%;
            }
        }

        /* Dashboard Showcase */

        .dashboard-showcase {
            position: relative;
            perspective: 2000px;
        }

        .dashboard-main-image {
            position: relative;
            z-index: 2;

            text-align: center;

            transform-origin: center center;

            will-change: transform;

            animation: dashboardTiltReveal 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
        }

        @keyframes dashboardTiltReveal {

            0% {

                transform:
                    rotateX(16deg) translateY(60px) scale(0.96);

                opacity: 0;
            }

            100% {

                transform:
                    rotateX(0deg) translateY(0) scale(1);

                opacity: 1;
            }
        }

        .dashboard-main-image img {
            width: 100%;
            max-width: 1000px;

            transform: translateZ(0);

            backface-visibility: hidden;

            /* display: block; */
        }

        /* Floating Cards */

        .dashboard-floating-card {
            position: absolute;
            z-index: 3;
        }

        .dashboard-floating-card img {
            height: 100% !important;
            width: 100%;
            display: block;
        }

        /* Card Sizes */

        .floating-card-1,
        .floating-card-2,
        .floating-card-3,
        .floating-card-4 {
            width: 220px;
        }

        /* Positions */

        .floating-card-1 {
            width: 240px;
            height: 28%;
            top: 30%;
            left: -2%;
            /* animation: floatingCardOne 4s ease-in-out infinite; */
        }

        @keyframes floatingCardOne {

            0% {
                transform: translateY(0%);
            }

            50% {
                transform: translateY(-40%);
            }

            100% {
                transform: translateY(0%);
            }
        }

        .animate-floating-card-1 {
            animation:
                floatingCardOne 4s ease-in-out infinite;

            will-change: transform;

            transform: translateZ(0);

            backface-visibility: hidden;
        }

        .floating-card-2 {
            height: 26%;
            width: 20%;
            top: 12%;
            right: -3%;

            /* animation: floatingCardTwo 4s ease-in-out infinite; */
        }

        .animate-floating-card-2 {
            animation:
                floatingCardTwo 4s ease-in-out infinite;

            will-change: transform;

            transform: translateZ(0);

            backface-visibility: hidden;
        }

        @keyframes floatingCardTwo {

            0% {
                transform: translateY(0%);
            }

            50% {
                transform: translateY(-28%);
            }

            100% {
                transform: translateY(0%);
            }
        }

        .floating-card-3 {
            width: 15%;
            height: 16%;
            bottom: 14%;
            left: 1%;
        }

        .animate-floating-card-3 {
            animation:
                floatingCardOne 4s ease-in-out infinite;

            will-change: transform;

            transform: translateZ(0);

            backface-visibility: hidden;
        }

        .floating-card-4 {
            width: 18%;
            height: 25%;
            bottom: 23%;
            right: -1%;

            /* animation: floatingCardFour 4s ease-in-out infinite; */
        }

        .animate-floating-card-4 {
            animation:
                floatingCardFour 4s ease-in-out infinite;

            will-change: transform;

            transform: translateZ(0);

            backface-visibility: hidden;
        }

        @keyframes floatingCardFour {

            0% {
                transform: translateY(0%);
            }

            50% {
                transform: translateY(12%);
            }

            100% {
                transform: translateY(0%);
            }
        }

        @media (min-width: 1599.98px) {
            .floating-card-1 {
                width: 17%;
                height: 29%;
                top: 25%;
                left: 3%;

            }

            .floating-card-3 {
                width: 15%;
                height: 17%;
                bottom: 15%;
                left: 5%;
            }

            .floating-card-2 {
                height: 29%;
                width: 20%;
                top: 12%;
                right: 1%;
            }

            .floating-card-4 {
                width: 18%;
                height: 25%;
                bottom: 22%;
                right: 3%;
            }
        }

        @media (max-width: 1051.98px) {

            .dashboard-showcase {
                margin-top: 90px;
            }

            .dashboard-main-image img {
                max-width: 100%;
            }

            /* Floating Card Base */
            .dashboard-floating-card {
                position: absolute;
            }

            .dashboard-floating-card img {
                width: 100%;
                height: 100%;
                /* object-fit: contain; */
            }

            /* Tablet Sizes + Positions */

            .floating-card-1 {
                width: 25%;
                height: 28%;
                top: 17%;
                left: -5%;
            }

            .floating-card-2 {
                width: 17%;
                height: 19%;
                top: 12%;
                right: -4%;
            }

            .floating-card-3 {
                width: 12%;
                height: 13%;
                bottom: 13%;
                left: -4%;
            }

            .floating-card-4 {
                width: 18%;
                height: 20%;
                bottom: 13%;
                right: -2%;
            }
        }

        @media (max-width: 575.98px) {

            .dashboard-showcase {
                margin-top: 70px;
            }

            .dashboard-main-image img {
                width: 97%;
            }

            /* Floating Cards */

            .dashboard-floating-card {
                position: absolute;
            }

            .dashboard-floating-card img {
                width: 100%;
                height: 100%;
                /* object-fit: contain; */
            }

            /* Mobile Sizes + Positions */

            .floating-card-1 {
                width: 22%;
                height: 28%;
                top: 20%;
                left: 0%;
            }

            .floating-card-2 {
                width: 19%;
                height: 24%;
                top: 12%;
                right: 0%;
            }

            .floating-card-3 {
                width: 12%;
                height: 10%;
                bottom: 25%;
                left: 0%;
            }

            .floating-card-4 {
                width: 18%;
                height: 22%;
                bottom: 14%;
                right: 1%;
            }

        }

        /* Custom Primary Button */

        .btn-custom-primary {
            background: var(--primary-light);
            color: #fff;

            border: 1px solid var(--primary-light);

            font-weight: 600;
        }

        /* Hover */

        .btn-custom-primary:hover {
            background: transparent;
            border-color: var(--primary-light);

            color: var(--primary-light);
        }

        /* Custom outline Primary Button */

        .btn-outline-cstm-primary {
            background: transparent;
            color: var(--primary-dark);

            border: 1px solid var(--primary-dark);

            font-weight: 600;
        }

        /* Hover */

        .btn-outline-cstm-primary:hover {
            background: var(--primary-dark);
            border-color: var(--primary-dark);

            color: white;
        }

        /* hero section ends  */


        html,
        body {
            overflow-x: hidden;
        }
    

        /* Base Section Styling */
        .vasy-feature-section {
            background-color: #ffffff;
        }

        /* Main Heading Adjustments */
        /* .vasy-feature-section .main-heading {
            font-size: 1.6rem;
            color: #1a1a1a;
            line-height: 1.25;
            letter-spacing: -0.02em;
        } */

        .vasy-feature-section .sub-heading {
            font-size: 0.9rem;
            color: #6c757d;
        }

        /* Base Card Styles */
        .feature-card {
            border-radius: 16px;
            border: 1px solid var(--secondary-color);
            /* box-shadow: 0px 0px 5px 1px var(--secondary-color); */
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center;
            overflow: hidden;
            /* box-shadow: 0 4px 20px rgba(0, 0, 0, 0.03); */
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .feature-card:hover {
            transform: translateY(-2px);
            /* box-shadow: 0 8px 25px rgba(0, 0, 0, 0.06); */
        }

        /* WebP Background Images for Cards */
        .card-bg-1 {
            background-image: url('../images/pos/koda-card-bg-light-blue-1.webp');
        }

        .card-bg-2 {
            background-image: url('../images/pos/koda-card-bg-light-blue-2.webp');
        }

        .card-bg-3 {
            background-image: url('../images/pos/koda-card-bg-light-blue-2.webp');
        }

        /* Card Content Typography */
        .card-title {
            font-size: 1.25rem;
            /* color: #060173; */
            line-height: 1.3;
        }

        .card-desc {
            font-size: 0.85rem;
            color: #6b7280;
            line-height: 1.5;
        }

        /* Strict Image Height & Size Constraints */
        .card-image-wrapper {
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .card-main-img {
            width: auto;
            max-width: 100%;
            object-fit: contain;
        }

        /* Full Width Top Card Image sizing */
        .img-top-card {
            max-height: 260px;
        }

        /* Bottom Grid Cards Image sizing */
        .img-bottom-card {
            max-height: 220px;
        }

        /* Large Screens Fine-Tuning */
        @media (min-width: 992px) {
            /* .vasy-feature-section .main-heading {
                font-size: 2rem;
            } */

            .card-title {
                font-size: 1.4rem;
            }

            .card-desc {
                font-size: 0.88rem;
            }

            .card-text {
                max-width: 440px;
            }

            .card-bg-1 .card-text {
                max-width: 400px;
            }

            .img-top-card {
                max-height: 280px;
            }

            .img-bottom-card {
                max-height: 240px;
            }
        }
    
/* Koda-specific content safeguards; source layout and animation remain intact. */
.koda-pos-page .standalone-vasy-stats-value{font-size:clamp(20px,2.2vw,34px)}
.koda-pos-page .koda-interface-note{font-size:12px!important;line-height:1.5;position:relative;z-index:2}
.koda-pos-page .client-new .splide__slide img{width:100%;height:90px;object-fit:contain;padding:12px}
.koda-pos-page .why-vasy-video img{object-fit:contain!important}
.koda-pos-page .key-capabilities:focus-visible,.koda-pos-page .nav-links:focus-visible{outline:3px solid #fdb847;outline-offset:3px}
.koda-pos-page .slick-arrow{cursor:pointer}
.koda-pos-page .btn-custom-primary,.koda-pos-page .new-btn-white{background:#fdb847!important;color:#060173!important;border-color:#fdb847!important}
.koda-pos-page .hero-section{margin-top:0}
.koda-pos-page #faq-items .accordion-button{gap:12px}
.koda-pos-page .standalone-vasy-stats-col svg{overflow:visible}
@media(prefers-reduced-motion:reduce){.koda-pos-page *{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.koda-pos-page main{overflow-x:clip}.koda-pos-page section[id]{scroll-margin-top:95px}
.koda-pos-page .slick-prev,.koda-pos-page .slick-next{border:0}

/* Requested KodaPOS hero simplification; matches the other product pages. */
#kodapos-hero{padding-bottom:100px!important}
#kodapos-hero .col-lg-6 > .d-flex{margin-bottom:40px}
@media(max-width:767.98px){#kodapos-hero{padding-bottom:75px!important}}