.navbar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    font-family: var(--fontheader);
    z-index: 100;
    transition: transform .5s linear;
    background-color: rgba(0, 0, 0, 0.25);
    color: var(--white);
}

    .navbar .container {
        display: flex;
        align-items: center;
        position: relative;
    }

    .navbar:has(+ main > .block__header--minimal) {
        background-color: transparent;
        background-image: url(/images/temp/header-bg.jpg);
        background-position: 50% 100%;
        background-size: cover;
    }

        .navbar:has(+ main > .block__header--minimal):after {
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            width: 38%;
            height: 100%;
            background-image: url("data:image/svg+xml,%3Csvg width='678' height='588' viewBox='0 0 678 588' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='0.1'%3E%3Cpath d='M577.415 466.163C577.415 469.396 580.037 472.018 583.271 472.018H608.415C611.552 472.018 614.094 469.477 614.094 466.34V463.476C614.094 426.483 584.831 395.475 547.846 394.807C510.065 394.123 479.113 424.657 479.113 462.285V466.09C479.113 469.364 481.768 472.018 485.041 472.018H510.186C513.283 472.018 515.792 469.509 515.792 466.412V462.277C515.792 444.911 530.231 430.859 547.734 431.486C564.441 432.09 577.415 446.375 577.415 463.09V466.163Z' fill='white'/%3E%3Cpath d='M286.902 489.698C290.135 489.698 292.758 487.076 292.758 483.843V458.698C292.758 455.561 290.216 453.019 287.079 453.019H284.215C247.222 453.019 216.214 482.282 215.546 519.267C214.863 557.048 245.396 588 283.025 588H286.829C290.103 588 292.758 585.346 292.758 582.072V556.927C292.758 553.83 290.248 551.321 287.151 551.321H283.017C265.65 551.321 251.598 536.882 252.226 519.379C252.829 502.673 267.114 489.698 283.829 489.698H286.902Z' fill='white'/%3E%3Cpath d='M427.545 51.3666C427.545 54.6002 430.167 57.2224 433.401 57.2224H458.545C461.682 57.2224 464.224 54.6806 464.224 51.5436V48.6801C464.224 11.6872 434.961 -19.3211 397.976 -19.9887C360.195 -20.6724 329.243 9.86132 329.243 47.4896V51.2943C329.243 54.568 331.898 57.2224 335.171 57.2224H360.316C363.413 57.2224 365.922 54.7128 365.922 51.616V47.4816C365.922 30.1153 380.361 16.063 397.864 16.6904C414.57 17.2937 427.545 31.5792 427.545 48.294V51.3666Z' fill='white'/%3E%3Cpath d='M410.943 333.024C410.943 329.79 408.321 327.168 405.087 327.168H379.942C376.805 327.168 374.264 329.71 374.264 332.847V335.71C374.264 372.703 403.527 403.711 440.511 404.379C478.292 405.063 509.244 374.529 509.244 336.901V333.096C509.244 329.822 506.59 327.168 503.316 327.168H478.172C475.075 327.168 472.565 329.678 472.565 332.774V336.909C472.565 354.275 458.127 368.327 440.624 367.7C423.917 367.097 410.943 352.811 410.943 336.088V333.016V333.024Z' fill='white'/%3E%3Cpath d='M139.429 394.654C104.302 394.654 75.3612 367.676 72.2241 333.354C71.9185 330.023 74.5809 327.16 77.919 327.16H103.369C106.201 327.16 108.557 329.251 109.008 332.05C111.357 346.722 124.106 357.975 139.429 357.975C154.752 357.975 167.501 346.722 169.85 332.05C170.301 329.251 172.657 327.16 175.489 327.16H200.939C204.285 327.16 206.939 330.023 206.634 333.354C203.497 367.676 174.556 394.654 139.429 394.654Z' fill='white'/%3E%3Cpath d='M295.806 141.375C260.679 141.375 231.738 114.397 228.601 80.0745C228.295 76.7444 230.958 73.8809 234.296 73.8809H259.746C262.578 73.8809 264.934 75.9722 265.385 78.7714C267.734 93.4431 280.483 104.696 295.806 104.696C311.129 104.696 323.878 93.4431 326.227 78.7714C326.678 75.9722 329.034 73.8809 331.866 73.8809H357.316C360.662 73.8809 363.316 76.7444 363.011 80.0745C359.874 114.397 330.933 141.375 295.806 141.375Z' fill='white'/%3E%3Cpath d='M165.844 485.218C165.844 502.206 152.025 516.025 135.037 516.025C118.049 516.025 104.23 502.206 104.23 485.218C104.23 468.23 118.049 454.411 135.037 454.411C152.025 454.411 165.844 468.23 165.844 485.218ZM135.029 417.732C97.8108 417.732 67.5425 448.008 67.5425 485.218C67.5425 522.428 97.8188 552.704 135.029 552.704C172.239 552.704 202.515 522.428 202.515 485.218C202.515 448.008 172.239 417.732 135.029 417.732Z' fill='white'/%3E%3Cpath d='M635.989 305.144C635.989 322.133 622.17 335.952 605.182 335.952C588.194 335.952 574.375 322.133 574.375 305.144C574.375 288.156 588.194 274.337 605.182 274.337C622.17 274.337 635.989 288.156 635.989 305.144ZM605.174 237.65C567.956 237.65 537.688 267.926 537.688 305.136C537.688 342.346 567.964 372.623 605.174 372.623C642.384 372.623 672.66 342.346 672.66 305.136C672.66 267.926 642.384 237.65 605.174 237.65Z' fill='white'/%3E%3Cpath d='M326.356 225.528C326.356 242.516 312.537 256.335 295.549 256.335C278.561 256.335 264.742 242.516 264.742 225.528C264.742 208.54 278.561 194.721 295.549 194.721C312.537 194.721 326.356 208.54 326.356 225.528ZM295.549 158.042C258.331 158.042 228.062 188.318 228.062 225.528C228.062 262.738 258.339 293.015 295.549 293.015C332.759 293.015 363.035 262.738 363.035 225.528C363.035 188.318 332.759 158.042 295.549 158.042Z' fill='white'/%3E%3Cpath d='M472.381 152.821C472.381 169.81 458.562 183.629 441.574 183.629C424.585 183.629 410.766 169.81 410.766 152.821C410.766 135.833 424.585 122.014 441.574 122.014C458.562 122.014 472.381 135.833 472.381 152.821ZM441.565 85.335C404.347 85.335 374.079 115.611 374.079 152.821C374.079 190.031 404.355 220.308 441.565 220.308C478.776 220.308 509.052 190.031 509.052 152.821C509.052 115.611 478.776 85.335 441.565 85.335Z' fill='white'/%3E%3Cpath d='M138.729 303.946C175.947 303.946 206.216 273.533 206.216 236.154V164.235C206.216 160.817 203.457 158.042 200.054 158.042H175.706C172.304 158.042 169.545 160.817 169.545 164.235V236.154C169.545 253.222 155.726 267.106 138.737 267.106C121.749 267.106 107.93 253.222 107.93 236.154V161.742C107.93 159.699 106.281 158.042 104.246 158.042H74.935C72.8999 158.042 71.251 159.699 71.251 161.742V236.154C71.251 273.533 101.527 303.946 138.737 303.946' fill='white'/%3E%3Cpath d='M267.243 418.866H241.02C238.133 418.866 235.792 416.525 235.792 413.637V332.396C235.792 329.509 238.133 327.168 241.02 327.168H267.243C270.13 327.168 272.471 329.509 272.471 332.396V413.637C272.471 416.525 270.13 418.866 267.243 418.866Z' fill='white'/%3E%3Cpath d='M130.758 39.0277V12.8053C130.758 9.91762 133.099 7.57691 135.986 7.57691H199.821C202.708 7.57691 205.049 9.91762 205.049 12.8053V39.0277C205.049 41.9153 202.708 44.256 199.821 44.256H135.986C133.099 44.256 130.758 41.9153 130.758 39.0277Z' fill='white'/%3E%3Cpath d='M532.547 123.671V97.4489C532.547 94.5612 534.888 92.2205 537.775 92.2205H601.61C604.497 92.2205 606.838 94.5612 606.838 97.4489V123.671C606.838 126.559 604.497 128.9 601.61 128.9H537.775C534.888 128.9 532.547 126.559 532.547 123.671Z' fill='white'/%3E%3Cpath d='M428.824 439.369H455.046C457.934 439.369 460.275 441.71 460.275 444.597V525.839C460.275 528.726 457.934 531.067 455.046 531.067H428.824C425.936 531.067 423.596 528.726 423.596 525.839V444.597C423.596 441.71 425.936 439.369 428.824 439.369Z' fill='white'/%3E%3Cpath d='M374.079 293.698V267.476C374.079 264.588 376.42 262.247 379.307 262.247H504.564C507.451 262.247 509.792 264.588 509.792 267.476V293.698C509.792 296.586 507.451 298.927 504.564 298.927H379.307C376.42 298.927 374.079 296.586 374.079 293.698Z' fill='white'/%3E%3Cpath d='M69.3447 105.332V79.1092C69.3447 76.2216 71.6854 73.8809 74.5731 73.8809H199.829C202.717 73.8809 205.057 76.2216 205.057 79.1092V105.332C205.057 108.219 202.717 110.56 199.829 110.56H74.5731C71.6854 110.56 69.3447 108.219 69.3447 105.332Z' fill='white'/%3E%3Cpath d='M5.22838 158.042H31.4507C34.3384 158.042 36.6791 160.382 36.6791 163.27V296.61C36.6791 299.498 34.3384 301.838 31.4507 301.838H5.22838C2.34071 301.838 0 299.498 0 296.61V163.27C0 160.382 2.34071 158.042 5.22838 158.042Z' fill='white'/%3E%3Cpath d='M374.377 438.734C357.364 438.734 342.661 425.027 342.661 408.015V332.252C342.661 329.372 340.328 327.039 337.448 327.039H311.194C308.314 327.039 305.981 329.372 305.981 332.252V404.797C305.981 442.072 336.193 472.284 373.468 472.284H390.818C394.076 472.284 396.722 469.645 396.722 466.388V444.718C396.722 441.46 394.076 438.814 390.818 438.814L374.369 438.726L374.377 438.734Z' fill='white'/%3E%3Cpath d='M644.241 147.11C644.241 164.123 630.535 178.827 613.522 178.827H537.759C534.88 178.827 532.547 181.159 532.547 184.039V210.293C532.547 213.173 534.88 215.506 537.759 215.506H610.305C647.579 215.506 677.791 185.294 677.791 148.019V130.669C677.791 127.411 675.153 124.765 671.887 124.765H650.218C646.96 124.765 644.314 127.411 644.314 130.669L644.225 147.118L644.241 147.11Z' fill='white'/%3E%3C/g%3E%3C/svg%3E%0A");
        }

        .navbar__logo {
            display: flex;
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
        }

