/* layout.css — section/grid primitives. Depends on variables.css. */
.wrap {
  max-width: var(--max-width);
  margin-inline: auto;
  padding-inline: var(--space-4);
}
.section {
  padding-block: var(--space-7);
  border-bottom: var(--border-hairline);
}
.section--tight { padding-block: var(--space-5); }
.grid {
  display: grid;
  gap: var(--space-4);
}
.grid--services {
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
}
.stack { display: flex; flex-direction: column; gap: var(--space-3); }
.cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
@media (min-width: 60rem) {
  .split { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: var(--space-6); align-items: start; }
}
