{{-- Section Title Component --}}
@props([
    'title',
    'subtitle' => null,
    'centered' => true,
])

<div {{ $attributes->merge(['class' => $centered ? 'text-center' : '']) }}>
    <h2 class="text-3xl md:text-4xl font-display font-bold text-umami-dark mb-2">
        {{ $title }}
    </h2>
    @if($subtitle)
        <p class="text-lg text-umami-text max-w-2xl {{ $centered ? 'mx-auto' : '' }}">
            {{ $subtitle }}
        </p>
    @endif
    {{ $slot }}
</div>