/* Uniform internal-page banners; the homepage slider intentionally stays larger. */
.page-hero,
.store-hero,
.cart-hero {
  padding: 62px 0 66px;
}

.page-hero-grid {
  grid-template-columns: 1.25fr .75fr;
  gap: 65px;
}

.page-hero h1,
.store-hero h1,
.cart-hero h1 {
  font-size: clamp(2.8rem, 5vw, 4.7rem);
  line-height: 1;
  letter-spacing: -.05em;
  margin: 15px 0 0;
}

.page-hero-grid > p,
.store-hero p,
.cart-hero p {
  max-width: 620px;
  margin-bottom: 2px;
  font-size: 1rem;
  line-height: 1.6;
}

.page-hero .eyebrow,
.store-hero .eyebrow,
.cart-hero .eyebrow {
  font-size: .66rem;
}

.cart-hero h1 {
  margin-bottom: 13px;
}

@media (max-width: 900px) {
  .page-hero,
  .store-hero,
  .cart-hero {
    padding: 52px 0 56px;
  }

  .page-hero-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .page-hero-grid > p {
    max-width: 700px;
  }
}

@media (max-width: 560px) {
  .page-hero,
  .store-hero,
  .cart-hero {
    padding: 40px 0 43px;
  }

  .page-hero h1,
  .store-hero h1,
  .cart-hero h1 {
    margin-top: 11px;
    font-size: 2.45rem;
  }

  .page-hero-grid {
    gap: 16px;
  }

  .page-hero-grid > p,
  .store-hero p,
  .cart-hero p {
    font-size: .9rem;
    line-height: 1.55;
  }
}

/* Services-page preview: random product image blended into the dark banner. */
.service-image-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #071c2e;
}

.service-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(--service-banner-image);
  background-color: #071c2e;
  background-position: right center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: saturate(.85) contrast(1.08);
}

.service-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%);
}

.service-image-hero .page-hero-grid {
  position: relative;
  z-index: 1;
}

.service-image-hero .page-hero-grid > p {
  padding: 18px 20px;
  border-left: 4px solid var(--orange);
  background: rgba(5,22,36,.78);
  color: #d9e5eb;
  backdrop-filter: blur(7px);
}

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

  .service-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%);
  }

  .service-image-hero .page-hero-grid > p {
    max-width: 580px;
  }
}

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

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

  .service-image-hero .page-hero-grid > p {
    padding: 12px 14px;
  }
}

/* About-page preview: random store product blended into the banner. */
.about-image-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #e8f0f5;
}

.about-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(--about-banner-image);
  background-color: #fff;
  background-position: right center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: saturate(.9) contrast(1.05);
}

.about-image-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, #e8f0f5 0%, #e8f0f5 35%, rgba(232,240,245,.96) 43%, rgba(232,240,245,.62) 55%, rgba(232,240,245,.16) 72%, rgba(232,240,245,0) 100%),
    linear-gradient(0deg, rgba(7,28,46,.08), transparent 70%);
}

.about-image-hero .page-hero-grid {
  position: relative;
  z-index: 1;
}

.about-image-hero .page-hero-grid > p {
  padding: 18px 20px;
  border-left: 4px solid var(--orange);
  background: rgba(255,255,255,.83);
  color: #314e61;
  backdrop-filter: blur(7px);
}

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

  .about-image-hero::after {
    background: linear-gradient(90deg, #e8f0f5 0%, rgba(232,240,245,.94) 42%, rgba(232,240,245,.22) 76%, rgba(232,240,245,0) 100%);
  }

  .about-image-hero .page-hero-grid > p {
    max-width: 580px;
  }
}

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

  .about-image-hero::after {
    background: linear-gradient(90deg, rgba(232,240,245,.97), rgba(232,240,245,.72));
  }

  .about-image-hero .page-hero-grid > p {
    padding: 12px 14px;
  }
}