.wp-block-menu a {
    text-decoration: none;
}

/* header menu */

.wp-block-menu[data-location="header"] {
    --menu-gap: var(--wp--preset--spacing--50);
    --submenu-gap: var(--wp--preset--spacing--40);
}

.wp-block-menu[data-location="header"] .menu > li > a {
    text-transform: uppercase;
}

/* header menu desktop */

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu-item-has-children {
    position: relative;
    z-index: 1;
}

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .sub-menu {
    visibility: hidden;
    position: absolute;
    top: calc(100% + 2.5em);
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--contrast);
    border-radius: 0.75em;
    min-width: 15em;
    padding: var(--wp--preset--spacing--40);
    opacity: 0;
    transition: opacity 0.4s ease, visibility 0.3s ease;
}

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu-item-has-children > a {
    display: inline-flex;
    gap: 0.5em;
    align-items: center;
}

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu-item-has-children > a:after {
    content: "";
    width: 0.5em;
    height: 0.5em;
    display: block;
    border-bottom: 1px solid currentColor;
    border-right: 1px solid currentColor;
    transform: rotate(45deg);
    margin-top: -0.5em;
}

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu-item-has-children:hover .sub-menu,
.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu-item-has-children:focus-within .sub-menu {
    visibility: visible;
    opacity: 1;
}

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu > .menu-item-has-children > .sub-menu::before {
    background-color: transparent;
    bottom: 100%;
    content: '';
    display: block;
    height: 2.5em;
    left: 0;
    position: absolute;
    width: 100%;
}

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu > .menu-item > a {
    position: relative;
}

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu > .menu-item > a::before {
    content: "";
    width:0%;
    height: 1px;
    background-color: currentColor;
    transition: width 0.25s ease-out;
    position: absolute;
    bottom: 0;
}

.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu > .menu-item > a:hover::before,
.wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu > .menu-item:focus-within > a::before {
    width: 100%;
}

/* header menu overlay */

.wp-block-menu--overlay[data-location="header"] .wp-block-menu-dialog {
    background-color: var(--wp--preset--color--contrast);
    color: var(--wp--preset--color--base);
    top: 100%;
    max-width: 25rem;
    right: var(--wp--style--root--padding-right);
    left: unset;
    border-radius: 1em 0 1em 1em;
    font-size: var(--wp--preset--font-size--medium);
    padding: 0;
    width: calc( 100% - (var(--wp--style--root--padding-right) * 2));
    max-height: calc(100vh - 80px);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--wp--preset--color--neutral) transparent;
    animation: reveal_overlay_menu 0.4s ease-out 1 forwards;
}

.wp-block-menu--overlay[data-location="header"] .wp-block-menu-dialog-content {
    padding-bottom: var(--wp--preset--spacing--50);
}

.wp-block-menu--overlay[data-location="header"] .wp-block-menu-icon--close,
.wp-block-menu--overlay[data-location="header"] .wp-block-menu-close {
    display: none;
}

.wp-block-menu--overlay[data-location="header"] .wp-block-menu-open .wp-block-menu-icon svg {
    width: 1em;
    height: 1em;
}

.wp-block-menu--overlay[data-location="header"]:has(.wp-block-menu-dialog[open]) .wp-block-menu-icon--open {
    display: none;
}

.wp-block-menu--overlay[data-location="header"]:has(.wp-block-menu-dialog[open]) .wp-block-menu-icon--close {
    display: block;
}

.wp-block-menu--overlay[data-location="header"] .sub-menu {
    color: var(--wp--preset--color--neutral-light);
}

.wp-block-menu--overlay[data-location="header"] .submenu-toggle {
    font-size: inherit;
}

.wp-block-menu--overlay[data-location="header"] .submenu-toggle svg {
    width: 1em;
    height: 1em;
}

.wp-block-menu--submenu-toggle[data-location="header"] .menu-item-has-children .submenu-toggle[aria-expanded=true]+.sub-menu {
    display: flex;
    padding-left: var(--wp--preset--spacing--40);
}

.wp-block-menu--overlay[data-location="header"] .wp-block-button__link {
    color: var(--wp--preset--color--contrast);
    background-color: var(--wp--preset--color--base);
}

.wp-block-menu--overlay[data-location="header"] .wp-block-buttons {
    margin-top: var(--menu-gap);
}

.wp-block-menu--overlay[data-location="header"] .wp-block-button {
    font-size: var(--wp--preset--font-size--tiny);
}

@keyframes reveal_overlay_menu {
    0% {
        opacity: 0;
        transform: translateY(-1rem);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Footer menu */

.wp-block-menu[data-location="footer"] {
    --menu-gap: var(--wp--preset--spacing--30);
}
.wp-block-menu[data-location="footer"] a:hover,
.wp-block-menu[data-location="footer"] a:focus {
    color: var(--wp--preset--color--neutral-light);
}

.wp-block-menu[data-location="footer"] .menu > .menu-item > a {
    text-transform: uppercase;
}

@media screen and (max-width: 370px) {
    .wp-block-menu[data-location="footer"] {
        align-items: flex-start;
    }
}

/* Header styles */

header.wp-block-template-part {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--contrast);
    position: sticky;
    top: calc(0px + var(--wp-admin--admin-bar--height, 0px));
    z-index: 100;
    transition: all 0.3s ease-out;
    transition-property: color, background-color;
}

.header-fixed header.wp-block-template-part {
    position: fixed;
    width: 100%;
}

.header-fixed:not([data-has-scrolled="true"]) header.wp-block-template-part {
    background-color: transparent;
    color: var(--wp--preset--color--base);
}

.header-fixed:not([data-has-scrolled="true"]) header.wp-block-template-part .wp-block-site-logo {
    filter: invert(1);
}

.header-fixed:not([data-has-scrolled="true"]) .wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu > li:hover > a,
.header-fixed:not([data-has-scrolled="true"]) .wp-block-menu[data-location="header"]:not(.wp-block-menu--overlay) .menu > li:focus-within > a {
    color: var(--wp--preset--color--neutral-light);
}

.header-fixed:not([data-has-scrolled="true"]) header.wp-block-template-part .wp-block-button__link {
    background-color: var(--wp--preset--color--base);
    color: var(--wp--preset--color--contrast);
}