/* ============================================================================
   HE-FIX — первый экран (баннер), десктоп.  Hermes / frontend, 17.10.2026
   Файл подключается ПОСЛЕ style.css и he-mobile.css (то есть переопределяет их).
   Блок самодостаточный: удаляется целиком, остальная вёрстка не затрагивается.
   Тексты, цифры, телефоны и логотип не менялись.
   ============================================================================ */

/* --- 1. Слайдер направлений ------------------------------------------------
   Симптом: карточки 2 и 3 («Типовые проекты», «Проектирование») вылезают
   за правую границу слайдера; 3-я заезжает ПОД кнопку «Смотреть все проекты».
   Причина: в style.css есть .swiper{overflow:visible!important}, и он
   перебивает .banner__slider{overflow:hidden} из того же файла, поэтому
   соседние слайды не обрезаются.
   Правим: обрезаем не весь слайдер (тогда отрежется пагинация на bottom:-30px),
   а только ленту слайдов внутри него — .swiper-wrapper.                    */
.banner__slider .swiper-wrapper {
    overflow: hidden;
}

/* --- 2. Читаемость текста на первом экране (десктоп, >991px) ---------------
   Симптом: белый подзаголовок с opacity .9 ложится на светлый участок фото
   (небо / светлый кирпич) — контраст падает до ~2.3:1.
   Правим: уплотняем левую часть градиента (там стоит текст) и добавляем
   мягкую тень буквам — ровно как уже сделано для телефонов в he-mobile.css.
   Фото остаётся видимым: справа градиент по-прежнему прозрачный. */
@media (min-width: 992px) {
    .banner__image::before {
        background: linear-gradient(
            to right,
            rgba(0, 0, 0, 0.66) 0%,
            rgba(0, 0, 0, 0.56) 30%,
            rgba(0, 0, 0, 0.40) 50%,
            rgba(0, 0, 0, 0.16) 74%,
            rgba(0, 0, 0, 0) 100%
        );
    }

    .banner__title,
    .banner__subtitle {
        text-shadow: 0 1px 3px rgba(0, 0, 0, 0.55), 0 4px 18px rgba(0, 0, 0, 0.45);
    }
}

/* На средних ширинах (992–1220px) текст первого экрана растянут на всю
   ширину (см. media max-width:1220.98px в style.css), поэтому одна строка
   подзаголовка доходит до светлого участка справа. Тянем затемнение дальше. */
@media (min-width: 992px) and (max-width: 1220.98px) {
    .banner__image::before {
        background: linear-gradient(
            to right,
            rgba(0, 0, 0, 0.70) 0%,
            rgba(0, 0, 0, 0.62) 35%,
            rgba(0, 0, 0, 0.52) 62%,
            rgba(0, 0, 0, 0.32) 85%,
            rgba(0, 0, 0, 0.14) 100%
        );
    }
}