

.o-container {
  width: min(90vw, var(--measure));
  margin-left: auto;
  margin-right: auto;
}

.o-band { padding: var(--band-y) var(--band-x); }

.o-band--tight { padding: 4vh var(--band-x); }

.o-band--inverse {
  background: var(--surface-inverse);
  color: var(--ink-inverse);
}

.o-band--raised { background: var(--surface-raised); }


.o-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 1rem;
}

.o-row__col {
  flex: 1 1 calc(50% - 0.5rem);
  min-width: min(300px, 100%);
}

.o-row__col--narrow {
  flex: 1 1 calc(33% - 0.5rem);
  min-width: min(260px, 100%);
}

.o-stack > * + * { margin-top: var(--step-md); }

.o-stack--loose > * + * { margin-top: var(--step-lg); }

.o-lede {
  max-width: 62ch;
  color: var(--ink-secondary);
}

.o-headline {
  max-width: 34ch;
}
