<!DOCTYPE html>
<html lang="en">

<%- include('./partials/head') %>

<body>
  <%- include('./partials/header') %>

<main>
  <h1>PRODUCTOS DESTACADOS</h1>
  <div class="line"></div><!--linea horizontal-->
  <div class="products">
    <div class="images">
      <img src="/images/cartel.jpg" alt="Cartel">
      <div class="description">
        <p>Cartel Bienvenida</p>
        <p>$550</p>
        <button class="btn-detail"><a href="/productDetail.ejs">Detalles </a></button>  
        <button class="btn-add"><a href="/productCart.ejs">Agregar <i class="fa-solid fa-cart-shopping"></i></a></button>
      </div>
    </div>
  </div>

  <div class="products">
    <div class="images">
      <img src="/images/Lampara_colgante.jpg" alt="Luminarias">
      <div class="description">
        <p>Luminaria Colgante</p>
        <p>$2,750.00</p>
        <button class="btn-detail"><a href="/productDetail.ejs">Detalles </a></button>  
        <button class="btn-add"><a href="/productCart.ejs">Agregar <i class="fa-solid fa-cart-shopping"></i></a></button>
      </div>
    </div>
  </div>

  <div class="products">
    <div class="images">
      <img src="/images/cajas.jpg" alt="Buzon">
      <div class="description">
        <p>Caja Personalizada</p>
        <p>$1,900.00</p>
        <button class="btn-detail"><a href="/productDetail.ejs">Detalles </a></button>  
        <button class="btn-add"><a href="/productCart.ejs">Agregar <i class="fa-solid fa-cart-shopping"></i></a></button>
      </div>
    </div>
  </div>

  <div class="products">
    <div class="images">
      <img src="/images/Navidad.jpg" alt="Formitas">
      <div class="description">
        <p>Formitas Navidad</p>
        <p>$700.00</p>
        <button class="btn-detail"><a href="/productDetail.ejs">Detalles </a></button>  
        <button class="btn-add"><a href="/productCart.ejs">Agregar <i class="fa-solid fa-cart-shopping"></i></a></button>
      </div>
    </div>
  </div>
    <br><br>
  <h1>PARA EL HOGAR</h1>
  <div class="line"></div><!--linea horizontal-->

  <div class="products">
    <div class="images">
      <img src="/images/cartel.jpg" alt="Cartel">
      <div class="description">
        <p>Cartel Bienvenida</p>
        <p>$550</p>
        <button class="btn-detail"><a href="/productDetail.ejs">Detalles </a></button>  
        <button class="btn-add"><a href="/productCart.ejs">Agregar <i class="fa-solid fa-cart-shopping"></i></a></button>
      </div>
    </div>
  </div>

  <div class="products">
    <div class="images">
      <img src="/images/Lampara_colgante.jpg" alt="Luminarias">
      <div class="description">
        <p>Luminaria Colgante</p>
        <p>$2,750.00</p>
        <button class="btn-detail"><a href="/productDetail.ejs">Detalles </a></button>  
        <button class="btn-add"><a href="/productCart.ejs">Agregar <i class="fa-solid fa-cart-shopping"></i></a></button>
      </div>
    </div>
  </div>

  <div class="products">
    <div class="images">
      <img src="/images/cajas.jpg" alt="Buzon">
      <div class="description">
        <p>Caja Personalizada</p>
        <p>$1,900.00</p>
        <button class="btn-detail"><a href="/productDetail.ejs">Detalles </a></button>  
        <button class="btn-add"><a href="/productCart.ejs">Agregar <i class="fa-solid fa-cart-shopping"></i></a></button>
      </div>
    </div>
  </div>

  <div class="products">
    <div class="images">
      <img src="/images/Navidad.jpg" alt="Formitas">
      <div class="description">
        <p>Formitas Navidad</p>
        <p>$700.00</p>
        <button class="btn-detail"><a href="/productDetail.ejs">Detalles </a></button>  
        <button class="btn-add"><a href="/productCart.ejs">Agregar <i class="fa-solid fa-cart-shopping"></i></a></button>
      </div>
    </div>
  </div>
</main>
<%- include('./partials/footer') %>
</body>
</ejs>