@extends('main')
@section('content')
    
  <style>
    video {
    width: 100%;
    height: auto;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 99;
}
</style> 
<main class="homeeeeee">
    <!-- slider-area -->
    <section id="home" class="slider-area fix p-relative">
      <div class="">
      
        <div
          class="single-slider slider-bg d-flex">
          <div class="container" style="width: 100%;padding:0;max-width:100%">
            <div class="row justify-content-center">
              <div class="col-lg-12">
                <div
                  class="slider-content s-slider-content text-center"
                >
                <video autoplay muted loop class="background-video">
                  <source src="{{ asset('frontend/video/1.mp4') }}" type="video/mp4">
                  Your browser does not support the video tag.
              </video>
                  
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    <!-- slider-area-end -->
    <!-- services-area -->
    <section id="feature-top" class="services-area services-bg services-two">
      <div class="container">
        <div class="row">
          
          <div class="col-lg-12 col-md-12">
            <div class="s-single-services">
              <div class="services-icon icon-f2">
                <div class="glyph-icon flaticon-agreement"></div>
              </div>
              <div class="services-icon2">
                <div class="glyph-icon flaticon-agreement"></div>
              </div>
              <div class="second-services-content">
                <h5><a href="{{ route('aboutus') }}">RAFIQ JAMIL TEXTILE INDUSTRIES Pvt Ltd</a></h5>
                <p>
                  On behalf of "Rafiq Jamil Textiles (RJT)", a global leader in the textile industry since 1987, we are pleased to introduce our organization and the wide range of high-quality products we offer. With over 37 years of experience, we specialize in the export of:
                </p>
                <ul class="our_ul_home">
                  <li>Terry Towels</li>
                  <li>Fabrics</li>
                  <li>Made-ups</li>
                  <li>Institutional Garments</li>
                </ul>
                <br>
                <p>
                We have a team of experienced designers and developers who are constantly working to come up with innovative solutions to problems. 
                We also have a customer support team that is available to answer any questions or concerns our customers may have. 
                Additionally, we have a strict quality control process to ensure that our products meet the highest standards.
                </p>
                <br>
                <p>
                Customer support is a critical part of our commitment to product satisfaction. 
                By addressing issues promptly and maintaining open lines of communication, we aim to build trust and foster long-term relationships with our clients. 
                This unwavering focus on exceptional customer service is fundamental to achieving high levels of client satisfaction and loyalty.
                </p>
               
              </div>
            </div>
          </div>
          
        </div>
      </div>
    </section>
    <!-- services-area-end -->
    <!-- about-area -->
    <section id="about" class="about-area about-p pt-55 pb-170 p-relative d-none">
      <div class="container">
        <div class="row align-items-center">
          <div class="col-lg-6 col-md-12 col-sm-12">
            <div class="about-content s-about-content">
              <div class="about-title second-atitle">
                <h2>We Are Always Ready To Assist Our Clients</h2>
              </div>
              <p>
                Lorem ipsum, dolor sit amet consectetur adipisicing elit. Temporibus aliquid laudantium dicta necessitatibus iusto obcaecati ea, corrupti aliquam, laboriosam iure sunt incidunt velit distinctio esse quidem alias soluta perferendis animi.
              </p>
              <p>
                Lorem ipsum, dolor sit amet consectetur adipisicing elit. Temporibus aliquid laudantium dicta necessitatibus iusto obcaecati ea, corrupti aliquam, laboriosam iure sunt incidunt velit distinctio esse quidem alias soluta perferendis animi.
              </p>
              <p>
                Lorem ipsum, dolor sit amet consectetur adipisicing elit. Temporibus aliquid laudantium dicta necessitatibus iusto obcaecati ea, corrupti aliquam, laboriosam iure sunt incidunt velit distinctio esse quidem alias soluta perferendis animi.
              </p>
              
              <ul class="ab-coutner">
                <li>
                  <div class="single-counter">
                    <div class="counter p-relative">
                      <span class="count">17</span><small>+</small>
                    </div>
                    <p>Project Done</p>
                  </div>
                </li>
                <li>
                  <div class="single-counter">
                    <div class="counter p-relative">
                      <span class="count">300</span><small>+</small>
                    </div>
                    <p>Satisfied Clients</p>
                  </div>
                </li>
                <li>
                  <div class="single-counter">
                    <div class="counter p-relative">
                      <span class="count">3</span><small>+</small>
                    </div>
                    <p>Years Experience</p>
                  </div>
                </li>
              </ul>
              
            </div>
          </div>
          <div class="col-lg-6 col-md-12 col-sm-12 pl-70">
            <div class="s-about-img p-relative">
              <img src="{{ asset('frontend/imgs/1.png') }}" alt="img" />
            </div>
            <div class="sinature-box">
              <div class="c-icon mb-30">
                <img src="{{ asset('frontend/img/features/c-Icon.png') }}" alt="c-Icon.png" />
              </div>
              <h2>Ch. Fayyaz Zaffar</h2>
              <h3>CEO & Founder</h3>
              <img src="{{ asset('frontend/img/features/signature.png') }}" alt="img" />
            </div>
          </div>
        </div>
      </div>
    </section>
    <!-- about-area-end -->
    <!-- newslater-area -->
    <section class="newslater-area pt-95 pb-100" style="background: black; background-size: cover;">
      <div class="container">
        <div class="row align-items-center">
          <div class="col-xl-12 col-lg-12" style="text-align: center;">
            <div class="section-title">
              <h2>Subscribe To Our Newsletter</h2>
              <p>Subscribe to our newsletter and receive the latest news about our products and services!</p>
            </div>
            <form name="ajax-form" id="contact-form4" action="#"
              method="post" class="contact-form newslater pl-60">
              <div class="form-group col-lg-12">
                <input class="form-control" id="email2" name="email" type="email"
                  placeholder="Email Address..." value="" required=""/>
              </div>
              <div class="col-lg-12">
                <button type="submit" class="btn btn-custom" id="send2">Subscribe</button>
              </div>
            </form>
          </div>
        </div>
      </div>
    </section>
    <!-- newslater-aread-end -->

    <!-- services-area -->
    <section id="services" class="services-area testimonial-p pt-95 pb-70 fix">
      <div class="container">
        <div class="row">
          <div class="col-lg-12">
            <div class="section-title center-align mb-40 text-center">
              <h2>Production Process</h2>
            </div>
            <div>
              <div class="services-item_parent row">
                <a href="{{ url('spinning') }}" class="col services-item">
                  <div class="images_4 card h-100" style="border:none">
                    <img src="{{ asset('frontend/processing.JPG') }}" class="card-img-top" alt="spinning">
                    <div class="card-body text-center">
                      <h5 class="card-title">Spinning</h5>
                    </div>
                  </div>
                </a>
                <a href="{{ url('weaving') }}" class="col services-item">
                  <div class="images_4 card h-100" style="border:none">
                    <img src="{{ asset('frontend/42.jpg') }}" class="card-img-top" alt="spinning">
                    <div class="card-body text-center">
                      <h5 class="card-title">Weaving</h5>
                    </div>
                  </div>
                </a>
                <a href="{{ url('processing') }}"  class="col services-item">
                  <div class="images_4 card h-100" style="border:none">
                    <img src="{{ asset('frontend/processing2.jpeg') }}" class="card-img-top" alt="processing">
                    <div class="card-body text-center">
                      <h5 class="card-title">Processing</h5>
                      
                    </div>
                  </div>
                </a>
                <a href="{{ url('printing') }}" class="col services-item">
                  <div class="images_4 card h-100" style="border:none">
                    <img src="{{ asset('frontend/printing.jpeg') }}" class="card-img-top" alt="printing">
                    <div class="card-body text-center">
                      <h5 class="card-title">Printing</h5>
                      
                    </div>
                  </div>
                </a>
                <a href="{{ url('stitching') }}" class="col services-item">
                  <div class="images_4 card h-100" style="border:none">
                    <img src="{{ asset('frontend/stiching.webp') }}" class="card-img-top" alt="stitching">
                    <div class="card-body text-center">
                      <h5 class="card-title">Stitching</h5>
                      
                    </div>
                  </div>
                </a>
              </div>
              
            </div>
            <div class="services-active2 d-none">
              <div class="slider slider-for">
                <div class="single-testimonial">
                  <div class="row align-items-center">
                    <div class="col-lg-6">
                      <img
                        src="{{ asset('frontend/imgs/g1.jpg') }}"
                        alt="services"
                      />
                    </div>
                    <div class="col-lg-6">
                      <h2>
                        What we provide?
                      </h2>
                      
                      <ul>
                        <li>
                          <span class="icon"
                            ><img src="{{ asset('frontend/img/icon/s-check.png') }}" alt="check"
                          /></span>
                          <span class="text"
                            >Fusce et blandit lorem, a blandit libero. Mauris
                            eu consectetur dui. Aliquam nec nisi eros.</span
                          >
                        </li>
                        <li>
                          <span class="icon"
                            ><img src="{{ asset('frontend/img/icon/s-check.png') }}" alt="check"
                          /></span>
                          <span class="text"
                            >Fusce et blandit lorem, a blandit libero. Mauris
                            eu consectetur dui. Aliquam nec nisi eros.</span
                          >
                        </li>
                       
                      </ul>
                    </div>
                  </div>
                </div>
                
              </div>

              
            </div>
          </div>
        </div>
      </div>
    </section>
    <!-- services-area-end -->
    

    

    <!-- pricing-area -->
    <section id="pricing" class="pricing-area pb-40 d-none">
      <div class="container">
        <div class="row justify-content-center">
          <div class="col-xl-8 col-lg-10">
            <div class="section-title text-center pl-40 pr-40 mb-80 mt-5">
              <h2>Our Services</h2>
              <img src="{{ asset('frontend/img/bg/t-c-line.png') }}" />
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-lg-4 col-md-12">
            <div class="pricing-box text-center mb-60">
              <div class="pricing-head">
                <div class="glyph-icon flaticon-pie-chart"></div>
                <h4>Spinning</h4>
              </div>
              <div class="pricing-body mb-30 text-center">
                <p>
                  Morbi sollicitudin eros urna, eu posuere est pulvinar nec.
                </p>
                <p>Sed pharetra ligula et tempus tincidunt.</p>
                <p>Proin sed rhoncus neque.</p>
              </div>
              
              <div class="pricing-btn">
                <a href="#" class="btn">View More</a>
              </div>
            </div>
          </div>
          <div class="col-lg-4 col-md-12">
            <div class="pricing-box active text-center mb-60">
              <div class="pricing-head">
                <div class="glyph-icon flaticon-graphic"></div>
                <h4>Processing</h4>
              </div>
              <div class="pricing-body mb-30 text-center">
                <p>
                  Morbi sollicitudin eros urna, eu posuere est pulvinar nec.
                </p>
                <p>Sed pharetra ligula et tempus tincidunt.</p>
                <p>Proin sed rhoncus neque.</p>
              </div>
             
              <div class="pricing-btn">
                <a href="#" class="btn">View More</a>
              </div>
            </div>
          </div>
          <div class="col-lg-4 col-md-12">
            <div class="pricing-box text-center mb-60">
              <div class="pricing-head">
                <div class="glyph-icon flaticon-research"></div>
                <h4>Printing</h4>
              </div>
              <div class="pricing-body mb-30 text-center">
                <p>
                  Morbi sollicitudin eros urna, eu posuere est pulvinar nec.
                </p>
                <p>Sed pharetra ligula et tempus tincidunt.</p>
                <p>Proin sed rhoncus neque.</p>
              </div>
              
              <div class="pricing-btn">
                <a href="#" class="btn">View More</a>
              </div>
            </div>
          </div>
          
          </div>
        </div>
      </div>
    </section>
    <!-- pricing-area-end -->


    {{-- <!-- faq-area -->
    <section
      class="faq-area pt-90 pb-100"
      style="
        background-image: url({{ asset('frontend/img/shape/header-sape6.html') }});
        background-position: right center;
        background-size: auto;
        background-repeat: no-repeat;
      "
    >
      <div class="container">
        <div class="row justify-content-center">
          <div class="col-xl-8 col-lg-10">
            <div class="section-title text-center pl-40 pr-40 mb-80">
              <h2>Frequently Asked Question</h2>
              <img src="{{ asset('frontend/img/bg/t-c-line.png') }}" />
            </div>
          </div>
        </div>
        <div class="row align-items-end">
          
          <div class="col-lg-12">
            <div class="faq-wrap">
              <div class="accordion" id="accordionExample">
                <div class="card">
                  <div class="card-header" id="headingThree">
                    <h2 class="mb-0">
                      <button
                        class="faq-btn"
                        type="button"
                        data-toggle="collapse"
                        data-target="#collapseThree"
                        aria-expanded="true"
                        aria-controls="collapseThree"
                      >
                        Aliquam varius ligula nec leo tempus porta.
                      </button>
                    </h2>
                  </div>
                  <div
                    id="collapseThree"
                    class="collapse show"
                    aria-labelledby="headingThree"
                    data-parent="#accordionExample"
                  >
                    <div class="card-body">
                      Lorem ipsum dolor sit amet, consectetur adipisicing
                      elit, sed do eiusmod tempor incididunt ut labore et
                      dolore magna aliqua. Ut enim ad minim veniam, quis
                      nostrud exercitation ullamco laboris nisi ut aliquip
                    </div>
                  </div>
                </div>
                <div class="card">
                  <div class="card-header" id="headingOne">
                    <h2 class="mb-0">
                      <button
                        class="faq-btn collapsed"
                        type="button"
                        data-toggle="collapse"
                        data-target="#collapseOne"
                        aria-expanded="false"
                        aria-controls="collapseOne"
                      >
                        Suspendisse vitae varius diam, a vulputate urna.
                      </button>
                    </h2>
                  </div>
                  <div
                    id="collapseOne"
                    class="collapse"
                    aria-labelledby="headingOne"
                    data-parent="#accordionExample"
                  >
                    <div class="card-body">
                      Lorem ipsum dolor sit amet, consectetur adipisicing
                      elit, sed do eiusmod tempor incididunt ut labore et
                      dolore magna aliqua. Ut enim ad minim veniam, quis
                      nostrud exercitation ullamco laboris nisi ut aliquip
                    </div>
                  </div>
                </div>
                <div class="card">
                  <div class="card-header" id="headingTwo">
                    <h2 class="mb-0">
                      <button
                        class="faq-btn collapsed"
                        type="button"
                        data-toggle="collapse"
                        data-target="#collapseTwo"
                        aria-expanded="false"
                        aria-controls="collapseTwo"
                      >
                        Aliquam aliquet purus eget lacus pretium.
                      </button>
                    </h2>
                  </div>
                  <div
                    id="collapseTwo"
                    class="collapse"
                    aria-labelledby="headingTwo"
                    data-parent="#accordionExample"
                  >
                    <div class="card-body">
                      Lorem ipsum dolor sit amet, consectetur adipisicing
                      elit, sed do eiusmod tempor incididunt ut labore et
                      dolore magna aliqua. Ut enim ad minim veniam, quis
                      nostrud exercitation ullamco laboris nisi ut aliquip
                    </div>
                  </div>
                </div>
                
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
    <!-- faq-aread-end --> --}}

    <!-- counter-area -->
    <div
      class="call-area pt-95 pb-85"
      style="
        background:black;
        background-repeat: no-repeat;
        background-position: bottom;
        background-size: cover;
      "
    >
      <div class="container">
        <div class="row justify-content-center text-center">
          <div class="col-lg-8 col-md-8 col-sm-8">
            <h2>Perfect Solutions For Any Industrials</h2>
            <div class="number" style="color: #efc75e">0092 442661134</div>
          </div>
        </div>
      </div>
    </div>
    <!-- counter-area-end -->
    <section class="services-area services-bg services-two" style="margin-top: 50px;margin-bottom:40px">
      <div class="container">
        <div class="row">
          <div class="col-lg-12 col-md-12">
            <div class="s-single-services">
              <div class="services-icon2">
                <div class="glyph-icon flaticon-agreement"></div>
              </div>
              <div class="second-services-content">
                <h5>Group Highlights!!</h5>
                <ul class="our_ul_home">
                <li>More than 59 years of ethical business reputation in the region.</li>
                  <li>Strategic expansion in the last 10 years leading to emerge as one of the largest & successful groups in pakistan.</li>
                  <li>Diverse business portfolio includes textiles, banaspati, oil, farms, rice, retail, and energy.
                  </li>
                  <li>Effective in supply chain dynamics due to strategic portfolio/position in the industry.</li>
                  <li>Efficiency-driven and state-of-the-art investments only in the textiles to compete in the region.</li>
                </ul>
               
              </div>
            </div>
          </div>
          
        </div>
      </div>
    </section>
   
  </main>
