/* ============================================================
   utilities.css — single-purpose helpers (not BEM components).
   Loaded near the end of the cascade.
   ============================================================ */

/* Text alignment (logical) */
.text-center { text-align: center; }
.text-start  { text-align: start; }
.text-end    { text-align: end; }

/* Text color */
.text-muted   { color: var(--color-text-muted); }
.text-primary { color: var(--color-primary); }
.text-accent  { color: var(--color-accent-deep); }

/* Font */
.font-heading { font-family: var(--font-heading); }

/* Max width / measure */
.measure       { max-inline-size: 65ch; }
.measure-wide  { max-inline-size: 80ch; }
.mx-auto       { margin-inline: auto; }

/* Margin block helpers */
.mbs-0  { margin-block-start: 0; }
.mbs-sm { margin-block-start: var(--space-sm); }
.mbs-md { margin-block-start: var(--space-md); }
.mbs-lg { margin-block-start: var(--space-lg); }
.mbs-xl { margin-block-start: var(--space-xl); }
.mbe-lg { margin-block-end: var(--space-lg); }
.mbe-xl { margin-block-end: var(--space-xl); }

/* Display */
.hidden        { display: none; }
.block         { display: block; }
.inline-block  { display: inline-block; }
.full-width    { inline-size: 100%; }

/* Visually hidden alias for clarity */
.sr-only {
  position: absolute;
  inline-size: 1px; block-size: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

/* Responsive show/hide */
@media (max-width: 639px) { .hide-mobile { display: none; } }
@media (min-width: 640px) { .show-mobile-only { display: none; } }