/* ============================================================================
   MODULE / GROUP PAGE HEADER — the visu-module-header band (issue #123 reopened)
   ----------------------------------------------------------------------------
   The eyebrow above a module or documentation group title was landing on the SAME
   LINE as the title, crammed against its left edge:

       🔧 ENGINEERING Engineering
       ────────────────────────

   rather than:

       🔧 ENGINEERING
       Engineering
       ────────────

   Both siblings were inline-level. .visu-module-eyebrow is inline-flex and
   .visu-module-title is inline-block, so they flowed together and the eyebrow's
   margin-bottom had nothing to push against. The title is inline-block on purpose —
   that is what makes its accent underline hug the heading text instead of running
   the full width of the column — so the eyebrow is the one to change.

   display:flex makes it block-level; width:fit-content stops it becoming a
   full-width strip, keeping it a label. align-items and gap keep working, so the
   icon still sits centred against the text.

   This affects Visibility University module pages and, since #123, documentation
   group pages — both render the same visu-module-header markup.

   Deliberately a standalone stylesheet rather than only a rule in the SCSS pipeline,
   for the same reason capabilities.css, admin-nav.css and hero-search.css are:
   compiling the pipeline needs Node, which not every dev machine has, and the
   committed customerportal.min.css is already several modules stale — a fix made
   only in Styles/modules/_visuniversity.scss would never reach a browser. The source
   there is updated to match anyway, so a future rebuild agrees with this file rather
   than fighting it.

   Loaded by both layouts after customerportal.min.css.
   ========================================================================= */

.visu-module-eyebrow {
    display: flex;
    width: fit-content;
}