/* ==========================================================================
   FACTURADESIGN — главный слайдер
   Desktop adaptive matrix v3.1
   Точечные корректировки по проверочным скриншотам
   ========================================================================== */


/* ==========================================================================
   1. ОБЩИЕ DESKTOP-ПРАВКИ
   ========================================================================== */

@media (min-width: 992px) {

    /* Не используем старый скачок body.main-page #sp-main-body */
    body.main-page #sp-main-body { 
		        margin-top: -30px !important;
    }

    /*
     * Hero помещается в первый экран.
     * Ниже viewport ~640px перестаём сжимать сам hero:
     * 640 - 190 ~= 450px.
     */
    #sppb-addon-1603275116514 .sp-slider-outer-stage {
        height: clamp(450px, calc(100dvh - 190px), 1091px) !important;
    }

    /* Старый margin-top:-45px фоновой картинки убираем */
    #sppb-addon-1603275116514 .sp-background {
        margin-top: 0 !important;
    }

    /* Базовое положение красной полосы / контейнера */
    #sppb-addon-1603275116514 .sp-slider-content-align-left {
        top: -115px !important;
        height: auto !important;
    }

    #sppb-addon-1603275116514 .slide-content-text {
        max-width: 86% !important;
    }

    /* Старый общий счётчик 01/04 отключаем */
    #sppb-addon-1603275116514 .sp-slider_number {
        display: none !important;
    }

    /* Новый счётчик в строке малого заголовка */
    #sppb-addon-1603275116514 .sppb-sp-slider-title.arrow-title::before {
        position: absolute;
        left: calc(100% + 24px);
        top: 5px;

        font-size: 18px;
        line-height: 22px;
        font-weight: 800;

        color: #000;
        white-space: nowrap;
    }

    #sp-slider-item-1603275116514-num-0-key
    .sppb-sp-slider-title.arrow-title::before {
        content: "01/04";
    }

    #sp-slider-item-1603275116514-num-1-key
    .sppb-sp-slider-title.arrow-title::before {
        content: "02/04";
    }

    #sp-slider-item-1603275116514-num-2-key
    .sppb-sp-slider-title.arrow-title::before {
        content: "03/04";
    }

    #sp-slider-item-1603275116514-num-3-key
    .sppb-sp-slider-title.arrow-title::before {
        content: "04/04";
    }

    /*
     * В template.css при max-width:1450px линия скрывается.
     * Для нашего desktop-варианта возвращаем её.
     */
    #sppb-addon-1603275116514
    .sppb-sp-slider-title.arrow-title::after {
        display: block !important;
    }
}


/*
 * В штатном шаблоне при max-width:1510px меняется геометрия шапки,
 * но #sp-header остаётся высоким — появляется белый зазор перед hero.
 * На <=1450 включается уже другой штатный режим, поэтому исправляем
 * только переходную полосу 1451–1510.
 */
@media (min-width: 1451px) and (max-width: 1510px) {
    body.main-page #sp-main-body {
        margin-top: -55px !important;
    }
}


/* ==========================================================================
   2. ПЕРЕМЕННЫЕ DESKTOP 992+
   Матрица теперь продолжается через 1200 -> 1199 без скачка.
   ========================================================================== */

@media (min-width: 992px) {

    #sppb-addon-1603275116514 {

        /* Фон */
        --fd-bg-size: cover;
        --fd-bg-y: 50%;

        /* Сдвиг только текстовых элементов вниз */
        --fd-content-top: 0px;

        /* Большой заголовок */
        --fd-title-size: 64px;
        --fd-title-line: 72px;
        --fd-title-mb: 22px;

        /* Малый заголовок */
        --fd-kicker-size: 24px;
        --fd-kicker-line: 30px;
        --fd-kicker-mb: 40px;
        --fd-line-top: 21px;

        /* 01/04 */
        --fd-counter-size: 18px;
        --fd-counter-line: 22px;
        --fd-counter-top: 5px;

        /* Описание */
        --fd-text-size: 22px;
        --fd-text-line: 32px;

        /* Нижняя чёрная панель */
        --fd-panel-height: 153px;
        --fd-panel-bottom: 80px;

        /* Стрелка панели */
        --fd-nav-arrow-w: 40px;
        --fd-nav-arrow-h: 105px;
        --fd-nav-arrow-ml: 20px;

        /* Подпись панели */
        --fd-caption-left: 115px;
        --fd-nav-font: 17px;
    }
}


