/* ! Список ссылок[[js/hrefs-map.js]] */
/*@ [[header.html]] */
/* @ CSS Global [[css/global-styles.css]] */

button {
    all: unset;
    display: inline-block; /* або block/flex — залежно від задачі */
    cursor: pointer;
}
header {
    position: fixed;
    z-index: 11;
    left: 50%;
    top: calc(4px * var(--scale_1200));

    height: 60px;
    /* width: 1914px; */
    transform: scale(var(--scale_1200)) translateX(-50%);
    
    transform-origin: top left;

    opacity: 0;
    pointer-events: none;

    transition: opacity 1s ease-in-out;
}
    header[data-media="landscape__portrait--PC"] {
        width: calc(100% - 6px * var(--scale_1200));
        min-width: 1194px;
    }
    header[data-media="portrait--mobile"] {
        width: 594px;
    }
        body.header_on header {
            opacity: 1;
            pointer-events: initial;
        }
        header::before {
            position: absolute;
            z-index: -1;
            top: 0;
            left: 0;

            height: 100%;
            width: 100%;

            content: "";
            
            border-radius: 10px;
            backdrop-filter: blur(5px);
            background-color: rgba(0, 157, 225, 0.5);
        }
        header::after {
            position: absolute;
            z-index: 2;

            content: "";
            pointer-events: none;
        }
            header[data-media="landscape__portrait--PC"]::after {
                top: -3px;
                right: 5px;

                height: 88px;
                width: 226px;

                background-image: url(../img/general/header/logo_pc.svg);
                background-repeat: no-repeat;
            }
            header[data-media="portrait--mobile"]::after {
                top: -3px;
                right: 0px;

                height: 74px;
                width: 81px;

                background-image: url(../img/general/header/logo_mob.svg);
            }
    .header_menu {
        font-size: 0;
    }
        .header_menu[data-media="landscape__portrait--PC"] {
            margin-left: 23px;
        }
        .header_menu[data-media="portrait--mobile"] {
            margin-left: 8px;
        }
            .header_menu > li {
                position: relative;
                margin: 6px;

                display: inline-block;

                height: 48px;
                
                list-style-type: none;

                background-color: var(--color-test);
            }
                .header_menu > li[data-media="portrait--mobile"]:nth-child(1) {
                    display: none;
                }
                .header_menu > li > a,
                button[data-group="submenu1"] > img {
                    display: block;
                    height: 48px;
                    
                    transition: all 0.2s ease-in-out;
                }
                        .header_menu > li > a,
                        button[data-group="submenu1"][aria-expanded="false"] > img {
                            transform: scaleX(1);

                            filter: invert(0%) sepia(0%) saturate(100%) hue-rotate(0deg) brightness(100%) contrast(100%);
                        }
                        .header_menu > li:hover > a,
                        button[data-group="submenu1"][aria-expanded="true"] > img {
                            transform: scaleX(-1);

                            filter: invert(40%) sepia(22%) saturate(747%) hue-rotate(165deg) brightness(117%) contrast(105%) drop-shadow(0 0 10px white) drop-shadow(0 0 10px white);
                        }
        .header_submenu1 {
            position: absolute;
            z-index: 3;
            top: calc(100% + 10px);
            left: 0;

            visibility: hidden;
            opacity: 0;

            transform: scale(0.01);
            transform-origin: top left;

            background-color: var(--color-test);

            transition: all 0.2s ease-out;
        }
                .header_submenu1.visible {
                    visibility: visible;
                    opacity: 1;

                    transform: scale(1);
                }
                .header_submenu1::before {
                    position: absolute;
                    z-index: -1;
                    top: 0;
                    left: 0;

                    height: 100%;
                    width: 100%;

                    content: "";
                    border-radius: 10px;
                    box-shadow: 8px 8px 10px rgba(0, 0, 0, 0.3);
                    background-color: rgba(0, 157, 225, 0.5);
                    backdrop-filter: blur(5px);
                }
                .header_submenu1::after {
                    position: absolute;
                    z-index: -2;

                    top: -10px;
                    left: 0px;

                    height: 10px;
                    width: 100%;

                    content: "";

                    background-color: var(--color-test);
                }
                .header_menu > li:nth-of-type(2) .header_submenu1 {
                    /* height: 429px; */
                    /* width: 287px; */
                    padding: 12px;
                }
                    .header_menu > li:nth-of-type(2) .header_submenu1 li {
                        position: relative;
                        margin: 0;

                        background-color: var(--color-test);
                    }
                    .headerSubMenu1__item {
                        position: relative;
                
                        display: inline-block;
                
                        font-size: 24px;
                        line-height: 32px;
                        color: white;
                        list-style-type: none;
                        white-space: nowrap;
                
                        filter: drop-shadow(1px 1px 0px rgba(0, 0, 0, 0.5));
                
                        background-color: var(--color-test);
                
                        transition: all 0.25s ease-in-out;
                    }
                            .headerSubMenu1__item[data-text]::before,
                            .headerSubMenu1__item:not([data-text]) span::before {
                                content: attr(data-text); /* текст для контент берем из инлайн-аттрибута data-text="..." */
                                /* обязательно в html вставить aria-hidden="true" для чистоты семантики */
                                position: absolute;
                                z-index: 1;
                                top: 0;
                                left: 0;
                                color: rgb(0, 0, 0);
                                filter:  drop-shadow(1px 1px 0 white);
                                width: 0%;
                                white-space: nowrap;
                                overflow: hidden;
                                transition: all 0.25s ease-in-out;
                                }
                            .headerSubMenu1__item[aria-expanded="true"][data-text]::before,
                            .headerSubMenu1__item[aria-expanded="true"]:not([data-text]) span::before {
                                width: 100%;
                            }
                            .headerSubMenu1__item[data-media="portrait--mobile"]::after {
                                position: relative;
                                left: 4px;

                                display: inline-block;
                                /* height: 100%; */
                                font-size: 13px;

                                background-color: var(--color-test);
                            }
                                .headerSubMenu1__item[aria-expanded="false"][data-media="portrait--mobile"]::after {
                                    top: -2px;
                                    content: "▼";
                                    color: white;
                                }
                                .headerSubMenu1__item[aria-expanded="true"][data-media="portrait--mobile"]::after {
                                    top: -1px;
                                    content: "▲";
                                    color: black;
                                }
                            .headerSubMenu1__item[data-media="pointer--fine"]:not([aria-expanded]):hover {
                                color: black;
                
                                filter:  drop-shadow(1px 1px 0 white);
                            }
                            .headerSubMenu1__item[data-media="portrait--mobile"][aria-expanded="true"] {
                                color: black;
                
                                filter:  drop-shadow(1px 1px 0 white);
                            }
                            .headerSubMenu1__item a {
                                all: unset;
                                display: inline;
                                color: inherit;
                                text-decoration: none;
                                cursor: default;
                                font: inherit;
                            }
                        .headerSubMenu1__subItem {
                            margin-left: 25px;
                
                            font-size: 20px;
                            line-height: 26px;
                            color: white;
                            list-style-type: none;
                            white-space: nowrap;
                        }
                                .headerSubMenu1__subItem:not([aria-expanded]),
                                .headerSubMenu1__subItem[aria-expanded="false"] {
                                    filter: drop-shadow(1px 1px 0px rgba(0, 0, 0, 0.5));
                                }
                                .headerSubMenu1__subItem[data-text]::before,
                                .headerSubMenu1__subItem:not([data-text]) span::before {
                                    content: attr(data-text); /* текст для контент берем из инлайн-аттрибута data-text="..." */
                                    /* обязательно в html вставить aria-hidden="true" для чистоты семантики */
                                    position: absolute;
                                    z-index: 1;
                                    top: 0;
                                    left: 0;
                                    color: rgb(0, 0, 0);
                                    filter:  drop-shadow(1px 1px 0 white);
                                    width: 0%;
                                    white-space: nowrap;
                                    overflow: hidden;
                                    transition: all 0.25s ease-in-out;
                                    }
                                .headerSubMenu1__subItem[aria-expanded="true"][data-text]::before,
                                .headerSubMenu1__subItem[aria-expanded="true"]:not([data-text]) span::before {
                                    width: 100%;
                                }
                                .headerSubMenu1__subItem[data-media="pointer--fine"]:not([aria-expanded]):hover {
                                    color: black;
                
                                    filter:  drop-shadow(1px 1px 0 white);
                                }
                                .headerSubMenu1__subItem[data-media="portrait--mobile"]::after {
                                    position: relative;

                                    display: inline-block;
                                    /* height: 100%; */
                                    left: 3px;
    
                                    font-size: 11px;
                                }
                                    .headerSubMenu1__subItem[aria-expanded="false"][data-media="portrait--mobile"]::after {
                                        top: -2px;
                                        content: "▼";
                                        color: white;
                                    }
                                    .headerSubMenu1__subItem[aria-expanded="true"][data-media="portrait--mobile"]::after {
                                        top: -1px;
                                        content: "▲";
                                        color: black;
                                    }
                            .headerSubMenu1__subItem > span {
                                --text-condensed: 0.9;
                            }
                    .headerSubMenu2__item {
                        color: white;
                        list-style-type: none;
                        white-space: nowrap;
                
                        transition: all 0.25s ease-in-out;
                    }
                        .headerSubMenu2__item[data-media="landscape__portrait--PC"] {
                            font-size: 24px;
                            line-height: 32px;
                
                            filter: drop-shadow(1px 1px 0px rgba(0, 0, 0, 0.5));
                        }
                        .headerSubMenu2__item[data-media="portrait--mobile"] {
                            font-size: 20px;
                            line-height: 26px;
                
                        }
                                .headerSubMenu2__item[data-media="pointer--fine"]:hover{
                                    color: black;
                
                                    filter:  drop-shadow(1px 1px 0 white);
                                }
                            .headerSubMenu2__item[data-media="portrait--mobile"] > span {
                                --text-condensed: 0.8;
                            }
                            .headerSubMenu2__item a {
                                all: unset;
                                display: inline;
                                color: inherit;
                                text-decoration: none;
                                cursor: default;
                                font: inherit;
                            }
            #header_submenu1_home-button[data-media="landscape__portrait--PC"] {
                display: none;
            }
            .header_submenu1_contacts {
                margin: 10px 12px;

                height: 105px;
            }
                .header_submenu1_contacts > :nth-child(1) {
                    font-size: 24px;
                    color: white;

                    filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));
                }
                .header_submenu1_contacts > :nth-child(2) {
                    margin-left: 28px;
                    
                    font-size: 24px;
                    line-height: 24px;
                    font-weight: bold;
                    color: white;
                    white-space: nowrap;

                    filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));

                    transition: all 0.2s ease-in-out;
                }
                        .header_submenu1_contacts > :nth-child(2):hover {
                            filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5)) drop-shadow(0 0 10px white);
                        }
                    .header_submenu1_contacts > :nth-child(2) > span {
                        --text-condensed: 0.93;
                    }
                .header_submenu1_contacts > :nth-child(3) {
                    margin-top: 4px;
                    margin-left: 47px;
                    
                    height: 1px;
                    width: 200px;

                    background-color: white;
                }
                .header_submenu1_contacts > :nth-child(4) {
                    margin-top: 6px;
                    margin-left: 43px;

                    height: 32px;
                    width: 221px;
                }
                    .header_submenu1_contacts > :nth-child(4) > a > img {
                        height: 32px;
                        width: 32px;

                        filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));

                        transition: all 0.2s ease-in-out;
                    }
                            .header_submenu1_contacts > :nth-child(4) > a > img:hover {
                                filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5)) drop-shadow(0 0 10px white);
                            }
                        .header_submenu1_contacts > :nth-child(4) > a:not(:nth-child(1)) > img {
                            margin-left: 4px;
                        }
            .header_submenu1_shedule {
                margin: 24px 12px;

                height: 140px;
            }
                .header_submenu1_shedule > :nth-child(1) {
                    font-size: 24px;
                    color: white;

                    filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));
                }
                .header_submenu1_shedule > :nth-child(2) {
                    float: right;

                    height: 104px;
                    width: 220px;

                    transform: scaleX(1.15);
                    transform-origin: top right;

                    border-collapse: collapse;
                }
                    .header_submenu1_shedule > :nth-child(2) tr td {
                        /* border: 1px solid black; */
                        height: 16px;
                        font-size: 16px;
                        line-height: 16px;
                        color: white;
                    }
                    .header_submenu1_shedule > :nth-child(2) tr td:nth-child(1) {
                        width: 64px;

                        text-align: right;
                        font-weight: bold;

                        filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));
                    }
                    .header_submenu1_shedule > :nth-child(2) tr td:nth-child(2) {
                        width: 64px;
                        padding-left: 14px;

                        filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));
                    }
                        .header_submenu1_shedule > :nth-child(2) tr td:nth-child(2) > span {
                            position: relative;
                            top: -4px;
                            font-size: 10px;
                        }
                    .header_submenu1_shedule > :nth-child(2) tr td:nth-child(3) {
                        width: 24px;
                    }
                        .header_submenu1_shedule > :nth-child(2) tr td:nth-child(3) > img {
                            width: 44px;
                        }
            .header_submenu1_adress {
                margin: 24px 12px 14px 12px;

                height: 106px;
                width: 264px;
            }
                    .header_submenu1_adress a {
                        transition: all 0.2s ease-in-out;
                    }
                    .header_submenu1_adress a:hover {
                        filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5)) drop-shadow(0 0 10px white) !important;
                    }
                .header_submenu1_adress > :nth-child(1) {
                    font-size: 24px;
                    color: white;
                    white-space: nowrap;

                    filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));
                }
                    .header_submenu1_adress > :nth-child(1) > span {
                        --text-condensed: 0.75;
                    }
                .header_submenu1_adress > :nth-child(2) {
                    margin-top: -2px;
                    margin-left: 32px;

                    width: 232px;

                    overflow: hidden;

                    font-size: 24px;
                    line-height: 24px;
                    color: white;
                    white-space: nowrap;
                    
                    filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));
                }
                    .header_submenu1_adress > :nth-child(2) > span:nth-child(1) {
                        /* width: 108px; */
                        /* overflow: hidden; */
                        --text-condensed: 0.57;
                    }
                    .header_submenu1_adress > :nth-child(2) > span:nth-child(2) {
                        --text-condensed: 0.72;
                    }
                .header_submenu1_adress > :nth-child(3) > a {
                    margin-left: 78px;

                    line-height: 14px;
                    font-size: 14px;
                    color: white;

                    filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));
                }
            .header_submenu1_go-to {
                margin-top: 24px;
                margin-bottom: 20px;

                display: flex;
                justify-content: center;
                align-items: center;

                /* width: 240px; */
            }
                .header_submenu1_go-to > span {
                    font-size: 14px;
                    color: white;

                    filter: drop-shadow(1px 1px 0 rgba(0, 0, 0, 0.5));
                }
                .header_submenu1_go-to > div {
                    position: relative;
                    z-index: 2;
                    margin-left: 7px;
                }
                        .header_submenu1_go-to > div::before{
                            content: "";
                            position: absolute;
                            z-index: 2;
                            top: 0;
                            left: 0;

                            height: 100%;
                            width: 100%;

                            transition: all 0.5s ease-in-out;
                            opacity: 0;

                            border-radius: 10px;
                            background: rgba(255, 0, 0, 0.75);

                            mix-blend-mode: overlay;
                            pointer-events: none;
                        }
                            @media (pointer: fine) {
                                .header_submenu1_go-to:hover > div::before {
                                    opacity: 1;
                                }
                            }
                        .header_submenu1_go-to > div::after {
                            position: absolute;
                            z-index: 3;
                            top: 0;
                            left: 0;

                            height: 50%;
                            width: 100%;
                            transform: translateY(100%);
                            border-radius: 0 0 10px 10px;

                            opacity: 0;
                            background-image: linear-gradient( -180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);

                            content: "";

                            pointer-events: none;

                            transition: all 0.5s ease-in-out;
                        }
                            @media (pointer: fine) {
                                .header_submenu1_go-to:hover > div::after {
                                    opacity: 1;
                                }
                            }
                    .header_submenu1_go-to > div > img {
                        
                        height: 30px;

                        opacity: 0.8;

                        transition: all 0.5s ease-in-out;
                    }
                            .header_submenu1_go-to:hover > div > img {
                                        opacity: 1;
                                    }
            .header_submenu2 {
                visibility: hidden;
                opacity: 0;

                background-color: var(--color-test);
            }
                    .header_submenu2.visible {
                        visibility: visible;
                        opacity: 1;
                    }
                .header_submenu2[data-media="landscape__portrait--PC"] {
                    position: absolute;
                    z-index: 1;
                    top: calc(0% - 6px);
                    left: calc(100% + 16px);

                    padding: 6px 12px;

                    transform: scaleX(0.01);
                    transform-origin: center left;

                    transition: all 0.2s ease-out;
                }
                        .header_submenu2.visible[data-media="landscape__portrait--PC"] {
                            transform: scale(1);
                        }
                    .header_submenu2[data-media="landscape__portrait--PC"]::before {
                        position: absolute;
                        z-index: -1;
                        top: 0;
                        left: 0;

                        height: 100%;
                        width: 100%;

                        content: "";
                        border-radius: 10px;
                        box-shadow: 8px 8px 10px rgba(0, 0, 0, 0.3);
                        background-color: rgba(0, 157, 225, 0.5);
                        backdrop-filter: blur(5px);
                    }
                    .header_submenu2[data-media="landscape__portrait--PC"]::after {
                        position: absolute;
                        z-index: -2;

                        top: 0%;
                        left: -17px;

                        height: 100%;
                        width: 17px;

                        content: "";

                        background-color: var(--color-test);
                    }
                .header_submenu2[data-media="portrait--mobile"] {
                    margin-left: 25px;
                    
                    /* height: 0; */
                    /* width: 0; */
                    max-height: 0;
                    max-width: 0;
                    padding: 0px 6px;
                    
                    border: 0px solid white;
                    border-radius: 10px;
                    
                    filter: drop-shadow(1px 1px 0px rgba(0, 0, 0, 0.5));

                    transition: all 1s ease-out;
                }
                        .header_submenu2.visible[data-media="portrait--mobile"] {
                            max-height: 500px;
                            /* height: fit-content; */
                            max-width: 500px;
                            /* width: fit-content; */
                            padding: 2px 6px;
                            
                            border: 1px solid white;
                        }
                .header_submenu2.header_submenu2_addmargin[data-media="portrait--mobile"] {
                    margin-left: 50px;
                }
    .header_logo-shadow {
        position: absolute;

        border-radius: 10px;
        box-shadow: 0 0 10px black;
    }
        .header_logo-shadow[data-media="landscape__portrait--PC"] {
            top: -3px;
            right: 30px;

            height: 67px;
            width: 201px;

            transition: all 0.5s ease-in-out;
        }
            .header_logo-shadow[data-media="landscape__portrait--PC"]:hover {
                box-shadow: 0 0 10px rgb(0, 0, 0),
                            0 0 30px rgb(255, 255, 255),
                            /* 0 0 50px rgb(255, 255, 255), */
                            /* 0 0 50px rgb(255, 255, 255), */
                            /* 0 0 50px rgb(255, 255, 255), */
                            0 0 30px rgb(255, 255, 255);
            }
            .header_logo-shadow[data-media="portrait--mobile"] {
                top: 0;
                right: 10px;

                height: 61px;
                width: 62px;
            }
h1 {
    visibility: hidden;
    opacity: 0;

    position: fixed;
    top: calc(14px * var(--scale_1200));
    z-index: 11;
    left: 50%;
    transform: translateX(-50%) scale(var(--scale_1200));
    transform-origin: top center;

    height: 40px;

    line-height: 46px;
    font-weight: bold;
    color: grey;
    text-transform: uppercase;
    letter-spacing: 1.3px;
    white-space: nowrap;

    mix-blend-mode: hard-light;
    background-color: white;

    transition: opacity 1s ease-in-out;
}
    h1[data-media="landscape__portrait--PC"] {
        padding: 0 16px;
        
        font-size: 40px;
    }
    h1[data-media="portrait--mobile"] {
        padding: 0 8px 0 8px;

        font-size: 36px;
        transform-origin: top center;
    }
        body.header_on h1 {
            visibility: visible;
            opacity: 1;
        }