/* Shared small-screen navigation for all secondary pages.
   Desktop/tablet styles continue to come from style.css. */
@media (max-width: 600px) {
    *, *::before, *::after { box-sizing: border-box; }

    .header-flex {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        padding: 12px 12px 6px;
    }
    .header-flex > a {
        display: block;
        width: 100%;
        text-align: center;
    }
    .logo {
        display: block;
        width: 100%;
        max-width: 460px;
        height: auto;
        margin: 0 auto;
    }
    .nav-menu {
        width: 100%;
        text-align: center;
    }
    .nav-menu ul {
        justify-content: center;
        flex-wrap: wrap;
        gap: 4px 12px;
    }
    .nav-menu a {
        display: inline-block;
        padding: 10px 6px;
        font-size: clamp(0.8rem, 3.5vw, 1rem);
    }
}