.ccc-section {
  padding-block: var(--ccc-section-padding);
}

.ccc-section--cream {
  background-color: var(--ccc-cream);
}

.ccc-section--white {
  background-color: var(--ccc-warm-white);
}

.ccc-section--olive {
  background-color: var(--ccc-deep-olive);
  color: var(--ccc-warm-white);
}

.ccc-container {
  width: min(var(--ccc-content-width), calc(100% - (var(--ccc-container-gutter) * 2)));
  margin-inline: auto;
}

.ccc-container--wide {
  width: min(var(--ccc-wide-width), calc(100% - (var(--ccc-container-gutter) * 2)));
  margin-inline: auto;
}

.ccc-grid {
  display: grid;
  gap: var(--ccc-grid-gap);
}

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

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

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

.ccc-cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ccc-space-sm) var(--ccc-space-md);
}

.ccc-split {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: clamp(28px, 5vw, 80px);
  align-items: start;
}

.ccc-text-measure {
  max-width: var(--ccc-text-measure);
}