:root {
  --section-p: clamp(70px, 12vw, 120px);
  --section-m: clamp(40px, 2vw, 60px);
  --sprite: url(/sites/zweb/images/forms/formdesign/zia-sprite.png);
}

.zwc-flex {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: center;
}

.zwc-flx-col {
  flex: 1 0 0px;
}
.zwc-content-area .content-wrap{
  width: 100%;

}
.zwc-content-area .content-wrap:nth-child(2n + 1) {
  padding: clamp(60px, 10vw, 130px) 0;
}

.zwc-flex-row .zwc-flx-col {
  flex: 0 1 50%;
}

.zwc-content-area .content-wrap:nth-child(2n) {
  padding: 0px;
}

.zwc-content-area .content-wrap:nth-child(2n) .zwc-flx-col:nth-child(1) {
  order: 2;
  max-width: 45%;
}
.zwc-content-area .content-wrap:nth-child(2n) .zwc-flx-col:nth-child(2) {
  max-width: 50%;
}

.zwc-content-area .zwc-flex {
  justify-content: center;
  gap: 80px;
  flex-wrap: nowrap;
}

.zw-product-header {
  position: relative;
  z-index: 2;
}

.zwc-main-sec h1 {
  font-size: clamp(32px, 6vw, 80px);
  font-family: var(--zf-primary-semibold);
  line-height: 1.2;
  margin: 0px auto 20px;
  letter-spacing: -1.44px;
}

.zwc-main-sec h2 {
  font-size: clamp(32px, 4vw, 48px);
  font-family: var(--zf-primary-semibold);
  line-height: 1.1;
  margin-bottom: 15px;
  letter-spacing: -1.12px;
}

.zwc-main-sec h3 {
  font-size: clamp(28px, 4vw, 34px);
  font-family: var(--zf-primary-semibold);
  letter-spacing: -0.42px;
  line-height: 1.2;
}

.zwc-main-sec h4 {
  font-size: clamp(18px, 2vw, 24px);
  font-family: var(--zf-primary-semibold);
  letter-spacing: -0.42px;
  margin-bottom: 10px;
  line-height: 1.2;
}

p:last-child {
  margin-bottom: 0px;
}

.zwc-sec-title {
  text-align: center;
}

.zwc-banner-wrap {
  position: relative;
  padding:clamp(50px,6vw,80px) 0 0;
}

.zwc-banner-wrap .content-wrap {
  z-index: 1;
}

.zwc-banner-ctn {
  color: rgb(255, 255, 255);
  text-align: center;
}

.zwc-banner-ctn h1 span.zwc-banner-title {
  display: block;
  font-size: clamp(40px, 5vw, 72px);
  font-family: var(--zf-primary-regular);
}

.zwc-zia-logo {
  display: inline-block;
  width: clamp(50px, 7vw, 90px);
  height: clamp(50px, 9vw, 90px);
  background: url("/sites/zweb/images/producticon/zia-dark.svg") center bottom /
    100% no-repeat;
}

.zwc-banner-ctn h1 .zwc-flex {
  align-items: flex-end;
  justify-content: center;
  gap: 10px;
  margin-bottom: 7px;
}

.zwc-banner-ctn h1 span.zwc-power-text {
  background: linear-gradient(
      266deg,
      rgb(255, 163, 58) -26.41%,
      rgb(255, 216, 86) 4.79%,
      rgb(255, 93, 156) 56.58%,
      rgb(84, 83, 255) 101.21%
    )
    text;
  -webkit-text-fill-color: transparent;
}

.zwc-banner-ctn p {
  font-size: clamp(16px, 2vw, 20px);
}

.zwc-banner-wrap::before {
  content: "";
  width: 100%;
  position: absolute;
  inset: -91px 0px 0px;
  z-index: -1;
  height: calc(100% + 91px);
  background: linear-gradient(
    133deg,
    rgb(0, 0, 0) 2.16%,
    rgb(9, 16, 53) 31.82%,
    rgb(23, 16, 101) 59.47%,
    rgb(24, 67, 151) 87.36%,
    rgb(20, 89, 138) 101.64%,
    rgb(28, 6, 60) 114.76%
  );
}

.zwc-banner-wrap::after {
  content: "";
  position: absolute;
  inset: -80px 0px 0px;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  background-size: 40px 40px;
  background-blend-mode: overlay;
  color: rgb(255, 255, 255);
  justify-content: center;
  align-items: center;
}

.zwc-banner-image {
  max-width: 1000px;
  margin:40px auto 0;
  width: 100%;
  display: block;
}

.zwc-banner-image img {
  display: block;
}

