@include('includes.header')
<section class="brodcrum">
  	<div class="container position-relative">
  		<div class="row">
  			<div class="col-lg-9 m-auto py-4">
			    <div class="text-center hero-text">
			      <h1 class="text-white">Armed Off Road</h1>
			    </div>
  			</div>
  		</div>
  	</div>
  </section>


  <!-- About section -->
  <section class="abs">
  	<div class="container position-relative">
  		<div class="row align-items-center">
  			<div class="col-md-4 col-lg-5">
  				<div class="about-img pe-md-3 pe-lg-4">
  					<img src="{{ url('/') }}/assets/images/Infantry-Red-Milled.png" class="img-fluid" alt="about img" />
  				</div>
  			</div>
  			<div class="col-md-8 col-lg-7">
  				<div class="about-p">
  					<h2>Armed Off Road</h2>
  					<p>The Armed Off Road line is forged for the fearless, built to endure and excel in the harshest environments. Designed for those who thrive on adventure, these wheels combine unmatched durability with aggressive styling to take on any terrain. From rocky trails to deep mud, Armed Off Road wheels are engineered to dominate the wild, delivering the strength and confidence you need to conquer every off-road challenge.</p>
  				</div>
  			</div>
  		</div>
  	</div>
  </section>

  <!-- Wheels Section -->
  <section class="wheels-sec">
  	<div class="container">
  		<div class="row">
  			<div class="col-lg-12">
  				<div class="heading text-center">
  					<h2>Our Wheels</h2>
  				</div>

  				<div class="row">
  					<div class="col-md-4 my-3 col-lg-3">
  						<div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
  							 <img src="{{ url('/') }}/assets/images/FORCE.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Force</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
  						</div>
  					</div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/spear.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Spear</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/havoc.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Havoc</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/hostile.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Hostile</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/militia.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Militia</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/infantry.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Infantry</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/cannon.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Cannon</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/frontline.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Frontline</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/aggressor.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Aggressor</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/carnace.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Carnace</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/brigade.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Brigade</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/dagger.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Dagger</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
            <div class="col-md-4 my-3 col-lg-3">
              <div class="wheels-img p-0 overflow-hidden rounded">
                <div class="img-s p-3">
                 <img src="{{ url('/') }}/assets/images/bomber.avif" class="img-fluid" alt="Wheels">
                </div>
                <div class="desc">
                  <h3>Bomber</h3>
                  <a href="#" class="btns btns-hover mt-3 py-2 px-4"><span>Learn More</span></a>
                </div>
              </div>
            </div>
  				</div>
  			</div>
  		</div>
  	</div>
  </section>

  
  <!-- Tire Section -->
  <section class="bg-dark book-sc p-0">
          <iframe class="wuksD5" title="Embedded Content" name="htmlComp-iframe" width="100%" height="100%" allow="fullscreen" data-src="" src="https://publuu.com/flip-book/324891/748655"></iframe>
  </section>


  <!-- Ride Section -->
  <section id="ride" class="py-5">
    <div class="container">
      <h2 class="text-center mb-4">Our Wheels On Your Ride</h2>
      <div class="row mt-4 g-4 ride-slider">
        <!-- Ride 1 -->
        <div class="col-lg-3 mx-2">
          <div class="card ride-card">
            <img src="{{ url('/') }}/assets/images/vamv2.avif" class="card-img-top" alt="Tire">
          </div>
        </div>
        <!-- Ride 1 -->
        <div class="col-lg-3 mx-2">
          <div class="card ride-card">
            <img src="{{ url('/') }}/assets/images/va1mv2.avif" class="card-img-top" alt="Tire">
          </div>
        </div>
        <!-- Ride 1 -->
        <div class="col-lg-3 mx-2">
          <div class="card ride-card">
            <img src="{{ url('/') }}/assets/images/va6mv2.avif" class="card-img-top" alt="Tire">
          </div>
        </div>
        <!-- Ride 1 -->
        <div class="col-lg-3 mx-2">
          <div class="card ride-card">
            <img src="{{ url('/') }}/assets/images/va3mv2.avif" class="card-img-top" alt="Tire">
          </div>
        </div>
        <!-- Ride 1 -->
        <div class="col-lg-3 mx-2">
          <div class="card ride-card">
            <img src="{{ url('/') }}/assets/images/va4mv2.avif" class="card-img-top" alt="Tire">
          </div>
        </div>
        <!-- Ride 1 -->
        <div class="col-lg-3 mx-2">
          <div class="card ride-card">
            <img src="{{ url('/') }}/assets/images/va6mv2.avif" class="card-img-top" alt="Tire">
          </div>
        </div>
      </div>
    </div>
  </section>
  @include('includes.footer')