/* 
 * Main Content Styles
 * Стили для основного контента (сетка новостей)
 */

/* Контейнер для основного контента */
.main-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Адаптивные отступы для контейнера контента */
@media (max-width: 767px) {
    .main-container {
        padding: 0 16px;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .main-container {
        padding: 0 24px;
    }
}

@media (min-width: 1024px) {
    .main-container {
        padding: 0 40px;
    }
}

/* Мобильные стили (до 767px) */
@media (max-width: 767px) {
    .main {
        margin-bottom: 60px;
    }

    /* Сетка новостей для мобильных */
    .news-grid {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
    }

    .news-column-left,
    .news-column-center,
    .news-column-right {
        width: 100%;
        flex: none;
    }

    .news-column-center {
        order: -1; /* Главная статья сверху */
    }

    /* Блоки новостей для мобильных */
    .news-block {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        width: 100%;
        cursor: pointer;
        transition: opacity 0.3s ease;
    }

    .news-block:hover {
        opacity: 0.8;
    }

    .news-block-with-cover {
        gap: 16px;
    }

    .news-block-cover {
        width: 100%;
        height: 200px;
        background: #F1EAE2;
        border-radius: 16px;
        overflow: hidden;
        flex: none;
    }

    .news-block-cover img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .news-featured-cover {
        width: 100%;
        height: 320px;
        background: #F0EAE3;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 20px;
        overflow: hidden;
        flex: none;
    }

    .news-featured-cover img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* Категория (малая) */
    .news-category-small {
        width: 100%;
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 15px;
        text-transform: uppercase;
        color: #575757;
        flex: none;
    }

    /* Заголовок (малый) */
    .news-title-small {
        width: 100%;
        font-family: 'IBM Plex Serif', serif;
        font-style: normal;
        font-weight: 700;
        font-size: 18px;
        line-height: 22px;
        color: #2B2B2B;
        flex: none;
        transition: color 0.3s ease;
    }

    .news-block:hover .news-title-small {
        color: #3056D3;
    }

    /* Описание (малое) */
    .news-excerpt-small {
        width: 100%;
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 17px;
        color: #575757;
        flex: none;
    }

    /* Мета информация */
    .news-meta {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
        flex: none;
    }

    .news-date {
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 15px;
        text-align: left;
        text-transform: uppercase;
        color: #575757;
        flex: none;
    }

    /* Центральный блок (большой) */
    .news-block-featured {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        width: 100%;
        cursor: pointer;
        transition: opacity 0.3s ease;
    }

    .news-block-featured:hover {
        opacity: 0.8;
    }

    /* Контент центрального блока */
    .news-featured-content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        width: 100%;
        flex: none;
    }

    /* Категория (большая) */
    .news-category-large {
        width: 100%;
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 17px;
        text-transform: uppercase;
        color: #575757;
        flex: none;
    }

    /* Заголовок (большой) */
    .news-title-large {
        width: 100%;
        font-family: 'IBM Plex Serif', serif;
        font-style: normal;
        font-weight: 900;
        font-size: 24px;
        line-height: 28px;
        color: #2B2B2B;
        flex: none;
        transition: color 0.3s ease;
    }

    .news-block-featured:hover .news-title-large {
        color: #3056D3;
    }

    /* Описание (большое) */
    .news-excerpt-large {
        width: 100%;
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 18px;
        line-height: 22px;
        color: #575757;
        flex: none;
    }

    /* Мета информация для большого блока */
    .news-meta-large {
        display: flex;
        flex-direction: row;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
        flex: none;
    }

    .news-date-large {
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 17px;
        text-align: left;
        text-transform: uppercase;
        color: #575757;
        flex: none;
    }
}

/* Планшеты (768px - 1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
    .main {
        margin-bottom: 80px;
    }

    /* Сетка новостей для планшетов */
    .news-grid {
        display: flex;
        flex-direction: row;
        gap: 24px;
    }

    .news-column-left {
        width: 48%;
    }

    .news-column-center {
        width: 100%;
        order: -1;
        margin-bottom: 24px;
    }

    .news-column-right {
        width: 48%;
    }

    .news-featured-cover {
        height: 320px;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
    }

    .news-title-large {
        font-size: 28px;
        line-height: 32px;
    }
}