.navbar ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

.navbar__main,
.navbar__top {
    margin-left: auto;
    height: var(--nav-main-height);
}

    .navbar__main ul,
    .navbar__top ul {
        height: 100%;
        gap: 3rem;
    }

    .navbar__main li,
    .navbar__top li {
        height: 100%;
    }

.navbar__top {
    position: absolute;
    top: 1.5rem;
    right: 0;
    height: unset;
    font-size: 1.5rem;
    display: flex;
    gap: 2rem;
    width: 100%;
    padding-left: 26.5rem;
    z-index: 1;
}

    .navbar__top .navbar__search {
        width: 100%;
        margin-right: 6rem;
        position: relative;
        z-index: 2;
    }

        .navbar__top .navbar__search input {
            width: 100%;
            min-height: 4rem;
            padding-top: .8rem;
            padding-bottom: .6rem;
            background-color: rgba(255, 255, 255, .1);
            background-image: none;
            color: var(--white);
        }

            .navbar__top .navbar__search input::placeholder {
                color: var(--white);
            }

            .navbar__top .navbar__search input:focus {
                outline-color: var(--white);
                background-image: none;
            }

        .navbar__top .navbar__search button {
            width: 4rem;
            height: 4rem;
            background-color: transparent;
            border: none;
            padding: 0 .5rem 0 0;
            ;
            margin: 0;
            position: absolute;
            top: 0;
            right: 0;
            display: inline-flex;
            justify-content: center;
            align-items: center;
            cursor: pointer;
        }

    .navbar__top > .container > ul,
    .navbar__top > .container > ul li {
        height: 4rem;
        display: flex;
        align-items: center;
    }

