@props(['badge' => null, 'title' => null, 'description' => null])

<div class="text-center mb-16">
    @if($badge)

        <div class="flex justify-center mb-4">
            <x-ui.badge :text="$badge" />
        </div>
    @endif

    @if($title)
        <h2 class="gradient-text mb-4 font-black leading-tight">
            {!! $title !!}
        </h2>
    @endif

    @if($description)
        <p class="max-w-2xl mx-auto text-gray-light text-lg">
            {{ $description }}
        </p>
    @endif
</div>