.view-search-productos .view-content{
  max-width: 76rem;
  margin: 2rem auto 2rem;
  padding: 1.5rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  row-gap: 2.25rem;
  align-items: center;
  justify-content: center;
}
@media(width > 36rem){
  .view-search-productos .view-content{
      grid-template-columns: repeat(2, 1fr);
  }

}
@media(width > 48rem){
  .view-search-productos .view-content{
      grid-template-columns: repeat(3, 1fr);
  }
}
@media(width > 64rem){
  .view-search-productos .view-content{
      grid-template-columns: repeat(4, 1fr);
  }
}
@media(width > 75rem){
  .view-search-productos .view-content{
      grid-template-columns: repeat(5, 1fr);
  }
}

.view-search-productos .view-content > .views-row{
  height: 100%;
}

/*
 * Views introduce varios wrappers entre el grid y la tarjeta.
 * Los quitamos del árbol de layout para que el article participe
 * directamente en el grid.
 */
.view-catalogue > .view-content > .views-row,
.view-catalogue > .view-content > .views-row > .views-field-rendered-entity,
.view-catalogue > .view-content > .views-row > .views-field-rendered-entity > .field-content {
    display: contents;
}

/*
 * Todas las filas implícitas del grid tienen la misma altura.
 */
@media (width > 28rem) {
    .view-catalogue > .view-content {
        grid-auto-rows: 1fr;
        align-items: stretch;
    }
}

/*
 * La tarjeta ocupa exactamente toda su celda.
 */
.view-catalogue > .view-content .commerce-product--treatment--teaser {
    width: 100%;
    height: 100%;
    min-width: 13.5rem;
    box-sizing: border-box;
}
