.content_filters .block--wrapper
{
    display: grid;

    gap: 32px;
    grid-template-columns: 1fr 4fr;
}
@media (max-width: 1024px)
{
    .content_filters .block--wrapper
    {
        grid-template-columns: 1fr;
    }
}

.content_filters .catalog__content
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;

    gap: 32px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
}

.content_filters .catalog__list
{
    display: grid;

    list-style: none;

    grid-template-columns: 1fr;
    gap: 24px;
}
.content_filters .catalog__list[data-grid='1']
{
    grid-template-columns: 1fr;
}
.content_filters .catalog__list[data-grid='2']
{
    grid-template-columns: 1fr 1fr;
}
@media (max-width: 768px)
{
    .content_filters .catalog__list[data-grid='2']
    {
        grid-template-columns: 1fr;
    }
}
.content_filters .catalog__list[data-grid='2'] .card
{
    grid-template-columns: 1fr;
    grid-template-areas: 'image' 'content';
}
.content_filters .catalog__list[data-grid='3']
{
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}
@media (max-width: 992px)
{
    .content_filters .catalog__list[data-grid='3']
    {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 768px)
{
    .content_filters .catalog__list[data-grid='3']
    {
        grid-template-columns: 1fr;
    }
}
.content_filters .catalog__list[data-grid='3'] .card
{
    grid-template-columns: 1fr;
    grid-template-areas: 'image' 'content';
}
.content_filters .catalog__list[data-grid='3'] .card__content
{
    gap: 16px;
}

.content_filters .card
{

    position: relative;
    max-width: 100%;
    border: var(--border-color) 1px solid;
    border-radius: 16px;
    border-radius: var(--border-corner);
    background-color: #fff;
}
.content_filters .card__block
{
    display: grid;
    grid-template-columns: 2fr 3fr;
    grid-template-areas: 'image content';
}
@media (max-width: 768px)
{
    .content_filters .card__block
    {
        grid-template-columns: auto;
        grid-template-areas: 'image' 'content' 'place';
    }
}
.content_filters .card__image
{
    overflow: hidden;

    border-radius: 8px;
    display: flex;
    position: relative;
}
.content_filters .card__image img
{
    flex: 0 0 100%;
    width: 100%;
    height: 100%;

    border-radius: 8px;

    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}
.content_filters .card .rating
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    gap: 16px;
}
.content_filters .card .card__rating
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 6px;
}
.content_filters .card .card__rating .stars
{
    padding: 24px 0 8px;
}
.content_filters .card .card__rating .star-rate
{
    height: 18px;

    --inactive_stars: var(--c-surface-primary-hovered);
    --star-color: var(--c-text-accent);
}
.content_filters .card__content
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    padding: 24px 24px 104px 24px;
    grid-area: content;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    gap: 16px;
}
.content_filters .card__content-title
{
    font-size: var(--fs-24);
    font-weight: bold;
    line-height: 1.4;

    -webkit-transition: .2s ease-in-out;
    -o-transition: .2s ease-in-out;
    transition: .2s ease-in-out;

    color: var(--text-color);

    grid-area: title;
}
.content_filters .card__content-price
{
    font-size: var(--fs-16);
    line-height: 1.25;

    position: absolute;
    right: 0;
    bottom: 0;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    padding: 0 24px 24px 0;

    white-space: nowrap;

    color: var(--c-text-subdued);

    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (max-width: 768px)
{
    .content_filters .card__content-price
    {
        left: 0;

        padding: 0 0 24px 24px;
    }
}

.content_filters .card__content-price .price
{
    font-size: var(--fs-18);
    font-weight: bold;

    margin-right: 5px;
}
.content_filters .card__button
{
    font-size: var(--fs-);
    font-weight: 500;

    width: -webkit-fit-content;
    width:    -moz-fit-content;
    width:         fit-content;
    margin-left: 16px;

    cursor: pointer;
    -webkit-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
    text-align: center;
    text-decoration: none;

    color: #fff;
    border-radius: var(--border-corner);
    background-color: var(--c-surface-accent);
    margin-right: 16px ;
}
.content_filters .card__button:hover,
.content_filters .card__button:focus,
.content_filters .card__button:active
{
    color: #fff;
    background-color: var(--c-surface-accent-hovered);
}
.content_filters .card .card__info
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;

    padding: 16px 0;

    color: var(--c-text-subdued);

    grid-area: place;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
}
@media (max-width: 768px)
{
    .content_filters .card .card__info
    {
        padding: 8px 0;
    }
}
.content_filters .card .card__info p
{
    font-size: var(--fs-16);
    line-height: 1.3;

    margin-top: .3em;
}

