<section id="Process" class="noice-overlay">
    <div class="xl:pt-150 sm:py-80 py-40">
        <div class="container">
            <div class="grid grid-cols-12 gap-50">
                @php
                $content_class = $args['image_position'] == 'left' ? 'order-1' : '';
                
                @endphp
                <div class="lg:col-span-8 col-span-12 {{ $content_class }}">
                    <div class="sm:mb-40 mb-20 xl:max-w-700 pxl-heading-scroll-effect">
                        @if(isset($args['subtitle']) && $args['subtitle'] != '')
                        <span class="text-xl dark:text-white mb-5 block">{{ $args['subtitle'] }}</span>
                        @endif
                        @if(isset($args['title']) && $args['title'] != '')
                        <h2 class="md:text-[50px]/65 text-4xl font-semibold mb-10 heading-text">{{ $args['title'] }}</h2>
                        @endif
                        @if(isset($args['description']) && $args['description'] != '')
                        <p class="sm:text-xl text-lg">{{ $args['description'] }}</p>
                        @endif
                    </div>
                    <ul class="flex flex-wrap items-center">
                        @php
                        $content_list = explode(',', @$args['content_list']);
                        @endphp
                        @foreach($content_list as $value)
                        <li class="sm:w-1/2 w-full relative py-4.5 ps-38 sm:text-xl text-base dark:text-bodytext text-textlight before:content-['\f00c'] before:absolute before:left-0 before:top-1/2 before:-translate-y-1/2 before:size-24 before:leading-24 before:text-center before:text-white before:text-sm before:rounded-full before:font-black before:font-['Font_Awesome_6_Free'] before:bg-tickbg">{{ @$value }}</li>
                        @endforeach
                    </ul>   
                </div>
                <div class="lg:col-span-4 col-span-12">
                    <img src="{{ DzHelper::getStorageImage('storage/magic-editor/'.@$args['image']) }}" alt="">
                </div>
            </div>
        </div>
    </div>
    <img src="images/background/bg6.png" alt="" class="absolute top-[50%] left-[-47%] -z-1 pointer-events-none">
    <img src="images/background/bg10.png" alt="" class="absolute top-[-30%] right-[0%] max-xl:w-[60%] -z-1 pointer-events-none">
</section>