/* ============================================
   CSS Variables — Shared Tokens
   ============================================ */
:root {
  /* Brand & section colors */
  --color-text-primary: #0b1f3d;
  --color-text-body: #211616;
  --color-text-muted: #24324a;
  --color-text-soft: rgba(11, 31, 61, 0.4);
  --color-text-light-blue: #94b7ff;
  --color-text-white: #fff;
  --color-testimonial-title: #3a3133;
  --color-author-secondary: rgba(37, 37, 37, 0.5);
  --color-disclaimer: rgba(0, 0, 0, 0.5);

  /* Backgrounds */
  --color-bg-section-light: #e5edff;
  --color-bg-quote: #e4edff;
  --color-bg-dark: #061333;
  --color-bg-dark-deep: #081739;
  --color-bg-card-blue: #002885;
  --color-avatar-bg: #d6e0f2;

  /* Borders */
  --color-border-card-blue: #3c61b4;
  --color-border-divider: rgba(11, 31, 61, 0.1);
  --color-border-testimonial: #6b9bff;
  --color-border-avatar: rgba(11, 31, 61, 0.1);

  /* Shared typography tokens */
  --section-heading-size: 48px;
  --section-heading-line-height: 1;
  --subheading-size: 32px;
  --subheading-line-height: 1.1875;
  --body-text-size: 16px;
  --body-line-height: 1.5;
  --description-text-size: 18px;
  --description-line-height: 1.39;
  --small-text-size: 12px;
  --small-line-height: 1.38;

  /* CTA tokens */
  --cta-padding: 16px 24px;
  --cta-font-size: 16px;
  --cta-line-height: 1.25;
  --cta-letter-spacing: 0.0125em;
  --cta-radius: 4px;
  --cta-gap: 20px;
  --cta-primary-bg: #fa0011;
  --cta-primary-color: #fff;

  /* Assets */
  --bg-banner: url("/sites/zweb/images/workdrive/gather/bg-image.png");
  --bg-sprite: url("/sites/zweb/images/workdrive/gather/gather-sprite.png");
}

/* ============================================
   Keyframe Animations
   ============================================ */
@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ============================================
   Common Section Styles
   ============================================ */
.zwc-section {
  padding: var(--top-padding, 0) 0 var(--bottom-padding, 0);
}

/* All inline images shrink with their container, aspect ratio preserved */
.zwc-section img {
  max-width: 100%;
  height: auto;
}

/* Slide-up animation — runs when the parent .content-wrap gains .animated */
.content-wrap img {
  opacity: 0;
}

.content-wrap.animated img {
  animation: slideUp 0.6s ease both;
}

/* Skip the testimonial author avatar — keep it visible without animation */
.content-wrap .zwc-author-avatar img,
.content-wrap.animated .zwc-author-avatar img {
  opacity: 1;
  animation: none;
}

/* Disable the slide-up animation on tablet & mobile — images stay visible as-is */
@media screen and (max-width: 991px) {
  .content-wrap img,
  .content-wrap.animated img {
    opacity: 1;
    animation: none;
  }
}

/* ============================================
   CTA Buttons — Dark Section Overrides
   ============================================ */
.zwc-banner-wrapper .act-btn,
.zwc-bottomcta-wrapper .act-btn {
  display: flex;
  align-items: center;
  padding: var(--cta-padding);
  border-radius: var(--cta-radius);
  font-family: var(--primaryfont-regular);
  font-size: var(--cta-font-size);
  line-height: var(--cta-line-height);
  letter-spacing: var(--cta-letter-spacing);
  text-decoration: none;
  background: transparent;
  border: 1px solid var(--color-text-white);
  color: var(--color-text-white);
}

.zwc-banner-wrapper .act-btn.cta-btn,
.zwc-bottomcta-wrapper .act-btn.cta-btn {
  background: var(--cta-primary-bg);
  border-color: var(--cta-primary-bg);
  color: var(--cta-primary-color);
}

/* ============================================
   Hero Banner Section
   ============================================ */
