/* ==========================================================================
   RESPONSIVE CSS OPTIMIZADO PARA UNIDAD EDUCATIVA RAFAEL BUCHELI
   ========================================================================== */

/* === TABLETS (768px - 991px) === */
@media (min-width: 768px) and (max-width: 991px) {
    /* Ajustes generales */
    .ptb--120 { padding: 90px 0; }
    .pt--120 { padding-top: 90px; }
    .pb--120 { padding-bottom: 90px; }
    
    /* Header */
    .header-two {
        background: rgba(37, 40, 85, 0.95);
        padding: 10px 0;
    }
    .middle-logo { display: none !important; }
    
    /* Hero con video */
    .video-slide { min-height: 500px; }
    .hero-title { font-size: 48px !important; }
    .hero-subtitle.typing-premium { font-size: 32px !important; }
    .typing-container { 
        padding: 8px 20px !important;
        white-space: normal !important;
    }
    
    /* Stats cards */
    .hero-stats-card-3d { padding: 25px !important; }
    .stat-number-premium { font-size: 42px !important; }
    
    /* Eventos */
    .media-head { width: 120px; padding: 15px; }
    .media-head p { font-size: 36px; }
    .media-body { padding-left: 20px; }
    
    /* Convenios */
    .convenios-title { font-size: 60px; }
    .convenios-area { min-height: 350px; }
    
    /* Footer */
    .footer-top .widget { margin-bottom: 40px; }
}

/* === MÓVILES GRANDES (480px - 767px) === */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    /* Header */
    .header-two {
        background: rgba(37, 40, 85, 0.98);
        padding: 8px 0;
    }
    .logo img { max-width: 100px; }
    .header-bottom-right-style-2 .btn {
        padding: 6px 12px !important;
        font-size: 11px !important;
    }
    
    /* Hero */
    .video-slide { min-height: 550px; }
    .hero-title { 
        font-size: 36px !important; 
        line-height: 1.2 !important;
    }
    .hero-subtitle.typing-premium { 
        font-size: 24px !important;
        border-right: none !important;
        animation: none !important;
        white-space: normal !important;
    }
    
    /* Stats - 2 columnas en lugar de 3 */
    .stats-grid-premium {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px !important;
    }
    .stat-item-premium:last-child {
        grid-column: span 2 !important;
    }
    
    /* Botones */
    .hero-buttons-wrapper-premium {
        flex-direction: column !important;
        gap: 15px !important;
    }
    .hero-btn-3d {
        width: 100% !important;
        justify-content: center !important;
        padding: 15px 25px !important;
        font-size: 16px !important;
    }
    
    /* Carrusel de imágenes */
    .fullscreen-slide { min-height: 400px; }
    .slide-title { font-size: 42px !important; }
    .slide-subtitle { font-size: 14px !important; }
    
    /* Metodologías (tarjetas) */
    .teacher-area .card { margin-bottom: 30px; }
    .teacher-content .card-title a { font-size: 22px; }
    
    /* Eventos */
    .event-area .media {
        flex-direction: column;
        align-items: flex-start !important;
    }
    .media-head { 
        width: 100%; 
        text-align: left;
        padding: 15px 20px;
    }
    .media-body { 
        padding: 20px;
        width: 100%;
    }
    
    /* Convenios */
    .convenios-title { font-size: 48px; }
    .convenios-subtitle { font-size: 16px; }
    .convenios-area { min-height: 300px; }
    
    /* CTA */
    .cta-area { text-align: center; }
    .cta-content h2 { font-size: 28px; }
    .cta-btn { margin-top: 20px; text-align: center; }
    
    /* Footer */
    .widget { margin-bottom: 40px; }
    .footer-bottom { margin-top: 40px; }
}

/* === MÓVILES PEQUEÑOS (hasta 479px) === */
@media (min-width: 240px) and (max-width: 479px) {
    /* Header */
    .header-two {
        background: rgba(37, 40, 85, 1);
        padding: 5px 0;
    }
    .logo img { max-width: 80px; }
    .header-bottom-right-style-2 .btn {
        padding: 4px 8px !important;
        font-size: 9px !important;
    }
    .slicknav_btn { margin-top: -35px; }
    
    /* Hero */
    .video-slide { 
        min-height: 500px; 
        padding: 60px 0 20px;
    }
    .hero-title { 
        font-size: 28px !important; 
        line-height: 1.2 !important;
    }
    .hero-subtitle.typing-premium { 
        font-size: 20px !important;
    }
    .hero-description { 
        font-size: 14px !important; 
        padding: 0 10px !important;
    }
    
    /* Badge */
    .badge-premium {
        font-size: 10px !important;
        padding: 6px 15px !important;
        letter-spacing: 1px !important;
    }
    
    /* Stats - 1 columna */
    .stats-grid-premium {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }
    .stat-item-premium {
        width: 100% !important;
        padding: 15px !important;
    }
    .stat-number-premium { font-size: 36px !important; }
    .stat-label-premium { font-size: 12px !important; }
    
    /* Flip card */
    .flip-card-3d { 
        width: 240px !important; 
        height: 70px !important;
        margin: 20px auto !important;
    }
    .flip-card-front-premium,
    .flip-card-back-premium {
        font-size: 12px !important;
        padding: 10px !important;
    }
    
    /* Carrusel */
    .fullscreen-slide { min-height: 350px; }
    .slide-title { font-size: 32px !important; }
    .slide-description { font-size: 14px !important; }
    .fullscreen-carousel .owl-nav { display: none; }
    
    /* Sección de metodologías */
    .section-title-style2 h2 { font-size: 24px; line-height: 1.3; }
    .teacher-area .card { margin-bottom: 20px; }
    
    /* Eventos */
    .media-head span { font-size: 20px; }
    .media-head p { font-size: 36px; }
    .media-body h4 a { font-size: 18px; }
    
    /* Testimonios */
    .testimonial-content { padding: 30px 20px; }
    .testimonial-content h3 { font-size: 18px; }
    
    /* Convenios */
    .convenios-title { font-size: 36px; }
    .convenios-subtitle { font-size: 14px; }
    .convenios-area { min-height: 250px; }
    .convenios-btn { 
        padding: 10px 25px !important;
        font-size: 12px !important;
    }
    
    /* CTA */
    .cta-content h2 { font-size: 22px; }
    .cta-content p { font-size: 14px; }
    
    /* Footer */
    .fwidget-title { font-size: 18px; }
    .widget-company .address h6 { font-size: 15px; }
    .footer-bottom p { font-size: 11px; }
    .footer-bottom { margin-top: 20px; }
}

/* === AJUSTES PARA DISPOSITIVOS MUY PEQUEÑOS (hasta 360px) === */
@media (max-width: 360px) {
    .hero-title { font-size: 24px !important; }
    .hero-subtitle.typing-premium { font-size: 18px !important; }
    .badge-premium {
        font-size: 9px !important;
        padding: 4px 12px !important;
    }
    .stat-number-premium { font-size: 30px !important; }
    .slide-title { font-size: 28px !important; }
    .convenios-title { font-size: 30px; }
}