/**
 * SML Grid Utilities — responsive
 */
.sl-grid { display: grid; gap: var(--sl-space-4); }
.sl-grid--2 { grid-template-columns: repeat(2, 1fr); }
.sl-grid--3 { grid-template-columns: repeat(3, 1fr); }
.sl-grid--4 { grid-template-columns: repeat(4, 1fr); }
.sl-grid--auto { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }

.sl-flex         { display: flex; }
.sl-flex--center { align-items: center; }
.sl-flex--between{ justify-content: space-between; }
.sl-flex--gap-sm { gap: var(--sl-space-2); }
.sl-flex--gap-md { gap: var(--sl-space-4); }
.sl-flex--wrap   { flex-wrap: wrap; }

@media (max-width: 1023px) {
  .sl-grid--4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .sl-grid--3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 540px) {
  .sl-grid--2,
  .sl-grid--3,
  .sl-grid--4 { grid-template-columns: 1fr; }
}