@aware(['page'])
<div>
    <div class="theme-max-w mx-auto px-5 my-10">
        <div class="grid grid-cols-1 md:grid-cols-2">
            <div class="{{$style == 'imagecontent;' ? 'md:order-1':'md:order-2'}}">
                <img class="w-full h-full object-cover {{$style == 'imagecontent;' ? 'md:rounded-l-2xl':'md:rounded-r-2xl'}} lazy" src="" data-src="{{ asset('storage/'.$bgImage) }}" alt="" />
            </div>
            <div class="theme-bg-blue border border-neutral-300 overflow-hidden flex {{$style == 'imagecontent;' ? 'md:rounded-r-2xl':'md:rounded-l-2xl'}} {{$style == 'imagecontent;' ? 'md:order-2':'md:order-1'}}">
                <div class="px-6 py-8 lg:px-10 my-auto">
                    <div class="text-white text-4xl lg:text-4xl font-bold mb-3">{{ $title }}</div>
                    <div class="text-zinc-200 text-base lg:text-lg font-normal mb-3">{!! $description !!}</div>
                    <a href="{{ $link }}">
                        <button class="mb-3 mt-6 bg-white rounded-md text-zinc-900 px-3 py-2 text-lg font-medium hover:bg-gray-300 transition">{{ $buttonText }}</button>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>