/* ==========================================================================
   3. ОБЩАЯ МАТРИЦА ПО HEIGHT
   ========================================================================== */


/* ---------- <= 850 ---------- */
/* 1920x849: панель ниже + текстовый блок получает чуть больше воздуха */
@media (min-width: 992px) and (max-height: 850px) {

    #sppb-addon-1603275116514 {
        --fd-content-top: 8px;

        --fd-panel-height: 116px;
        --fd-panel-bottom: 45px;

        --fd-nav-arrow-w: 32px;
        --fd-nav-arrow-h: 82px;

        --fd-caption-left: 92px;
        --fd-nav-font: 16px;
    }
}


/* ---------- <= 800 ---------- */
@media (min-width: 992px) and (max-height: 800px) {

    #sppb-addon-1603275116514 {
        --fd-content-top: 14px;

        --fd-title-size: clamp(46px, 2.7vw, 54px);
        --fd-title-line: clamp(50px, 2.9vw, 58px);
        --fd-title-mb: 14px;

        --fd-kicker-size: clamp(18px, 1.05vw, 20px);
        --fd-kicker-line: clamp(22px, 1.25vw, 24px);
        --fd-kicker-mb: 13px;
        --fd-line-top: 11px;

        --fd-counter-size: clamp(14px, .8vw, 15px);
        --fd-counter-line: clamp(18px, 1vw, 20px);
        --fd-counter-top: 2px;

        --fd-text-size: clamp(17px, 1vw, 18px);
        --fd-text-line: clamp(23px, 1.35vw, 25px);
    }
}


/* ---------- <= 760 ---------- */
@media (min-width: 992px) and (max-height: 760px) {

    #sppb-addon-1603275116514 {
        --fd-content-top: 28px;

        --fd-title-size: clamp(42px, 2.6vw, 52px);
        --fd-title-line: clamp(46px, 2.8vw, 56px);
        --fd-title-mb: 12px;

        --fd-kicker-size: clamp(17px, 1vw, 19px);
        --fd-kicker-line: clamp(21px, 1.2vw, 23px);
        --fd-kicker-mb: 10px;
        --fd-line-top: 10px;

        --fd-counter-size: clamp(13px, .75vw, 14px);
        --fd-counter-line: clamp(17px, .95vw, 18px);
        --fd-counter-top: 1px;

        --fd-text-size: clamp(16px, .95vw, 17px);
        --fd-text-line: clamp(22px, 1.25vw, 24px);

        --fd-panel-height: 92px;
        --fd-panel-bottom: 30px;

        --fd-nav-arrow-w: 27px;
        --fd-nav-arrow-h: 66px;

        --fd-caption-left: 84px;
        --fd-nav-font: 15px;
    }
}


/* ---------- <= 720 ---------- */
/* 1446px: заголовок уже заметно компактнее */
@media (min-width: 992px) and (max-height: 720px) {

    #sppb-addon-1603275116514 {
        --fd-content-top: 44px;

        --fd-title-size: clamp(38px, 2.35vw, 46px);
        --fd-title-line: clamp(42px, 2.55vw, 50px);
        --fd-title-mb: 10px;

        --fd-kicker-size: clamp(16px, .95vw, 18px);
        --fd-kicker-line: clamp(20px, 1.1vw, 22px);
        --fd-kicker-mb: 8px;
        --fd-line-top: 9px;

        --fd-counter-size: clamp(12px, .7vw, 13px);
        --fd-counter-line: clamp(16px, .9vw, 17px);

        --fd-text-size: clamp(15px, .9vw, 16px);
        --fd-text-line: clamp(20px, 1.2vw, 22px);

        --fd-panel-height: 86px;
        --fd-panel-bottom: 18px;

        --fd-nav-arrow-w: 25px;
        --fd-nav-arrow-h: 61px;

        --fd-caption-left: 88px;
        --fd-nav-font: 14px;
    }
}


/* ---------- <= 680 ---------- */
/* 2126x651 / 1920x660 / 1599x640 */
@media (min-width: 992px) and (max-height: 680px) {

    #sppb-addon-1603275116514 {
        --fd-content-top: 54px;

        --fd-title-size: clamp(36px, 2.1vw, 42px);
        --fd-title-line: clamp(40px, 2.3vw, 46px);
        --fd-title-mb: 8px;

        --fd-kicker-size: clamp(15px, .9vw, 16px);
        --fd-kicker-line: clamp(19px, 1.05vw, 20px);
        --fd-kicker-mb: 7px;
        --fd-line-top: 8px;

        --fd-counter-size: clamp(11px, .65vw, 12px);
        --fd-counter-line: clamp(15px, .85vw, 16px);

        --fd-text-size: clamp(14px, .85vw, 15px);
        --fd-text-line: clamp(19px, 1.1vw, 20px);

        --fd-panel-height: 78px;
        --fd-panel-bottom: 10px;

        --fd-nav-arrow-w: 23px;
        --fd-nav-arrow-h: 56px;

        /* Не даём подписи прилипнуть к стрелке */
        --fd-caption-left: 90px;
        --fd-nav-font: 14px;
    }
}


