Type Spacing

<div class="grid-container usa-prose">
    <div class="grid-row grid-gap">
        <div class="mobile-lg:grid-col usa-prose">
            <h1>Heading 1</h1>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales eros a diam fermentum, id pulvinar lacus tincidunt. Ut varius ipsum at ex maximus molestie. Quisque tincidunt posuere ligula, ut dictum quam.</p>
            <div class="height-5 width-auto bg-secondary-lighter"></div>
        </div>
        <div class="mobile-lg:grid-col usa-prose">
            <h2>Heading 2</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales eros a diam fermentum, id pulvinar lacus tincidunt. Ut varius ipsum at ex maximus molestie. Quisque tincidunt posuere ligula, ut dictum quam.</p>
            <h3>Heading 3</h3>
        </div>
    </div>
    <div class="grid-row grid-gap bg-base-lighter">
        <div class="mobile-lg:grid-col usa-prose">
            <h3>Heading 3</h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales eros a diam fermentum, id pulvinar lacus tincidunt. Ut varius ipsum at ex maximus molestie.</p>
            <p>Quisque tincidunt posuere ligula, ut dictum quam.</p>
        </div>
        <div class="mobile-lg:grid-col">
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales eros a diam fermentum, id pulvinar lacus tincidunt. Ut varius ipsum at ex maximus molestie. Quisque tincidunt posuere ligula, ut dictum quam.</p>
        </div>
    </div>
    <div class="grid-row grid-gap">
        <div class="mobile-lg:grid-col usa-prose">
            <p><b>Paragraph text inside a grid column (mobile-lg:grid-col):</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales eros a diam fermentum, id pulvinar lacus tincidunt. Ut varius ipsum at ex maximus molestie. Quisque tincidunt posuere ligula, ut dictum quam.</p>
            <p>Another paragraph within the same section</p>
        </div>
    </div>
    <div class="bg-base-lighter usa-prose">
        <p><b>Paragraph text inside a grid:</b> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales eros a diam fermentum, id pulvinar lacus tincidunt. Ut varius ipsum at ex maximus molestie. Quisque tincidunt posuere ligula, ut dictum quam.</p>
        <ul>
            <li>Unordered list item</li>
            <li>Unordered list item</li>
            <li>Unordered list item</li>
        </ul>
        <p>Lorem ipsum dolor sit amet</p>
    </div>
    <div class="usa-section usa-section--dark">
        <div class="grid-container usa-prose">
            <h2>Heading 2 in a dark section</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales eros a diam fermentum, id pulvinar lacus tincidunt. Ut varius ipsum at ex maximus molestie. Quisque tincidunt posuere ligula, ut dictum quam.</p>
        </div>
    </div>
    <div class="usa-section">
        <div class="grid-container usa-prose">
            <h2>Heading 2 in a section</h2>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam sodales eros a diam fermentum, id pulvinar lacus tincidunt. Ut varius ipsum at ex maximus molestie. Quisque tincidunt posuere ligula, ut dictum quam.</p>
        </div>
    </div>
</div>