/* Блог — базовые стили */

.section--blog {
    padding: 80px 0;
}

.section--blog .eyebrow {
    display: block;
    opacity: .7;
    margin-bottom: 8px;
}

.section--blog h1 {
    font-size: 42px;
    margin-bottom: 40px;
}

.card {
    background: rgba(255,255,255,0.05);
    padding: 20px;
    border-radius: 16px;
    transition: .25s;
}

.card:hover {
    background: rgba(255,255,255,0.08);
}

.card__title {
    font-size: 20px;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 4px;
}

.card__meta {
    opacity: .7;
    font-size: 14px;
    margin-bottom: 10px;
}

.card__text {
    opacity: .85;
    font-size: 15px;
    line-height: 1.45;
}

.grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

@media (min-width: 768px) {
    .grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1100px) {
    .grid {
        grid-template-columns: repeat(3, 1fr);
    }
}