:root{
	--body-bg-img: url(/sites/zweb/images/salesiq/nova/zwc-nova-banner.jpg)no-repeat;
	--bodyMarginTop: -70px;
	--activeClr:#5c278e;
	--spriteImg: url(/sites/zweb/images/salesiq/nova/zwc-nova-sprite.png)no-repeat;
	--bodyBg: url(/sites/zweb/images/salesiq/nova/zwc-nova-bg.jpg)repeat;
}
.zw-template-inner {
    margin-top: var(--bodyMarginTop);
}   
.zw-product-header {
    position: relative;
    z-index: 1;
}

.zw-template-inner p a {
    color: var(--zwc-link-clr);
}
a.act-btn.cta-btn {
    padding: 18px 60px;
    border-radius: 3px;
    background: #fff;
    color: #000;
}
img {
    display: block
}
span.zwc-txt-bg {
    background: #FFF200;
    padding: 0 10px 3px;
    border-radius: 10px;
    display: inline-block;
    color: #000;
}
img.zwc-img-2 {
    position: absolute;
}
.zwc-img-shadow {
    box-shadow: 4px 10px 20px 6px rgba(0, 0, 0, 0.05);
}
.zw-template-inner h1 {
    font-size: 100px;
    line-height: 1.1;
    font-family: var(--zf-primary-light);
    letter-spacing: -1.6px;
}
.zw-template-inner h2 {
    font-size: 42px;
    line-height: 1.1;
    font-family: var(--secondaryfont-bold);
}
.zwc-two-column .zwc-rows {
    display: flex;
    flex-wrap: wrap;
}
.zwc-banner-wrap {
    background: #330000 var(--body-bg-img);
    position: relative;
    padding: 190px 0 500px;
    background-size: cover;
    /* background-attachment: fixed; */
    background-position: center;
    color: #fff;
}
.zwc-banner-content p {
    margin: 30px 0 35px;
    font-size: 18px;
}
.zwc-banner-content {
    text-align: center;
    max-width: 900px;
    margin: 0 auto 80px;
}
.zwc-banner-wrap h1 span {
    display: block;
    font-size: 50px;
    font-family: var(--zf-primary-medium);
}
.zwc-banner-sub {
    position: absolute;
    width: 30%;
    border-radius: 10px;
    right: -10%;
    bottom: 15%;
}
/****** Banner End *****/

/***** Nova Body section ****/

section.zwc-body-wrap {
    background: var(--bodyBg);
    background-size: 390px auto;
    margin-top: -400px;
    color: #fff;
}
.zwc-wrap-title {
    text-align: center;
    max-width: 600px;
    margin: 0 auto 100px;
}
.zwc-body-wrapper {
    background: var(--body-bg-clr);
}
.zwc-feature-inner {
    position: relative;
    overflow: hidden;
}
.zwc-feature-wrap .zwc-feature-inner:nth-child(odd):before {
    content: "";
    background: url(/sites/zweb/images/salesiq/nova/zwc-nova-star.png) no-repeat;
    width: 150px;
    height: 200px;
    position: absolute;
    left: -40px;
    top: 45%;
    z-index: 1;
    background-size: 150px auto;
}
.zwc-feature-wrap .zwc-feature-inner:nth-child(3n):before {
    left: auto;
    right: -40px;
}

