/* Shared dark product-image banners for every internal public page. */
.unified-image-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #071c2e !important;
  color: #fff;
}

.unified-image-hero::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0 0 0 42%;
  background-image:
    linear-gradient(rgba(0,0,0,.48), rgba(0,0,0,.48)),
    var(--page-banner-image);
  background-color: #071c2e;
  background-position: right center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: saturate(.85) contrast(1.08);
}

.unified-image-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, #071c2e 0%, #071c2e 35%, rgba(7,28,46,.97) 43%, rgba(7,28,46,.7) 57%, rgba(7,28,46,.2) 78%, rgba(7,28,46,0) 100%),
    linear-gradient(0deg, rgba(7,28,46,.2), transparent 65%);
}

.unified-image-hero .page-hero-grid,
.unified-image-hero .store-hero-content,
.unified-image-hero .cart-hero-content {
  position: relative;
  z-index: 1;
}

.unified-image-hero h1,
.unified-image-hero h2 {
  color: #fff;
}

.unified-image-hero .eyebrow {
  color: var(--orange);
}

.unified-image-hero .page-hero-grid > p,
.unified-image-hero .store-hero-content > p,
.unified-image-hero .cart-hero-content > p {
  max-width: 590px;
  padding: 16px 19px;
  border-left: 4px solid var(--orange);
  background: rgba(5,22,36,.78);
  color: #d9e5eb;
  backdrop-filter: blur(7px);
}

.unified-image-hero .store-hero-content,
.unified-image-hero .cart-hero-content {
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  column-gap: 65px;
  align-items: end;
}

.unified-image-hero .store-hero-content .eyebrow,
.unified-image-hero .cart-hero-content .eyebrow {
  grid-column: 1;
  align-self: end;
}

.unified-image-hero .store-hero-content h1,
.unified-image-hero .cart-hero-content h1 {
  grid-column: 1;
}

.unified-image-hero .store-hero-content > p,
.unified-image-hero .cart-hero-content > p {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: end;
}

@media (max-width: 900px) {
  .unified-image-hero::before {
    left: 34%;
  }

  .unified-image-hero::after {
    background: linear-gradient(90deg, #071c2e 0%, rgba(7,28,46,.96) 42%, rgba(7,28,46,.3) 78%, rgba(7,28,46,0) 100%);
  }

  .unified-image-hero .store-hero-content,
  .unified-image-hero .cart-hero-content {
    display: block;
  }

  .unified-image-hero .page-hero-grid > p,
  .unified-image-hero .store-hero-content > p,
  .unified-image-hero .cart-hero-content > p {
    max-width: 580px;
    margin-top: 18px;
  }
}

@media (max-width: 560px) {
  .unified-image-hero::before {
    inset: 0;
    opacity: .58;
  }

  .unified-image-hero::after {
    background: linear-gradient(90deg, rgba(7,28,46,.98), rgba(7,28,46,.76));
  }

  .unified-image-hero .page-hero-grid > p,
  .unified-image-hero .store-hero-content > p,
  .unified-image-hero .cart-hero-content > p {
    padding: 11px 13px;
    margin-top: 14px;
  }
}
