/* ============================================
   MVSJ — responsive.css: Media queries
   ============================================ */

/* ----------------------------------------
   TABLET LANDSCAPE (max 1024px)
   ---------------------------------------- */
@media (max-width: 1024px) {
    :root { --section-py: 4rem; --section-px: 1.5rem; }

    /* Navbar */
    .navbar__links, .navbar__cta { display: none; }
    .navbar__hamburger { display: flex; }
    .navbar__container {
        padding: 0 1.5rem;
        justify-content: space-between;
        gap: 1rem;
    }

    /* Home */
    .filiales-section__grid { grid-template-columns: repeat(2, 1fr); }
    .historia-section__grid { grid-template-columns: 1fr; gap: 2rem; }
    .historia-section__img-wrap { max-width: 500px; margin: 0 auto; }
    .traje-section__grid { grid-template-columns: 1fr; gap: 2rem; }
    .unete-mini__grid { grid-template-columns: 1fr; gap: 2rem; }
    .evento-card-dest { grid-template-columns: 1fr; }
    .evento-card-dest__img-col { min-height: 250px; }

    /* Footer */
    .footer__grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; }

    /* Stats */
    .stats-bar__grid { grid-template-columns: repeat(2, 1fr); }
    .stat-item + .stat-item::before { display: none; }

    /* Contacto / Únete */
    .contacto-section__grid, .unete-section__grid { grid-template-columns: 1fr; gap: 2rem; }

    /* Presidente */
    .presidente-card { grid-template-columns: 120px 1fr; gap: 1.5rem; }

    /* Traje section img */
    .traje-section__year-tag { font-size: 2rem; top: -14px; }
}

/* ----------------------------------------
   TABLET PORTRAIT (max 768px)
   ---------------------------------------- */
@media (max-width: 768px) {
    :root { --section-py: 3rem; --section-px: 1.25rem; }

    /* Navbar */
    .navbar { padding: 0.75rem 0; }
    .navbar__logo-text { font-size: 0.8rem; }
    .navbar__container { padding: 0 1.25rem; }

    /* Menú móvil interno */
    .navbar__mobile-inner { padding: 4.5rem 1.5rem 2.5rem; }
    .navbar__mobile-links > li > a { font-size: 1rem; padding: 0.75rem 1rem; }
    .navbar__mobile-toggle { font-size: 1rem; padding: 0.75rem 1rem; }

    /* Hero */
    .hero__title { font-size: clamp(2.5rem, 12vw, 4.5rem); }
    .hero__countdown { gap: 0.5rem; }
    .countdown__unit { min-width: 64px; padding: 0.5rem 0.875rem; }
    .countdown__number { font-size: 1.75rem; }
    .hero__ctas { flex-direction: column; align-items: center; }
    .hero__content { padding: 0 1.25rem; padding-top: 80px; }
    .hero { padding-bottom: 7rem; }

    /* Filiales */
    .filiales-section__grid { grid-template-columns: 1fr 1fr; }
    .filial-card { aspect-ratio: 2/3; }

    /* Stats */
    .stats-bar { padding: 2rem 1.25rem; }
    .stats-bar__grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }

    /* Galería */
    .galeria-section__grid {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
    }
    .galeria-item:nth-child(1) { grid-row: auto; }
    .galeria-item:nth-child(4) { grid-column: auto; }
    .galeria-masonry { column-count: 2; }

    /* Videos */
    .videos-grid { grid-template-columns: 1fr; }

    /* Eventos */
    .eventos-grid { grid-template-columns: 1fr; }

    /* Trajes */
    .trajes-timeline__track { flex-direction: column; min-width: auto; }
    .trajes-timeline__line { display: none; }
    .traje-node { width: 100%; min-width: auto; }
    .traje-detail__swiper { height: 350px; }

    /* Footer */
    .footer__grid { grid-template-columns: 1fr; gap: 2rem; }
    .footer__bottom-inner { flex-direction: column; text-align: center; gap: 0.5rem; }

    /* Presidentes */
    .presidente-card { grid-template-columns: 1fr; }
    .presidente-card__foto-wrap { max-width: 140px; margin: 0 auto; }

    /* Timeline */
    .timeline::before { left: 24px; }
    .timeline-item { grid-template-columns: 60px 1fr; }
    .timeline-item:nth-child(even) .timeline-item__content { grid-column: 2; }
    .timeline-item:nth-child(even) .timeline-item__dot { grid-column: 1; }
    .timeline-item:nth-child(even) .timeline-item__empty { display: none; }
    .timeline-item:nth-child(odd)  .timeline-item__empty { display: none; }
    .timeline-item:nth-child(odd)  .timeline-item__content { grid-column: 2; }
    .timeline-item__card { margin: 0 0 0 0.75rem; }

    /* Coordinadores */
    .coordinadores-grid { grid-template-columns: repeat(2, 1fr); }

    /* Form */
    .form-row { grid-template-columns: 1fr; }
    .unete-form { padding: 1.5rem; }

    /* Página hero */
    .page-hero { padding: 7rem 1.25rem 3rem; }

    /* Juramento */
    .juramento-text { font-size: 1rem; }
    .juramento-grito { font-size: 1.5rem; }

    /* Evento destacado */
    .evento-card-dest__content { padding: 2rem 1.5rem; }

    /* Tabla responsive */
    .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }

    /* Traje section */
    .traje-section__year-tag { font-size: 1.75rem; left: 1rem; }
    .traje-section__grid { gap: 3rem; }
}

/* ----------------------------------------
   MÓVIL (max 600px)
   ---------------------------------------- */
