.app-shell {
  width: min(100% - (2 * var(--space-6)), 1120px);
  margin-inline: auto;
  padding-block: var(--space-10) var(--space-16);
}

.stack {
  display: grid;
  gap: var(--space-4);
}

.stack--lg {
  gap: var(--space-6);
}

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

.eyebrow {
  margin: 0;
  font-size: var(--text-meta);
  line-height: 1.333;
  font-weight: 650;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--color-text-muted);
}

.page-title,
.title-l,
.title-m {
  margin: 0;
  letter-spacing: -0.02em;
  color: var(--color-text-primary);
}

.page-title {
  font-size: var(--text-display);
  line-height: 1.2;
  font-weight: 700;
}

.title-l {
  font-size: var(--text-title-l);
  line-height: 1.266;
  font-weight: 650;
}

.title-m {
  font-size: var(--text-title-m);
  line-height: 1.333;
  font-weight: 650;
}

.lead {
  margin: 0;
  font-size: 1.125rem;
  line-height: 1.666;
  color: var(--color-text-secondary);
}

.copy-measure {
  max-width: 72ch;
}

.meta {
  margin: 0;
  font-size: var(--text-meta);
  line-height: 1.333;
  font-weight: 550;
  color: var(--color-text-muted);
}

@media (max-width: 768px) {
  .app-shell {
    width: min(100% - (2 * var(--space-4)), 1120px);
    padding-block: var(--space-8) var(--space-12);
  }
}