/* Figma #2/#3: keep the hero's lower gap separate from its image height. */
.l-top > .p-hero {
  padding-bottom: 4.6875rem;
}

@media screen and (min-width: 768px) {
  .l-top > .p-hero {
    max-height: none;
    padding-bottom: 6.25rem;
  }

  /* The copy's rule and the image now share the same grid-row bottom. */
  .l-top > .p-hero > .p-hero__panel {
    padding-bottom: 0;
  }

  .l-top > .p-hero .p-hero__action {
    max-width: 100%;
  }
}