@layer hpds-utilities {
  .hpds-sr-only { block-size: 1px; clip: rect(0, 0, 0, 0); clip-path: inset(50%); inline-size: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; white-space: nowrap; }
  .hpds-text-start { text-align: start; }
  .hpds-text-center { text-align: center; }
  .hpds-text-end { text-align: end; }
  .hpds-text-muted { color: var(--hpds-color-text-muted); }
  .hpds-text-accent { color: var(--hpds-color-accent); }
  .hpds-full-width { inline-size: 100%; }
  .hpds-max-prose { max-inline-size: 42rem; }
  .hpds-mx-auto { margin-inline: auto; }
  .hpds-overflow-hidden { overflow: hidden; }
  .hpds-position-relative { position: relative; }
  .hpds-hide { display: none; }
  .hpds-gap-2 { gap: var(--hpds-space-2); }
  .hpds-gap-3 { gap: var(--hpds-space-3); }
  .hpds-gap-4 { gap: var(--hpds-space-4); }
  .hpds-gap-5 { gap: var(--hpds-space-5); }
  .hpds-gap-6 { gap: var(--hpds-space-6); }
  .hpds-mt-0 { margin-block-start: 0; }
  .hpds-mt-4 { margin-block-start: var(--hpds-space-4); }
  .hpds-mt-6 { margin-block-start: var(--hpds-space-6); }
  .hpds-mb-0 { margin-block-end: 0; }
  .hpds-mb-4 { margin-block-end: var(--hpds-space-4); }
  .hpds-mb-6 { margin-block-end: var(--hpds-space-6); }

  @media (max-width: 767px) {
    .hpds-hide-mobile { display: none; }
  }

  @media (min-width: 768px) {
    .hpds-show-mobile { display: none; }
  }
}