@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-ExtraboldItalic.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-ExtraboldItalic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-BoldItalic.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-BoldItalic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-Book.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-Book.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-MediumItalic.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-MediumItalic.woff") format("woff");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-LightItalic.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-LightItalic.woff") format("woff");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-BookItalic.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-BookItalic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-Medium.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-Extrabold.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-Extrabold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-Light.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-Bold.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-Thin.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-Thin.woff") format("woff");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-Semibold.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-Semibold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-ThinItalic.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-ThinItalic.woff") format("woff");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/SharpSansTRIAL-SemiboldItalic.woff2") format("woff2"),
        url("../fonts/SharpSansTRIAL-SemiboldItalic.woff") format("woff");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

/* poppins start */

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-BlackItalic.woff2") format("woff2"),
        url("../fonts/Poppins-BlackItalic.woff") format("woff");
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-Bold.woff2") format("woff2"),
        url("../fonts/Poppins-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-Black.woff2") format("woff2"),
        url("../fonts/Poppins-Black.woff") format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-Italic.woff2") format("woff2"),
        url("../fonts/Poppins-Italic.woff") format("woff");
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-ExtraBold.woff2") format("woff2"),
        url("../fonts/Poppins-ExtraBold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-ExtraLightItalic.woff2") format("woff2"),
        url("../fonts/Poppins-ExtraLightItalic.woff") format("woff");
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-ExtraLight.woff2") format("woff2"),
        url("../fonts/Poppins-ExtraLight.woff") format("woff");
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-BoldItalic.woff2") format("woff2"),
        url("../fonts/Poppins-BoldItalic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-Light.woff2") format("woff2"),
        url("../fonts/Poppins-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-MediumItalic.woff2") format("woff2"),
        url("../fonts/Poppins-MediumItalic.woff") format("woff");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-LightItalic.woff2") format("woff2"),
        url("../fonts/Poppins-LightItalic.woff") format("woff");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-Regular.woff2") format("woff2"),
        url("../fonts/Poppins-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-SemiBold.woff2") format("woff2"),
        url("../fonts/Poppins-SemiBold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-SemiBoldItalic.woff2") format("woff2"),
        url("../fonts/Poppins-SemiBoldItalic.woff") format("woff");
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-Thin.woff2") format("woff2"),
        url("../fonts/Poppins-Thin.woff") format("woff");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-Medium.woff2") format("woff2"),
        url("../fonts/Poppins-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-ExtraBoldItalic.woff2") format("woff2"),
        url("../fonts/Poppins-ExtraBoldItalic.woff") format("woff");
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../fonts/Poppins-ThinItalic.woff2") format("woff2"),
        url("../fonts/Poppins-ThinItalic.woff") format("woff");
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

.fontName {
    font-family: "Poppins" !important;
}

/* poppins end */
.headerSec {
    width: 100%;
    margin-block: 10px;
}

.offcanvas-header {
    justify-content: space-between !important;
    padding: 16px !important;
}

.logoImg {
    width: 150px;
}

.logoImg img {
    width: 100%;
    height: 100%;
}

.menuActive {
    font-weight: bold !important;
    color: var(--text_clr_price) !important;
}

.menuSec li {
    padding: 20px 16px;
    cursor: pointer;
}

.menuSec li a {
    color: var(--text_clr_grey1);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    font-family: "Poppins";
}

.menuSec li a:hover {
    transition: var(--transition);
    color: var(--text_clr_price);
}

.navBtn {
    display: flex;
    align-items: center;
    padding: 0;
    margin: 0;
}

.menuSec .navLogBtn a {
    font-weight: 600;
    color: var(--text_clr_white);
    width: fit-content;
    height: 45px;
    border-radius: 6px;
    padding-inline: 30px;
    background: var(--bg-landing2);
}

.navDashBtn a {
    font-weight: 600;
    color: var(--text_clr_white) !important;
    width: fit-content;
    height: 45px;
    border-radius: 6px;
    padding-inline: 30px;
    background: var(--bg-landing2);
}

.navDashBtn a:hover {
    color: var(--text_clr_white);
    transition: var(--transition);
    background: var(--bg-landing2);
}

.menuSec .navLogBtn a:hover {
    color: var(--text_clr_white);
    transition: var(--transition);
    background: var(--bg-landing2);
}

.menuSec .navSignBtn {
    padding: 0;
}

.menuSec .navSignBtn a {
    font-weight: 600;
    color: var(--text_clr_white);
    width: fit-content;
    height: 45px;
    border-radius: 6px;
    padding-inline: 30px;
    background: var(--bg-landing1);
}

.menuSec .navSignBtn a:hover {
    color: var(--text_clr_white);
    transition: var(--transition);
    background: var(--bg-landing1);
}

/* hero sec start */
.heroSec {
    width: 100%;
}

.heroInnerSec {
    width: 100%;
    padding: 40px 0 40px 60px;
    font-family: "Poppins";
    gap: 20px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.heroLeftBox,
.heroRightBox {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
}

.heroLeftBox .heroPara {
    font-size: 12px;
    text-align: start;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--text_clr_black);
}

