/* Страница «Akcja» (body.akcja-template): баннер во всю ширину под навбаром.
   Картинка — TV img ресурса (по умолчанию images/akcja/akcja-banner.jpg),
   текст — чанк akcja.banner. Левая часть картинки тёмная, текст белый. */

/* У .base-template шапка отделена от контента margin-bottom 40/70px (style.css).
   Здесь шапку не используем, как .index-template, — этот отступ переносим под баннер,
   чтобы хлебные крошки (.breadcrumb { margin-top: -10px }) стояли как на других страницах. */
.akcja-banner {
    position: relative;
    display: grid;
    align-items: center;
    min-height: clamp(380px, 36vw, 562px);
    margin-bottom: 40px;
    background-color: #1a1a1a;
    background-image: var(--bg);
    background-size: cover;
    background-position: right max(calc(40px - 17.97vw), calc(380px - 55.83vw)); /* глаза на картинке всегда на 40px ниже навигации */
    background-repeat: no-repeat;
    color: #fff;
}
@media (min-width: 1170px) {
    .akcja-banner { margin-bottom: 70px; }
}
/* .container остаётся бутстраповским: та же ширина и поля, что у всего текста сайта */
.akcja-banner > .container { position: relative; z-index: 1; }

.akcja-banner__content {
    max-width: 660px;
    padding: 48px 0;
    text-align: center;
}
.akcja-banner__title {
    margin: 0 0 22px;
    font-size: clamp(40px, 4.3vw, 64px);
    font-weight: 700;
    line-height: 1.1;
    text-transform: uppercase;
    color: #b0cd1f;
}
.akcja-banner__title-sub {
    display: block;
    font-weight: 400;
    text-transform: none;
    color: #fff;
}
.akcja-banner__offer {
    margin: 0 0 4px;
    font-size: clamp(34px, 3.6vw, 52px);
    font-weight: 700;
    line-height: 1.15;
    text-transform: uppercase;
    color: #fff;
}
.akcja-banner__offer-sub {
    margin: 0 0 22px;
    font-size: clamp(21px, 2vw, 31px);
    font-weight: 500;
    text-transform: uppercase;
    color: #b0cd1f;
}
/* салатовое выделение внутри строки, например «-30%» */
.akcja-banner__accent { color: #b0cd1f; }
.akcja-banner__text {
    margin: 0 auto 28px;
    max-width: 500px;
    font-size: 20px;
    line-height: 1.5;
    color: #fff;
}
.akcja-banner__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 17px 38px;
    font-size: 18px;
    border-radius: 999px;
    background: #b0cd1f;
    box-shadow: 0 0 22px rgba(176, 205, 31, .45);
    color: #000;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .2s;
}
.akcja-banner__btn .material-icons { font-size: 24px; }
.akcja-banner__btn:hover, .akcja-banner__btn:focus { background: #c4df3a; color: #000; text-decoration: none; }

/* Светлый вариант (светлая картинка): тёмный текст в палитре главной —
   --ok-ink #1f2a1a, --ok-green-dark #8FA417, --ok-muted #5b6b54 (home.css) */
.akcja-banner:has(.akcja-banner__content--light) { background-color: #e6e3dd; }
.akcja-banner__content--light .akcja-banner__title { color: #1f2a1a; }
.akcja-banner__content--light .akcja-banner__title-sub { color: #8FA417; }
.akcja-banner__content--light .akcja-banner__text { color: #5b6b54; }

/* Телефон: лицо справа остаётся в кадре, текст — внизу на затемнении */
@media (max-width: 767px) {
    .akcja-banner {
        min-height: 560px;
        align-items: end;
        background-position: 72% center;
    }
    .akcja-banner::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(to top, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .6) 50%, rgba(0, 0, 0, 0) 80%);
    }
    .akcja-banner:has(.akcja-banner__content--light)::before {
        background: linear-gradient(to top, rgba(240, 238, 234, .96) 0%, rgba(240, 238, 234, .8) 50%, rgba(240, 238, 234, 0) 80%);
    }
    .akcja-banner__content { max-width: none; padding: 0 0 32px; }
    .akcja-banner__text { font-size: 17px; }
}
