@include('header') 

 <!-- ======= srart Breadcrumbs ======= -->
  <section class="breadcrumbs py-4" data-aos="fade-up" data-aos-delay="200">
    <div class="container">
      <ol>
        <li><a href="{{ url('/') }}">Home</a></li>
        <li>about</li>
      </ol>
      <h2 class="title">about us</h2>
      <p class="col-lg-10 col-12">
      Zinaxi delivers innovative tech solutions, empowering businesses with quality and adaptability.
      </p>
    </div>
  </section><!-- End Breadcrumbs -->

  <!-- ============== Start About section ========== -->
  <section class="about py-5 mt-5" id="about">
    <div class="container">
      <div class="row mt-5 justify-content-center align-items-center">
        <div class="col-12 col-lg-6">
          <span class="pretitle" data-aos="fade-up" data-aos-delay="200">
            about us
          </span>
          <h2 class="title col-12" data-aos="fade-up" data-aos-delay="250">
            The best IT Company since <span class="unique-text">2018</span>
          </h2>
          <p class="col-lg-10 col-12" data-aos="fade-up" data-aos-delay="300">
        Since 2018, Zinaxi has been redefining the landscape of IT services with our commitment to innovation and excellence. As a leading IT company, we specialize in delivering tailored solutions that empower businesses to thrive in an ever-evolving digital world. Our expert team combines creativity and technical prowess to develop cutting-edge software, robust applications, and strategic digital marketing strategies that drive results. Trust Zinaxi to elevate your brand’s presence and navigate the complexities of technology with confidence and precision!
          </p>
          <a href="#" class="btn" data-aos="fade-up" data-aos-delay="350">join now</a>
        </div>
        <!-- image -->
        <div class="col-12 col-lg-6 d-flex align-items-center" data-aos="fade-left" data-aos-delay="100">
          <img src="images/about/1.png" alt="about-img">
        </div>
      </div>
      <div class="row mt-5 py-4 justify-content-center align-items-center">
        <!-- image -->
        <div class="col-12 col-lg-6 d-flex align-items-center" data-aos="fade-right" data-aos-delay="100">
          <img src="images/about/2.png" alt="about-img">
        </div>
        <div class="col-12 col-lg-6">
          <h2 class="title col-12" data-aos="fade-up" data-aos-delay="200">
           We Specialize in Complete Professional <span class="unique-text">IT <br>Services</span>
          </h2>
          <p class="col-lg-10 col-12" data-aos="fade-up" data-aos-delay="250">
         At Zinaxi, we focus on delivering specialized IT solutions that support your business goals and enhance growth
          </p>
          <div class="row gx-2 gy-2 col-12">
            <div class="col-lg-6 col-md-6 col-12" data-aos="fade-up" data-aos-delay="300">
              <div class="box box-hover">
                <i class="bi bi-map-fill"></i>
                <h5 class="mx-4 title-2 fw-bold">Worldwide Services</h5>
              </div>
            </div>
            <div class="col-lg-6 col-md-6 col-12" data-aos="fade-up" data-aos-delay="350">
              <div class="box box-hover">
                <i class="bi bi-headset"></i>
                <h5 class="mx-4 title-2 fw-bold">Support 24/7</h5>
              </div>
            </div>
            <div class="col-lg-6 col-md-6 col-12" data-aos="fade-up" data-aos-delay="400">
              <div class="box box-hover">
                <i class="bi bi-controller"></i>
                <h5 class="mx-4 title-2  fw-bold">Easy To Reach</h5>
              </div>
            </div>
            <div class="col-lg-6 col-md-6 col-12" data-aos="fade-up" data-aos-delay="450">
              <div class="box box-hover">
                <i class="bi bi-star-fill"></i>
                <h5 class="mx-4 title-2 fw-bold">Proven Expertise</h5>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="row mt-5 py-4 justify-content-center align-items-center">
        <div class="col-12 col-lg-6">
          <h2 class="title col-12" data-aos="fade-up" data-aos-delay="200">
          We Are Your IT Solution Partners with 6 Years of <span class="unique-text">Proven Experience</span>
          </h2>
          <p class="col-lg-10 col-12" data-aos="fade-up" data-aos-delay="250">
           With six years of expertise, Zinaxi delivers trusted IT solutions tailored to drive growth and optimize your business success
          </p>
         <div class="row justify-content-lg-start d-flex">
    <!-- Left Column -->
    <div class="col-md-6 ">
        <ul>
            <li class="py-3" data-aos="fade-up" data-aos-delay="300">
                <div class="justify-content-between d-flex">
                    <h5>App Development</h5>
                    <h6>95%</h6>
                </div>
                <div class="progress-bar">
                    <div class="progress-bar-fill" style="width: 95%;" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </li>
            <li class="py-3" data-aos="fade-up" data-aos-delay="400">
                <div class="justify-content-between d-flex">
                    <h5>Web Development</h5>
                    <h6>96%</h6>
                </div>
                <div class="progress-bar">
                    <div class="progress-bar-fill" style="width: 96%;" aria-valuenow="96" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </li>
            <li class="py-3" data-aos="fade-up" data-aos-delay="500">
                <div class="justify-content-between d-flex">
                    <h5>Custom AI App</h5>
                    <h6>90%</h6>
                </div>
                <div class="progress-bar">
                    <div class="progress-bar-fill" style="width: 90%;" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </li>
        </ul>
    </div>

    <!-- Right Column -->
    <div class="col-md-6">
        <ul>
            <li class="py-3" data-aos="fade-up" data-aos-delay="600">
                <div class="justify-content-between d-flex">
                    <h5>Digital Marketing</h5>
                    <h6>88%</h6>
                </div>
                <div class="progress-bar">
                    <div class="progress-bar-fill" style="width: 88%;" aria-valuenow="88" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </li>
            <li class="py-3" data-aos="fade-up" data-aos-delay="700">
                <div class="justify-content-between d-flex">
                    <h5>SEO Optimization</h5>
                    <h6>92%</h6>
                </div>
                <div class="progress-bar">
                    <div class="progress-bar-fill" style="width: 92%;" aria-valuenow="92" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </li>
            <li class="py-3" data-aos="fade-up" data-aos-delay="800">
                <div class="justify-content-between d-flex">
                    <h5>Graphic Design</h5>
                    <h6>85%</h6>
                </div>
                <div class="progress-bar">
                    <div class="progress-bar-fill" style="width: 85%;" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100"></div>
                </div>
            </li>
        </ul>
    </div>
</div>


        </div>
        <!-- image -->
        <div class="col-12 col-lg-6 d-flex align-items-center" data-aos="fade-left" data-aos-delay="100">
          <img src="images/about/3.png" alt="about-img">
        </div>
      </div>

    </div>
  </section>


 @include('footer')