@aware(['page'])
<div class="my-5 sm:my-10">
    <div class="bg-babyblue-alt py-10 rounded-29xl">
        <x-typography.sobrancelha class="text-center">
            {{ $sobrancelha }}
        </x-typography.sobrancelha>
        <x-typography.titulo class="text-center max-w-[42.5rem]">
            {{ $titulo }}
        </x-typography.titulo>
        <x-abas :abas="$abas"></x-abas>
    </div>
    @if(!empty($chamada) && !empty($url) && !empty($botao))
        <div class="mt-16 grid place-items-center">
            <p class="text-center text-base start-conteudo !leading-relaxed max-w-[42.5rem] px-8 text-pretty">{{ $chamada }}</p>
            <div class="mt-8">
                <x-botao-principal href="{{ $url }}">
                    {{ $botao }}
                </x-botao-principal>
            </div>
        </div>
    @endif
</div>