@extends('frontend.layouts.master')
@section('content')

    @if (!empty($homeContent) && $homeContent->count() > 0)
        <div class="hero-block" style="background-image: url({{ asset ($homeContent->hero_image)  }}  )">
            <div class="container">
                <div class="row align-items-center justify-content-start">
                    <div class="col-md-7 aos-init aos-animate" data-aos="fade-right" data-aos-delay="0" data-aos-duration="800">
                        <div class="hero-block-content">
                            <h1 class="hero-block-content-title text-white mb-2">{{ $homeContent->hero_title }}</h1>
                            <p class="hero-block-content-subtitle mb-2"> {!! $homeContent->hero_description !!}</p>
                            <div class="btn-container d-md-block d-none">
                                <div class="d-md-flex align-items-center d-inline-block">
                                    <a class="enquiry nav-btn bg-white" href="#"  data-bs-toggle="modal" data-bs-target="#exampleModal">Enquire Now <i class="bi bi-arrow-right ps-2"></i> </a>
                                    {{-- <a href="{{ route('frontend.product.index') }}" class="nav-btn-outline">Discover
                                        More</a> --}}
                                </div>
                            </div>
                            <div class="btn-container d-md-none d-block">
                                <div class="d-block align-items-center">
                                    <a href="{{ route('enquiry.index') }}"
                                        class="nav-btn me-md-4 w-100 text-center mb-3">Enquire Loans</a>
                                    <a href="{{ route('frontend.product.index') }}"
                                        class="nav-btn-outline w-100 text-center">Discover More</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif

    @if (!empty($homeContent) && $homeContent->count() > 0)
        <div class="about-block section-block d-md-block d-none">
            <div class="container">
                <div class="row">
                    <div class="col-md-6 col-12">
                        <div class="about-block-image pe-4">
                            <img src="{{ $homeContent->about_image }}" class="img-fluid ps-3 pb-3 img-1">
                            <img src="{{ $homeContent->about_image1 }}" class="img-2">
                            <div class="white-box d-flex align-items-center">
                                <div class="number-box">
                                    <h2>{{ $homeContent->about_count }}+</h2>
                                    <p>Years Experience</p>
                                </div>
                                <div class="content-box">
                                    <p> <b> {!! $homeContent->count_description !!} </b> </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 col-12 ps-4">
                        <span class="subtitle">
                            {{ $homeContent->about_title }}
                        </span>
                        <h2 class="about-block-content">
                            Find the most suitable Loans for your benefit
                        </h2>
                        <p class="pt-2">
                            <b> {!! $homeContent->about_longdescription !!}</b>
                        </p>
                        <p class="pt-2">
                            {!! $homeContent->about_description !!}
                        </p>

                        <div class="btn-container">
                            <div class="d-flex align-items-center">
                                <a href="{{ route('frontend.about.index') }}" class="nav-btn me-4">Read More</a>
                                {{-- <div class="d-flex align-items-center">
                          <a href="#" class="playbtn"><i class="bi bi-play-circle"></i></a>
                          <h4 class="ps-3 fw-bold">
                              Play Intro</h4>
                      </div> --}}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif

    <div class="about-block section-block d-md-none d-block">
        <div class="container">
            <div class="row">
                <div class="col-md-6 col-12 mb-5">
                    <div class="about-block-inner-content">
                        <span class="subtitle">
                            Who We Are
                        </span>
                        <h2 class="about-block-content">
                            Find the most suitable mortgage for your ideal property
                        </h2>
                        <b class="bold-font">Scelerisque natoque mauris augue tempus integer. Habitant dis facilisis
                            senectus
                            dapibus platea congue
                            volutpat.</b>
                        <p class="pt-2">
                            Morbi eget maximus habitasse id malesuada mi hendrerit. Magnis volutpat mi consectetur etiam
                            suspendisse
                            pellentesque nostra odio. Ridiculus inceptos eleifend dolor porttitor orci natoque
                            penatibus.
                        </p>
                        <p class="pb-2">
                            Magna non dolor facilisis sodales proin. Lobortis sagittis imperdiet litora laoreet erat
                            vivamus habitasse
                            at malesuada.
                        </p>
                        <div class="btn-container">
                            <div class="d-flex align-items-center">
                                <a class="nav-btn me-4">Get Free Quote</a>
                                <div class="d-flex align-items-center">
                                    <a href="#" class="playbtn"><i class="bi bi-play-circle"></i></a>
                                    <h4 class="ps-3 fw-bold">
                                        Play Intro</h4>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 col-12">
                    <div class="about-block-image pe-md-4">
                        <img src="{{ asset('frontend/assets/image/about.jpg') }}" class="img-fluid ps-3 pb-3 img-1">
                        <img src="{{ asset('frontend/assets/image/about2.jpg') }}" class="img-2">
                        <div class="white-box d-flex align-items-center">
                            <div class="number-box">
                                <h2>20+</h2>
                                <p>Years Experience</p>
                            </div>
                            <div class="content-box">
                                <p>Vitae lorem risus venenatis facilisis mattis curabitur porttitor platea. Volutpat
                                    fringilla sapien
                                    fusce lectus urna placerat.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="what-we-offer section-block">
        <div class="container">
            @foreach ($serviceParent as $index => $parentService)
                <div class="row">
                    <div class="col-md-12">
                        <div class="mb-5">
                            <div class="section-header mb-4 text-start">
                                <div class="row align-items-center">
                                    <div class="col-md-8">
                                        <h4 class="fw-bold mb-0 text-primary">{{ $parentService->name }}</h4>
                                    </div>
                                    <div class="col-md-4">
                                        <div class="d-flex justify-content-end">
                                            <a class="nav-btn small py-2 px-3" href="{{ route('frontend.service.index', $parentService->slug) }}">View All</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
    
                            @if ($index == 0)
                                <div class="swiper_loan swiper">
                                    <div class="swiper-wrapper">
                                        @foreach ($service as $item)
                                            @if ($item->parent_service === $parentService->id)
                                                <div class="swiper-slide">
                                                    <a href="{{ route('frontend.service-details.index', $item->slug) }}" class="text-dark">
                                                        <div class="service-card-one">
                                                            <div class="service-card-one-block-img">
                                                                <img src="{{ asset($item->image) }}" class="img-fluid rounded-2">
                                                            </div>
                                                            <div class="service-card-one-content">
                                                                <h3 class="service-card-one-title d-inline-block mb-0">
                                                                    {{ $item->title }}
                                                                </h3>
                                                            </div>
                                                        </div>
                                                    </a>
                                                </div>
                                            @endif
                                        @endforeach
                                    </div>
                                    <div class="swiper-button-prev"></div>
                                    <div class="swiper-button-next"></div>
                                </div>
    
                            @elseif ($index == 1)
                                <div class="swiper_loan_one swiper">
                                    <div class="swiper-wrapper">
                                        @foreach ($service as $item)
                                            @if ($item->parent_service === $parentService->id)
                                                <div class="swiper-slide">
                                                    <a href="{{ route('frontend.service-details.index', $item->slug) }}" class="text-dark">
                                                        <div class="service-card-block">
                                                            <div class="service-card-block-img">
                                                                <img src="{{ asset($item->image) }}" class="img-fluid">
                                                            </div>
                                                            <div class="service-card-block-content py-4">
                                                                <h3 class="service-card-block-content-title mb-0">
                                                                    {{ $item->title }}
                                                                </h3>
                                                            </div>
                                                        </div>
                                                    </a>
                                                </div>
                                            @endif
                                        @endforeach
                                    </div>
                                    <div class="swiper-button-prev"></div>
                                    <div class="swiper-button-next"></div>
                                </div>
                                
                            @else
                            <div class="swiper_loan_two swiper">
                                <div class="swiper-wrapper">
                                    @foreach ($service as $item)
                                        @if ($item->parent_service === $parentService->id)
                                            <div class="swiper-slide">
                                                <a href="{{ route('frontend.service-details.index', $item->slug) }}" class="text-dark">
                                                    <div class="service-card-one">
                                                        <div class="service-card-one-block-img">
                                                            <img src="{{ asset($item->image) }}" class="img-fluid rounded-2">
                                                        </div>
                                                        <div class="service-card-one-content">
                                                            <h3 class="service-card-one-title d-inline-block mb-0">
                                                                {{ $item->title }}
                                                            </h3>
                                                        </div>
                                                    </div>
                                                </a>
                                            </div>
                                        @endif
                                    @endforeach
                                </div>
                                <div class="swiper-button-prev"></div>
                                <div class="swiper-button-next"></div>
                            </div>
                                @endif
                           
                        </div>
                    </div>
                </div>
            @endforeach
        </div>
    </div>
    
    
    

    <!-- <div class="Testimonial-block pb-5 pt-5">
                <div class="container">
                <div class="row pb-5">
                  <div class="col-lg-12">
                    <div class="testimonial-section-text text-center">
                      <h2 class="testimonial-block-title text-white p-0">Explore Clients Review</h2>
                      <p class="testimonial-block-sub-title text-white p-0 m-0">On the other hand we denounce with righteous
                        indignation
                        and dislike<br> men who are so beguiled and demoralized</p>
                    </div>
                  </div>
                </div>
                <div class="row">
                  <div class="col-lg-4 mb-md-0 mb-4">
                    <div class="testimonial-section-card-main bg-white">
                      <div class="testimonial-section-card-icon">
                        <i class="bi bi-quote"></i>
                      </div>
                      <div class="testimonial-section-card-inner-text">
                        <p> Lorem ipsum dolor sit amet, nsectetur<br> adipiscing elit, sed do eiusmod
                          mpor<br> incididunt ut labore et dolore magna<br> aliqua. Quis ipsum suspendisse
                          trices<br> raviisus commodo viverra </p>
                      </div>
                      <div class="d-flex">
                        <div class="testimonial-section-card-inner-image">
                          <img class="testimonial-section-img" src="assets/image/testimonial-1.png" class="card-img-top"
                            alt="...">
                        </div>

                        <div class="testimonial-section-card-inner-name">
                          <h3>Arnald Logan</h3>
                          <span>Managing Directer</span>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="col-lg-4 mb-md-0 mb-4">
                    <div class="testimonial-section-card-main bg-white">
                      <div class="testimonial-section-card-icon">
                        <i class="bi bi-quote"></i>
                      </div>
                      <div class="testimonial-section-card-inner-text">
                        <p> Lorem ipsum dolor sit amet, nsectetur<br> adipiscing elit, sed do eiusmod
                          mpor<br> incididunt ut labore et dolore magna<br> aliqua. Quis ipsum suspendisse
                          trices<br> raviisus commodo viverra </p>
                      </div>
                      <div class="d-flex">
                        <div class="testimonial-section-card-inner-image">
                          <img class="testimonial-section-img" src="assets/image/testimonial-2.png" class="card-img-top"
                            alt="...">
                        </div>

                        <div class="testimonial-section-card-inner-name">
                          <h3>Istiak Logan</h3>
                          <span>Managing Directer</span>
                        </div>
                      </div>
                    </div>
                  </div>
                  <div class="col-lg-4 mb-md-0 mb-4">
                    <div class="testimonial-section-card-main bg-white">
                      <div class="testimonial-section-card-icon">
                        <i class="bi bi-quote"></i>
                      </div>
                      <div class="testimonial-section-card-inner-text">
                        <p> Lorem ipsum dolor sit amet, nsectetur<br> adipiscing elit, sed do eiusmod
                          mpor<br> incididunt ut labore et dolore magna<br> aliqua. Quis ipsum suspendisse
                          trices<br> raviisus commodo viverra </p>
                      </div>
                      <div class="d-flex">
                        <div class="testimonial-section-card-inner-image">
                          <img class="testimonial-section-img" src="assets/image/testimonial-1.png" class="card-img-top"
                            alt="...">
                        </div>
                        <div class="testimonial-section-card-inner-name">
                          <h3>Stifan Logan</h3>
                          <span>Managing Directer</span>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                </div>
                </div> -->

    <div class="scheme-section section-block bg-light">
        <div class="container">
            <div class="row align-items-center mb-4 d-md-block d-md-flex d-none">
                <div class="col-md-10">
                    <div class="what-we-block-text">
                        <span class="subtitle">
                            Our Services
                        </span>
                        <h2 class="about-block-content pt-2">
                            <b> What Services </b> we provide
                        </h2>
                    </div>
                </div>
                {{-- <div class="col-md-2">
                    <div class="d-flex justify-content-end">
                        <a class="nav-btn" href="{{ route('frontend.scheme.index') }}">View All</a>
                    </div>
                </div> --}}
            </div>
            <div class="row">
                    <div class="col-md-6 mb-md-4 mb-3">
                        <div class="scheme-card">
                            <div class="scheme-card-img">
                                <img src="https://img.freepik.com/free-vector/people-analyzing-growth-charts_23-2148866843.jpg?t=st=1709879232~exp=1709882832~hmac=a3c4e353c86248ecdd5f81b5b858ad6be78166998985611a81f788bdaf05e391&w=996" class="img-fluid">
                            </div>
                            <div class="scheme-card-content py-3 px-3 pb-4 text-left">
                                <h4 class="fs-5 fw-bold">Project Rport</h4>
                                Most of the business’s loan or funding requests are rejected because of inappropriate Business Project Reports. We offer 1500+ Business Project Reports and Professional Support & Guidance to the startup business and provide them with the right guidance to commence their business.
                                <!--<a class="scheme-btn pb-2 mt-3"-->
                                <!--    href="{{ route('frontend.project-report.index') }}">View More</a>-->
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6 mb-md-4 mb-3">
                        <div class="scheme-card">
                            <div class="scheme-card-img">
                                <img src="https://img.freepik.com/free-vector/people-analyzing-growth-charts_23-2148864321.jpg?t=st=1709879974~exp=1709883574~hmac=866589e89ac3cedeaf00a47289e55cb92c59cf776373e75e87e43d58f878c029&w=996" class="img-fluid">
                            </div>
                            <div class="scheme-card-content py-3 px-3 pb-4 text-left">
                                <h4 class="fs-5 fw-bold">Coustmized Project Rport</h4>
                                A customized bankable project report refers to a detailed document that outlines the feasibility, viability, and financial aspects of a specific project, with the goal of securing funding from a bank or financial institution. 
                                <a class="scheme-btn pb-2 mt-3"
                                    href="{{ route('frontend.customized-project-report.index') }}">View More</a>
                            </div>
                        </div>
                    </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered mt-5">
          <div class="modal-content">
            <div class="modal-body">
                <div class="p-3 bg-white enquiry">
                    <h2 class="fw-bold pt-3 pb-3 m-0 fs-4">Enquire Now</h2>
                    <form action="{{ route('enquiry.store') }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        <div class="row">
                            <div class="col-sm-6">
                                <input type="text" name="name" class="form-control mb-4" placeholder="Your Name *"
                                    required="">
                            </div>
                            <div class="col-sm-6">
                                <input type="email" name="email" class="form-control mb-4"
                                    placeholder="Your Email *" required="">
                            </div>
                            <div class="col-sm-6">
                                <input type="text" name="number" class="form-control mb-4"
                                    placeholder="Your Phone *" required="">
                            </div>
                            <div class="col-sm-6">
                                <input type="text" name="address" class="form-control mb-4"
                                    placeholder="Your Address" required="">
                            </div>
                            <div class="col-sm-12 mb-3">
                                <select class="form-select form-control" name="loan_type" id="loan_type">
                                    <option value="">Select Loan</option>
                                    <option value="MSME Business Loans">
                                        MSME Business Loans
                                    </option>
                                    <option value="Subsidy & Incentives">Subsidy & Incentives</option>
                                    <option value="Retail Loans">Retail Loans</option>
                                    <option value="Turnkey Projects">Turnkey Projects</option>
                                </select>
                            </div>
                            <div class="col-sm-12 ">
                                <textarea name="message" cols="40" rows="4" class="form-control mb-4" placeholder="Message"
                                    required=""></textarea>
                            </div>
    
                            <div class=" send-message">
                                <button type="submit" class="enquiries nav-btn w-100 border-0 p-3 fs-5">Send Message</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
          </div>
        </div>
      </div>
@endsection