.highlight-box {
  border-radius: var(--radius-2xl);
  padding: var(--space-4xl);
}

.highlight-box--dark {
  background: var(--color-surface-dark);
  color: #fff;
}

.highlight-box--primary {
  background: var(--color-primary);
  color: #fff;
}

.highlight-box--accent {
  background: var(--color-accent);
  color: var(--color-surface-dark);
}

.highlight-box__lead {
  margin: 0;
  font-size: 15px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.7);
}

.highlight-box--accent .highlight-box__lead {
  color: rgba(28, 20, 17, 0.7);
}

.highlight-box__text {
  margin: 12px 0 0;
  font-size: clamp(19px, 1.9vw, 23px);
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: -0.4px;
}

.highlight-box__text .accent {
  color: var(--color-accent);
}