/* =============================================================
   EZ ONE Layout — Containers, Grid, Section Wrappers
   ============================================================= */

/* ── Containers ──────────────────────────────────────────────── */
.ez-container {
  width: min(100% - 2 * var(--ez-container-px), var(--ez-container-max));
  margin-inline: auto;
}
.ez-container--narrow {
  width: min(100% - 2 * var(--ez-container-px), var(--ez-container-narrow));
  margin-inline: auto;
}
.ez-container--wide {
  width: min(100% - 2 * var(--ez-container-px), var(--ez-container-wide));
  margin-inline: auto;
}

/* ── Section wrapper ─────────────────────────────────────────── */
.ez-section { padding-block: var(--ez-section-py); }
.ez-section--sm { padding-block: var(--ez-space-10); }

/* ── Grid ────────────────────────────────────────────────────── */
.ez-grid {
  display: grid;
  gap: var(--ez-space-md);
}

.ez-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ez-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ez-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Collapse to 1 col on mobile */
@media (max-width: 767px) {
  .ez-grid--2,
  .ez-grid--3,
  .ez-grid--4 { grid-template-columns: 1fr; }
}

/* 4-col collapses to 2 on tablet */
@media (min-width: 768px) and (max-width: 1023px) {
  .ez-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
