/* Standard Hero block frontend styles. Tablet rules use 48rem-64rem; phone stacking applies below 48rem. */
.bn-standard-hero {
  --bn-standard-hero-navy: #1e2559;
  --bn-standard-hero-navy-soft: #424a78;
  --bn-standard-hero-navy-mid: #596188;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
  max-width: none;
  margin: 0;
  background: var(--bn-standard-hero-navy);
  color: var(--bn-color-white, #ffffff);
  font-family: var(--bn-font-base, "Poppins", sans-serif);
}

.bn-standard-hero__inner {
  position: relative;
  z-index: 3;
  order: 1;
  display: flex;
  min-height: 0;
  padding: 1.75rem 1.25rem 0;
}

.bn-standard-hero__content {
  width: min(100%, 34rem);
}

.bn-standard-hero__heading,
.bn-standard-hero__subheading,
.bn-standard-hero__body {
  margin: 0;
  color: inherit;
  font-family: inherit;
  letter-spacing: 0;
}

.bn-standard-hero__heading {
  color: var(--bn-color-mint, #05d3ab);
  font-size: 1.5rem;
  line-height: 1.12;
  font-weight: 800;
  text-shadow: 0 0.2rem 0.35rem rgb(0 0 0 / 0.35);
}

.bn-standard-hero__subheading {
  max-width: 29rem;
  margin-top: 0.35rem;
  font-size: 1.125rem;
  line-height: 1.28;
  font-weight: 800;
  text-shadow: 0 0.2rem 0.35rem rgb(0 0 0 / 0.45);
}

.bn-standard-hero__body {
  max-width: 31.5rem;
  margin-top: 1.25rem;
  color: var(--bn-color-white, #ffffff) !important;
  font-size: 1rem;
  line-height: 1.42;
  font-weight: 400;
}

.bn-standard-hero__shapes {
  position: relative;
  z-index: 2;
  order: 2;
  width: 100%;
  height: 6rem;
  margin-top: -2.35rem;
  margin-bottom: -6rem;
  pointer-events: none;
}

.bn-standard-hero__shape {
  position: absolute;
  inset: -0.125rem auto 0 0;
  width: 100%;
  height: calc(100% + 0.125rem);
  background: var(--bn-standard-hero-navy);
  clip-path: polygon(0 0, 100% 0, 100% 36%, 0 74%);
}

.bn-standard-hero__shape--one {
  z-index: 3;
  background: var(--bn-standard-hero-navy);
  transform: translateY(0);
}

.bn-standard-hero__shape--two {
  z-index: 2;
  background: var(--bn-standard-hero-navy-soft);
  transform: translateY(1.875rem);
}

.bn-standard-hero__shape--three {
  z-index: 1;
  background: var(--bn-standard-hero-navy-mid);
  transform: translateY(3.75rem);
}

.bn-standard-hero__media {
  position: relative;
  z-index: 1;
  order: 3;
  width: 100%;
  min-height: 24rem;
  background: var(--bn-color-light-gray, #e8e9ea);
}

.bn-standard-hero__image {
  width: 100%;
  height: 100%;
  min-height: 24rem;
  object-fit: cover;
  object-position: center top;
}

.bn-standard-hero__image-placeholder {
  position: relative;
  z-index: 4;
  align-self: flex-end;
  margin-top: 2rem;
}

@media (min-width: 48rem) {
  .bn-standard-hero__inner {
    padding-inline: clamp(3rem, 6vw, 8rem);
  }

  .bn-standard-hero__content {
    width: min(58%, 54rem);
  }
}

@media (min-width: 48rem) {
  .bn-standard-hero {
    --bn-standard-hero-height: clamp(27.75rem, 45vw, 40.625rem);
    display: block;
    height: var(--bn-standard-hero-height);
  }

  .bn-standard-hero__media {
    position: absolute;
    inset: 0 0 0 auto;
    z-index: 1;
    width: 68%;
    height: 100%;
    margin-top: 0;
  }

  .bn-standard-hero__image {
    height: 100%;
    object-position: right center;
  }

  .bn-standard-hero__shapes {
    position: absolute;
    inset: 0 auto -10rem -0.1rem;
    z-index: 2;
    width: min(61.5vw, 58.7rem);
    height: auto;
    margin-bottom: 0;
    transform: none;
  }

  .bn-standard-hero__shape {
    width: 100%;
    clip-path: polygon(0 0, 64.46% 0, 100% 100%, 0 100%);
    -webkit-mask-image: none;
    mask-image: none;
  }

  .bn-standard-hero__shape--one {
    background: var(--bn-standard-hero-navy);
    opacity: 1;
    transform: translateX(0);
  }

  .bn-standard-hero__shape--two {
    background: var(--bn-standard-hero-navy);
    opacity: 0.55;
    transform: translateX(4.6875rem);
  }

  .bn-standard-hero__shape--three {
    background: var(--bn-standard-hero-navy);
    opacity: 0.85;
    transform: translateX(9.375rem);
  }

  .bn-standard-hero__inner {
    align-items: center;
    height: var(--bn-standard-hero-height);
    padding: 6rem clamp(3.25rem, 5.55vw, 5rem);
  }

  .bn-standard-hero__content {
    width: min(52vw, 53rem);
  }

  .bn-standard-hero__heading {
    font-size: 4.5rem;
    line-height: 1.05;
    text-shadow: 0 0.35rem 0.35rem rgb(0 0 0 / 0.35);
  }

  .bn-standard-hero__subheading {
    max-width: 67rem;
    margin-top: 1.6rem;
    font-size: 2.25rem;
    line-height: 1.15;
    text-shadow: 0 0.35rem 0.35rem rgb(0 0 0 / 0.55);
  }

  .bn-standard-hero__body {
    max-width: 66rem;
    margin-top: 1.25rem;
    color: var(--bn-color-white, #ffffff) !important;
    font-size: 1.25rem;
    line-height: 1.5;
  }
}


@media (min-width: 90rem) {
  .bn-standard-hero {
    --bn-standard-hero-wide-media-width: min(68%, 980px);
    --bn-standard-hero-wide-shape-overlap: 36rem;
  }

  .bn-standard-hero__media {
    width: var(--bn-standard-hero-wide-media-width);
  }

  .bn-standard-hero__shapes {
    width: calc(100% - var(--bn-standard-hero-wide-media-width) + var(--bn-standard-hero-wide-shape-overlap));
  }
}

p.bn-standard-hero__body {
  color: var(--bn-color-white, #ffffff) !important;
}

@media (max-width: 47.9375rem) {
  .bn-standard-hero__media {
    margin-top: 3.75rem;
  }
}
@media (min-width: 48rem) and (max-width: 64rem) {
  .bn-standard-hero__inner {
    padding-right: 40px;
    padding-left: 40px;
  }

  .bn-standard-hero__heading {
    font-size: 2.25rem;
  }

  .bn-standard-hero__subheading {
    font-size: 1.5rem;
  }

  .bn-standard-hero__body {
    font-size: 1rem;
  }
}
.bn-standard-hero--animate-intro .bn-standard-hero__content {
  opacity: 0;
  transform: translateX(-1.5rem);
  animation: bn-standard-hero-intro 700ms ease-out 150ms forwards;
}

@keyframes bn-standard-hero-intro {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .bn-standard-hero--animate-intro .bn-standard-hero__content {
    opacity: 1;
    transform: none;
    animation: none;
  }
}