.heroLeftBox .heroTitle {
    font-size: 45px;
    text-align: start;
    font-weight: 600;
    color: var(--text_clr_black);
    position: relative;
    width: 100%;
}

/* .heroLeftBox .heroTitle::before {
    content: "";
    position: absolute;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../images/home/shape1.webp);
    top: -28px;
    right: 0;
    width: 36px;
    height: 49px;
} */

.heroRightBox {
    width: 100%;
    gap: 20px;
}

.heroRightBox .heroRightPara {
    font-size: 18px;
    text-align: start;
    font-weight: 500;
    color: var(--text_clr_black);
}

.textStart {
    font-size: 18px;
    text-align: start;
    font-weight: 500;
    color: var(--text_clr_black);
}

.pageBtn {
    width: fit-content;
    height: 56px;
    border-radius: 6px;
    background: var(--bg-landing1);
    padding-inline: 20px;
    font-size: 15px;
    line-height: 1;
    font-weight: 600;
    color: var(--text_clr_white);
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.pageBtn:hover {
    color: var(--text_clr_white);
    transition: var(--transition);
    background: var(--bg-landing1);
}

/* .pageBtnTitle {

    font-size: 15px;
    line-height: 1;
    font-weight: 600;
    color: var(--text_clr_white);
    text-transform: uppercase;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}
.pageBtnTitle:hover{
color: var(--text_clr_white);
} */
.pageBtn .arrowIcon {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: var(--bg_clr_white);
}

.pageBtn .arrowIcon i {
    color: var(--text_clr_primary);
    font-size: 13px;
}

/* hero image sec start */
.heroContainer {
    width: 100%;
}

.herobac {
    background: var(--bg_clr_sky8);
    border-radius: 16px;
    padding-inline: 0 !important;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.heroImageSec {
    width: 100%;
    max-width: var(--container-width);
    margin-inline: auto;
    padding-inline-start: 70px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: 30px;
}

/* .heroImageSec::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 502px;
    height: 502px;
    border-radius: 502px;
    background: var(--bg_clr_sky4);
    filter: blur(162px);
    z-index: -1;
} */

.heroImageSec .bannerImg {
    width: 100%;
    height: 100%;
}

.heroImageSec .bannerImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.brand1 {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 18px;
}

.brand1NumBx {
    width: 96px;
    background: var(--bg_clr_white);
    border-radius: 10px;
    box-shadow: var(--shadow3);
    padding: 13px;
}

.brand1NumBx .numPara {
    font-size: 7px;
    font-weight: 600;
    color: var(--text_clr_grey1);
    margin: 0;
}

.brand1NumBx .numTitle {
    font-size: 19px;
    font-weight: 700;
    color: var(--text_clr_grey1);
    padding-block: 6px;
    margin: 0;
}

.brand1NumBx .numBtn {
    font-size: 9px;
    font-weight: 600;
    width: 46px;
    height: 18px;
    border-radius: 10px;
    background: var(--bg_clr_sky4);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: var(--text_clr_green1);
    position: relative;
}

.brand1Img {
    position: absolute;
    top: -70px;
    left: 0;
    width: 140px;
    height: 140px;
}

.brand1Img img {
    width: 100%;
    height: 100%;
}

.brand1ImgBx {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.brand1ImgBx1 {
    width: 115px;
    height: 115px;
    border-radius: 10px;
    background: var(--bg_clr_white);
    box-shadow: var(--shadow3);
    display: flex;
    align-items: center;
    justify-content: center;
}

.brand1ImgBx2 {
    box-shadow: var(--shadow3);
}

.brand1InnerImg .brand1Title {
    font-size: 16px;
    font-weight: 600;
    color: var(--text_clr_grey1);
    padding: 20px 0 0 20px;
}

.brand1InnerImg .brand1InnerImgArrow {
    position: absolute;
    top: 12px;
    right: 12px;
    rotate: 314deg;
}

.brand1InnerImgArrow i {
    color: var(--text_clr_grey1);
}

.brand2 {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 18px;
}

.brand2 .brand2Img {
    margin-block-start: 30px;
    box-shadow: var(--shadow3);
}

.brand2link {
    width: 100%;
    max-width: fit-content;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    background: var(--bg_clr_white);
    min-height: 50px;
    padding-inline: 30px;
    color: var(--text_clr_grey1);
    border-radius: 36px;
    position: absolute;
    bottom: 50px;
    left: -140px;
    font-size: 15px;
}

.brand2link .lockIcon i {
    color: var(--text_clr_grey1);
}

.mobHeroImageSec {
    display: none;
}

/* clientsec start */
.clientSec,
.businessSec {
    width: 100%;
    padding-block-start: 83px;
    text-align: center;
}

.clientInnerSec {
    width: 100%;
    /* max-width: 1229px; */
    border-radius: 16px;
    gap: 36px;
    position: relative;
}

.clientLeftBox {
    width: 100%;
    text-align: start;
    max-width: 380px;
}

.clientTitle {
    font-size: 45px;
    font-weight: 600;
    color: var(--text_clr_black);
    padding-block-end: 32px;
    margin: 0;
}

.businessTitle {
    font-size: 45px;
    font-weight: 600;
    color: var(--text_clr_black);
    padding-block-end: 15px;
    margin: 0;
    text-align: center;
}

.clientPara,
.businessPara {
    font-size: 16px;
    font-weight: 500;
    color: var(--text_clr_black);
    padding-block-end: 20px;
    margin: 0;
}

.clientIconBx {
    width: 100%;
}

.clientIconBx .iconBx {
    width: 100%;
    gap: 8px;
    padding-inline-start: 0;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
}

.clientIcon img {
    width: 100%;
    height: 100%;
}

.iconMain {
    width: 33.3%;
    height: 100%;
    min-height: 190px;
    background: rgb(255, 255, 255);
    background: linear-gradient(90deg,
            rgb(242 249 255) 0%,
            rgba(216, 238, 255, 1) 100%);
    border-radius: 14px;
    padding: 20px;
}

.clientIconBx .iconTextBx {
    /* gap: 15px;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    justify-content: space-between; */
}

.clientCards {
    display: flex;
    -webkit-display: box;
    -moz-display: box;
    -ms-display: flexbox;
    -webkit-display: flex;
    /* flex-wrap: wrap; */
    padding: 0;
    margin: 0;
    gap: 8px;
}

.clientCardsInner {
    /* display: flex;
    padding: 1rem;
    margin-bottom: 2rem; */
    background: rgb(255, 255, 255);
    background: linear-gradient(90deg,
            rgb(239 248 255) 0%,
            rgba(216, 238, 255, 1) 100%);
    border-radius: 14px;
    padding: 20px;
    width: 100%;
}

/* @media (min-width: 40rem) {
    .clientCardsInner {
        width: 50%;
    }
} */
@media (min-width: 56rem) {
    .clientCardsInner {
        width: 33.3%;
    }
}

.clientCardsInner .client-card-item {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    height: 100%;
    justify-content: space-between;
    gap: 10px;
}

/* background-color: #fff;
    width: 100%;
    border-radius: 6px;
    box-shadow: 0 20px 40px -14px rgba(0, 0, 0, 0.25);
    overflow: hidden;
    transition: transform 0.5s;
    -webkit-transition: transform 0.5s; */

/* .clientCardsInner .client-card-item:hover {
    cursor: pointer;
    transform: scale(1.1);
    -webkit-transform: scale(1.1);
} */
/* .clientCardsInner .client-card-item:hover .client-card-image {
    opacity: 1;
} */
.clientCardsInner .client-card-info {
    font-size: 16px;
    font-weight: 500;
    color: var(--text_clr_black);
    margin-block-end: 0;
    text-align: start;
    width: 100%;
}

.iconTitle {
    font-size: 16px;
}

.clientCardsInner .client-card-image {
    width: 50px;
    height: 50px;
}

.clientCardsInner .client-card-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.clientIconBx .iconTextBx .iconTitle {
    font-size: 16px;
    font-weight: 500;
    color: var(--text_clr_black);
    margin-block-end: 0;
    text-align: start;
}

.clientIconBx .iconTextBx .detailIcon {
    width: 41px;
    height: 41px;
    border-radius: 50%;
    background: var(--bg_clr_primary1);
    padding: 12px;
}

.clientIconBx .iconTextBx .detailIcon svg {
    filter: brightness(11);
}

.clientIconBx .iconTextBx .detailIcon img {
    width: 24px;
    height: 24px;
}

.clientRightBox {
    width: 100%;
    max-width: 453px;
    position: relative;
}

.clientRightBox .clientImg {
    width: 100%;
    /* max-width: 453px; */
}

.clientRightBox .clientImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.clientRightBox .clientImg1 {
    width: 100%;
    max-width: 178px;
    position: absolute;
    top: -50px;
    right: -55px;
}

.clientRightBox .clientImg1 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* customersec start */
.customerSec {
    width: 100%;
    padding-block-start: 83px;
    overflow: hidden;
}

.customerInnerSec {
    width: 100%;
    max-width: 1229px;
    font-family: "Poppins";
    gap: 70px;
    position: relative;
    flex-direction: row-reverse;
}

/* .customerInnerSec::after {
    content: "";
    position: absolute;
    bottom: -200px;
    right: 110px;
    opacity: 0.7;
    border-radius: 418px;
    background: var(--bg_clr_sky4);
    filter: blur(162px);
    width: 418px;
    height: 418px;
    z-index: -1;
} */

.customerLeftBox {
    width: 100%;
    position: relative;
}

.customerTitle {
    font-size: 45px;
    font-weight: 600;
    color: var(--text_clr_black);
    padding-block-end: 32px;
}

.customerPara {
    font-size: 16px;
    font-weight: 500;
    color: var(--text_clr_primary);
    padding-block-end: 45px;
}

.customerIconBx {
    width: 100%;
}

.customerIconBx .iconBx {
    gap: 33px;
    padding-inline-start: 0;
    padding-block-end: 50px;
    margin: 0;
}

.customerIconBx .iconTextBx {
    gap: 28px;
}

.customerIconTitle {
    font-size: 16px;
    font-weight: 500;
    color: var(--text_clr_black);
    margin-block-end: 14px;
    background: rgb(216, 238, 255);
    background: linear-gradient(90deg,
            rgba(216, 238, 255, 1) 0%,
            rgba(255, 255, 255, 1) 100%);
    padding: 10px 20px;
    border-radius: 12px;
}

.customerRightBox {
    width: 100%;
    position: relative;
}

.customerRightBox .customerImg {
    width: 100%;
}

.customerRightBox .customerImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* slider sec start */
.sliderSec {
    width: 100%;
    padding-block-start: 83px;
}

.sliderTitle {
    text-align: center;
    font-size: 45px;
    font-weight: 600;
    color: var(--text_clr_black);
    line-height: 1;
    padding-block-end: 30px;
    position: relative;
}

.sliderImgBx {
    width: 100%;
    /* max-width: 385px; */
    border: 1px solid var(--bg_clr_white);
    background: var(--bg_clr_white);
    /* box-shadow: var(--shadow3); */
    height: 100%;
}

.sliderImgBx img {
    width: 100%;
    height: 100%;
    border-radius: 20px;
}

.sliderImgBxInner {
    width: 100%;
    height: 350px;
}

.sliderImgTitleBx {
    padding: 10px;
}

.sliderImgTitleBx .sliderImgTitle {
    font-size: 20px;
    font-weight: 600;
    color: var(--text_clr_black);
    margin: 0;
    text-align: center;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    /* start showing ellipsis when 3rd line is reached */
    white-space: pre-wrap;
}

#carousel1 button.carousel-control-prev {
    top: -133px;
    right: 62px;
    left: inherit;
    background: var(--bg_clr_white);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    box-shadow: var(--shadow1);
    rotate: 180deg;
}

#carousel1 button.carousel-control-next {
    right: 0;
    top: -133px;
    background: var(--bg_clr_white);
    width: 45px;
    height: 45px;
    border-radius: 50%;
    box-shadow: var(--shadow1);
}

#carousel1 button.carousel-control-prev i,
#carousel1 button.carousel-control-next i {
    color: var(--text_clr_primary);
    font-size: 13px;
    font-weight: 900;
}

