:root {
    --h1-size: 64px;
    --h2-size: 48px;
    --h3-size: 24px;
    --h4-size: 28px;
    --h5-size: 20px;
    --h6-size: 18px;
    --h1-line-height: 1.1;
    --h2-line-height: 1.2;
    --h3-line-height: 1.3;
    --h4-line-height: 1.4;
    --h5-line-height: 1.5;
    --h6-line-height: 1.6;
    --h8-line-height: 1.8;
    --white-color: #fff;
    --black-color: #000;
    --primary-color: #ebeef9;
    --secondary-color: #010101;
    --h2-font-3: 56px;
    --h2-font-4: 40px;
    --h3-font-1: 24px;
    --h3-font-2: 20px;
    --h4-font-1: 20px;
    --p-font-1: 20px;
    --p-font-2: 16px;
    --p-font-3: 17px;
    --a-font-1: 16px;
    --a-font-2: 24px
}

a.act-btn.cta-btn {
    color: #fff;
    padding: 15px 25px;
    border-radius: 4px;
    background: #e42527;
    border: 1px solid #e42527;
    font-size: 18px;
    font-family: var(--zf-secondary-medium);
    display: inline-flex;
    gap: 20px;
    opacity: 1;
    visibility: visible;
    line-height: normal;
    text-transform: uppercase
}

.zwc-bottom-wrap .zwc-btn-wrap a {
    background: #e42527;
    border: 1px solid #e42527
}

.txt-lft {
    text-align: left
}

.txt-cntr {
    text-align: center
}

.txt-rght {
    text-align: right
}

.zcol-wrap,.dflx,.zwb-midea-obj,.zwb-btn-set {
    display: flex;
    flex-wrap: wrap
}

.flx-algn-cntr {
    align-items: center
}

.flx-algn-start {
    align-items: flex-start
}

.flx-algn-stretch {
    align-items: stretch
}

.flx-algn-end {
    align-items: flex-end
}

.flx-jstfy-cntr {
    justify-content: center
}

.flx-jstfy-btween {
    justify-content: space-between
}

.flx-jstfy-even {
    justify-content: space-evenly
}

.flx-jstfy-arnd {
    justify-content: space-around
}

.flx-jstfy-start {
    justify-content: flex-start
}

.flx-jstfy-end {
    justify-content: flex-end
}

.zcol-1 {
    max-width: calc(8.33% - 10px);
    flex-basis: calc(8.33% - 10px)
}

.zcol-2 {
    max-width: calc(16.67% - 10px);
    flex-basis: calc(16.67% - 10px)
}

.zcol-3 {
    max-width: calc(25% - 10px);
    flex-basis: calc(25% - 10px)
}

.zcol-4 {
    max-width: calc(33.33% - 10px);
    flex-basis: calc(33.33% - 10px)
}

.zcol-5 {
    max-width: calc(41.67% - 10px);
    flex-basis: calc(41.67% - 10px)
}

.zcol-6 {
    max-width: calc(50% - 10px);
    flex-basis: calc(50% - 10px)
}

.zcol-7 {
    max-width: calc(58.33% - 10px);
    flex-basis: calc(58.33% - 10px)
}

.zcol-8 {
    max-width: calc(66.67% - 10px);
    flex-basis: calc(66.67% - 10px)
}

.zcol-9 {
    max-width: calc(75% - 10px);
    flex-basis: calc(75% - 10px)
}

.zcol-10 {
    max-width: calc(83.33% - 10px);
    flex-basis: calc(83.33% - 10px)
}

.zcol-11 {
    max-width: calc(91.67% - 10px);
    flex-basis: calc(91.67% - 10px)
}

.zcol-12 {
    max-width: calc(100% - 10px);
    flex-basis: calc(100% - 10px)
}

.d-blck,.in-view-desk {
    display: block
}

.in-view-mob {
    display: none
}

.zwc-title {
    margin: 0;
    position: relative
}

.zwc-title h1 {
    font-family: var(--zf-primary-bold)
}

.zwc-title h2 {
    font-family: var(--primaryfont-semibold)
}

.zwc-title h3 {
    font-family: var(--zf-secondary-medium)
}

.zwc-title h4,.zwc-title h5 {
    font-family: var(--zf-primary-regular)
}

.zwc-title h1 {
    font-size: var(--h1-size);
    line-height: var(--h1-line-height);
    letter-spacing: -2.56px;
    margin: 0 0 26px
}

