.card-copy {
  background: linear-gradient(135deg, var(--glass-a), rgba(255, 255, 255, .68) 76%);
}

.product-card:hover .card-copy {
  background: linear-gradient(135deg, var(--glass-a), rgba(255, 255, 255, .84) 80%);
}

/* Cada fila conserva tarjetas idénticas; la foto nunca se estira ni se recorta. */
.products {
  grid-auto-rows: clamp(235px, 21vw, 270px);
}

.product-card,
.product-link {
  height: 100%;
  min-height: 0;
}

.card-image {
  min-height: 0;
  height: 100%;
  background: linear-gradient(145deg, var(--glass-a), rgba(255,255,255,.32));
}

.card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Ajustes de encuadre para los formatos verticales y cuadrados de cada ficha. */
.product-card:nth-child(1) .card-image img { object-position: 48% center; }
.product-card:nth-child(2) .card-image img { object-position: 46% center; }
.product-card:nth-child(3) .card-image img { object-position: center 42%; }
.product-card:nth-child(4) .card-image img { object-position: center 46%; }
.product-card:nth-child(5) .card-image img { object-position: center 48%; }
.product-card:nth-child(6) .card-image img { object-position: center 45%; }
.product-card:nth-child(7) .card-image img { object-position: center; }

/* Tarjetas de vidrio: sin color propio, dejan ver el fondo pastel desenfocado. */
.product-card,
.product-card:nth-child(n) {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .76);
  box-shadow: 0 14px 30px rgba(50, 66, 100, .12), inset 0 1px rgba(255,255,255,.6);
  backdrop-filter: blur(18px) saturate(125%);
}

.product-card:before {
  display: none;
}

.card-copy,
.product-card:hover .card-copy {
  background: rgba(255, 255, 255, .1);
  border-left-color: rgba(255, 255, 255, .58);
  box-shadow: -12px 0 30px rgba(66, 83, 116, .08);
  backdrop-filter: blur(16px) saturate(125%);
}

@media (max-width: 720px) {
  .products {
    grid-auto-rows: 200px;
  }

  .product-card,
  .product-link,
  .card-image,
  .card-copy {
    min-height: 0;
    height: 100%;
  }
}

.catalog-heading {
  padding: 8px 4px 2px;
}

.catalog-intro {
  max-width: 560px;
  margin: 11px 0 0;
  color: #40506a;
  font-size: 14px;
  line-height: 1.45;
}

.quick-steps > div {
  justify-content: center;
}

@media (max-width: 720px) {
  .catalog-heading {
    padding: 4px 1px 2px;
  }

  .catalog-intro {
    max-width: 310px;
    margin-top: 7px;
    font-size: 12px;
    line-height: 1.35;
  }

  .quick-steps > div {
    justify-content: stretch;
  }

  .benefits small {
    display: block;
    margin-top: 3px;
    padding: 0 3px;
    font-size: 8px;
    line-height: 1.15;
    white-space: normal;
  }

  .benefits > div {
    min-height: 64px;
  }
}