#carousel1 .carousel-control-next:focus,
#carousel1 .carousel-control-next:hover,
#carousel1 .carousel-control-prev:focus,
#carousel1 .carousel-control-prev:hover {
    opacity: 1 !important;
}

/* growsec start */
.growSec {
    width: 100%;
    margin-block-start: 120px;
    background: var(--bg_clr_primary1);
    height: 605px;
}

.growInnerSec {
    width: 100%;
    font-family: "Poppins";
    position: relative;
    display: flex;
    /* align-items: center; */
    justify-content: space-between;
    height: 605px;
}

.growLeftBox {
    width: 50%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
}

.growTitle {
    font-size: 58px;
    font-weight: 500;
    color: var(--text_clr_white);
    padding-block-end: 36px;
    margin: 0;
    max-width: 402px;
    width: 100%;
}

.footerHighlight {
    color: var(--text_clr_secondary1);
}

.growPara {
    font-size: 20px;
    font-weight: 500;
    color: var(--text_clr_white);
    padding-block-end: 45px;
    margin: 0;
}

.growLeftBox .pageBtn {
    background: var(--bg_clr_primary4);
}

.growLeftBox .pageBtn:hover {
    transition: var(--transition);
    background: var(--text_clr_primary1);
}

.growRightBox {
    position: relative;
    width: 50%;
    align-items: center;
    display: flex;
    justify-content: center;
}

