@layer components {
.news-offers {
    padding: 95px 0 99px;
    background: var(--color-surface);
}
.news-offers__heading {
    display: grid;
    gap: 21px;
    margin-bottom: 31px;
}

.news-offers__title,
.news-offers__card-title {
    color: var(--color-brand-dark);
}

.news-offers__grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
}

.news-offers__card {
    min-width: 0;
    border-radius: var(--radius-panel);
}

.news-offers__card--post {
    --news-offers-card-border: #d8cbcb;

    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 15px;
    padding: 25px 25px 26px;
    border: 1px solid var(--news-offers-card-border);
    background: var(--color-surface);
}

.news-offers__meta {
    display: flex;
    align-items: center;
    gap: 16px;
}

.news-offers__date {
    color: var(--color-text-tertiary);
}

.news-offers__date,
.news-offers__card-link {
    font-family: var(--font-family-primary);
    font-size: 13px;
    font-weight: 500;
    line-height: 0.98;
    letter-spacing: 0;
}

.news-offers__copy {
    display: grid;
    align-content: start;
    gap: 14px;
}

.news-offers__card-title {
    font-family: var(--font-family-primary);
    font-size: 24px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
}

.news-offers__card-text {
    color: var(--color-text-secondary);
    font-family: var(--font-family-primary);
    font-size: 11px;
    font-weight: 500;
    line-height: 0.98;
    letter-spacing: 0;
}

.news-offers__card-link {
    align-self: end;
    color: var(--color-brand-orange);
}

.news-offers__more {
    display: flex;
    width: fit-content;
    margin: 32px auto 0;
    color: var(--color-text-secondary);
    font-family: var(--font-family-primary);
    font-size: 13px;
    font-weight: 700;
    line-height: 0.98;
    letter-spacing: 0;
    text-align: center;
}


@media (max-width: 767px) {
    .news-offers {
        padding: 50px 0 29px;
    }

    .news-offers__heading {
        gap: 22px;
        margin-bottom: 21px;
    }

    .news-offers__grid {
        grid-template-columns: 1fr;
        gap: 19px;
    }

    .news-offers__card--post {
        gap: 18px;
        padding: 25px 18px 18px;
    }

    .news-offers__card-title {
        font-size: 22px;
    }

    .news-offers__card-text {
        line-height: 1.28;
    }

    .news-offers__more {
        margin-top: 39px;
    }
}

}