.zwc-banner-wrapper {
  --top-padding: 180px;
  --bottom-padding: 180px;
  --content-gap: 30px;
  --content-max-width: 614px;
  --content-h1-max-width: 614px;
  --content-desc-max-width: 576px;
  --content-desc-margin: 20px 0 30px;
  --visual-max-width: 532px;
  --visual-padding: 50px;
  --visual-radius: 32px;
  --visual-img-max-width: 432px;

  --h1-font-size: 56px;
  --h1-line-height: 1.06;
  --h1-letter-spacing: -0.03em;
  --desc-font-size: 17px;
  --desc-line-height: 1.62;
  --desc-letter-spacing: -0.025em;

  background: var(--color-bg-dark) var(--bg-banner) center/cover no-repeat;
}

.zwc-banner-wrapper .zwc-banner-inner {
  display: flex;
  gap: var(--content-gap);
  align-items: center;
  justify-content: center;
}

.zwc-banner-wrapper .zwc-banner-content {
  width: 100%;
  max-width: var(--content-max-width);
}

.zwc-banner-wrapper h1 {
  font-family: var(--primaryfont-semibold);
  font-size: var(--h1-font-size);
  line-height: var(--h1-line-height);
  letter-spacing: var(--h1-letter-spacing);
  color: var(--color-text-white);
  text-wrap: balance;
  width: 100%;
  max-width: var(--content-h1-max-width);
  margin: 0;
}

.zwc-banner-highlight {
  color: var(--color-text-light-blue);
}

.zwc-banner-wrapper .banner-desc {
  font-family: var(--primaryfont-regular);
  font-size: var(--desc-font-size);
  line-height: var(--desc-line-height);
  letter-spacing: var(--desc-letter-spacing);
  color: var(--color-text-light-blue);
  width: 100%;
  max-width: var(--content-desc-max-width);
  margin: var(--content-desc-margin);
}

.zwc-banner-wrapper .zwc-banner-cta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--cta-gap);
  align-items: center;
}

.zwc-banner-wrapper .zwc-banner-visual {
  /* display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0; */
  width: 100%;
  max-width: var(--visual-max-width);
  /* padding: var(--visual-padding);
  background: var(--color-bg-card-blue);
  border: 1px solid var(--color-border-card-blue);*/
  border-radius: var(--visual-radius);
}

/* ============================================
   Read the Report Section
   ============================================ */
.zwc-report-wrapper {
  --top-padding: 108px;
  --bottom-padding: 108px;
  --heading-margin-bottom: 42px;
  --body-gap: 184px;
  --logo-max-width: 319px;
  --list-max-width: 585px;
  --list-item-max-width: 548px;
  --list-item-padding: 36px 0;
  --list-item-gap: 18px;
  --num-max-width: 76px;
  --num-padding-top: 6px;
  --num-letter-spacing: 0.22em;
  --p-max-width: 454px;

  --h2-letter-spacing: -0.013em;
  --h2-max-width: 1207px;

  background: var(--color-bg-section-light);
}

.zwc-report-wrapper h2 {
  font-family: var(--zf-primary-medium);
  font-size: var(--section-heading-size);
  line-height: 1.1;
  letter-spacing: var(--h2-letter-spacing);
  color: var(--color-text-primary);
  text-align: left;
  width: 100%;
  max-width: var(--h2-max-width);
  margin: 0 0 var(--heading-margin-bottom);
}

.zwc-report-wrapper .zwc-report-body {
  display: flex;
  flex-wrap: wrap;
  gap: var(--body-gap);
  align-items: center;
  justify-content: space-between;
}

.zwc-report-wrapper .zwc-report-logo {
  display: flex;
  width: 100%;
  max-width: var(--logo-max-width);
}

.zwc-report-list {
  flex-shrink: 0;
  width: 100%;
  max-width: var(--list-max-width);
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--color-border-divider);
  counter-reset: report-num;
}

