div#block-vesta-theme-views-block-catalog-block-front{
    margin-block: 0 90px;
}

.view-id-catalog.view-display-id-block_front .view-content{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 9px;
}

.view-display-id-block_front .view-content .views-row{
    max-width: 286px;
    width: 100%;
    box-shadow: var(--shadow-1);
    background-color: var(--color-white);
    color: var(--color-accent);
    border-radius: 5px;
    transition: 0.2s;
}

.view-id-catalog.view-display-id-block_front .view-content .views-row:hover{
    background-color: var(--color-accent);
    color: var(--color-white);
}

.view-id-catalog.view-display-id-block_front .view-content .views-row .field--name-field-catalog-image{
    max-width: 286px;
    width: 100%;
    height: 180px;
    margin-left: auto;
}

.view-id-catalog.view-display-id-block_front .view-content .views-row .field--name-field-catalog-image img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.view-id-catalog.view-display-id-block_front .view-content .views-row .taxonomy-term--type-catalog.taxonomy-term--view-mode-teaser{
    position: relative;
}
.view-id-catalog.view-display-id-block_front .view-content .views-row .field.field--name-taxonomy-term-title{
    position: absolute;
    inset: 0;
}

.view-id-catalog.view-display-id-block_front .view-content .views-row .field.field--name-taxonomy-term-title .h4{
    width: 100%;
    height: 100%;
    font-size: 18px;
}

.view-id-catalog.view-display-id-block_front .view-content .views-row .field.field--name-taxonomy-term-title .h4 a{
    display: block;
    width: 100%;
    height: 100%;
    padding: 20px 25px;
    line-height: 130%;
}

.view-id-catalog.view-display-id-block_front .view-footer{
    text-align: center;
    margin-top: 40px;
}

/*  Страница каталог (категории)  */
.view-id-catalog.view-display-id-page .view-content{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 9px;
}

.view-id-catalog.view-display-id-page .view-content .views-row{
    max-width: 286px;
    width: 100%;
    box-shadow: var(--shadow-1);
    background-color: var(--color-white);
    color: var(--color-accent);
    border-radius: 5px;
    transition: 0.2s;
}

.view-id-catalog.view-display-id-page .view-content .views-row:hover{
    background-color: var(--color-accent);
    color: var(--color-white);
}

.view-id-catalog.view-display-id-page .view-content .views-row .field--name-taxonomy-term-title{
    position: absolute;
    inset: 0;
}

.view-id-catalog.view-display-id-block_front .view-content .views-row .field.field--name-taxonomy-term-title .h4,
.view-id-catalog.view-display-id-page .view-content .views-row .field--name-taxonomy-term-title h2{
    width: 100%;
    height: 100%;
    font-size: 18px;
    /* color: var(--color-accent); */
}

.view-id-catalog.view-display-id-page .view-content .views-row .field--name-taxonomy-term-title h2 a{
    display: block;
    width: 100%;
    height: 100%;
    padding: 20px 25px;
}

.wraper-cart-price{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.field--widget-commerce-quantity{
    display: none;
}

.taxonomy-term.taxonomy-term--type-catalog.taxonomy-term--view-mode-teaser {
    position: relative;
}

@media screen and (max-width: 1200px) {
    div#block-vesta-theme-views-block-catalog-block-front {
        margin-bottom: calc(50px + (90 - 50) * ((100vw - 767px) / (1200 - 767)));
    }
}



@media screen and (max-width: 992px) {
    .view-display-id-block_front .view-content .views-row,
    .view-id-catalog.view-display-id-page .view-content .views-row{
        max-width: 218px;
        width: 100%;
    }

    .view-id-catalog.view-display-id-block_front .view-content .views-row .field--name-field-catalog-image{
        height: calc(115px + (180 - 115) * ((100vw - 320px) / (992 - 320)));
    }

    .view-id-catalog.view-display-id-block_front .view-content .views-row .field.field--name-taxonomy-term-title .h4 a{
        font-size:calc(12px + (18 - 12) * ((100vw - 320px) / (992 - 320)));
    }
}

@media screen and (max-width: 767px) {
    .view-display-id-block_front .view-content .views-row,
    .view-id-catalog.view-display-id-page .view-content .views-row{
        max-width: 48%;
        width: 100%;
        height: 155px;
    }
    div#block-vesta-theme-views-block-catalog-block-front {
        margin-block: 0 50px;
    }
    .view-id-catalog.view-display-id-block_front .view-content .views-row .field.field--name-taxonomy-term-title .h4 a{
        padding: 10px 10px;
    }
    .view-id-catalog.view-display-id-page .view-content .views-row .field--name-taxonomy-term-title h2{
        font-size: 12px;
    }
}