/* First-screen navigation must never be hidden by a legacy entrance fade. */
.navbar.rc-site-navigation { opacity: 1 !important; }

@media (min-width: 992px) {
  html body .navbar.rc-site-navigation .nav-links .nav-dropdown:is(.is-open, :focus-within) .dropdown-content .dropdown-link:is(:hover, :focus-visible) {
    background: #e8e8e8 !important;
    color: #171717 !important;
  }
}

/* ========================================================================== 
   realclean – gemeinsame Navigation auf Startseite und allen Unterseiten

   Diese Datei ist bewusst nur auf .rc-site-navigation begrenzt. So kann die
   gemeinsame Navigation auch in den älteren Detailseiten verwendet werden,
   ohne deren Inhaltslayout oder Formulare umzustylen.
   ========================================================================== */

@font-face {
  font-family: "BDO Grotesk";
  src: url("../assets/fonts/local/display-variable.ttf") format("truetype");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "DM Mono";
  src: url("../assets/fonts/local/mono-medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

html.rc-navigation-injected .framer-1ee6a7l-container:not(.rc-chrome-nav) {
  display: none !important;
}

.rc-chrome-nav {
  z-index: 1000 !important;
  width: 100%;
  height: auto !important;
  min-height: 0 !important;
  position: fixed !important;
  inset: 0 0 auto;
  overflow: visible !important;
}

.rc-chrome-nav .rc-site-navigation {
  width: 100%;
  position: static;
}

.rc-site-navigation,
.rc-site-navigation *,
.rc-site-navigation *::before,
.rc-site-navigation *::after {
  box-sizing: border-box;
}

.rc-site-navigation {
  --_color---color-dark: #fff;
  --_color---color-white: #171717;
  --_color---color-white-border: #17171724;
  --_color---color-white-15: #1717170f;
  --_color---color-brand: #049ce4;
  --_typography---type-font-body: "BDO Grotesk", Arial, sans-serif;
  --_typography---type-font-badges: "DM Mono", "Trebuchet MS", sans-serif;
  --_typography---type-base-unit: 15px;
  --_typography---type-scale-factor: 1.26;
  --_typography---type-body-size: var(--_typography---type-base-unit);
  --_typography---type-body-line-height: 1.5em;
  --_typography---type-lead-size: calc(var(--_typography---type-base-unit) * var(--_typography---type-scale-factor));
  --_typography---type-lead-line-height: 1.5em;
  --_gaps---gap-base-unit: 24px;
  --_gaps---gap-0-125x: 3px;
  --_gaps---gap-0-25x: 6px;
  --_gaps---gap-0-5x: 12px;
  --_gaps---gap-4x: 96px;
  --_grid---grid-window-gutter: 36px;
  --_grid---grid-gap: 24px;
  /* Die Startseite begrenzt ihr 12-Spalten-Raster auf 1400 px. Derselbe
     lokale Wert verhindert, dass die Navigationspunkte auf Unterseiten bei
     sehr breiten Viewports nach links wandern. */
  --rc-nav-shell-width: min(100vw, 1400px);
  --rc-nav-grid-width: calc(var(--rc-nav-shell-width) - (2 * var(--_grid---grid-window-gutter)));
  --rc-nav-grid-column: calc((var(--rc-nav-grid-width) - (11 * var(--_grid---grid-gap))) / 12);
  --_grid---grid-2-column: calc((2 * var(--rc-nav-grid-column)) + var(--_grid---grid-gap));
  --_navbar---navbar-height: 68px;
  --_navbar---navbar-links-gap: 24px;
  --rc-mobile-panel-duration: .36s;
  --rc-mobile-panel-ease: cubic-bezier(.4, 0, .2, 1);
  --_border-radius---border-radius-base-unit: 4px;
  --_border-radius---border-radius-dropdown: 8px;
  z-index: 99;
  color: #171717;
  font-family: var(--_typography---type-font-body);
  font-size: var(--_typography---type-body-size);
  font-variation-settings: "wght" 350;
  font-weight: 400;
  line-height: var(--_typography---type-body-line-height);
  background: linear-gradient(180deg,
    rgba(255, 255, 255, 1) 0%,
    rgba(255, 255, 255, .98) 42%,
    rgba(255, 255, 255, .86) 60%,
    rgba(255, 255, 255, .62) 74%,
    rgba(255, 255, 255, .36) 85%,
    rgba(255, 255, 255, .16) 93%,
    rgba(255, 255, 255, .05) 97%,
    rgba(255, 255, 255, .012) 99%,
    rgba(255, 255, 255, 0) 100%);
  top: 0;
}

/* Bei offenem Menü ist die Kopfzeile Teil der weißen Fläche: der Verlauf würde
   den Seiteninhalt durchscheinen lassen und die Leiste grau wirken lassen.
   Ausserdem muss sie von sticky auf fixed wechseln: die Sperre stellt den Body
   mit negativem top fest, ein sticky Header wuerde um genau diesen Betrag nach
   oben mitwandern und waere bei gescrollter Seite nicht mehr sichtbar. */
html.rc-mobile-nav-open .rc-site-navigation,
.rc-site-navigation.is-mobile-open {
  background: #fff !important;
}

/* Die Suche darf auch aus einer gescrollten Seitenposition heraus niemals den
   transparenten Seitenkopf zeigen. Der Zustand wird in local-navigation.js am
   html-Element gesetzt, sodass auch der ausserhalb der Navbar liegende Chrome-
   Wrapper sicher am oberen Viewportrand bleibt. */
html.rc-search-open .rc-chrome-nav {
  z-index: 2147483000 !important;
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  left: 0 !important;
  transform: none !important;
}

html.rc-search-open .rc-site-navigation,
.rc-site-navigation.is-search-open {
  background: #fff !important;
}

html.rc-search-open .rc-site-navigation .navbar-bg,
.rc-site-navigation.is-search-open .navbar-bg {
  background: #fff !important;
  opacity: 1 !important;
  height: 100% !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

html.rc-search-open .rc-site-navigation .nav-logo-link,
html.rc-search-open .rc-site-navigation .nav-logo,
.rc-site-navigation.is-search-open .nav-logo-link,
.rc-site-navigation.is-search-open .nav-logo {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

html.rc-mobile-nav-open .rc-site-navigation,
html.rc-mobile-nav-open .rc-chrome-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0;
}

html.rc-mobile-nav-open .rc-site-navigation .navbar-bg,
.rc-site-navigation.is-mobile-open .navbar-bg {
  background: #fff !important;
  opacity: 1 !important;
  height: 100% !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.rc-site-navigation a {
  color: inherit;
  text-decoration: none;
}

.rc-site-navigation button {
  margin: 0;
  color: inherit;
  font: inherit;
}

.rc-site-navigation .main-container {
  z-index: 3;
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
  padding-inline: var(--_grid---grid-window-gutter);
  position: relative;
}

.rc-site-navigation .main-container.navbar-container {
  z-index: 4;
}

/* Die Leiste bleibt in beiden Zustaenden durchscheinend: Der Inhalt dahinter
   wird weichgezeichnet, statt von einer deckenden Flaeche verdeckt zu werden.

   Entscheidend gegen die sichtbare Unterkante: Die Blur-Ebene ist hoeher als
   die Leiste selbst und wird per Maske nach unten vollstaendig ausgeblendet.
   Dadurch gibt es keinen Pixel, an dem die Weichzeichnung abrupt endet - sie
   laeuft weich in den Seiteninhalt aus.

   `background-color` und `backdrop-filter` werden gemeinsam und gleich lang
   animiert. Wuerden sie versetzt umspringen, waere beim schnellen Hochscrollen
   kurz ein hellerer Balken zu sehen. */
.rc-site-navigation .navbar-bg {
  z-index: 0;
  /* site-styles.css setzt hier pauschal `opacity: 0`; ohne diese Zeile bliebe
     die Ebene unsichtbar. Gesteuert wird ueber background-color und Blur. */
  opacity: 1;

  /* Die Ebene reicht ueber die Leiste hinaus, damit die Maske genug Strecke
     zum Ausfaden hat. Die Leiste selbst behaelt ihre Hoehe. */
  height: 178%;
  background-color: rgba(255, 255, 255, .30);
  -webkit-backdrop-filter: blur(7px) saturate(105%);
  backdrop-filter: blur(7px) saturate(105%);

  /* Blur UND Aufhellung laufen gemeinsam nach unten aus. Der Verlauf endet
     lange vor der Unterkante bei 0, deshalb ist dort nichts mehr zu sehen. */
  -webkit-mask-image: linear-gradient(180deg,
    rgba(0, 0, 0, 1) 0%,
    rgba(0, 0, 0, 1) 38%,
    rgba(0, 0, 0, .92) 50%,
    rgba(0, 0, 0, .72) 62%,
    rgba(0, 0, 0, .46) 72%,
    rgba(0, 0, 0, .24) 82%,
    rgba(0, 0, 0, .09) 90%,
    rgba(0, 0, 0, .02) 96%,
    rgba(0, 0, 0, 0) 100%);
  mask-image: linear-gradient(180deg,
    rgba(0, 0, 0, 1) 0%,
    rgba(0, 0, 0, 1) 38%,
    rgba(0, 0, 0, .92) 50%,
    rgba(0, 0, 0, .72) 62%,
    rgba(0, 0, 0, .46) 72%,
    rgba(0, 0, 0, .24) 82%,
    rgba(0, 0, 0, .09) 90%,
    rgba(0, 0, 0, .02) 96%,
    rgba(0, 0, 0, 0) 100%);

  border: 0;
  box-shadow: none;
  transition:
    background-color .65s cubic-bezier(.33, 0, .3, 1),
    -webkit-backdrop-filter .65s cubic-bezier(.33, 0, .3, 1),
    backdrop-filter .65s cubic-bezier(.33, 0, .3, 1);
}

/* light-mode.css setzt fuer `.navbar .navbar-bg` eine kurze 0.32s-Blende.
   Diese Regel hat dieselbe Spezifitaet und steht spaeter, damit ueberall der
   ruhige gemeinsame Uebergang greift. */
.navbar.rc-site-navigation .navbar-bg {
  transition:
    background-color .65s cubic-bezier(.33, 0, .3, 1),
    -webkit-backdrop-filter .65s cubic-bezier(.33, 0, .3, 1),
    backdrop-filter .65s cubic-bezier(.33, 0, .3, 1);
}

/* Nach dem Header: kraeftigere Weichzeichnung bei bewusst niedriger weisser
   Deckkraft, damit sich die Leiste nur sanft abhebt. Maske und Hoehe bleiben
   gleich - es aendern sich ausschliesslich Blur und Aufhellung. */
html.rc-homepage .rc-site-navigation .navbar-bg,
html.rc-nav-past-header .rc-site-navigation .navbar-bg,
html.rc-nav-past-header .navbar.rc-site-navigation .navbar-bg {
  background-color: rgba(255, 255, 255, .52);
  -webkit-backdrop-filter: blur(20px) saturate(120%);
  backdrop-filter: blur(20px) saturate(120%);
}

/* Kein zweiter Layer mehr: Der fruehere ::after-Verlauf erzeugte genau die
   rechteckige Aufhellung mit harter Unterkante. */
.rc-site-navigation .navbar-bg::after { content: none; }

@media (prefers-reduced-motion: reduce) {
  .rc-site-navigation .navbar-bg,
  .navbar.rc-site-navigation .navbar-bg { transition: none; }
}

.rc-site-navigation .navbar-row {
  height: var(--_navbar---navbar-height);
  display: flex;
  align-items: center;
  gap: var(--_navbar---navbar-links-gap);
  position: relative;
  z-index: 3;
}

.rc-site-navigation .nav-logo-link {
  flex: none;
  line-height: 0;
}

.rc-site-navigation .nav-logo {
  width: auto;
  max-width: 100%;
  max-height: 36px;
  display: block;
}

.rc-site-navigation .navigation-wrap {
  min-width: 0;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.rc-site-navigation .navbar-menu {
  position: relative;
}

/* Nur im mobilen Menue sichtbar. */
.rc-site-navigation .rc-nav-foot,
.rc-site-navigation .rc-mobile-language,
.rc-site-navigation .rc-mobile-footer-language { display: none; }

.rc-site-navigation .nav-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--_navbar---navbar-links-gap);
  position: relative;
  z-index: 3;
}

/* Desktop: Leistungen und Kontakt bleiben exakt auf ihren bisherigen
   Rasterpositionen. Nur die beiden mittleren Punkte werden optisch so
   korrigiert, dass die sichtbaren Zwischenraeume gleich gross wirken. */
@media screen and (min-width: 992px) {
  .rc-site-navigation .nav-links > .nav-link-wrap:nth-child(2) > .external-link {
    transform: translateX(1px);
  }

  .rc-site-navigation .nav-links > .nav-link-wrap:nth-child(3) > .nav-dropdown {
    transform: translateX(-31px);
  }
}

.rc-site-navigation .nav-link-wrap,
.rc-site-navigation .nav-dropdown {
  position: relative;
}

.rc-site-navigation .dropdown-toggle,
.rc-site-navigation .external-link {
  min-height: 40px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--_gaps---gap-0-125x);
  color: #171717;
  background: transparent;
  border: 0;
  cursor: pointer;
  white-space: nowrap;
}

.rc-site-navigation .dropdown-toggle > div,
.rc-site-navigation .external-link-text {
  transition: opacity 200ms cubic-bezier(.34, 1.2, .64, 1);
}

.rc-site-navigation .nav-link-wrap:hover .dropdown-toggle > div,
.rc-site-navigation .nav-link-wrap:focus-within .dropdown-toggle > div,
.rc-site-navigation .external-link:hover .external-link-text,
.rc-site-navigation .external-link:focus-visible .external-link-text {
  opacity: .78;
}

.rc-site-navigation .nav-link-wrap.is-current .dropdown-toggle > div,
.rc-site-navigation .nav-link-wrap.is-current > .external-link .external-link-text {
  font-variation-settings: "wght" 550;
}

.rc-site-navigation .dropdown-caret {
  width: 12px;
  height: 12px;
  display: block;
  filter: brightness(0);
  transition: transform 420ms cubic-bezier(.22, 1, .36, 1);
}

.rc-site-navigation .nav-dropdown.is-open .dropdown-caret {
  transform: rotate(180deg);
}

.rc-site-navigation .external-link-icon {
  width: 14px;
  height: 14px;
  filter: brightness(0);
  transition: transform 420ms cubic-bezier(.22, 1, .36, 1), opacity 180ms ease;
}

.rc-site-navigation .external-link:hover .external-link-icon,
.rc-site-navigation .external-link:focus-visible .external-link-icon {
  opacity: .78;
  transform: translate3d(3px, -3px, 0);
}

.rc-site-navigation .navbar-right-contents {
  display: none;
  align-items: center;
}

.rc-site-navigation .menu-button {
  padding: 12px 0 12px 12px;
  color: #171717;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.rc-site-navigation .menu-button-icon-wrapper {
  width: 24px;
  height: 24px;
  display: flex;
  overflow: hidden;
}

/* Zwei Striche, die zum X zusammenfahren: erst rücken sie zur Mitte, dann
   drehen sie sich gegenläufig — wie bei Apple, wo beides leicht überlappt. */
.rc-site-navigation .menu-button-bars {
  position: relative;
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  display: block;
}

/* Beide Striche gleich lang, um denselben Mittelpunkt gedreht: beim Morphen
   aendert sich nur Abstand und Winkel, keine Laenge, kein seitliches Wandern.
   Dauer und Kurve wie beim Suchfeld, damit beides gleich laeuft. */
.rc-site-navigation .menu-button-bar {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 20px;
  height: 1.5px;
  margin: -.75px 0 0 -10px;
  display: block;
  border-radius: 2px;
  background: currentColor;
  transform-origin: 50% 50%;
  backface-visibility: hidden;
  transition: transform var(--rc-mobile-panel-duration) var(--rc-mobile-panel-ease);
}

.rc-site-navigation .menu-button-bar:nth-child(1) { transform: translateY(-4px); }
.rc-site-navigation .menu-button-bar:nth-child(2) { transform: translateY(4px); }

.rc-site-navigation .menu-button.is-open .menu-button-bar:nth-child(1) {
  transform: rotate(45deg);
}

.rc-site-navigation .menu-button.is-open .menu-button-bar:nth-child(2) {
  transform: rotate(-45deg);
}

/* Fallback: bleiben wider Erwarten die alten Icon-Bilder stehen, dürfen sie
   nicht zusätzlich zu den Strichen erscheinen. */
.rc-site-navigation .menu-button-bars ~ .menu-button-icon { display: none; }

.rc-site-navigation .dropdown-wrap {
  z-index: 20;
  min-width: 260px;
  display: block !important;
  position: absolute;
  top: calc(100% + 14px);
  left: -18px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(0, -12px, 0) scale(.975);
  transform-origin: top left;
  background: transparent !important;
  border: 0 !important;
  border-radius: var(--_border-radius---border-radius-dropdown);
  box-shadow: none !important;
  backface-visibility: hidden;
  transition: opacity 240ms ease, visibility 240ms ease,
    transform 440ms cubic-bezier(.22, 1, .36, 1);
}

.rc-site-navigation .nav-dropdown.is-open > .dropdown-wrap,
.rc-site-navigation .nav-dropdown:focus-within > .dropdown-wrap {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) scale(1);
}

.rc-site-navigation .dropdown-content {
  width: 100%;
  max-width: none;
  padding: 8px;
  display: flex;
  flex-direction: column;
  position: relative;
  top: 0;
  overflow: hidden;
  background: rgba(255, 255, 255, .94);
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: var(--_border-radius---border-radius-dropdown);
  box-shadow: 0 18px 48px rgba(17, 17, 17, .14);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  contain: paint;
  transition: background-color 240ms ease, border-color 240ms ease;
}

@media screen and (min-width: 992px) {
  /* Solange die Navigation ueber dem Header liegt, bekommt das Dropdown wieder
     den leicht grauen Fond der urspruenglichen Fassung. Auf dem hellen Header
     hebt es sich dadurch sichtbar ab, statt mit ihm zu verschmelzen. */
  .rc-site-navigation
    .nav-dropdown.rc-nav-locally-over-light
    .dropdown-content {
    background: rgba(242, 242, 242, .96);
    border-color: rgba(23, 23, 23, .06);
  }

  .rc-site-navigation
    .nav-dropdown.rc-nav-locally-over-light
    .dropdown-link:hover,
  .rc-site-navigation
    .nav-dropdown.rc-nav-locally-over-light
    .dropdown-link:focus-visible,
  .rc-site-navigation
    .nav-dropdown.rc-nav-locally-over-light
    .dropdown-link.is-current {
    background: rgba(23, 23, 23, .045) !important;
  }

  /* Die Startseite uebernimmt den hellen Navigationszustand der Kontaktseite,
     auch wenn unter der Leiste das dunkle Hero-Bild liegt. */
  html.rc-homepage .rc-site-navigation .nav-dropdown .dropdown-content {
    background: rgba(242, 242, 242, .96);
    border-color: rgba(23, 23, 23, .06);
  }

  html.rc-homepage .rc-site-navigation .nav-dropdown .dropdown-link:hover,
  html.rc-homepage .rc-site-navigation .nav-dropdown .dropdown-link:focus-visible,
  html.rc-homepage .rc-site-navigation .nav-dropdown .dropdown-link.is-current {
    background: rgba(23, 23, 23, .045) !important;
  }
}

.rc-site-navigation .dropdown-link {
  width: 100%;
  min-height: 42px;
  padding: 11px 12px;
  display: flex;
  align-items: center;
  color: #171717 !important;
  font: inherit;
  text-align: left;
  background: transparent;
  border: 0;
  border-radius: var(--_border-radius---border-radius-base-unit);
  cursor: pointer;
  opacity: 0;
  transform: translate3d(0, -5px, 0);
  transition: color 180ms ease, opacity 280ms ease,
    background-color 240ms ease, transform 380ms cubic-bezier(.22, 1, .36, 1);
}

.rc-site-navigation .nav-dropdown.is-open .dropdown-link,
.rc-site-navigation .nav-dropdown:focus-within .dropdown-link {
  opacity: .68;
  transform: translate3d(0, 0, 0);
}

.rc-site-navigation .nav-dropdown.is-open .dropdown-link:nth-child(2),
.rc-site-navigation .nav-dropdown:focus-within .dropdown-link:nth-child(2) {
  transition-delay: 22ms;
}

.rc-site-navigation .nav-dropdown.is-open .dropdown-link:nth-child(3),
.rc-site-navigation .nav-dropdown:focus-within .dropdown-link:nth-child(3) {
  transition-delay: 44ms;
}

.rc-site-navigation .nav-dropdown.is-open .dropdown-link:nth-child(4),
.rc-site-navigation .nav-dropdown:focus-within .dropdown-link:nth-child(4) {
  transition-delay: 66ms;
}

.rc-site-navigation .dropdown-link:hover,
.rc-site-navigation .dropdown-link:focus-visible,
.rc-site-navigation .dropdown-link.is-current {
  color: #171717 !important;
  opacity: 1 !important;
  background: rgba(255, 255, 255, .62) !important;
  outline: 0;
  transform: translate3d(0, 0, 0);
}

/* Vor dunklem Hintergrund bleibt die Auswahlbox weiss (Regel oben). Steht die
   Navigation dagegen vor hellem Seiteninhalt, geht die weisse Flaeche im
   ebenfalls hellen Panel unter. Dann blenden wir auf ein leichtes Hellgrau um.
   Die Farbe ist Teil der bestehenden background-color-Transition und morpht
   daher weich. */
html.rc-nav-over-light .rc-site-navigation .dropdown-link:hover,
html.rc-nav-over-light .rc-site-navigation .dropdown-link:focus-visible,
html.rc-nav-over-light .rc-site-navigation .dropdown-link.is-current {
  background: rgba(23, 23, 23, .035) !important;
}

/* Unterseiten im Desktop-Dropdown beim Hover klar hellgrau hervorheben. */
@media screen and (min-width: 992px) {
  body.rc-subpage
    .rc-site-navigation
    .nav-dropdown
    .dropdown-link:hover,
  body.rc-subpage
    .rc-site-navigation
    .nav-dropdown
    .dropdown-link:focus-visible,
  body.rc-subpage
    .rc-site-navigation
    .nav-dropdown
    .dropdown-link.is-current,
  body.rc-subpage
    .rc-site-navigation
    .nav-dropdown
    .dropdown-link[aria-current="page"] {
    background: #f1f2f2 !important;
  }

  /* Ueber dem Header ist der Fond selbst hellgrau. Dort wuerde sich ein
     hellgrauer Hover nicht mehr abheben, deshalb dunkelt er hier leicht ab -
     wie in der urspruenglichen Fassung. */
  body.rc-subpage
    .rc-site-navigation
    .nav-dropdown.rc-nav-locally-over-light
    .dropdown-link:hover,
  body.rc-subpage
    .rc-site-navigation
    .nav-dropdown.rc-nav-locally-over-light
    .dropdown-link:focus-visible,
  body.rc-subpage
    .rc-site-navigation
    .nav-dropdown.rc-nav-locally-over-light
    .dropdown-link.is-current,
  body.rc-subpage
    .rc-site-navigation
    .nav-dropdown.rc-nav-locally-over-light
    .dropdown-link[aria-current="page"] {
    background: rgba(23, 23, 23, .045) !important;
  }
}

.rc-site-navigation .rc-header-tools {
  position: absolute;
  top: 50%;
  left: calc(100% + 10px);
  display: flex;
  align-items: center;
  gap: 4px;
  transform: translateY(-50%);
}

/* Search and language belong inside the available header width. */
@media screen and (min-width: 992px) {
  .navbar.rc-site-navigation .rc-header-tools {
    position: static;
    flex: 0 0 auto;
    transform: none;
  }
  .navbar.rc-site-navigation .rc-language-dropdown .dropdown-wrap {
    right: 0;
    left: auto;
  }
}

.rc-site-navigation .rc-search-trigger {
  width: 40px;
  height: 40px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #171717;
  background: transparent;
  border: 0;
  cursor: pointer;
}

.rc-site-navigation .rc-search-trigger svg,
.rc-site-navigation .rc-search-panel__icon {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rc-site-navigation .rc-search-trigger svg {
  transition: opacity 180ms ease, transform 360ms cubic-bezier(.22, 1, .36, 1);
}

.rc-site-navigation .rc-search-trigger:hover svg,
.rc-site-navigation .rc-search-trigger:focus-visible svg {
  opacity: .58;
  transform: scale(1.06);
}

.rc-site-navigation .rc-language-wrap {
  width: 56px;
  margin-left: 0;
  flex: none;
}

.rc-site-navigation .rc-language-dropdown,
.rc-site-navigation .rc-language-toggle {
  width: 100%;
}

.rc-site-navigation .rc-language-toggle {
  min-width: 0;
  justify-content: flex-start;
}

.rc-site-navigation .rc-language-dropdown .dropdown-wrap {
  width: 160px;
  min-width: 160px;
  max-width: 160px;
  max-height: min(430px, calc(100vh - 90px));
  left: auto;
  right: -52px;
  overflow-y: auto;
  transform-origin: top left;
}

.rc-site-navigation .rc-language-option.is-current {
  color: #171717 !important;
  opacity: 1;
  background: transparent;
}

.rc-site-navigation .rc-language-option.is-current::after {
  content: "";
  width: 6px;
  height: 6px;
  margin-left: auto;
  background: #0ca3e4;
  border-radius: 50%;
}

.rc-site-navigation .rc-nav-overlay {
  z-index: 2;
  position: fixed;
  inset: var(--_navbar---navbar-height) 0 0;
  background: rgba(232, 232, 237, .4);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  transition: opacity .32s cubic-bezier(.4, 0, .6, 1) 80ms,
    visibility .32s step-start 80ms;
}

.rc-site-navigation.is-search-open .rc-nav-overlay {
  opacity: 1;
  visibility: visible;
}

.rc-site-navigation .rc-search-panel {
  z-index: 3;
  width: 100%;
  height: 0;
  position: absolute;
  top: 100%;
  left: 0;
  overflow: hidden;
  color: #171717;
  background: #fff;
  border-top: 1px solid #1717170d;
  visibility: hidden;
  transition: height .32s cubic-bezier(.4, 0, .6, 1),
    visibility .32s step-end;
}

/* Die Hoehe folgt dem Inhalt: --rc-search-height wird beim Tippen aus der
   gemessenen Inhaltshoehe gesetzt, damit das Panel mitwaechst, statt eine
   feste Hoehe zu behalten und die Treffer zu scrollen. */
.rc-site-navigation.is-search-open .rc-search-panel {
  height: var(--rc-search-height, clamp(340px, 34vw, 460px));
  visibility: visible;
  transition: height .32s cubic-bezier(.4, 0, .6, 1),
    visibility .32s step-start;
}

.rc-site-navigation .rc-search-panel__inner {
  /* Keine feste Hoehe: der Innenbereich muss seine echte Hoehe melden,
     damit das Panel darauf wachsen kann. */
  padding-top: clamp(28px, 3vw, 48px);
  padding-bottom: clamp(34px, 4vw, 60px);
}

.rc-site-navigation .rc-search-panel__form {
  max-width: 760px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid #17171752;
}

.rc-site-navigation .rc-search-panel__input {
  width: 100%;
  min-width: 0;
  padding: 10px 0 14px;
  color: #171717;
  font: inherit;
  font-size: clamp(24px, 2.2vw, 36px);
  font-variation-settings: "wght" 350;
  background: transparent;
  border: 0;
  outline: 0;
}

.rc-site-navigation .rc-search-panel__input::placeholder {
  color: #17171766;
}

/* Aus zwei Strichen gezeichnet statt als Zeichen gesetzt: nur so hat das X
   exakt dieselbe Strichstaerke wie der Burger (1,5 px). */
.rc-site-navigation .rc-search-panel__close {
  width: 36px;
  height: 36px;
  padding: 0;
  display: grid;
  place-items: center;
  color: #171717;
  line-height: 1;
  background: transparent;
  border: 0;
  cursor: pointer;
  transition: opacity 180ms ease, transform 280ms ease;
}

.rc-site-navigation .rc-search-panel__close-bars {
  position: relative;
  width: 20px;
  height: 20px;
  display: block;
}

.rc-site-navigation .rc-search-panel__close-bars > span {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 20px;
  height: 1.5px;
  margin: -.75px 0 0 -10px;
  display: block;
  border-radius: 2px;
  background: currentColor;
  transform-origin: 50% 50%;
}

.rc-site-navigation .rc-search-panel__close-bars > span:nth-child(1) { transform: rotate(45deg); }
.rc-site-navigation .rc-search-panel__close-bars > span:nth-child(2) { transform: rotate(-45deg); }

.rc-site-navigation .rc-search-panel__close:hover {
  opacity: .55;
  transform: rotate(90deg);
}

.rc-site-navigation .rc-search-panel__results {
  --rc-search-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M2.91675 7H10.5001M7.00008 2.91667L11.0834 7L7.00008 11.0833' stroke='black' stroke-width='1.25' stroke-linecap='square'/%3E%3C/svg%3E");
}

.rc-site-navigation .rc-search-panel__label,
.rc-site-navigation .rc-search-panel__results {
  width: min(760px, 100%);
  margin-inline: auto;
}

.rc-site-navigation .rc-search-panel__label {
  margin-top: 26px;
  color: #17171775;
  font-family: var(--_typography---type-font-badges);
  font-size: 12px;
  text-transform: uppercase;
}

.rc-site-navigation .rc-search-panel__results {
  margin-top: 10px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 24px;
}

/* Das hidden-Attribut muss ein gesetztes display schlagen, sonst bleiben
   Schnellzugriff bzw. Trefferliste trotz hidden sichtbar. */
.rc-site-navigation .rc-search-panel__results[hidden],
.rc-site-navigation .rc-search-panel__matches[hidden],
.rc-site-navigation .rc-search-panel__empty[hidden] {
  display: none !important;
}

.rc-site-navigation .rc-search-panel__results a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 0;
  color: #171717;
  opacity: .68;
  transition: opacity 180ms ease, color 180ms ease;
}

/* Pfeil im Stil der Button-Icons: durchgehende Linie mit Spitze,
   Strichstaerke 1.25 und eckige Enden. Als Maske gezeichnet, damit er die
   Textfarbe uebernimmt und beim Hover mit umschlaegt. */
.rc-site-navigation .rc-search-panel__results a::before {
  content: "";
  flex: none;
  width: 14px;
  height: 14px;
  background: currentColor;
  transition: transform 320ms cubic-bezier(.22, 1, .36, 1);
  -webkit-mask: var(--rc-search-arrow) center / 14px 14px no-repeat;
  mask: var(--rc-search-arrow) center / 14px 14px no-repeat;
}

/* Hover: nur die Akzentfarbe, keine hinterlegte Flaeche. */
.rc-site-navigation .rc-search-panel__results a:hover,
.rc-site-navigation .rc-search-panel__results a:focus-visible {
  opacity: 1;
  color: var(--_color---color-brand, #049ce4);
}

.rc-site-navigation .rc-search-panel__results a:hover::before,
.rc-site-navigation .rc-search-panel__results a:focus-visible::before {
  transform: translateX(4px);
}

/* Trefferliste der Volltextsuche: uebernimmt Pfeil und Hover der
   Schnellzugriff-Liste, wird aber einspaltig dargestellt, damit laengere
   Bezeichnungen samt Abschnitts-Hinweis Platz haben. */
.rc-site-navigation .rc-search-panel__matches {
  --rc-search-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M2.91675 7H10.5001M7.00008 2.91667L11.0834 7L7.00008 11.0833' stroke='black' stroke-width='1.25' stroke-linecap='square'/%3E%3C/svg%3E");
  width: min(760px, 100%);
  margin-top: 10px;
  margin-inline: auto;
  display: grid;
}

.rc-site-navigation .rc-search-panel__matches a {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  align-items: start;
  gap: 4px 10px;
  padding: 12px 0;
  color: #171717;
  opacity: .82;
  border-bottom: 1px solid #17171712;
  transition: opacity 180ms ease, color 180ms ease;
}

/* Titelzeile mit Fundort rechts, darunter der Textauszug. */
/* Kein Flex-Layout: als Flex-Container wuerde jedes <mark> zu einem eigenen
   Element mit gap davor und dahinter – mitten im Wort entstuende dann eine
   Luecke ("Proben ver sand"). Der Fliesstext bleibt deshalb Inline, nur der
   Fundort-Hinweis wird rechts abgesetzt. */
.rc-site-navigation .rc-search-panel__treffer-titel {
  grid-column: 2;
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, max-content);
  align-items: baseline;
  column-gap: 12px;
  font-size: 15px;
}

/* Der eigentliche Titel liegt in einer eigenen Zelle und fliesst darin
   normal – dadurch bleiben markierte Silben nahtlos im Wort. */
.rc-site-navigation .rc-search-panel__treffer-name {
  min-width: 0;
  overflow-wrap: anywhere;
}

.rc-site-navigation .rc-search-panel__treffer-text {
  grid-column: 2;
  color: #17171799;
  font-size: 13px;
  line-height: 1.45;
}

.rc-site-navigation .rc-search-panel__matches mark {
  /* Kein Padding: es wuerde die Buchstaben im Wort auseinanderziehen. */
  padding: 0;
  color: inherit;
  font-weight: 500;
  background: #049ce426;
  border-radius: 2px;
  box-decoration-break: clone;
}

.rc-site-navigation .rc-search-panel__matches a:last-child {
  border-bottom: 0;
}

.rc-site-navigation .rc-search-panel__matches a::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
  margin-top: 4px;
  width: 14px;
  height: 14px;
  background: currentColor;
  transition: transform 320ms cubic-bezier(.22, 1, .36, 1);
  -webkit-mask: var(--rc-search-arrow) center / 14px 14px no-repeat;
  mask: var(--rc-search-arrow) center / 14px 14px no-repeat;
}