.zwc-report-list li {
  display: flex;
  align-items: flex-start;
  width: 100%;
  max-width: var(--list-item-max-width);
  padding: var(--list-item-padding);
  border-bottom: 1px solid var(--color-border-divider);
  counter-increment: report-num;
}

.zwc-report-list li::before {
  content: counter(report-num, decimal-leading-zero);
  flex-shrink: 0;
  width: 100%;
  max-width: var(--num-max-width);
  font-family: var(--primaryfont-regular);
  font-size: var(--small-text-size);
  line-height: 1;
  letter-spacing: var(--num-letter-spacing);
  color: var(--color-text-soft);
  padding-top: var(--num-padding-top);
  padding-right: var(--list-item-gap);
}

.zwc-report-list p {
  font-family: var(--primaryfont-regular);
  font-size: var(--description-text-size);
  line-height: var(--description-line-height);
  letter-spacing: -0.0025em;
  color: var(--color-text-muted);
  width: 100%;
  max-width: var(--p-max-width);
  margin: 0;
}

/* ============================================
   Quote block (lives inside Customers section)
   ============================================ */
/* ============================================
   Quote Section (own section)
   ============================================ */
.zwc-quote-wrapper {
  --top-padding: 108px;
  --bottom-padding: 60px;
}

.zwc-quote-block {
  --quote-icon-size: 80px;
  --quote-icon-bg-size:190px;
  --quote-icon-bg-position: 0 1px;
  --quote-icon-margin-bottom: 16px;
  --quote-max-width: 886px;
  --quote-font-size: 24px;
  --quote-line-height: 1.67;
  --quote-letter-spacing: -0.01em;

  text-align: center;
  margin: 0 auto;
}

.zwc-quote-icon {
  display: flex;
  width: 100%;
  max-width: var(--quote-icon-size);
  height: var(--quote-icon-size);
  margin: 0 auto var(--quote-icon-margin-bottom);
  background: var(--bg-sprite) var(--quote-icon-bg-position) / var(--quote-icon-bg-size) no-repeat;
}

.zwc-quote-block p {
  font-family: var(--primaryfont-regular);
  font-size: var(--quote-font-size);
  line-height: var(--quote-line-height);
  letter-spacing: var(--quote-letter-spacing);
  color: var(--color-text-body);
  width: 100%;
  max-width: var(--quote-max-width);
  margin: 0 auto;
}

/* ============================================
   Customers Section ("What this means…")
   ============================================ */
.zwc-customers-wrapper {
  --top-padding: 60px;
  --bottom-padding: 108px;
  --heading-margin-bottom: 30px;
  --h2-max-width: 510px;
  --h2-letter-spacing: -0.0288em;
  --feature-visual-max-width: 560px;
}

.zwc-customers-wrapper h2 {
  font-family: var(--zf-primary-medium);
  font-size: var(--section-heading-size);
  line-height: var(--section-heading-line-height);
  letter-spacing: var(--h2-letter-spacing);
  color: var(--color-text-primary);
  width: 100%;
  max-width: var(--h2-max-width);
  margin: 0 0 var(--heading-margin-bottom);
}

/* ============================================
   Generic Feature Row (Customers / Enterprise / Secure)
   ============================================ */
.zwc-feature-row,
.zwc-enterprise-inner,
.zwc-secure-inner {
  --feature-gap: 79px;
  --feature-text-max-width: 495px;
  --feature-text-h3-margin-bottom: 21px;
  --feature-visual-max-width: 593px;

  display: flex;
  /* flex-wrap: wrap; */
  gap: var(--feature-gap);
  align-items: center;
  justify-content: center;
}

.zwc-feature-text {
  width: 100%;
  max-width: var(--feature-text-max-width);
}

.zwc-feature-text h3 {
  font-family: var(--zf-primary-medium);
  font-size: var(--subheading-size);
  line-height: var(--subheading-line-height);
  letter-spacing: -0.005em;
  color: var(--color-text-primary);
  margin: 0 0 var(--feature-text-h3-margin-bottom);
}

