/* Estilos específicos para melhorar a responsividade do menu */
@media (max-width: 768px) {
    /* Ajuste para o menu em dispositivos móveis */
    nav {
        position: relative; /* Alterado de fixed para relative */
        top: auto;
        left: auto;
        width: 100%;
        z-index: 1000;
        background-color: white;
        box-shadow: var(--shadow);
    }
    
    nav ul {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0.5rem 0;
    }
    
    nav li {
        flex: 0 0 auto;
    }
    
    nav a {
        padding: 0.7rem 1rem;
        font-size: 0.9rem;
        white-space: nowrap;
    }
    
    /* Remover o padding-top do main já que o menu não é mais fixo */
    main {
        padding-top: 0;
    }
    
    .section {
        padding-top: 2rem;
    }
    
    /* Ajustar o header para não ser afetado pelo menu */
    header {
        margin-top: 0;
        padding-top: 0;
    }
}

@media (max-width: 480px) {
    nav a {
        padding: 0.6rem 0.8rem;
        font-size: 0.8rem;
    }
    
    .section h2 {
        font-size: 2rem;
        margin-top: 1rem;
    }
}