/* src/layout.css */
/* Layout utilities: container + 12-col grid. */

.container {
  width: 100%;
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-4);
  padding-right: var(--space-4);
}

@media (min-width: 576px) {
  .container {
    padding-left: var(--space-5);
    padding-right: var(--space-5);
  }
}
@media (min-width: 768px) {
  .container {
    padding-left: var(--space-6);
    padding-right: var(--space-6);
  }
}
@media (min-width: 992px) {
  .container {
    padding-left: var(--space-8);
    padding-right: var(--space-8);
  }
}

.grid-12 {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--space-4);
}