.zwc-feature-text p {
  font-family: var(--primaryfont-regular);
  font-size: var(--body-text-size);
  line-height: var(--body-line-height);
  letter-spacing: -0.0146em;
  color: var(--color-text-body);
  margin: 0;
}

.zwc-feature-visual {
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: var(--feature-visual-max-width);
}

/* ============================================
   Enterprise Content Management (Dark)
   ============================================ */
.zwc-enterprise-wrapper {
  --top-padding: 108px;
  --bottom-padding: 108px;
  --feature-visual-max-width: 469px;

  background: var(--color-bg-dark-deep);
}

.zwc-enterprise-wrapper .zwc-enterprise-inner {
  flex-direction: row-reverse;
}

.zwc-enterprise-wrapper .zwc-feature-text h3,
.zwc-enterprise-wrapper .zwc-feature-text p {
  color: var(--color-text-white);
}

.zwc-enterprise-wrapper .zwc-feature-visual {
  width: 100%;
  max-width: var(--feature-visual-max-width);
}

/* ============================================
   Secure Collaboration Section
   ============================================ */
.zwc-secure-wrapper {
  --top-padding: 108px;
  --bottom-padding: 108px;
}

.zwc-secure-wrapper .zwc-feature-visual {
  filter: drop-shadow(0 4px 22px #cbdcff);
}

/* ============================================
   Testimonial Section
   ============================================ */
.zwc-testimonial-wrapper {
  --top-padding: 108px;
  --bottom-padding: 108px;
  --heading-margin-bottom: 28px;
  --slider-max-width: 650px;
  --card-max-width: 644px;
  --card-child-margin-bottom: 10px;
  --quote-mark-max-width: 68px;
  --quote-mark-height: 55px;
  --quote-mark-bg-position: -64px -3px;
  --author-padding-top: 25px;
  --author-gap: 12px;
  --avatar-size: 40px;
  --avatar-info-name-margin-bottom: 2px;
  --dots-gap: 6px;
  --dot-size: 15px;
  --dot-border-width: 1.7px;
  --dot-border-color: #3673ff;
  --dot-active-fill: #002e9a;
  --dot-inactive-fill: #fff;

  --h2-letter-spacing: -0.01em;
  --h2-line-height: 0.95;

  background: var(--color-bg-section-light);
}

.zwc-testimonial-wrapper h2 {
  font-family: var(--zf-primary-medium);
  font-size: var(--section-heading-size);
  line-height: var(--h2-line-height);
  letter-spacing: var(--h2-letter-spacing);
  color: var(--color-testimonial-title);
  text-align: center;
  margin: 0 0 var(--heading-margin-bottom);
}

.zwc-testimonial-card {
  margin: 0 20px var(--card-child-margin-bottom);
  text-align: center;
}

.zwc-quote-mark {
  display: flex;
  width: 100%;
  max-width: var(--quote-mark-max-width);
  height: var(--quote-mark-height);
  margin: 0 auto var(--card-child-margin-bottom);
  background: var(--bg-sprite) var(--quote-mark-bg-position) no-repeat;
  background-size: 135px;
  ;
}

.zwc-testimonial-card blockquote {
  margin: 0 0 var(--card-child-margin-bottom);
}

.zwc-testimonial-card blockquote p {
  font-family: var(--primaryfont-regular);
  font-size: var(--body-text-size);
  line-height: var(--body-line-height);
  letter-spacing: -0.015em;
  color: var(--color-text-body);
  margin: 0;
}

.zwc-testimonial-author {
  display: flex;
  gap: var(--author-gap);
  align-items: center;
  justify-content: center;
  padding-top: var(--author-padding-top);
  border-top: 1px solid var(--color-border-testimonial);
}

.zwc-author-avatar {
  display: flex;
  width: 100%;
  max-width: var(--avatar-size);
  height: var(--avatar-size);
  border-radius: 50%;
  background: var(--color-avatar-bg);
  border: 1px solid var(--color-border-avatar);
  overflow: hidden;
}

.zwc-author-avatar img {
  object-fit: cover;
  border-radius: 50%;
}

.zwc-author-info {
  text-align: left;
}

.zwc-author-name {
  font-family: var(--primaryfont-regular);
  font-size: var(--body-text-size);
  line-height: 1.22;
  color: var(--color-text-body);
  margin: 0 0 var(--avatar-info-name-margin-bottom);
}

.zwc-author-info span {
  font-family: var(--primaryfont-regular);
  font-size: var(--small-text-size);
  line-height: var(--small-line-height);
  color: var(--color-author-secondary);
}

/* Slick slider container */
.zwc-testimonial-slider {
  width: 100%;
  max-width: var(--slider-max-width);
  margin: 0 auto;
}

/* Reset card margin inside Slick wrapper (Slick handles slide positioning) */
.zwc-testimonial-slider .slick-slide .zwc-testimonial-card {
  margin-bottom: 0;
}

/* Slick slider dots — restyled to match the original .zwc-testimonial-dots */
.zwc-testimonial-slider .slick-dots {
  display: flex;
  gap: var(--dots-gap);
  align-items: center;
  justify-content: center;
  list-style: none;
  padding: 0;
  margin: 28px 0 0;
  position: static;
  width: 100%;
}

.zwc-testimonial-slider .slick-dots li {
  width: 100%;
  max-width: var(--dot-size);
  height: var(--dot-size);
  border: var(--dot-border-width) solid var(--dot-border-color);
  border-radius: 50%;
  background: var(--dot-inactive-fill);
  box-sizing: border-box;
  cursor: pointer;
}

.zwc-testimonial-slider .slick-dots li.slick-active {
  background: var(--dot-active-fill);
}

.zwc-testimonial-slider .slick-dots li button {
  width: 100%;
  max-width: var(--dot-size);
  height: var(--dot-size);
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 0;
  color: transparent;
  cursor: pointer;
}

/* ============================================
   Bottom CTA Section
   ============================================ */
.zwc-bottomcta-wrapper {
  --top-padding: 108px;
  --bottom-padding: 108px;
  --heading-margin-bottom: 36px;
  --h2-max-width: 818px;
  --buttons-gap: 20px;

  --h2-letter-spacing: -0.0096em;

  background: var(--color-bg-dark) var(--bg-banner) center/cover no-repeat;
}

.zwc-bottomcta-wrapper h2 {
  font-family: var(--zf-primary-medium);
  font-size: var(--section-heading-size);
  line-height: var(--section-heading-line-height);
  letter-spacing: var(--h2-letter-spacing);
  color: var(--color-text-white);
  text-align: center;
  text-wrap: balance;
  width: 100%;
  max-width: var(--h2-max-width);
  margin: 0 auto var(--heading-margin-bottom);
}

.zwc-bottomcta-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--buttons-gap);
  align-items: center;
  justify-content: center;
}

