/* =====================================================================
   BRAND — the co-brand lockup   BRANDON RUIZ MARKETING × LB COMPUTER HELP
   Load this on EVERY page, before the page's own <style>.

   The mark is the LB monogram, redrawn as vector from /home/brandon/Pictures/1.jpg
   by measuring the artwork's pixels (stem 18u, foot 63×17u, B 75u wide, the
   bottom-left notch where the L's foot crosses the B's stem). It sits on its own
   navy chip because the source mark is white-on-navy — a white L cannot exist on
   a light header, so the field comes with it.

   Palette is sampled from that file, not guessed:
     field navy   #091926   (87% of the mark)
     steel blue   #1c3850   (the B)
     white        #ffffff   (the L, the wordmark)

   One note on fidelity: at 32px the source's B (#1c3850 on #091926, contrast
   1.47:1) disappears. The chip lifts it to #2E5A80 so the B is still legible at
   header size. Same hue family, same relationship — just enough separation to
   survive the size.
   ===================================================================== */

.lockup{
  display:inline-flex;align-items:center;gap:11px;
  text-decoration:none;color:var(--ink);line-height:1;
}
.lockup .mark{width:32px;height:32px;flex:none;display:block}

/* The two names carry equal weight — neither is the junior partner. */
.lockup .names{
  display:flex;align-items:baseline;
  font-family:var(--disp);font-weight:700;font-size:12.5px;
  letter-spacing:.085em;text-transform:uppercase;white-space:nowrap;
  color:var(--ink);
}

/* The join. A true multiplication sign (U+00D7) — not a letter x — set lighter
   and more muted than either name so it reads as "and", not as a third word. */
.lockup .x{
  font-family:var(--body);font-weight:400;font-size:12px;
  letter-spacing:0;color:var(--steel2);
  padding:0 .62em;transform:translateY(-.5px);
}

/* Under 760px the full lockup would wrap or crush the nav, so it contracts to
   the initials — which is exactly the domain: brmxlbch.com */
.lockup .abbr{display:none}
@media(max-width:760px){
  .lockup .full{display:none}
  .lockup .abbr{display:inline}
  .lockup{gap:9px}
  .lockup .mark{width:28px;height:28px}
}

/* On a navy ground (footers, dark panels) the names invert; the chip already
   carries its own field so it needs nothing. */
.lockup.on-dark .names{color:#fff}
.lockup.on-dark .x{color:var(--accent-dim)}

a.lockup:hover .names{color:var(--accent)}
a.lockup{transition:color .15s}

/* the same join, used in running footer text */
.fx{font-family:var(--body);font-weight:400;color:var(--steel2);padding:0 .1em}