:root { --snap-nav-dot-color: #004787; }

/*!
 * Navigation states for the static snapshots (DEV-695 / E1).
 *
 * Emotion generates these two rules in the browser when the component renders
 * in its active state, so they exist in no stylesheet the crawl could fetch.
 * The declarations were read out of the live site's CSSOM and are reproduced
 * here under our own class names — emotion's hashes are build-scoped and would
 * not survive the next Gatsby build.
 */

/* The mobile menu, open. Live: nav swaps css-yhlpmi → css-192jjzd. */
.snap-nav-open {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  inset: 0;
  background-color: #fff;
  flex-grow: 1;
  z-index: 9999;
}
@media screen and (min-width: 824px) {
  .snap-nav-open {
    display: block;
    position: static;
  }
}

/* The current page in the icon rail. Live: css-2koqmf → css-191jx9o. */
.snap-nav-current {
  background-color: #fff;
}
/* The dots under the active icon. Their colour differs per brand — blue on
   gba-group.us, grey on guc-umwelt.de — so it comes from a property the build
   step sets; without one the site's own ::after colour is inherited. */
.snap-nav-current::after {
  display: inline-block;
  content: "...";
  position: absolute;
  bottom: -2px;
  left: 0;
  right: 0;
  text-align: center;
  color: var(--snap-nav-dot-color, inherit);
}