/* ============================================
   Disclaimer Section
   ============================================ */
.zwc-disclaimer-wrapper {
  --top-padding: 40px;
  --bottom-padding: 40px;
  --inner-max-width: 854px;
  --p-margin-bottom: 12px;
}

.zwc-disclaimer-wrapper .zwc-disclaimer-inner {
  width: 100%;
  max-width: var(--inner-max-width);
  margin: 0 auto;
}

.zwc-disclaimer-wrapper p {
  font-family: var(--primaryfont-regular);
  font-size: var(--small-text-size);
  line-height: var(--small-line-height);
  letter-spacing: 0.005em;
  color: var(--color-disclaimer);
  margin: 0 0 var(--p-margin-bottom);
}

.zwc-disclaimer-wrapper p:last-child {
  margin-bottom: 0;
}

/* ============================================
   Responsive Breakpoints
   ============================================ */

/* Large Tablet (max 1199px) */
@media screen and (max-width: 1439px) {

  .zwc-report-wrapper .zwc-report-body {
    justify-content: space-between;
    gap: unset;
  }

  .zwc-feature-row,
  .zwc-secure-inner {
    justify-content: left;
  }
}

/* Large Tablet (max 1199px) */
@media screen and (max-width: 1199px) {
  :root {
    --section-heading-size: 40px;
    --subheading-size: 28px;
    --cta-gap: 16px;
  }

  /* Shared section padding — all sections collapse to 90px top/bottom */
  .zwc-banner-wrapper,
  .zwc-report-wrapper,
  .zwc-quote-wrapper,
  .zwc-customers-wrapper,
  .zwc-secure-wrapper,
  .zwc-enterprise-wrapper,
  .zwc-testimonial-wrapper,
  .zwc-bottomcta-wrapper {
    --top-padding: 90px;
    --bottom-padding: 90px;
  }

  /* Tighter seam between the quote and the customers section */
  .zwc-quote-wrapper {
    --bottom-padding: 50px;
  }

  .zwc-customers-wrapper {
    --top-padding: 50px;
  }

  .zwc-banner-wrapper {
    --content-gap: 40px;
    --visual-max-width: 460px;
    --visual-padding: 40px;
    --h1-font-size: 48px;
  }

  .zwc-report-wrapper {
    --body-gap: 80px;
    --list-max-width: 500px;
  }

  .zwc-feature-row,
  .zwc-enterprise-inner,
  .zwc-secure-inner {
    --feature-gap: 40px;
  }

  .zwc-quote-block {
    --quote-font-size: 20px;
    --quote-icon-size: 72px;
    --quote-icon-bg-position: 0 1px;
     --quote-icon-bg-size: 170px;
  }

  .zwc-bottomcta-wrapper {
    --h2-max-width: 100%;
  }

  .zwc-banner-wrapper .zwc-banner-inner,
  .zwc-report-wrapper .zwc-report-inner,
  .zwc-quote-wrapper .zwc-quote-inner,
  .zwc-customers-wrapper .zwc-customers-inner,
  .zwc-secure-wrapper .zwc-secure-inner,
  .zwc-enterprise-wrapper .zwc-enterprise-inner,
  .zwc-testimonial-wrapper .zwc-testimonial-inner,
  .zwc-bottomcta-wrapper .zwc-bottomcta-inner,
  .zwc-disclaimer-wrapper .zwc-disclaimer-inner {
    /* padding-left: 32px;
    padding-right: 32px; */
  }
}

