Hero Pattern: Incorrect section placement

**Describe the bug**

While building https://github.com/canonical/canonical.com/pull/1406, I noticed an issue with the hero macro that prevented the page from being built with the hero macro. When flipping between my in-progress support page and the [postgresql managed page](https://canonical.com/data/postgresql/managed), I found that the spacing between the title and the description was different.

Currently, the title blocks are wrapped in `.p-section--shallow`, and the description is wrapped in a separate `.p-section--shallow`. This creates a lot of space between the title area and the description:

Following the example from the [postgresql managed page](https://canonical.com/data/postgresql/managed), the titles and description can all be wrapped in a single shallow section to tighten things up a bit:

Search the hero macro for the title blocks and `.p-section--shallow` wrappers, then compare its output with the PostgreSQL managed page linked in the issue. The work is done when the title and description share one shallow section, the spacing matches the example, and the support page builds with the hero macro.

Written by the indexing model from the issue text.