.zwc-title h2 {
    margin: 0 0 10px;
    font-size: var(--h2-size);
    line-height: var(--h1-line-height);
    letter-spacing: -1.68px
}

.zwc-title h3 {
    font-size: var(--h3-size);
    line-height: var(--h2-line-height);
    letter-spacing: -0.8px
}

.zwc-title h4 {
    margin: 0 0 14px;
    font-size: var(--h4-size);
    line-height: var(--h4-line-height)
}

.zwc-title h5 {
    margin: 0 0 12px;
    font-size: var(--h5-size);
    line-height: var(--h5-line-height)
}

.zwc-title h6 {
    margin: 0 0 10px;
    font-size: var(--h6-size);
    line-height: var(--h6-line-height)
}

.zwc-banner-inner.zwc-title p {
    font-size: 18px;
    line-height: var(--h6-line-height);
    letter-spacing: -0.48px
}

.zwc-title p {
    font-size: 18px;
    line-height: var(--h6-line-height);
    letter-spacing: -0.31px;
    color: #000
}

.zw-product-header {
    background: linear-gradient(0,#eef9f3,#eef9f3),radial-gradient(50% 50% at 10% 90%,rgba(9,179,77,0.07) 0,rgba(0,0,0,0) 65%),radial-gradient(70% 60% at 80% 10%,rgba(9,179,77,0.1) 0,rgba(0,0,0,0) 60%);
    box-shadow: unset
}

.zwc-banner-wrap {
    padding: 90px 0 120px;
    background: linear-gradient(0,#eef9f3,#eef9f3),radial-gradient(50% 50% at 10% 90%,rgba(9,179,77,0.07) 0,rgba(0,0,0,0) 65%),radial-gradient(70% 60% at 80% 10%,rgba(9,179,77,0.1) 0,rgba(0,0,0,0) 60%);
    color: #000;
    position: relative
}

.zwc-banner-wrap h1 {
    color: #000
}

.zwc-banner-inner .zwc-lhs {
    margin-bottom: 0
}

.zwc-banner-inner .zwc-lhs p {
    max-width: 480px
}

.zwc-btn-wrap {
    margin-top: 40px
}

.zwc-banner-inner .zwc-rhs {
    position: relative;
    width: 100%
}

.zwc-banner-inner .zwc-rhs .zwc-chart-card {
    width: 100%;
    max-width: 694px;
    margin-left: auto;
    filter: drop-shadow(0 30px 60px rgba(9,179,77,0.12))
}

.zwc-banner-inner .zwc-rhs .zwc-chart-card {
    opacity: 0;
    transform: translateX(30px);
    transition: all .7s ease-in
}

.zwc-banner-inner .zwc-rhs.zwe-om .zwc-chart-card {
    opacity: 1;
    transform: translateX(0)
}

.zwc-banner-inner .zwc-rhs .zwc-live-data {
    position: absolute;
    right: -6%;
    bottom: 14%;
    width: 30%;
    max-width: 206px;
    opacity: 0;
    transition: all .7s ease-in;
    animation: floatY 4s ease-in infinite
}

.zwc-banner-inner .zwc-rhs.zwe-om .zwc-live-data {
    opacity: 1
}

@keyframes floatY {
    0%,100% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-20px)
    }
}

.zwc-fea-list {
    display: flex;
    gap: 24px;
    margin-top: 80px
}

.zwc-fea-deatils {
    flex: 1 1 calc(33.33% - 16px);
    background: #fff;
    border: 1px solid #e6ece9;
    border-radius: 20px;
    padding: 36px 32px;
    box-shadow: 0 12px 34px rgba(0,0,0,0.05);
    border-radius: 20px;
    border: 1px solid #e2eae5;
    background: #FFF
}

.zwc-f_icon {
    position: relative;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    margin-bottom: 26px;
    background-color: #eaf7ef
}

.zwc-f_icon::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 28px;
    height: 28px;
    transform: translate(-50%,-50%);
    background-image: url("//www.zohowebstatic.com/sites/zweb/images/sheet/zia-ai/ai-sprite.svg");
    background-repeat: no-repeat;
    background-size: 197px 28px;
    background-position: 0 0
}

.zwc-fea-deatils:nth-child(1) .zwc-f_icon::before {
    background-position: 1px 0
}

