/* local-redesign-v2/css/layout.css */
*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; font-family: var(--jem-font); color: var(--jem-navy); }

.jem-container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: clamp(24px, 4vw, 64px);
}

.jem-section {
  padding-block: var(--space-8);
}

.jem-section--cream { background: var(--jem-cream); }
.jem-section--mint { background: var(--jem-mint); }
.jem-section--white { background: var(--jem-surface); }

.jem-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-6);
  align-items: start;
}

.jem-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-5);
  align-items: stretch;
}

.jem-stack {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

@media (max-width: 1199px) {
  .jem-grid-3 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
  .jem-section { padding-block: 56px; }
  .jem-grid-2, .jem-grid-3 { grid-template-columns: 1fr; }
}