@media (max-width: 600px) {
    :root { --section-py: 2.75rem; --section-px: 1rem; }

    /* Navbar */
    .navbar__logo-text { display: none; }
    .navbar__logo { gap: 0.5rem; }
    .navbar__container { padding: 0 1rem; }

    /* Hero */
    .hero__content { padding: 0 1rem; padding-top: 70px; }
    .hero__subtitle { font-size: 1rem; }
    .hero__ctas .btn { width: 100%; justify-content: center; }
    .hero { padding-bottom: 7rem; }

    /* Stats */
    .stats-bar__grid { grid-template-columns: 1fr 1fr; gap: 1rem; }

    /* Galería home */
    .galeria-section__grid { grid-template-columns: 1fr 1fr; }

    /* Filiales */
    .filiales-section__grid { grid-template-columns: 1fr 1fr; }
    .filial-card { aspect-ratio: 3/4; }

    /* Footer */
    .footer__body { padding: 2rem 0; }
    .footer__bottom-inner { flex-direction: column; text-align: center; gap: 0.5rem; }
    .footer__credits { display: none; }
}

/* ----------------------------------------
   MÓVIL PEQUEÑO (max 480px)
   ---------------------------------------- */
@media (max-width: 480px) {
    :root { --section-py: 2.5rem; --section-px: 1rem; }

    /* Navbar */
    .navbar__logo-text { display: none; }
    .navbar__container { padding: 0 1rem; gap: 1rem; }

    /* Menú móvil */
    .navbar__mobile-inner { padding: 4rem 1.25rem 2rem; }
    .navbar__mobile-links > li > a { font-size: 0.95rem; }
    .navbar__mobile-toggle { font-size: 0.95rem; }

    /* Hero */
    .hero__tag { font-size: 0.7rem; }
    .hero__subtitle { font-size: 1rem; }
    .hero__countdown { justify-content: center; flex-wrap: wrap; gap: 0.5rem; }
    .countdown__unit { min-width: 56px; padding: 0.5rem 0.75rem; }
    .countdown__number { font-size: 1.5rem; }
    .hero__ctas { flex-direction: column; align-items: stretch; gap: 0.75rem; }
    .hero__ctas .btn { width: 100%; justify-content: center; }
    .hero { padding-bottom: 8rem; }

    /* Filiales */
    .filiales-section__grid { grid-template-columns: 1fr; }

    /* Stats */
    .stats-bar { padding: 1.5rem 1rem; }
    .stats-bar__grid { grid-template-columns: repeat(2, 1fr); gap: 1rem; }
    .stat-item__number { font-size: 2rem; }

    /* Historia imagen */
    .historia-section__badge { bottom: -12px; right: -8px; padding: 0.75rem 1rem; }
    .historia-section__badge-year { font-size: 1.5rem; }

    /* Galería */
    .galeria-section__grid { grid-template-columns: 1fr; grid-template-rows: auto; }
    .galeria-masonry { column-count: 1; }

    /* WhatsApp tooltip */
    .wa-float__tooltip { display: none; }

    /* Music player label */
    .music-player__label { display: none; }

    /* Music player position */
    .music-player { bottom: 16px; right: 16px; }
    .wa-float { bottom: 16px; left: 16px; }

    /* Footer */
    .footer__social { justify-content: center; }
    .footer__bottom-inner { flex-direction: column; text-align: center; gap: 0.5rem; }

    /* Coordinadores */
    .coordinadores-grid { grid-template-columns: 1fr; }

    /* Video */
    .play-btn { width: 60px; height: 60px; }

    /* Botones */
    .btn--xl { padding: 1rem 2rem; font-size: 1rem; }

    /* Traje */
    .traje-section__year-tag { font-size: 1.5rem; }
    .traje-section__colors { gap: 0.5rem; }

    /* Evento card */
    .evento-card-dest__content { padding: 1.5rem 1rem; }
    .evento-countdown { gap: 0.5rem; }

    /* Página hero */
    .page-hero { padding: 6rem 1rem 2.5rem; }

    /* Section header */
    .section-header { margin-bottom: 2rem; }

    /* Breadcrumb */
    .breadcrumb { flex-wrap: wrap; justify-content: center; }

    /* Terms modal */
    .terms-modal__content { padding: 1.75rem 1.25rem; }
}

/* ----------------------------------------
   MÓVIL MUY PEQUEÑO (max 360px)
   ---------------------------------------- */
@media (max-width: 360px) {
    :root { --section-px: 0.875rem; }

    .navbar__container { padding: 0 0.875rem; }
    .navbar__mobile-inner { padding: 3.5rem 1rem 2rem; }

    .hero__title { font-size: clamp(2rem, 14vw, 3rem); }
    .countdown__unit { min-width: 48px; padding: 0.4rem 0.5rem; }
    .countdown__number { font-size: 1.25rem; }

    .stats-bar__grid { grid-template-columns: 1fr 1fr; }
    .stat-item__number { font-size: 1.75rem; }

    .btn--xl { padding: 0.875rem 1.5rem; font-size: 0.95rem; }
}

/* ----------------------------------------
   ACCESIBILIDAD / MOTION
   ---------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .reveal { opacity: 1; transform: none; filter: none; }
    .loader-pulse { animation: none; }
}

/* ----------------------------------------
   PRINT
   ---------------------------------------- */
@media print {
    .navbar, .footer, .wa-float, .music-player, .terms-modal, .page-loader { display: none !important; }
    body { background: white; color: black; }
    a { color: black; }
}