@include('header') 

  <!-- ============== Start Hero section ========== -->
  <section class="hero d-flex flex-column justify-content-center align-items-center " id="hero" >
    <div id="particles-js"></div>
    <div class="container mt-5">
      <div class="row justify-content-center align-items-center">
        <div class="hero-text col-12 col-lg-5">
          <div class="row">
         <!--    <div class="hero-icons d-flex gap-lg-3 gap-2 my-lg-3 my-2" data-aos="fade-up" data-aos-delay="100">
              <a href="#"><i class="bi bi-facebook"></i></a>
              <a href="#"><i class="bi bi-instagram"></i></a>
              <a href="#"><i class="bi bi-twitter-x"></i></a>
              <a href="#"><i class="bi bi-youtube"></i></a>
            </div> -->
            <div class="col-12 ">
              <h2 class="title col-12" data-aos="fade-up" data-aos-delay="150"> Outstanding IT <span
                  class="unique-text">Solutions</span> for Your Business </h2>



            </div>
            <div class="col-lg-10 col-12" data-aos="fade-up" data-aos-delay="200">
              <p>
           At Zinaxi, a leading company in Pakistan, we deliver exceptional IT services that empower your business to excel. Our solutions are designed to streamline operations, enhance productivity, and foster growth, creating a seamless link between strategic planning and adaptable technology for a future-ready approach
              </p>
          
            </div>
            <div class="col-10" data-aos="fade-up" data-aos-delay="250" >
              <a href="#" class="btn" style="
">Request Quote&nbsp;<i class="bi bi-chevron-right animated-icon" style="font-size:13px; font-weight:800; margin-top: 2px; "></i></a>

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

        <div class="col-12 col-lg-7 mx-md-auto text-center" data-aos="fade-left" data-aos-delay="100">
          <div class="hero-image">
            <div class="hero-img" data-tilt>
              <img class="img-fluid " alt="hero-img"
                src="images/hero/bodigmas_IT_solutions_company_illustrationvectorflat_designmini_942ad818-e3f4-47af-a5e8-78e030aff9c9-removebg.png">
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- ============== End Hero section ========== -->
   



  <!-- ============== Start services section ========== -->
  <section class="container services py-5" id="services">
    <div class="heading">
      <span class="pretitle" data-aos="fade-up">
        our services
      </span>
      <h2 class="title col-lg-10 col-12" data-aos="fade-up" data-aos-delay="100">
        What We’re Offering?
      </h2>
      <p class="col-lg-7 col-12" data-aos="fade-up" data-aos-delay="150">
