.wp-block-menu .menu-item > a {
    text-decoration-color: transparent;
}

/* Header menu */

.wp-block-menu[data-location="header"] {
    --menu-gap: 2rem;

    font-size: var(--wp--preset--font-size--small);
    font-weight: 400;
    line-height: 1.25;
    align-self: stretch;
}

.wp-block-menu[data-location="header"] a {
    font-weight: 500;
}

/* Header menu item - dropdown */

.wp-block-menu[data-location="header"] > .menu  {
    height: 100%;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > a[aria-controls] + .sub-menu {
    display: none !important;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children {
    position: relative;
    align-self: stretch;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > a {
    align-items: center;
    display: flex;
    height: 100%;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu {
    --submenu-gap: 0;
    --submenu-padding: var(--wp--preset--spacing--40);

    animation: submenu-reveal var(--speed) var(--ease) forwards;
    background-color: var(--wp--preset--color--base);
    border: 1px solid var(--wp--preset--color--line);
    border-radius: var(--wp--preset--border-radius--medium-large);
    box-shadow: var(--wp--preset--shadow--menu);
    color: var(--wp--preset--color--grey-dark);
    display: none;
    left: 0;
    left: calc(var(--wp--preset--spacing--50) * -1);
    min-width: 20rem;
    padding: var(--submenu-padding) 0;
    position: absolute;
    top: calc(100% + var(--wp--preset--spacing--40));
    grid-template-columns: 1fr;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu::before {
    background-color: transparent;
    border-radius: 0;
    border-top-left-radius: 100em;
    border-top-right-radius: 100em;
    bottom: 100%;
    content: '';
    height: calc(var(--wp--preset--spacing--40) + 0.25em);
    left: 0;
    position: absolute;
    width: 100%;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > .sub-menu:focus-within,
.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > .sub-menu:hover,
.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > a:focus + .sub-menu,
.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > a:hover + .sub-menu {
    display: grid;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > a:focus::after,
.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > a:hover::after {
    transform: rotate(225deg) translateX(-50%) translateY(-25%);
}

.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children > a::after {
    border: 1px solid currentColor;
    border-block-start-color: transparent;
    border-inline-start-color: transparent;
    content: '';
    display: block;
    height: 0.325em;
    margin-inline-start: 0.25em;
    transform: rotate(45deg) translateY(-50%);
    transform-origin: center;
    transition: transform var(--speed-fast) var(--ease);
    width: 0.325em;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu a {
    padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
    display: flex;
    align-items: center;
    color: var(--wp--preset--color--contrast);
    text-decoration: none;
    gap: 0.75em;
    transition: background-color 0.3s ease-out;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu a:hover,
.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu a:focus {
    background-color: var(--wp--preset--color--light);
}

.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu .menu-item-icon {
    color: var(--wp--preset--color--grey);
    border-radius: 0.375rem;
    height: 2rem;
    width: 2rem;
    justify-content: center;
    align-items: center;
    align-self: center;
    flex-shrink: 0;
    transition: color 0.2s ease-out, background-color 0.2s ease-out;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu .menu-item-icon > * {
    max-width: 1.375rem;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu a:hover > .menu-item-icon,
.wp-block-menu[data-location="header"] > .menu > .menu-item > .sub-menu a:focus > .menu-item-icon {
    color: var(--wp--preset--color--base);
    background-color: var(--wp--preset--color--brand);
}

.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children.submenu--two-columns > .sub-menu {
    max-width: 37rem;
    width: 100vw;
    grid-template-columns: 1fr 1fr;
}

.wp-block-menu[data-location="header"] > .menu > .menu-item-has-children.submenu--two-columns > .sub-menu a {
    height: 100%;
}

.wp-block-menu[data-location="header"] .menu-item .menu-item-description {
    font-size: var(--wp--preset--font-size--x-small);
    font-weight: 400;
    display: block;
    color: var(--wp--preset--color--grey-dark);
    margin-top: 0.25rem;
}

/* Menu animations */

@keyframes submenu-reveal {
    from {
        transform: translateY(0.5rem);
        opacity: 0;
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}