body {
  text-wrap: pretty;
}
:root {
  --zwc-primary-color: #132486;
  --zwc-bg-text-color: #ffd803;
}
.flex-wrap {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}
.zwc-dis-blk {
  display: block;
}
.zwc-bg-text-color {
  color: var(--zwc-bg-text-color);
}
section {
  padding: 100px 0px;
}
.zwc-banner-sec {
  background: url("/sites/zweb/images/learn/mobile-apps/zwc-learn-banner.jpg")
    right center / cover no-repeat;
  color: rgb(255, 255, 255);
}
.zpage-wrapper h1 {
  font-size: 72px;
  margin: 0px auto 30px;
  line-height: 1;
}
.zwc-banner-sec p {
  font-size: 32px;
  line-height: 1.4;
  width: 100%;
  max-width: 600px;
}
.zwc-bnr-lft {
  width: 59%;
}
.zwc-bnr-rgt {
  width: 30%;
  max-width: 390px;
}
.zwc-mobile-app-sec {
  background: #ffffff;
}
.zwc-mobile-app-sec h2 {
  font-size: 36px;
  text-align: center;
  width: 100%;
  max-width: 430px;
  line-height: 1.1;
  letter-spacing: -1px;
  margin: 0px auto 100px;
}
.zwc-mobile-app-sec h3 {
  line-height: 1.2;
}
.zwc-mobile-app {
  margin-bottom: 150px;
}
.zwc-mobile-app:last-child {
  margin-bottom: 0px;
}
.zwc-mobile-app-lft {
  width: 48%;
  max-width: 420px;
}
.zwc-mobile-app-rgt {
  width: 45%;
}
.zwc-mobile-app.flex-wrap {
  gap: 50px;
  justify-content: center;
}
.zwc-reverse-flex {
  flex-direction: row-reverse;
}
.zwc-pd-lft-30 {
  padding-left: 30px;
}
.zwc-footer-before {
  /* background: rgb(235, 239, 255); */
  margin: 0px auto;
  text-align: center;
  padding-top: 0px;
}
.zwc-footer-before h2 {
  width: 100%;
  max-width: 900px;
  text-align: center;
  margin: 0px auto 30px;
}
@media only screen and (min-width: 1200px) {
  .zpage-wrapper h2,
  .zpage-wrapper h3 {
    font-family: var(--primaryfont-bold);
  }
  .zwc-footer-before h2 {
    font-family: var(--primaryfont-semibold);
  }
  .zpage-wrapper h1 {
    font-size: 96px;
    letter-spacing: -2.88px;
  }
  .zwc-banner-sec p {
    margin-bottom: 30px;
    letter-spacing: -0.32px;
  }
  .zpage-wrapper h2,
  .zwc-footer-before h2 {
    font-size: 56px;
    line-height: 1.1;
    letter-spacing: -1.68px;
  }
  .zwc-mobile-app-sec h2 {
    max-width: 660px;
  }
  .zpage-wrapper h3 {
    font-size: 40px;
    letter-spacing: -1.2px;
  }
}
@media only screen and (max-width: 1280px) {
  .zwc-bnr-lft {
    width: 65%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .zpage-wrapper h3 {
    font-size: 30px;
  }
}
@media only screen and (max-width: 1199px) {
  .zwc-bnr-lft {
    max-width: 54%;
  }
  .zwc-footer-before h2 {
    max-width: 450px;
  }
  .zwc-banner-sec p {
    font-size: 28px;
    max-width: 500px;
  }
}
@media only screen and (max-width: 991px) {
  section {
    padding: 60px 0px;
  }
  .zwc-banner-sec .flex-wrap {
    flex-direction: column;
    gap: 50px;
  }
  .zwc-bnr-lft,
  .zwc-bnr-rgt {
    text-align: center;
  }
  .zwc-dis-blk {
    display: inline;
  }
  .zpage-wrapper h1 {
    font-size: 56px;
  }
  .zwc-bnr-lft,
  .zwc-bnr-rgt {
    width: 100%;
    max-width: 690px;
  }
  .zwc-bnr-rgt {
    max-width: 350px;
  }
  .zwc-banner-sec p {
    font-size: 22px;
    margin: 0px auto 30px;
  }
  .zwc-mobile-app-sec h2 {
    margin: 0px auto 80px;
  }
  .zwc-mobile-app {
    margin-bottom: 100px;
  }
}
@media only screen and (max-width: 767px) {
  .zpage-wrapper h1 {
    font-size: 32px;
    margin: 0px auto 20px;
  }
  .zwc-banner-sec p {
    font-size: 18px;
    margin: 0px auto 20px;
  }
  .zwc-mobile-app-sec h2 {
    font-size: 25px;
    max-width: 310px;
    margin: 0px auto 30px;
  }
  .zwc-bnr-lft {
    max-width: 370px;
  }
  .zwc-mobile-app.flex-wrap {
    flex-direction: column;
  }
  .zwc-mobile-app-lft,
  .zwc-mobile-app-rgt {
    width: 100%;
    max-width: 470px;
    text-align: center;
  }
  .zwc-mobile-app-rgt {
    max-width: 420px;
  }
  .zwc-pd-lft-30 {
    padding-left: 0px;
  }
  .zwc-mobile-app {
    margin-bottom: 60px;
  }
  .zwc-mobile-app.flex-wrap,
  .zwc-banner-sec .flex-wrap {
    gap: 20px;
  }
  .zwc-bnr-rgt {
    max-width: 300px;
  }
}
