/**
 * Breakpoints — Tailwind scale. Single source of truth for layout breakpoints.
 *
 *   sm   640px   small tablets / large phones landscape
 *   md   768px   tablets
 *   lg  1024px   small laptops / desktop layout kicks in here
 *   xl  1280px   large laptops
 *   2xl 1536px   wide desktops  (note: content container caps at 1360px wideSize)
 *
 * CSS @media queries cannot read custom properties, so the px values above
 * MUST be hardcoded in @media rules. Example:
 *
 *   @media (min-width: 1024px) {  // lg
 *     .lfbc-header-inner { ... }
 *   }
 *
 * Mirrored in theme.json → settings.custom.breakpoint.* for use in non-media
 * contexts (clamp, max-width, calc, etc.):
 *
 *   var(--wp--custom--breakpoint--sm)   640px
 *   var(--wp--custom--breakpoint--md)   768px
 *   var(--wp--custom--breakpoint--lg)  1024px
 *   var(--wp--custom--breakpoint--xl)  1280px
 *   var(--wp--custom--breakpoint--2xl) 1536px
 */