@props([
    'settings',
])

<x-public.photo-hero
    @class(['home-chapter'])
    data-chapter="hero"
    :image-path="$settings->hero_image_path"
    :image-alt="$settings->hero_image_alt ?: $settings->brand_name"
    :eyebrow="$settings->hero_eyebrow"
    :title="$settings->hero_title ?: 'Celebrações com propósito'"
    :summary="$settings->hero_subtitle"
    brand-mark
>
    <div class="flex flex-wrap items-center gap-4">
        <a href="{{ route('contact') }}" data-testid="home-primary-cta" class="btn btn-primary text-xs font-bold uppercase tracking-[0.09em]">
            {{ $settings->hero_cta_label ?: 'Solicitar proposta' }}
        </a>

        @if (filled($settings->hero_secondary_cta_label))
            <a href="{{ route('portfolio.index') }}" class="btn btn-ghost min-h-0 px-0 text-xs font-bold uppercase tracking-[0.09em] text-amare-accent hover:bg-transparent hover:text-amare-accent-deep">
                <span class="border-b border-amare-accent pb-1">{{ $settings->hero_secondary_cta_label }}</span>
            </a>
        @endif
    </div>

    @if (filled($settings->hero_note))
        <p class="mt-4 max-w-xl text-sm text-amare-text-muted">{{ $settings->hero_note }}</p>
    @endif
</x-public.photo-hero>