At Zinaxi, we specialize in tailored web development solutions for startups, optimizing workflows and boosting productivity to turn your vision into a precise, reliable reality.
      </p>
    </div>
    <div class="row gy-4 gx-4 ">
      <!-- service number 1 -->
      <div class="col-md-6 col-12 col-lg-4 mx-auto ">
        <div class="box box-service box-hover " data-aos="fade-right" data-aos-delay="250">
          <div class="box-icon my-2">
            <i class="bi bi-code-slash"></i>
          </div>
          <h2 class="title-2 my-2 ">web development</h2>
          <p>Building innovative, user-friendly websites designed to drive success and boost your online presence!</p>
          <a href="service-single.html" class="my-2 learn-more">view more <i class="bi bi-arrow-right"></i></a>
        </div>
      </div>
      <div class=" col-md-6 col-lg-4 mx-auto" data-aos="fade-down" data-aos-delay="200">
        <!-- service number 2 -->
        <div class="box box-service box-hover ">
          <div class="box-icon my-2">
            <i class="bi bi-megaphone-fill"></i>
          </div>
          <h2 class="title-2 my-2 ">Digital Marketing</h2>
          <p>Creating impactful campaigns that resonate with your audience and enhance your brand's visibility!</p>
          <a href="service-single.html" class="my-2 learn-more">view more <i class="bi bi-arrow-right"></i></a>
        </div>
      </div>
      <div class="col-md-6 col-lg-4 mx-auto" data-aos="fade-left" data-aos-delay="250">
        <!-- service number 3 -->
        <div class="box box-service box-hover">
          <div class="box-icon my-2">
            <i class="bi bi-search"></i>
          </div>
          <h2 class="title-2 my-2 ">SEO Services</h2>
          <p>Unlock your website's potential with Zinaxi, one of Pakistan's top SEO services, enhancing search rankings and attracting quality leads.</p>
          <a href="service-single.html" class="my-2 learn-more">view more <i class="bi bi-arrow-right"></i></a>
        </div>
      </div>
      <div class=" col-md-6 col-lg-4 mx-auto" data-aos="fade-right" data-aos-delay="350">
        <!-- service number 4 -->
        <div class="box box-service box-hover">
          <div class="box-icon my-2">
            <i class="bi bi-robot"></i>
          </div>
          <h2 class="title-2 my-2 ">Custom AI Development</h2>
          <p>Tailored AI solutions designed to meet your specific business needs, from predictive analytics to natural language processing.</p>
          <a href="service-single.html" class="my-2 learn-more">view more <i class="bi bi-arrow-right"></i></a>
        </div>
      </div>
      <div class=" col-md-6 col-lg-4 mx-auto" data-aos="fade-up" data-aos-delay="300">
        <!-- service number 5 -->
        <div class="box  box-service box-hover">
          <div class="box-icon my-2">
            <i class="bi bi-palette-fill"></i>
          </div>
          <h2 class="title-2 my-2 ">Graphic Design</h2>
          <p>Transform your brand with stunning graphics from Zinaxi, captivating visuals that engage and inspire your audience</p>
          <a href="service-single.html" class="my-2 learn-more">view more <i class="bi bi-arrow-right"></i></a>
        </div>
      </div>
      <div class=" col-md-6  col-lg-4 mx-auto ">
        <!-- service number 6 -->
        <div class="box box-service box-hover" data-aos="fade-left" data-aos-delay="350">
          <div class="box-icon my-2">
            <i class="bi bi-android2"></i>
          </div>
          <h2 class="title-2 my-2 ">apps developement</h2>
          <p>Zinaxi is a leading company for app development, specializing in iOS and Android solutions that deliver seamless user experiences and drive engagement.</p>
          <a href="service-single.html" class="my-2 learn-more">view more <i class="bi bi-arrow-right"></i></a>
        </div>
      </div>
    </div>
  </section>
  <!-- ============== End services section ========== -->

  <!-- ============== Start About section ========== -->
 
  <!-- ============== End About section ========== -->

  <!-- ============== Start numbers section ========== -->
  <section class="counter-up my-5" data-aos="fade-up" data-aos-delay="100">
    <div class="container">
      <div class="row">
        <div class="col-lg-4  col-12 mt-5 mt-lg-0" data-aos="fade-right" data-aos-delay="200">
          <i class="ri-discuss-line icon"></i>
          <h3 class="counter">+500</h3>
          <h2 class="title-2">happy clients</h2>
        </div>
   <!--      <div class="col-lg-3 col-12 mt-5 mt-lg-0" data-aos="fade-up" data-aos-delay="250">
          <i class="ri-discuss-line icon"></i>
          <h3 class="counter">+60</h3>
          <h2 class="title-2">hard worker</h2>
        </div> -->
        <div class="col-lg-4 col-12 mt-5 mt-lg-0" data-aos="fade-down" data-aos-delay="250">
          <i class="ri-discuss-line icon"></i>
          <h3 class="counter">+800</h3>
          <h2 class="title-2">complete project</h2>
        </div>
        <div class="col-lg-4 col-12 mt-5 mt-lg-0" data-aos="fade-left" data-aos-delay="200">
          <i class="ri-discuss-line icon"></i>
          <h3 class="counter">+6</h3>
          <h2 class="title-2">Years Of Exprience</h2>
        </div>
      </div>
    </div>
  </section>
  <!-- ============== End numbers section ========== -->

  <!-- ============== Start Why us section ========== -->
  <section class="container why-choose-us py-5">
    <div class="heading">
      <span class="pretitle" data-aos="fade-up">
        why choose us
      </span>
      <h2 class="title col-12" data-aos="fade-up" data-aos-delay="100">
        why our clients choose <span class="pretitle fs-1" >Zinaxi</span>
      </h2>
      <p class="col-lg-7 col-12" data-aos="fade-up" data-aos-delay="150">
     Clients choose us because our integrated software solutions ensure precision and control, driving successful achievement of targeted goals with measurable accuracy
      </p>
    </div>
    <div class="row  gy-4 gx-4 ">
      <div class="col-md-6 col-lg-4 mx-auto" data-aos="fade-right" data-aos-delay="250">
        <div class="box">
          <h1 class="my-4">01.</h1>
          <h2 class="title-2 my-2 ">Latest Technologies</h2>
          <p>Stay competitive with our innovative solutions, from AI and machine learning to blockchain and cloud computing. We leverage cutting-edge technologies to enhance your operations and drive success in a fast-paced digital world.</p>
        </div>
      </div>
      <div class="col-md-6  col-lg-4 mx-auto" data-aos="fade-up" data-aos-delay="200">
        <div class="box">
          <h1 class="my-4">02.</h1>
          <h2 class="title-2 my-2 ">Uniqe Solutions</h2>
          <p>Our tailored, innovative solutions address your business challenges directly, delivering measurable results and setting you apart in a dynamic market.</p>
        </div>
      </div>
      <div class="col-md-6  col-lg-4 mx-auto" data-aos="fade-left" data-aos-delay="250">
        <div class="box">
          <h1 class="my-4">03.</h1>
          <h2 class="title-2 my-2 ">Powerful Strategies</h2>
          <p>Our targeted strategies drive growth, optimize performance, and position your business for lasting success in a competitive landscape.</p>
        </div>
      </div>
    </div>
  </section>
  <!-- ============== End Why us section ========== -->

  <!-- ============== Start portfolio section ========== -->

  <section class="container portfolio py-5" id="portfolio">
    <div class="heading">
      <span class="pretitle" data-aos="fade-up">
        portfolio
      </span>
      <h2 class="title col-12" data-aos="fade-up" data-aos-delay="100">
        our portfolio
      </h2>
    </div>
    <ul class="filters d-flex my-4" data-aos="fade-up" data-aos-delay="150">
      <li class="nav-item portfolio-btn active">
        <a class="nav-link" data-filter="*">All</a>
      </li>
      <li class="nav-item portfolio-btn mx-lg-3 mx-1">
        <a class="nav-link" data-filter=".mobile">Mobile</a>
      </li>
      <li class="nav-item portfolio-btn mx-lg-3 mx-1">
        <a class="nav-link" data-filter=".data">Data</a>
      </li>
      <li class="nav-item portfolio-btn mx-lg-3 mx-1 ">
        <a class="nav-link" data-filter=".web">Web</a>
      </li>
    </ul>
    <div class="row portfolio-row gy-4 gx-4" data-aos="fade-up" data-aos-delay="150">
      <div class="col-md-6 col-lg-4 mx-auto mobile ">
        <div class="portfolio-item">
          <img src="images/portfolio/1.jpg" class="gallery-item" alt="portfolio-img">
          <div class="img-overlay">
            <div class="content">
              <h3>tansiApp</h3>
              <h6>mobile application</h6>
              <div class="d-flex tags my-2">
                <span>#react</span>
                <span>#HTML</span>
                <span>#next_js</span>
                <span>#node</span>
              </div>
              <div class="link">
                <a class="unique-text" href="portfolio-single.html">view
                  project</a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class=" col-md-6  col-lg-4 mx-auto mobile">
        <div class="portfolio-item">
          <img src="images/portfolio/2.jpg" class="gallery-item" alt="portfolio-img">
          <div class="img-overlay">
            <div class="content">
              <h3>tansiApp</h3>
              <h6>mobile application</h6>
              <div class="d-flex tags col-10 my-2">
                <span>#js</span>
                <span>#HTML</span>
                <span>#next_js</span>
                <span>#node</span>
              </div>
              <div class="link">
                <a class="unique-text" href="portfolio-single.html">view
                  project</a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class=" col-md-6  col-lg-4 mx-auto web">
        <div class="portfolio-item">
          <img src="images/portfolio/3.jpg" alt="portfolio-img">
          <div class="img-overlay">
            <div class="content">
              <h3>imolas</h3>
              <h6>mobile application</h6>
              <div class="d-flex tags my-2">
                <span>#redux</span>
                <span>#HTML</span>
                <span>#next_js</span>
                <span>#gsap</span>
              </div>
              <div class="link">
                <a class="unique-text" href="portfolio-single.html">view
                  project</a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-6  col-lg-4 mx-auto data web ">
        <div class="portfolio-item">
          <img src="images/portfolio/4.png" alt="portfolio-img">
          <div class="img-overlay">
            <div class="content">
              <h3>abertonApp</h3>
              <h6>mobile application</h6>
              <div class="d-flex tags my-2">
                <span>#react</span>
                <span>#HTML</span>
                <span>#next_js</span>
                <span>#node</span>
              </div>
              <div class="link">
                <a class="unique-text" href="portfolio-single.html">view
                  project</a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-6  col-lg-4 mx-auto hosting web  ">
        <div class="portfolio-item">
          <img src="images/portfolio/5.jpg" alt="portfolio-img">
          <div class="img-overlay">
            <div class="content">
              <h3>Fitnessapp</h3>
              <h6>web application</h6>
              <div class="d-flex tags my-2">
                <span>#react</span>
                <span>#PHP</span>
                <span>#next_js</span>
                <span>#node</span>
              </div>
              <div class="link">
                <a class="unique-text" href="portfolio-single.html">view
                  project</a>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="col-md-6  col-lg-4 mx-auto data">
        <div class="portfolio-item">
          <img src="images/portfolio/6.jpg" alt="portfolio-img">
          <div class="img-overlay">
            <div class="content">
              <h3>Spark</h3>
              <h6>web application</h6>
              <div class="d-flex tags my-2">
                <span>#react</span>
                <span>#HTML</span>
                <span>#ruby</span>
                <span>#node</span>
              </div>
              <div class="link">
                <a class="unique-text" href="portfolio-single.html">view
                  project</a>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- ============== End portfolio section ========== -->

  <!-- ============== Start clients section ========== -->
  <!-- <div class="clients py-lg-5 py-2" data-aos="fade-up" data-aos-delay="100">
    <div class="container">
      <div class="row">
        <div class="owl-carousel client owl-theme">
          <div class="item">
            <img src="images/clients-logos/1-white.png" alt="client-logo">
          </div>
          <div class="item">
            <img src="images/clients-logos/2-white.png" alt="client-logo">
          </div>
          <div class="item">
            <img src="images/clients-logos/3-white.png" alt="client-logo">
          </div>
          <div class="item">
            <img src="images/clients-logos/4-white.png" alt="client-logo">
          </div>
          <div class="item">
            <img src="images/clients-logos/5-white.png" alt="client-logo">
          </div>
          <div class="item">
            <img src="images/clients-logos/6-white.png" alt="client-logo">
          </div>
          <div class="item">
            <img src="images/clients-logos/7-white.png" alt="client-logo">
          </div>
        </div>
      </div>
    </div>
  </div> -->
  <!-- ============== End clients section ========== -->

  <!-- ============== Start Pricing section ========== -->
  <!-- <section class="container pricing py-5" id="pricing">
    <div class="heading">
      <span class="pretitle" data-aos="fade-up">
        pricing
      </span>
      <h2 class="title col-12" data-aos="fade-up" data-aos-delay="100">
        our pricing
      </h2>
      <p class="col-lg-7 col-12" data-aos="fade-up" data-aos-delay="150">
        As a matter of fact the unification of the coherent software provides a strict control over
        The Accomplishment of Intended Estimation
      </p>
      <div class="row  gy-4 gx-4 ">
        <div class="col-md-6 col-lg-3 mx-auto" data-aos="fade-up" data-aos-delay="200">
          <div class="box">
            <i class="bi bi-cart4 my-4"></i>
            <h3 class="my-2 title-2 ">free</h3>
            <h2 class="price">00$</h2>
            <h3>per project</h3>
            <ul class="my-4">
              <li class="my-1"><i class="bi bi-check2-circle"></i>single user</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>no updates</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>limited acces library</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>lorem ipsum</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>dolor sit amet</li>
            </ul>
            <a href="#" class="btn my-4">start now</a>
          </div>
        </div>
        <div class="col-md-6 col-lg-3 mx-auto" data-aos="fade-up" data-aos-delay="250">
          <div class="box">
            <i class="bi bi-coin my-4"></i>
            <h3 class="my-2 title-2 ">basic</h3>
            <h2 class="price">19$</h2>
            <h3>per project</h3>
            <ul class="my-4">
              <li class="my-1"><i class="bi bi-check2-circle"></i>single user</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>no updates</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>limited acces library</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>lorem ipsum</li>
              <li class="my-1"><i class="bi bi-x-circle"></i>dolor sit amet</li>
            </ul>
            <a href="#" class="btn my-4">start now</a>
          </div>
        </div>
        <div class="  col-md-6  col-lg-3 mx-auto" data-aos="fade-up" data-aos-delay="300">
          <div class="box" id="table3">
            <i class="bi bi-cash my-4"></i>
            <h3 class="my-2 title-2 ">Standerd</h3>
            <h2 class="price">39$</h2>
            <h3>per project</h3>
            <ul class="my-4">
              <li class="my-1"><i class="bi bi-check2-circle"></i>single user</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>no updates</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>limited acces library</li>
              <li class="my-1"><i class="bi bi-x-circle"></i>lorem ipsum</li>
              <li class="my-1"><i class="bi bi-x-circle"></i>dolor sit amet</li>
            </ul>
            <a href="#" class="btn my-4">start now</a>
          </div>
        </div>
        <div class="  col-md-6  col-lg-3 mx-auto" data-aos="fade-up" data-aos-delay="350">
          <div class="box">
            <i class="bi bi-cash-coin my-4"></i>
            <h3 class="my-2 title-2 ">pro</h3>
            <h2 class="price">99$</h2>
            <h3>per project</h3>
            <ul class="my-4">
              <li class="my-1"><i class="bi bi-check2-circle"></i>single user</li>
              <li class="my-1"><i class="bi bi-check2-circle"></i>no updates</li>
              <li class="my-1"><i class="bi bi-x-circle"></i>limited acces library</li>
              <li class="my-1"><i class="bi bi-x-circle"></i>lorem ipsum</li>
              <li class="my-1"><i class="bi bi-x-circle"></i>dolor sit amet</li>
            </ul>
            <a href="#" class="btn my-4">start now</a>
          </div>
        </div>
      </div>
    </div>
  </section> -->
  <!-- ============== End Pricing section ========== -->
