.elementor-196 .elementor-element.elementor-element-c3be2e8{--display:flex;--position:fixed;--min-height:100vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;top:0px;}.elementor-196 .elementor-element.elementor-element-c3be2e8:not(.elementor-motion-effects-element-type-background), .elementor-196 .elementor-element.elementor-element-c3be2e8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#F2562300;}body:not(.rtl) .elementor-196 .elementor-element.elementor-element-c3be2e8{left:0px;}body.rtl .elementor-196 .elementor-element.elementor-element-c3be2e8{right:0px;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );font-style:var( --e-global-typography-primary-font-style );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-196 .elementor-element.elementor-element-de8cf86 .elementor-nav-menu .elementor-item{font-family:"Montserrat", Sans-serif;font-size:1.6rem;font-weight:700;font-style:normal;}.elementor-196 .elementor-element.elementor-element-de8cf86 .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-primary );fill:var( --e-global-color-primary );}.elementor-196 .elementor-element.elementor-element-de8cf86 .elementor-nav-menu--main .elementor-item:hover,
					.elementor-196 .elementor-element.elementor-element-de8cf86 .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-196 .elementor-element.elementor-element-de8cf86 .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-196 .elementor-element.elementor-element-de8cf86 .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}@media(max-width:1024px){.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-primary-font-size );}}@media(max-width:767px){.elementor-196 .elementor-element.elementor-element-c3be2e8{--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:center;--margin-top:0vw;--margin-bottom:0vw;--margin-left:0vw;--margin-right:0vw;--padding-top:0vw;--padding-bottom:0vw;--padding-left:0vw;--padding-right:0vw;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-size:var( --e-global-typography-primary-font-size );}.elementor-196 .elementor-element.elementor-element-de8cf86{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-196 .elementor-element.elementor-element-de8cf86 .elementor-nav-menu .elementor-item{font-size:3.1rem;line-height:3.4em;letter-spacing:0px;}}/* Start custom CSS for nav-menu, class: .elementor-element-de8cf86 *//* =========================
   MOBILE NAV MENU WIDGET
   Klasse auf das WordPress Menü Widget:
   mobile_nav_menu

   Aufgabe:
   Box nur so groß wie der Inhalt
========================= */

.mobile_nav_menu {
  width: fit-content !important;
  height: fit-content !important;

  min-width: 0 !important;
  min-height: 0 !important;

  max-width: calc(100vw - 16vw) !important;
  max-height: fit-content !important;

  flex: 0 0 auto !important;
  align-self: center !important;

  margin: 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;
}

.mobile_nav_menu .elementor-widget-container,
.mobile_nav_menu nav {
  width: fit-content !important;
  height: fit-content !important;

  min-width: 0 !important;
  min-height: 0 !important;

  max-width: 100% !important;
  max-height: fit-content !important;

  margin: 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;
}


/* =========================
   MOBILE NAV LISTE
   Aufgabe:
   Linksbündige Liste, aber nur so groß wie nötig
========================= */

.mobile_nav_menu ul,
.mobile_nav_menu .elementor-nav-menu,
.mobile_nav_menu .menu {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;

  gap: 2rem !important;

  width: fit-content !important;
  height: fit-content !important;

  min-width: 0 !important;
  min-height: 0 !important;

  max-width: 100% !important;
  max-height: fit-content !important;

  margin: 0 !important;
  padding: 0 !important;

  list-style: none !important;
  box-sizing: border-box !important;
}


/* =========================
   MOBILE NAV LISTENPUNKTE
========================= */

.mobile_nav_menu li,
.mobile_nav_menu .menu-item {
  width: fit-content !important;
  height: fit-content !important;

  margin: 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;
}


/* =========================
   ELEMENTOR PSEUDO ELEMENTE ZURÜCKSETZEN
   Verhindert komische Balken oder Hintergründe
========================= */

.mobile_nav_menu a::before,
.mobile_nav_menu a::after,
.mobile_nav_menu .elementor-item::before,
.mobile_nav_menu .elementor-item::after {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
}


/* =========================
   MOBILE NAV LINKS
   Typografie und Farbe übernehmen
========================= */

.mobile_nav_menu a,
.mobile_nav_menu .elementor-item {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: baseline !important;
  justify-content: flex-start !important;

  gap: 1.2rem !important;

  width: fit-content !important;
  height: fit-content !important;

  margin: 0 !important;
  padding: 0 !important;

  text-decoration: none !important;
  white-space: nowrap !important;

  background: none !important;

  transform: translateX(0) scale(1);
  transform-origin: left center;

  transition:
    transform 250ms ease,
    opacity 250ms ease,
    filter 250ms ease;
}


/* =========================
   MOBILE NAV ZAHLEN
   01 / 02 / 03
   Gleiche Größe, Farbe und Höhe wie der Link
========================= */

.mobile_nav_menu .elementor-nav-menu > li:nth-child(1) > a::before,
.mobile_nav_menu .menu > li:nth-child(1) > a::before,
.mobile_nav_menu ul > li:nth-child(1) > a::before {
  content: "01" !important;
}

.mobile_nav_menu .elementor-nav-menu > li:nth-child(2) > a::before,
.mobile_nav_menu .menu > li:nth-child(2) > a::before,
.mobile_nav_menu ul > li:nth-child(2) > a::before {
  content: "02" !important;
}

.mobile_nav_menu .elementor-nav-menu > li:nth-child(3) > a::before,
.mobile_nav_menu .menu > li:nth-child(3) > a::before,
.mobile_nav_menu ul > li:nth-child(3) > a::before {
  content: "03" !important;
}

.mobile_nav_menu a::before,
.mobile_nav_menu .elementor-item::before {
  position: static !important;

  display: inline-block !important;
  flex: 0 0 auto !important;

  width: auto !important;
  height: auto !important;

  font-family: inherit !important;
  font-size: 1em !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  letter-spacing: inherit !important;
  color: currentColor !important;

  opacity: 1 !important;

  background: none !important;
  border: none !important;
  box-shadow: none !important;

  transform: none !important;
}


/* =========================
   HOVER AUF AKTIVEM MENÜPUNKT
========================= */

.mobile_nav_menu a:hover,
.mobile_nav_menu .elementor-item:hover {
  transform: translateX(5px) scale(1.01);
}


/* =========================
   BLUR AUF NICHT AKTIVEN MENÜPUNKTEN
========================= */

.mobile_nav_menu ul:has(> li:hover) > li:not(:hover) > a,
.mobile_nav_menu .elementor-nav-menu:has(> li:hover) > li:not(:hover) > a,
.mobile_nav_menu .menu:has(> li:hover) > li:not(:hover) > a,
.mobile_nav_menu ul:has(> li:hover) > li:not(:hover) > .elementor-item,
.mobile_nav_menu .elementor-nav-menu:has(> li:hover) > li:not(:hover) > .elementor-item,
.mobile_nav_menu .menu:has(> li:hover) > li:not(:hover) > .elementor-item {
  filter: blur(3px) !important;
  opacity: 0.35 !important;
  transform: translateX(0) scale(0.98) !important;
}


/* =========================
   AKTIVER HOVER PUNKT BLEIBT SCHARF
========================= */

.mobile_nav_menu li:hover > a,
.mobile_nav_menu .menu-item:hover > a,
.mobile_nav_menu li:hover > .elementor-item,
.mobile_nav_menu .menu-item:hover > .elementor-item {
  filter: blur(0) !important;
  opacity: 1 !important;
  transform: translateX(5px) scale(1.01) !important;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-c3be2e8 *//* =========================
   MOBILE NAV BACKGROUND
  
========================= */

.mobile_nav_bg {
  position: fixed !important;
  inset: 0 !important;

  width: 100vw !important;
  height: 100vh !important;

  overflow: hidden !important;
  box-sizing: border-box !important;

  background-color: rgba(23, 23, 23, 0.88) !important;

  background-image:
    radial-gradient(
      circle,
      rgba(242, 86, 35, 0.48) 0%,
      rgba(242, 86, 35, 0.28) 24%,
      rgba(242, 86, 35, 0.10) 48%,
      rgba(242, 86, 35, 0.00) 72%
    ),
    radial-gradient(
      circle,
      rgba(242, 86, 35, 0.42) 0%,
      rgba(242, 86, 35, 0.24) 26%,
      rgba(242, 86, 35, 0.09) 50%,
      rgba(242, 86, 35, 0.00) 74%
    );

  background-repeat: no-repeat;
  background-position:
    -28vw -22vh,
    calc(100% + 30vw) calc(100% + 24vh);

  background-size:
    72vw 72vw,
    76vw 76vw;

  backdrop-filter: blur(24px) saturate(160%) contrast(1.08);
  -webkit-backdrop-filter: blur(24px) saturate(160%) contrast(1.08);

  animation: mobileNavBlobBackground 7s ease-in-out infinite alternate;
}


/* =========================
   MOBILE NAV BACKGROUND ANIMATION
   
========================= */

@keyframes mobileNavBlobBackground {
  0% {
    background-position:
      -28vw -22vh,
      calc(100% + 30vw) calc(100% + 24vh);

    background-size:
      72vw 72vw,
      76vw 76vw;

    filter: saturate(130%) brightness(1);
  }

  45% {
    background-position:
      -18vw -14vh,
      calc(100% + 20vw) calc(100% + 16vh);

    background-size:
      84vw 84vw,
      90vw 90vw;

    filter: saturate(185%) brightness(1.12);
  }

  100% {
    background-position:
      -24vw -8vh,
      calc(100% + 26vw) calc(100% + 10vh);

    background-size:
      78vw 78vw,
      84vw 84vw;

    filter: saturate(155%) brightness(1.06);
  }
}/* End custom CSS */