/* Tablet (max 991px) */
@media screen and (max-width: 991px) {

  .zwc-banner-wrapper .zwc-banner-visual {
    display: none;
  }

  /* Shared section padding */
  .zwc-banner-wrapper,
  .zwc-report-wrapper,
  .zwc-quote-wrapper,
  .zwc-customers-wrapper,
  .zwc-secure-wrapper,
  .zwc-enterprise-wrapper,
  .zwc-testimonial-wrapper,
  .zwc-bottomcta-wrapper {
    --top-padding: 80px;
    --bottom-padding: 80px;
  }

  /* Tighter seam between the quote and the customers section */
  .zwc-quote-wrapper {
    --bottom-padding: 40px;
  }

  .zwc-customers-wrapper {
    --top-padding: 40px;
  }

  .zwc-banner-wrapper {
    --content-gap: 50px;
    --visual-max-width: 100%;
    --h1-font-size: 44px;
  }

  .zwc-banner-wrapper .zwc-banner-inner {
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
  }

  .zwc-banner-wrapper .zwc-banner-cta {
    justify-content: center;
  }

  .zwc-banner-wrapper h1,
  .zwc-banner-wrapper .banner-desc {
    max-width: 100%;
  }

  .zwc-report-wrapper {
    --num-max-width: 30px;
  }

  .zwc-report-wrapper h2 {
    text-align: center;
  }

  .zwc-report-wrapper .zwc-report-body {
    align-items: flex-start;
    gap: 40px;
    justify-content: center;
  }

  .zwc-report-list li {
    max-width: 100%;
  }

  .zwc-report-list p {
    max-width: 100%;
  }

  .zwc-feature-row,
  .zwc-enterprise-inner,
  .zwc-secure-inner {
    --feature-gap: 40px;
  }

  .zwc-report-list li:nth-child(1)::before {
    padding-top: 9px
  }

  .zwc-feature-text,
  .zwc-feature-visual {
    flex-basis: 100%;
    max-width: 100%;
  }

  .zwc-enterprise-wrapper .zwc-feature-visual,
  .zwc-enterprise-wrapper .zwc-feature-visual img {
    max-width: 100%;
  }

  .zwc-customers-wrapper h2 {
    text-align: center;
    margin: 0 auto var(--heading-margin-bottom);
  }

  .zwc-quote-block {
    --quote-icon-size: 64px;
    --quote-icon-bg-position: 0 1px;
     --quote-icon-bg-size: 150px;
  }
}