.navbar > .container > ul li > a {
    height: 100%;
    display: flex;
    align-items: center;
    position: relative;
}

.navbar ul li > a:focus-visible {
    outline-offset: -1rem;
}

@media (pointer: fine) {
    .navbar ul li > a:hover {
        color: rgba(255, 255, 255, .75);
    }
}

.navbar__main {
    padding-top: 6.6rem;
    margin-left: 26.5rem;
}

    .navbar__main .navbar__nav {
        gap: 6rem;
    }

        .navbar__main .navbar__nav > li > a {
            height: 100%;
            display: inline-flex;
            padding-top: 1rem;
            font-weight: 700;
        }

@media (pointer: fine) {
    .navbar__main .navbar__nav > li > a {
        color: var(--white);
    }
}

.navbar .navbar__button {
    outline: none;
    border: none;
    background-color: transparent;
    color: var(--white);
    font-family: var(--fontbody);
    font-size: 1.5rem;
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    white-space: nowrap;
    height: 4rem;
    display: inline-flex;
    align-items: center;
    padding: 0;
    cursor: pointer;
    position: relative;
}

@media(pointer:fine) {
    .navbar .navbar__button:after {
        content: "";
        position: absolute;
        top: unset;
        left: unset;
        bottom: .75rem;
        right: 0;
        height: 0;
        width: calc(100% - 3.15rem);
        background-color: rgba(255, 255, 255, 0);
        transform: translateY(.3rem);
        transition: var(--transition-default);
    }

    .navbar .navbar__button:hover {
        color: var(--white);
    }

        .navbar .navbar__button:hover:after {
            height: .2rem;
            background-color: rgba(255, 255, 255, .5);
            transform: translateY(0);
        }
}

