@aware(['page'])
@pushonce('scripts')
    <meta name="robots" content="noindex">
@endpushonce
<x-vitrine-simples class="py-12">
    <div class="flex flex-col items-center">
        <div class="text-center px-10">
            <div class="uppercase tracking-33 text-xs text-white mb-1 max-md:mb-3">{{ $sobrancelha }}</div>
            <h1 class="mt-5 font-main font-bold text-white max-w-4xl text-3xl md:text-5xl text-balance">{{ $titulo }}</h1>
        </div>
    </div>
    <x-slot:slot2>
        <div class="hidden md:block">
            <x-star class="absolute left-[10%] top-[5%]" width="48px" height="48px" color="yellow"/>
            <x-star class="absolute right-[10%] top-[15%]" width="32px" height="32px" color="yellow"/>
            <x-star class="absolute right-[15%] bottom-[55%]" width="60px" height="60px" color="aquamarine"/>
        </div>
        <div class="md:hidden">
            <x-star class="absolute left-[16%] top-[4%]" width="48px" height="48px" color="yellow"/>
            <x-star class="absolute right-[12%] bottom-[35%]" width="48px" height="48px" color="aquamarine"/>
            <x-star class="absolute right-[6%] bottom-[50%]" width="24px" height="24px" color="yellow"/>
        </div>
    </x-slot:slot2>
</x-vitrine-simples>
<x-corpo>
    <div class="bg-white">
        <div class="px-10 max-w-3xl sm:mx-auto text-3xl text-center text-brand-brown font-bold">
            {!! str($descricao)->sanitizeHtml() !!}
        </div>
    </div>

    <div class="py-10 sm:py-20 bg-white">
        <div class="mx-3 mb-6 sm:mx-10">
            <div class="container mx-auto text-center px-6">
                @if(!empty($novidadesSobrancelha))
                    <x-typography.sobrancelha
                        class="text-brand-brown text-xs tracking-widest uppercase text-center mx-auto">{{ $novidadesSobrancelha }}</x-typography.sobrancelha>
                @endif
                @if(!empty($novidadesTitulo))
                    <h2 class="max-w-[37.5rem] text-center mx-auto text-3xl md:text-5xl font-extrabold text-brand-brown font-main mt-4 mb-10">
                        {{ $novidadesTitulo }}
                    </h2>
                @endif
            </div>
            <x-ultimas-novidades
                :botaoTexto="$novidadesBotao ?? null"
                :estilo="'compacto'"
                :limit="3"
            />
        </div>
    </div>
</x-corpo>