.zwc-feature-wrap .content-wrap {
    padding: 80px 0;
}
.zwc-two-column .zwc-rows .zwc-col-1 {
    max-width: calc(var(--col-1) - var(--gap));
    flex: 0 0 calc(var(--col-1) - var(    --gap));
}
.zwc-two-column .zwc-rows .zwc-col-2 {
    max-width: calc(var(--col-2) - var(--gap));
    flex: calc(var(--col-2) - var(--gap));
}
.zwc-full-width .zwc-feature-content {
    max-width: 710px;
    text-align: center;
    margin: 0 auto 50px;
}
.zwc-full-width  .zwc-feature-img {
    max-width: 1090px;
    margin: 0 auto;
}
.zwc-two-column .zwc-rows {
    justify-content: space-between;
    align-items: center;
}
.zwc-two-column:nth-child(2n+2) .zwc-rows {
    flex-direction: row-reverse;
}
.zwc-two-column .zwc-wrap-bg .zwc-rows {
    flex-direction: row;
}
.zwc-rows .content-wrap{
    padding: 150px 0 0;
}
.zwc-rows .content-wrap:last-child {
    padding-bottom: 40px;
}
.zwc-two-column {
    --gap: 20px;
    --col-1: 40%;
    --col-2: 60%;
}
.zwc-feature-img {
    display: grid;
    position: relative;
    align-self: baseline;
}
.zwc-feature-chat-video video {
    display: block;
    border-radius: 10px;
}
.zwc-tabs-content {
    opacity: 0;
    visibility: hidden;
    grid-area: 1/2/1/2;
    transition: all .3s ease;
}
.zwc-tabs-content.active {
    opacity: 1;
    visibility: visible;
}
.zwc-feature-img img {
    border-radius: 10px;
}
.zwc-feature-wrap h2 {
    font-family: var(--primaryfont-bold);
    font-size: 36px;
    line-height: 1.1;
    margin-bottom: 25px;
}
.zwc-feature-img {
    position: relative;
    z-index: 1;
    max-width: 650px;
    margin: 0 0 0 auto;
}
.zwc-two-column:nth-child(2n+2) .zwc-feature-img {
    margin: 0;
}
.zwc-feature-content p+ul {
    margin-top: 30px;
    text-align: left;
}
ul.zwc-tabs li.active {
    background: rgba(255, 168, 160, 1);
    color: #000;
    border-radius: 10px;
}
ul.zwc-tabs li:not(:last-child) {
    /* border-bottom: 1px solid #ffffff; */
}
ul.zwc-tabs li {
    padding: 20px 20px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
}
ul.zwc-tabs {
    max-width: 420px;
}
ul.zwc-tabs li.active:after, ul.zwc-tabs li:not(:first-child):before {
    display: inline-block;
    content: '';
    height: 2px;
    width: 100%;
    position: absolute;
    z-index: 5;
    bottom: 0;
    left: 0;
    border-radius: 20px;
}
@keyframes progress {
    from {
        width: 0
    }

    to {
        width: 100%;
    }
}
ul.zwc-tabs li.active:after {
    animation: progress 10s linear forwards;
    background-color: #ff5454;
}
ul.zwc-tabs li:not(:first-child):before {
    background: #663733;
    width: 99%;
    height: 1px;
}
ul.zwc-tabs li p {
    margin: 0;
}
span.zwc-icon {
    background: var(--spriteImg);
    background-size: 140px auto;
    display: block;
    position: absolute;
    width: 70px;
    height: 70px;
}
/****** Answer-bot-section ****/
.content-wrap.zwc-answer-bot-section {
    max-width: 1100px;
}
.zwc-two-column .zwc-feature-img.zwc-feature-chat-video {
    width: 70%;
    margin: 0 auto;
}
.zwc-two-column .zwc-answer-bot-section .zwc-rows {
    justify-content: space-evenly;
}
.zwc-two-column .zwc-answer-bot-section {
    --col-1: 46%;
    --col-2: 50%;
}

/**** WorkFlow Section ****/
.zwc-workflow-section img.zwc-img-2 {
    position: absolute;
    right: 0%;
    width: 65%;
    bottom: -15%;
}
.zwc-workflow-section .zwc-img-shadow {
    border: 1px solid #EA3F3F;
}
.zwc-workflow-section span.zwc-icon-1 {
    left: -45px;
    top: -40px;
}
.zwc-workflow-section span.zwc-icon-2 {
    background-position: -70px 0;
    right: 10px;
    left: auto;
    top: 20px;
    height: 80px;
}
.zwc-two-column .zwc-workflow-section .zwc-feature-img {
    margin: 0 auto;
    max-width: 540px;
}