.navbar .navbar__button.navbar__cart {
    gap: 1.2rem;
}

.navbar__cart span {
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 50%;
    background-color: var(--green);
    color: var(--white);
    font-size: 1.1rem;
    font-weight: 600;
    position: absolute;
    top: 0;
    left: 1.5rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.navbar__hasdropdown {
    position: relative;
}

    .navbar__hasdropdown > a {
        padding-right: 3.5rem !important;
    }

        .navbar__hasdropdown > a:after {
            content: "";
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9.5' height='5.5' viewBox='0 0 9.5 5.5'%3E%3Cpath id='Path' d='M0,8.75a.748.748,0,0,1-.53-.22.75.75,0,0,1,0-1.061L2.939,4-.53.53A.75.75,0,0,1-.53-.53.75.75,0,0,1,.53-.53l4,4a.75.75,0,0,1,0,1.061l-4,4A.748.748,0,0,1,0,8.75Z' transform='translate(8.75 0.75) rotate(90)' fill='%230056a0'/%3E%3C/svg%3E%0A");
            width: 1rem;
            height: .6rem;
            position: absolute;
            top: calc(50% - .2rem);
            right: 2rem;
            transition: var(--transition-default);
        }


@media(min-width: 992px) {
    .navbar__hasdropdown:hover > a {
        background-color: var(--white);
        z-index: 2;
    }

        .navbar__hasdropdown:hover > a:after {
            transform: rotate(180deg);
        }
}

.navbar__dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    min-width: 30rem;
    display: flex;
    flex-flow: column;
    padding: 1rem 2rem;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transform: translateY(-.5rem);
    transition: var(--transition-default);
    z-index: 1;
}

.navbar__top .navbar__dropdown {
    min-width: 20rem;
}

@media(min-width: 992px) {
    .navbar__hasdropdown:hover .navbar__dropdown {
        max-height: 100vh;
        opacity: 1;
        transform: translateY(0);
    }
}

.navbar__dropdown a {
    padding: 1rem 0;
    line-height: 2rem;
}

    .navbar__dropdown a svg {
        opacity: 0;
        transition: var(--transition-default);
    }

.navbar__top .navbar__dropdown a svg {
    width: 1.3rem;
    height: auto;
    margin-top: -.2rem;
}

@media(min-width: 992px) {
    .navbar__dropdown a:hover {
        color: var(--azure);
    }

        .navbar__dropdown a:hover svg {
            opacity: 1;
            transform: translateX(.5rem);
        }
}

.navbar__toggler {
    position: relative;
    transition: var(--transition-default);
    cursor: pointer;
}

    .navbar__toggler:after {
        content: "";
        width: 200%;
        height: 200%;
        position: absolute;
        top: -50%;
        left: 0;
        background-color: transparent;
        z-index: 0;
    }

    .navbar__toggler span {
        display: block;
        position: absolute;
        height: .2rem;
        width: 1.8rem;
        background: var(--white);
        opacity: 1;
        right: 1.1rem;
        transform: rotate(0deg);
        transition: var(--transition-default);
        z-index: 1;
    }

        .navbar__toggler span:nth-child(1) {
            top: 1.2rem;
        }

        .navbar__toggler span:nth-child(2),
        .navbar__toggler span:nth-child(3) {
            top: 1.9rem;
        }

        .navbar__toggler span:nth-child(4) {
            top: 2.6rem;
        }

    .navbar__toggler[aria-expanded="true"] {
        /*
        text-indent: -9000px;
        padding-left: 0;
        width: 4rem;
            */
    }

        .navbar__toggler[aria-expanded="true"] span:nth-child(1) {
            top: 1.9rem;
            width: 0%;
            right: 2rem;
        }

        .navbar__toggler[aria-expanded="true"] span:nth-child(2) {
            transform: rotate(45deg);
        }

        .navbar__toggler[aria-expanded="true"] span:nth-child(3) {
            transform: rotate(-45deg);
        }

        .navbar__toggler[aria-expanded="true"] span:nth-child(4) {
            top: 1.9rem;
            width: 0%;
            right: 2rem;
        }

