.issue-hero-real {
  position: relative;
  isolation: isolate;
  display: grid !important;
  grid-template-columns: 1fr !important;
  grid-template-rows: auto 1fr auto !important;
  width: 100vw;
  min-height: clamp(620px, 72vw, 900px);
  left: 50%;
  transform: translateX(-50%);
  overflow: hidden;
  background-image: url("assets/issue-01/issue-01-hero.webp");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.issue-hero-real::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(245, 241, 234, .94) 0%, rgba(245, 241, 234, .7) 27%, rgba(245, 241, 234, 0) 58%);
  pointer-events: none;
}

.issue-hero-real > .issue-label,
.issue-hero-real > h1,
.issue-hero-real > p {
  grid-column: 1 !important;
  position: relative;
  z-index: 2;
  width: min(44vw, 650px);
}

.issue-hero-photo {
  display: none !important;
}

@media (max-width: 700px) {
  .issue-hero-real {
    display: grid !important;
    min-height: 700px;
  }

  .issue-hero-real > .issue-label,
  .issue-hero-real > h1,
  .issue-hero-real > p {
    width: 72vw;
  }

  .issue-hero-real::after {
    background: linear-gradient(90deg, rgba(245, 241, 234, .9) 0%, rgba(245, 241, 234, .45) 62%, rgba(245, 241, 234, 0) 100%);
  }

  .issue-hero-photo {
    display: none !important;
  }

  .issue-hero-real {
    background-position: 62% center;
  }
}