/* NBC Promo — плавающая кнопка и баннер.
   Фон, радиус, паддинги, тень, размеры, цвета и положение приходят
   переменными и правилами из настроек (inline-стиль после этого файла). */

#nbc-promo-btn.nbc-promo-btn {
    /* на фронте перебивается inline-правилом на position:fixed */
    position: relative;
    z-index: 99990;
    margin: 0;
    border: 0;
    display: block;
    width: auto;
    max-width: calc(100vw - 24px);
    text-align: var(--nbc-promo-align, left);
    text-transform: none;
    letter-spacing: normal;
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    line-height: 1.3;
    background-color: var(--nbc-promo-bg, #dfe871);
    background-image: var(--nbc-promo-grad, none);
    border-radius: var(--nbc-promo-radius, 12px);
    padding: var(--nbc-promo-pad-v, 12px) var(--nbc-promo-pad-h, 18px);
    box-shadow: var(--nbc-promo-shadow, 0 4px 18px rgba(0, 0, 0, .25));
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: opacity .28s ease, transform .28s ease, visibility .28s;
    /* точка масштабирования и направление ухода задаются правилом положения */
    transform-origin: var(--nbc-promo-origin, top left);
}

#nbc-promo-btn .nbc-promo-inner {
    display: block;
    position: relative;
    z-index: 1;
}

#nbc-promo-btn .nbc-promo-line {
    display: block;
    white-space: nowrap;
    font-family: inherit;
}

/* увеличение при наведении */
#nbc-promo-btn.nbc-promo-btn:hover {
    transform: scale(1.05);
}

#nbc-promo-btn.nbc-promo-btn.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(var(--nbc-promo-hide-shift, -130%));
}

/* ---------------------------------------------- анимация: вибрация и волны */

.nbc-promo-btn .nbc-promo-waves {
    position: absolute;
    top: 50%;
    width: 0;
    height: 0;
    z-index: 0;
    pointer-events: none;
}

.nbc-promo-btn .nbc-promo-waves--left  { left: 2px; }
.nbc-promo-btn .nbc-promo-waves--right { right: 2px; }

.nbc-promo-btn .nbc-promo-waves span {
    position: absolute;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    margin: -11px 0 0 -11px;
    border: 2px solid transparent;
    border-radius: 50%;
    opacity: 0;
    filter: blur(var(--nbc-promo-wave-blur, 3px));
}

