/* =====================================================================
   The brand's own header link — shared by the home page and the blog, the
   two pages that speak for all the power-ups rather than one. (The footer is
   the site's one footer: /css/site-footer.css.) Loads after
   /css/house.css (tokens, header).
   ===================================================================== */

/* ===== "Free Power-Ups" in the header =====
   The free row sits under four paid cards, a long scroll down on a phone, so
   the header points at it: a link with a green count, green because free is
   the one thing here that is not the page's blue. */
.nav-free { display: inline-flex; align-items: center; gap: 7px; }
.nav-free-n {
  display: inline-grid;
  place-items: center;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: var(--r-pill);
  background: var(--mint);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}

/* The JAP blocks beside the name. */
.header-logo .jap-mark { display: block; height: 28px; width: auto; flex-shrink: 0; }