.zwc-banner-fea {
  padding: clamp(50px, 6vw, 90px) 20px;
  border-radius: 10px 10px 0px 0px;
  border-top: 1px solid rgb(74, 66, 174);
  background: linear-gradient(
    rgba(184, 20, 255, 0.02) 0%,
    rgba(255, 89, 0, 0.02) 100%
  );
  box-shadow: rgba(72, 95, 245, 0.25) 0px 34px 250px 0px inset;
}

div.zwc-banner-fea .zwc-flex {
  justify-content: center;
  flex-direction: row;
  margin-top: var(--section-m);
  align-items: inherit;
  gap: 0;
}

.zwc-banner-fea .zwc-sec-title {
  color: rgb(255, 255, 255);
}

.zwc-flx-grid {
  flex: 0 1 48%;
  text-align: left;
  color: rgb(255, 255, 255);
  position: relative;
  padding: 40px 50px;
}
.zwc-flx-grid::before {
  content: "";
  position: absolute;
  right: 0;
  border-right: 1px dashed rgba(255, 255, 255, 0.15);
  right: 0;
  top: 0;
  bottom: 0;
  width: 1px;
}
.zwc-flx-grid::after {
  content: "";
  position: absolute;
  left: 0;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.15);
  right: 0;
  bottom: 0;
  height: 1px;
  width: 100%;
}
.zwc-flx-grid:nth-child(2)::before,
.zwc-flx-grid:nth-child(4)::before {
  display: none;
}
.zwc-flx-grid:nth-child(3)::after,
.zwc-flx-grid:nth-child(4)::after {
  display: none;
}
.zwc-fea-icn {
  width: 68px;
  height: 85px;
  display: block;
  background: var(--sprite) no-repeat 0 0 / 293px;
  margin-right: 15px;
  margin-bottom: 20px;
}
.zwc-flx-grid:nth-child(2) .zwc-fea-icn {
  background-position: -65px 0;
  width: 85px;
}
.zwc-flx-grid:nth-child(3) .zwc-fea-icn {
  background-position: -150px 0;
}
.zwc-flx-grid:nth-child(4) .zwc-fea-icn {
  background-position: -222px 0;
  width: 73px;
}
.zwc-feature-detail {
  padding: var(--section-p) 0px 0 0;
  color: #fff;
  background: #0d0b2d;
}
.zwc-feature-detail .zwc-sec-title {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
.zwc-fea-nav {
  justify-content: center;
  margin-top: var(--section-m);
  position: sticky;
  top: 65px;
  z-index: 2;
  background: #0c0b2d;
  padding: 10px 0;
  gap: 10px;
}
.zwc-fea-nav li a {
  border-radius: 6px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.09);
  color: #fff;
  font-size: 16px;
  padding: 7px 25px;
  font-family: var(--zf-primary-regular);
  display: inline-block;
}
.zwc-fea-nav li a:hover,
.zwc-fea-nav li a.active {
  background: #0083ff;
}
.zwc-fea-image {
  padding: 5px;
  border-radius: 10px;
  background: linear-gradient(180deg, #232373 0%, transparent 84.07%);
}
.zwc-pricing-sign {
  border-radius: 10px 10px 0 0;
  border-top: 1px solid #4a42ae;
  background: linear-gradient(
    180deg,
    rgba(184, 20, 255, 0.02) 0%,
    rgba(255, 89, 0, 0.02) 100%
  );
  box-shadow: 0 34px 250px 0 rgba(72, 95, 245, 0.25) inset;
  margin-top: var(--section-m);
  padding: clamp(50px, 6vw, 90px) 20px clamp(50px, 6vw, 90px) 20px;
  margin-top: var(--section-m);
}
.zwc-testimonial {
  background: #0c0c14;
  padding: var(--section-p) 0;
}
.zwc-testimonial .zwc-sec-title {
  color: #fff;
  margin-bottom: var(--section-m);
}
.zwc-bottom-cta-wrap {
  padding: var(--section-p) 0;
  border-top: 1px solid #131c5b;
  background: linear-gradient(
    133deg,
    #000 2.16%,
    #091035 31.82%,
    #171065 59.47%,
    #184397 87.36%,
    #14598a 101.64%,
    #1c063c 114.76%
  );
  color: #fff;
  text-align: center;
}
.zwc-bottom-cta-wrap h2 {
  font-size: clamp(30px, 4vw, 64px);
  font-family: var(--zf-primary-medium);
}
.zwc-bottom-cta-wrap .content-wrap {
  max-width: 870px;
  margin: 0 auto;
}

.zwc-testi-inside {
  background: #20aa93;
  padding: 4em 4em 6em;
  border-radius: 30px;
  color: #fff;
  align-items: center;
  position: relative;
  max-width: 1050px;
  margin: 0 auto;
  font-family: var(--zf-splfontserif-regular);
}

.zwc-pic {
  width: 170px;
  height: 180px;
  border-radius: 10px;
  overflow: hidden;
  display: block;
  background: #fff;
  margin-bottom: 20px;
}

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

.zwc-pro-name {
  display: block;
  font-family: var(--zf-splfontserif-bold);
  line-height: 1;
  margin-bottom: 5px;
}

.zwc-pro-desc {
  font-size: 14px;
  display: inline-block;
}

.zwc-testi-inside .navigation {
  bottom: 10%;
  top: inherit;
  right: 5%;
}

.zwc-testi-inside .zwc-flex {
  align-items: center;
  flex-wrap: nowrap;
}

.zwc-testi-inside .navigation .slick-arrow::after {
  border-color: transparent;
}

.zwc-testi-inside .navigation .slick-arrow {
  color: #fff;
}

.zwc-testi-inside::after {
  content: "";
  position: absolute;
  right: 60px;
  bottom: -50px;
  border-right: 50px solid #20aa93;
  border-bottom: 50px solid transparent;
}

.zwc-testi-profile {
  max-width: 28%;
  width: 100%;
  position: relative;
  padding-right: 15px;
}

.zwc-testi-profile::before {
  content: "";
  width: 100%;
  height: 20px;
  position: absolute;
  transform: rotate(90deg);
  top: 40%;
  right: -45%;
  z-index: 1;
  clip-path: polygon(
    0 0,
    64px 0,
    59px calc(100% - 1px),
    96px 0px,
    100% 0px,
    100% 1px,
    96px 1px,
    59px 100%,
    58px 100%,
    63px 1px,
    0px 1px
  );
  background: #4ec4b0;
}

.zwc-testi-ctn {
  max-width: 70%;
  width: 100%;
  padding-left: 40px;
}

.zwc-testi-ctn p {
  font-size: clamp(18px, 4vw, 22px);
}

.zwc-testi-inside .slick-arrow {
  width: 55px;
  height: 55px;
  text-align: center;
  margin: 0 5px;
  position: absolute;
  border: 1px solid #000;
  z-index: 2;
  background: #fff;
  border-radius: 50%;
}

.zwc-testi-inside .slick-arrow::before {
  content: "";
  position: absolute;
  left: 13px;
  top: 50%;
  background: url("/sites/zweb/images/forms/home/forms-nav-arrow.svg")
    3px 0 / 24px no-repeat;
  width: 32px;
  height: 17px;
  display: block;
  z-index: 2;
  transform: translateY(-50%);
}

.zwc-testi-inside .slick-prev {
  top: -30%;
  left: inherit;
  right: 70px;
}

.zwc-testi-inside .slick-next {
  top: -30%;
}

.zwc-testi-inside .slick-arrow::after {
  display: none;
}

.zwc-testi-inside .slick-arrow.slick-prev::before {
  transform: rotate(180deg);
  left: 10px;
  top: 32%;
}

button.slick-next.slick-disabled,
button.slick-prev.slick-disabled {
  opacity: 0.3;
}

.zwc-testi-inside .slick-arrow:hover::before {
  background: url("/sites/zweb/images/forms/home/forms-nav-arrow.svg")
    3px 0 / 24px no-repeat;
}

.zwc-testi-inside .slick-prev {
  bottom: 4%;
  left: inherit;
  right: 120px;
  top: inherit;
}

.zwc-testi-inside .slick-next {
  top: inherit;
  bottom: 4%;
  right: 50px;
}

/*Signup button*/

.zwc-page-sign-btn {
  margin-top: 40px;
}
.zwc-page-sign-btn.zwc-lft {
  gap: 10px;
  display: flex;
  align-items: center;
}

.zwc-page-sign-btn a {
  color: #fff;
  background: linear-gradient(90deg, #da051c 50%, #f30f27 0) 100% 100% / 200%
    100%;
  transition: 0.3s ease-in-out;
}

.zwc-bottom-cta-wrap .zwc-page-sign-btn {
  justify-content: center;
  margin-top: 20px;
}

.zwc-page-sign-btn a.cal-demo {
  font-size: 15px;
  font-family: var(--zf-primary-semibold);
  color: #0a55eb;
  position: relative;
  border-radius: 4px;
  border: 2px solid #0a55eb;
  transition: 0.3s ease-in-out;
  text-transform: uppercase;
  background: transparent;
}

.zwc-page-sign-btn a.cal-demo::before {
  background: url("/sites/zweb/images/survey/features/book-demo-play-icon.svg")
    0 0 / cover no-repeat;
}

.zwc-page-sign-btn a {
  margin-top: 0;
  color: #fff;
  padding: 16px 45px 16px 24px;
  border-radius: 4px;
}

.zwc-page-sign-btn a::before {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  width: 20px;
  height: 20px;
  display: block;
  transform: translateY(-50%);
  margin-right: 18px;
  background: url(/sites/zweb/images/survey/solutions/sign-button-arrow.svg)
    0 0 / 100% no-repeat;
}

.zwc-page-sign-btn a:hover {
  background-position: 0 100%;
}

a.zwc-alter-btn {
  position: relative;
  padding-right: 49px;
  font-family: var(--zf-primary-medium);
  text-transform: uppercase;
}
a.zwc-alter-btn::before {
  content: "";
  position: absolute;
  right: 0;
  width: 19px;
  height: 14px;
  top: 28px;
  background: url(/sites/zweb/images/forms/home/forms-nav-arrow.svg) 0 0 / 18px
    no-repeat;
  transition: 0.3s ease-in-out;
  filter: invert(1);
}
a.zwc-alter-btn.zwc-black-bg {
  background: #000;
}
a.zwc-alter-btn.zwc-white-bg {
  background: #fff;
  color: #000;
}
a.zwc-alter-btn.zwc-white-bg::before {
  filter: invert(0);
}
.zwc-smart-scan-image{
    max-width: 37% !important;
}
.zwc-content-area img{
    display: block;
    margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .zwc-testi-inside {
    padding: 3em 20px;
  }
  .zwc-content-area .content-wrap:nth-child(2n) .zwc-flx-col:nth-child(1), .zwc-content-area .content-wrap:nth-child(2n) .zwc-flx-col:nth-child(2){
    max-width:100%
  }
  .zwc-smart-scan-image{
     max-width:100% !important
  }
  .zwc-testi-inside .slick-dots {
    margin-top: 20px;
  }

  .zwc-testi-profile::before {
    display: none;
  }

  .zwc-testi-inside .zwc-flex {
    flex-direction: column;
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
  }

  .zwc-testi-profile {
    border-right: 0;
    margin-bottom: 0;
    max-width: 100%;
    padding-right: 0;
  }

  .zwc-pic {
    margin: 0 auto 20px;
  }

  .zwc-testi-ctn {
    max-width: 100%;
    padding-left: 0;
  }
}

@media screen and (max-width: 480px) {
  .zwc-pic {
    width: 120px;
    height: 120px;
  }
}

@media only screen and (min-width: 767px) {
  .zwc-content-area .zwc-flx-col:nth-child(2) img {
    opacity: 0;
  }

  .zwc-content-area .middle-animated .zwc-flx-col:nth-child(2) img {
    animation: 0.5s ease-in-out 0.3s 1 normal forwards running slideLeft;
  }

  @keyframes slideLeft {
    0% {
      transform: translateY(30px);
      opacity: 0;
    }

    100% {
      transform: translateY(0px);
      opacity: 1;
    }
  }
}

@media only screen and (max-width: 1200px) {
  .zwc-content-area .zwc-flex {
    gap: 40px;
  }
  .zwc-fea-nav {
    top: 0;
  }
}

@media only screen and (max-width: 1024px) {
  div.zwc-banner-fea .zwc-flex {
    flex-direction: column;
    margin-top: 0;
  }
  .zwc-flx-grid {
    max-width: 600px;
    text-align: center;
    margin: 0 auto;
    padding: 35px 0;
  }
  .zwc-fea-icn {
    margin-left: auto;
    margin-right: auto;
  }
  .zwc-flx-grid::before {
    display: none;
  }
  .zwc-flx-grid {
    border-bottom: 1px dashed rgba(255, 255, 255, 0.15);
  }
  .zwc-flx-grid:last-child {
    border: none;
  }
  .zwc-flx-grid::after {
    display: none;
  }
  .zwc-content-area .zwc-flex {
    flex-direction: column;
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
  }
  .zwc-content-area .content-wrap:nth-child(2n) .zwc-flx-col:nth-child(1) {
    order: inherit;
  }
}

@media only screen and (max-width: 767px) {
  .zwc-fea-nav {
    display: none;
  }
}

@media only screen and (max-width: 480px) {
  .zwc-banner-ctn h1 span.zwc-banner-title {
    padding: 0 50px;
  }
}