/**
 * Galería de imágenes de contenido — páginas industria.
 * 1 imagen: ancho completo · 2+: grid responsive.
 */
.industria-media {
    display: grid;
    gap: 1rem;
    width: 100%;
    margin-bottom: 1.5rem;
}

.industria-media__frame {
    overflow: hidden;
    border-radius: 0.5rem;
    height: 100%;
    min-height: 11rem;
}

.industria-media__frame img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.industria-media__item {
    margin: 0;
}

/* Una imagen: ocupa todo el ancho del contenido */
.industria-media--count-1 .industria-media__frame {
    aspect-ratio: 16 / 9;
}

@media (min-width: 992px) {
    .industria-media--count-1 .industria-media__frame {
        aspect-ratio: 21 / 9;
        min-height: 16rem;
    }
}

/* Dos imágenes: mitad y mitad */
.industria-media--count-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.industria-media--count-2 .industria-media__frame {
    aspect-ratio: 4 / 3;
}

/* Tres imágenes: destacada arriba + par abajo */
.industria-media--count-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.industria-media--count-3 .industria-media__item:first-child {
    grid-column: 1 / -1;
}

.industria-media--count-3 .industria-media__item:first-child .industria-media__frame {
    aspect-ratio: 21 / 9;
}

.industria-media--count-3 .industria-media__item:not(:first-child) .industria-media__frame {
    aspect-ratio: 4 / 3;
}

/* Cuatro o más: grid 2×N */
.industria-media--count-4,
.industria-media--count-many {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.industria-media--count-4 .industria-media__frame,
.industria-media--count-many .industria-media__frame {
    aspect-ratio: 4 / 3;
}

@media (max-width: 767.98px) {
    .industria-media--count-2,
    .industria-media--count-3,
    .industria-media--count-4,
    .industria-media--count-many {
        grid-template-columns: 1fr;
    }

    .industria-media--count-3 .industria-media__item:first-child {
        grid-column: auto;
    }

    .industria-media--count-1 .industria-media__frame {
        aspect-ratio: 16 / 10;
    }
}
