/* Catálogo y listados por estilo: dos bloques con título — «Naturals» y «Mínima intervenció» (15-oct-2026).
   Los títulos son elementos de la cuadrícula (.vins-grid) que ocupan todas las columnas. En las páginas con filtros, un script oculta el título
   de un bloque cuando ninguno de sus vinos está visible. Misma paleta que las etiquetas de las tarjetas (--pop-natural / --pop-mi). */
.vins-grid > .cat-grup {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  margin: 4px 0 0;
}
.vins-grid > .cat-grup:not(:first-child) { margin-top: 36px; }
.cat-grup-t {
  display: inline-block;
  margin: 0;
  padding: 9px 18px 8px;
  font-family: var(--ff-cond, "Barlow Condensed", "Arial Narrow", sans-serif);
  font-size: clamp(22px, 2.5vw, 30px);
  font-weight: 900;
  line-height: 1;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: var(--pop-ink, #1A1710);
  background: var(--pop-natural, #B7CF9F);
  border: 2px solid var(--pop-ink, #1A1710);
  border-radius: 999px;
  box-shadow: 3px 3px 0 var(--pop-ink, #1A1710);
}
.cat-grup--mi .cat-grup-t { background: var(--pop-mi, #C3DADF); }
.cat-grup::after {                      /* filete que acompaña al título */
  content: "";
  flex: 1 1 60px;
  height: 2px;
  background: var(--pop-ink, #1A1710);
  opacity: .85;
}
.cat-grup-d {
  order: 3;                             /* la descripción baja a su propia línea, bajo el título */
  flex: 0 0 100%;
  margin: 2px 0 0;
  max-width: 780px;
  font-size: 15px;
  line-height: 1.55;
  color: rgba(26, 23, 16, .75);
}
.cat-grup-d a {
  font-weight: 700;
  color: var(--verd, #2B5425);
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}
.cat-grup::after { order: 2; }
@media (max-width: 600px) {
  .cat-grup-t { padding: 8px 14px 7px; box-shadow: 2px 2px 0 var(--pop-ink, #1A1710); }
  .vins-grid > .cat-grup:not(:first-child) { margin-top: 26px; }
  .cat-grup-d { font-size: 14px; }
}