/* imaginaryrepublic.com header — every page, the home page included (card 20261019-2012; @icarus HR1/HR2/WK1/WK2 header, jace OK 10/28).
   Self-contained: its own tokens, so the home page can load it without site.css's page styles. */
.irh{--gold:#e8c170;--cream:#efe2d2;--serif:"Cormorant Garamond",Georgia,serif;--sans:"Inter",system-ui,sans-serif}
/* the header: IR mark + Imaginary Republic · Work · Hire · Book a call (phone keeps only Book a call, HR2) */
.irh{width:100%;max-width:1280px;margin:0 auto;padding:28px 96px 0;display:flex;align-items:center;justify-content:space-between;gap:16px}
.irh .logo{display:flex;align-items:center;gap:12px;min-height:44px;text-decoration:none;color:var(--cream);font:400 22px var(--serif)}
.irh .logo b{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid rgba(232,193,112,.7);border-radius:6px;
  font:500 14px var(--serif);color:var(--gold)}
.irh .logo i{color:var(--gold)}
.irh nav{display:flex;align-items:center;gap:28px}
.irh nav a{font:500 15px var(--sans);color:var(--cream);text-decoration:none}
.irh nav a[aria-current="page"]{color:var(--gold)}
.irh nav a.pill{display:inline-flex;align-items:center;height:44px;padding:0 24px;border:1px solid rgba(232,193,112,.55);border-radius:28px;font-weight:600}
.irh nav a:hover,.irh nav a:focus-visible{color:var(--gold);outline:none}
.irh nav a.pill:hover,.irh nav a.pill:focus-visible{background:rgba(232,193,112,.12);color:var(--cream)}
@media (max-width:700px){ .irh{padding:20px 16px 0} .irh nav{gap:0} .irh nav a:not(.pill){display:none} .irh nav a.pill{padding:0 18px} }