/** Shopify CDN: Minification failed

Line 184:0 Unexpected "}"

**/
.img-with-text-8 {
  position: relative;
}

.img-with-text-8--cta-button .img-with-text-8__media {
  padding: 2.4rem 0 3.4rem 0;
}
@media (min-width: 768px) {
  .img-with-text-8--cta-button .img-with-text-8__media {
    padding: 3.2rem 0;
  }
}
@media (min-width: 1200px) {
  .img-with-text-8--cta-button .img-with-text-8__media {
    padding: 6rem 0 5.8rem 0;
  }
}

.img-with-text-8--stats-display .img-with-text-8__media {
  padding: 4rem 0 5rem 0;
}
@media (min-width: 768px) {
  .img-with-text-8--stats-display .img-with-text-8__media {
    padding: 5.6rem 0 3.2rem 0;
  }
}
@media (min-width: 1200px) {
  .img-with-text-8--stats-display .img-with-text-8__media {
    padding: 7.5rem 0 4rem 0;
  }
}

.img-with-text-8__grid,
.img-with-text-8__inner {
  height: 100%;
}

.img-with-text-8__sub-heading {
  color: color-mix(in srgb, rgba(var(--color-foreground)) calc(0.5 * 100%), transparent);
  font-weight: 500;
  font-size: calc(var(--font-body-scale) * 1.5rem);
  line-height: calc(1 + 0.42 / var(--font-body-scale));
  text-align: center;
  word-break: break-word;
  word-wrap: break-word;
  padding-bottom: 1.2rem;
}
@media (min-width: 768px) {
  .img-with-text-8__sub-heading {
    padding-bottom: 1.6rem;
  }
}
@media (min-width: 992px) {
  .img-with-text-8__sub-heading {
    padding-bottom: 2.2rem;
  }
}

.img-with-text-8__content {
  word-break: break-word;
  word-wrap: break-word;
  text-align: center;
}
.img-with-text-8__content > * {
  color: color-mix(in srgb, rgba(var(--color-foreground)) var(--reveal-opacity), transparent);
  background-clip: text;
  background-repeat: no-repeat;
  background-image: linear-gradient(90deg, rgba(var(--color-foreground)), rgba(var(--color-foreground)));
}
.img-with-text-8__content * {
  display: inline;
  background-size: inherit;
}

.img-with-text-8__images {
  display: flex;
  /* Now that the height is fixed, a row that no longer fits has to break onto a
     second line instead of squeezing the images into letterboxed columns. */
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--images-gap-mobile);
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 768px) {
  .img-with-text-8__images {
    gap: var(--images-gap-desktop);
  }
}

.img-with-text-8__images-item {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  justify-content: center;
  min-width: 0;
}

/* The mobile variant is served through <picture>, which otherwise would become
   the flex item and take the sizing rules away from the image itself. */
.img-with-text-8__images-item picture {
  display: contents;
}

/* The height setting drives the size, so the images are exactly as tall as the
   merchant asks. object-fit keeps the aspect ratio if a very wide image hits
   the width of its column before it runs out of height. */
.img-with-text-8__images-img {
  display: block;
  width: auto;
  max-width: 100%;
  height: var(--images-height-mobile);
  object-fit: contain;
}
@media (min-width: 768px) {
  .img-with-text-8__images-img {
    height: var(--images-height-desktop);
  }
}

@media (min-width: 768px) {
  .img-with-text-8__stats {
    padding: 0 2.4rem;
  }
}

.img-with-text-8__stats-value {
  font-family: var(--font-heading-family);
  font-weight: var(--font-heading-weight);
  word-break: break-word;
  word-wrap: break-word;
}

.img-with-text-8__stats-description,
.img-with-text-8__stats-unit {
  color: color-mix(in srgb, rgba(var(--color-foreground)) calc(0.6 * 100%), transparent);
  font-weight: 500;
  font-size: calc(var(--font-body-scale) * 1.5rem);
  line-height: calc(1 + 0.42 / var(--font-body-scale));
  word-break: break-word;
  word-wrap: break-word;
}

.img-with-text-8__stats-unit {
  padding-bottom: 0.8rem;
}

.img-with-text-8__stats-description {
  text-align: center;
  width: 100%;
  margin: auto;
}
@media (min-width: 768px) {
  .img-with-text-8__stats-description {
    width: 80%;
  }
}
@media (min-width: 992px) {
  .img-with-text-8__stats-description {
    width: 70%;
  }
}

.img-with-text-8__stats-divider {
  display: block;
  margin: 2rem 0;
  width: 100%;
  height: 0.1rem;
  background: linear-gradient(90deg, color-mix(in srgb, rgba(var(--color-border)) calc(1 * 100%), transparent), color-mix(in srgb, rgba(var(--color-border)) calc(0.2 * 100%), transparent));
}

.img-with-text-8__button {
  display: flex;
  align-items: center;
  justify-content: center;
}
}