/* Navigation styles */
header:has(input:checked) {
    background-color: var(--pc-blue);
    ul {
        display: flex !important;
    }
    @media screen and (max-width: 781px) {
        .nav {
            font-size: 24px;
        }
    }
}

#menu-toggle-label {
    display: flex;
    flex-direction: column;
    gap: var(--zero-point-five-spacer);
    span {
        width: var(--three-spacer);
        height: 1px;
        background-color: var(--pc-black);
        transition: transform 0.2s ease;
    }
    &&[aria-expanded="true"] {
        span:nth-child(1) {
            transform: translateY(6px) rotate(15deg);
        }
        span:nth-child(2) {
            opacity: 0;
        }
        span:nth-child(3) {
            transform: translateY(-6px) rotate(-15deg);
        }
    }
}