/* Estilos específicos para dispositivos móviles */
@media (max-width: 768px) {
    /* Estilos generales */
    body {
        overflow-x: hidden;
    }
    
    /* Mejoras para títulos */
    h1, h2, h3, .display-4 {
        font-size: 1.8rem !important;
        line-height: 1.3 !important;
        white-space: normal !important;
        word-wrap: break-word !important;
        hyphens: auto !important;
    }
    
    /* Mejoras para botones */
    .btn {
        white-space: normal !important;
        line-height: 1.5 !important;
        font-size: 1.1rem !important;
        padding: 10px 15px !important;
        width: 100%;
        max-width: 300px;
    }
    
    /* Mejoras para menús */
    .navbar {
        padding: 10px 0 !important;
    }
    
    .navbar-toggler {
        position: fixed !important;
        top: 0 !important;
        right: 15px !important;
        z-index: 1050 !important;
        background-color: rgba(255, 255, 255, 0.9) !important;
        border: 1px solid #143554 !important;
        padding: 3px 6px !important;
        margin-top: 0 !important;
    }
    
    #navbarNav {
        position: absolute;
        top: 80px;
        left: 0;
        right: 0;
        padding: 10px;
        box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        background-color: rgba(255, 255, 255, 0.95) !important;
        z-index: 1000 !important;
        border-bottom: 2px solid #143554;
    }
    
    .navbar-nav .nav-link {
        white-space: normal !important;
        padding: 8px 15px !important;
        color: #143554 !important;
        font-weight: 600 !important;
    }
    
    /* Ocultar bolitas naranja en móvil */
    .hero-section img[src*="bolitas"] {
        display: none !important;
    }
    
    /* Ajustes para imágenes laterales */
    img[src*="flecha_der1"], img[src*="flecha_izq1"] {
        max-width: 35px !important;
        height: auto !important;
        opacity: 0.8 !important;
    }
    
    /* Ajustes específicos para impulsa-tu-futuro.html */
    .impulsa-tu-futuro img[src*="flecha_izq1"] {
        max-width: 35px !important;
        height: auto !important;
    }
    
    /* Mejoras para badges y elementos de cursos */
    .badge {
        white-space: normal !important;
        line-height: 1.3 !important;
        font-size: 0.8rem !important;
        padding: 4px !important;
        max-width: 100% !important;
    }
    
    /* Ajustes específicos para badges de fechas */
    .badge.bg-white.text-primary {
        font-size: 0.75rem !important;
        padding: 3px !important;
        line-height: 1.2 !important;
        margin-bottom: 5px !important;
    }
    
    /* Ajustes específicos para botones en móvil */
    .btn-lg, .btn-xl {
        font-size: 1rem !important;
        padding: 8px 12px !important;
        white-space: normal !important;
    }
    
    /* Ajuste para títulos en móvil */
    [style*="white-space: nowrap"] {
        white-space: normal !important;
    }
    
    /* Ocultar elementos decorativos en móvil */
    .d-none.d-md-block {
        display: none !important;
    }
    
    /* Ajustes para recuadros de próxima convocatoria */
    .badge.bg-white.text-primary {
        font-size: 0.85rem !important;
        padding: 3px 5px !important;
        line-height: 1.3 !important;
    }
    
    /* Ajustes para contenedores de cursos */
    [style*="border: 4px solid #e55302"] {
        padding: 10px !important;
    }
    
    /* Forzar saltos de línea en textos largos */
    .navbar-brand span, .fw-bold, .fs-2, .fs-3, .fs-4, .fs-5 {
        white-space: normal !important;
    }
}