Page Header

<div class="page-header">
    <span class="page-header__icon">
        <span class="material-symbols-rounded" aria-hidden="true">beach_access</span>
    </span>
    <div class="page-header__content gap-m">
        <div class="page-header__title gap-xs">
            <h1 class="page-header__heading">
                Heading
            </h1>
            <h2 class="page-header__sub-heading">
                Sub heading
            </h2>
        </div>
        <p class="page-header__text">This is some placeholder copy</p>
    </div>
</div>

<div class="page-header page-header--center">
    <div class="page-header__content gap-m">
        <div class="page-header__title gap-xs">
            <h1 class="page-header__heading">
                Heading
            </h1>
            <h2 class="page-header__sub-heading">
                Sub heading
            </h2>
        </div>
        <p class="page-header__text">This is some placeholder copy</p>
    </div>
</div>