.cases-filter_wrapper {
    background: #FFF;
}

.cases-filter_tags {
    display: flex;
    padding: 13px 20px;
    background: #F1F4F9;
    border-radius: 16px;
    gap: 20px;
    flex-wrap: wrap;
    margin-bottom: 50px;
}

.cases-filter__button {
    border-radius: 10px;
    padding: 13px 18px 13px 16px;
    box-shadow: 0 2px 4px 0 rgba(17, 20, 39, 0.02), 0 7px 7px 0 rgba(17, 20, 39, 0.02), 0 16px 9px 0 rgba(17, 20, 39, 0.01), 0 28px 11px 0 rgba(17, 20, 39, 0), 0 43px 12px 0 rgba(17, 20, 39, 0);
    background: #FFF;
    flex-basis: calc((100% - 80px) / 5);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #000000;
    border: 2px solid #FFF;
    text-align: center;
    transition: all 0.3s ease;
}

.cases-filter__button.active-case-tag,
.cases-filter__button:hover {
    border-color: #FF5A46;
}

.cases-filter__items {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

@media screen and (max-width: 1199.98px) {

    .cases-filter__button {
        flex-basis: calc((100% - 40px) / 3);
    }

    .cases-filter_tags {
        margin-bottom: 30px;
    }

    .cases-filter__items {
        gap: 30px;
    }
}

@media screen and (max-width: 1023.98px) {
    .cases-filter_tags {
        gap: 10px;
        border-radius: 20px;
        justify-content: center;
        padding: 15px;
    }

    .cases-filter__button {
        flex-basis: fit-content;
        padding: 9px 20px;
    }

    .cases-filter_tags {
        margin-bottom: 20px;
    }

    .cases-filter__items {
        gap: 20px;
    }
}