.site-header {
    position: relative;
    z-index: 99;
    background-color: transparent;
    display: flex;
    gap: var(--spacing-md);
    justify-content: space-between;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    transition: top 0.3s ease;
    padding: var(--spacing-xxl) var(--spacing-md);
    padding-left: var(--spacing-lg);

    @media (min-width: 1300px) {
        background-color: transparent;
        padding: var(--spacing-sm) var(--spacing-xxs);
    }
}

.site-branding {
    display: flex;
    align-items: center;
    padding: 0;
    order: 1;
    flex-grow: 1;

    @media (min-width: 1330px) {
        padding: 0 var(--spacing-xxl);
    }
}

.site-branding img {
    height: calc(var(--spacing-lg) * 1.5);
    width: auto;
    object-fit: contain;
    display: block;
}

.nav_content {
    padding: 0;
    transition: .3s all;
    display: flex;
    flex-wrap: wrap;
    gap: var(--spacing-md);
}

.nav_content ul {
    display: flex;
    align-items: center;
    height: 100%;
}

.nav_content ul li {
    padding: var(--spacing-xs) var(--spacing-sm);
    transition: .3s all;
}

.menu-toggle {
    background: transparent;
    border: none;
    outline: none;
    padding: 0 var(--spacing-sm);
}

.menu-toggle svg {
    width: 24px;
    height: 24px;
}

.menu-toggle svg path {
    fill: var(--white);
}

.menu-mainmenu-container li a {
    color: var(--white);
    font-weight: 700;
    transition: .3s all;
}

.menu-mainmenu-container li:hover a,
.menu-mainmenu-container li.current-menu-item a {
    color: var(--color);
}

.site-header .menu-mainmenu-container ul li.menu-item-has-children {
    position: relative;
    padding-right: calc(var(--spacing-sm)*2);
}

.site-header .menu-mainmenu-container ul li.menu-item-has-children::before {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M13.5306 6.53063L8.5306 11.5306C8.46092 11.6005 8.37813 11.656 8.28696 11.6939C8.1958 11.7317 8.09806 11.7512 7.99935 11.7512C7.90064 11.7512 7.8029 11.7317 7.71173 11.6939C7.62057 11.656 7.53778 11.6005 7.4681 11.5306L2.4681 6.53063C2.3272 6.38973 2.24805 6.19864 2.24805 5.99938C2.24805 5.80012 2.3272 5.60902 2.4681 5.46813C2.60899 5.32723 2.80009 5.24808 2.99935 5.24808C3.19861 5.24808 3.3897 5.32723 3.5306 5.46813L7.99997 9.9375L12.4693 5.4675C12.6102 5.32661 12.8013 5.24745 13.0006 5.24745C13.1999 5.24745 13.391 5.32661 13.5318 5.4675C13.6727 5.6084 13.7519 5.7995 13.7519 5.99875C13.7519 6.19801 13.6727 6.38911 13.5318 6.53L13.5306 6.53063Z" fill="white" fill-opacity="0.9"/></svg>');
    position: absolute;
    top: var(--spacing-xs);
    right: calc(var(--spacing-sm)/2);
    transform: translate(0%, 5%);
}

.site-header .menu-mainmenu-container ul li.menu-item-has-children .sub-menu {
    display: block;
    transition: .3s all;
    position: absolute;
    background: var(--black);
    height: auto;
    /* left: 0;
        transform: translate(0); */
}

.site-header .menu-mainmenu-container ul li.menu-item-has-children .sub-menu li {
    background: transparent;
}

.site-header .menu-mainmenu-container ul li.menu-item-has-children .sub-menu li:hover {
    background: var(--black);
}

.site-header .menu-mainmenu-container ul li.menu-item-has-children .sub-menu li a {
    position: relative;
    z-index: 10;
    background: transparent;
}


.header_wrap {
    order: 2;

    @media (max-width: 1330px) {
        order: 3;
    }
}

.site-header .main-navigation .menu-close-btn {
    display: none;
}

@media (max-width: 1330px) {
    .site-header .main-navigation {
        text-align: right;
    }

    .site-header .nav_content {
        box-sizing: border-box;
        display: block;
        position: fixed;
        top: 0;
        /* right: 0; */
        right: -100%;
        width: 100%;
        height: 100%;
        background: var(--black);
        transition: .3s all;
        z-index: 99;
        padding: var(--spacing-xxl) var(--spacing-md);
    }

    .site-header .nav_content ul {
        flex-wrap: wrap;
    }

    .site-header .nav_content.active {
        right: 0;
    }

    .site-header .nav_content ul li {
        text-align: center;
        flex-basis: 100%;
    }

    .site-header .nav_content ul li a {
        color: var(--white);
    }


    .site-header .nav_content .header_buttons {
        display: block;
        height: auto;
        max-width: 75%;
        margin: var(--spacing-lg) auto 0;
        transform: skewX(0);
    }

    .site-header .nav_content .header_buttons li {
        transform: skewX(-24deg);
        margin-bottom: var(--spacing-sm);
    }

    .site-header .nav_content .header_buttons li a {
        width: 100%;
        background: transparent;
    }

    .site-header .nav_content .menu-close-btn {
        display: block;
        position: absolute;
        top: var(--spacing-sm);
        right: var(--spacing-sm);
    }

    .site-header .nav_content .menu-close-btn svg {
        width: var(--spacing-sm);
        height: var(--spacing-sm);
        object-fit: contain;
        fill: var(--white);
    }
}

.site-header.fixed {
    position: fixed;
    top: -100%;
    /* ukryty nad ekranem */
    left: 0;
    width: 100%;
    background: var(--blackTrans);

    @media (max-width: 1300px) {
        padding-top: var(--spacing-md);
        padding-left: var(--spacing-md);
        padding-right: var(--spacing-sm);
        padding-bottom: var(--spacing-xxs);
    }
}

.site-header.fixed.visible {
    top: 0;
    /* pokazany */
}

.site-header.fixed #offer-menu {
    display: none;
}

.header-placeholder {
    display: none;
}

.header-placeholder.active {
    display: block;
}

.page_header {
    background: var(--colorDarker);
    background-image: radial-gradient(226.39% 226.17% at 55.08% -126.14%, var(--color) 0%, var(--colorDarker) 77.74%);
    padding: calc(var(--spacing-xl)*2) 0 var(--spacing-xl);
    color: var(--white);
    overflow: hidden;
    position: relative;
}


.page_header .container {
    position: relative;
}


.page_header a {
    color: var(--white);
    text-decoration: none;
}

.page_header #breadcrumbs {
    font-weight: 400;
    letter-spacing: 0.8px;
}

.page_header_title {
    font-weight: 700;
    font-size: var(--font-size-h1);
}



.page_header #breadcrumbs,
.page_header_title,
.page_header_subtitle {
    position: relative;
    z-index: 5;
}

.social-header {
    display: flex;
    gap: var(--spacing-sm);
    justify-content: flex-end;
    order: 3;

    @media (max-width: 1330px) {
        order: 2;
    }
}

.social-header a svg {
    height: var(--font-size-big);
    width: auto;

    @media (max-width: 1330px) {
        height: 24px;
    }
}