@php
    $style = $data['style'] ?? 'light';
    $bg = $url($data['background_image'] ?? null);
    $isImage = $style === 'image' && $bg !== '';
    $isDark = $style === 'dark' || $isImage;
    $centered = ! empty($data['centered']);
    $compact = ! empty($data['compact']);
    $title = $data['title'] ?? '';
    $crumbs = ! empty($data['show_breadcrumbs']) ? [['label' => 'Home', 'url' => url('/')], ['label' => $pageTitle ?: $title]] : [];
    $hasActions = filled($data['primary_text'] ?? null) || filled($data['secondary_text'] ?? null);
@endphp
<section @class([
    'pb-section pb-section--page-hero pb-page-hero relative isolate overflow-hidden',
    'pb-page-hero--dark' => $isDark,
    'pb-page-hero--image' => $isImage,
    'pb-page-hero--compact' => $compact,
    'pb-page-hero--center' => $centered,
    $vis,
]) {{ $attrs }}>
    @if($isImage)
        <img src="{{ $bg }}" alt="" class="pb-page-hero__bg" @if($first) fetchpriority="high" @endif decoding="async">
        <div class="pb-page-hero__overlay" aria-hidden="true"></div>
    @elseif($isDark)
        <div class="home-hero-mesh pointer-events-none absolute inset-0" aria-hidden="true">
            <div class="home-orb home-orb-1 opacity-40"></div>
            <div class="home-orb home-orb-2 opacity-25"></div>
            <div class="home-grid absolute inset-0 opacity-10"></div>
        </div>
    @endif

    <div class="container-page relative z-10">
        @if(count($crumbs))
            <x-breadcrumbs :items="$crumbs" :dark="$isDark" class="mb-6 !px-0 !py-0" />
        @endif

        <div class="pb-page-hero__inner">
            @if(filled($data['eyebrow'] ?? null))
                <p class="home-kicker pb-page-hero__eyebrow">{{ $data['eyebrow'] }}</p>
            @endif

            <h1 class="home-hero-title pb-page-hero__title">{{ $title }}</h1>

            @if(filled($data['subtitle'] ?? null))
                <p class="home-lead pb-page-hero__subtitle">{{ $data['subtitle'] }}</p>
            @endif

            @if($hasActions)
                <div class="home-hero-actions pb-page-hero__actions">
                    @if(filled($data['primary_text'] ?? null))
                        <x-ui.button :href="$href($data['primary_url'] ?? null, $ctx->bookUrl())" size="lg" class="home-btn" data-track-cta="page-hero">
                            {{ $data['primary_text'] }}
                        </x-ui.button>
                    @endif
                    @if(filled($data['secondary_text'] ?? null))
                        <a href="{{ $href($data['secondary_url'] ?? null, '#') }}" class="home-text-link">{{ $data['secondary_text'] }}</a>
                    @endif
                </div>
            @endif
        </div>
    </div>
</section>