.growRightBox::before {
    position: absolute;
    content: "";
    background: var(--bg_clr_sky5);
    width: 100%;
    height: 100%;
    border-radius: 50%;
    top: 306px;
}

.growImg {
    position: absolute;
    width: 654px;
    height: 638px;
    top: -50px;
}

.growImg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.subscribeBox {
    position: relative;
    top: -30px;
    left: 0;
    width: 100%;
    background: var(--bg-landing2);
    border-radius: 6px;
}

.subscribeBoxInner {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 30px;
}

.subscribeBxInnerItem h2 {
    font-size: 34px;
    color: var(--text_clr_white);
    font-weight: 700;
    text-transform: uppercase;
}

.subscribeBxInnerItem p {
    font-size: 16px;
    color: var(--text_clr_white);
    font-weight: 400;
    line-height: 18px;
    margin-block-end: 0;
}

.subsBtn {
    width: fit-content;
    min-height: 50px;
    border-radius: 3px;
    background: var(--bg-landing1);
    padding-inline: 20px;
    font-size: 15px;
    line-height: 1;
    font-weight: 600;
    color: var(--text_clr_white);
    text-transform: uppercase;
}

.subscribeBxInnerItem {
    width: 380px;
    text-align: start;
}

.subscribeBxInnerItemInput {
    width: calc(100% - 380px);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
}

.subsInput {
    width: 100%;
    min-height: 50px;
    padding-inline-start: 10px;
}

