{{-- Section title with optional eyebrow and subtitle. $align: left | center --}}
@props(['title', 'subtitle' => null, 'eyebrow' => null, 'align' => 'left', 'as' => 'h2'])

<div {{ $attributes->class(['mb-8 max-w-3xl', 'mx-auto text-center' => $align === 'center']) }}>
    @if ($eyebrow)
        <p class="eyebrow">{{ $eyebrow }}</p>
    @endif

    <{{ $as }} class="mt-1 text-2xl font-bold tracking-tight sm:text-3xl">{{ $title }}</{{ $as }}>

    @if ($subtitle)
        <p class="mt-3 text-slate-600">{{ $subtitle }}</p>
    @endif
</div>