@endsection
@push('scripts')
<script>
//         document.addEventListener("DOMContentLoaded", () => {
//   const buttons = document.querySelectorAll(".faq-btn");

//   buttons.forEach((button) => {
//     button.addEventListener("click", function () {
//       const target = document.querySelector(this.getAttribute("data-target"));
//       const parent = this.closest(".accordion");

//       // Close all other open sections and remove 'collapsed' class
//       parent.querySelectorAll(".collapse.show").forEach((open) => {
//         if (open !== target) {
//           open.classList.remove("show");
//           open.previousElementSibling.querySelector(".faq-btn").classList.add("collapsed");
//         }
//       });

//       // Toggle the clicked section and update 'collapsed' class
//       target.classList.toggle("show");
//       this.classList.toggle("collapsed", !target.classList.contains("show"));
//     });
//   });
// });

  $("#contact-form4").on("submit",function(e){
      e.preventDefault();
      var email = $("#email2").val();
    
      $.ajaxSetup({
          "headers": {'X-CSRF-TOKEN': $('meta[name="csrf_token"]').attr('content')}
      });
      $.ajax({
          url: '/newsletter',
          type: 'POST',
          data: {
            email
          },
          success: function(response) {
              $("#email2").val('');
              alert("done");
          
          },
          error: function(response) {
              alert("not done");
          }
      });
  })
</script>
@endpush