* {
    box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Manrope", sans-serif;
    background-color: white; /* Цвет на случай, если картинка не грузится */
}












.news-logo {
    /* background: linear-gradient(100deg, #1e40af 0%, #3b82f6 50%, #93c5fd 100%); */
    background-color: #262625;
    height: 40vh;
    min-height: 300px;

    display: flex;
    align-items: center;
    justify-content: center; /* Центрируем заголовок */
    text-align: center;
    position: relative;
    overflow: hidden;
}

.news-logo h1 {
    font-size: clamp(40px, 8vw, 76px);
    color: white;
    margin: 0;
    z-index: 2;
    position: relative;
}

.wave-container {
    position: absolute;
    bottom: -2px; /* Небольшой нахлест, чтобы убрать белую щель */
    left: 0;
    width: 100%;
    line-height: 0;
    z-index: 1;
}

.wave-container svg {
    display: block;
    width: 100%;
    height: 120px; /* Увеличь это число, если хочешь, чтобы волна была еще выше */
}

.wave-container svg path {
    fill: #f8f9fa; /* Должен совпадать с фоном секции .news */
}

/* На мобильных устройствах волну лучше делать чуть ниже, чтобы не перекрывала текст */
@media (max-width: 768px) {
    .wave-container svg {
        height: 60px;
    }
}







.news {
    padding: 60px 8%;
    background-color: #f8f9fa; /* Этот цвет должен совпадать с fill волны! */
    position: relative;
    z-index: 2; /* Чтобы контент был выше фона героя */
}

.news-card {
    outline: none;
    display: flex;
    background: #ffffff;
    border-radius: 12px; /* Мягкие углы как на фото */
    overflow: hidden;
    max-width: 1300px;
    margin: 0 auto 30px;
    transition: transform 0.3s ease;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
}

.news-card:hover .news-title, .news-card:hover .news-arrow, .news-card:hover .news-date {
    color: #1e40af;
}




/* Блок с картинкой */
.news-image {
    flex: 0 0 45%; /* Картинка занимает 45% ширины */
    height: 400px;
}

.news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Чтобы фото не сплющивалось */
}

section.news a {
    text-decoration: none !important; /* Убирает подчеркивание */
    display: block;                  /* Чтобы ссылка занимала всю ширину */
    color: inherit;                  /* Текст не будет синим */
}

/* Блок с текстом */
.news-content {
    text-decoration: none;
    color: inherit;
    flex: 1;
    padding: 30px 40px;
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Заголовок сверху, дата снизу */
}

.news-title {
    font-size: clamp(20px, 2.5vw, 32px);
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    color: #1a1a1a;
}

/* Подвал карточки с датой и стрелкой */
.news-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
}

.news-date {
    color: #888;
    font-size: 14px;
}

.news-arrow {
    color: #1a1a1a;
    transition: transform 0.3s ease;
}

.news-arrow svg{
    width: 35px !important;
    height: 35px !important;
}



/* Адаптация для мобильных */
@media (max-width: 768px) {
    .news-card {
        flex-direction: column; /* Картинка сверху, текст снизу */
    }
    
    .news-image {
        flex: 0 0 200px; /* Фиксированная высота на мобилке */
    }
    
    .news-content {
        padding: 20px;
    }

    .news-title {
        font-size: 22px;
        margin-bottom: 20px;
    }
}