/* The page title H1 sits in a full-width bar with zero horizontal
 * padding, so text touches the screen edges on narrow viewports. DXPR
 * also only offers two fixed font sizes (desktop/mobile breakpoint jump)
 * rather than continuous scaling -- and the "mobile" one (52px) is
 * actually bigger than desktop (40px), causing awkward wrapping. Add
 * breathing room and scale smoothly with clamp() instead. */
h1.page-title {
  font-size: clamp(1.75rem, 6vw, 2.5rem) !important;
}

@media (max-width: 768px) {
  h1.page-title {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
  }
}