CSS‑трюк: многострочная обрезка текста без JS

**CSS-хак**: -webkit-line-clamp обрезает текст после 2 строк и автоматически ставит многоточие — без JS и лишних контейнеров

Идеально для карточек товаров, превью статей и адаптивных плиток: просто добавьте класс .truncate-2, и блок сохранит фиксированную высоту, даже если контент длиннее. Работает во всех браузерах на базе Chromium и WebKit (Chrome, Edge, Safari, мобильные).
<style>
  /* Обрезать текст после *n* строк и показать многоточие */
  .truncate-2 {
    display: -webkit-box;        /* создаём флекс‑контейнер старого типа */
    -webkit-box-orient: vertical;/* вертикальное направление */
    -webkit-line-clamp: 2;       /* 👉 количество видимых строк */
    overflow: hidden;            /* прячем всё лишнее */
  }
</style>


<p class="card__description truncate-2">
  Samurai’s way is endless…but UI‑дизайнеру нужна ровная сетка и чёткая высота элемента.
</p>