.xo-custom-section {
  position: relative;
}

.xo-custom-section--custom-gap {
  --container-min-viewport: 80;
  --container-max-viewport: 190;
  /* calculator */
  --container-m: (var(--xo-container-gap) - var(--xo-container-gap-mobile, var(--xo-container-gap))) /
    (var(--container-max-viewport) - var(--container-min-viewport));
  --container-gap: clamp(
    min(var(--xo-container-gap-mobile, var(--xo-container-gap)) * 1rem, var(--xo-container-gap) * 1rem),
    calc(
      var(--container-m) * 100vw + var(--xo-container-gap-mobile, var(--xo-container-gap)) * 1rem - var(--container-m) * var(--container-min-viewport) *
        1rem
    ),
    max(var(--xo-container-gap) * 1rem, var(--xo-container-gap-mobile) * 1rem)
  );
}

.xo-custom-section__container {
  width: 100%;
  height: var(--height);
}

.xo-custom-section__content {
  position: relative;
  width: 100%;
  height: 100%;
}