.site-menu {
    position: relative;
    flex: 0 0 auto;
}

.site-menu .menu-toggle,
.site-menu .menu-toggle-label {
    display: none;
}

.site-menu .topline-links {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

.site-menu .topline-links a {
    color: #d4e6f4;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
}

.site-menu .topline-links a:hover,
.site-menu .topline-links a:focus-visible {
    color: #fff;
    text-decoration: underline;
}

@media (max-width: 700px) {
    .site-menu .menu-toggle {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        clip-path: inset(50%);
    }

    .site-menu .menu-toggle-label {
        display: inline-flex;
        min-height: 42px;
        align-items: center;
        justify-content: center;
        gap: 8px;
        padding: 0 12px;
        border: 1px solid #81a9c9;
        color: #fff;
        font-size: 13px;
        font-weight: 600;
        cursor: pointer;
    }

    .site-menu .menu-toggle:focus-visible + .menu-toggle-label {
        outline: 2px solid #fff;
        outline-offset: 2px;
    }

    .site-menu .menu-icon {
        position: relative;
        width: 16px;
        height: 12px;
        border-top: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
    }

    .site-menu .menu-icon::after {
        position: absolute;
        top: 3px;
        left: 0;
        width: 100%;
        border-top: 2px solid currentColor;
        content: "";
    }

    .site-menu .topline-links {
        position: absolute;
        z-index: 20;
        top: calc(100% + 8px);
        right: 0;
        display: none;
        min-width: min(240px, calc(100vw - 28px));
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 0;
        padding: 6px;
        border: 1px solid #41637e;
        background: #173b59;
        box-shadow: 0 8px 20px rgb(0 0 0 / 22%);
    }

    .site-menu .menu-toggle:checked ~ .topline-links {
        display: flex;
    }

    .site-menu .topline-links a {
        display: flex;
        min-height: 44px;
        align-items: center;
        padding: 0 12px;
        border-bottom: 1px solid #345570;
        white-space: nowrap;
    }

    .site-menu .topline-links a:last-child {
        border-bottom: 0;
    }

    .site-menu .topline-links a:hover,
    .site-menu .topline-links a:focus-visible {
        background: #245171;
        text-decoration: none;
    }
}