.footerSec {
    width: 100%;
    background: var(--bg-landing3);
    text-align: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-block-start: 83px;
}

.footerInnerSec {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    height: 100%;
    font-family: "Poppins";
    border-block-end: 1px solid var(--bg_clr_grey7);
    padding-block: 20px;
}

.footerMenuItemImg {
    width: 100%;
    max-width: 80px;
    /* margin: 0 auto; */
    margin: inherit;
}

.footerPara {
    font-size: 14px;
    color: var(--text_clr_white);
    padding-block: 34px 93px;
    margin-block: 0;
}

.footerLogoImg {
    width: 100%;
    max-width: 282px;
}

.footerLogoImg img {
    width: 100%;
    height: 100%;
}

.footerMenu {
    width: 100%;
    border-block-start: 1px solid var(--clr_border4);
}

.footerMenuBx {
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: column;
    text-align: start;
    gap: 15px;
}

.footerMenuTitle {
    color: var(--text_clr_white);
    font-size: 20px;
    font-weight: 600;
    margin-block-end: 0;
}

.footerVisaCard a {
    width: 60px;
}

.footerVisaCard a img {
    width: 100%;
    height: 100%;
}

.footerMenuBx ul {
    padding: 0;
    margin: 0;
}

.footerMenuItem a {
    color: var(--text_clr_white);
    font-size: 14px;
    font-weight: 300;
    line-height: 1.7;
}

.footerMenuItem a:hover {
    color: var(--text_clr_green2);
    transition: var(--transition);
}

.footerMenuItemImgVisa {
    border-radius: 4px;
    overflow: hidden;
}

.footerMenuItemImgVisa img {
    width: 100%;
    height: 100%;
}

.copyrightTitle {
    color: var(--text_clr_white);
    font-size: 12px;
    padding-block: 10px;
    margin: 0;
}

.footerMenuTitleBx {
    padding-block-start: 85px;
    display: flex;
    justify-content: end;
    align-items: center;
    flex-direction: column;
}

.footerMenuItemBx {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 0;
    padding-block: 40px;
    gap: 30px;
}

.footerMenuItemBxNav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
    margin: 0;
}

.footerMenuItemBxNav li a {
    color: var(--text_clr_white);
    font-size: 13px;
    font-weight: 600;
}

.footerMenuItemBxNav li a:hover {
    color: var(--text_clr_green2);
    transition: var(--transition);
}

.footerMenuItemSocialBx {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 22px;
    margin: 0;
}

.footerMenuItemSocialBx li a {
    color: var(--text_clr_white);
}

.footerMenuItemSocialBx li a :hover {
    color: var(--text_clr_green2);
    transition: var(--transition);
}

.mobFooterItem {
    display: none;
}

.securedLogo {
    width: 100px;
    display: inline-block;
}

.securedLogo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media only screen and (max-width: 1399px) {
    .heroLeftBox .heroTitle::before {
        right: 10px;
    }
}

@media only screen and (max-width: 1299px) {
    .growRightBox::before {
        width: 100%;
        height: 100%;
        border-radius: 50%;
        top: 266px;
    }

    .growImg {
        position: absolute;
        width: 500px;
        height: 468px;
        bottom: 50%;
        top: 50%;
        transform: translateY(-50%);
    }
}

@media only screen and (max-width: 1199px) {
    .heroLeftBox .heroTitle {
        font-size: 30px;
        margin: 0;
        padding-inline-end: 6px;
    }

    .heroRightBox .heroRightPara {
        margin: 0;
    }

    .brand1 {
        position: absolute;
        bottom: 0;
        left: 0px;
    }

    .brand1 .brand1InnerImg {
        position: relative;
        top: 0;
        right: -60px;
    }

    .brand1NumBx {
        padding: 13px;
        position: absolute;
        z-index: 1;
        top: -45px;
        left: 40px;
    }

    .brand2 {
        position: absolute;
        bottom: 30px;
        right: 0;
    }

    .brand2 .brand2link {
        width: 100%;
        max-width: 234px;
        min-height: 42px;
        padding-inline: 20px;
        position: absolute;
        bottom: 10px;
        right: 131px;
        font-size: 14px;
        gap: 12px;
    }

    .brand1NumBx {
        position: relative;
        z-index: 1;
        top: 30px;
    }

    .clientTitle,
    .sliderTitle,
    .businessTitle {
        font-size: 30px;
        padding-block-end: 20px;
    }

    .clientPara {
        padding-block-end: 25px;
    }

    .customerTitle {
        font-size: 30px;
        padding-block-end: 20px;
        margin: 0;
        font-family: "Poppins" !important;
    }

    .customerIconBx .iconBx {
        gap: 24px;
        padding-block-end: 30px;
    }
}

