/* Hero-баннер вверху главной (reg.ru-стиль): по ширине контента, белая карточка на фоне. */

/* Обёртка — совпадает по ширине с .home-content (1100 + боковые 20px) */
.home-hero {
    max-width: 1100px;
    margin: 0 auto 28px;
    padding: 0 20px;
}

/* Фон-бокс — скруглённый прямоугольник шириной с контент */
.home-hero__bg {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    background-color: #21384f;
    min-height: 300px;
    display: flex;
    align-items: center;
    padding: 44px;
}
.home-hero__bg--nobg { background-image: linear-gradient(135deg, #3a5a7c 0%, #21384f 100%); }
.home-hero__bg--center { justify-content: center; }

/* Картинка-фон как отдельный элемент (чтобы на мобиле вынести в блок снизу) */
.home-hero__media { position: absolute; inset: 0; z-index: 0; }
.home-hero__media img, .home-hero__media picture { display: block; width: 100%; height: 100%; object-fit: cover; }

/* Лёгкое затемнение фона (текст на белой карточке, поэтому мягкое) */
.home-hero__bg--overlay::before {
    content: "";
    position: absolute; inset: 0; z-index: 1;
    background: rgba(15, 28, 44, .22);
}

/* Белая карточка с контентом */
.home-hero__card {
    position: relative; z-index: 2;
    background: #fff;
    border-radius: 16px;
    padding: 30px 34px;
    max-width: 440px;
    box-shadow: 0 18px 40px rgba(15, 28, 44, .18);
}
.home-hero__bg--center .home-hero__card { text-align: center; }

.home-hero__tag { height: 38px; width: auto; margin: 0 0 14px; }
.home-hero__title {
    font-size: clamp(1.6rem, 3.2vw, 2.3rem);
    font-weight: 800; line-height: 1.12; letter-spacing: -.02em;
    margin: 0 0 14px; color: #1a1a1a;
}
.home-hero__desc { font-size: 1.05rem; line-height: 1.55; margin: 0 0 22px; color: #4a4f57; }

.home-hero__buttons { display: flex; flex-wrap: wrap; gap: 12px; }
.home-hero__bg--center .home-hero__buttons { justify-content: center; }
.home-hero__btn {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 12px 24px; border-radius: 12px;
    background: #ff6b35; color: #fff; font-weight: 700; font-size: .98rem;
    text-decoration: none; border: 2px solid #ff6b35;
    transition: transform .15s ease, background .15s ease;
}
.home-hero__btn:hover { background: #e85520; border-color: #e85520; color: #fff; transform: translateY(-2px); }
.home-hero__btn--secondary {
    background: #fff; color: #2b2f33; border-color: #d7dde3;
}
.home-hero__btn--secondary:hover { background: #f5f7f9; border-color: #b9c3cd; color: #2b2f33; }
.home-hero__btn--secondary i { font-size: .8em; }

@media (max-width: 700px) {
    .home-hero { padding: 0 12px; margin-top: 16px; }
    /* Тонированная подложка вокруг карточки и картинки (видна по бокам/сверху) */
    .home-hero__bg {
        flex-direction: column; align-items: stretch;
        padding: 14px; gap: 12px; min-height: 0;
        background-color: #eef2f7; background-image: none; border-radius: 18px;
    }
    .home-hero__bg--overlay::before { display: none; }
    /* Белая карточка по центру */
    .home-hero__card {
        order: 1; position: static; width: 100%; max-width: none;
        background: #fff; border-radius: 14px; box-shadow: 0 6px 18px rgba(15,28,44,.08);
        padding: 22px 18px; text-align: center;
    }
    .home-hero__tag { margin: 0 auto 12px; }
    .home-hero__title { font-size: 1.42rem; margin-bottom: 10px; }
    .home-hero__desc { font-size: .97rem; margin-bottom: 18px; }
    /* Компактная кнопка по центру (не во всю ширину) */
    .home-hero__buttons { flex-direction: column; align-items: center; }
    .home-hero__btn { width: auto; padding: 11px 22px; font-size: .95rem; }
    /* Картинка отдельным скруглённым блоком снизу */
    .home-hero__media { order: 2; position: static; height: 180px; border-radius: 14px; overflow: hidden; }
    .home-hero__media img, .home-hero__media picture { height: 180px; }
}
@media (prefers-reduced-motion: reduce) { .home-hero__btn { transition: none; } }