/* Sydak Living — grids (§4). El contenedor declara style="--cols: N".
   Tramos (breakpoints del contrato): base <640px · 640–1199px · >=1200px.
   Resultado: .c-tiles 6→3→2, 5→3→2, 3→3→1 · .c-grid 3→2→1, 2→2→1.
   Los divisores verticales de tile y su anulación por fila los pinta tiles.css. */

.c-grid,
.c-tiles {
  display: grid;
}

.c-grid > *,
.c-tiles > * {
  min-width: 0;
}

/* Cards (views, tarjetas ENTER): con aire. */
.c-grid {
  gap: var(--space-6);
  grid-template-columns: minmax(0, 1fr);
}

/* Tiles con divisor vertical: sin gap (el divisor ocupa la junta).
   En base: 2 col si el set es amplio (>=5), 1 col si es corto. */
.c-tiles {
  gap: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-columns: repeat(max(1, round(var(--cols, 3) / 3)), minmax(0, 1fr));
}

@media (min-width: 640px) {
  .c-grid {
    grid-template-columns: repeat(min(var(--cols, 3), 2), minmax(0, 1fr));
  }

  .c-tiles {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-columns: repeat(min(var(--cols, 3), 3), minmax(0, 1fr));
  }
}

@media (min-width: 1200px) {
  .c-grid,
  .c-tiles {
    grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr));
  }
}