:root {
    --navigation-padding: 50px;
    --navigation-column-width: 250px;
    --navigation-column-gap: 15px 10px;
    --navigation-header-logo-height: 50px;
}

header {
    padding: var(--navigation-padding);
    justify-content: space-between;
    background: transparent;
    box-sizing: border-box;
    flex-direction: row;
    align-items: start;
    position: absolute;
    display: flex;
    width: 100%;
    z-index: 1;
    left: 0;
    top: 0;
}

header > .header_mobile__logo_link, header > .header_mobile__icon {
    display: var(--mobile-display);
    cursor: pointer;
}

header > .header__logo_link > .header__logo,
header > .header_mobile__icon,
header > .header_mobile__logo_link > .header_mobile__logo {
    height: var(--navigation-header-logo-height);
}

header > .navigation {
    grid-template-columns: var(--navigation-column-width) var(--navigation-column-width) auto;
    gap: var(--navigation-column-gap);
    text-align: start;
    direction: rtl;
    display: grid;
}

header > .navigation > .navigation__link, footer > .footer_logo_block > .footer_logo_contacts > .navigation__link {
    transition: var(--transition);
}

header > .navigation > .navigation__link:hover, footer > .footer_logo_block > .footer_logo_contacts > .navigation__link:hover {
    text-decoration: underline;
    cursor: pointer;
}

@media only screen and (max-width: 1240px) {
    :root {
        --navigation-padding: 30px;
    }
}

@media only screen and (max-width: 1024px) {
    :root {
        --navigation-column-gap: 10px 5px;
        --navigation-column-width: 200px;
        --navigation-padding: 20px;
    }
}

@media only screen and (max-width: 760px) {
    :root {
        --navigation-header-logo-height: 30px;
        --navigation-padding: 15px;
    }

    header > .header__logo_link, header > .navigation {
        display: none;
    }

    header > .header_mobile__icon {
        width: var(--navigation-header-logo-height);
    }
}

@media only screen and (max-width: 560px) {
    :root {
        --navigation-padding: 10px;
    }
}