.content_filters .nav
{
    padding: 0;
}
.content_filters .nav ul
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    list-style: none;

    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.content_filters .nav ul li
{
    margin: 0 12px 8px 0;

    white-space: nowrap;
}
.content_filters .nav ul li a,
.content_filters .nav .crop-button
{
    font-size: var(--fs-16);

    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;

    padding: .5em 1em;

    cursor: pointer;
    text-decoration: none;

    border: 1px solid currentColor;
    border-color: var(--border-color);
    border-radius: var(--border-corner);
    max-width: calc(100vw - 32px);
    overflow-x: hidden;
    text-overflow: ellipsis;

    -o-text-overflow: ellipsis;
}
.content_filters .nav ul li a:hover,
.content_filters .nav ul li a:focus,
.content_filters .nav ul li a:active
{
    color: #fff;
    background-color: var(--c-surface-accent-hovered);
}
.content_filters .nav ul li a.active
{
    color: #fff;
    background-color: var(--c-surface-accent-hovered);
}

.content_filters .sort h3
{
    font-size: var(--fs-18);
}

.content_filters .sort ul
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    margin-top: 8px;

    list-style: none;

    -webkit-transition: .2s ease-in-out;
    -o-transition: .2s ease-in-out;
    transition: .2s ease-in-out;

    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 8px;
}
.content_filters .sort ul li
{
    font-size: var(--fs-16);

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: row;

    width: -webkit-fit-content;
    width:    -moz-fit-content;
    width:         fit-content;
    padding: .5em 1em;

    cursor: pointer;
    -webkit-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);

    border: var(--border-color) 1px solid;
    border-radius: var(--border-corner);
    border-radius: 4px;

    gap: 8px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.content_filters .sort ul li:hover,