@media only screen and (max-width: 991px) {
    .btn-close {
        opacity: 1 !important;
        filter: invert(1) !important;
        box-shadow: none !important;
    }

    .menuSec li a,
    .menuSec li a:hover {
        color: var(--text_clr_white);
        font-weight: 400;
    }

    .menuActive {
        color: var(--text_clr_white) !important;
    }

    .menuSec .navLogBtn a {
        font-weight: 600;
        color: var(--text_clr_price);
        width: fit-content;
        height: 45px;
        border-radius: 6px;
        padding-inline: 30px;
        background: var(--bg_clr_white);
    }

    .menuSec .navLogBtn a:hover {
        color: var(--text_clr_price);
        transition: var(--transition);
        background: var(--bg_clr_white);
    }

    .iconMain {
        width: 33.3%;
        min-height: 140px;
    }

    .heroContainer {
        padding-inline: 20px !important;
        flex-direction: column;
    }

    .herobac {
        padding-inline: 20px !important;
        flex-direction: column;
    }

    /* header */
    .navbar-toggler {
        padding: 0 !important;
        border: 0 !important;
    }

    .navbar-toggler:focus {
        box-shadow: none !important;
    }

    .headerSec .menuSec {
        align-items: flex-start !important;
    }

    .headerSec .menuSec li {
        padding: 10px 16px;
        cursor: pointer;
    }

    .navBtn {
        gap: 10px;
        /* padding-inline-start: 10px; */
    }

    .navBtn li {
        padding: 10px 0 !important;
    }

    .navBtn .navDashBtn {
        padding: 10px 16px !important;
    }

    .navBtn .navDashBtn a {
        padding: 0 !important;
        height: inherit;
        background: none;
    }

    .heroInnerSec {
        flex-direction: column;
        gap: 20px;
        padding-inline-start: 0;
        padding-block-start: 50px;
    }

    .heroImageSec {
        padding-inline-start: 0;
    }

    .brand1Img {
        top: -20px;
        left: 0;
    }

    .brand2link {
        left: 0;
    }

    /* client sec */

    .clientRightBox {
        width: 100%;
        max-width: inherit;
    }

    .clientRightBox .clientImg {
        width: 100%;
        height: 330px;
    }

    /* .clientIconBx .iconTextBx .detailIcon {
        width: 34px;
        height: 34px;
    } */

    .clientInnerSec {
        flex-direction: column;
        padding: 0 20px;
    }

    .clientSec {
        padding-block-start: 55px;
    }

    .clientTitle {
        font-size: 29px;
    }

    .clientRightBox .clientImg1 {
        right: 0;
    }

    .customerInnerSec {
        flex-direction: column-reverse;
    }

    .customerSec {
        padding-block-start: 52px;
    }

    .customerLeftBox {
        display: flex;
        flex-direction: column;
        align-items: start;
    }

    .customerIconBx .iconBx {
        gap: 14px;
    }

    .customerInnerSec::after {
        top: 0;
    }

    .customerGraphics2 {
        bottom: 30px;
        left: 37%;
        width: 68px;
        height: 68px;
        padding: 12px;
        border-radius: 11px;
    }

    .customerGraphics3 {
        display: none;
    }

    .footerInnerSec {
        width: 100%;
        flex-wrap: wrap;
        gap: 20px;
        justify-content: flex-start;
    }

    .footerMenuBx {
        width: fit-content;
    }

    /* slider start */
    .sliderSec,
    .businessSec {
        padding-block-start: 52px;
    }

    .sliderTitleBx .sliderPara {
        font-size: 24px;
    }

    .sliderTitleBx .sliderTitle {
        font-size: 30px;
    }

    .sliderImgBxInner {
        width: 100%;
        height: 250px;
    }

    .sliderImgBxInner img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .sliderImgBx {
        width: 100%;
        overflow: hidden;
    }

    .growTitle {
        font-size: 45px;
        padding-block-end: 16px;
    }

    .growPara {
        padding-block-end: 35px;
    }

    /* .sliderImgBx > div {
        display: none;
    }
    .carousel-inner .carousel-item > div:first-child {
        display: block;
    } */

    .footerMenuItemBx,
    .footerMenuItemBxNav,
    .footerMenuItemSocialBx {
        gap: 10px;
    }

    /* heroLeftBox */
    .heroInnerSec .heroLeftBox {
        gap: 8px !important;
    }

    /* heroLeftBox */
    /*     .growInnerSec  */
    .growSec,
    .footerSec {
        height: auto;
        margin-block-start: 52px;
    }

    .growInnerSec {
        flex-direction: column;
        padding-block: 50px;
        height: auto;
        flex-direction: column-reverse;
    }

    .growInnerSec .growLeftBox,
    .growInnerSec .growRightBox {
        width: 100%;
        text-align: start;
    }

    .growInnerSec .growRightBox {
        overflow: hidden;
        margin-block-end: 30px;
    }

    .growInnerSec .growLeftBox .growTitle,
    .growInnerSec .growLeftBox .growPara {
        margin: auto;
        width: 100%;
        max-width: 100%;
    }

    .growInnerSec .growRightBox .growImg {
        transform: none;
        position: relative;
        top: inherit;
        bottom: inherit;
        height: auto;
    }

    .growRightBox::before {
        width: 600px;
        height: 600px;
        top: 50%;
    }

    .subscribeBxInnerItem,
    .subscribeBxInnerItemInput {
        width: 50%;
    }

    .clientLeftBox {
        max-width: inherit;
        width: 100%;
    }

    .subscribeBxInnerItem h2 {
        font-size: 24px;
    }

    .subscribeBxInnerItem p {
        font-size: 14px;
    }
}

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

    /* mobile header start */
    /* .heroContainer {
        display: none;
    } */
    .clientCards {
        flex-wrap: wrap;
    }

    .logoImg {
        width: 100px;
    }

    .footerMenuItemImg {
        margin: inherit;
    }

    /* .footerMenuBx {
        width: fit-content;
    } */
    .customerTitle,
    .growTitle,
    .heroTitle,
    .clientTitle,
    .sliderTitle,
    .businessTitle,
    .title,
    .customItemTitle {
        font-size: 25px !important;
        line-height: 28px !important;
    }

    .headColor {
        color: var(--text_clr_black);
        font-family: "Poppins";
        margin: 0;
    }

    .mobHeroImageSec {
        display: block;
        padding-inline: 20px;
    }

    .mobHeroImageSec {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 15px;
        font-family: "Poppins";
        padding-block-start: 50px;
    }

    .mobHeroImageSec::before {
        content: "";
        position: absolute;
        bottom: -160px;
        right: 0;
        width: 502px;
        height: 502px;
        border-radius: 502px;
        background: var(--bg_clr_sky4);
        filter: blur(162px);
        z-index: -1;
    }

    .mobHeroImageSec .bannerImg {
        width: 100%;
        max-width: 905px;
    }

    .mobHeroImageSec .bannerImg img {
        width: 100%;
        height: 100%;
    }

    .mobHeroBarndInner {
        display: flex;
        gap: 15px;
    }

    .mobHeroImageSec .brand1 {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
        position: inherit;
        width: 40%;
    }

    .mobHeroImageSec .brand1NumBx {
        width: 100%;
        background: var(--bg_clr_white);
        border-radius: 10px;
        box-shadow: var(--shadow3);
        padding: 13px;
        position: inherit;
    }

    .mobHeroImageSec .brand1NumBx .numPara {
        font-size: 7px;
        font-weight: 600;
        color: var(--text_clr_grey1);
        margin: 0;
    }

    .mobHeroImageSec .brand1NumBx .numTitle {
        font-size: 19px;
        font-weight: 700;
        color: var(--text_clr_grey1);
        padding-block: 6px;
        margin: 0;
    }

    .mobHeroImageSec .brand1NumBx .numBtn {
        font-size: 9px;
        font-weight: 600;
        width: 46px;
        height: 18px;
        border-radius: 10px;
        background: var(--bg_clr_sky4);
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 5px;
        color: var(--text_clr_green1);
        position: relative;
    }

    .mobHeroImageSec .brand1 .brand1InnerImg {
        width: 100%;
        max-width: 243px;
        border-radius: 10px;
        background: var(--bg_clr_white);
        box-shadow: var(--shadow3);
        margin-block-start: 30px;
        position: relative;
    }

    .mobHeroImageSec .band1Img {
        width: 100%;
    }

    .mobHeroImageSec .band1Img img {
        width: 100%;
        height: 100%;
    }

    .mobHeroImageSec .brand1ImgBx {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
    }

    .mobHeroImageSec .brand2ImgBx1 {
        width: 115px;
        height: 115px;
        border-radius: 10px;
        background: var(--bg_clr_white);
        box-shadow: var(--shadow3);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .mobHeroImageSec .brand2 {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
        position: inherit;
        width: 80%;
    }

    .mobHeroImageSec .brand2ImgBx {
        display: flex;
        gap: 24px;
    }

    .mobHeroImageSec .brand2InnerImg {
        width: 100%;
        padding: 30px;
        border-radius: 14px;
        background: var(--bg_clr_white);
        box-shadow: var(--shadow3);
        position: relative;
        overflow: hidden;
    }

    .mobHeroImageSec .brand2InnerImg .brand2Title {
        font-size: 16px;
        font-weight: 600;
        color: var(--text_clr_grey1);
    }

    .mobHeroImageSec .brand2InnerImg .brand2InnerImgArrow {
        position: absolute;
        top: 12px;
        right: 12px;
        rotate: 314deg;
    }

    .mobHeroImageSec .brand2InnerImgArrow i {
        color: var(--text_clr_grey1);
    }

    .mobHeroImageSec .brand2Img {
        width: 100%;
        max-width: 200px;
        margin-inline: auto;
    }

    .mobHeroImageSec .brand2Img img {
        width: 100%;
        height: 100%;
    }

    .mobHeroImageSec .brand2 .brand2Img {
        margin-block-start: 0;
        box-shadow: none;
    }

    .mobHeroImageSec .brand2 .brand2link {
        width: 100%;
        max-width: fit-content;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 0;
        background: var(--bg_clr_white);
        min-height: 39px;
        padding-inline: 20px;
        color: var(--text_clr_grey1);
        border-radius: 36px;
        position: absolute;
        bottom: 18px;
        right: 18px;
        font-size: 14px;
    }

    .mobHeroImageSec .brand2 .brand2link .lockIcon i {
        color: var(--text_clr_grey1);
        display: none;
    }

    #offcanvasNavbar {
        width: 100%;
        max-width: 300px;
    }

    /* customer sec */
    .customerGraphics2 {
        bottom: 30px;
        left: 33%;
    }

    /* slider sec */
    .sliderTitleBx .sliderTitle::before {
        display: none;
    }

    /* footer */
    .footerSec {
        height: inherit;
        /* padding-block: 40px; */
    }

    .footerInnerSec {
        align-items: flex-start;
    }

    .footerMenuItemBx {
        display: none;
    }

    .footerMenuItemBxNav {
        flex-direction: column;
        align-items: flex-start;
        padding-inline-start: 0;
    }

    .footerMenuItemSocialBx {
        padding-inline-start: 0;
    }

    .footerMenuBx {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
        padding-block-end: 20px;
    }

    .footerMenuItemBx {
        padding-block: 20px 0;
    }

    .footerLogoImg {
        max-width: 180px;
    }

    .footerMenuTitleBx {
        padding-block: 0;
        align-items: flex-start;
    }

    .footerPara {
        padding-block: 20px;
        text-align: start;
    }

    .footerMenu {
        border: none;
    }

    .mobFooterItem {
        display: block;
        text-align: start;
        padding-block-start: 20px;
    }

    .mobFooterItem a {
        color: var(--text_clr_white);
        font-size: 13px;
    }

    .mobFooterItem a:hover {
        color: var(--text_clr_green2);
        transition: var(--transition);
    }

    /* .growRightBox */
    .growRightBox::before {
        width: 500px;
        height: 500px;
        top: 50%;
    }

    .growTitle {
        font-size: 32px;
    }

    .growPara {
        font-size: 16px;
    }

    .subscribeBoxInner {
        flex-direction: column;
        justify-content: start;
        width: 100%;
        align-items: center;
    }

    .subscribeBxInnerItem {
        text-align: center;
    }

    .subscribeBxInnerItem,
    .subscribeBxInnerItemInput {
        width: 100%;
    }
}

