/**
 * Global, systematic desktop density fix — rather than editing individual
 * component templates one at a time (fragile, hard to reason about, and
 * conflicts with Hyva's own responsive classes), step the root font-size
 * down at each breakpoint tier the same way a Bootstrap container/breakpoint
 * scale works. Since almost all of Hyva's Tailwind utilities (text-*, p-*,
 * gap-*, w-*, etc.) are rem-based, this single change cascades everywhere
 * automatically — including Hyva's own explicit "grows at desktop" classes
 * like `md:text-3xl` — without touching per-component markup.
 *
 * Tailwind's own breakpoints (sm/md/lg/xl/2xl at 640/768/1024/1280/1536px)
 * are kept as the tier boundaries so this stays in sync with every other
 * `md:`/`lg:`/`xl:` utility class already in use across the theme.
 */
html { font-size: 16px; }

@media (min-width: 1024px) { html { font-size: 15px; } }
@media (min-width: 1280px) { html { font-size: 14px; } }