/* ============================================================================
   CHROME BRIDGE
   Reconciles the real acquiry.com chrome with the article's own stylesheets.

   site-chrome.css is machine-extracted from the live site and must never be
   hand-edited, otherwise tools/sync_chrome.py would clobber the edits on the
   next sync. Everything needed to make that chrome work inside this page lives
   here instead.

   Load order: site-chrome.css -> chrome-bridge.css -> base.css -> ...
   ========================================================================== */

/* ---- resets the chrome assumes ---------------------------------------
   The live site sets these globally. The article sets a{color:var(--blue)}
   and keeps list markers, so without scoping the nav and footer would render
   as blue bulleted lists. Scoped to the chrome so article prose is untouched. */
.site-header ul,
.site-footer ul{list-style:none;margin:0;padding:0}
.site-header a,
.site-footer a{color:inherit;text-decoration:none}
.site-header a:hover,
.site-footer a:hover{text-decoration:none}
.site-header img,
.site-footer img{display:block;max-width:100%}
.site-footer p{margin:0}

/* h5 inherits Poppins 700 #0d1b2e from the live site's heading reset before
   .footer-heading recolours it. The article has no such reset, so the heading
   would fall back to body font. Restored here. */
.site-footer .footer-heading{font-family:'Poppins',sans-serif;line-height:1.2}

/* ---- container -------------------------------------------------------
   The site container is 1200px, the article wrap is 1240px. Both coexist:
   chrome sits at site width so it is pixel-identical to every other page. */
.site-header .container,
.site-footer .container{
  width:100%;max-width:1200px;margin:0 auto;padding:0 32px;
}

/* ---- CTA button ------------------------------------------------------
   .btn/.btn-primary/.btn-sm are global on the live site and used by both the
   header CTA and the footer deal-room button. */
.site-header .btn,
.site-footer .btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Rubik',sans-serif;font-size:.75rem;font-weight:500;
  letter-spacing:.12em;text-transform:uppercase;padding:14px 28px;
  border:1px solid transparent;border-radius:3px;cursor:pointer;
  transition:all .25s ease;
}
.site-header .btn-primary,
.site-footer .btn-primary{background:#086ad8;color:#fff;border-color:#086ad8}
.site-header .btn-primary:hover,
.site-footer .btn-primary:hover{background:#0757ae;border-color:#0757ae;color:#fff}
.site-header .btn-sm,
.site-footer .btn-sm{padding:10px 20px;font-size:.7rem;white-space:nowrap}

/* ---- fixed header offset ---------------------------------------------
   The old article header was position:sticky, so it occupied layout space and
   everything below simply followed it. The real header is position:fixed and is
   out of flow, so the first element on the page renders underneath it.

   Padding the body is the wrong fix: the hero is deliberately full-bleed and the
   transparent header is designed to float over its artwork. Body padding would
   put a blank strip above the hero and defeat the design.

   The offset therefore goes on the breaking bar, the one element above the hero,
   and it must be PADDING rather than margin. The real chrome has a hard design
   dependency: the top of the page must be dark, because the header is
   transparent until scrolled and its links are white. Margin would expose white
   page background behind the header and render the entire nav invisible.
   Padding extends the bar's own dark field up behind the header instead, so the
   nav reads white-on-dark exactly as it does on every other page.

   Measured, not guessed: 84px unscrolled, 68px scrolled. The unscrolled height
   is the one that matters, because the bar has scrolled out of view long before
   the header shrinks. --hdr-open is re-set from JS so a font or logo change
   cannot silently break the clearance. */
:root{--hdr-open:84px}
.brk{padding-top:var(--hdr-open)}

/* ---- disclaimer band --------------------------------------------------
   The disclaimer used to live inside the old dark footer. It is article
   content, not chrome, so it now sits in its own band above the footer and
   needs the dark treatment it previously inherited. */
.disc-band{background:var(--navy-deep);color:#fff}
.disc-band .disc{
  padding:34px 0;border-top:none;
  font-size:11.5px;line-height:1.65;color:rgba(255,255,255,.4);
}
.disc-band .disc b{color:rgba(255,255,255,.6);font-weight:600}

/* ---- mobile ----------------------------------------------------------
   The drawer is fixed and full height, so the page beneath must not scroll
   behind it. The live site relies on its own overlay; this adds scroll lock,
   which the live site omits. */
body.nav-open{overflow:hidden}

/* .primary-nav is parked offscreen with translateX(100%), so its box sits to the
   right of the viewport and counts toward document scroll width even while
   closed. On the live site body{overflow-x:hidden} masks this. The article
   asserts zero horizontal overflow at every breakpoint, so clip it properly
   rather than relying on the mask. The transition still runs, because the clip
   is released the moment .open is applied. */
@media (max-width:900px){
  .primary-nav:not(.open){clip-path:inset(0 0 0 100%);pointer-events:none}
}

@media (max-width:640px){
  .site-header .container,
  .site-footer .container{padding:0 20px}
}