@php
    $imageData = ResponsivePics::get_image_data($image, 'xs:300, md:700, lg:1440', 0, '', false, false);
@endphp

<header class="ctn bg-dark/80 pb-46 relative pt-5 text-white">
    <div class="{{ $grid }} {{ $white ? 'text-white' : '' }} relative z-20 items-center">
        <div class="col-span-12 sm:col-span-10">
            @include('partials.components.breadcrumb')
            @include('partials.components.huge-title', ['title' => $title, 'class' => 'font-bold mt-36'])
            @if ($intro ?? false)
                @include('partials.components.wysiwyg', [
                    'text' => $intro,
                    'class' => 'text-lg',
                ])
            @endif

            @if ($ctas ?? false)
                @include('partials.components.ctas', [
                    'class' => 'mt-8! first:mt-0!',
                ])
            @endif
        </div>
    </div>
    <div class="bg-dark absolute bottom-0 left-0 -z-10 h-full w-full"
        {{ $imageData ?? null ? 'style=background-image:url(' . $imageData['sources'][0]['source1x'] . ');background-size:cover;background-position:center;' : '' }}>
    </div>
</header>