@pushonce('scripts')
    <meta name="robots" content="noindex">
@endpushonce
<div class="bg-midnightblue-100 pt-[calc(var(--header-height)_+_5rem)] pb-40 md:pt-[calc(var(--header-height)_+_0.5rem)] md:pb-48 sticky top-0">
    <div class="max-w-[85.375rem] mx-auto">
        <div class="flex flex-col items-center">
            <div class="text-center sm:mt-12 px-8">
                <div class="uppercase text-center tracking-33 text-xs text-white mb-1 max-md:mb-3">{{ $sobrancelha }}</div>
                <h1 class="text-center font-bricolage font-bold text-5xl text-white max-w-5xl max-md:text-3xl text-balance">{{ $title }}</h1>
            </div>
            <a href="{{ \App\Helpers\TranslationHelper::getHomePageUrl() }}"
               class="bg-white shadow-xl mt-10 inline-flex justify-center rounded-full px-10 py-4 font-bold text-sm text-midnightblue-100">
                {{ __('messages._pagina_busca.voltar') }}
            </a>
        </div>
        <div class="hidden md:block absolute inset-0 top-[45px] -z-10">
            <x-star class="absolute md:left-[10%] md:top-[20%]" width="48px" height="48px" color="white"/>
            <x-star class="absolute md:left-[20%] md:top-[40%]" width="48px" height="48px"
                    color="yellow"/>
            <x-star class="absolute md:block md:right-[20%] md:top-[45%]" width="48px" height="48px" color="yellow"/>
            <x-star class="absolute md:right-[5%] md:top-[20%]" width="30px" height="30px" color="white"/>
        </div>
        <div class="md:hidden absolute inset-0 top-[45px]">
            <x-star class="absolute left-[10%] top-[10%]" width="48px" height="48px" color="white"/>
            <x-star class="absolute right-[10%] top-[12%]" width="24px" height="24px" color="white"/>
            <x-star class="absolute right-[5%] bottom-[50%]" width="32px" height="32px" color="yellow"/>
            <x-star class="absolute right-[30%] bottom-[20%]" width="24px" height="24px" color="white"/>
        </div>
    </div>
</div>