/******** Tab Wrap *****/
.content-wrap.zwc-wrap-bg {
    background: radial-gradient(ellipse 61% 78% at 50.7% 50%,#F9E053 0%,#F5CD57 47.6%,#C58D1E 100%);
    color: #000;
    border-radius: 15px;
    margin: 100px auto 50px;
}
.zwc-wrap-bg ul.zwc-tabs li.active {
    background: #fff;
}
.zwc-wrap-bg ul.zwc-tabs li:not(:first-child):before {
    background: rgb(179 150 64);
}
ul.zwc-tabs li:not(:first-child):before {
    top: 0;
    bottom: auto;
}
.zwc-wrap-bg ul.zwc-tabs li.active+li:before,
.zwc-wrap-bg ul.zwc-tabs li.active:before {
    height: 0;
}
.zwc-wrap-title h2 {
    font-size: 45px;
}
.zwc-messages-img img.zwc-img-1 {
    border: 2px solid #000;
    border-radius: 10px;
    margin: 0 0 0 auto;
    width: 90%;
}
.zwc-messages-img img.zwc-img-2 {
    top: 190px;
    width: 60%;
    left: 90px;
}
.zwc-wrap-bg .zwc-rows {
    padding: 0 100px;
}
.zwc-tabs-content.zwc-notifications img {
    max-width: 290px;
    margin: 0 auto;
    border: 3px solid #000;
    border-radius: 30px;
}
.zwc-reply-content img.zwc-img-1 {
    width: 80%;
}
.zwc-reply-content img.zwc-img-2 {
    width: 40%;
    bottom: 0;
    right: 0;
}
.zwc-messaging-channels img.zwc-img-2 {
    width: 30%;
    top: 0;
    right: 0;
}
.zwc-tabs-content.zwc-messaging-channels {
    width: 50%;
    margin-left: 90px;
    margin-top: 60px;
}
.zwc-arrow.zwc-arrow-2 {
    top: 110px;
    right: 33%;
    transform: scale(-1, 1) rotate(-20deg);
    stroke-dasharray: 200;
    stroke-dashoffset: 200;
    position: absolute;
}
svg.zwc-arrow path {
    animation: drawArrow 1s ease-in-out 1s forwards;
}
.zwc-conversation {
    width: 60%;
    margin: 0 auto;
    position: relative;
}
span.zwc-brand-icon {
    width: 50px;
    height: 50px;
    background: #fff;
    border-radius: 10px;
    position: absolute;
    right: 0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.09);
    transition: all 1s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
}
span.zwc-brand-icon:before {
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: 0 0;
    width: 35px;
    height: 35px;
    content: "";
    position: absolute;
}
span.zwc-instagram-icon:before {
    background-image: url(/sites/zweb/images/otherbrandlogos/instagram.svg);
}
span.zwc-brand-icon.zwc-messenger-icon {
    top: 130px;
    right: -30px;
    transform: rotate(-15deg) scale(1);
}
span.zwc-brand-icon.zwc-instagram-icon {
    top: -10px;
    right: -30px;
    transform: rotate(15deg) scale(1);
}
span.zwc-brand-icon.zwc-messenger-icon:before {
    background-image: url(/sites/zweb/images/otherbrandlogos/messenger.svg);
}
span.zwc-brand-icon.zwc-telegram-icon {
    top: 50px;
    left: -30px;
    transform: rotate(-15deg);
}
span.zwc-brand-icon.zwc-telegram-icon:before {
    background-image: url(/sites/zweb/images/otherbrandlogos/telegram.svg);
}
span.zwc-brand-icon.zwc-whatsapp-business-icon {
    top: 410px;
    left: -29px;
    transform: rotate(-15deg) scale(1);
}
span.zwc-brand-icon.zwc-whatsapp-business-icon:before {
    background-image: url(/sites/zweb/images/otherbrandlogos/whatsapp-icon.svg);
}
span.zwc-brand-icon.zwc-line-icon:before {
    background-image: url(/sites/zweb/images/otherbrandlogos/line.png);
}
span.zwc-brand-icon.zwc-line-icon {
    top: 320px;
    right: -29px;
    transform: rotate(15deg) scale(1);
}
span.zwc-brand-icon.zwc-wechat-icon:before {
    background-image: url(/sites/zweb/images/otherbrandlogos/wechat.svg);
}
span.zwc-brand-icon.zwc-wechat-icon {
    top: 230px;
    left: -29px;
    transform: rotate(15deg) scale(1);
}
.zwc-tabs-content.zwc-multiple-business {
    width: 90%;
    margin-left: 100px;
    margin-top: -80px;
}

 @keyframes drawArrow {
    to {
        stroke-dashoffset: 400
    }
}
.zwc-two-column .zwc-seamless-section .zwc-feature-img {
    display: flex;
    gap: 40px;
}
.zwc-seamless-section .zwc-feature-img img.zwc-img-2 {
    position: relative;
}

