@extends('front.include.app')
@section('content')

    <section class="main-slider p-0" id="mainSlider">
        <div class="container">
            <div class="row align-items-center justify-content-between">
                <div class="col-md-3">
                    <div class="right-bnr">
                        <figure>
                            <img src="{{ $data->CmsImage('banner_image_1') }}" class="img-fluid bnrimg1" alt="">
                            <img src="{{ $data->CmsImage('banner_image_2') }}" class="img-fluid bnrimg2" alt="">
                            <img src="{{ $data->CmsImage('banner_image_3') }}" class="img-fluid bnrimg3" alt="">
                        </figure>
                    </div>
                </div>
                <div class="col-lg-5">
                    <div class="slideOne">
                        <h1 data-swiper-parallax="-200">{{ $HomePage->banner_title ?? '' }}</h1>
                        <h4>{{ $HomePage->banner_subtitle ?? '' }}</h4>
                        <a href="{{ route('front.art.collections') }}" class="themeBtn">{{ $HomePage->banner_btn  ?? '' }}</a>
                    </div>
                </div>
                <div class="col-md-3">
                    <div class="left-bnr">
                        <figure>
                            <img src="{{ $data->CmsImage('banner_image_4') }}" class="img-fluid bnrimg4" alt="">
                            <img src="{{ $data->CmsImage('banner_image_5') }}" class="img-fluid bnrimg5" alt="">
                            <img src="{{ $data->CmsImage('banner_image_6') }}" class="img-fluid bnrimg6"  alt="">
                        </figure>
                    </div>
                </div>
            </div>
        </div>

    </section>


{{--    <section class="border-heading">--}}
{{--        <div class="container-fluid">--}}
{{--            <div class="row justify-content-center">--}}
{{--                <div class="col-md-12" data-aos="fade-up">--}}
{{--                    <h4>{{ $HomePage->heading_between_2_sec  ?? '' }}  </h4>--}}
{{--                </div>--}}
{{--            </div>--}}
{{--        </div>--}}
{{--    </section>--}}

{{--    <section class="about-section">--}}
{{--        <div class="container">--}}
{{--            <div class="row align-items-center">--}}
{{--                <div class="col-md-4" data-aos="fade-up">--}}
{{--                    <figure>--}}
{{--                        <img src="{{ $data->CmsImage('about_me_sec_img') }}" class="img-fluid" alt="">--}}
{{--                    </figure>--}}
{{--                </div>--}}
{{--                <div class="col-md-7" data-aos="fade-up">--}}
{{--                    <div class="about-content">--}}
{{--                        <h4>{{ $HomePage->about_me_sec_heading  ?? '' }}</h4>--}}
{{--                        <h2>{{ $HomePage->about_me_sec_sub_title  ?? '' }}</h2>--}}
{{--                        <p>{{ $HomePage->about_me_sec_des  ?? '' }}</p>--}}
{{--                        <a href="about.php" class="themeBtn">{{ $HomePage->about_me_sec_btn  ?? '' }}</a>--}}
{{--                    </div>--}}
{{--                </div>--}}
{{--            </div>--}}
{{--        </div>--}}
{{--    </section>--}}


    <section class="ladies-abstract">
        <div class="container-fluid">
            <div class="abstract-head" data-aos="fade-up">
                <h4>{{ $HomePage->explore_the_work_sec_heading  ?? '' }}</h4>
                <h2>{{ $HomePage->explore_the_work_sec_sub_title  ?? '' }}</h2>
            </div>
            <div class="row align-items-center">
                @foreach($products as $product)
                <div class="col-lg-3 col-sm-6" data-aos="fade-up">
                    <div class="ladies-wrap">
                        <figure>
                            <img src="{{ $product->productImage('product_image') }}" class="img-fluid" alt="">
                        </figure>
                        <div class="ladies-cntnt">
                            <h3>{{ $product->name ?? ''  }}</h3>
                            <h3>Price : $ {{ $product->price ?? ''  }}</h3>
                            <h3>Dimension : {{$product->dimention ? : ''}}</h3>
                            <p>{{ $product->description ?? ''  }}</p>
                            <a href="{{ route('product.detail', ['slug' => $product->slug]) }}" class="themeBtn">buy now</a>
                        </div>
                    </div>
                </div>
                @endforeach

                <div class="col-md-12 text-center" data-aos="fade-up">
                    <a href="{{ route('front.art.collections') }}" class="themeBtn">View All</a>
                </div>
            </div>
        </div>
    </section>


    <section class="high-resolution bg--gray">
        <div class="container">
            <div class="row align-items-center justify-content-between">
                <div class="col-md-6" data-aos="fade-up">
                    <h2>High-resolution prints are now available. Contact Marilyn for pricing and additional
                        information.
                    </h2>
                </div>
                <div class="col-md-5" data-aos="fade-up">
                    <figure>
                        <img src="{{ $data->CmsImage('high_resolution_sec_img_1') }}" class="img-fluid high1" alt="">
                        <img src="{{ $data->CmsImage('high_resolution_sec_img_2') }}" class="img-fluid high2" alt="">
                        <img src="{{ $data->CmsImage('high_resolution_sec_img_3') }}" class="img-fluid high3" alt="">
                        <img src="{{ $data->CmsImage('high_resolution_sec_img_4') }}" class="img-fluid high4" alt="">
                    </figure>
                </div>
            </div>
        </div>
    </section>



    {{-- <section class="insta-section">
        <div class="container">
            <h2>{{ $HomePage->instagram_section_heading  ?? '' }}</h2>
            <div class="row">
                <div class="col-md-12">
                    <div class="swiper instaSlider" data-aos="fade-up">
                        <div class="swiper-wrapper">
                            @foreach ($insta as $post)
                                <div class="swiper-slide">
                                    <figure>
                                        <img src="{{ $post->getFirstMediaUrl('images') }}" class="img-fluid" alt="{{ $post->name }}">
                                    </figure>
                                </div>
                            @endforeach
                        </div>
                    </div>
                    <div class="instbtn" data-aos="fade-up">
                        <a href="{{route('front.about')}}" class="themeBtn"> <i class="fab fa-instagram"></i> Instagram</a>
                    </div>
                </div>
            </div>

        </div>
    </section> --}}

@endsection