@layer styles {
  /*
   * The lead paragraph under the hero: centred, in a column narrower than the
   * page, and a step up in size from body copy. The narrow measure is what
   * makes centred text readable — centring a full-width paragraph forces the
   * eye to hunt for the start of each line.
   */
  .ingress__content {
    text-align: center;
  }

  .ingress__title {
    margin-bottom: var(--space--small);
  }

  .ingress__text {
    /* Slightly larger than body copy, and it scales with the viewport rather
       than stepping at a breakpoint. */
    font-size: clamp(1.0625rem, 1.6vw, 1.25rem);
    font-weight: 300;
    line-height: 1.6;
    /* A TextArea gives plain text, so blank lines are the paragraph breaks. */
    white-space: pre-line;
  }

  .ingress__actions {
    margin-top: var(--space);
  }
}