.nbc-promo-btn .nbc-promo-waves--left span  { border-left-color: var(--nbc-promo-wave-color, #dfe871); }
.nbc-promo-btn .nbc-promo-waves--right span { border-right-color: var(--nbc-promo-wave-color, #dfe871); }

.nbc-promo-btn.is-anim .nbc-promo-waves span {
    animation: nbc-promo-wave var(--nbc-promo-anim-interval, 5s) ease-out infinite;
}

.nbc-promo-btn.is-anim .nbc-promo-waves span:nth-child(2) { animation-delay: .2s; }
.nbc-promo-btn.is-anim .nbc-promo-waves span:nth-child(3) { animation-delay: .4s; }

.nbc-promo-btn.is-anim .nbc-promo-inner {
    animation: nbc-promo-shake var(--nbc-promo-anim-interval, 5s) ease-in-out infinite;
}

/* насыщенность волны задаётся альфой в --nbc-promo-wave-color, здесь только всплытие */
@keyframes nbc-promo-wave {
    0%   { opacity: 0; transform: scale(.4); }
    6%   { opacity: 1; }
    26%  { opacity: 0; transform: scale(2.6); }
    100% { opacity: 0; transform: scale(2.6); }
}

@keyframes nbc-promo-shake {
    0%, 13%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
    2%            { transform: translate3d(-2px, 0, 0) rotate(-.7deg); }
    5%            { transform: translate3d(2px, 0, 0) rotate(.7deg); }
    8%            { transform: translate3d(-2px, 0, 0) rotate(-.5deg); }
    11%           { transform: translate3d(1px, 0, 0) rotate(.3deg); }
}

/* ------------------------------------------------------------------ баннер */

.nbc-promo-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(0, 0, 0, .72);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s ease, visibility .3s;
}

.nbc-promo-overlay.is-open {
    opacity: 1;
    visibility: visible;
}

.nbc-promo-overlay .nbc-promo-banner {
    position: relative;
    /* 84vh, а не полная высота: сверху остаётся место под кнопку закрытия */
    width: var(--nbc-promo-w, 70vw);
    width: min(96vw, var(--nbc-promo-w, 70vw), calc(84vh * var(--nbc-promo-ar, 1.3333)));
    max-width: 96vw;
    opacity: 0;
    transform: translateY(18px) scale(.985);
    transition: transform .45s cubic-bezier(.2, .7, .3, 1), opacity .4s ease;
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}

.nbc-promo-overlay.is-open .nbc-promo-banner {
    opacity: 1;
    transform: none;
}

.nbc-promo-overlay .nbc-promo-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}

/* за пределами баннера — над правым верхним углом, картинку не перекрывает */
.nbc-promo-overlay .nbc-promo-close {
    position: absolute;
    top: -46px;
    right: 0;
    z-index: 2;
    width: 38px;
    height: 38px;
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .18);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s ease;
    -webkit-tap-highlight-color: transparent;
}

.nbc-promo-overlay .nbc-promo-close:hover,
.nbc-promo-overlay .nbc-promo-close:focus {
    background: rgba(255, 255, 255, .38);
    color: #fff;
}

/* по центру баннера; сдвиг по вертикали — доля высоты баннера */
.nbc-promo-overlay .nbc-promo-cta {
    position: absolute;
    left: 50%;
    top: calc(50% + var(--nbc-promo-cta-shift, 0%));
    transform: translate(-50%, -50%) translateY(10px);
    opacity: 0;
    visibility: hidden;
    transition: opacity .4s ease, transform .4s cubic-bezier(.2, .7, .3, 1), visibility .4s;
    display: inline-block;
    padding: 13px 28px;
    border-radius: 999px;
    background: var(--nbc-promo-cta-bg, #dfe771);
    font-family: inherit;
    font-size: var(--nbc-promo-cta-size, 15px);
    font-weight: var(--nbc-promo-cta-weight, 600);
    line-height: 1;
    white-space: nowrap;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .35);
}

.nbc-promo-overlay a.nbc-promo-cta,
.nbc-promo-overlay a.nbc-promo-cta:link,
.nbc-promo-overlay a.nbc-promo-cta:visited,
.nbc-promo-overlay a.nbc-promo-cta:hover,
.nbc-promo-overlay a.nbc-promo-cta:focus,
.nbc-promo-overlay a.nbc-promo-cta:active {
    color: var(--nbc-promo-cta-color, #fff);
    text-decoration: none;
}

.nbc-promo-overlay .nbc-promo-banner.is-cta .nbc-promo-cta {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%);
}

body.nbc-promo-lock {
    overflow: hidden;
}

@media (max-width: 767px) {
    .nbc-promo-overlay {
        padding: 12px;
    }

    .nbc-promo-overlay .nbc-promo-banner {
        width: var(--nbc-promo-w-mob, 90vw);
        width: min(96vw, var(--nbc-promo-w-mob, 90vw), calc(84vh * var(--nbc-promo-ar-mob, .5625)));
    }

    .nbc-promo-overlay .nbc-promo-close {
        width: 34px;
        height: 34px;
        top: -42px;
        right: 0;
    }

    .nbc-promo-overlay .nbc-promo-cta {
        padding: 12px 22px;
    }
}

/* низкий экран (телефон в альбомной) — места сверху нет, крестик возвращаем в угол баннера */
@media (max-height: 640px) {
    .nbc-promo-overlay .nbc-promo-close {
        top: 8px;
        right: 8px;
        background: rgba(0, 0, 0, .55);
    }

    .nbc-promo-overlay .nbc-promo-close:hover,
    .nbc-promo-overlay .nbc-promo-close:focus {
        background: rgba(0, 0, 0, .85);
    }
}

@media (prefers-reduced-motion: reduce) {
    #nbc-promo-btn.nbc-promo-btn,
    .nbc-promo-overlay,
    .nbc-promo-overlay .nbc-promo-banner,
    .nbc-promo-overlay .nbc-promo-cta {
        transition-duration: .01ms;
    }

    .nbc-promo-btn.is-anim .nbc-promo-waves span,
    .nbc-promo-btn.is-anim .nbc-promo-inner {
        animation: none;
    }
}