/* =========================================
   AJUSTES EXCLUSIVOS PARA CELULAR
   Todo vive dentro de media queries <= 767px,
   así que la vista de escritorio no se ve afectada.
   Se carga al final del <head> de cada página.
   ========================================= */

@media (max-width: 767px) {

    /* ── GLOBAL ── */
    /* El texto justificado deja huecos grandes en pantallas angostas */
    p {
        text-align: inherit;
    }

    iframe,
    video {
        max-width: 100%;
    }

    /* ── NAVBAR: el menú de escritorio nunca debe verse en celular ── */
    #site-header nav.hidden,
    #site-header a[href^="tel:"].hidden {
        display: none !important;
    }

    /* ── FOOTER (componente compartido): apilar columnas ── */
    footer#contacto .container > div[style*="grid-template-columns:1.7fr"] {
        grid-template-columns: 1fr 1fr !important;
        gap: 36px !important;
    }

    /* ── INICIO ── */
    .section-header h2 {
        font-size: 1.85rem;
        line-height: 1.2;
    }

    .section-header p {
        font-size: 1rem;
    }

    #inicio .hero-inner {
        padding-top: calc(76px + 1.25rem) !important;
        padding-bottom: 5rem !important;
    }

    .cta-banner {
        padding-bottom: 90px !important;
    }

    #galeria .gal-head {
        padding-top: 32px;
    }

    /* ── CATÁLOGO: textos de las fichas legibles en celular ── */
    #catalogo-cards .card-h3 {
        font-size: 1rem;
    }

    #catalogo-cards .card-p {
        font-size: 0.82rem;
        line-height: 1.45;
    }

    #catalogo-cards .card-area-chip,
    #catalogo-cards .card-kind-chip {
        font-size: 0.7rem;
    }

    #catalogo-cards .card-stat-item {
        font-size: 0.74rem;
    }

    #catalogo-cards .card-btn-details {
        font-size: 0.82rem;
        padding: 10px 14px;
    }

    #catalogo-cards .card-cat-badge,
    #catalogo-cards .card-plan-label {
        font-size: 0.66rem;
    }

    /* ── QUIÉNES SOMOS ── */
    /* min-height + aspect-ratio forzaban 587px de ancho */
    .qs-video-box {
        min-height: 0 !important;
    }

    .qs-policy-inner {
        padding: 0 20px !important;
    }
}

@media (max-width: 600px) {
    footer#contacto .container > div[style*="grid-template-columns:1.7fr"] {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 480px) {
    .qs-values-grid {
        grid-template-columns: 1fr !important;
    }
}