.product-card{
    display:flex; flex-direction:column; gap:12px;
    background:#fff; border-radius:16px; padding:14px;
    box-shadow:0 6px 20px rgba(0,0,0,.06);
    border:1px solid rgba(0,0,0,.06);
    transition:transform .18s ease, box-shadow .18s ease;
    will-change: transform;
    max-width: 290px;
    min-height:100%;
}
.product-card:hover{ transform:translateY(-4px); box-shadow:0 10px 26px rgba(0,0,0,.10); }

/* ====== Медиа-рамка: одна высота на всех ====== */
.product-card__image{
    display:block;
    border-radius:12px;
    background: var(--color-light, #f8f8f8);
    position:relative;
    overflow:hidden;
}

.product-card__figure{
    margin:0;
    height: var(--card-media-h);
    /* если браузер поддерживает aspect-ratio — подстраховка */
    aspect-ratio: 4/3;
    display:grid;
    place-items:center;
    background: linear-gradient(180deg,#fff,#fafafa);
}

/* картинка не «выпрыгивает» из рамки */
.product-card__img{
    width: 100%;
    height: 100%;
    object-fit: contain;      /* не режем фото, вписываем */
    object-position: center;
}

/* бейдж остаётся как был */
.product-card__badge{
    position:absolute; top:10px; right:10px;
    background: var(--color-primary,#CD2D25); color:#fff; font-weight:700;
    padding:6px 10px; border-radius:10px; font-size:12px; line-height:1;
    box-shadow:0 4px 12px rgba(205,45,37,.35);
}

/* ====== Заголовок: ровная высота, не растягивает карточку ====== */
.product-card__title{
    margin:0;
    font-size: var(--font-base, 1.05rem);
    line-height: 1.3;
    /* две строки фикс — остальное скрываем */
    display: -webkit-box;
    -webkit-line-clamp: var(--title-lines);
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.3em * var(--title-lines)); /* одинаковая высота */
}

.product-card__title-link,
.product-card__title-text{
    color: var(--color-dark,#1D1D1C);
    text-decoration: none;
    font-weight: 800;
}
.product-card__title-link:hover{ text-decoration: underline; text-underline-offset:3px; }

/* ====== Цена/кнопка ====== */
.product-card__price{
    display:flex;
    align-items:flex-end;
    gap:10px;
    text-decoration:none;
    margin-top:-2px;
    flex-wrap:wrap; /* если всё же мало места, переносим старую цену */
}
.product-card__price-current{
    font-weight:900;
    font-size: clamp(1.05rem, 1vw + .6rem, 1.25rem);
    color: var(--color-primary,#CD2D25);
    white-space: nowrap; /* не переносить основную цену */
}
.product-card__price-old{
    font-size:.9rem;
    color:#9b9b9b;
    text-decoration: line-through;
    white-space: nowrap;
}

.product-card__availability{
    font-size:var(--font-small, 0.95rem); font-weight:700;
    width:max-content; padding:6px 10px; border-radius:999px;
    border:1px solid rgba(0,0,0,.08);
}
.product-card__availability--in{ color:#1c7c3a; background:#e9f7ef; border-color:#d6f0e1; }
.product-card__availability--pre{ color:#7a4d00; background:#fff6e6; border-color:#ffe7b3; }
.product-card__availability--out{ color:#8a1b1b; background:#fdecec; border-color:#f8c8c8; }
/* кастом останется нейтральным */



.product-card__btn{
    margin-top:auto;
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    padding:12px 14px; border-radius:12px; border:2px solid transparent;
    background:var(--color-primary,#CD2D25); color:#fff; font-weight:800;
    cursor:pointer; transition:transform .12s ease, box-shadow .12s ease, background .2s ease;
    box-shadow:0 8px 18px rgba(205,45,37,.20);
}
.product-card__btn:hover{ transform:translateY(-1px); box-shadow:0 10px 22px rgba(205,45,37,.28); background:var(--color-primary-hover,#8f201b); }

@media (max-width: 920px){
    .product-card{ padding:12px; border-radius:14px; }
    .product-card__badge{ top:8px; right:8px; }
}

/* утилита для доступности */
.sr-only{
    position:absolute!important; width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}


/* ====== Карточка: базовая сетка оставляем, добавим переменные ====== */
.product-card{
    /* уже есть ваши стили */
    --card-media-h: clamp(180px, 24vw, 220px); /* общая фиксированная высота медиа */
    --title-lines: 2;                           /* сколько строк у заголовка */
}


/* бейдж остаётся как был */
.product-card__badge{
    position:absolute; top:10px; right:10px;
    background: var(--color-primary,#CD2D25); color:#fff; font-weight:700;
    padding:6px 10px; border-radius:10px; font-size:12px; line-height:1;
    box-shadow:0 4px 12px rgba(205,45,37,.35);
}

/* ====== Заголовок: ровная высота, не растягивает карточку ====== */
.product-card__title{
    margin:0;
    font-size: var(--font-base, 1.05rem);
    line-height: 1.3;
    /* две строки фикс — остальное скрываем */
    display: -webkit-box;
    -webkit-line-clamp: var(--title-lines);
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: calc(1.3em * var(--title-lines)); /* одинаковая высота */
}

.product-card__title-link,
.product-card__title-text{
    color: var(--color-dark,#1D1D1C);
    text-decoration: none;
    font-weight: 800;
}
.product-card__title-link:hover{ text-decoration: underline; text-underline-offset:3px; }

/* ====== Цена/кнопка ====== */
.product-card__price{
    display:flex;
    align-items:flex-end;
    gap:10px;
    text-decoration:none;
    margin-top:-2px;
    flex-wrap:wrap; /* если всё же мало места, переносим старую цену */
}
.product-card__price-current{
    font-weight:900;
    font-size: clamp(1.05rem, 1vw + .6rem, 1.25rem);
    color: var(--color-primary,#CD2D25);
    white-space: nowrap; /* не переносить основную цену */
}
.product-card__price-old{
    font-size:.9rem;
    color:#9b9b9b;
    text-decoration: line-through;
    white-space: nowrap;
}

/* кнопка всегда у нижней кромки */
.product-card__btn{ margin-top:auto; }

/* ====== Небольшой тюнинг адаптива ====== */
@media (max-width: 920px){
    .product-card{ padding:12px; border-radius:14px; }
    .product-card__badge{ top:8px; right:8px; }
    .product-card{ --card-media-h: clamp(160px, 35vw, 200px); }
}

/* ====== Мобильные стили для .product-card ====== */

@media (max-width: 768px) {
    .product-card {
        /* Уменьшаем отступы, чтобы не жрать экран */
        padding: 10px;
        border-radius: 12px;

        /* Максимальная ширина — 90% ширины экрана, но не больше 290px */
        max-width: 90vw;
        width: 100%;
        min-height: auto;

        /* Уменьшаем тень и границу, чтобы не «жирить» мобильный вид */
        box-shadow: 0 4px 16px rgba(0,0,0,.06);
        border: 1px solid rgba(0,0,0,.06);
    }

    .product-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 6px 18px rgba(0,0,0,.10);
    }

    /* Увеличиваем немного высоту медиа‑блока, чтобы картинка была «длиннее» */
    .product-card {
        --card-media-h: clamp(140px, 32vw, 200px);
    }

    /* Рамка под медиа — занимает всю ширину карточки */
    .product-card__image {
        width: 100%;
        height: 300px;
        border-radius: 12px;
        background: var(--color-light, #f8f8f8);
        position: relative;
        overflow: hidden;
        border: none;
    }

    /* Внутренний блок с aspect‑ratio */
    .product-card__figure {
        margin: 0;
        height: var(--card-media-h);
        width: 100%;
        aspect-ratio: 4/3;
        display: grid;
        place-items: center;
        background: linear-gradient(180deg,#fff,#fafafa);
    }

    /* Картинка — чуть меньше агрессивного обрезания по краям */
    .product-card__img {
        width: 100%;
        height: 100%;
        object-fit: cover;           /* всё равно растягиваем, но блок стал выше */
        object-position: center top; /* поднимаем чуть вверх, чтобы «обрезало» меньше внизу */
    }

    /* Бейдж чуть смещаем и уменьшаем отступы */
    .product-card__badge {
        top: 6px;
        right: 6px;
        padding: 4px 8px;
        font-size: 11px;
    }

    /* Остальное как обычно */
    .product-card__title {
        font-size: var(--font-base, 1rem);
        line-height: 1.35;
        --title-lines: 2;
    }

    .product-card__title-link,
    .product-card__title-text {
        font-weight: 700;
    }

    .product-card__price {
        gap: 6px;
        margin-top: -2px;
    }

    .product-card__price-current {
        font-size: clamp(1rem, 2.2vw + 0.15rem, 1.15rem);
        white-space: normal;
    }

    .product-card__price-old {
        font-size: 0.85rem;
    }

    .product-card__availability {
        font-size: var(--font-small, 0.9rem);
        padding: 5px 9px;
        border-radius: 999px;
    }

    .product-card__btn {
        padding: 10px 12px;
        border-radius: 10px;
        font-size: 0.95rem;
        box-shadow: 0 6px 14px rgba(205,45,37,.20);
        margin-top: 10px;
    }

    .product-card__btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 8px 16px rgba(205,45,37,.26);
    }
}

/* Ещё меньшие устройства */
@media (max-width: 370px) {
    .product-card {
        padding: 8px;
        border-radius: 10px;
    }

    .product-card {
        --card-media-h: clamp(110px, 38vw, 150px);
    }

    .product-card__badge {
        top: 5px;
        right: 5px;
        font-size: 10px;
    }

    .product-card__price-current {
        font-size: 0.95rem;
    }

    .product-card__btn {
        padding: 8px 10px;
        font-size: 0.9rem;
    }
}