@extends('layouts.front.front')
@section('maincontent')
 <section class="slick-slider-custom">   
      <div id="my-pics" class="carousel slide" data-ride="carousel">
         <ol class="carousel-indicators">
            <li data-target="#my-pics" data-slide-to="0" class="active"></li>
            <li data-target="#my-pics" data-slide-to="1"></li>
            <li data-target="#my-pics" data-slide-to="2"></li>
            <li data-target="#my-pics" data-slide-to="3"></li>
           
         </ol>

      <div class="carousel-inner" role="listbox">
         <div class="item active">
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img src="{{ asset('front-shop/images/banner/banner1.webp') }}" alt="Sunset over beach">
            </a>
         </div>
         <div class="item" >
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img src="{{ asset('front-shop/images/banner/banner2.webp') }}" alt="Sunset over beach">
            </a>
         </div>
         <div class="item" >
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img src="{{ asset('front-shop/images/banner/banner3.webp') }}" alt="Sunset over beach">
            </a>
         </div>
         <div class="item ">
            <a href="{{ route('front.shop.shop-by-category', ['c1' => 'kurta-set']) }}">
               <img loading="lazy" src="{{ asset('front-shop/images/banner/banner4.webp') }}" alt="Sunset over beach">
            </a>
         </div>
      
         </div>
         <a class="left carousel-control" href="#my-pics" role="button" data-slide="prev">
            <span class="icon-prev" aria-hidden="true"></span>
            <span class="sr-only">Previous</span>
         </a>
         <a class="right carousel-control" href="#my-pics" role="button" data-slide="next">
            <span class="icon-next" aria-hidden="true"></span>
            <span class="sr-only">Next</span>
         </a>
         </div>
      </div>
 </section> 

  <section class="static-section">
     <div class="container">
      <h1 class="text-center seperator">NEW ARRIVALS</h1>
       <div class="static-slide">
         <a href="#"><img loading="lazy" src="{{ asset('front-shop/images/show-ban-slide.jpg') }}" align="show-ban-slide"></a>
       </div>
     </div>
  </section>

  <section class="static-section">
   <div class="container">
   
     <div class="static-slide">
       <a href="#"><img loading="lazy" src="{{ asset('front-shop/images/Discount Offer Banner.webp') }}" align="show-ban-slide"></a>
     </div>
   </div>
</section>

<section class="container">
      <div class="layout-heading justify-space-between align-center">
          <h2 class="text-center seperator">SHOP BY CATEGORIES</h2>
        </div>
        <div class="product-layout-section custom-grid-product-layout-section">
           <div class="row">
              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'women','c2' => 'kurti']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/kurti.jpg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Kurti  </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'women','c2' =>'bottoms']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/bottom.webp') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Bottom  </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'women','c2' => 'dress']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/dress.jpg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Dress  </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'women','c2' => 'top-tunic']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/top-tunic.jpg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Top & Tunic  </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="seperator clearfix"></div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'women','c2' => 'kurta-set']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/kurtaset.jpg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Kurta Set  </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'women','c2' => 'jackets']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/jacket.webp') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Jackets  </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>


              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'women','c2' => 'stoles-scarves']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/stole.webp') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Stole N Scarves  </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div>

              <div class="col-md-3 col-sm-3">
                <div class="placeholder-image-portfolio-panel placeholder-image-portfolio-panel-layout">
                   <div class="prel-gutter">
                      <a href="{{ route('front.shop.shop-by-category', ['c1' => 'women','c2' => 'jewellery']) }}">
                        <div class="dynamic-img-container">
                           <img loading="lazy" src="{{ asset('front-shop/images/jewellery3.jpeg') }}">
                        </div>
                        <div class="image-gradient"></div>
                        <div class="caption-dynamic-img-container product-layout-caption-dynamic-img-container">
                           <div class="title-layout-product">Jewellery  </div>
                           <div class="layout-shop-now btn btn-danger">Shop Now</div>
                        </div>
                      </a>
                   </div>
                </div>
              </div> 
           </div>
        </div>
</section>

<section class="container">
   <div class="suti-blog-section">
     <div class="row">
       <div class="col-md-8 col-sm-8">
         <div class="blog-panel-image">
           <div class="bx-blog-portfolio">
             <img src="{{ asset('front-shop/images/blog-image-001.jpg') }}">
           </div>
           <!--div class="bx-blog-portfolio">
             <img src="{{ asset('front-shop/images/blog-image-002.jpg') }}">
           </div-->
         </div>
       </div>
       <div class="col-md-4 col-sm-4">
         <div class="blog-listing-section">
           <h3>Suti Blog</h3>

           <div class="blog-popup-list clearfix row">
             <a href="#">
               <div class="blog-popup-list-image col-sm-4">
                 <img src="{{ asset('front-shop/images/blog-img-001.jpg') }}">
               </div>
               <div class="blog-popup-list-content col-sm-8">
                 <div class="title">What Type Of Bride Are You?</div>
                 <p>
                   In publishing and graphic design, demonstrate the visual form of a document <span class="red-more">Read More</span>
                 </p>
               </div>
             </a>
           </div>

           <div class="blog-popup-list clearfix row">
             <a href="#">
               <div class="blog-popup-list-image col-sm-4">
                 <img src="{{ asset('front-shop/images/blog-img-002.jpg') }}">
               </div>
               <div class="blog-popup-list-content col-sm-8">
                 <div class="title">What Type Of Bride Are You?</div>
                 <p>
                   In publishing and graphic design, demonstrate the visual form of a document <span class="red-more">Read More</span>
                 </p>
               </div>
             </a>
           </div>

           <div class="blog-popup-list clearfix row">
             <a href="#">
               <div class="blog-popup-list-image col-sm-4">
                 <img src="{{ asset('front-shop/images/blog-img-003.jpg') }}">
               </div>
               <div class="blog-popup-list-content col-sm-8">
                 <div class="title">What Type Of Bride Are You?</div>
                 <p>
                   In publishing and graphic design, demonstrate the visual form of a document <span class="red-more">Read More</span>
                 </p>
               </div>
             </a>
           </div>

           <a href="#" class="web-primary-btn">View All Blog Post</a>

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

</div>
</section>


@endsection