/* --- 18.3.1 РАСКЛАДКА ПЛИТКИ: АРТИКУЛ БЛИЖЕ К НАЗВАНИЮ, НАЛИЧИЕ — НИЖЕ ---
   Замечание владельца 26.10.2026 (сравнение с «ВсеИнструменты»):
   * отступ «название → артикул» должен быть МЕНЬШЕ, чем «артикул → наличие»;
   * строка магазина — ниже, ближе к строке склада;
   * от строки склада до кнопки — больше воздуха.

   РЕШЕНИЕ: нижняя часть в потоке, свободное место забирает РАСПОРКА
   (`margin-top:auto`). Строки наличия и кнопка всё равно стоят на одной линии
   во всём ряду (плитки одной высоты), но отступы задаются явно, а не «на глаз». */
.card{
  position:relative;
  display:flex;
  flex-direction:column;
  height:100%;
  padding:12px}

/* Картинка и заглушка — одинаковой высоты. */
.card .media{
  height:190px;
  aspect-ratio:auto;
  overflow:hidden;
  margin-bottom:10px}

.card .no-photo{
  height:100%;
  min-height:0}

/* Название: по тексту, без пустой третьей строки. Длинное — обрезается
   тремя строками (решение владельца 26.10.2026 про «БАЗОВЫЙ PRO»). */
.card .product-name{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  /* ⚠️ Высота ПО ТЕКСТУ: никаких пустых строк между названием
     и артикулом. Ряд плиток выравнивает распорка ниже. */
  min-height:0!important;
  margin:0}

/* Артикул — вплотную к названию. */
.card .sku{
  margin:2px 0 0}

/* Строки наличия: прижаты к низу распоркой, между собой — плотнее. */
.card .card-stock-rows{
  position:static;
  margin:auto 0 0;
  gap:2px}

/* Кнопка: отдельный отступ от строки склада. */
.card .card-buy{
  position:static;
  margin-top:10px}

.card .btn{
  margin-top:0;
  width:100%}

/* Телефон: та же схема, отступы и шрифт чуть меньше. */
@media (max-width:767px){
  .card .media{height:150px}
  .card .card-stock-row,
  .card .card-stock-text,
  .card .card-stock-delivery{font-size:12px;line-height:18px;min-height:18px}
  .card .card-stock-delivery .icon{width:15px;height:15px}
  .card .card-buy{margin-top:8px}
}