.sr-only {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.max-reading {
  max-width: var(--container-reading);
}

.max-narrow {
  max-width: var(--container-narrow);
}

.mx-auto {
  margin-inline: auto;
}

.mt-4 {
  margin-top: var(--space-4);
}

.mt-6 {
  margin-top: var(--space-6);
}

.mt-8 {
  margin-top: var(--space-8);
}

.mt-10 {
  margin-top: var(--space-10);
}

.mb-0 {
  margin-bottom: 0;
}

.bg-alt {
  background: var(--color-bg-alt);
}

.bg-surface {
  background: var(--color-surface);
}

.color-primary {
  color: var(--color-primary);
}

.color-muted {
  color: var(--color-text-muted);
}

.color-soft {
  color: var(--color-text-soft);
}

.desktop-only {
  display: initial;
}

.mobile-only {
  display: none;
}

@media (max-width: 760px) {
  .desktop-only {
    display: none !important;
  }

  .mobile-only {
    display: initial;
  }
}