/* ============================================================
   HEADER UNIFIED CATALOG V123

   Это НЕ новая геометрия шапки.

   Основной внешний вид берётся из того же набора CSS,
   что теперь используется в каталоге.

   Здесь только:
   1. гарантированно нет дыма / gradients вокруг Каталога;
   2. красный control-hover.
   ============================================================ */


/* ============================================================
   CLEAN
   ============================================================ */

html body.site-home-modern
.home-catalog-v1{

    /*
     * Никаких дополнительных картинок фона.
     * Основной чистый background оставляет V122.
     */
    background-image:none !important;

    filter:none !important;
    -webkit-filter:none !important;

    text-shadow:none !important;
}


html body.site-home-modern
.home-catalog-v1::before,

html body.site-home-modern
.home-catalog-v1::after{

    content:none !important;

    display:none !important;

    background:none !important;
    background-image:none !important;

    box-shadow:none !important;

    filter:none !important;
    -webkit-filter:none !important;

    opacity:0 !important;

    animation:none !important;

    pointer-events:none !important;
}


/* ============================================================
   DESKTOP HOVER
   ============================================================ */

@media (min-width:981px){

    html body.site-home-modern
    .home-catalog-v1:hover,

    html body.site-home-modern
    .home-catalog-v1:focus-visible{

        /*
         * Такое же движение control,
         * которое используется у города.
         */
        transform:
            translateY(-2px)
            scale(1.025) !important;

        background-image:
            none !important;

        filter:
            none !important;

        -webkit-filter:
            none !important;

        text-shadow:
            none !important;
    }


    /* ========================================================
       LIGHT

       Значения взяты из текущего hover
       .home-city-v1 в site-theme-v33.css.
       ======================================================== */

    html[data-site-theme="light"]
    body.site-home-modern
    .home-catalog-v1:hover,

    html[data-site-theme="light"]
    body.site-home-modern
    .home-catalog-v1:focus-visible,

    body.site-home-modern.site-theme-light
    .home-catalog-v1:hover{

        border-color:
            rgba(239,27,36,.34) !important;

        background:
            #fff !important;

        background-color:
            #fff !important;

        background-image:
            none !important;

        color:
            #111 !important;

        box-shadow:
            0 12px 28px rgba(0,0,0,.10),
            0 0 20px rgba(239,27,36,.06) !important;
    }


    /* ========================================================
       DARK

       Красная версия того же control-hover.
       ======================================================== */

    html[data-site-theme="dark"]
    body.site-home-modern
    .home-catalog-v1:hover,

    html[data-site-theme="dark"]
    body.site-home-modern
    .home-catalog-v1:focus-visible,

    body.site-home-modern.site-theme-dark
    .home-catalog-v1:hover{

        border-color:
            rgba(255,52,52,.78) !important;

        /*
         * Цвет самой плашки почти не меняем.
         * Никаких gradient.
         */
        background-color:
            #151515 !important;

        background-image:
            none !important;

        color:
            #fff !important;

        box-shadow:
            0 11px 30px rgba(0,0,0,.32),
            0 0 22px rgba(255,20,20,.18) !important;
    }


    /* ========================================================
       ICON

       Иконка не живёт своей отдельной анимацией.
       Вся плашка движется целиком.
       ======================================================== */

    html body.site-home-modern
    .home-catalog-v1:hover
    .home-catalog-icon-v1{

        transform:
            none !important;

        filter:
            none !important;

        -webkit-filter:
            none !important;
    }

}