.feed--mist-background {
    --feed-background-color: var(--color-mist);
}

.feed--mist-background .feed-container {
    padding: 0;
}

.feed-container {
    background: rgb(var(--feed-background-color, var(--color-chalk)));
    border-radius: 5px;
    padding-top: var(--container-padding-x);
    padding-bottom: var(--container-padding-x);
}

.feed__title {
    padding: 0 !important;
    margin: 0 0 48px 0;
    color: #000;
    font-size: 23px;
    font-style: normal;
    font-weight: 800;
    line-height: var(--line-height-large);
}

.feed__grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.feed__button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 44px;
    margin-top: 48px;
    background: rgb(var(--color-dark-green));
    border: 2px solid transparent;
    color: rgb(var(--color-lime));
    font-family: var(--font-brand);
    font-size: 1.125rem;
    line-height: var(--line-height-large);
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

    .feed__button:hover {
        background: rgb(var(--color-lime));
        color: rgb(var(--color-dark-green));
    }

    .feed__button:focus-visible {
        background: rgb(var(--color-dark-green));
        border-color: rgb(var(--color-lime));
        color: rgb(var(--color-lime));
    }

@media print, screen and (min-width: 768px) {
    .feed {
        padding: 48px 32px;
    }

}