.feature-box-wrapper {
  --feature-box-padding: var(--spacing-xl);
  border-radius: var(--feature-box-border-radius, 24px);
  padding: var(--feature-box-padding);
  flex-direction: column;
  gap: var(--image-text-gap, var(--spacing-2xl));
  max-width: var(--feature-box-max-width, none);
  aspect-ratio: var(--feature-box-aspect-ratio, initial);
  justify-content: var(--feature-box-justify-content, initial);
  box-sizing: border-box;
  border: var(--feature-box-border, none);
  box-shadow: var(--feature-box-shadow, none);
}
.feature-box-wrapper.feature-box-image-left:not(.feature-box-multi-column) {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: var(--spacing-xl);
}
.feature-box-wrapper.feature-box-image-left:not(.feature-box-multi-column)
  .feature-box-image {
  order: 1;
}
.feature-box-wrapper.feature-box-image-left:not(.feature-box-multi-column)
  .feature-box-text-wrapper {
  order: 2;
  padding: var(--feature-box-text-padding, 0 0 0 var(--spacing-xl));
}
.feature-box-text-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--text-gap, var(--spacing-sm));
}
@media (max-width: 768px) {
  .feature-box-text-wrapper {
    padding: var(
      --feature-box-text-padding-mobile,
      var(--feature-box-text-padding, 0)
    );
  }
}
.feature-box-subheader {
  color: var(--color-base-black);
}
.feature-box-subheader.align-left {
  text-align: left;
}
.feature-box-description {
  color: var(--color-base-black);
  font-size: var(--description-font-size, 18px);
  font-family: var(--description-font-family, inherit);
  font-weight: 400;
  line-height: var(--description-line-height, 26px);
}
.feature-box-description.align-left {
  text-align: left;
}
.feature-box-image {
  margin: var(--feature-box-image-margin, 0 auto);
  display: flex;
  align-items: center;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  position: relative;
  width: 100%;
}
.feature-box-wrapper.feature-box-image-align-center
  .feature-box-image
  > div:not(.feature-box-image-outside-box-wrapper) {
  align-items: center;
}
.feature-box-image > div:not(.feature-box-image-outside-box-wrapper) {
  width: 100%;
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: var(--spacing-lg);
  box-sizing: border-box;
  padding: var(--feature-box-image-padding, 0);
  background: var(--feature-box-image-background, transparent);
  border-radius: var(--feature-box-image-border-radius, 0);
}
.feature-box-image img:not(.feature-box-icon-img) {
  width: 100%;
  height: auto;
}
@media (max-width: 768px) {
  .feature-box-wrapper {
    background: var(--mobile-background, inherit) !important;
    padding: var(--feature-box-padding-mobile, var(--feature-box-padding));
    gap: var(--image-text-gap-mobile, var(--image-text-gap, var(--spacing-xl)));
    width: 100%;
    max-width: var(--feature-box-max-width-mobile, none);
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    aspect-ratio: var(--feature-box-aspect-ratio-mobile, initial);
    justify-content: var(
      --feature-box-justify-content-mobile,
      var(--feature-box-justify-content)
    );
    border-radius: var(
      --feature-box-border-radius-mobile,
      var(--feature-box-border-radius, 24px)
    );
    border: var(--feature-box-border-mobile, var(--feature-box-border, none));
    box-shadow: var(
      --feature-box-shadow-mobile,
      var(--feature-box-shadow, none)
    );
  }
  .feature-box-wrapper.feature-box-image-left:not(.feature-box-multi-column) {
    grid-template-columns: 1fr !important;
  }
  .feature-box-wrapper.feature-box-image-left.feature-box-mobile-image-top:not(
      .feature-box-multi-column
    )
    .feature-box-image {
    order: 1 !important;
  }
  .feature-box-wrapper.feature-box-image-left.feature-box-mobile-image-top:not(
      .feature-box-multi-column
    )
    .feature-box-text-wrapper {
    order: 2 !important;
    padding-left: 0;
    padding-right: 0;
  }
  .feature-box-wrapper .feature-box-image {
    margin: var(
      --feature-box-image-margin-mobile,
      var(--feature-box-image-margin, 0 auto)
    );
  }
  .feature-box-wrapper
    .feature-box-image
    > div:not(.feature-box-image-outside-box-wrapper) {
    padding: var(
      --feature-box-image-padding-mobile,
      var(--feature-box-image-padding, 0)
    );
    background: var(
      --feature-box-image-background-mobile,
      var(--feature-box-image-background, transparent)
    );
    border-radius: var(
      --feature-box-image-border-radius-mobile,
      var(--feature-box-image-border-radius, 0)
    );
  }
  .feature-box-wrapper .feature-box-image .mobile-image {
    display: unset;
  }
  .feature-box-wrapper .feature-box-image .desktop-image {
    display: none;
  }
  .feature-box-subheader {
    font-size: var(
      --title-font-size-mobile,
      var(--title-h3-fs-mobile)
    ) !important;
  }
  .feature-box-subheader.align-mobile-center {
    text-align: center;
    align-self: center;
  }
  .feature-box-description {
    font-size: var(
      --description-font-size-mobile,
      var(--description-font-size, 18px)
    );
    line-height: var(--description-line-height-mobile, 26px);
  }
  .feature-box-description.align-mobile-center {
    text-align: center;
  }
}
@media (max-width: 1060px) {
  .mobile-breakpoint-xl .feature-box-wrapper {
    background: var(--mobile-background, inherit) !important;
    padding: var(--feature-box-padding-mobile, var(--feature-box-padding));
    gap: var(--image-text-gap-mobile, var(--image-text-gap, var(--spacing-xl)));
    width: 100%;
    max-width: var(--feature-box-max-width-mobile, none);
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    aspect-ratio: var(--feature-box-aspect-ratio-mobile, initial);
    justify-content: var(
      --feature-box-justify-content-mobile,
      var(--feature-box-justify-content)
    );
    border-radius: var(
      --feature-box-border-radius-mobile,
      var(--feature-box-border-radius, 24px)
    );
    border: var(--feature-box-border-mobile, var(--feature-box-border, none));
    box-shadow: var(
      --feature-box-shadow-mobile,
      var(--feature-box-shadow, none)
    );
  }
  .mobile-breakpoint-xl
    .feature-box-wrapper.feature-box-image-left:not(.feature-box-multi-column) {
    grid-template-columns: 1fr !important;
  }
  .mobile-breakpoint-xl
    .feature-box-wrapper.feature-box-image-left.feature-box-mobile-image-top:not(
      .feature-box-multi-column
    )
    .feature-box-image {
    order: 1 !important;
  }
  .mobile-breakpoint-xl
    .feature-box-wrapper.feature-box-image-left.feature-box-mobile-image-top:not(
      .feature-box-multi-column
    )
    .feature-box-text-wrapper {
    order: 2 !important;
    padding-left: 0;
    padding-right: 0;
  }
  .mobile-breakpoint-xl .feature-box-wrapper .feature-box-image {
    margin: var(
      --feature-box-image-margin-mobile,
      var(--feature-box-image-margin, 0 auto)
    );
  }
  .mobile-breakpoint-xl
    .feature-box-wrapper
    .feature-box-image
    > div:not(.feature-box-image-outside-box-wrapper) {
    padding: var(
      --feature-box-image-padding-mobile,
      var(--feature-box-image-padding, 0)
    );
    background: var(
      --feature-box-image-background-mobile,
      var(--feature-box-image-background, transparent)
    );
    border-radius: var(
      --feature-box-image-border-radius-mobile,
      var(--feature-box-image-border-radius, 0)
    );
  }
  .mobile-breakpoint-xl .feature-box-wrapper .feature-box-image .mobile-image {
    display: unset;
  }
  .mobile-breakpoint-xl .feature-box-wrapper .feature-box-image .desktop-image {
    display: none;
  }
  .mobile-breakpoint-xl .feature-box-subheader {
    font-size: var(
      --title-font-size-mobile,
      var(--title-h3-fs-mobile)
    ) !important;
  }
  .mobile-breakpoint-xl .feature-box-subheader.align-mobile-center {
    text-align: center;
    align-self: center;
  }
  .mobile-breakpoint-xl .feature-box-description {
    font-size: var(
      --description-font-size-mobile,
      var(--description-font-size, 18px)
    );
    line-height: var(--description-line-height-mobile, 26px);
  }
  .mobile-breakpoint-xl .feature-box-description.align-mobile-center {
    text-align: center;
  }
}
.features-grid-wrapper {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  gap: var(--headline-and-features-gap, var(--spacing-2xl));
}
.features-grid-container {
  display: grid;
  column-gap: var(--features-column-gap, var(--spacing-lg));
  row-gap: var(--features-row-gap, var(--spacing-lg));
}
@media (max-width: 768px) {
  .features-grid-wrapper {
    gap: var(
      --headline-and-features-gap-mobile,
      var(--headline-and-features-gap, var(--spacing-xl))
    );
  }
  .features-grid-container {
    grid-template-columns: var(--grid-template-columns-mobile, 1fr) !important;
    row-gap: var(
      --features-row-gap-mobile,
      var(--features-row-gap, var(--spacing-lg))
    );
    column-gap: var(
      --features-column-gap-mobile,
      var(--features-column-gap, var(--spacing-lg))
    );
  }
  .features-grid-container:not(.has-custom-mobile-columns)
    .feature-box-wrapper {
    grid-column: span 1 !important;
  }
}
@media (max-width: 1060px) {
  .mobile-breakpoint-xl .features-grid-wrapper {
    gap: var(
      --headline-and-features-gap-mobile,
      var(--headline-and-features-gap, var(--spacing-xl))
    );
  }
  .mobile-breakpoint-xl .features-grid-container {
    grid-template-columns: var(--grid-template-columns-mobile, 1fr) !important;
    row-gap: var(
      --features-row-gap-mobile,
      var(--features-row-gap, var(--spacing-lg))
    );
    column-gap: var(
      --features-column-gap-mobile,
      var(--features-column-gap, var(--spacing-lg))
    );
  }
  .mobile-breakpoint-xl
    .features-grid-container:not(.has-custom-mobile-columns)
    .feature-box-wrapper {
    grid-column: span 1 !important;
  }
}