/* ---------- <= 640 ---------- */
/* 1920x589 и прочие экстремально низкие desktop */
@media (min-width: 992px) and (max-height: 640px) {

    #sppb-addon-1603275116514 {
        --fd-content-top: 62px;

        --fd-title-size: clamp(34px, 2vw, 40px);
        --fd-title-line: clamp(38px, 2.2vw, 44px);

        --fd-panel-height: 74px;
        --fd-panel-bottom: 8px;

        --fd-nav-arrow-w: 22px;
        --fd-nav-arrow-h: 52px;

        --fd-caption-left: 90px;
        --fd-nav-font: 13px;
    }
}


/*
 * Для ширин 992–1599 на низком окне большой заголовок был всё ещё
 * визуально тяжёлым (1446 / 1200 / 1199). Делаем отдельную ячейку.
 */
@media (min-width: 992px) and (max-width: 1599px) and (max-height: 720px) {

    #sppb-addon-1603275116514 {
        --fd-title-size: 36px;
        --fd-title-line: 40px;
    }
}

@media (min-width: 992px) and (max-width: 1599px) and (max-height: 640px) {

    #sppb-addon-1603275116514 {
        --fd-title-size: 34px;
        --fd-title-line: 38px;
    }
}


/* ==========================================================================
   4. ФОН: ASPECT-RATIO
   Здесь меняется ТОЛЬКО фон.
   Текст больше не переопределяется aspect-ratio правилами.
   ========================================================================== */


/* Базовый сдвиг широкого кадра вниз
 *
 * Раньше здесь был жёсткий порог min-aspect-ratio: 12/5.
 * Из-за него при 1550x646 -> 1551x646 фон за 1px по ширине
 * перескакивал с 50% сразу на calc(50% + 65px).
 *
 * Теперь сдвиг плавно нарастает примерно в диапазоне ratio 2.35–2.40:
 * ниже диапазона = 0px, выше = максимум 65px.
 */
@media (min-width: 992px) and (min-height: 641px) {
    #sppb-addon-1603275116514 {
        --fd-bg-y: calc(
            50% + clamp(
                0px,
                calc(200vw - 470vh),
                65px
            )
        );
    }
}


/* Проверенная лестница для очень широких окон */
@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 50/17) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 96% auto;
    }
}

@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 250/83) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 94% auto;
    }
}

@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 25/8) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 90% auto;
    }
}

@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 125/39) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 84% auto;
    }
}

@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 125/38) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 80% auto;
    }
}

@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 125/37) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 78% auto;
    }
}

@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 125/36) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 76% auto;
    }
}

@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 25/7) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 74% auto;
        --fd-bg-y: calc(50% + 45px);
    }
}

@media (min-width: 992px) and (min-height: 641px) and (min-aspect-ratio: 125/34) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 72% auto;
        --fd-bg-y: calc(50% + 45px);
    }
}


/*
 * Дополнительные ячейки для низких окон средней ширины:
 *
 * 1599x640 ≈ 2.50  -> фон немного меньше
 * 1920x660 ≈ 2.91  -> фон заметно меньше
 *
 * Диапазоны ограничены сверху, чтобы не ломать уже проверенную
 * лестницу 2500px / ultra-wide.
 */
@media (min-width: 992px)
       and (min-height: 641px)
       and (max-height: 680px)
       and (min-aspect-ratio: 49/20)
       and (max-aspect-ratio: 27/10) {

    #sppb-addon-1603275116514 {
        --fd-bg-size: 93% auto;
    }
}

@media (min-width: 992px)
       and (min-height: 641px)
       and (max-height: 680px)
       and (min-aspect-ratio: 27/10)
       and (max-aspect-ratio: 29/10) {

    #sppb-addon-1603275116514 {
        --fd-bg-size: 91% auto;
    }
}

