/**
 * Выравнивание карточек товаров — названия, цены, кнопки по центру
 * Добавлено: 2026-03-22
 * Задача: ровное отображение карточек на всех устройствах
 */

/* === Карточка — grid вместо flex для ровного выравнивания === */
.catalog-grid .catalog-item {
    display: grid !important;
    grid-template-rows: auto 1fr auto auto auto;
    justify-items: center;
    text-align: center;
    gap: 15px;
}

/* Картинка — на всю ширину */
.catalog-grid .catalog-item .catalog-item__img {
    width: 100%;
    justify-self: stretch;
}

/* Название — выравнивание по нижнему краю (прижимает к цене) */
.catalog-grid .catalog-item .catalog-item__name {
    align-self: end;
    width: 100%;
}

/* Цена — по центру */
.catalog-grid .catalog-item .catalog-item__price {
    margin-top: 0;
    text-align: center;
}

/* Кнопка В корзину — по центру */
.catalog-grid .catalog-item .catalog-item__add {
    margin-top: 0;
    text-align: center;
    width: 100%;
}

/* Быстрый заказ — по центру */
.catalog-grid .catalog-item .catalog-item__fast {
    text-align: center;
}

/* === ПЛАНШЕТ (≤ 1024px) === */
@media (max-width: 1024px) {
    .catalog-grid .catalog-item {
        gap: 12px;
    }
}

/* === МОБИЛЬНЫЙ (≤ 768px) === */
@media (max-width: 768px) {
    .catalog-grid .catalog-item {
        gap: 10px;
    }
}

/* === МАЛЕНЬКИЙ ЭКРАН (≤ 480px) === */
@media (max-width: 480px) {
    .catalog-grid .catalog-item {
        gap: 8px;
    }
}