/* Tastaturauswahl und Zeigerhover sehen gleich aus. */
.rc-site-navigation .rc-search-panel__matches a.is-active,
.rc-site-navigation .rc-search-panel__matches a:hover,
.rc-site-navigation .rc-search-panel__matches a:focus-visible {
  opacity: 1;
  color: var(--_color---color-brand, #049ce4);
}

.rc-site-navigation .rc-search-panel__matches a.is-active::before,
.rc-site-navigation .rc-search-panel__matches a:hover::before,
.rc-site-navigation .rc-search-panel__matches a:focus-visible::before {
  transform: translateX(4px);
}

.rc-site-navigation .rc-search-panel__hint {
  justify-self: end;
  padding-left: 0;
  color: #17171766;
  font-family: var(--_typography---type-font-badges);
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.rc-site-navigation .rc-search-panel__matches a.is-active .rc-search-panel__hint,
.rc-site-navigation .rc-search-panel__matches a:hover .rc-search-panel__hint {
  color: inherit;
  opacity: .7;
}

.rc-site-navigation .rc-search-panel__empty {
  width: min(760px, 100%);
  margin: 14px auto 0;
  color: #17171799;
}

.rc-site-navigation .trigger-search,
.rc-site-navigation .navbar-menu-search {
  display: none !important;
}

/* Die Seite wird festgestellt statt nur auf overflow:hidden gesetzt: sonst
   springt iOS beim Öffnen an den Seitenanfang. Das Skript merkt sich dabei die
   Scrollposition in body.style.top und stellt sie beim Schließen wieder her. */
html.rc-mobile-nav-open,
html.rc-mobile-nav-open body {
  overflow: hidden !important;
}

html.rc-mobile-nav-open body {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
}

@media screen and (max-width: 991px) {
  .rc-site-navigation {
    --_typography---type-scale-factor: 1.19;
    --_grid---grid-window-gutter: 36px;
  }

  .rc-site-navigation .navbar-row {
    justify-content: space-between;
  }

  .rc-site-navigation .navbar-right-contents {
    display: flex;
  }

  /* Burger rückt von der rechten Kante weg, die Suche rückt zu ihm auf: so
     stehen beide als Paar zusammen statt am Rand zu kleben. */
  .rc-site-navigation .menu-button {
    display: flex;
    padding: 12px 0 12px 4px;
    margin-right: -6px;
    transform: translateX(-10px);
  }

  .rc-site-navigation .navbar-right-contents .rc-header-tools {
    transform: translateX(6px);
  }

  /* Klappt exakt wie das Suchfeld auf: Hoehe 0 -> voll, gleiche Kurve, gleiche
     Dauer, visibility gestuft. Kein transform, damit die Kopfzeile ruhig
     stehen bleibt und nur die Flaeche darunter waechst. */
  .rc-site-navigation .navbar-menu {
    z-index: 0;
    width: 100vw;
    height: 0;
    display: block !important;
    position: fixed !important;
    top: var(--_navbar---navbar-height) !important;
    left: 0;
    overflow: hidden;
    visibility: hidden;
    color: #171717;
    background: #fff;
    border-top: 1px solid #1717170d;
    transition:
      height var(--rc-mobile-panel-duration) var(--rc-mobile-panel-ease),
      visibility var(--rc-mobile-panel-duration) step-end;
  }

  .rc-site-navigation.is-mobile-open .navbar-menu {
    height: calc(100dvh - var(--_navbar---navbar-height));
    visibility: visible;
    transition:
      height var(--rc-mobile-panel-duration) var(--rc-mobile-panel-ease),
      visibility var(--rc-mobile-panel-duration) step-start;
  }

  /* Wie bei der Suche wird der Inhalt allein durch die wachsende Panelhoehe
     freigelegt. Eine zusaetzliche Verzoegerung wuerde das Menue langsamer
     wirken lassen, obwohl die Flaeche bereits offen ist. */
  .rc-site-navigation .nav-links > * {
    opacity: 1;
    transform: none;
  }

  .rc-site-navigation.is-mobile-open .nav-links > * {
    opacity: 1;
    transform: none;
  }

  @media (prefers-reduced-motion: reduce) {
    .rc-site-navigation .navbar-menu,
    .rc-site-navigation .nav-links > *,
    .rc-site-navigation .dropdown-wrap,
    .rc-site-navigation .dropdown-link,
    .rc-site-navigation .dropdown-caret,
    .rc-site-navigation .menu-button-bar {
      transition-duration: 1ms !important;
      transition-delay: 0s !important;
    }
  }

  .rc-site-navigation .nav-links {
    /* z-index zuruecknehmen: sonst liegt die Liste ueber der Kopfzeile und
       faengt die Klicks auf Burger und Suche ab. */
    z-index: 0;
    width: 100%;
    height: 100%;
    /* Das Blatt beginnt bereits unter der Kopfzeile, hier reicht der normale
       Innenabstand. */
    padding: var(--_gaps---gap-base-unit) var(--_grid---grid-window-gutter) var(--_gaps---gap-4x);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 6px;
    overflow: auto;
    overscroll-behavior: contain;
  }

  .rc-site-navigation .nav-link-wrap,
  .rc-site-navigation .nav-dropdown,
  .rc-site-navigation .dropdown-toggle,
  .rc-site-navigation .external-link {
    width: 100%;
  }

  /* Zeilen wie in der Vorlage: groessere Beschriftung, Trennlinie zwischen
     den Punkten, Pfeil/Chevron rechts aussen. */
  .rc-site-navigation .nav-link-wrap {
    font-size: 1.32rem;
    line-height: 1.1;
  }

  .rc-site-navigation .nav-links > .nav-link-wrap + .nav-link-wrap {
    border-top: 1px solid rgba(23, 23, 23, .10);
  }

  .rc-site-navigation .dropdown-toggle,
  .rc-site-navigation .external-link {
    min-height: 0;
    padding: 18px 2px;
    justify-content: space-between;
    gap: 14px;
  }

  /* Alle Zeilen gleich hoch: die zugeklappte Huelle darf keine Resthoehe und
     der Flex-Abstand keinen zusaetzlichen Spalt erzeugen. */
  .rc-site-navigation .nav-links { gap: 0; }

  .rc-site-navigation .nav-link-wrap > .nav-dropdown > .dropdown-wrap {
    display: grid;
  }

  /* Schrift und Gewicht wie im Suchfeld ("Suchen"): gleiche Familie, wght 350,
     gleiche Groessenkurve. */
  .rc-site-navigation .dropdown-toggle > div,
  .rc-site-navigation .external-link-text {
    font-family: var(--_typography---type-font-body);
    font-size: clamp(24px, 2.2vw, 36px);
    line-height: 1.2;
    letter-spacing: -.015em;
    font-weight: 400;
    font-variation-settings: "wght" 350;
  }

  /* Aufgeklappte Gruppe bleibt schwarz — blau ist allein der aktiven Seite
     vorbehalten. */
  .rc-site-navigation .nav-dropdown.is-open .dropdown-toggle > div {
    color: #171717;
  }

  .rc-site-navigation .dropdown-caret,
  .rc-site-navigation .external-link-icon {
    width: 14px;
    height: 14px;
    opacity: .42;
  }

  /* Aufklappen ueber grid-template-rows: laesst sich im Gegensatz zu
     display/height:auto sauber animieren. */
  .rc-site-navigation .dropdown-wrap,
  .rc-site-navigation .rc-language-dropdown .dropdown-wrap {
    width: 100%;
    min-width: 0;
    max-width: none;
    max-height: none;
    display: grid !important;
    grid-template-rows: 0fr;
    position: relative;
    inset: auto;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: none;
    overflow: hidden;
    transition: grid-template-rows 380ms cubic-bezier(.22, 1, .36, 1);
  }

  .rc-site-navigation .nav-dropdown.is-open > .dropdown-wrap {
    grid-template-rows: 1fr;
  }

  /* Das Padding gehoert in die kollabierende Zeile, sonst bleibt bei
     grid-template-rows:0fr eine Resthoehe stehen. */
  .rc-site-navigation .dropdown-content {
    min-height: 0;
    padding: 0 0 0 16px;
    gap: 2px;
    overflow: hidden;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  .rc-site-navigation .dropdown-link {
    min-height: 0;
    padding: 9px 2px 9px 0;
    /* Unterpunkte in Schwarz statt Grau. */
    color: #171717 !important;
    font-size: 1.05rem;
    font-variation-settings: "wght" 350;
    background: transparent !important;
    border-radius: 0;
    opacity: 0;
    transform: translateY(-6px);
    transition: opacity 260ms ease, transform 320ms cubic-bezier(.22, 1, .36, 1), color 150ms ease;
  }

  .rc-site-navigation .nav-dropdown.is-open > .dropdown-wrap .dropdown-content {
    padding-bottom: 12px;
  }

  .rc-site-navigation .nav-dropdown.is-open .dropdown-link {
    opacity: 1;
    transform: none;
    transition-delay: calc(60ms + var(--rc-sub-index, 0) * 45ms);
  }

  .rc-site-navigation .dropdown-link:hover,
  .rc-site-navigation .dropdown-link:focus-visible,
  .rc-site-navigation .dropdown-link.is-current {
    background: transparent !important;
    opacity: 1 !important;
  }

  /* Die aktuell geoeffnete Seite wird blau hervorgehoben — sowohl der
     Hauptpunkt als auch der Unterpunkt, der die Seite bezeichnet. */
  .rc-site-navigation .dropdown-link.is-current,
  .rc-site-navigation .dropdown-link.is-current {
    color: var(--_color---color-brand, #049ce4) !important;
  }

  /* Aktive Seite nur in Blau, ohne staerkeren Schnitt. */
  .rc-site-navigation .nav-link-wrap.is-current .dropdown-toggle > div,
  .rc-site-navigation .nav-link-wrap.is-current > .external-link .external-link-text {
    color: var(--_color---color-brand, #049ce4);
    font-variation-settings: "wght" 350;
  }

  /* Adresse am Fuss des Menues, wie in der Vorlage. */
  .rc-site-navigation .rc-nav-foot {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    margin-top: 40px;
    padding-top: 22px;
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
    column-gap: 24px;
    border-top: 1px solid rgba(23, 23, 23, .10);
  }

  .rc-site-navigation .rc-mobile-footer-language {
    display: contents;
  }

  .rc-site-navigation .rc-mobile-footer-language .rc-language-dropdown {
    display: contents;
  }

  .rc-site-navigation .rc-mobile-footer-language .rc-language-toggle {
    width: auto;
    min-height: 0;
    padding: 0;
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    justify-content: flex-end;
    gap: 0;
    color: rgba(23, 23, 23, .52);
    font-size: 12px;
    line-height: 1.55;
  }

  .rc-site-navigation .rc-mobile-footer-language__value {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: rgba(23, 23, 23, .52);
    font-size: 12px;
    line-height: 1.55;
    font-variation-settings: "wght" 400;
  }

  .rc-site-navigation .rc-mobile-footer-language .dropdown-caret {
    opacity: .45;
  }

  .rc-site-navigation .rc-mobile-footer-language .dropdown-wrap {
    width: 100%;
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .rc-site-navigation .rc-mobile-footer-language .nav-dropdown.is-open > .dropdown-wrap {
    margin-top: 10px;
  }

  .rc-site-navigation .rc-mobile-footer-language .dropdown-content {
    padding-left: 0 !important;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
  }

  .rc-site-navigation .rc-mobile-footer-language .dropdown-link {
    min-height: 42px;
    padding-right: 0;
    padding-left: 0;
    border-top: 1px solid rgba(23, 23, 23, .08);
  }

  .rc-site-navigation .rc-mobile-footer-language .rc-language-option.is-current {
    color: var(--_color---color-brand, #049ce4) !important;
  }

  .rc-site-navigation .rc-mobile-footer-language .rc-language-option.is-current::after {
    display: block !important;
    width: 6px !important;
    min-width: 6px !important;
    max-width: 6px !important;
    height: 6px !important;
    min-height: 6px !important;
    max-height: 6px !important;
    padding: 0 !important;
    flex: 0 0 6px !important;
    align-self: center;
    aspect-ratio: 1 / 1 !important;
    line-height: 0;
    border: 0;
    border-radius: 999px !important;
    box-sizing: border-box;
    transform: none !important;
  }

  .rc-site-navigation .rc-nav-foot p {
    margin: 0;
    color: rgba(23, 23, 23, .42);
    font-size: 12px;
    line-height: 1.55;
  }

  .rc-site-navigation .rc-nav-foot__small {
    font-size: 10px;
    letter-spacing: .14em;
    text-transform: uppercase;
    text-align: right;
  }

  /* Sitzt jetzt in der Kopfzeile links neben dem Burger, nicht mehr im Panel. */
  .rc-site-navigation .rc-header-tools {
    width: auto;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2px;
    position: static;
    transform: none;
    border-top: 0;
  }

  /* light-mode.css blendet die Suche unter 991px generell aus. In der Kopfzeile
     soll sie sichtbar bleiben; die Sprachwahl bleibt wie bisher verborgen. */
  .rc-site-navigation .navbar-right-contents .rc-search-trigger {
    display: flex;
  }

  /* Die Lupe steht fest auf Hoehe des Burgers und bewegt sich beim Aufklappen
     nicht mit — sie ist immer sichtbar und bedienbar. */
  .rc-site-navigation .navbar-right-contents .rc-search-trigger svg {
    transform: none;
    opacity: 1;
  }

  .rc-site-navigation .rc-language-wrap {
    display: none !important;
  }

  .rc-site-navigation .rc-language-toggle {
    min-height: 44px;
    justify-content: flex-start;
  }

  .rc-site-navigation .rc-language-dropdown .dropdown-content {
    padding-left: 0;
  }

  .rc-site-navigation .rc-search-panel {
    position: fixed;
    top: var(--_navbar---navbar-height);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    transition:
      height var(--rc-mobile-panel-duration) var(--rc-mobile-panel-ease),
      visibility var(--rc-mobile-panel-duration) step-end;
  }

  .rc-site-navigation.is-search-open .rc-search-panel {
    right: 0;
    left: 0;
    bottom: auto;
    height: calc(100dvh - var(--_navbar---navbar-height)) !important;
    min-height: 0;
    max-height: none !important;
    transition:
      height var(--rc-mobile-panel-duration) var(--rc-mobile-panel-ease),
      visibility var(--rc-mobile-panel-duration) step-start;
  }

  .rc-site-navigation .rc-nav-overlay {
    display: none;
  }
}

@media screen and (max-width: 767px) {
  .rc-site-navigation {
    --_grid---grid-window-gutter: 24px;
    --_typography---type-base-unit: 14px;
  }

  .rc-site-navigation .rc-search-panel__results {
    grid-template-columns: 1fr;
  }

  /* Schnellzugriff auf dem Handy groesser und in Schwarz statt abgeblendet. */
  .rc-site-navigation .rc-search-panel__results a,
  .navbar.is-search-open .rc-search-panel__results a {
    padding: 12px 0;
    color: #171717 !important;
    opacity: 1 !important;
    font-size: 1.05rem;
    font-variation-settings: "wght" 350;
  }

  .rc-site-navigation .rc-search-panel__results a::before {
    width: 16px;
    height: 16px;
    -webkit-mask-size: 16px 16px;
    mask-size: 16px 16px;
  }
}

@media screen and (max-width: 479px) {
  .rc-site-navigation {
    --_grid---grid-window-gutter: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .rc-site-navigation *,
  .rc-site-navigation *::before,
  .rc-site-navigation *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    transition-delay: 0ms !important;
  }
}

/* Volltextsuche: verlinkte Inhaltsabschnitte bleiben unter der festen
   Navigation sichtbar, statt an der oberen Viewportkante zu verschwinden. */
body.rc-subpage main section[id] {
  scroll-margin-top: calc(var(--_navbar---navbar-height, 80px) + 16px);
}
/* Die externe Übersetzung läuft unsichtbar hinter der eigenen Sprachwahl. */
#rc-google-translate,
.goog-te-banner-frame,
.goog-te-balloon-frame,
iframe.goog-te-banner-frame,
body > .skiptranslate {
  display: none !important;
}

html,
body {
  top: 0 !important;
}

.goog-text-highlight {
  background: transparent !important;
  box-shadow: none !important;
}

/* Desktop menus remain usable while scripts are loading. */
@media (min-width: 992px) and (hover: hover) {
  .rc-site-navigation .nav-dropdown:hover > .dropdown-wrap {
    opacity: 1; visibility: visible; pointer-events: auto;
    transform: translate3d(0,0,0) scale(1);
  }
  .rc-site-navigation .nav-dropdown:hover .dropdown-link {
    opacity: .68;
    transform: translate3d(0, 0, 0);
  }
  /* Keep the hover target continuous across the gap above the panel. */
  .rc-site-navigation .dropdown-wrap::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -14px;
    height: 14px;
  }
  .rc-site-navigation .nav-dropdown:hover .dropdown-link:hover { background: #e8e8e8; }
}
/* Intrinsic icon sizing prevents oversized SVGs before optional styling arrives. */
.rc-contact-upload__remove svg { width:16px; height:16px; }