/* Десктопы (1024px+) */
@media (min-width: 1024px) {
    .main {
        height: auto;
        margin-bottom: 124px;
    }

    /* Сетка новостей */
    .news-grid {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: 32px;
        width: 100%;
        max-width: 1140px;
        margin: 0 auto;
    }

    /* Левая колонка - 3 блока */
    .news-column-left {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        width: 298px;
        flex: none;
    }

    /* Центральная колонка - 1 большой блок */
    .news-column-center {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 28px;
        width: 480px;
    }

    /* Правая колонка - 4 блока */
    .news-column-right {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        width: 298px;
        flex: none;
    }

    /* Обычный блок новости */
    .news-block {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
        cursor: pointer;
        transition: opacity 0.3s ease;
    }

    .news-block:hover {
        opacity: 0.8;
    }

    /* Блок с обложкой */
    .news-block-with-cover {
        gap: 16px;
    }

    /* Обложка для обычного блока */
    .news-block-cover {
        width: 100%;
        height: 120px;
        background: #F1EAE2;
        border-radius: 20px;
        overflow: hidden;
        flex: none;
    }

    .news-block-cover img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* Категория (малая) */
    .news-category-small {
        width: 100%;
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 8px;
        line-height: 10px;
        text-transform: uppercase;
        color: #575757;
        flex: none;
    }

    /* Заголовок (малый) */
    .news-title-small {
        width: 100%;
        font-family: 'IBM Plex Serif', serif;
        font-style: normal;
        font-weight: 700;
        font-size: 16px;
        line-height: 19px;
        color: #2B2B2B;
        flex: none;
        transition: color 0.3s ease;
    }

    .news-block:hover .news-title-small {
        color: #3056D3;
    }

    /* Описание (малое) */
    .news-excerpt-small {
        width: 100%;
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 17px;
        color: #575757;
        flex: none;
    }

    /* Мета информация */
    .news-meta {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
        flex: none;
    }

    .news-date {
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 8px;
        line-height: 10px;
        text-align: right;
        text-transform: uppercase;
        color: #575757;
        flex: none;
    }

    /* Разделительная линия */
    .news-line {
        width: 100%;
        height: 0;
        border: 1px solid #F1EAE2;
        border-bottom: 0.5px solid #FFF9F2;
        flex: none;
        position: relative;
    }

    /* Центральный блок (большой) */
    .news-block-featured {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 28px;
        width: 100%;
        cursor: pointer;
        transition: opacity 0.3s ease;
    }

    .news-block-featured:hover {
        opacity: 0.8;
    }

    /* Обложка центрального блока */
    .news-featured-cover {
        width: 100%;
        height: 320px;
        background: #F0EAE3;
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        border-radius: 32px;
        overflow: hidden;
        flex: none;
    }

    .news-featured-cover img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* Контент центрального блока */
    .news-featured-content {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        width: 100%;
        flex: none;
    }

    /* Категория (большая) */
    .news-category-large {
        width: 100%;
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 17px;
        text-transform: uppercase;
        color: #575757;
        flex: none;
    }

    /* Заголовок (большой) */
    .news-title-large {
        width: 100%;
        font-family: 'IBM Plex Serif', serif;
        font-style: normal;
        font-weight: 900;
        font-size: 32px;
        line-height: 38px;
        color: #2B2B2B;
        flex: none;
        transition: color 0.3s ease;
    }

    .news-block-featured:hover .news-title-large {
        color: #3056D3;
    }

    /* Описание (большое) */
    .news-excerpt-large {
        width: 100%;
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 24px;
        line-height: 29px;
        color: #575757;
        flex: none;
    }

    /* Мета информация для большого блока */
    .news-meta-large {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
        flex: none;
    }

    .news-date-large {
        font-family: 'Inter', sans-serif;
        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 15px;
        text-align: right;
        text-transform: uppercase;
        color: #575757;
        flex: none;
    }
}