@media only screen and (max-width: 640px) {
    .subscribeBoxInner {
        flex-direction: column;
    }

    .subscribeBxInnerItem,
    .subscribeBxInnerItemInput {
        width: 100%;
    }

    .footerInnerSec {
        width: 100%;
        flex-direction: column;
        gap: 20px;
        justify-content: flex-start;
    }
}

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

    .heroLeftBox,
    .heroTitle,
    .heroRightPara,
    .pageBtn,
    .client-card-item,
    .iconTitle,
    .iconBx,
    .headColor {
        text-align: center !important;
        align-items: center !important;
        margin: 0 auto;
    }

    .clientLeftBox,
    .customerTitle,
    .subscribeBxInnerItem {
        text-align: center;
    }

    .growRightBox::before {
        width: 100%;
        height: 100%;
        top: 50%;
    }

    .growSec {
        height: auto;
        margin-block-start: 30px;
    }

    .headerSec,
    .footerInnerSec {
        align-items: flex-start;
        padding-inline: 20px;
    }

    .heroInnerSec {
        padding: 20px;
    }

    .customerInnerSec,
    .sliderSec,
    .growInnerSec {
        padding-inline: 20px;
    }

    .clientIconBx .iconBx {
        flex-wrap: wrap;
    }

    /* .clientIconBx .iconTextBx {
        width: calc(50% - 8px);
    } */
    .brand1Img {
        /* top: -40px; */
        width: 80px;
        height: 80px;
    }

    .brand2link {
        /* max-width: 270px; */
        min-height: 30px;
        padding-inline: 15px;
        bottom: 30px;
        font-size: 11px;
        gap: 10px;
    }

    .iconMain {
        width: calc(50% - 8px);
    }
}

