/*
 * RADONEGA UNIFIED VECTOR BACKGROUND V26
 *
 * Один алгоритм размещения для:
 * about / wholesale / contacts / cart / news / news-item
 *
 * Тип страницы long/medium/short больше НЕ определяет
 * количество декоративных элементов.
 */

body.radonega-about-vector-bg {
    /*
     * 0.18 = соседние desktop-кластеры перекрываются на 18%.
     */
    --rad-vbg-overlap: .18;
}


/*
 * Всегда часть документа.
 * Никогда не fixed.
 */
body.radonega-about-vector-bg .about-vector-stage {
    position: absolute !important;

    top: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;

    width: 100% !important;
    height: var(--rad-vbg-stage-height, 100%) !important;

    overflow: hidden !important;

    z-index: -1 !important;
    pointer-events: none !important;
    user-select: none !important;

    transform: none !important;
}


/*
 * Полностью отменяем старые short/medium/long позиции
 * и старые display:none.
 *
 * Точный top устанавливает JS.
 */
body.radonega-about-vector-bg.radonega-vector-bg--long
    .about-vector-cluster,
body.radonega-about-vector-bg.radonega-vector-bg--medium
    .about-vector-cluster,
body.radonega-about-vector-bg.radonega-vector-bg--short
    .about-vector-cluster,
body.radonega-about-vector-bg
    .about-vector-cluster {

    display: block !important;
    top: 0 !important;
}


/*
 * В старом мобильном CSS часть пузырьков скрывалась.
 * Теперь анимационный состав одинаковый везде.
 */
body.radonega-about-vector-bg .about-vector-bubble {
    display: block !important;
}


/* MOBILE */
@media (max-width: 991px) {

    body.radonega-about-vector-bg {
        /*
         * На телефоне чуть больший нахлёст:
         * узкая страница визуально требует более плотного рисунка.
         */
        --rad-vbg-overlap: .22;
    }

    body.radonega-about-vector-bg .about-vector-stage {
        position: absolute !important;
    }

    /*
     * Отменяем старые mobile c2/c4 display:none.
     */
    body.radonega-about-vector-bg
        .about-vector-cluster {

        display: block !important;
    }

    body.radonega-about-vector-bg
        .about-vector-bubble {

        display: block !important;
    }
}