/* M Jackson Consulting — shared upper-right navigation buttons (all pages) */
.mj-nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:12px;min-width:0;margin:0;padding:0}
.mj-nav .mj-nav-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  box-sizing:border-box;min-height:46px;margin:0;padding:0 clamp(16px,1.7vw,24px);
  font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size:clamp(13.5px,1.15vw,15px);font-weight:600;line-height:1.2;letter-spacing:.04em;
  color:#0B0A06;background:#E3B341;border:0;border-radius:6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(0,0,0,.14),0 8px 20px -10px rgba(227,179,65,.6);
  text-align:center;text-decoration:none;white-space:nowrap;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
  transition:background-color .18s ease,box-shadow .18s ease,transform .18s ease
}
.mj-nav .mj-nav-btn:hover,.mj-nav .mj-nav-btn:focus-visible{
  color:#0B0A06;background:#EDC75F;transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.38),inset 0 -1px 0 rgba(0,0,0,.14),0 12px 26px -10px rgba(227,179,65,.75)
}
.mj-nav .mj-nav-btn:active{color:#0B0A06;background:#D6A630;transform:none;box-shadow:inset 0 1px 2px rgba(0,0,0,.22)}
.mj-nav .mj-nav-btn:focus-visible{outline:2px solid #F0D79A;outline-offset:3px}
.mj-nav .mj-nav-btn span{display:inline-block;transition:transform .18s ease}
.mj-nav .mj-nav-btn:hover span{transform:translateX(3px)}
@media (hover:none){.mj-nav .mj-nav-btn:hover{transform:none}.mj-nav .mj-nav-btn:hover span{transform:none}}
@media (prefers-reduced-motion:reduce){.mj-nav .mj-nav-btn,.mj-nav .mj-nav-btn span{transition:none}.mj-nav .mj-nav-btn:hover,.mj-nav .mj-nav-btn:hover span{transform:none}}
/* tablets / landscape phones: tighten so the buttons stay on one line beside the logo */
@media (min-width:641px) and (max-width:900px){.mj-nav{gap:10px}.mj-nav .mj-nav-btn{padding:0 14px;letter-spacing:.02em}}
/* navs with long labels: when they cannot sit side by side, stack as equal-width buttons */
@media (min-width:641px) and (max-width:760px){.mj-nav--long{flex-direction:column;align-items:stretch;gap:8px}}
/* phones: buttons move to their own full-width row under the logo */
@media (max-width:640px){
  .mj-nav{flex:1 1 100%;gap:8px;justify-content:stretch}
  .mj-nav .mj-nav-btn{flex:1 1 auto;min-height:44px;padding:0 14px;font-size:13.5px;letter-spacing:.02em}
}
@media (max-width:359px){.mj-nav .mj-nav-btn{font-size:13px;padding:0 12px}}