.category-description {
  position: relative;
}

.category-description .show-more {
  display: none;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  cursor: pointer;
  background-color: #8bba18;
  color: #fff;
  font-size: 0.8rem;
  padding: 4px 16px;
}

@media (max-width: 991.98px) {
  .category-description {
    max-height: 200px;
    overflow: hidden;
    transition: max-height 0.3s ease-in-out;
  }

  .category-description::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.6), #fff);
    pointer-events: none;
  }

  .category-description.open {
    max-height: unset;
    padding-bottom: 30px;
  }

  .category-description.open::after {
    display: none;
  }

  .category-description .show-more {
    display: block;
    cursor: pointer;
  }

  .category-description .show-more span:last-child,
  .category-description .show-more span:first-child {
    display: none;
  }

  .category-description.open .show-more span:last-child {
    display: block;
  }

  .category-description:not(.open) .show-more span:first-child {
    display: block;
  }
}