/* TABLET */
@media (max-width: 992px) {
    .header {
        padding: 14px 20px;
    }

    .header nav a {
        margin-left: 14px;
        font-size: 0.8rem;
    }

    .hero {
        padding: 0 6vw;
    }

    #visualizer {
        width: 90%;
    }

    .about-container,
    .contact-container {
        grid-template-columns: 1fr;
    }

    .about-img {
        max-width: 360px;
    }
}

/* MÓVIL */
@media (max-width: 640px) {
    .header {
        padding: 12px 16px;
    }

    .logo {
        font-size: 18px;
        letter-spacing: 3px;
    }

    .header nav a {
        margin-left: 10px;
        letter-spacing: 1px;
        font-size: 0.75rem;
    }

    .page-section {
        padding: 100px 7vw 60px;
    }

    .page-title {
        font-size: 1.6rem;
        letter-spacing: 4px;
    }

    .hero {
        padding: 0 5vw;
    }

    #visualizer {
        width: 95%;
        height: 90px;
        bottom: 10%;
    }

    .music-card,
    .event-card,
    .contact-form {
        padding: 18px;
    }
}