/* One navigation interaction across the complete RIVER website. */
@media (min-width: 761px) {
  .site-header .nav-links > a:not(.nav-demo-mobile),
  .site-header .nav-links .nav-product > .nav-product-link {
    position: relative;
    padding: 6px 10px !important;
    border: 1px solid transparent !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  .site-header .nav-links > a:not(.nav-demo-mobile)::before,
  .site-header .nav-links .nav-product > .nav-product-link::before {
    display: none !important;
    content: none !important;
  }

  .site-header .nav-links > a:not(.nav-demo-mobile)::after,
  .site-header .nav-links .nav-product > .nav-product-link::after {
    content: "";
    position: absolute;
    right: 9px;
    bottom: 2px;
    left: 9px;
    height: 1px;
    background: currentColor;
    opacity: 0;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 360ms cubic-bezier(0.16, 1, 0.3, 1), opacity 220ms ease;
    pointer-events: none;
  }

  .site-header .nav-links > a:not(.nav-demo-mobile):hover::after,
  .site-header .nav-links > a:not(.nav-demo-mobile):focus-visible::after,
  .site-header .nav-links .nav-product > .nav-product-link:hover::after,
  .site-header .nav-links .nav-product > .nav-product-link:focus-visible::after {
    opacity: 0.72;
    transform: scaleX(1);
  }

  .site-header .landing-nav-hover-label,
  .site-header .landing-nav-hover-label:hover,
  .site-header a:hover > .landing-nav-hover-label,
  .site-header a:focus-visible > .landing-nav-hover-label {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  .site-header .nav-product-option,
  .site-header .nav-product-option:hover,
  .site-header .nav-product-option:focus-visible,
  .site-header .nav-product-copy,
  .site-header .nav-product-option:hover .nav-product-copy,
  .site-header .nav-product-option:focus-visible .nav-product-copy,
  .site-header .nav-product-option.nav-hover-active .nav-product-copy {
    border-color: transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  .site-header .nav-product-option .nav-product-name {
    text-decoration-line: underline;
    text-decoration-color: transparent;
    text-decoration-thickness: 1px;
    text-underline-offset: 5px;
    transition: text-decoration-color 280ms ease;
  }

  .site-header .nav-product-option:not(.nav-product-option-disabled):hover .nav-product-name,
  .site-header .nav-product-option:not(.nav-product-option-disabled):focus-visible .nav-product-name {
    text-decoration-color: currentColor;
  }

  .site-header .header-demo:hover,
  .site-header .header-demo:focus-visible {
    color: #fff !important;
    background: #0b0b0b !important;
    border-color: #0b0b0b !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 4px;
  }

  /*
   * Final, high-specificity reset. The legacy navigation styles use
   * parent :hover/:focus-within selectors, so moving from "Produkte" or
   * "Preise" into its panel used to bring the rounded background back.
   */
  html body .site-header .nav-links > a:not(.nav-demo-mobile),
  html body .site-header .nav-links > a:not(.nav-demo-mobile):hover,
  html body .site-header .nav-links > a:not(.nav-demo-mobile):focus-visible,
  html body .site-header .nav-links .nav-product > .nav-product-link,
  html body .site-header .nav-links .nav-product > .nav-product-link:hover,
  html body .site-header .nav-links .nav-product > .nav-product-link:focus-visible,
  html body .site-header .nav-links .nav-product:hover > .nav-product-link,
  html body .site-header .nav-links .nav-product:focus-within > .nav-product-link {
    color: inherit !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  html body[data-theme] .site-header .nav-links > a:not(.nav-demo-mobile),
  html body[data-theme] .site-header .nav-links > a:not(.nav-demo-mobile):hover,
  html body[data-theme] .site-header .nav-links > a:not(.nav-demo-mobile):focus-visible,
  html body[data-theme] .site-header .nav-links .nav-product > .nav-product-link,
  html body[data-theme] .site-header .nav-links .nav-product > .nav-product-link:hover,
  html body[data-theme] .site-header .nav-links .nav-product > .nav-product-link:focus-visible,
  html body[data-theme] .site-header .nav-links .nav-product:hover > .nav-product-link,
  html body[data-theme] .site-header .nav-links .nav-product:focus-within > .nav-product-link {
    color: inherit !important;
    border-color: transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  html body .site-header .nav-links .landing-nav-hover-label,
  html body .site-header .nav-links > a:hover .landing-nav-hover-label,
  html body .site-header .nav-links > a:focus-visible .landing-nav-hover-label,
  html body .site-header .nav-links .nav-product:hover > .nav-product-link .landing-nav-hover-label,
  html body .site-header .nav-links .nav-product:focus-within > .nav-product-link .landing-nav-hover-label {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  html body .site-header .nav-product-dropdown .nav-product-option,
  html body .site-header .nav-product-dropdown .nav-product-option:hover,
  html body .site-header .nav-product-dropdown .nav-product-option:focus-visible,
  html body .site-header .nav-product-dropdown .nav-product-option.nav-hover-active,
  html body .site-header .nav-product-dropdown .nav-product-copy,
  html body .site-header .nav-product-dropdown .nav-product-option:hover .nav-product-copy,
  html body .site-header .nav-product-dropdown .nav-product-option:focus-visible .nav-product-copy,
  html body .site-header .nav-product-dropdown .nav-product-option.nav-hover-active .nav-product-copy {
    border-color: transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  html body[data-theme] .site-header .nav-product-dropdown .nav-product-option,
  html body[data-theme] .site-header .nav-product-dropdown .nav-product-option:hover,
  html body[data-theme] .site-header .nav-product-dropdown .nav-product-option:focus-visible,
  html body[data-theme] .site-header .nav-product-dropdown .nav-product-option.nav-hover-active,
  html body[data-theme] .site-header .nav-product-dropdown .nav-product-copy,
  html body[data-theme] .site-header .nav-product-dropdown .nav-product-option:hover .nav-product-copy,
  html body[data-theme] .site-header .nav-product-dropdown .nav-product-option:focus-visible .nav-product-copy,
  html body[data-theme] .site-header .nav-product-dropdown .nav-product-option.nav-hover-active .nav-product-copy {
    border-color: transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  /* The underline belongs only to the exact word under the cursor. */
  html body .site-header .nav-product:hover > .nav-product-link:not(:hover)::after,
  html body .site-header .nav-product:focus-within > .nav-product-link:not(:hover)::after {
    opacity: 0 !important;
    transform: scaleX(0) !important;
  }
}

@media (max-width: 760px) {
  .site-header .nav-links a:hover,
  .site-header .nav-links a:focus-visible,
  .site-header .nav-product-link:hover,
  .site-header .nav-product-link:focus-visible,
  .site-header .nav-product-option:hover,
  .site-header .nav-product-option:focus-visible,
  .site-header .nav-product-copy,
  .site-header .nav-product-option:hover .nav-product-copy {
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    transform: none !important;
  }

  .site-header .nav-links a:hover,
  .site-header .nav-links a:focus-visible,
  .site-header .nav-product-link:hover,
  .site-header .nav-product-link:focus-visible {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 5px;
  }
}
