/* ------------------------------------------------------------------
   hs-grid-auto — auto-fit grid utilities
   Collapses to one column when the grid is narrower than its track
   minimum. No media queries: min() handles it, per-container.
   ------------------------------------------------------------------ */

:root {
  --hs-grid-auto-min--200: 200px;
  --hs-grid-auto-min--300: 300px;
  --hs-grid-auto-min--400: 400px;
  --hs-grid-auto-min--500: 500px;
  --hs-grid-auto-min--600: 600px;

  --hs-grid-auto--200: repeat(auto-fit, minmax(min(var(--hs-grid-auto-min--200), 100%), 1fr));
  --hs-grid-auto--300: repeat(auto-fit, minmax(min(var(--hs-grid-auto-min--300), 100%), 1fr));
  --hs-grid-auto--400: repeat(auto-fit, minmax(min(var(--hs-grid-auto-min--400), 100%), 1fr));
  --hs-grid-auto--500: repeat(auto-fit, minmax(min(var(--hs-grid-auto-min--500), 100%), 1fr));
  --hs-grid-auto--600: repeat(auto-fit, minmax(min(var(--hs-grid-auto-min--600), 100%), 1fr));
}

.hs-grid-auto--200 { grid-template-columns: var(--hs-grid-auto--200); }
.hs-grid-auto--300 { grid-template-columns: var(--hs-grid-auto--300); }
.hs-grid-auto--400 { grid-template-columns: var(--hs-grid-auto--400); }
.hs-grid-auto--500 { grid-template-columns: var(--hs-grid-auto--500); }
.hs-grid-auto--600 { grid-template-columns: var(--hs-grid-auto--600); }