/* The film dissolves into the paper field instead of ending at a hard section edge. */
.hero::after {
  position: absolute;
  z-index: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: clamp(170px, 26vh, 340px);
  content: "";
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(239, 238, 232, 0) 0%, rgba(239, 238, 232, .08) 22%, rgba(239, 238, 232, .48) 61%, #efeee8 100%);
}

.hero-index,
.eyebrow,
.hero h1,
.hero-actions,
.hero-foot { z-index: 1; }

@media (max-width: 700px) {
  .hero::after { height: clamp(130px, 24vh, 210px); }
}