/* ============================================================
   FILBB 2026 – responsive.css
   Responsive: Tablet (≤900px) y Mobile (≤600px).
   ============================================================ */

/* ═══════════════════════════════════════════════════════════
   TABLET (≤ 900px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 900px) {

    /* Header: ocultar nav, mostrar hamburguesa */
    .filbb-header__nav   { display: none; }
    .filbb-header__cta   { display: none; }
    .filbb-nav-toggle    { display: flex; margin-left: auto; }

    /* Menú mobile desplegable */
    .filbb-header__nav.filbb-nav-open {
        display:    block;
        position:   fixed;
        top:        var(--header-h);
        left:       0;
        right:      0;
        bottom:     0;
        background: var(--filbb-oscuro);
        z-index:    var(--z-overlay);
        overflow-y: auto;
        padding:    var(--gap-lg) var(--contenedor-pad);
    }
    .filbb-nav-open .filbb-nav__lista {
        flex-direction: column;
        align-items:    flex-start;
        gap:            .25rem;
    }
    .filbb-nav-open .filbb-nav__lista li a {
        font-size: var(--text-md);
        padding:   .75rem var(--gap-sm);
        width:     100%;
        display:   block;
        border-bottom: 1px solid rgba(255,255,255,.08);
        color:     rgba(255,255,255,.9);
    }
    .filbb-nav-open .filbb-nav__lista li a:hover {
        background: rgba(255,255,255,.1);
    }
    .filbb-nav-open .sub-menu {
        position: static;
        display:  block;
        box-shadow:none;
        background: rgba(255,255,255,.05);
        border-radius: 0;
        padding:   .25rem 0 .25rem 1rem;
    }

    /* Cronograma: menos gap */
    .filbb-cronograma__dias { gap: var(--gap-md); }
    .filbb-cronograma__icono { width: 72px; height: 78px; }

    /* Galería: 2 fotos */
    .filbb-galeria__item { flex: 0 0 50%; }

    /* Niveles de aportes: 3 columnas */
    .filbb-aportes__niveles-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    /* Stats: 2 columnas */
    .filbb-aportes__stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    /* Impacto: 1 columna */
    .filbb-aportes__impacto-cols {
        grid-template-columns: 1fr;
        gap: var(--gap-md);
    }
    .filbb-aportes__impacto-item--destacado { top: 0; }

    /* CTA aportes home */
    .filbb-aportes-cta__inner { flex-wrap: wrap; }

    /* Footer: 1 columna */
    .filbb-footer__inner {
        grid-template-columns: 1fr;
        gap: var(--gap-lg);
        text-align: center;
    }
    .filbb-footer__contacto { align-items: center; }
    .filbb-footer__dato     { justify-content: center; }
    .filbb-footer__logo-trafkintu { justify-content: center; }

    /* Sistema de aportes CTA final */
    .filbb-aportes__cta-final-inner {
        flex-direction: column;
        gap: var(--gap-lg);
    }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE (≤ 600px)
   ═══════════════════════════════════════════════════════════ */
@media (max-width: 600px) {

    :root {
        --header-h:       64px;
        --contenedor-pad: 1rem;
    }

    /* Header más compacto */
    .filbb-header__logo .custom-logo { height: 44px; }

    /* Hero */
    .filbb-hero         { min-height: 340px; }
    .filbb-hero--con-imagen { min-height: 380px; }
    .filbb-hero__texto  { font-size: var(--text-base); }
    .filbb-hero__texto strong { font-size: var(--text-md); }

    /* Countdown */
    .filbb-countdown__titulo { font-size: var(--text-lg); letter-spacing: .1em; }
    .filbb-countdown__num    { font-size: var(--text-3xl); }
    .filbb-countdown__numeros { gap: var(--gap-sm); }
    .filbb-countdown__sep    { font-size: var(--text-xl); }
    .filbb-countdown__bloque { min-width: 58px; }

    /* Cronograma */
    .filbb-cronograma__titulo { font-size: var(--text-xl); }
    .filbb-cronograma__titulo::before,
    .filbb-cronograma__titulo::after { display: none; }
    .filbb-cronograma__dias  { gap: var(--gap-sm); }
    .filbb-cronograma__icono { width: 56px; height: 61px; }

    /* Galería: 1 foto */
    .filbb-galeria__item { flex: 0 0 80%; height: 220px; }

    /* Sponsors: más lento en mobile */
    .filbb-sponsors__logo { height: 44px; max-width: 130px; }

    /* CTA aportes: vertical */
    .filbb-aportes-cta__inner {
        flex-direction: column;
        text-align:     center;
        gap:            var(--gap-md);
    }
    .filbb-aportes-cta__icono { margin-inline: auto; }

    /* Ediciones: 1 columna */
    .filbb-ediciones__grid { grid-template-columns: 1fr; }

    /* Niveles: 1 columna */
    .filbb-aportes__niveles-grid { grid-template-columns: 1fr; }

    /* Stats: 2 columnas */
    .filbb-aportes__stats-grid { grid-template-columns: repeat(2, 1fr); }

    /* Cronograma header */
    .filbb-crono-header__inner { flex-direction: column; text-align: center; }
    .filbb-crono-header__titulo { font-size: var(--text-xl); }

    /* Pagina header */
    .filbb-pagina-header__titulo { font-size: var(--text-xl); }

    /* Entrada */
    .filbb-entrada__titulo { font-size: var(--text-xl); }
    .filbb-entrada__nav .nav-links { flex-direction: column; align-items: center; gap: var(--gap-sm); }

    /* 404 */
    .filbb-404__codigo { font-size: 5rem; }

    /* Aportes hero */
    .filbb-aportes__hero-inner { flex-direction: column; gap: var(--gap-md); text-align: center; }

    /* Sistema de aportes niveles en mobile: scroll horizontal */
    .filbb-aportes__niveles { overflow-x: auto; }
    .filbb-aportes__niveles-grid {
        grid-template-columns: repeat(5, minmax(160px, 1fr));
        width: max-content;
    }

    /* Crono nav en mobile */
    .filbb-crono-nav { flex-direction: column; align-items: center; }
}

/* ═══════════════════════════════════════════════════════════
   MOTION REDUCIDO (accesibilidad)
   ═══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
    .filbb-sponsors__track     { animation: none; }
    .filbb-galeria__foto       { transition: none; }
    .filbb-ediciones__foto     { transition: none; }
    .filbb-cronograma__link    { transition: none; }
    *, *::before, *::after     { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}