/* Rincones Naturales (/rincones-naturales/:categoria).
   Letrero de lona, tira de categorías y la rejilla de lugares. */

.rincones { padding-bottom: 40px; }

/* Categorías: chips con miniatura, enlaces reales. En móvil la tira se desliza
   (rincones.js centra la activa); desde 1100px caben todas y se acomodan en filas. */
.rincones-pestanas { margin-bottom: 34px; }
.rincones-pestanas .chips-deslizables { scrollbar-width: none; padding-bottom: 4px; }
.rincones-pestanas .chips-deslizables::-webkit-scrollbar { display: none; }
.rincones-pestanas .chip { min-height: 44px; }
@media (min-width: 1100px) {
  .rincones-pestanas .chips-deslizables { flex-wrap: wrap; overflow: visible; margin-inline: 0; padding-inline: 0; }
}

/* Cabeza de la categoría */
.rincones-cabeza { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 18px; }
.rincones-cabeza .tablero-titulo { font-size: clamp(32px, 3.4vw, 46px); }
.rincones-contador { font-family: var(--fuente); font-weight: 600; font-size: 17px; color: var(--acento-texto); font-variant-numeric: tabular-nums; }
.rincones-intro { margin-top: 10px; margin-bottom: 36px; max-width: 62ch; color: var(--tinta-suave); font-size: 18px; }

@media (max-width: 520px) {
  .rincones-pestanas { margin-bottom: 26px; }
  .rincones-intro { font-size: 17px; margin-bottom: 28px; }
}

/* En móvil la entrada general repite lo que dice la categoría: se deja solo el letrero y las pestañas */
@media (max-width: 600px) {
  .rincones .cabecera-entrada { display: none; }
}