description = "Hero — offline-first POS, stats, WhatsApp CTA"
==
<section id="hero" class="vp-hero-section">
  <div class="container">
    <div class="row align-items-center">
      <div class="col-lg-7">
        <p class="eyebrow eyebrow-blue mb-2">Punto de Venta &middot; Offline-First &middot; Mexico</p>
        <h1 class="display-4 fw-bold mb-3">Vende <em style="color:var(--vp-brand); font-style:normal;">sin internet</em>. Tus datos <em style="color:var(--vp-brand); font-style:normal;">siempre tuyos</em>.</h1>
        <p class="lead text-muted mb-4">VivesPOS es un punto de venta diseniado para el comercio mexicano: rapido con teclado y scanner, corte de caja profesional, impresion de tickets y control de stock &mdash; todo offline. Sincroniza con la nube cuando tu decidas.</p>
        <div class="d-flex flex-wrap gap-3 mb-4">
          <a href="https://wa.me/523317025248?text=Hola%2C%20quiero%20una%20demo%20de%20VivesPOS" class="btn btn-lg btn-brand-cta" target="_blank" rel="noopener">
            <i class="bi-whatsapp me-2"></i>Agendar demo gratuita
          </a>
          <a href="#features" class="btn btn-lg btn-outline-secondary">Ver caracteristicas</a>
        </div>
        <div class="row g-3 mt-3">
          <div class="col-6 col-md-3"><div class="vp-stat"><div class="vp-stat-number">100%</div><div class="vp-stat-label">Offline</div></div></div>
          <div class="col-6 col-md-3"><div class="vp-stat"><div class="vp-stat-number">0</div><div class="vp-stat-label">Suscripcion forzada</div></div></div>
          <div class="col-6 col-md-3"><div class="vp-stat"><div class="vp-stat-number">F1-F11</div><div class="vp-stat-label">Atajos de teclado</div></div></div>
          <div class="col-6 col-md-3"><div class="vp-stat"><div class="vp-stat-number">Win+Linux</div><div class="vp-stat-label">Multiplataforma</div></div></div>
        </div>
      </div>
      <div class="col-lg-5 mt-4 mt-lg-0">
        <div class="card shadow-sm border-0 rounded-4 p-4">
          <p class="h5 fw-bold mb-2">Pide tu demo en 2 minutos</p>
          <p class="text-muted small mb-3">Te llamamos, te mostramos VivesPOS en vivo y te ayudamos a instalarlo. Sin compromiso.</p>
          <form action="https://wa.me/523317025248" method="get" target="_blank" rel="noopener">
            <div class="mb-3">
              <input type="text" class="form-control" name="text" placeholder="Tu nombre" required>
            </div>
            <div class="mb-3">
              <input type="tel" class="form-control" name="text" placeholder="Tu telefono (WhatsApp)">
            </div>
            <div class="mb-3">
              <select class="form-select">
                <option>Tienda de abarrotes</option>
                <option>Farmacia</option>
                <option>Ropa / calzado</option>
                <option>Autopartes</option>
                <option>Restaurante / fonda</option>
                <option>Otro retail</option>
              </select>
            </div>
            <button type="submit" class="btn btn-brand-cta w-100">
              <i class="bi-whatsapp me-2"></i>Solicitar demo
            </button>
          </form>
          <p class="text-muted small mt-2 mb-0 text-center">Sin spam &middot; Respuesta en 2h habiles</p>
        </div>
      </div>
    </div>
  </div>
</section>