/* Utilities: single-purpose classes. Usable in a block's `class` field or in Markdown via markdown="1" HTML. */
@layer utilities {
  .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  .text-center { text-align: center; }
  .text-muted { color: var(--maw-text-muted); }
  .text-accent { color: var(--maw-accent); }
  .mx-auto { margin-inline: auto; }
  .mt-0 { margin-top: 0 !important; } .mt-4 { margin-top: var(--maw-space-4); } .mt-6 { margin-top: var(--maw-space-6); }
  .mb-0 { margin-bottom: 0 !important; } .mb-4 { margin-bottom: var(--maw-space-4); } .mb-6 { margin-bottom: var(--maw-space-6); }
  .pt-0 { padding-top: 0 !important; } .pb-0 { padding-bottom: 0 !important; }
  .stack > * + * { margin-top: var(--stack-gap, var(--maw-space-4)); }
  .flex { display: flex; } .flex-wrap { flex-wrap: wrap; } .items-center { align-items: center; } .gap-4 { gap: var(--maw-space-4); }
  .w-full { width: 100%; }
  .shadow { box-shadow: var(--maw-shadow); } .shadow-lg { box-shadow: var(--maw-shadow-lg); }
  .border { border: 1px solid var(--maw-border); }
  .hide-mobile { } @media (max-width: 640px) { .hide-mobile { display: none !important; } }

  /* Per-device visibility (block setting `hide_on`). Breakpoints: see tokens.css.
     The builder preview (html.maw-preview) keeps them visible and labels them instead, so they stay editable. */
  @media (max-width: 640px) { html:not(.maw-preview) .hide-on-mobile { display: none !important; } }
  @media (min-width: 641px) and (max-width: 960px) { html:not(.maw-preview) .hide-on-tablet { display: none !important; } }
  @media (min-width: 961px) { html:not(.maw-preview) .hide-on-desktop { display: none !important; } }
}