/* ---- the copy comes back down a touch ---------------------------------- */
.at-hero{padding:168px 0 120px}

/* ---- the bar, while the hero is behind it -------------------------------
   The tokens are inverted on .mn, which is the only way to reach the items
   and the logo without listing every one of them. */
html.nav-over .mn.mn--atlaslight{
  --bar-bg:transparent;
  --bar-blur:none;
  --bar-line:transparent;
  --ink:#ffffff;
  --muted:rgba(255,255,255,.74);
  --faint:rgba(255,255,255,.55);
  --accent:#ffffff;
  --item-hover-bg:rgba(255,255,255,.12);
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border-bottom-color:transparent}

/* ...and straight back out again for the panel. Those tokens inherit, and the
   mega is a white sheet: left inverted, its headings and links would be white
   on white. Re-declaring the light values on the panel itself means the drop
   downs are pixel-identical to how they are now, open or closed. */
html.nav-over .mn .mn-mega,
html.nav-over .mn .mn-drawer{
  --ink:#000000;
  --muted:#000000;
  --faint:#000000;
  --accent:#000000;
  --item-hover-bg:rgba(16,20,28,.05);
  /* the tokens alone are not enough: the panel's links are `color:inherit`, so
     they were still taking the white the bar sets on .mn. Re-asserting colour
     here re-roots the whole inherit chain inside the panel. */
  color:var(--ink)}

/* The rule between the wordmark and "Expert Network" is a border-left on
   .mn-sub drawn in --bar-line, which is the same token as the bar's own bottom
   edge. Setting that token to transparent took the divider with it, so it gets
   its own colour rather than getting the token back. */
html.nav-over .mn .mn-sub{border-left-color:rgba(255,255,255,.34)}

/* the ghost button is painted crimson by an earlier patch, so over the navy it
   reads as a second solid button rather than a secondary one */
html.nav-over .mn .mn-btn.mn-btn--ghost{
  background:transparent;color:#ffffff;border-color:rgba(255,255,255,.42)}
html.nav-over .mn .mn-btn.mn-btn--ghost:hover{
  background:#ffffff;border-color:#ffffff;color:#0A1D33}

/* A white sheet hanging off a transparent bar reads as a panel floating in the
   picture. While a menu is open the bar takes its ground back, so the sheet has
   something to be attached to. */
html.nav-over.nav-menu-open .mn.mn--atlaslight{
  --bar-bg:#ffffff;
  --bar-line:rgba(0,0,0,.13);
  --ink:#000000;
  --muted:#000000;
  --faint:#000000;
  --accent:#000000;
  --item-hover-bg:rgba(16,20,28,.05);
  background:#ffffff;
  border-bottom-color:rgba(0,0,0,.13)}
html.nav-over.nav-menu-open .mn .mn-btn.mn-btn--ghost{
  background:var(--warm,#c8102e);color:#ffffff;border-color:var(--warm,#c8102e)}