@charset "UTF-8";
.jtl-cta-box {
  background: #eeeee7;
  padding: 0 64px;
}
.jtl-cta-box.jtl-band-width-page, .jtl-cta-box.jtl-band-width-full {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: 100vw;
  box-sizing: border-box;
}
@media only screen and (max-width: 1199px) {
  .jtl-cta-box {
    padding: 0 40px;
  }
}
@media only screen and (max-width: 991px) {
  .jtl-cta-box {
    padding: 0 24px;
  }
}
.jtl-cta-box.jtl-band-width-page {
  padding-left: var(--jtl-band-gutter, 64px);
  padding-right: var(--jtl-band-gutter, 64px);
}
.jtl-cta-box:not(.jtl-cta-box--plain):not(.jtl-cta-box--navy) {
  padding-top: var(--jtl-band-space-top, 0px);
  padding-bottom: var(--jtl-band-space-bottom, 0px);
}
.jtl-cta-box__box {
  position: relative;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  max-width: var(--jtl-band-content, var(--jtl-band-max, 1344px));
  min-height: 444px;
  margin: 0 auto;
  background: #fff;
  border-radius: 46px;
  overflow: hidden;
}
@media only screen and (max-width: 991px) {
  .jtl-cta-box__box {
    min-height: 0;
    border-radius: 32px;
  }
}
.jtl-cta-box__content {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 750px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 46px;
}
@media only screen and (max-width: 991px) {
  .jtl-cta-box__content {
    max-width: 100%;
    width: 100%;
    padding: 32px 24px;
  }
}
.jtl-cta-box__text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
}
.jtl-cta-box__text .jtl-text {
  width: 100%;
}
.jtl-cta-box__text .jtl-text--subline,
.jtl-cta-box__text .jtl-text--h2,
.jtl-cta-box__text .jtl-text--h3 {
  max-width: 594px;
}
.jtl-cta-box__text .jtl-text--h2,
.jtl-cta-box__text .jtl-text--h3 {
  margin-top: 6px;
}
.jtl-cta-box__text .jtl-text--paragraph {
  margin-top: 32px;
}
.jtl-cta-box__buttons {
  margin-top: 64px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 32px;
}
@media only screen and (max-width: 991px) {
  .jtl-cta-box__buttons {
    margin-top: 40px;
    gap: 16px;
  }
}
.jtl-cta-box__buttons .product-button-group__button--with-icon {
  font-size: 18px;
  font-weight: 600;
  line-height: 28px;
  letter-spacing: 0.36px;
}
.jtl-cta-box__nested-bullets {
  margin-top: 32px;
}
.jtl-cta-box__link {
  margin-top: 32px;
  font-family: "Inter", sans-serif;
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
  text-underline-position: from-font;
}
.jtl-cta-box__link--above + .jtl-cta-box__buttons {
  margin-top: 32px;
}
.jtl-cta-box__link.jtl-cta-box__link {
  color: #0b1b45;
  text-decoration: underline;
}
.jtl-cta-box__link.jtl-cta-box__link:hover, .jtl-cta-box__link.jtl-cta-box__link:focus {
  color: #0b1b45;
  text-decoration: underline;
}
.jtl-cta-box__features {
  margin: 32px 0 0;
  width: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 24px;
  font-family: "Inter", sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #0b1b45;
}
.jtl-cta-box__feature {
  display: inline-flex;
  align-items: baseline;
  white-space: nowrap;
}
.jtl-cta-box__feature::before {
  content: "•";
  margin-right: 6px;
}
.jtl-cta-box__decor {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.jtl-cta-box__blob {
  position: absolute;
  display: block;
  right: 0;
}
.jtl-cta-box__blob--top {
  top: 0;
  width: 531px;
  height: 140px;
}
@media only screen and (max-width: 1199px) {
  .jtl-cta-box__blob--top {
    width: 420px;
    height: 111px;
  }
}
@media only screen and (max-width: 991px) {
  .jtl-cta-box__blob--top {
    display: none;
  }
}
.jtl-cta-box__blob--bottom {
  bottom: 0;
  width: 339px;
  height: 283px;
}
@media only screen and (max-width: 1199px) {
  .jtl-cta-box__blob--bottom {
    width: 268px;
    height: 224px;
  }
}
@media only screen and (max-width: 991px) {
  .jtl-cta-box__blob--bottom {
    width: 170px;
    height: 142px;
  }
}

.jtl-cta-box--navy {
  padding-top: 40px;
  padding-bottom: 40px;
}
@media only screen and (max-width: 991px) {
  .jtl-cta-box--navy {
    padding-top: 32px;
    padding-bottom: 32px;
  }
}
.jtl-cta-box--navy .jtl-cta-box__box {
  background: #0b1b45;
  min-height: 0;
}
.jtl-cta-box--navy .jtl-cta-box__content {
  max-width: none;
  width: 100%;
}
.jtl-cta-box--navy .jtl-cta-box__text .jtl-text--paragraph {
  max-width: none;
}
.jtl-cta-box--navy .jtl-cta-box__text .jtl-text--h2 .jtl-text__heading,
.jtl-cta-box--navy .jtl-cta-box__text .jtl-text--h3 .jtl-text__heading {
  color: #fff !important;
}
.jtl-cta-box--navy .jtl-cta-box__text .jtl-text--paragraph .jtl-text__body {
  color: #fff;
}
.jtl-cta-box--navy .jtl-cta-box__text .jtl-text--subline .jtl-text__eyebrow {
  color: #89d2ff;
}
.jtl-cta-box--navy .jtl-cta-box__link {
  color: #fff;
}

.jtl-cta-box.is-shell-frame {
  padding-left: 0;
  padding-right: 0;
}
.jtl-cta-box.is-shell-frame .jtl-cta-box__box {
  max-width: 1558px;
  margin-left: 0;
  margin-right: 0;
}

body:has(.jtl-sub-navigation) .jtl-cta-box:not(.is-shell-frame):not(.jtl-band-width-page):not(.jtl-band-width-full) {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  max-width: 100vw;
  box-sizing: border-box;
  padding-left: var(--jtl-shell-content-gutter, 66px);
  padding-right: var(--jtl-shell-content-gutter, 66px);
}
body:has(.jtl-sub-navigation) .jtl-cta-box:not(.is-shell-frame):not(.jtl-band-width-page):not(.jtl-band-width-full) .jtl-cta-box__box {
  max-width: calc(var(--jtl-shell-max, 1600px) - 2 * var(--jtl-shell-content-gutter, 66px));
  margin-left: auto;
  margin-right: auto;
}

/* ---------------------------------------------------------------------------
   Surface: none.

   The closing call to action at the foot of a page, where the design draws no
   panel at all — heading, lead and one button centred on the section's own
   ground. Everything here is gated on the modifier, so a box without it renders
   exactly as it did before this option existed.
   --------------------------------------------------------------------------- */
.jtl-cta-box--plain {
  /* The lead is set a step above the body size in this module — 22/28, the
     size the design gives a closing paragraph. */
}
.jtl-cta-box--plain .jtl-cta-box__box {
  min-height: 0;
  background: transparent;
  border-radius: 0;
  /* The white box caps itself at 1344 to leave room for the blobs; without
     the box the content follows the page's own 1312 content column. */
  max-width: 1312px;
}
.jtl-cta-box--plain .jtl-cta-box__content {
  /* No box edge to inset from, so the padding is the design's own band
     spacing rather than the panel's 46. */
  max-width: none;
  width: 100%;
  align-items: center;
  padding: var(--jtl-band-space-top, 32px) 0 var(--jtl-band-space-bottom, 43px);
  text-align: center;
}
.jtl-cta-box--plain .jtl-cta-box__text {
  /* Stretched, not centred. The column is already centred in the box by
     `__content`, and every line inside it is centred by `text-align`
     below — so centring the items as well only shrank each one to its own
     content. The heading paid for it: at 32/46 the closing line measures
     604 and the shrunk item was 594, so it broke onto a second line with
     266px of the column standing empty beside it. */
  align-items: stretch;
  max-width: 860px;
  /* The 594 measure the panel variant gives its heading is the panel's:
     there the copy shares the box with the blob column and has to wrap
     early. Here it has the whole 860 and the design sets the closing
     question on one line, which needs 604. */
}
.jtl-cta-box--plain .jtl-cta-box__text .jtl-text {
  text-align: center;
}
.jtl-cta-box--plain .jtl-cta-box__text .jtl-text--h2,
.jtl-cta-box--plain .jtl-cta-box__text .jtl-text--h3 {
  max-width: none;
}
.jtl-cta-box--plain .jtl-cta-box__text .jtl-text--paragraph .jtl-text__body {
  font-size: 22px;
  line-height: 28px;
}
.jtl-cta-box--plain .jtl-cta-box__buttons {
  justify-content: center;
  margin-top: 44px;
}
.jtl-cta-box--plain .jtl-cta-box__features,
.jtl-cta-box--plain .jtl-cta-box__nested-bullets {
  justify-content: center;
  text-align: center;
}
@media only screen and (max-width: 991px) {
  .jtl-cta-box--plain .jtl-cta-box__content {
    padding: var(--jtl-band-space-top, 24px) 0 var(--jtl-band-space-bottom, 32px);
  }
  .jtl-cta-box--plain .jtl-cta-box__text .jtl-text--paragraph .jtl-text__body {
    font-size: 18px;
    line-height: 28px;
  }
  .jtl-cta-box--plain .jtl-cta-box__buttons {
    margin-top: 32px;
  }
}
