/* ============================================================
   REJILLA DE FICHAS DEL CATALOGO
   ============================================================

   Estas reglas estaban en un <style> dentro de templates/city/catalog.php,
   pero el bloque que maquetan -templates/partials/catalogo-propiedades.php-
   lo incluyen VARIAS vistas: ciudad, estado, alcaldia y colonia.

   Resultado: el marcado era compartido y su diseno no. La vista de estado
   pintaba las mismas fichas sin estas reglas, asi que cada tarjeta se
   estiraba a su contenido -una fila con la cuarta 31px mas alta que las
   otras- y el area de imagen pasaba de 200px a 320px. Es el mismo fallo que
   ya aparecio con el id "homes": lo comun vivia en una sola de las vistas.

   Movido tal cual, sin cambiar una sola declaracion. En la vista de ciudad se
   enlaza en el mismo punto del documento donde estaba el <style> -justo antes
   de homes.css-, para que la cascada quede exactamente igual que antes.

   Lo que consigue el conjunto: la rejilla fija el alto minimo de fila
   (minmax) y estira las celdas, el contenedor interno ocupa el 100% de la
   celda y el area de imagen es fija. Sin las tres cosas a la vez las
   tarjetas se descuadran, que es lo que se veia.                            */

/* Grid de cards del catálogo */
.catalog-cards-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  grid-auto-rows: minmax(460px, auto) !important;
  gap: 1.5rem !important;
  width: 100% !important;
  align-items: stretch !important;
}

@media (min-width: 48rem) {
  .catalog-cards-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (min-width: 72rem) {
  .catalog-cards-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }
}

/* Espaciado interno de cada card */
.catalog-cards-grid article {
  margin: 0 !important;
  padding: 0.75rem !important;
  width: 100% !important;
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Contenedor interno ocupa toda la altura */
.catalog-cards-grid article .catalog_item_container {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* Altura fija del área de imagen */
.catalog-cards-grid article .catalog_item_preview {
  height: 200px !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
}

.catalog-cards-grid article .catalog_item_preview a {
  display: block !important;
  height: 100% !important;
}

.catalog-cards-grid article .catalog_item_preview img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  padding: 0 !important;
}

/* El cuerpo de la card se estira parejo */
.catalog-cards-grid article .oh-flex.ui\:catalog-info {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}