@props([
    'title' => '-',
    'back_url' => null
])

<div class="bg-grad-header overflow-x-hidden">
    <x-sections.header-top />

    <div class="relative pt-10">
        <div class="container-2 lg:flex pt-10 lg:pt-2">
            <div class="mx-auto lg:mx-0 max-w-2xl lg:w-3/5">
                @if($back_url) <a href="{{ $back_url }}"> @endif
                    <h1 class="flex items-center text-4xl font-barlow font-bold text-white pb-9 text-center lg:text-left @if($back_url) hover:underline @endif">
                        <x-icon name="chevron-left" size="1.3em" />
                        <span>{{ $title }}</span>
                    </h1>
                @if($back_url) </a> @endif
            </div>
        </div>
    </div>

    {{ $slot ?? '' }}
</div>