<section class="w-full relative -mb-32 z-20">
    <div class="max-w-[1550px] sm:w-[90%] w-[95%] mx-auto px-6">
        <div
            class="sm:rounded-[40px] rounded-2xl overflow-hidden bg-cover bg-center relative flex items-center justify-center sm:h-52 h-[150px] md:h-[300px] "
            style="background-image: url('{{ asset('site/Sites/images/subscribe-bg.png') }}');">
            <div class="relative z-10 flex flex-col items-center   text-center">
                <h2 class="text-white text-lg md:text-3xl  2xl:text-6xl fo-n font-semibold mb-8">
                    Subscribe To News Letter
                </h2>
                <form action="{{route('news-letter')}}" method="post">
                    @csrf
               
                <div class="flex items-center max-w-xl mx-auto bg-transparent border border-[#FFFFFF] rounded-full md:w-[387px] sm:w-[300px] w-[300px] px-2 py-1">
                    <input
                        type="email"
                        placeholder="Email Address" name="email" value="{{old('email')}}"
                        class="flex-1 bg-transparent  text-white placeholder-white/70 focus:outline-none sm:px-4 px-2" />
                       
                    <button type="submit" class="w-12 sm:h-12 h-10 p-4 cursor-pointer    rounded-full  bg-yellow-400 flex items-center justify-center text-black hover:bg-yellow-500 transition">
                        <i class="fa-solid fa-arrow-right"></i>
                    </button>
                </div>
                 @error('email')
                            <span class="text-white">{{$message}}</span>
                        @enderror
                </form>
            </div>
        </div>
    </div>
</section>
<footer class="2xl:pt-44 pt-36 2xl:pb-10 pb-3 xl:px-28 sm:px-24 px-10 text-white sm:w-[95%] w-full mx-auto bg-cover sm:rounded-tr-[80px] rounded-tr-[10px] rounded-tl-[10px] sm:rounded-tl-[80px]" style="background-image: url('{{ asset('site/Sites/images/bg-footer.png') }}');">
    <div class="max-w-[1700px] mx-auto w-full justify-between flex lg:flex-row flex-col  gap-12">
        <div class="lg:w-[35.33%]  ">
            <div class="flex items-center sm:justify-start  justify-center gap-3 mb-4">
                <img src="{{ asset('site/Sites/images/logo-footer.png') }}" alt="Tutera Learning" class="2xl:h-44 h-32">
            </div>
            <p class="text-[#CECECE] 2xl:text-[18px] text-[16px] leading-relaxed poppins ">
                Our tutoring services are designed to equip students and professionals
                with the skills they need to excel in their <br class="lg:block hidden"> academic and career journeys.
            </p>
        </div>
     
        <div class="sm:w-[424px] flex justify-end lg:mt-10 lg:mb-0 mb-10 ">
          <div class="">
              <h4 class="2xl:text-[28px] sm:text-[22px] text-xl fo-m font-medium mb-4 text-[#FFFFFF]">Feel free to share your question</h4>
            <ul class="space-y-3 text-[20px] fm-n text-[#FFFFFF]">
                <li class="flex items-center gap-2 2xl:text-[20px] text-[16px]">
                    <a href="tel:3213524107" class="flex items-center gap-2 -ml-1">
                        <img src="{{ asset('site/Sites/images/save-icon.png') }}" alt="Call" />
                        <span class="">3213524107 (Available 24/7)</span>
                    </a>
                </li>
 
                <li class="flex items-center gap-2 2xl:text-[20px] text-[16px]">
                    <a href="mailto:tuteralearning@gmail.com" class="flex items-center gap-2">
                        <img src="{{ asset('site/Sites/images/email-icon.png') }}" alt="Email" />
                        <span class="">tuteralearning@gmail.com</span>
                    </a>
                </li>
 
                <li class="flex items-start gap-2 2xl:text-[20px] text-[16px]">
                    <a
                        href="https://www.google.com/maps/search/?api=1&query=255+S+Orange+Ave+STE+104+Orlando+FL+32801"
                        target="_blank"
                        class="flex items-start gap-3">
                        <img src="{{ asset('site/Sites/images/location-icon.png') }}" alt="Location" />
                        <span>
                            255 S Orange Ave STE 104<br>
                            #2146, Orlando, FL 32801
                        </span>
                    </a>
                </li>
 
            </ul>
 
          </div>
 
 
        </div>
 
 
    </div>
 
    <div class="max-w-[1700px] mx-auto  flex justify-between sm:flex-row flex-col  ">
 
        <div class="flex items-end w-[50%] justify-between  ">
            <ul class="flex flex-wrap sm:flex-row flex-col 2xl:gap-8 gap-4 2xl:text-[20px] text-[16px]   font-semibold w-full justify-between">
                <li><a href="{{url('/')}}" class=" transition ">Home</a></li>
                <li><a href="{{url('about')}}" class=" transition">About</a></li>
                <li><a href="{{url('find-tutor')}}"" class=" transition">Find a Tutor</a></li>
                <li><a href="{{url('blogs')}}" class=" transition">Blogs</a></li>
                <li><a href="{{url('contact-us')}}" class=" transition">Contact Us</a></li>
            </ul>
        </div>
        <div class="flex gap-4 mt-6">
            <a href="https://www.facebook.com/profile.php?id=61573678582701" class="w-10 h-10 border border-[#FFFFFF] rounded-full flex items-center justify-center transition"> <img src="{{ asset('site/Sites/images/facebook.png')}}" /></a>
            <a href="https://www.instagram.com/tuteralearning/" class="w-10 h-10 border border-[#FFFFFF] rounded-full flex items-center justify-center transition"><img src="{{ asset('site/Sites/images/linkdin.png') }}" /></a>
            <a href="https://www.youtube.com/@Tuteralearning" class="w-10 h-10 border border-[#FFFFFF] rounded-full flex items-center justify-center transition"><img src="{{ asset('site/Sites/images/youtube.png') }}" /></a>
            <a href="https://www.linkedin.com/company/tutera-learning" class="w-10 h-10 border border-[#FFFFFF] rounded-full flex items-center justify-center transition"><img src="{{ asset('site/Sites/images/insta.png') }}" /></a>
        </div>
    </div>
    <div class="border-t w mx-auto border-[#FFFFFF] 2xl:mt-10 mt-5"></div>
 
    <div class="max-w-[1700px] mx-auto  mt-6 flex flex-col md:flex-row items-center justify-between text-sm text-white/60 gap-4">
 
        <p class=' text-[#FFFFFF] text-[16px] fm-n font-semibold'>© {{ date('Y') }} ALL RIGHTS RESERVED.</p>
        <div class="flex sm:flex-row flex-wrap sm:justify-center justify-center  gap-6">
            <a href="{{route('safety-and-security')}}" class="text-[#FFFFFF] fm-m text-[16px]">Safety And Security Policy</a>
            <a href="{{route('terms')}}" class="text-[#FFFFFF] fm-m text-[16px]">Terms Of Use</a>
            <a href="{{route('privacy-policy')}}" class="text-[#FFFFFF] fm-m text-[16px]">Privacy Policy</a>
            <a href="{{route('cookie-policy')}}" class="text-[#FFFFFF] fm-m text-[16px]">Cookie Policy</a>
        </div>
 
    </div>
</footer>