@extends('web.layouts.master')

@section('content')
    
    <!--BreadCrumb-->
    <section id="breadcrumb">
      <div class="container">
        <div class="row">
          <div class="col-lg-12">
            <div class="banner-content-inner">
              <h1>Download App</h1>
              <p><a href="{{route('home')}}">Home</a> / Download App</p>
            </div>
          </div>
        </div>
      </div>
    </section>


    <!--Inner Div Box-->
    <section id="inner-div-box">
      <div class="container">
        <div class="row">
          <div class="col-lg-6 col-sm-6">
            <div class="download-app-img">
              <img src="{!! asset('web/assets/img/phone-screen.png') !!}" class="img-fluid"/>
            </div>
          </div>
          <div class="col-lg-6 col-sm-6">
            <div class="download-txt-inner">
              <h4>Download The App</h4>
              <h1>START YOUR <span>RIDE</span> TODAY</h1>
              <p>App is Available for download  on Google Play Store & Apple App store. Install today in your smartphone </p>
              <ul>
                <li><a href="https://play.google.com/store/apps/details?id=com.it.lunarrides&pli=1"><img src="{!! asset('web/assets/img/playstore-icon.png') !!}" class="img-fluid"/></a></li>
                <li><a href="https://apps.apple.com/in/app/lunar-rides/id6447548833"><img src="{!! asset('web/assets/img/app-store-icon.png') !!}" class="img-fluid"/></a></li>
              </ul>
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-lg-3 col-sm-6">
            <div class=" counter-box">
              <div class="counter">
                  <div class="counter-icon"><i class="fa-solid fa-users"></i></div>
                  <span class="counter-value">1988</span>
                  <h3>Total Users</h3>
              </div>
            </div>
          </div>
          <div class="col-lg-3 col-sm-6">
            <div class=" counter-box">
              <div class="counter">
                  <div class="counter-icon"><i class="fa-solid fa-cloud-arrow-down"></i></div>
                  <span class="counter-value">2500</span>
                  <h3>App Downloads</h3>
              </div>
            </div>
          </div>
          <div class="col-lg-3 col-sm-6">
            <div class=" counter-box">
              <div class="counter">
                  <div class="counter-icon"><i class="fa-solid fa-thumbs-up"></i></div>
                  <span class="counter-value">4367</span>
                  <h3>Total Likes</h3>
              </div>
            </div>
          </div>
          <div class="col-lg-3 col-sm-6">
            <div class=" counter-box">
              <div class="counter">
                  <div class="counter-icon"><i class="fa-solid fa-star"></i></div>
                  <span class="counter-value">1000</span>
                  <h3>5 Star Ratings</h3>
              </div>
            </div>
          </div>
        </div>
      </div>
    </section>
@endsection