.cards {
    display: flex;

    overflow-x: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;

    scroll-behavior: smooth;
}

.cards::-webkit-scrollbar {
    display: none;
}

.cards__item {
    position: relative;

    min-width: 18rem;
    width: 18rem;

    display: flex;
    flex-shrink: 0;
    flex-direction: column;

    border: 1px solid var(--border-color);

    transition: border 0.5s ease-in-out;
}

.cards__item:first-of-type {
    border-radius: var(--border-radius_m) 0 0 var(--border-radius_m);
}

.cards__item:first-of-type .cards__item-img {
    border-radius: var(--border-radius_m) 0 0 0;
}

.cards__item:last-of-type {
    /* border-right: 1px solid var(--border-color); */
    border-radius: 0 var(--border-radius_m) var(--border-radius_m) 0;
}

.cards__item:last-of-type .cards__item-img {
    border-radius: 0 var(--border-radius_m) 0 0;
}

.cards__item:hover {
    border: 1px solid #000;
}

.cards__item:hover .cards__item-name {
    color: rgba(0, 0, 0, 0.75);
}

.cards__item-box-1 {
}

.cards__item-box-11 {
    overflow: hidden;
}

.cards__item-box-12 {
    /* padding: 2rem 1.5rem; */
    padding: calc(20px + (32 - 20) * (100vw - 320px) / (1920 - 320)) calc(12px + (24 - 12) * (100vw - 320px) / (1920 - 320));
}

.cards__item-goods-in-the-showroom {
    padding: 0.5rem;

    position: absolute;

    top: 0.625rem;
    left: 0.625rem;

    /* font-size: 0.625rem; */
    /* font-size: calc(8px + (10 - 8) * (100vw - 320px) / (1920 - 320)); */
    font-size: 10px;
    font-weight: 500;

    color: var(--secondary-color);
    background-color: var(--primary-color);

    text-transform: lowercase;

    border-radius: var(--border-radius_s);

    transition: background-color 0.5s ease-in-out;

    z-index: 60;
}

.cards__item-goods-in-the-showroom:hover {
    background-color: rgba(0, 0, 0, 0.75);
}

.cards__item-img {
    width: 100%;
    /* height: 16rem; */
    height: calc(144px + (256 - 144) * (100vw - 320px) / (1920 - 320));

    /* transition: transform 0.25s ease-in-out; */
}

/* .cards__item-img:hover {
    transform: scale(1.1);
} */

.cards__item-name {
    /* font-size: 14px; */
    font-size: calc(14px + (16 - 14) * (100vw - 320px) / (1920 - 320));
    font-weight: 600;
}

.cards__item-in-stock {
    margin-top: 1em;
    margin-bottom: 1.25em;

    position: relative;

    display: flex;
    align-items: center;

    font-size: 12px;
    /* font-size: calc(10px + (12 - 10) * (100vw - 320px) / (1920 - 320)); */
    font-weight: 500;

    color: var(--accent-color);
}

.cards__item-in-stock::before {
    content: "";

    margin-right: 0.5em;

    /* width: 0.25rem; */
    /* height: 0.25rem; */
    /* width: calc(2px + (4 - 2) * (100vw - 320px) / (1920 - 320));
    height: calc(2px + (4 - 2) * (100vw - 320px) / (1920 - 320)); */
    width: 4px;
    height: 4px;

    background-color: var(--accent-color);

    border-radius: 50%;
}

.cards__item-price {
    font-size: calc(14px + (16 - 14) * (100vw - 320px) / (1920 - 320));
    font-weight: 600;
}

.cards__item-btn {
    padding: 0.625rem;

    display: none;
    justify-content: center;

    font-size: calc(12px + (12 - 12) * (100vw - 320px) / (1920 - 320));
    font-weight: 600;

    color: var(--secondary-color);
    background-color: var(--accent-color);

    transition: opacity 0.25s ease-in-out;
}

.cards__item-btn:hover {
    opacity: 0.75;
}