.zwc-fea-deatils:nth-child(2) .zwc-f_icon::before {
    background-position: -28px 0
}

.zwc-fea-deatils:nth-child(3) .zwc-f_icon::before {
    background-position: -56px 0
}

.zwc-fea-deatils h3 {
    font-size: 22px;
    margin: 0 0 14px;
    color: #061a10;
    font-family: var(--primaryfont-semibold);
}

.zwc-fea-deatils p {
    font-size: 18px;
    margin: 0;
    color: #000
}

.zwc-features-wrap {
    max-width: 1920px;
    margin: 0 auto;
    background: #fff;
    padding: 90px 0
}

.zwc-fea-grid {
    display: flex;
    flex-direction: column;
    gap: 90px
}

.zwc-fea-grid .zwc-top-cont p {
    max-width: 490px;
    margin: 0 auto
}

.zwc-box {
    align-items: center
}

.zwc-fea-dulicate .zwc-fea-grid {
    max-width: 1050px;
    margin: 0 auto
}

.zwc-fea-dulicate .zwc-box1 .zwc-rhs .zwc-container-wrapper {
    max-width: 430px
}

.zwc-box .zwc-lhs h3,.zwc-box .zwc-rhs h3 {
    color: #101010;
    font-size: 40px;
    letter-spacing: -0.6px;
    font-family: var(--primaryfont-semibold)
}

.zwc-box .zwc-lhs p,.zwc-box .zwc-rhs p {
    max-width: 508px;
    margin-bottom: 0
}

.zwc-box picture {
    display: block;
    width: 100%
}

.zwc-box picture img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    filter: drop-shadow(2px 4px 6px #eef9f3)
}

.zwc-box.zwc-box1 picture img {
    width: 100%
}

.zwc-box.zwc-box3 picture img {
    width: 100%
}

.zwc-container-wrapper {
    border-radius: 20px;
    border: 1px solid #c4e9d3;
    background: #eef9f3;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 16px;
    width: 100%;
    max-width: 600px
}

.zwc-box .zwc-rhs .zwc-container-wrapper {
    margin: auto
}

.zwc-box .zwc-lhs .zwc-container-wrapper {
    margin-right: auto
}

.zwc-box4 .zwc-container-wrapper {
    max-width: 640px
}

.zwc-box .zwc-lhs,.zwc-box .zwc-rhs {
    margin-bottom: 0
}

.zwc-box .zwc-container-wrapper img,.zwc-box4 .zwc-container-wrapper img {
    opacity: 0;
    transform: translateX(30px);
    transition: all .3s ease-in
}

.zwc-box2 .zwc-container-wrapper img {
    transform: translateX(-30px)
}

.zwc-box .zwc-container-wrapper.zwe-om img {
    opacity: 1;
    transform: translateX(0)
}

.zwc-box2 .zwc-rhs,.zwc-box4 .zwc-rhs {
    padding-left: 80px
}

.zwc-fea-dulicate .zwc-top-cont {
    margin-bottom: 0
}

.zwc-fea-dulicate .zwc-top-cont p {
    max-width: 500px;
    margin: 0 auto
}

.zwc-fea-dulicate .zwc-box .zwc-lhs h3,.zwc-fea-dulicate .zwc-box .zwc-rhs h3 {
    color: #101010;
    margin: 0 0 20px;
    font-size: 40px;
    letter-spacing: -0.6px;
    font-family: var(--primaryfont-semibold)
}

.zwc-fea-dulicate .zwc-box .zwc-lhs p,.zwc-fea-dulicate .zwc-box .zwc-rhs p {
    max-width: 460px;
    margin-bottom: 0
}

.zwc-fea-dulicate .zwc-container-wrapper {
    padding: 40px;
    max-width: 550px
}

.zwc-fea-dulicate .zwc-box picture img {
    width: 100%
}

.zwc-ai-wrap {
    padding: 90px 0;
    position: relative;
    overflow: hidden;
    background-color: #071a10;
    background-image: url("//www.zohowebstatic.com/sites/zweb/images/sheet/zia-ai/ask-zia-bg.png");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    color: #fff
}

.zwc-ai-wrap .zwc-top-cont {
    text-align: center;
    max-width: 640px;
    margin: 0 auto 56px
}

.zwc-ai-wrap .zwc-top-cont h2 {
    font-size: var(--h2-size);
    line-height: 1.1;
    letter-spacing: -1.68px;
    margin: 0 0 18px;
    color: #fff
}

