/* responsive.css - Estilos para mejorar la experiencia en m¨®viles y pantallas grandes */

@media (max-width: 768px) {
    body {
        padding: 10px;
    }
    main {
        width: 100%;
    }
    h1 {
        font-size: 1.5rem;
    }
    button {
        width: 100%;
    }
}

@media (min-width: 1024px) {
    main {
        max-width: 900px;
    }
    h1 {
        font-size: 2.5rem;
    }
    button {
        width: auto;
    }
}