/* =========================================================
   EDITION 1.1K — COLLECTION / JOURNAL / PRINTS HERO IMAGES
   ========================================================= */

.page-hero-with-image {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  color: #fff;
}

.page-hero-with-image .page-hero-media,
.page-hero-with-image .page-hero-shade {
  position: absolute;
  inset: 0;
}

.page-hero-with-image .page-hero-media {
  z-index: -2;
}

.page-hero-with-image .page-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-hero-with-image .page-hero-shade {
  z-index: -1;
  background:
    linear-gradient(90deg, rgba(8,7,6,.12), rgba(8,7,6,.64) 62%, rgba(8,7,6,.9)),
    linear-gradient(0deg, rgba(8,7,6,.7), rgba(8,7,6,.08) 58%);
}

.collection-hero.page-hero-with-image {
  min-height: 68svh;
  display: grid;
  align-items: end;
  padding: clamp(120px, 13vw, 185px) 0 clamp(76px, 8vw, 112px);
  background: #11100e;
}

.collection-hero.page-hero-with-image .page-hero-media img {
  object-position: center 52%;
}

.journal11-hero.page-hero-with-image {
  min-height: 70svh;
  display: grid;
  align-items: end;
  padding: clamp(120px, 13vw, 185px) 0 clamp(76px, 8vw, 112px);
  background: #11100e;
}

.journal11-hero.page-hero-with-image .page-hero-media img {
  object-position: center 55%;
}

.page-intro.page-hero-with-image {
  min-height: 68svh;
  display: grid;
  align-items: end;
  padding: clamp(120px, 13vw, 185px) 0 clamp(76px, 8vw, 112px);
  background: #11100e;
}

.page-intro.page-hero-with-image .page-hero-media img {
  object-position: center 50%;
}

.page-hero-with-image h1,
.page-hero-with-image .eyebrow {
  color: #fff;
}

.page-hero-with-image .collection-hero__copy,
.page-hero-with-image .journal11-hero__copy,
.page-hero-with-image .page-intro__copy {
  color: rgba(255,255,255,.78);
}

@media (max-width: 760px) {
  .page-hero-with-image .page-hero-shade {
    background: linear-gradient(0deg, rgba(8,7,6,.96), rgba(8,7,6,.18) 74%);
  }

  .collection-hero.page-hero-with-image,
  .journal11-hero.page-hero-with-image,
  .page-intro.page-hero-with-image {
    min-height: 620px;
    padding-top: 130px;
  }
}