.zwc-integrate-zlens img.zwc-img-2 {
    top: 120px;
    right: 0;
    width: 50%;
    border: 3px solid #000;
    border-radius: 20px;
}
.zwc-tabs-content.zwc-integrate-zlens {
    padding-right: 100px;
    max-width: 100%;
}

/***** Agent Wrap ****/
.zwc-agent-wrap .zwc-wrap-title {
    max-width: 800px;
}
.apps-download-links-wrap {
    justify-content: center;
}
.zwc-agent-wrap .zwc-tabs-content img {
    width: 53%;
    margin: 0 auto;
}
.zwc-wrap-bg .zwc-rows {
    align-items: flex-start;
}
.zwc-tabs-content.zwc-audi-call-wrap img {
    width: 75%;
    border-bottom: 4px solid #241d38;
    border-radius: 0;
}
/****** CTA Section ******/
.zwc-cta-wrap {
    padding: 0 0 70px;
}
.zwc-cta-wrap .content-wrap {
    background: var(--cta-bg-color);
    padding: 70px 20px;
    text-align: center;
    border-radius: 5px;
}
.zwc-cta-content p {
    font-size: 19px;
}
@media screen and (min-width: 768px) {
    .zwc-feature-img,
	.zwc-icon, .zwc-banner-img,.zwc-banner-sub{
        /* opacity: 0; */
    }
    .middle-animated .zwc-banner-img{
        animation: slideDown .5s ease-out forwards;
    } 
	.middle-animated .zwc-icon{
		animation: scaling 1.2s ease-out 1.7s forwards;
	}	
	.middle-animated .zwc-banner-sub {
	    animation: slideDown .5s ease-out .5s forwards;
	}
    .zwc-feature-template-main .middle-animated.zwc-rows .zwc-feature-img{
        animation: slideRight .5s ease-out forwards;
    }
    .zwc-feature-template-main .middle-animated.zwc-rows:nth-child(2n+2) .zwc-feature-img{
        animation: slideLeft .5s ease-out forwards;
    }
	@keyframes drawArrow {
		to {
		    stroke-dashoffset: 400;
		}
	}
	@keyframes slideDown {
        0% {
            transform: translateY(20px)
        }
        100% {
            opacity: 1;
            transform: translateY(0)
        }
    }
    @keyframes slideRight {
        0% {
            transform: translateX(20px)
        }
        100% {
            opacity: 1;
            transform: translateX(0)
        }
    }
    @keyframes slideLeft {
        0% {
            transform: translateX(-20px)
        }
        100% {
            opacity: 1;
            transform: translateX(0)
        }
    }
	 @keyframes scaling {
        0% {
            transform: scale(0.8)
        }
        100% {
            opacity: 1;
            transform: translateX(1)
        }
    }
}
@media screen and (max-width: 1280px) {
	.zw-template-inner h1 {
	    font-size: 70px;
	}
	.zwc-banner-wrap h1 span {
	    font-size: 36px;
	}
	.zwc-banner-wrap {
	    padding: 130px 0 340px;
	}
	section.zwc-body-wrap {
	    margin-top: -300px;
	}
}
@media screen and (max-width: 1199px) {
	.zw-template-inner h1 {
	    font-size: 60px;
	}
	.zw-template-inner h2 {
	    font-size: 32px;
	}
	section.zwc-body-wrap {
	    margin-top: -150px;
	    background-size: 200px auto;
	}
	.zwc-banner-wrap {
	    padding: 110px 0 180px;
	}
	.zwc-wrap-bg .zwc-rows {
	    padding: 0 50px;
	}
	.zwc-full-width .zwc-feature-img {
	    max-width: 750px;
	}
}
@media screen and (max-width: 1023px) {
	.zw-template-inner h1 {
	    font-size: 50px;
	}
	.zwc-banner-content {
	    text-align: center;
	    margin: 0 auto 30px;
	    max-width: 700px;
	}
	.zwc-two-column,.zwc-two-column .zwc-answer-bot-section {
	    --col-1: 100%;
	    --col-2: 100%;
	    --gap: 0px;
	}
	.zwc-feature-wrap h2 {
	    text-align: center;
	    margin: 0 auto 20px;
	    max-width: 700px;
	}
	.zwc-feature-wrap .content-wrap {
	    padding: 0 0 80px;
	}
	.zwc-feature-wrap h2 {
	    max-width: 660px;
	    padding: 0 10px;
	}
	.zwc-feature-content {
	    text-align: center;
	    max-width: 550px;
	    margin: 0 auto 40px;
	}
	.zwc-tabs-content {
	    opacity: 1;
	    visibility: visible;
	    margin-top: 30px;
	}
	.zwc-tabs-content img {
	    border-radius: 10px;
	}
	.zwc-two-column .zwc-rows {
	    justify-content: center;
	    padding: 0 10px;
	}
	
	ul.zwc-tabs li p {
	    font-size: 24px;
	    font-family: var(--zf-primary-semibold);
	    line-height: 1.2;
	    max-width: 500px;
	    margin: 0 auto;
	}
	ul.zwc-tabs {
	    max-width: 650px;
	    margin: 0 auto;
	}
	ul.zwc-tabs li:not(:first-child):before {
	    display: none;
	}
	ul.zwc-tabs li:not(:last-child) {
	    margin: 0 0 80px;
	}
	span.zwc-icon {
	    display: none;
	}
	.content-wrap.zwc-wrap-bg {
	    padding: 60px 0 10px;
	    margin: 0 auto 70px;
	}
	.zwc-two-column .zwc-feature-img.zwc-feature-chat-video{
		width: 100%;
		max-width: 350px;
	}
	.zwc-messages-img img.zwc-img-1 {
	    margin: 0 auto;
	}
	.zwc-messages-img img.zwc-img-2 {
	    left: 20px;
	    top: 270px;
	    width: 50%;
	}
	.zwc-messaging-channels img.zwc-img-2 {
          top: 80px;
          width: 100px;
          right: 100px;
	}
	.zwc-tabs-content.zwc-messaging-channels {
	    margin-left: 0;
	}
	.zwc-arrow.zwc-arrow-2 {
	    top: 190px;
	    right: 36%;
	    width: 9%;
	}
	.zwc-tabs-content.zwc-multiple-business {
	    margin-top: -30px;
	    margin-left: auto;
	    margin-bottom: -40px;
	}
	.zwc-two-column .zwc-seamless-section .zwc-feature-img {
	    justify-content: center;
	    margin: 0 auto;
	    max-width: 50%;
	    gap: 10px;
	}
	.zwc-integrate-zlens img.zwc-img-2 {
	    top: 190px;
	}
	ul.zwc-tabs li {
	    overflow: visible;
	    padding: 0;
	}
	.zwc-agent-wrap .zwc-wrap-title {
	    max-width: 600px;
	    margin-bottom: 50px;
	}
	.content-wrap.zwc-workflow-section {
	    padding-bottom: 150px;
	}
	span.zwc-brand-icon.zwc-whatsapp-business-icon {
	    top: 310px;
	}
	span.zwc-brand-icon:before {
	    width: 30px;
	    height: 30px;
	}
	.zwc-conversation {
	    width: auto;
	    max-width: 350px;
	}
	span.zwc-brand-icon.zwc-wechat-icon {
	    top: 190px;
	}
	span.zwc-brand-icon.zwc-line-icon {
	    top: 252px;
	}
	.zwc-cta-wrap {
	    padding: 30px 0 60px;
	}
	.zwc-cta-wrap .content-wrap {
	    padding: 0 0 30px;
	}
}
@media screen and (max-width: 767px) {
	.zw-template-inner h1 {
	    font-size: 36px;
	}
	a.act-btn.cta-btn {
	    padding: 15px 20px;
	}
	.content-wrap.zwc-wrap-bg {
	    max-width: 100%;
	    width: 100%;
	    padding: 40px 20px;
	    border-radius: 0;
	}
	.zwc-reply-content img.zwc-img-1 {
	    margin: 0 auto;
	}
	.zwc-feature-wrap .zwc-feature-inner:before,
	.zwc-integrate-zlens img.zwc-img-2,
	.zwc-reply-content img.zwc-img-2 {
	    display: none;
	}
	.zwc-tabs-content.zwc-integrate-zlens {
	    padding: 0;
	}
	.zwc-conversation {
	    max-width: 260px;
	}
	span.zwc-brand-icon {
	    width: 40px;
	    height: 40px;
	}
}
@media screen and (max-width: 480px){
    .zwc-messaging-channels img.zwc-img-2 {
        right: 50px;
        top: 110px;
        width: 80px;
    }
	 .zwc-conversation {
        width: auto;
        max-width: 240px;
    }
}