.content_filters .sort ul li:focus,
.content_filters .sort ul li:active,
.content_filters .sort ul li.active
{
    position: relative;

    border: var(--c-surface-accent-hovered) 1px solid;
}
.content_filters .sort ul li.active:after
{
    top: 25%;
    right: 0;

    width: 18px;
    height: 18px;

    content: '';

    background: url('data:image/svg+xml,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' width=\'24\' height=\'24\' viewBox=\'0 0 24 24\' fill=\'none\'%3E%3Cpath d=\'M9 5C9 4.44772 8.55228 4 8 4C7.44772 4 7 4.44772 7 5V16.585L4.70711 14.2929L4.6129 14.2097C4.22061 13.9047 3.65338 13.9324 3.29289 14.2929C2.90237 14.6834 2.90237 15.3166 3.29289 15.7071L7.29289 19.7071C7.32136 19.7356 7.35153 19.7623 7.38325 19.7872L7.47929 19.854L7.57678 19.9063L7.68786 19.9503L7.79927 19.9798L7.92476 19.9972L8 20L8.11747 19.9932L8.26599 19.9642L8.37134 19.9288L8.48406 19.8753L8.59531 19.8037L8.66315 19.7485L8.70711 19.7071L12.7071 15.7071L12.7903 15.6129C13.0953 15.2206 13.0676 14.6534 12.7071 14.2929L12.6129 14.2097C12.2206 13.9047 11.6534 13.9324 11.2929 14.2929L9 16.585V5Z\' fill=\'black\'/%3E%3Cpath d=\'M16 15C15.4477 15 15 15.4477 15 16C15 16.5523 15.4477 17 16 17H18C18.5523 17 19 16.5523 19 16C19 15.4477 18.5523 15 18 15H16Z\' fill=\'black\'/%3E%3Cpath d=\'M15 12C15 11.4477 15.4477 11 16 11H20C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H16C15.4477 13 15 12.5523 15 12Z\' fill=\'black\'/%3E%3Cpath d=\'M16 7C15.4477 7 15 7.44772 15 8C15 8.55228 15.4477 9 16 9H22C22.5523 9 23 8.55228 23 8C23 7.44772 22.5523 7 22 7H16Z\' fill=\'black\'/%3E%3C/svg%3E') no-repeat;
    background-size: cover;
}
.content_filters .sort ul li[data-rating='decreasing']:after,
.content_filters .sort ul li[data-reviews='decreasing']:after,
.content_filters .sort ul li[data-price='decreasing']:after
{
    -webkit-transform: rotate(0);
    -ms-transform: rotate(0);
    transform: rotate(0);
}
.content_filters .sort ul li[data-rating='increasing']:after,
.content_filters .sort ul li[data-reviews='increasing']:after,
.content_filters .sort ul li[data-price='increasing']:after
{
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
@media(max-width: 1023px) {
    .content_filters .active {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        overflow-y: auto;
        flex-direction: column;

        width: calc(100vw - 32px);

        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
    }
}

.content_filters h4
{
    font-size: var(--fs-18);
    font-weight: 600;

    margin-bottom: 16px;
}

@media (min-width: 1024px)
{
    .content_filters .filters--button-mob
    {
        display: none;
    }
}

.content_filters .filters--button-mob:hover,
.content_filters .filters--button-mob:focus,
.content_filters .filters--button-mob:active
{
    border: var(--c-surface-accent-hovered) 2px solid;
    background-color: transparent;
}

@media (max-width: 1024px)
{
    .content_filters .filters .button
    {
        width: 100%;
    }
}

@media (max-width: 1024px)
{
    .content_filters .filters__block
    {
        display: none;
    }
}

.content_filters .filters__block ul
{
    margin-bottom: 24px;

    list-style: none;
}
@media(max-width: 1024px){
    .content_filters .filters__block  {
        padding-bottom: 120px;
    }

}
.content_filters .filters__block ul li
{
    font-size: var(--fs-18);
}
.content_filters .filters__block ul li label,
.content_filters .filters__block ul li .crop-button
{
    font-size: var(--fs-16);
    font-size: var(--fs-18);
    font-weight: 400;
    line-height: 24px;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;

    margin-bottom: 8px;

    cursor: pointer;
    -webkit-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);

    color: var(--c-text-disabled);

    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 12px;
}
.content_filters .filters__block ul li label:hover,
.content_filters .filters__block ul li label:focus,
.content_filters .filters__block ul li label:active,
.content_filters .filters__block ul li .crop-button:hover,
.content_filters .filters__block ul li .crop-button:focus,
.content_filters .filters__block ul li .crop-button:active
{
    color: var(--accent-color);
}
.content_filters .filters__block ul li label input[type='checkbox'],
.content_filters .filters__block ul li .crop-button input[type='checkbox']
{
    display: none;
}
.content_filters .filters__block ul li label input:checked + span:before,
.content_filters .filters__block ul li .crop-button input:checked + span:before
{
    background-image: url('data:image/svg+xml,%3Csvg width=\'24\' height=\'24\' viewBox=\'0 0 24 24\' fill=\'none\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Crect x=\'2.5\' y=\'2.5\' width=\'19\' height=\'19\' rx=\'9.5\' fill=\'%23232323\' stroke=\'%23232323\'/%3E%3Cpath fill-rule=\'evenodd\' clip-rule=\'evenodd\' d=\'M9.91006 14.4959L7.7071 12.2929C7.31658 11.9024 6.68342 11.9024 6.29289 12.2929C5.90237 12.6834 5.90237 13.3166 6.29289 13.7071L9.29288 16.7071C9.7168 17.131 10.4159 17.0892 10.7863 16.6178L17.7863 8.61786C18.1275 8.18359 18.0521 7.55494 17.6178 7.21372C17.1835 6.87251 16.5549 6.94795 16.2136 7.38222L9.91006 14.4959Z\' fill=\'white\'/%3E%3C/svg%3E');
}
.content_filters .filters__block ul li label span:before,
.content_filters .filters__block ul li .crop-button span:before
{
    display: block;

    width: 24px;
    height: 24px;

    content: '';

    background-image: url('data:image/svg+xml,%3Csvg width=\'24\' height=\'24\' viewBox=\'0 0 24 24\' fill=\'none\' xmlns=\'http://www.w3.org/2000/svg\'%3E%3Crect x=\'2.5\' y=\'2.5\' width=\'19\' height=\'19\' rx=\'9.5\' fill=\'%23ffffff\' stroke=\'%238C9196\'/%3E%3Cpath fill-rule=\'evenodd\' clip-rule=\'evenodd\' d=\'M9.91006 14.4959L7.7071 12.2929C7.31658 11.9024 6.68342 11.9024 6.29289 12.2929C5.90237 12.6834 5.90237 13.3166 6.29289 13.7071L9.29288 16.7071C9.7168 17.131 10.4159 17.0892 10.7863 16.6178L17.7863 8.61786C18.1275 8.18359 18.0521 7.55494 17.6178 7.21372C17.1835 6.87251 16.5549 6.94795 16.2136 7.38222L9.91006 14.4959Z\' fill=\'white\'/%3E%3C/svg%3E');
}
.content_filters .filters__block ul .crop-button
{
    margin-top: 14px;

    text-decoration: underline;

    -webkit-text-decoration-skip-ink: none;
    text-decoration-skip-ink: none;
}

.content_filters .block--head{
    grid-column: span 2
}
@media(max-width: 1023px){
    .content_filters .block--head{
        grid-column: span 1
    }
}

.content_filters .slider_controls{
    left: 0;
    right: 0;
    width: 100%;
    justify-content: space-between;
    top: 50%;
    transform: translateY(-50%);
    padding: 12px;
}
.content_filters .js-long_list > li:nth-child(n+5):not(:last-child) {
    display: none;
}
.content_filters .js-long_list.active > li:nth-child(n+5):not(:last-child) {
    display: list-item;
}
.content_filters .js-long_list.is_filtred > li:not(.hidden){
    display: list-item;
}
.content_filters .catalog__list.is_filtred 
.hidden{
    display: none !important;
}
.catalog__list.is_filtred .card__button{
    display:none;
}
