@props(['title', 'intro' => null, 'eyebrow' => null])

{{-- One heading shape for every screen, so the eye always lands in the same place. --}}
<div {{ $attributes->merge(['class' => 'page-head']) }}>
    <div>
        @if ($eyebrow)
            <div class="eyebrow">{{ $eyebrow }}</div>
        @endif
        <h1>{{ $title }}</h1>
        @if ($intro)
            <p class="page-head__intro">{{ $intro }}</p>
        @endif
    </div>

    @if (trim($slot) !== '')
        <div class="row" style="flex-wrap:wrap">{{ $slot }}</div>
    @endif
</div>