/* Mobile (max 767px) */
@media screen and (max-width: 767px) {
  :root {
    --section-heading-size: 28px;
    --subheading-size: 24px;
    --cta-gap: 14px;
    --cta-font-size: 14px;
    --cta-padding: 14px 20px;
  }

  /* Shared section padding */
  .zwc-banner-wrapper,
  .zwc-report-wrapper,
  .zwc-quote-wrapper,
  .zwc-customers-wrapper,
  .zwc-secure-wrapper,
  .zwc-enterprise-wrapper,
  .zwc-testimonial-wrapper,
  .zwc-bottomcta-wrapper {
    --top-padding: 60px;
    --bottom-padding: 60px;
  }

  /* Tighter seam between the quote and the customers section */
  .zwc-quote-wrapper {
    --bottom-padding: 30px;
  }

  .zwc-customers-wrapper {
    --top-padding: 30px;
  }

  .zwc-banner-wrapper {
    --content-gap: 32px;
    --content-desc-margin: 16px 0 24px;
    --visual-padding: 24px;
    --visual-radius: 20px;
    --h1-font-size: 32px;
    --desc-font-size: 15px;
  }

  .zwc-banner-wrapper .zwc-banner-cta .act-btn,
  .zwc-bottomcta-buttons .act-btn {
    justify-content: center;
  }

  .zwc-quote-block {
    --quote-font-size: 16px;
    --quote-icon-size: 56px;
    --quote-icon-bg-position: 0 1px;
    --quote-icon-bg-size: 130px;
  }

  .zwc-report-wrapper {
    --heading-margin-bottom: 32px;
  }

  .zwc-customers-wrapper {
    --heading-margin-bottom: 32px;
  }

  .zwc-feature-row,
  .zwc-secure-inner,
  .zwc-enterprise-wrapper .zwc-enterprise-inner {
    text-align: center;
    flex-direction: column;
  }

  .zwc-bottomcta-wrapper {
    --inner-gap: 28px;
  }

  .zwc-banner-wrapper .zwc-banner-inner,
  .zwc-report-wrapper .zwc-report-inner,
  .zwc-quote-wrapper .zwc-quote-inner,
  .zwc-customers-wrapper .zwc-customers-inner,
  .zwc-secure-wrapper .zwc-secure-inner,
  .zwc-enterprise-wrapper .zwc-enterprise-inner,
  .zwc-testimonial-wrapper .zwc-testimonial-inner,
  .zwc-bottomcta-wrapper .zwc-bottomcta-inner,
  .zwc-disclaimer-wrapper .zwc-disclaimer-inner {
    padding-left: 20px;
    padding-right: 20px;
  }

  .zwc-report-list li {
    --list-item-gap: 8px;
    padding: 24px 0;
  }

  .zwc-report-list p {
    font-size: var(--body-text-size);
  }

  .zwc-feature-text {
    --feature-text-h3-margin-bottom: 12px;
  }

  .zwc-testimonial-wrapper {
    --slider-max-width: 100%;
  }

  .zwc-disclaimer-wrapper {
    --top-padding: 30px;
    --bottom-padding: 30px;
  }
}

@media screen and (max-width: 480px) {
  .zwc-disclaimer-wrapper .zwc-disclaimer-inner {
    text-align: center;
  }
    .zwc-quote-block {
    --quote-icon-margin-bottom: 10px;
  }
}