.archive {
    margin-block: 24px 48px;
}
.articles__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

#category-filter {
    display: flex;
    gap: 16px;
    margin-bottom: 24px;
    overflow-x: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

#category-filter::-webkit-scrollbar {
    display: none;
}

#category-filter > li {
    flex-shrink: 0;
}

@media (width > 991px) {
    .articles__container {
        display: grid;
        gap: 32px 24px;
        grid-template-columns: 1fr 1fr 1fr;
    }
    .archive {
        margin-top: 2.5rem;
    }
}

@media (width > 1919px) {
    .articles__container {
        gap: 32px 32px;
    }
}