/**
 * Minibanners 1:1 — escritorio 2×2 a ancho útil; cada tile ≥ +25% vs. fila de 4 cols; móvil 2×2 compacto.
 */

.minibanners-neumaticos {
    width: 100%;
    padding: 0.75rem 0 1.25rem;
}

.minibanners-neumaticos__inner {
    width: min(100%, 1200px);
    margin-inline: auto;
    padding-inline: clamp(0.75rem, 2.5vw, 1.5rem);
    --mb-gap: clamp(0.5rem, 1.2vw, 1rem);
    /* Ancho de un tile en el layout anterior (4 en una fila) */
    --mb-cell-ref: calc((100% - 3 * var(--mb-gap)) / 4);
    --mb-cell-min: calc(var(--mb-cell-ref) * 1.25);
}

.minibanners-neumaticos__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--mb-gap);
    align-items: stretch;
    width: 100%;
}

@media (min-width: 769px) {
    .minibanners-neumaticos__grid {
        /*
         * 2×2 a ancho completo: cada columna ~50% del contenedor
         * (≈2× el tile de la fila de 4), con piso = tile antiguo +25%.
         */
        grid-template-columns: repeat(2, minmax(var(--mb-cell-min), 1fr));
        justify-content: center;
    }
}

.minibanners-neumaticos__item {
    min-width: 0;
}

.minibanners-neumaticos__frame {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 0.375rem;
    background: #f4f6fb;
}

.minibanners-neumaticos__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.minibanners-neumaticos--bajo-resultados {
    padding-top: 0.5rem;
    padding-bottom: 1rem;
}

@media (max-width: 768px) {
    .minibanners-neumaticos {
        padding: 0.5rem 0 1rem;
    }

    .minibanners-neumaticos__inner {
        padding-inline: 0.625rem;
    }

    .minibanners-neumaticos__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.5rem;
        width: 100%;
    }

    .minibanners-neumaticos__frame {
        border-radius: 0.25rem;
    }
}