@props([
    'eyebrow' => null,
    'heading' => '',
    'subheading' => null,
    'breadcrumb' => null, // ['label' => url] pairs
    'image' => null,      // accepted for compatibility; not used in the light hero
    'curve' => true,
])

<section class="relative overflow-hidden bg-gradient-to-b from-teal-100 via-teal-50 to-white">
    {{-- Soft organic blobs --}}
    <div class="pointer-events-none absolute inset-0" aria-hidden="true">
        <div class="absolute -right-32 -top-24 h-[26rem] w-[26rem] rounded-full bg-teal-200/50 blur-3xl"></div>
        <div class="absolute -left-24 top-10 h-72 w-72 rounded-full bg-teal-100/60 blur-3xl"></div>
        <svg class="absolute right-0 top-0 h-full w-1/2 text-teal-200/40" viewBox="0 0 400 400" fill="none" aria-hidden="true"><circle cx="320" cy="120" r="180" fill="currentColor" fill-opacity="0.4"/></svg>
    </div>

    <div class="container-x relative py-20 lg:py-24 {{ $curve ? 'lg:pb-32' : '' }}">
        @if ($breadcrumb)
            <nav class="mb-6 flex flex-wrap items-center gap-2 text-xs text-muted" aria-label="Breadcrumb">
                <a href="{{ route('home') }}" class="hover:text-teal-700">Home</a>
                @foreach ($breadcrumb as $label => $url)
                    <span aria-hidden="true" class="text-navy-300">/</span>
                    @if ($url)<a href="{{ $url }}" class="hover:text-teal-700">{{ $label }}</a>@else<span class="font-medium text-ink">{{ $label }}</span>@endif
                @endforeach
            </nav>
        @endif

        @if ($eyebrow)
            <span class="chip">{{ $eyebrow }}</span>
        @endif
        <h1 class="mt-5 max-w-4xl font-display text-4xl font-bold leading-[1.06] text-ink sm:text-5xl lg:text-[3.3rem]">{{ $heading }}</h1>
        @if ($subheading)
            <p class="mt-6 max-w-2xl text-lg leading-relaxed text-muted">{{ $subheading }}</p>
        @endif

        {{ $slot }}
    </div>

    @if ($curve)
        <svg class="absolute -bottom-px left-0 hidden w-full text-white lg:block" viewBox="0 0 1440 64" fill="currentColor" preserveAspectRatio="none" aria-hidden="true"><path d="M0 64h1440V26c-240 26-480 38-720 38S240 52 0 26v38z"/></svg>
    @endif
</section>