/**
 * LIBROS CON VIDA - Estilos personalizados HERO
 * SOLO PARA DESKTOP (video horizontal)
 * 
 * CONFIGURACIÓN ACTUAL:
 * - Posición: ABAJO IZQUIERDA
 * - Tamaño letra: 50px
 * - Ancho máximo: 33%
 * - Líneas: MUY JUNTAS (0.9)
 */

/* Importar Roboto de Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;500;700&family=Roboto:wght@300;400;500;700;900&family=Over+the+Rainbow&family=Caveat:wght@400;700&family=Permanent+Marker&family=Amatic+SC:wght@400;700&family=Rock+Salt&family=Libre+Baskerville:wght@400;700&family=Cinzel:wght@400;700;900&display=swap');

@media (min-width: 768px) {
    .hero-section .hero-texto-caja {
        
        /* OPCIÓN 1: Lexend - Moderna, muy legible */
        /* font-family: 'Lexend', sans-serif !important; */
        
        /* OPCIÓN 2: Roboto - Limpia y profesional */
        /*font-family: 'Roboto', sans-serif !important;*/
        
        /* OPCIÓN 3: Over the Rainbow - Divertida y manuscrita */
        /* font-family: 'Over the Rainbow', cursive !important; */
        
        /* OPCIÓN 4: Caveat - Manuscrita elegante */
        /* font-family: 'Caveat', cursive !important; */
        
        /* OPCIÓN 5: Permanent Marker - Marcador grueso */
        /* font-family: 'Permanent Marker', cursive !important; */
        
        /* OPCIÓN 6: Amatic SC - Manuscrita delicada */
        /* font-family: 'Amatic SC', cursive !important; */
        
        /* OPCIÓN 7: Rock Salt - Manuscrita rústica */
        /* font-family: 'Rock Salt', cursive !important; */
        
        /* OPCIÓN 8: Libre Baskerville - Elegante con serifas */
         font-family: 'Libre Baskerville', serif !important; 
        
        /* OPCIÓN 9: Cinzel - Clásica, mayúsculas elegantes */
        /* font-family: 'Cinzel', serif !important; */        
        
        
        
        
        
        
        
        
        
        
        /* FUENTE ROBOTO */
 
        
        
        /* Tamaño y ancho */
        /* font-size: 50px !important; */
        font-size: clamp(28px, 4vw, 40px) !important; /* ← Tamaño dinámico */
        /* font-size: clamp(35px, 4vw, 70px) !important;*/ /* ← Tamaño dinámico */
        max-width: 35% !important;
        width: 35% !important;
        opacity: 0.9 !important;
        text-shadow: 4px 4px 8px rgba(0, 0, 0, 0.9) !important;
        
        /* Posición - abajo izquierda */
        position: absolute !important;
        top: 30px !important;
        left: 30px !important;
        transform: none !important;
        bottom: auto !important;
        right: auto !important;
        
        /* JUNTAR LÍNEAS */
        line-height: 1.1 !important;
        margin: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    
    /* Eliminar espacios internos de cualquier elemento hijo */
    .hero-section .hero-texto-caja * {
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.1 !important;
    }
    
    /* Asegurar que el contenido también tenga líneas juntas */
    .hero-section .hero-texto-contenido {
        line-height: 1.1 !important;
        display: block !important;
    }
    
    /* Si hay párrafos dentro del texto */
    .hero-section .hero-texto-caja p,
    .hero-section .hero-texto-caja div,
    .hero-section .hero-texto-caja span {
        margin: 0 !important;
        padding: 0 !important;
        line-height: 1.1 !important;
    }
}