<section class="lg:pt-168 pt-40 dark:bg-secondary relative z-1 after:pointer-events-none after:absolute after:-bottom-228 after:-right-40 after:bg-primary after:size-[533.43px] after:blur-[252px] after:rounded-full after:-z-1">
    <div class="container">
        <div class="grid grid-cols-12">
            <div class="xl:col-span-6 col-span-12 self-center md:mt-40">
                @if(isset($args['subtitle']) && $args['subtitle'] != '')
                <span class="dark:text-white text-heading sm:text-2xl text-lg">{{ $args['subtitle'] }}</span>
                @endif
                <h2 class="2xl:text-7xxl xl:text-5xl lg:text-4xxl sm:text-4xl text-3xl font-medium dark:text-white lg:mb-32 mb-12 headline">{{ isset($args['title']) ? $args['title'] : '' }}</h2>
                @if(isset($args['description']) && $args['description'] != '')
                <p class="dark:text-white/60 text-black/60 3xl:text-3xl/50 sm:text-2xxl/50 text-xl font-extralight">{{ $args['description'] }}</p>
                @endif
            </div>
            <div class="xl:col-span-6 col-span-12">
                <div class="flex items-center justify-center mt-65 2xl:ml-60">
                    <img class="rounded-2lg relative z-1 left-20 -top-12 rotate-[-22.15deg] xl:w-[40%] w-[30%] wow lightSpeedIn" data-wow-delay="0.2s" src="{{ DzHelper::getStorageImage('storage/magic-editor/'.@$args['image_2']) }}" alt="img">
                    <img class="rounded-2lg rotate-[13.4deg] xl:w-[60%] w-[50%] wow lightSpeedIn" src="{{ DzHelper::getStorageImage('storage/magic-editor/'.@$args['image_1']) }}" alt="img" data-wow-delay="0.2s">
                </div>	
            </div>
        </div>
    </div>
</section>