/* line 1, product-item.scss */
.product-item {
  display: flex;
  flex-direction: column;
  gap: clamp(5px, 4vw, 12px); }
  @media screen and (min-width: 700px) {
    /* line 7, product-item.scss */
    .product-item:hover .product-item-img button {
      opacity: 1;
      pointer-events: all; } }
  /* line 13, product-item.scss */
  .product-item-img {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    aspect-ratio: 137 / 184; }
    /* line 22, product-item.scss */
    .product-item-img:hover > img {
      transform: scale(1.1); }
    /* line 26, product-item.scss */
    .product-item-img > img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: 0.3s ease; }
    /* line 33, product-item.scss */
    .product-item-img button {
      position: absolute;
      right: 24px;
      bottom: 16px;
      background-color: #FFF;
      color: #505050;
      font-size: 17px;
      font-weight: 400;
      text-transform: uppercase;
      padding: 10px 51px;
      opacity: 0;
      pointer-events: none;
      transition: .2s ease; }
  /* line 52, product-item.scss */
  .product-item-bottom {
    display: flex;
    flex-direction: column;
    color: #505050;
    font-size: clamp(10px, 4vw, 18px); }
    /* line 59, product-item.scss */
    .product-item-bottom > h6 {
      font-weight: 500; }
    /* line 63, product-item.scss */
    .product-item-bottom > p {
      margin-top: 8px; }