/**
 * Cache-busting complement for the mobile header controls.
 *
 * Kept as a separate static file so browsers with an old header.css cached
 * still receive the visible menu/close icons without query-string cache busting.
 */
.mobile-menu-toggle {
    position: relative;
    z-index: 3;
}

.mobile-menu-toggle:hover,
.mobile-menu-toggle:focus-visible {
    outline: 0;
}

.mobile-menu-toggle__icon {
    position: relative;
    display: inline-flex;
    width: 25px;
    height: 19px;
    align-items: center;
    justify-content: center;
}

.mobile-menu-toggle__icon::before {
    content: "";
    position: absolute;
    z-index: 2;
    left: 1px;
    right: 1px;
    top: 2px;
    height: 2px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow:
        0 7px 0 #ffffff,
        0 14px 0 #ffffff,
        0 0 10px rgba(0, 255, 234, 0.85);
}

.mobile-menu-toggle__icon::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: -8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(0, 255, 234, 0.14), transparent 64%);
    pointer-events: none;
}

.mobile-menu-toggle__icon i {
    opacity: 0;
}

.mobile-offcanvas-close {
    position: relative;
}

.mobile-offcanvas-close::before,
.mobile-offcanvas-close::after {
    content: "";
    position: absolute;
    width: 21px;
    height: 2px;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 0 12px rgba(0, 255, 234, 0.78);
}

.mobile-offcanvas-close::before {
    transform: rotate(45deg);
}

.mobile-offcanvas-close::after {
    transform: rotate(-45deg);
}

.mobile-offcanvas-close i {
    opacity: 0;
}

.mobile-offcanvas-close:hover,
.mobile-offcanvas-close:focus-visible {
    outline: 0;
}