.zwc-ai-wrap .zwc-top-cont p {
    font-size: 20px;
    line-height: 1.6;
    letter-spacing: -0.31px;
    color: #fff;
    max-width: 620px;
    margin: 0 auto
}

.zwc-ai-block {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 300px;
    min-height: 300px;
    max-width: 670px;
    padding: 26px;
    margin: 0 auto;
    border-radius: 20px;
    border: 1px solid rgba(255,255,255,0.09);
    background: rgba(255,255,255,0.04)
}

.zwc-ai-inner {
    position: relative;
    width: 100%;
    height: 100%
}

.zwc-ai-inner::before {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -46px;
    width: 78%;
    height: 120px;
    transform: translateX(-50%);
    background: radial-gradient(ellipse at center,rgba(97,213,122,1) 0,rgba(97,213,122,0) 70%);
    filter: blur(6px);
    opacity: .75;
    z-index: 0
}

.zwc-ai-bot {
    position: absolute;
    top: -18px;
    left: 50%;
    transform: translateX(-50%);
    width: 150px;
    height: auto;
    z-index: 1
}

.zwc-ai-bubble {
    position: absolute;
    top: 6px;
    right: 4px;
    width: 200px;
    height: auto;
    z-index: 3
}

.zwc-ai-ask {
    position: absolute;
    left: 50%;
    bottom: 12px;
    transform: translateX(-50%);
    width: 100%;
    max-width: 470px;
    height: auto;
    z-index: 2
}

.zwc-ai-ask,.zwc-ai-bot,.zwc-ai-bubble {
    opacity: 0;
    transition: opacity .5s ease,transform .5s ease;
    will-change: opacity,transform
}

.zwc-ai-ask {
    transform: translate(-50%,18px)
}

.zwc-ai-bot {
    transform: translate(-50%,18px)
}

.zwc-ai-bubble {
    transform: translateY(-14px)
}

.zwc-ai-inner.zwc-ai-play .zwc-ai-ask,.zwc-ai-inner.zwc-ai-play .zwc-ai-bot {
    opacity: 1;
    transform: translate(-50%,0)
}

.zwc-ai-inner.zwc-ai-play .zwc-ai-bubble {
    opacity: 1;
    transform: translateY(0)
}

.zwc-ai-inner.zwc-ai-play .zwc-ai-ask {
    transition-delay: .05s
}

.zwc-ai-inner.zwc-ai-play .zwc-ai-bot {
    transition-delay: .45s
}

.zwc-ai-inner.zwc-ai-play .zwc-ai-bubble {
    transition-delay: .85s
}

@media(prefers-reduced-motion:reduce) {
    .zwc-ai-ask,.zwc-ai-bot {
        opacity: 1;
        transform: translateX(-50%);
        transition: none
    }

    .zwc-ai-bubble {
        opacity: 1;
        transform: none;
        transition: none
    }
}

.zwc-desktop-wrap {
    padding: 90px 0;
    position: relative;
    overflow: hidden;
    background: radial-gradient(70% 60% at 80% 10%,rgba(9,179,77,0.10) 0,rgba(0,0,0,0.00) 60%),radial-gradient(50% 50% at 10% 90%,rgba(9,179,77,0.07) 0,rgba(0,0,0,0.00) 65%),#eef9f3
}

.zwc-desktop-wrap .zwc-cont-block h2 {
    font-size: var(--h2-size);
    line-height: 1.1;
    letter-spacing: -1.68px;
    max-width: 460px;
    margin: 0 auto 18px
}

.zwc-desktop-wrap .zwc-cont-block p {
    font-size: 20px;
    line-height: var(--h6-line-height);
    letter-spacing: -0.31px;
    color: #000;
    max-width: 460px;
    margin: 0 auto
}

.zwc-desktop-wrap .zwc-cont-block picture {
    display: block;
    width: 100%;
    margin-top: 56px
}

.zwc-desktop-wrap .zwc-cont-block picture img {
    display: block;
    width: 100%;
    max-width: 1050px;
    height: auto;
    margin: 0 auto
}

.zwc-cont-block img {
    opacity: 0;
    transition: all .3s ease-in;
    transform: translateY(20px)
}

.zwc-cont-block.zwe-om img {
    opacity: 1;
    transform: translateY(0)
}