@media only screen and (max-width: 480px) {
    .brand2ImgBx1 {
        width: 77px !important;
        height: 72px !important;
    }

    .brand2ImgBx1 svg {
        width: 40px;
    }

    .brand2ImgBx2 {
        width: 93px;
    }

    .brand2ImgBx2 img {
        width: 100%;
        height: 100%;
    }

    .growInnerSec,
    .customerIconBx .iconTextBx,
    .clientIconBx .iconTextBx {
        gap: 16px;
    }

    #carousel1 button.carousel-control-prev,
    #carousel1 button.carousel-control-next {
        top: -150px;
    }

    .mobHeroImageSec .brand2 .brand2link {
        bottom: 18px;
        right: 18px;
        font-size: 10px;
        min-height: 28px;
        padding-inline: 14px;
    }
}

@media only screen and (max-width: 420px) {
    .clientIconBx .iconTextBx {
        width: 100%;
        min-height: inherit;
    }

    .brand2link {
        padding-inline: 8px;
        font-size: 10px;
        gap: 6px;
    }

    .iconMain {
        width: 100%;
    }

    .clientIconBx .iconBx {
        gap: 12px;
    }

    .subscribeBxInnerItem,
    .subscribeBxInnerItemInput {
        width: 100%;
        flex-direction: column;
    }

    .subsBtn {
        width: 100%;
    }

}