<section class="w-full pb-16 best-feature-sec bg-no-repeat bg-cover bg-center" style="background-image: url('{{ asset('site/Sites/images/best-feature-bg.png') }}');">
    <div class="w-full mx-auto px-0 grid grid-cols-12 items-center pr-15">
        <div class="lg:col-span-6 col-span-12 relative left-sec">
            <!-- Image -->
            <div class=" overflow-hidden">
                <img src="{{ asset('site/Sites/images/union.png') }}"
                    alt="Tutor"
                    class="w-full object-cover ">
            </div>

            <!-- Image -->
            <div class=" overflow-hidden absolute lg:top-35 sm:top-52 top-10 xldesk:left-90 2xl:left-110 lg:left-80 sm:left-90 left-50 md:left-125">
                <img src="{{ asset('site/Sites/images/tutera.png') }}"
                    alt="Tutor"
                    class="xldesk:w-[300px] 2xl:w-full sm:w-[250px] w-[150px]  object-cover">
            </div>

            <div class="text pt-10 lg:mb-0 mb-10 xldesk:pl-40 sm:pl-20 pl-10 text-center lg:text-start">
                <h2 class="text-[25px]   sm:text-[35px] lg:text-[45px] xl:text-[50px] 2xl:text-[60px] fo-n font-semibold   text-[#fff] leading-tight">
                    Find The <span class="text-[#0EB972] underline underline-offset-8  font-bold ">Best Features</span> <br class="lg:block hidden"> Of Tutera Learing LLC
                </h2>
               
            </div>
        </div>
        <div class="lg:col-span-6 col-span-12 right-sec sm:mx-0 mx-auto   2xl:pl-40 sm:pl-32 pl-10  2xl:mt-0 lg:mt-20">
            <div class="grid grid-cols-12">
                <div class="sm:col-span-6 col-span-12 sm:pb-30 pb-10">
                    <div class="box">
                        <div class=" overflow-hidden">
                            <img src="{{ asset('site/Sites/images/check-icon.png') }}"
                                alt="Tutor"
                                class="object-cover sm:mx-0 mx-auto">
                        </div>
                        <h2 class="text-[#fff] text-[26px] sm:text-[30px] font-bold fm-xb pt-5 leading-8 sm:text-start text-center">Learn More <br class="lg:block hidden"> Anywhere</h2>
                    </div>
                </div>
                <div class="sm:col-span-6 col-span-12 sm:pb-30 pb-10">
                    <div class="box sm:mx-0 mx-auto">
                        <div class=" overflow-hidden">
                            <img src="{{ asset('site/Sites/images/check-icon.png') }}"
                                alt="Tutor"
                                class="object-cover sm:mx-0 mx-auto">
                        </div>
                        <h2 class="text-[#fff] text-[26px] sm:text-[30px] font-bold fm-xb pt-5 leading-8 sm:text-start text-center">Expert <br class="lg:block hidden"> Instructor</h2>
                    </div>
                </div>
                <div class="sm:col-span-6 col-span-12 sm:pb-30 pb-10">
                    <div class="box">
                        <div class=" overflow-hidden">
                            <img src="{{ asset('site/Sites/images/check-icon.png') }}"
                                alt="Tutor"
                                class="object-cover sm:mx-0 mx-auto">
                        </div>
                        <h2 class="text-[#fff] text-[26px] sm:text-[30px] font-bold fm-xb pt-5 leading-8  sm:text-start text-center">Team <br class="lg:block hidden"> Management</h2>
                    </div>
                </div>
                <div class="sm:col-span-6 col-span-12 sm:pb-30 pb-10">
                    <div class="box">
                        <div class=" overflow-hidden">
                            <img src="{{ asset('site/Sites/images/check-icon.png') }}"
                                alt="Tutor"
                                class="object-cover sm:mx-0 mx-auto">
                        </div>
                        <h2 class="text-[#fff] text-[26px] sm:text-[30px] font-bold fm-xb pt-5 leading-8 sm:text-start text-center">Course <br class="lg:block hidden"> Planing</h2>
                    </div>
                </div>
                <div class="sm:col-span-6 col-span-12">
                    <div class="box">
                        <div class=" overflow-hidden">
                            <img src="{{ asset('site/Sites/images/check-icon.png') }}"
                                alt="Tutor"
                                class="object-cover sm:mx-0 mx-auto">
                        </div>
                        <h2 class="text-[#fff] text-[26px] sm:text-[30px] font-bold fm-xb pt-5 leading-8 sm:text-start text-center">Teacher <br class="lg:block hidden"> Monitoring</h2>
                    </div>
                </div>
                <div class="sm:col-span-6 col-span-12 sm:mt-0 mt-10">
                    <div class="box">
                        <div class=" overflow-hidden">
                            <img src="{{ asset('site/Sites/images/check-icon.png') }}"
                                alt="Tutor"
                                class="object-cover sm:mx-0 mx-auto">
                        </div>
                        <h2 class="text-[#fff] text-[26px] sm:text-[30px] font-bold fm-xb pt-5 leading-8 sm:text-start text-center">24/7 Strong <br class="lg:block hidden"> Support</h2>
                    </div>
                </div>

            </div>
        </div>
    </div>
</section>