JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://stroyka.html.themeforest.scompiler.ru/themes/default-ltr/vendor/bootstrap/css/bootstrap.min.css">
<script src="https://stroyka.html.themeforest.scompiler.ru/themes/default-ltr/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<link rel="stylesheet" href="https://stroyka.html.themeforest.scompiler.ru/themes/default-ltr/css/style.css">
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css">
<div class="products_container">
  <div class="products-list__item">
  <div class="product-card product-card--hidden-actions ">
      <button class="product-card__quickview" type="button">
        <i class="fas fa-search" style="font-size:16px"></i>
      </button>
      <div class="product-card__image product-image">
        <a href="#" class="product-image__body">
          <img class="product-image__img" src="https://stroyka.html.themeforest.scompiler.ru/themes/default-ltr/images/products/product-1.jpg" alt="" title="">
        </a>
      </div>
      <div class="product-card__info">
                                                                                
        <div class="product-card__name">
          <a href="#">Product One</a>
        </div>

        <div class="product-card__rating">
          <div class="product-card__rating-stars">

            <div class="rating">
              <div class="rating__body">
                <i class="fas fa-star"></i>
                <i class="fas fa-star"></i>
                <i class="fas fa-star"></i>
                <i class="fas fa-star"></i>
                <i class="far fa-star"></i>

              </div>
            </div>
          </div>
          <div class="product-card__rating-legend">12 отзывов</div>
        </div>

        <ul class="product-card__features-list">
          <p>
            Характеристики
          </p>
          <li><strong>Ключ</strong>: Значение</li>
          <li><strong>Ключ</strong>: Значение</li>
         ...

CSS

.products_container {
  display:flex;
  justify-content: space-between;
  flex-wrap:wrap;
}
.products-list__item {
  width:30%;
  margin:5px;
}

.product-card__prices {
  padding: 20px;
}
.rating i {
  color: #eac200;
}
.product-card__name{
  font-family:'Montserrat', sans-serif;
}
.price-old {
    color: gray;
    text-decoration: line-through;
}
.product-card__buttons .btn-primary {
  padding:0 15px;
}
.product-card__buttons i {
  padding: 5px;
}
.product-card__features-list,
.product-card__buttons{
  display: none;
}
.product-card:hover .product-card__features-list, 
.product-card:hover .product-card__buttons{
  display:block;
}

/* Напишите свои стили ниже */

.products-list__item{
position: relative
}
.products-list__item .product-card{
position: absolute;
z-index: 2;
}