/* Keep the original skyline visible without dimming it twice. */
.hero-img {
  opacity: 1;
  object-position: center;
}
.hero::after {
  background: linear-gradient(
    100deg,
    rgb(var(--ink-rgb) / 0.78) 0%,
    rgb(var(--ink-rgb) / 0.70) 70%,
    rgb(var(--ink-rgb) / 0.12) 100%
  );
}

/* Phone-width copy spans the photo, so retain an even readable scrim. */
@media (max-width: 48rem) {
  .hero::after {
    background: rgb(var(--ink-rgb) / 0.70);
  }
}