.navbar__menu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    padding-top: var(--nav-height);
    background-color: var(--black);
    transform: translate(100%, -100%);
    opacity: 0;
    transition: var(--transition-default);
    z-index: 1;
}

    .navbar__menu > svg {
        position: absolute;
        right: 0;
        bottom: 0;
    }

        .navbar__menu > svg:last-of-type {
            right: var(--padding-grid);
            bottom: var(--padding-grid);
        }

    .navbar__menu .container {
        position: relative;
    }

    .navbar__menu .navbar__toggler {
        position: absolute;
        top: calc((var(--nav-height) * -1) + 1.5rem);
        right: 0;
    }

.navbar.open .navbar__menu {
    transform: translate(0, 0);
    opacity: 1;
}

.megamenu {
    display: flex;
    gap: 6rem;
    width: 100%;
    padding: 4rem 10rem;
    color: var(--white);
}

.megamenu a {
    color: var(--white);
}

.megamenu__category {
    display: flex;
    flex-flow: column;
}

.megamenu__pages {
    display: flex;
    flex-flow: column;
    margin-left: auto !important;
    font-weight: 700;
}

@media(max-width: 991px) {
    .navbar {
        height: var(--nav-height);
        transition: background-color .3s ease-out;
    }

        .navbar:after {
            top: var(--nav-height);
            height: 2rem;
            z-index: -1;
        }

    .navbar__logo {
        padding-top: 0;
        margin-right: auto;
    }

        .navbar__logo svg {
            height: 4rem;
            width: auto;
        }

        .navbar__logo span {
            display: none;
        }

    .navbar__toggler {
        display: block;
        z-index: 101;
    }

    .navbar__main {
        position: fixed;
        top: 0;
        left: 0;
        height: var(--app-height);
        width: 100vw;
        overflow-y: auto;
        z-index: 100;
        background-color: var(--white);
        transition: transform .3s ease-out;
        transform: translateX(100%);
    }

        .navbar__main ul.navbar__nav {
            flex-flow: column;
            transform: none;
            padding: 3rem 0 2rem;
            height: unset;
            background-color: var(--azure-15-full);
            gap: 1rem;
        }

            .navbar__main ul.navbar__nav li {
                height: unset;
            }

                .navbar__main ul.navbar__nav li > a {
                    font-size: 2.2rem;
                    height: 4rem;
                }

    .navbar__toggler[aria-expanded="true"] ~ .navbar__main {
        transform: translateX(0);
    }

    .navbar__hasdropdown {
        position: relative;
    }

        .navbar__hasdropdown .navbar__dropdown {
            position: relative;
            top: unset;
            left: unset;
            min-width: unset;
            padding-top: 0;
            padding-bottom: 0;
            box-shadow: none;
        }

            .navbar__hasdropdown .navbar__dropdown a:first-of-type {
                margin-top: 1rem;
            }

            .navbar__hasdropdown .navbar__dropdown a:last-of-type {
                margin-bottom: 1rem;
            }

        .navbar__hasdropdown > .button {
            position: absolute;
            top: 0;
            right: 0;
            background-image: none;
            background-color: transparent;
            border-radius: 0;
            width: 4.8rem;
            height: 4rem;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 1;
        }

            .navbar__hasdropdown > .button:before {
                content: "";
                width: 150%;
                height: 100%;
                position: absolute;
                top: 0;
                right: 0;
                background-color: transparent;
            }

            .navbar__hasdropdown > .button svg {
                transition: var(--transition-default);
            }

        .navbar__hasdropdown.open > .button {
            background-color: var(--white);
        }

            .navbar__hasdropdown.open > .button svg {
                transform: rotate(-90deg);
            }

        .navbar__hasdropdown.open .navbar__dropdown {
            max-height: 100vh;
            opacity: 1;
            transform: translateY(0);
        }

        .navbar__hasdropdown > a:after {
            content: none;
        }
}