<!-- vertical dark card -->
          <div class="card-vertical card-dark">
              <div class="card-img-container">
                  <img src="..." alt="product-image" />
              </div>
              <div class="card-text">
                  <h1 class="card-title title-sm">Sony DSC W830 Cyber-Shot 20.1 MP Pointand Shoot Camera (Black) with 8X Optical Zoom</h1>
                  <h2 class="card-price">10,999/-</h2>
              </div>
              <div class="card-nav">
                  <div class="card-cta-btn">
                      <button class="btn primary-btn-sm add-cart">Add to Cart</button>
                      <div class="card-nav-icon">
                          <button class="btn primary-text-btn-sm icon-md">
                            <i class="far fa-heart"></i>
                          </button>
                          <button class="btn primary-text-btn-sm icon-md">
                            <i class="fas fa-share-alt"></i>
                          </button>
                      </div>
                  </div>
              </div>
          </div>