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

.state-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(18rem, 100%), 1fr));
  gap: var(--space-6);
}

.showcase-main {
  padding-block: var(--space-12) var(--space-20);
}

.showcase-intro {
  margin-bottom: var(--space-12);
}

.showcase-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-8);
}

.showcase-section {
  display: grid;
  gap: var(--space-6);
}

@media (min-width: 48rem) {
  .showcase-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .showcase-section-wide {
    grid-column: 1 / -1;
  }
}