/* Index principal — compatibilidad móvil (después de index-neo.css) */

@media (max-width: 767px) {
    :root {
        --index-gutter-left: max(14px, env(safe-area-inset-left, 0px));
        --index-gutter-right: max(14px, env(safe-area-inset-right, 0px));
        --hero-tab-width: 40px;
    }

    body {
        padding-left: env(safe-area-inset-left, 0px);
        padding-right: env(safe-area-inset-right, 0px);
    }

    .menu-superior {
        padding-left: max(12px, env(safe-area-inset-left, 0px));
        padding-right: max(12px, env(safe-area-inset-right, 0px));
    }

    #swup.terxo-transition-main {
        overflow-x: clip;
        max-width: 100%;
    }

    .intro-contenedor {
        margin-top: calc(var(--header-height, 76px) + 12px);
        padding-left: var(--index-gutter-left);
        padding-right: var(--index-gutter-right);
    }

    .hero-sidebar-tab {
        width: var(--hero-tab-width) !important;
        min-width: var(--hero-tab-width) !important;
        min-height: 104px !important;
    }

    body.hero-sidebar-drawer-open .hero-sidebar-tab {
        right: calc(var(--hero-drawer-width) - var(--hero-tab-width)) !important;
    }

    .recent-phones-section {
        padding: 20px 0;
        margin: 16px 0;
        box-shadow: 4px 4px 0 var(--neo-ink);
    }

    .recent-phones-inner {
        padding-left: var(--index-gutter-left);
        padding-right: var(--index-gutter-right);
    }

    .recent-phones-section h2 {
        margin-bottom: 14px;
        font-size: clamp(1rem, 4.5vw, 1.35rem);
        line-height: 1.12;
        overflow-wrap: anywhere;
    }

    .recent-phones-grid {
        gap: 10px;
    }

    .recent-phone-card,
    .best-offers-grid .best-offer-card {
        height: auto;
        min-height: 248px;
        max-height: none;
        padding: 12px 8px 10px;
        touch-action: manipulation;
    }

    .recent-phone-image {
        width: 64px;
        min-height: 80px;
        max-height: 110px;
    }

    .phone-cp-label {
        font-size: 0.6rem;
    }

    .phone-cp-badge {
        font-size: 0.78rem;
        padding: 4px 8px;
        min-width: 40px;
    }

    .recent-phones-grid__cta .ver-novedades-btn,
    .filters-home-grid__cta .ver-novedades-btn {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        max-width: 100%;
        min-height: 48px;
        padding: 12px 16px;
        font-size: 0.88rem;
        text-align: center;
        box-sizing: border-box;
        touch-action: manipulation;
    }

    .filters-home-chips {
        flex-wrap: wrap;
        gap: 6px;
        justify-content: flex-start;
    }

    .filters-home-grid__panel {
        min-height: 80px;
    }

    .terxo-photo-section {
        margin-left: var(--index-gutter-left);
        margin-right: var(--index-gutter-right);
    }

    .social-section {
        padding-left: var(--index-gutter-left);
        padding-right: var(--index-gutter-right);
    }

    .ai-assistant-btn {
        right: max(12px, env(safe-area-inset-right, 0px));
        bottom: max(12px, env(safe-area-inset-bottom, 0px));
    }

    .ai-chat-panel {
        left: max(12px, env(safe-area-inset-left, 0px));
        right: max(12px, env(safe-area-inset-right, 0px));
        bottom: max(72px, calc(env(safe-area-inset-bottom, 0px) + 60px));
    }

    .site-footer-tab {
        padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
        padding-left: var(--index-gutter-left);
        padding-right: var(--index-gutter-right);
    }
}

@media (max-width: 380px) {
    .recent-phone-card,
    .best-offers-grid .best-offer-card {
        min-height: 232px;
    }

    .recent-phone-name {
        font-size: 0.66rem;
    }

    .hero-chip {
        font-size: clamp(0.42rem, 2.2vw, 0.5rem);
    }
}