@media (min-width: 992px)
       and (min-height: 641px)
       and (max-height: 680px)
       and (min-aspect-ratio: 29/10)
       and (max-aspect-ratio: 25/8) {

    #sppb-addon-1603275116514 {
        --fd-bg-size: 89% auto;
    }
}


/* 2126x651: круг поднять выше, сохранив масштаб */
@media (min-width: 992px)
       and (min-height: 641px)
       and (max-height: 680px)
       and (min-aspect-ratio: 16/5) {

    #sppb-addon-1603275116514 {
        --fd-bg-y: calc(50% + 45px);
    }
}


/* ==========================================================================
   4A. ФОН ПРИ HEIGHT <= 640px — ФИКСИРОВАННЫЙ РЕЖИМ

   На <=640px чёрная панель уже достигла минимального размера.
   Поэтому aspect-ratio больше не продолжает уменьшать/сдвигать фон.

   Для 992–1599 дополнительно задан минимальный физический масштаб
   фонового изображения: композиция не становится меньше состояния
   примерно на ширине 1436px. Это удерживает зелёный круг левее
   вертикальной цветной полосы.
   ========================================================================== */

/* 992–1599: не уменьшаем фон меньше контрольной композиции ~1436px */
@media (min-width: 992px) and (max-width: 1599px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: max(93%, 1436px) auto;
        --fd-bg-y: 50%;
    }
}

/* Далее фиксируем состояние, соответствующее примерно height=640px */
@media (min-width: 1600px) and (max-width: 1727px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 93% auto;
        --fd-bg-y: calc(50% + 65px);
    }
}

@media (min-width: 1728px) and (max-width: 1855px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 91% auto;
        --fd-bg-y: calc(50% + 65px);
    }
}

@media (min-width: 1856px) and (max-width: 1999px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 89% auto;
        --fd-bg-y: calc(50% + 65px);
    }
}

@media (min-width: 2000px) and (max-width: 2051px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 90% auto;
        --fd-bg-y: calc(50% + 65px);
    }
}

/* С ~2048px на старой матрице фон уже переходил в более высокий y */
@media (min-width: 2048px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-y: calc(50% + 45px);
    }
}

@media (min-width: 2052px) and (max-width: 2105px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 84% auto;
    }
}

@media (min-width: 2106px) and (max-width: 2162px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 80% auto;
    }
}

@media (min-width: 2163px) and (max-width: 2222px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 78% auto;
    }
}

@media (min-width: 2223px) and (max-width: 2285px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 76% auto;
    }
}

@media (min-width: 2286px) and (max-width: 2352px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 74% auto;
    }
}

@media (min-width: 2353px) and (max-height: 640px) {
    #sppb-addon-1603275116514 {
        --fd-bg-size: 72% auto;
    }
}


/* ==========================================================================
   5. ПРИМЕНЕНИЕ ПЕРЕМЕННЫХ
   ========================================================================== */

