<?php
// function isMobile() {
//    $user_agent = $_SERVER['HTTP_USER_AGENT'];
//    $mobile_agents = array(
//        'Mobile', 'Android', 'Silk/', 'Kindle', 'BlackBerry', 'Opera Mini', 'Opera Mobi'
//    );

//    $is_mobile = false;
//    foreach ($mobile_agents as $mobile_agent) {
//        if (strpos($user_agent, $mobile_agent) !== false) {
//            $is_mobile = true;
//            break;
//        }
//    }

//    return $is_mobile;
// }

// if (isMobile()) {
//    header('Location: https://app.hotchops.in');
//    exit();
// }
$title = '';
include 'header.php';
?>
        <section class="hero" id="top">
         <div class="container">
            <div class="row">
               <div class="col-md-5">
                  <div class="hero-body">
                     <span>Your wait ends here</span>
                     <h1 class="hero">We Deliver Fresh Meat & Sea Foods</h1>
                     <p class="text-muted">Hot Chops brings you premium Seafood, Chicken, Mutton, and Ready-to-Fry items with hygienic handling and consistent quality—available for both retail and wholesale orders.</p>
                     <div class="action-group">
                        <a href="#download" class="btn btn-primary waves-effect waves-light">Download App</a>
                        <a href="#working" class="btn btn-inverse waves-effect waves-light">Know More</a>
                     </div>
                  </div>
                  <!-- <div class="cities-list">
                     <h6>We are available in</h6>
                     <div class="row cities">
                        <div class="col-md-4 col-6">
                           <div class="location-holder">
                              <div class="spacer ">
                                 <img src="assets/img/cities/temple.png">
                              </div>
                              <span>Adoor</span>
                           </div>
                        </div>
                        <div class="col-md-4 col-6">
                           <div class="location-holder">
                              <div class="spacer">
                                 <img src="assets/img/cities/mosque.png">
                              </div>
                              <span>Pathanapuram</span>
                           </div>
                        </div>
                        <div class="col-md-4">
                           <div class="location-holder">
                              <div class="spacer">
                                 <img src="assets/img/cities/adoor.png">
                              </div>
                              <span>Thiruvalla</span>
                           </div>
                        </div>
                     </div>
                  </div> -->
               </div>
               <div class="col-md-7 order-2 order-sm-1 text-center" id="hide-on-mobile">
                  <div class="hero-showcase">
                     <div class="col-md-12" id="magic-btn-gy">
                        <div class="phone phone-use">
                           <div class="notch"></div>
                              <div class="iframe-wrapper">
                                 <iframe title="appIframe" src="<?php echo $appUrl; ?>" frameborder="0" id="appIframe" allow="geolocation"></iframe>
                              </div>

                           <!-- <div class="iframe-wrapper"><iframe title="appIframe" src="<?php echo $appUrl; ?>" frameborder="0" id="appIframe"></iframe></div> -->
                        </div>
                     </div>
                     <!-- <img src="assets/img/app_mockup.png" alt="hero-mockup" data-tilt="" style="will-change: transform; transform: perspective(300px) rotateX(0deg) rotateY(0deg);"> -->
                     <span class="floater title">Suguna.</span>
                  </div>
               </div>
            </div>
         </div>
      </section>
      <section class="regular user-flow" id="working">
         <div class="container">
            <h1>How it Works</h1>
            <span class="subtext">Order your daily needs in 4 simple steps</span>
            <div class="row steps">
               <div class="col-md-3 col-12">
                  <div class="step-item">
                     <img src="assets/img/search.png">
                     <h6>Search Store</h6>
                     <p>Explore top rated lists of trusted stores serving in your area</p>
                  </div>
               </div>
               <div class="col-md-3 col-12">
                  <div class="step-item">
                     <img src="assets/img/meat.png">
                     <h6>Choose Your Meat</h6>
                     <p>Select your meat or sea food and add them to your cart.</p>
                  </div>
               </div>
               <div class="col-md-3 col-12">
                  <div class="step-item">
                     <img src="assets/img/checkout.png">
                     <h6>Easy Checkout</h6>
                     <p>Pay your bill with card or cash or paylater to place your order.</p>
                  </div>
               </div>
               <div class="col-md-3 col-12">
                  <div class="step-item">
                     <img src="assets/img/delivery.png">
                     <h6>Get it Delivered</h6>
                     <p>Enjoy lightning fast delivery within 45 mins.</p>
                  </div>
               </div>
            </div>
         </div>
      </section>
      <section class="regular dark app-download" id="download">
         <div class="container">
            <h1>Download the App Now</h1>
            <span class="subtext">Install our application and experience the awesome</span>
            <div class="row">
               <div class="col-md-6 downlink-box">
                  <img src="assets/img/playstore.png" class="app-download" onclick="window.location.assign('https://play.google.com/store/apps/details?id=in.dittomart.app');">
                  <span>OR</span>
                  <form>
                     <input type="number" class="form-control" placeholder="Enter phone number">
                     <button class="btn btn-success waves-effect waves-light">Get App Link</button>
                  </form>
               </div>
               <div class="col-md-6">
                  <div class="row feature-group">
                     <div class="col-md-6 col-12">
                        <div class="feature-snip" data-tilt="">
                           <img src="assets/img/clock.png">
                           <h6>Lightning fast delivery</h6>
                           <p>Guaranteed delivery within 45 minutes.</p>
                        </div>
                     </div>
                     <div class="col-md-6 col-12">
                        <div class="feature-snip" data-tilt="" style="will-change: transform;">
                           <img src="assets/img/gift.png">
                           <h6>Assured Rewards</h6>
                           <p>Cashback with every order.</p>
                        </div>
                     </div>
                     <div class="col-md-6 col-12">
                        <div class="feature-snip" data-tilt="" style="will-change: transform; transform: perspective(300px) rotateX(0deg) rotateY(0deg);">
                           <img src="assets/img/support.png">
                           <h6>Friendly Support</h6>
                           <p>Have query? Reach us over call or chat.</p>
                        </div>
                     </div>
                     <div class="col-md-6 col-12">
                        <div class="feature-snip" data-tilt="" style="will-change: transform; transform: perspective(300px) rotateX(0deg) rotateY(0deg);">
                           <img src="assets/img/payment.png">
                           <h6>Instant Refunds</h6>
                           <p>Didn't like products? Avail instant refunds.</p>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
      </section>
      <section class="regular dark stats" id="counter">
         <div class="container">
            <div class="row">
               <div class="col-md-3">
                  <h6>DOWNLOADS</h6>
                  <h1><span class="counter-value" data-count="20000">2000</span>+</h1>
               </div>
               <div class="col-md-3">
                  <h6>STORES</h6>
                  <h1><span class="counter-value" data-count="3">3</span>+</h1>
               </div>
               <div class="col-md-3">
                  <h6>ITEMS</h6>
                  <h1><span class="counter-value" data-count="50">50</span>+</h1>
               </div>
               <div class="col-md-3">
                  <h6>ORDERS</h6>
                  <h1><span class="counter-value" data-count="100000">10000</span>+</h1>
               </div>
            </div>
         </div>
      </section>
<?php
include 'footer.php';
?>