@layer components {
.page-hero-eyebrow .core-of {
  display: inline-block;
  margin-left: var(--space-3);
  padding: 1px 6px;
  border: 1px solid var(--border-strong);
  border-radius: 4px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.08em;
  white-space: nowrap;
  vertical-align: 1px;
  color: var(--text-muted);
}

@media (max-width: 1023px) {

  .page-hero-eyebrow .core-of {
    margin: 6px 0 0;
    font-size: 12px;
    letter-spacing: 0.1em;
  }
}
}