#oct-banner-wrap.container.promo-wrapper {
  width: 1368px !important;
  margin-top: 60px;
  margin-bottom: 60px;
}

/* Figma "inner banner" 1:6308: 1314x252, flat art with a live CTA on top */
#oct-banner {
  width: 100%;
  max-width: 1314px;
  container-type: inline-size;
  box-shadow: 2px 4px 5.9px 2px rgba(0, 0, 0, 0.10);
}

#oct-banner picture img {
  height: auto;
}

/* CTA 1:8581: 45px tall, Avenir Black 20px, centred at (71.26%, 70.44%) of the banner */
#oct-banner .oct-banner-cta {
  left: 71.263%;
  top: 70.437%;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  line-height: 1;
  height: max(32px, 3.425cqw);
  padding: 0 max(14px, 2.283cqw);
  border-radius: 50px;
  font-size: max(14px, 1.522cqw);
  background-color: #00FE00;
  color: #000;
}

#oct-banner .oct-banner-cta:hover,
#oct-banner .oct-banner-cta:focus-visible {
  filter: brightness(1.15);
}

@supports (background: -webkit-named-image(i)) and (not (text-box: trim-both cap alphabetic)) {
  #oct-banner .button {
    padding-top: 2px;
  }
}

@supports (text-box: trim-both cap alphabetic) {
  #oct-banner .button>span {
    display: block;
    text-box: trim-both cap alphabetic;
  }
}

/* Figma "inner banner-Mobile" 1:9884: 390x356, stops growing at 1.5x */
@media screen and (max-width: 767px) {
  #oct-banner {
    max-width: 585px;
  }

  /* CTA 1:12175: centred at (49.872%, 84.972%) */
  #oct-banner .oct-banner-cta {
    left: 49.872%;
    top: 84.972%;
    height: max(32px, 11.538cqw);
    padding: 0 max(14px, 7.692cqw);
    font-size: max(14px, 5.128cqw);
  }
}