/**
 * ─── Rejilla de proyectos de la portada (bloque 06) ───────────────────────────
 *
 * Uniforma la proporción de las tarjetas del `wgl-portfolio`.
 *
 * ── Por qué hace falta desde el 2026-08-18 ───────────────────────────────────
 *
 * Los widgets WGL no piden un tamaño registrado de WordPress: le pasan medidas a
 * `aq_resize()`, que recortaba al vuelo desde el disco Y CON UPSCALE. Todas las
 * fotos salían a 860×1200 aunque el original no diera para tanto.
 *
 * Con los medios en S3 ya no hay archivo local que recortar, y WordPress —que sí
 * genera el tamaño `pt-portfolio`— NO hace upscale: de un original de 1100×734
 * saca 860×734, no 860×1200. Medido en los 10 proyectos reales: solo 2 de 10
 * llegan a 1200 de alto (Cartier 1200×1200 y Creppes 1067×1600); el resto se
 * queda entre 666 y 961, y Home Burger (800×450) ni siquiera alcanza los 860 de
 * ancho. Resultado: cada tarjeta con su proporción y la rejilla descuadrada.
 *
 * ── Por qué CSS y no forzar el recorte ───────────────────────────────────────
 *
 * Es el mismo criterio que ya tomó el proyecto con las tarjetas de familia: «Nada
 * de recortar las 7 fotos a 420×580. La proporción vertical se consigue con
 * aspect-ratio + object-fit: cover, mismo resultado visual que recortarlas, sin
 * una segunda compresión WebP encima». Aquí además el upscale degradaría de
 * verdad la imagen: ampliar 734 px a 1200 es un 1,63×.
 *
 * El tamaño registrado `pt-portfolio` SE MANTIENE aunque no cuadre la altura,
 * porque acota el ancho a 860 px y evita mandar originales de 1440 o 1600 px.
 * Ojo: eso NO ha bajado el peso del bloque —medido, 450 KB antes y 509 KB
 * después—, porque los dos recortes que sí llegan a 1200 de alto pesan más que
 * el original que se servía antes. La ganancia aquí es de geometría, no de KB;
 * el peso se trabajará con los `sizes`/`srcset`, que este widget no emite.
 *
 * Doble ámbito con :is() igual que familias.css — por el id del bloque en la
 * portada y por una clase, para cuando esta rejilla se use en otra página.
 */

:is(.elementor-element-148c174, .pt-portfolio-grid) .wgl-portfolio .item__image-wrap {
	position: relative;
	aspect-ratio: 860 / 1200;
	overflow: hidden;
	background-color: #1a1a1a;   /* mientras carga, y para el letterboxing de fotos muy anchas */
}

:is(.elementor-element-148c174, .pt-portfolio-grid) .wgl-portfolio .item__image-wrap > img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	display: block;
}

/**
 * En móvil la rejilla cae a 1 columna y una tarjeta de 860/1200 ocupa casi toda
 * la pantalla, así que el bloque se vuelve larguísimo. Se ensancha la proporción
 * para que quepan varias de un vistazo.
 */
@media (max-width: 767px) {
	:is(.elementor-element-148c174, .pt-portfolio-grid) .wgl-portfolio .item__image-wrap {
		aspect-ratio: 4 / 3;
	}
}