@media (min-width: 992px) {

    /* ---------- ФОН ---------- */

    #sppb-addon-1603275116514 .sp-background {
        margin-top: 0 !important;

        background-size: var(--fd-bg-size) !important;
        background-position: center var(--fd-bg-y) !important;
        background-repeat: no-repeat !important;
    }


    /* ---------- ПРАВЫЙ ТЕКСТ ---------- */

    #sppb-addon-1603275116514
    .sp-slider-content-align-left > .sppb-sp-slider-title,

    #sppb-addon-1603275116514
    .sp-slider-content-align-left > .slide-content-text {

        position: relative;
        top: var(--fd-content-top) !important;
    }


    #sppb-addon-1603275116514 .slide-title {
        font-size: var(--fd-title-size) !important;
        line-height: var(--fd-title-line) !important;
        margin-bottom: var(--fd-title-mb) !important;
    }


    #sppb-addon-1603275116514
    .sppb-sp-slider-title.arrow-title {

        font-size: var(--fd-kicker-size) !important;
        line-height: var(--fd-kicker-line) !important;
        margin-bottom: var(--fd-kicker-mb) !important;
    }


    #sppb-addon-1603275116514
    .sppb-sp-slider-title.arrow-title::after {

        display: block !important;
        top: var(--fd-line-top) !important;
    }


    #sppb-addon-1603275116514
    .sppb-sp-slider-title.arrow-title::before {

        font-size: var(--fd-counter-size) !important;
        line-height: var(--fd-counter-line) !important;
        top: var(--fd-counter-top) !important;
    }


    #sppb-addon-1603275116514 .slide-content-text {
        font-size: var(--fd-text-size) !important;
        line-height: var(--fd-text-line) !important;
    }


    /* ==========================================================================
       НИЖНЯЯ ЧЁРНАЯ ПАНЕЛЬ
       ========================================================================== */

    #sppb-addon-1603275116514
    .sp-slider-custom-dot-indecators {

        height: var(--fd-panel-height) !important;
        bottom: var(--fd-panel-bottom) !important;

        overflow: hidden !important;
    }


    #sppb-addon-1603275116514
    .sp-slider-custom-dot-indecators > ul {

        height: 100% !important;
        align-items: stretch !important;
    }


    #sppb-addon-1603275116514
    .sp-slider-custom-dot-indecators ul li {

        position: relative;
        height: 100% !important;

        padding-top: 0 !important;
        padding-bottom: 0 !important;

        box-sizing: border-box;
    }


    /* Скрытые большие номера больше не участвуют в layout */
    #sppb-addon-1603275116514
    .sp-slider-text-thumb-number {

        display: none !important;
    }


    /* Стрелка вертикально центрируется независимо от высоты панели */
    #sppb-addon-1603275116514
    .sp-text-thumbnail-list::before {

        width: var(--fd-nav-arrow-w) !important;
        height: var(--fd-nav-arrow-h) !important;

        top: 50% !important;

        margin-top: 0 !important;
        margin-left: var(--fd-nav-arrow-ml) !important;

        transform: translateY(-50%) !important;

        background-size: contain !important;
        background-repeat: no-repeat !important;
    }


    /* Подпись также центрируется вертикально */
    #sppb-addon-1603275116514
    .sp-slider-text-thumb-caption {

        top: 50% !important;
        left: var(--fd-caption-left) !important;

        transform: translateY(-50%) !important;
    }


    #sppb-addon-1603275116514
    .sp-slider-dot-indecator-text {

        margin-top: 0 !important;

        font-size: var(--fd-nav-font) !important;
        line-height: 1.25 !important;

        white-space: nowrap;
    }
}

/* ==========================================================================
   5A. TABLET 661–991px — КОМПАКТНАЯ ЧЁРНАЯ ПАНЕЛЬ

   Desktop matrix заканчивается на 992px, а на <=660px уже есть
   отдельная карточная мобильная навигация из custom.css.
   Поэтому диапазон 661–991 нормализуем отдельно.

   Высота панели плавно уменьшается по высоте окна и затем фиксируется.
   ========================================================================== */

@media (min-width: 661px) and (max-width: 991px) {

    #sppb-addon-1603275116514 .sp-slider-custom-dot-indecators {
        height: clamp(50px, 5.5dvh, 58px) !important;
        bottom: clamp(6px, 1.3dvh, 14px) !important;
        overflow: hidden !important;
    }

    #sppb-addon-1603275116514 .sp-slider-custom-dot-indecators > ul {
        height: 100% !important;
        align-items: stretch !important;
    }

    #sppb-addon-1603275116514 .sp-slider-custom-dot-indecators ul li {
        position: relative;
        height: 100% !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        box-sizing: border-box;
    }

    #sppb-addon-1603275116514 .sp-slider-text-thumb-number {
        display: none !important;
    }

    #sppb-addon-1603275116514 .sp-text-thumbnail-list::before {
        width: 18px !important;
        height: clamp(36px, 4.5dvh, 44px) !important;
        top: 50% !important;
        margin-top: 0 !important;
        margin-left: 10px !important;
        transform: translateY(-50%) !important;
        background-size: contain !important;
        background-repeat: no-repeat !important;
    }

    #sppb-addon-1603275116514 .sp-slider-text-thumb-caption {
        top: 50% !important;
        left: clamp(54px, 6.5vw, 66px) !important;
        transform: translateY(-50%) !important;
    }

    #sppb-addon-1603275116514 .sp-slider-dot-indecator-text {
        margin-top: 0 !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
        white-space: nowrap;
    }
}


/* ==========================================================================
   6. МОБИЛЬНАЯ ШАПКА <= 991px

   В desktop-стилях вложенные .sp-column получают height:100%.
   После перехода шапки в вертикальный режим это растягивало
   #header-calling и #header-contacts-mod, создавая большие пустые
   интервалы перед email и мессенджерами.

   Файл подключается только на Главной, поэтому дополнительный
   body.main-page в селекторах не нужен.
   ========================================================================== */

@media (max-width: 991px) {

    #header-calling > .sp-column,
    #header-contacts-mod,
    #header-contacts-mod > .sp-column {
        height: max-content !important;
        min-height: 0 !important;
    }
}