/* ترانکیت متن + محو انتهایی */
.readmore{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  position: relative;
}

/* پیش‌فرض: دو خط دیده می‌شود؛ با JS طبق data-lines تغییر می‌کنیم */
.readmore:not(.readmore--expanded){ -webkit-line-clamp: 2; }

/* افکت محو انتها وقتی بسته است (پس‌زمینه را در صورت نیاز تغییر بده) */
.readmore:not(.readmore--expanded)::after{
  content: "";
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 2.2rem;
  background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
  pointer-events: none;
}

/* حالت باز */
.readmore.readmore--expanded{
  -webkit-line-clamp: initial !important;
  overflow: visible;
}

/* استایل پیشنهادی دکمه؛ می‌تونی عوضش کنی */
.readmore-toggle{
  display:inline-block;
  margin-top:.5rem;
  padding:.35rem .7rem;
  border:0; border-radius:.5rem;
  background:#f3f4f6; cursor:pointer; font:inherit;
}