@media (max-width: 600px) {
    .pantalla-inicio {
        padding: 28px 18px;
    }

    .inicio-examen-descripcion {
        margin-top: 28px;
    }

    .btn-iniciar-examen {
        margin-top: 32px;
        padding: 15px 20px;
    }

    .datos-inicio-examen {
        gap: 6px 8px;
    }
}

/* Pantalla de inicio */

@media (max-width: 700px) {

/* Título provisional */

.inicio-examen-titulo {
    font-size:28px;
}

/* Nombre o descripción del área */

.inicio-examen-descripcion {
    font-size: 20px;
}

/* Botón principal */

.btn-iniciar-examen {
    width: min(100%, 300px);
    margin-top: 16px;
    padding: 12px 16px;
    font-size: 20px;
}


/* Preguntas y duración */

.datos-inicio-examen {
    margin-top: 16px;
    font-size: 16px;
}

/* Estado de carga */

.txt-estado-carga {
    margin: 10px 0 0;
    font-size: 0.85rem;
}
}

@media (max-width: 700px) {
    .pantalla-examen {
        padding: 18px 14px 28px;
    }

    .head-examen {
        gap: 10px;

        padding: 14px 10px;
    }

    .head-examen-titulo {
        font-size: 0.90rem;
    }

    .head-examen-valor {
        font-size: 1.2rem;
    }

    .temporizador {
        font-size: 1.3rem;
    
    }

    .cont-estado-pregunta {
        min-height: 20px;
        margin: 14px 0;
    }

    .txt-estado-pregunta {
        font-size: 1.1rem;
    }

    .card-pregunta {
        padding: 12px 12px;
    }

    .card-tags {
        gap: 8px;
    }

    .tag-pregunta,
    .tag-materia {
        min-height: 30px;
        padding: 6px 11px;
        font-size: 0.8rem;
    }

    .cont-contenido-pregunta {
        margin-top: 16px;
    }

    .txt-pregunta {
        font-size: 0.90rem;
    }

    .cont-recurso-pregunta {
        margin-top: 16px;
    }

    .cont-opciones {
        gap: 10px;
        margin-top: 20px;
    }

    .opcion-pregunta {
        gap: 8px;
        padding: 12px;
    }

    .opcion-letra {
        flex-basis: 30px;

        width: 30px;
        height: 30px;
    }

    .opcion-contenido {
    font-size: 0.90rem;
}

.opcion-contenido-imagen {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 100%;
}

.opcion-imagen {
    display: block;
    width: auto;
    width: 60%;
    max-width: 250px;
    max-height: 180px;
    object-fit: contain;
}

.imagen-pregunta {
    display: block;
    width: auto;
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.cont-recurso-pregunta {
    width: 100%;
    margin: 16px auto 0;
}

.recurso-pequeno {
    width: 60%;
    max-width: 150px;
}

.recurso-mediano {
    width: 75%;
    max-width: 300px;
}

.recurso-grande {
    width: 90%;
    max-width: 699px;
}


    .foot-examen {
        flex-direction: column-reverse;
        gap: 16px;
    }

    .btn-salir-examen,
    .btn-siguiente-pregunta {
        width: 100%;
        max-width: 300px;
    }
}

@media (max-width: 600px) {
    .pantalla-resultados {
        padding: 22px 14px 32px;
    }

    .seccion-resultado-general,
    .seccion-resultados-materias,
    .seccion-curso {
        padding: 12px 12px;
    }

    .titulo-resultado-final {
    font-size: 20px;
}

    .datos-resultado-final {
        gap: 0;
        background-color: aqua;
    }

    .dato-resultado {
        padding: 0 10px;
    }

    .dato-resultado strong {
        font-size: 28px;
    }

    .dato-resultado span {
       
        font-size: 1rem;
    }

    .txt-evaluacion-final {
        font-size: 15px;
    }

    .seccion-resultados-materias h2 {

        font-size: 20px;

    }

    .txt-resultados-materias {
        font-size: .90rem;
    }

.cont-resultados-materias {

    margin-top: 10px;
}

.resultado-materia {
    /*
    display: grid;
    grid-template-columns:
        1fr ;
    align-items: center;
    gap: 5px;
*/
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .resultado-materia-head {
        align-items: flex-start;
    }

    .acciones-resultados {
        flex-direction: column;
    }

    .resultado-materia-nombre {
        font-size: 1rem;
        font-weight: 600;
    }

    .resultado-materia-valor {
    
    }

    .barra-materia {
        height: 8px;

    }

    .nombre-resultado-materia {
        width: 40%;
        font-size: .95rem;
        margin: 0;
    }

    .barra-resultado-materia {
        width: 50%;
        margin: 0;
        height: 8px;
    }

    .progreso-resultado-materia {
    
    }

    .aciertos-resultado-materia {
        font-size: 1.1rem;
        text-align: right;
    }

    .txt-curso {
        font-size: 17px;
    }

.btn-abrir-curso {
    padding: 12px 20px;
}

    .btn-volver-principal,
    .btn-reiniciar-examen {
    }

    .btn-volver-principal,
.btn-reiniciar-examen {
    min-width: 250px;

    padding: 12px 20px;

}

}

@media (max-width: 600px) {
    .modal {
        padding: 14px;
    }

    .modal-contenido {
        max-height: calc(100vh - 28px);
        padding: 16px;
    }

    .modal-salir-contenido h2 {
        font-size: 24px;
    }

    .modal-salir-contenido p {
        margin: 16px 0 0;
        line-height: 1.2;
    }

    .acciones-modal-salir {
        flex-direction: column;
    }

    .btn-continuar-examen,
    .btn-confirmar-salida {
        width: 100%;
        max-width: 250px;
    }

    .modal-curso-contenido h2 {
        font-size: 24px;
    }

    .btn-cerrar-curso {
        width: 100%;
        max-width: 200px;
    }
}

@media (max-width: 700px) {

    /*
    .resultado-materia {
        grid-template-columns:
            1fr
            auto;
        gap: 10px;
    }

    .barra-resultado-materia {
        grid-column:
            1 / -1;

        grid-row:
            2;
    }

    .aciertos-resultado-materia {
        grid-column:
            2;

        grid-row:
            1;
    }
    */

}