.zwc-bottom-wrap {
    background: linear-gradient(135deg,#09b34d 0,#057731 100%);
    padding: 90px 0;
    color: #fff
}

.zwc-manage-wrap {
    position: relative;
    overflow: hidden;
    padding: 84px 0 50px;
    background-color: #020d07;
    background-image: url("//www.zohowebstatic.com/sites/zweb/images/sheet/zia-ai/tab-bg.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover
}

.zwc-manage-wrap .content-wrap {
    position: relative;
    z-index: 1;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0
}

.zwc-manage-head {
    text-align: center;
    max-width: 560px;
    margin: 0 auto 64px
}

.zwc-manage-head h2 {
    color: #fff;
    margin-bottom: 20px
}

.zwc-manage-head p {
    color: #fff
}

.zwc-manage-tab {
    align-items: center;
    max-width: 1200px;
    margin: auto;
}

.zwc-manage-lhs {
    display: flex;
    flex-direction: column;
    gap: 16px
}

.zwc-tab {
    border: 1px solid rgba(255,255,255,0.08);
    background: rgba(255,255,255,0.02);
    border-radius: 14px;
    padding: 22px 22px;
    cursor: pointer;
    transition: border-color .25s ease,background .25s ease;
    outline: 0;
    max-width: 550px;
    display: grid;
    grid-template-rows: auto 0fr;
    transition: grid-template-rows .35s ease,border-color .25s ease,background .25s ease
}

.zwc-tab:focus-visible {
    border-color: rgba(9,179,77,0.7)
}

.zwc-tab.active {
    background: rgba(23,54,35,0.55);
    border-color: rgba(9,179,77,0.55);
    box-shadow: 0 0 0 1px rgba(9,179,77,0.12) inset;
    grid-template-rows: auto 1fr
}

.zwc-tab-hd {
    display: flex;
    align-items: center;
    gap: 14px
}

.zwc-tab-ic {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.10);
    background: rgba(255,255,255,0.06);
    transition: box-shadow .25s ease,border-color .25s ease,background .25s ease
}

.zwc-tab.active .zwc-tab-ic {
    border-color: transparent;
    background: linear-gradient(135deg,#09b34d 0,#057731 100%);
    box-shadow: 0 0 18px 0 rgba(9,179,77,0.50)
}

.zwc-tab-ic::before {
    content: "";
    width: 26px;
    height: 26px;
    background-image: url("//www.zohowebstatic.com/sites/zweb/images/sheet/zia-ai/ai-sprite.svg");
    background-repeat: no-repeat;
    background-size: 190px
}

.zwc-tab-ic.ic-errors::before {
    background-position: -108px 0
}

.zwc-tab-ic.ic-structure::before {
    background-position: -135px 0
}

.zwc-tab.active .zwc-tab-ic.ic-errors::before {
    background-position: -82px 0
}

.zwc-tab.active .zwc-tab-ic.ic-structure::before {
    background-position: -163px 0
}

.zwc-tab-hd h3 {
    flex: 1 1 auto;
    font-size: 22px;
    color: #fff;
    font-family: var(--zf-primary-semibold);
    letter-spacing: -0.22px;
    margin-bottom: 0
}

.zwc-chevron {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    background: no-repeat center/16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M6 4l4 4-4 4' fill='none' stroke='%237d9a8c' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    transition: transform .25s ease
}

.zwc-tab.active .zwc-chevron {
    transform: rotate(90deg)
}

.zwc-tab p {
    overflow: hidden;
    margin: 0;
    padding-left: 54px;
    color: #fff;
    opacity: 0;
    transition: opacity .3s ease
}

.zwc-tab.active p {
    opacity: 1;
    padding-top: 12px
}

.zwc-tab-img {
    display: none
}

.zwc-visual-col {
    display: flex;
    justify-content: center
}

.zwc-manage-rhs {
    position: relative;
    display: grid;
    width: 100%;
    align-items: center;
    justify-items: center
}

.zwc-glow {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 450px;
    height: 450px;
    flex-shrink: 0;
    border-radius: 471.354px;
    background: linear-gradient(191deg,rgba(8,34,21,0.00) 38.94%,rgba(70,241,158,0.46) 92.06%);
    pointer-events: none;
    z-index: 0
}

.zwc-s_img {
    grid-area: 1 / 1;
    z-index: 1;
    text-align: center;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px) scale(.985);
    transition: opacity .45s ease,transform .45s ease,visibility 0s linear .45s
}

.zwc-s_img.active {
    opacity: 1;
    visibility: visible;
    transform: none;
    z-index: 2;
    transition: opacity .45s ease,transform .45s ease
}

.zwc-s_img .zwc_human {
    width: 100%
}

.zwc-s_img img {
    width: 80%;
    height: auto;
    display: block;
    margin: 0 auto
}

@media(max-width: 1440px) {
    .zw-template-inner .content-wrap {
        width:1140px;
        max-width: 100%
    }

    :root {
        --h1-size: 56px;
        --h2-size: 48px;
        --h3-size: 28px;
        --h4-size: 24px;
        --h5-size: 20px;
        --h6-size: 18px
    }
}

@media(max-width: 1199px) {
    .zw-template-inner .content-wrap {
        width:960px
    }

    :root {
        --h1-size: 44px;
        --h2-size: 36px;
        --h3-size: 28px;
        --h4-size: 20px
    }

    .zwc-title h1 {
        letter-spacing: -1.48px;
        margin: 0 0 16px
    }

    .zcol-md-pad {
        padding: 100px 0
    }

    .d-blck {
        display: inline
    }

    .zwc-title h2 {
        letter-spacing: -1.44px
    }

    .zwc-box2 .zwc-rhs,.zwc-box4 .zwc-rhs {
        padding-left: 60px
    }

    .zwc-fea-deatils h3 {
        font-size: 26px
    }

    .zwc-box .zwc-lhs h3,.zwc-box .zwc-rhs h3,.zwc-fea-dulicate .zwc-box .zwc-lhs h3,.zwc-fea-dulicate .zwc-box .zwc-rhs h3 {
        font-size: 32px
    }
}

@media(max-width: 991px) {
    .zw-template-inner .content-wrap {
        width:95%
    }

    :root {
        --h1-size: 36px;
        --h2-size: 32px;
        --h3-size: 24px;
        --h4-size: 16px;
        --h5-size: 14px;
        --h6-size: 12px
    }

    .zwc-banner-inner.zwc-title p,.zwc-title p {
        font-size: 16px
    }

    .zcol-md-1 {
        max-width: calc(8.33% - 10px);
        flex-basis: calc(8.33% - 10px)
    }

    .zcol-md-2 {
        max-width: calc(16.67% - 10px);
        flex-basis: calc(16.67% - 10px)
    }

    .zcol-md-3 {
        max-width: calc(25% - 10px);
        flex-basis: calc(25% - 10px)
    }

    .zcol-md-4 {
        max-width: calc(33.33% - 10px);
        flex-basis: calc(33.33% - 10px)
    }

    .zcol-md-5 {
        max-width: calc(41.67% - 10px);
        flex-basis: calc(41.67% - 10px)
    }

    .zcol-md-6 {
        max-width: calc(50% - 10px);
        flex-basis: calc(50% - 10px)
    }

    .zcol-md-7 {
        max-width: calc(58.33% - 10px);
        flex-basis: calc(58.33% - 10px)
    }

    .zcol-md-8 {
        max-width: calc(66.67% - 10px);
        flex-basis: calc(66.67% - 10px)
    }

    .zcol-md-9 {
        max-width: calc(75% - 10px);
        flex-basis: calc(75% - 10px)
    }

    .zcol-md-10 {
        max-width: calc(83.33% - 10px);
        flex-basis: calc(83.33% - 10px)
    }

    .zcol-md-11 {
        max-width: calc(91.67% - 10px);
        flex-basis: calc(91.67% - 10px)
    }

    .zcol-md-12 {
        max-width: calc(100% - 10px);
        flex-basis: calc(100% - 10px)
    }

    .act-btn.cta-btn {
        padding: 10px 20px;
        font-size: 16px
    }

    .zwc-title p {
        font-size: 16px
    }

    .zcol-md-pad {
        padding: 60px 0
    }

    .zwc-box .zwc-lhs h2,.zwc-box .zwc-rhs h2 {
        font-size: 24px
    }

    .zwc-fea-dulicate .zwc-box picture img {
        width: 400px
    }

    .zwc-fea-grid {
        gap: 60px
    }

    .zwc-box2 .zwc-rhs,.zwc-box4 .zwc-rhs {
        padding-left: 0
    }

    .zwc-fea-list {
        margin-top: 60px;
        gap: 16px
    }

    .zwc-fea-deatils {
        padding: 28px 24px
    }

    .zwc-fea-deatils h3 {
        font-size: 22px
    }

    .zwc-fea-dulicate .zwc-box .zwc-lhs h3,.zwc-fea-dulicate .zwc-box .zwc-rhs h3 {
        font-size: 32px
    }

    .zwc-fea-dulicate .zwc-box .zwc-lhs p,.zwc-fea-dulicate .zwc-box .zwc-rhs p {
        font-size: 16px
    }

    .zwc-desktop-wrap .zwc-cont-block p {
        font-size: 16px
    }

    .zwc-ai-wrap .zwc-top-cont p {
        font-size: 16px
    }

    .zwc-manage-tab {
        flex-direction: column;
        gap: 32px
    }

    .zwc-manage-tab .zcol-6 {
        width: 100%
    }

    .zwc-visual-col {
        display: none
    }

    .zwc-tab.active .zwc-tab-img {
        display: block;
        margin: 18px auto 0;
        padding-left: 0
    }

    .zwc-tab-visual img {
        max-width: 230px;
        height: auto
    }

    .zwc-box .zwc-lhs h3,.zwc-box .zwc-rhs h3 {
        font-size: 32px
    }

    .zwc-ai-bubble {
        width: 140px
    }

    .zwc-ai-bot {
        width: 120px
    }

    .zwc-ai-ask {
        bottom: 60px;
        max-width: 350px
    }

    .zwc-ai-bubble {
        right: 80px
    }
}

@media(max-width: 767px) {
    .zw-template-inner .content-wrap {
        width:450px
    }

    .zcol-1,.zcol-2,.zcol-3,.zcol-4,.zcol-5,.zcol-6,.zcol-7,.zcol-8,.zcol-9,.zcol-10,.zcol-11,.zcol-12 {
        position: relative;
        flex-basis: calc(100% - 0px);
        max-width: calc(100% - 0px);
        width: 100%
    }

    .in-view-desk {
        display: none
    }

    .in-view-mob {
        display: block
    }

    .zwc-banner-inner {
        flex-direction: column
    }

    .zwc-banner-inner .zwc-lhs {
        text-align: center;
        margin-bottom: 40px
    }

    .zwc-banner-inner .zwc-lhs p {
        margin: 0 auto
    }

    .zwc-banner-inner .zwc-rhs .zwc-chart-card {
        margin: 0 auto
    }

    .zwc-banner-inner .zwc-rhs .zwc-live-data {
        right: 0;
        bottom: 8%
    }

    .zwc-box {
        flex-direction: column;
        gap: 32px
    }

    .zwc-box .zcol-6:has(picture),.zwc-box .zcol-6:has(.mock) {
        order: -1;
        margin-bottom: 22px
    }

    .zwc-box .zwc-lhs,.zwc-box .zwc-rhs {
        text-align: center
    }

    .zwc-box .zwc-lhs p,.zwc-box .zwc-rhs p {
        margin: 0 auto
    }

    .zwc-box .zwc-rhs .zwc-container-wrapper,.zwc-box .zwc-lhs .zwc-container-wrapper {
        margin: 0 auto;
        max-width: 100%;
        padding: 28px
    }

    .zwc-fea-list {
        flex-direction: column;
        gap: 20px
    }

    .zwc-fea-deatils {
        flex: 1 1 100%;
        text-align: center
    }

    .zwc-f_icon {
        margin-left: auto;
        margin-right: auto
    }

    .zwc-fea-deatils p {
        margin: 0 auto
    }

    .zwc-fea-dulicate .zwc-top-cont p {
        margin: 0 auto
    }

    .zwc-fea-dulicate .zwc-box .zwc-lhs p,.zwc-fea-dulicate .zwc-box .zwc-rhs p {
        margin: 0 auto
    }

    .zwc-desktop-wrap .zwc-cont-block picture {
        margin-top: 40px
    }

    .zwc-ai-block {
        max-width: 100%
    }

    .zwc-ai-bubble {
        width: 140px
    }

    .zwc-ai-bot {
        width: 120px
    }

    .zwc-ai-ask {
        bottom: 60px;
        max-width: 350px
    }

    .zwc-btn-wrap {
        margin-top: 24px
    }

    .zwc-ai-bubble {
        right: -20px
    }
}