<!-- TrustBox widget - Review Collector -->
<!-- <div class="trustpilot-widget" data-locale="en-US" data-template-id="56278e9abfbbba0bdcd568bc" data-businessunit-id="6723ae8407250bea4d26b5f7" data-style-height="52px" data-style-width="100%">
  <a href="https://www.trustpilot.com/review/zinaxi.com" target="_blank" rel="noopener">Trustpilot</a>
</div> -->
<!-- End TrustBox widget -->
  <!-- ============== Start testimonials section ========== -->
  <section class="container testimonials py-5">
    <div class="heading">
      <span class="pretitle" data-aos="fade-up">
        testimonials
      </span>
      <h2 class="title col-12" data-aos="fade-up" data-aos-delay="100">
        Customers Testmonials
      </h2>
      <p class="col-lg-7 col-12" data-aos="fade-up" data-aos-delay="150">
        As a matter of fact the unification of the coherent software provides a strict control over
        The Accomplishment of Intended Estimation
      </p>
    </div>
    <div class="row" data-aos="fade-up" data-aos-delay="200">
      <div class="owl-carousel testimonial owl-theme">
        <div class="item">
          <div class="box">
            <div class="d-flex justify-content-center align-items-center m-2">
              <div class="col-2 ms-4 ">
                <img class="rounded-circle" src="images/testimonials/testimonials-1.jpg" alt="testimonial-img">
              </div>
              <div class="col-10 d-flex flex-column mx-4">
                <h1 class="title-2">
                  ahmad errami
                </h1>
                <div class=" justify-content-between">
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-half"></i>
                  <i class="bi bi-star"></i>
                </div>
              </div>
            </div>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit, labore dolore laborum dolorum culpa
              ducimus ipsam quo, veniam animi pariatur facilis tempora incidunt nostrum quisquam, cum quasi laudantium?
              Voluptates, sequi? Possimus ipsa, excepturi praesentium dolore quae placeat voluptatem doloremque
              deserunt?</p>
          </div>
        </div>
        <div class="item">
          <div class="box">
            <div class="d-flex justify-content-center align-items-center m-2">
              <div class="col-2 ms-4">
                <img class="rounded-circle" src="images/testimonials/testimonials-2.jpg" alt="testimonial-img">
              </div>
              <div class="col-10 d-flex flex-column mx-4">
                <h1 class="title-2">
                  john wick
                </h1>
                <div class=" justify-content-between">
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-half"></i>
                  <i class="bi bi-star"></i>
                </div>
              </div>
            </div>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit, labore dolore laborum dolorum culpa
              ducimus ipsam quo, veniam animi pariatur facilis tempora incidunt nostrum quisquam, cum quasi laudantium?
              Voluptates, sequi? Possimus ipsa, excepturi praesentium dolore quae placeat voluptatem doloremque
              deserunt?</p>
          </div>
        </div>
        <div class="item">
          <div class="box">
            <div class="d-flex justify-content-center align-items-center m-2">
              <div class="col-2 ms-4">
                <img class="rounded-circle" src="images/testimonials/testimonials-5.jpg" alt="testimonial-img">
              </div>
              <div class="col-10 d-flex flex-column mx-4">
                <h1 class="title-2">
                  saul goodman
                </h1>
                <div class="justify-content-between">
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star"></i>
                  <i class="bi bi-star"></i>
                </div>
              </div>
            </div>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit, labore dolore laborum dolorum culpa
              ducimus ipsam quo, veniam animi pariatur facilis tempora incidunt nostrum quisquam, cum quasi laudantium?
              Voluptates, sequi? Possimus ipsa, excepturi praesentium dolore quae placeat voluptatem doloremque
              deserunt?</p>
          </div>
        </div>
        <div class="item">
          <div class="box">
            <div class="d-flex justify-content-center align-items-center m-2">
              <div class="col-2 ms-4">
                <img class="rounded-circle" src="images/testimonials/testimonials-3.jpg" alt="testimonial-img">
              </div>
              <div class="col-10 d-flex flex-column mx-4">
                <h1 class="title-2">
                  adam smith
                </h1>
                <div class="justify-content-between">
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                </div>
              </div>
            </div>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit, labore dolore laborum dolorum culpa
              ducimus ipsam quo, veniam animi pariatur facilis tempora incidunt nostrum quisquam, cum quasi laudantium?
              Voluptates, sequi? Possimus ipsa, excepturi praesentium dolore quae placeat voluptatem doloremque
              deserunt?</p>
          </div>
        </div>
        <div class="item">
          <div class="box">
            <div class="d-flex justify-content-center align-items-center m-2">
              <div class="col-2 ms-4">
                <img class="rounded-circle" src="images/testimonials/testimonials-4.jpg" alt="testimonial-img">
              </div>
              <div class="col-10 d-flex flex-column mx-4">
                <h1 class="title-2">
                  walter white
                </h1>
                <div class=" justify-content-between">
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                </div>
              </div>
            </div>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit, labore dolore laborum dolorum culpa
              ducimus ipsam quo, veniam animi pariatur facilis tempora incidunt nostrum quisquam, cum quasi laudantium?
              Voluptates, sequi? Possimus ipsa, excepturi praesentium dolore quae placeat voluptatem doloremque
              deserunt?</p>
          </div>
        </div>
        <div class="item">
          <div class="box">
            <div class="d-flex justify-content-center align-items-center m-2">
              <div class="col-2 ms-4">
                <img class="rounded-circle" src="images/testimonials/testimonials-5.jpg" alt="testimonial-img">
              </div>
              <div class="col-10 d-flex flex-column mx-4">
                <h1 class="title-2">
                  gustavo fring
                </h1>
                <div class="justify-content-between">
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-fill"></i>
                  <i class="bi bi-star-half"></i>
                  <i class="bi bi-star"></i>
                  <i class="bi bi-star"></i>
                </div>
              </div>
            </div>
            <p class="text-center">Lorem ipsum dolor sit amet consectetur adipisicing elit. Sit, labore dolore laborum
              dolorum culpa
              ducimus ipsam quo, veniam animi pariatur facilis tempora incidunt nostrum quisquam, cum quasi laudantium?
              Voluptates, sequi? Possimus ipsa, excepturi praesentium dolore quae placeat voluptatem doloremque
              deserunt?</p>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- ============== End testimonials section ========== -->

  <!-- ============== start team section ========== -->
  <div class="container team">
    <div class="heading">
      <span class="pretitle" data-aos="fade-up">
        team
      </span>
      <h1 class="title col-12" data-aos="fade-up" data-aos-delay="100">
        our team
      </h1>
      <p class="col-lg-7 col-12" data-aos="fade-up" data-aos-delay="150">
      Our expert team delivers seamless, cohesive software solutions, ensuring precise control and achievement of every project goal
      </p>
    </div>
    <div class="row gy-4 gx-4 ">
      <div class="col-lg-3 col-md-6 col-12 mx-auto" data-aos="fade-right" data-aos-delay="200">
        <div class="box">
          <div class="team-img">
            <img src="images/team/nadeem.png" alt="team-img">
          </div>
          <h3 class="my-2 title-2 ">NAdeem MAlik</h3>
          <h6>CEO & Lead Software Engineer</h6>

          <div class="social-icons d-flex">
            <a href="#"><i class="bi bi-facebook"></i></a>
            <a href="#"><i class="bi bi-instagram"></i></a>
            <a href="#"><i class="bi bi-twitter-x"></i></a>
            <a href="#"><i class="bi bi-linkedin"></i></a>
          </div>
        </div>
      </div>
      <div class="col-lg-3 col-md-6 col-12 mx-auto" data-aos="fade-up" data-aos-delay="250">
        <div class="box">
          <div class="team-img">
            <img src="images/team/baqir.png" alt="team-img">
          </div>
          <h3 class="my-2 title-2 ">Baqir Raza</h3>
          <h6>Software Engineer</h6>
          <div class="social-icons d-flex">
            <a href="#"><i class="bi bi-facebook"></i></a>
            <a href="#"><i class="bi bi-instagram"></i></a>
            <a href="#"><i class="bi bi-twitter-x"></i></a>
            <a href="#"><i class="bi bi-linkedin"></i></a>
          </div>
        </div>
      </div>
      <div class="col-lg-3 col-md-6 col-12 mx-auto" data-aos="fade-down" data-aos-delay="300">
        <div class="box">
          <div class="team-img">
            <img src="images/team/aizaz-r.png" alt="team-img" >
          </div>
          <h3 class="my-2 title-2 ">Aizaz Rafi</h3>
          <h6>Graphic Designer</h6>
          <div class="social-icons d-flex">
            <a href="#"><i class="bi bi-facebook"></i></a>
            <a href="#"><i class="bi bi-instagram"></i></a>
            <a href="#"><i class="bi bi-twitter-x"></i></a>
            <a href="#"><i class="bi bi-linkedin"></i></a>
          </div>
        </div>
      </div>
      <div class=" col-lg-3 col-md-6 col-12 mx-auto" data-aos="fade-left" data-aos-delay="200">
        <div class="box">
          <div class="team-img">
            <img src="images/team/qaiser.png" alt="team-img">
          </div>
          <h3 class="my-2 title-2 ">Qaiser</h3>
          <h6>Sr.AI Engineer</h6>
          <div class="social-icons d-flex">
            <a href="#"><i class="bi bi-facebook"></i></a>
            <a href="#"><i class="bi bi-instagram"></i></a>
            <a href="#"><i class="bi bi-twitter-x"></i></a>
            <a href="#"><i class="bi bi-linkedin"></i></a>
          </div>
        </div>
      </div>

     <div class=" col-lg-3 col-md-6 col-12 mx-auto" data-aos="fade-left" data-aos-delay="200">
        <div class="box">
          <div class="team-img">
            <img src="images/team/sana.png" alt="team-img">
          </div>
          <h3 class="my-2 title-2 ">SanaUllah</h3>
          <h6>Software Engineer</h6>
          <div class="social-icons d-flex">
            <a href="#"><i class="bi bi-facebook"></i></a>
            <a href="#"><i class="bi bi-instagram"></i></a>
            <a href="#"><i class="bi bi-twitter-x"></i></a>
            <a href="#"><i class="bi bi-linkedin"></i></a>
          </div>
        </div>
      </div>

     <div class=" col-lg-3 col-md-6 col-12 mx-auto" data-aos="fade-left" data-aos-delay="200">
        <div class="box">
          <div class="team-img">
            <img src="images/team/yasir.png" alt="team-img">
          </div>
          <h3 class="my-2 title-2 ">Yasir</h3>
          <h6>Digital Marketing Manager</h6>
          <div class="social-icons d-flex">
            <a href="#"><i class="bi bi-facebook"></i></a>
            <a href="#"><i class="bi bi-instagram"></i></a>
            <a href="#"><i class="bi bi-twitter-x"></i></a>
            <a href="#"><i class="bi bi-linkedin"></i></a>
          </div>
        </div>
      </div>

         <div class=" col-lg-3 col-md-6 col-12 mx-auto" data-aos="fade-left" data-aos-delay="200">
        <div class="box">
          <div class="team-img">
            <img src="images/team/waseem.png" alt="team-img">
          </div>
          <h3 class="my-2 title-2 ">Waseem</h3>
          <h6>SEO Specialist</h6>
          <div class="social-icons d-flex">
            <a href="#"><i class="bi bi-facebook"></i></a>
            <a href="#"><i class="bi bi-instagram"></i></a>
            <a href="#"><i class="bi bi-twitter-x"></i></a>
            <a href="#"><i class="bi bi-linkedin"></i></a>
          </div>
        </div>
      </div>

           <div class=" col-lg-3 col-md-6 col-12 mx-auto" data-aos="fade-left" data-aos-delay="200">
        <div class="box">
          <div class="team-img">
            <img src="images/team/waseem.png" alt="team-img">
          </div>
          <h3 class="my-2 title-2 ">Waseem</h3>
          <h6>SEO Specialist</h6>
          <div class="social-icons d-flex">
            <a href="#"><i class="bi bi-facebook"></i></a>
            <a href="#"><i class="bi bi-instagram"></i></a>
            <a href="#"><i class="bi bi-twitter-x"></i></a>
            <a href="#"><i class="bi bi-linkedin"></i></a>
          </div>
        </div>
      </div>



    </div>
  </div>
  <!-- ============== end team section ========== -->

  <!-- ============== Start Blog section ========== -->
  <section class="container blog py-5" id="blog">
    <div class="heading">
      <span class="pretitle" data-aos="fade-up">
        blog
      </span>
      <h2 class="title col-12" data-aos="fade-up" data-aos-delay="100">
        our blog
      </h2>
      <p class="col-lg-7 col-12" data-aos="fade-up" data-aos-delay="150">
        As a matter of fact the unification of the coherent software provides a strict control over
        The Accomplishment of Intended Estimation
      </p>
    </div>

    <div class="row  gy-4 gx-4 ">
      <div class="col-lg-4 col-md-6 col-12 mx-auto" data-aos="fade-right" data-aos-delay="250">
        <div class="box card border-0">
          <div class="col-12">
            <img src="images/blog/post-images/1.jpg" alt="blog-img">
          </div>
          <div class="card-body">
            <div class="info d-flex justify-content-between">
              <h3><i class="bi bi-person-fill title-2 mx-2"></i>admin</h3>
              <h3> <i class="bi bi-calendar-date-fill title-2 mx-2"></i>27/05/2024</h3>
              <h3> <i class="bi bi-tag-fill title-2 mx-2"></i>web dev</h3>
            </div>
            <h4 class="title-2">
              how to learn javascript easily with this method
            </h4>
            <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.
              Explicabo earum id assumenda ad neque recusandae, quasi deleniti
              voluptatum eos vel quas molestias?</p>
            <a class="learn-more" href="blog-single.html">
              read more <i class="bi bi-arrow-right"></i>
            </a>
          </div>
        </div>
      </div>

      <div class=" col-lg-4 col-md-6 col-12 mx-auto" data-aos="fade-up" data-aos-delay="200">
        <div class="box card border-0">
          <div class="col-12">
            <img src="images/blog/post-images/2.jpg" alt="blog-img">
          </div>
          <div class="card-body">
            <div class="info d-flex justify-content-between">
              <h3><i class="bi bi-person-fill title-2 mx-2"></i>admin</h3>
              <h3> <i class="bi bi-calendar-date-fill title-2 mx-2"></i>27/03/2024</h3>
              <h3> <i class="bi bi-tag-fill title-2 mx-2"></i>web dev</h3>
            </div>
            <h4 class="title-2">
              why you should learn this new javascript framework
            </h4>
            <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.
              Explicabo earum id assumenda ad neque recusandae, quasi deleniti
              voluptatum eos vel quas molestias?</p>
            <a class="learn-more" href="blog-single.html">
              read more <i class="bi bi-arrow-right"></i>
            </a>
          </div>
        </div>
      </div>
      <div class=" col-lg-4 col-md-6 col-12 mx-auto" data-aos="fade-left" data-aos-delay="250">
        <div class="box card border-0">
          <div class="col-12">
            <img src="images/blog/post-images/3.jpg" alt="blog-img">
          </div>
          <div class="card-body">
            <div class="info d-flex justify-content-between">
              <h3><i class="bi bi-person-fill title-2 mx-2"></i>admin</h3>
              <h3><i class="bi bi-calendar-date-fill title-2 mx-2"></i>20/04/2024</h3>
              <h3><i class="bi bi-tag-fill title-2 mx-2"></i>marketing</h3>
            </div>
            <h4 class="title-2">
              What is digital marketing and why is important ?
            </h4>
            <p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.
              Explicabo earum id assumenda ad neque recusandae, quasi deleniti
              voluptatum eos vel quas molestias?</p>
            <a class="learn-more" href="blog-single.html">
              read more <i class="bi bi-arrow-right"></i>
            </a>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- ============== End Blog section ========== -->






 @include('footer')