/* The closing call to action, centered */
@scope (htmlpress-landing-cta) {
  :scope {
    display: block;
  }
  :scope > section {
    max-width: 48rem;
    margin: 0 auto;
    padding: 6rem var(--landing-gutter);
    text-align: center;
  }
  h2 {
    margin: 0;
    font-size: 3rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.025em;
  }
  h2 > em {
    color: var(--htmlpress-accent);
    font-style: normal;
  }
  p {
    margin: 1.5rem 0 0;
    color: var(--htmlpress-muted);
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
  /* The second action is quieter here: a ghost, no border or fill until hovered */
  htmlpress-landing-actions a + a {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
  }
  htmlpress-landing-actions a + a:hover {
    background: var(--landing-action-hover);
  }
  @media (max-width: 48rem) {
    :scope > section {
      padding-block: 4rem;
    }
    h2 {
      font-size: 1.875rem;
      line-height: 2.25rem;
    }
  }
}