.elementor-147 .elementor-element.elementor-element-fdf4f80{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--margin-top:0vw;--margin-bottom:-15vw;--margin-left:0vw;--margin-right:0vw;--padding-top:1vw;--padding-bottom:1vw;--padding-left:5vw;--padding-right:5vw;--z-index:100;}.elementor-147 .elementor-element.elementor-element-fdf4f80:not(.elementor-motion-effects-element-type-background), .elementor-147 .elementor-element.elementor-element-fdf4f80 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF00;}.elementor-147 .elementor-element.elementor-element-2ef5efb{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-size:var( --e-global-typography-text-font-size );font-weight:var( --e-global-typography-text-font-weight );}.elementor-147 .elementor-element.elementor-element-a13bca0{text-align:start;}.elementor-147 .elementor-element.elementor-element-a13bca0 img{width:50%;max-width:100%;}.elementor-147 .elementor-element.elementor-element-c2282c5{--display:flex;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-147 .elementor-element.elementor-element-c2282c5.e-con{--align-self:center;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.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-147 .elementor-element.elementor-element-98c12c6{width:auto;max-width:auto;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;z-index:9999;}.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-menu-toggle{margin:0 auto;}.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-nav-menu--dropdown a, .elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-menu-toggle{color:#000000;fill:#000000;}.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-nav-menu--dropdown{background-color:#FFFFFF;}.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-nav-menu--dropdown a:hover,
					.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-nav-menu--dropdown a:focus,
					.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-nav-menu--dropdown a.elementor-item-active,
					.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-nav-menu--dropdown a.highlighted{background-color:var( --e-global-color-af7b294 );}.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-nav-menu--dropdown a.elementor-item-active{color:#000000;background-color:var( --e-global-color-af7b294 );}.elementor-147 .elementor-element.elementor-element-98c12c6 .elementor-nav-menu--dropdown .elementor-item, .elementor-147 .elementor-element.elementor-element-98c12c6 .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-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-147 .elementor-element.elementor-element-a13bca0{z-index:2000003;}.elementor-147 .elementor-element.elementor-element-a13bca0 img{width:70%;}}@media(max-width:767px){.elementor-147 .elementor-element.elementor-element-fdf4f80{--justify-content:center;--margin-top:0vw;--margin-bottom:-20vw;--margin-left:0vw;--margin-right:0vw;--padding-top:3vw;--padding-bottom:3vw;--padding-left:5vw;--padding-right:5vw;}.elementor-147 .elementor-element.elementor-element-fdf4f80.e-con{--align-self:center;}.elementor-147 .elementor-element.elementor-element-2ef5efb{--width:50%;--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-147 .elementor-element.elementor-element-2ef5efb.e-con{--align-self:center;}.elementor-widget-theme-site-logo .widget-image-caption{font-size:var( --e-global-typography-text-font-size );}.elementor-147 .elementor-element.elementor-element-a13bca0 img{width:100%;}.elementor-147 .elementor-element.elementor-element-c2282c5{--width:15%;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );}.elementor-147 .elementor-element.elementor-element-98c12c6{margin:0vw 0vw calc(var(--kit-widget-spacing, 0px) + 0vw) 0vw;padding:0vw 0vw 0vw 0vw;}.elementor-147 .elementor-element.elementor-element-98c12c6.elementor-element{--align-self:center;}}@media(min-width:768px){.elementor-147 .elementor-element.elementor-element-2ef5efb{--width:100%;}}/* Start custom CSS for nav-menu, class: .elementor-element-98c12c6 *//* 2. Horizontale Liste verstecken */
#mein-desktop-burger .elementor-nav-menu--main {
    display: none !important;
}



/* Den Burger-Button wieder in den Container-Fluss bringen */
#mein-desktop-burger .elementor-menu-toggle {
    display: flex !important;
    position: relative !important; /* Geändert von fixed auf relative */
   
    z-index: 2000001 !important;
    
}

/* Den grauen Hintergrund des Buttons entfernen */
#mein-desktop-burger .elementor-menu-toggle {
    background-color: transparent !important; /* Entfernt die Hintergrundfarbe */
    border: none !important;                  /* Entfernt eventuelle Rahmen */
    box-shadow: none !important;              /* Entfernt eventuelle Schatten */
}

/* Optional: Hintergrund auch beim Drüberfahren (Hover) entfernen */
#mein-desktop-burger .elementor-menu-toggle:hover {
    background-color: transparent !important;
}

/* Das gesamte Widget nach rechts schieben */
.elementor-147 .elementor-element.elementor-element-98c12c6 {
    margin-left: auto !important;
    margin-right: 0 !important;
    width: auto !important; /* Verhindert, dass das Widget 100% einnimmt */
    display: flex !important;
    justify-content: flex-end !important;
}

/* Den Button selbst bereinigen */
#mein-desktop-burger .elementor-menu-toggle {
    display: flex !important;
    position: relative !important;
  
}



/* Falls du SVGs statt Icons nutzt (Elementor Standard) */
#mein-desktop-burger .elementor-menu-toggle svg {
    width: 40px !important;  /* Breite des Burgers */
    height: auto !important;
}


/* --- TABLET (max 1024px) --- */
@media (max-width: 1024px) {
    #mein-desktop-burger .elementor-menu-toggle svg {
        width: 25px !important;
    }
}

/* --- MOBILE (max 767px) --- */
@media (max-width: 767px) {

    
    #mein-desktop-burger .elementor-menu-toggle svg {
        width: 20px !important;
    }

    /* Falls der Burger auf Mobile zu weit am Rand klebt */
    #mein-desktop-burger .elementor-menu-toggle {
        padding-right: 15px !important;
    }
}



/* Den Klick-Bereich des Buttons anpassen */
#mein-desktop-burger .elementor-menu-toggle {
    width: auto !important;
    height: auto !important;
    padding: 10px !important; /* Etwas Puffer zum Klicken */
}

/* Der weiße Kasten - Echte Zentrierung und feste Mindesthöhe */
div#mein-desktop-burger.is-active .elementor-nav-menu--dropdown {
    display: flex !important;
    flex-direction: column !important;

    
  /* POSITIONIERUNG */
    position: fixed !important;   /* Bezieht sich auf das gesamte Browserfenster */
    top: 12% !important;            /* Ganz oben am Rand */
    right: 0 !important;          /* Ganz rechts am Rand */
    left: auto !important;        /* Wichtig: Hebt linke Ausrichtung auf */
    transform: none !important;   /* Entfernt die Zentrierung */
  
    
    /* Hier erzwingen wir die Größe */
    width: 270px !important; 
    height: auto !important;     /* 80% der Bildschirmhöhe */
    min-height: 350px !important; /* Verhindert, dass es zu schmal wird */
    
    border-radius: 0px 44px 0px 44px !important;
    
    
        /* 2. DER INNENABSTAND: Hier steuerst du den weißen Rand oben und unten */
    /* Wert 1: Oben | Wert 2: Rechts | Wert 3: Unten | Wert 4: Links */
    padding: 30px 4px 10px 4px !important; 
  
    
    background-color: #ffffff !important;
   /* Der angepasste Schatten nur nach unten */
    box-shadow: 0px 15px 30px -5px rgba(0,0,0,0.1) !important;
    z-index: 2000000 !important;
  
    opacity: 1 !important;
    visibility: visible !important;
}

/* 1. Wenn das Menü offen ist (.is-active), verstecke das normale Burger-Icon */
#mein-desktop-burger.is-active .elementor-menu-toggle svg:nth-child(1) {
    display: none !important;
}

/* 2. Wenn das Menü offen ist, zeige das zweite Icon (das X) */
#mein-desktop-burger.is-active .elementor-menu-toggle svg:nth-child(2) {
    display: block !important;
    width: 30px !important; /* Größe des X anpassen */
    height: auto !important;
    fill: #4A4A4A !important; /* Farbe des X, falls es unsichtbar ist */
}

/* Falls Elementor die Icons nicht als Kinder, sondern über Klassen steuert: */
#mein-desktop-burger.is-active .e-font-icon-svg {
    /* Stellt sicher, dass das aktive Icon Vorrang hat */
}


/* 1. Farbe für das normale Burger-Icon */
#mein-desktop-burger .elementor-menu-toggle svg {
    fill: #646363 !important;
    color: #646363 !important; /* Sicherheitshalber für Icon-Fonts */
    transition: fill 0.3s ease; /* Macht den Farbwechsel beim Klicken weicher */
}

/* 2. Farbe für das X (wenn das Menü offen ist) */
#mein-desktop-burger.is-active .elementor-menu-toggle svg {
    fill: #646363 !important;
    color: #646363 !important;
}

/* 3. Optional: Farbe beim Drüberfahren (Hover) */
#mein-desktop-burger .elementor-menu-toggle:hover svg {
    fill: #4A4A4A !important; /* Ein etwas dunkleres Grau beim Hovern */
}



/* Alle Menüpunkte untereinander stapeln */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown ul.elementor-nav-menu {
    display: flex !important;
    flex-direction: column !important; 
    justify-content: center !important;
    align-items: center !important;

    height: 100% !important; /* Nutzt die volle Höhe des weißen Kastens */

}

/* 1. Hintergrund und Textfarbe für die aktuelle Seite */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown .current-menu-item a {
    background-color: #C3AC48!important; /* Dein Goldton */
    color: #ffffff !important;           /* Weißer Text */
    
    /* Falls du das Padding für die Balkenlänge nutzt: */
    padding: 10px 40px !important; 
    display: inline-block !important;
}




/* 1. Die Grundform für ALLE Menüpunkte im Dropdown */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown a {
    font-size: 22px !important;
    font-weight: 300 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    color: #646363 !important;
    display: inline-block !important;
    width: 220px !important;
    text-align: center !important;
    padding: 10px 0px !important;
    transition: all 0.3s ease;

    /* DIE FORM: Oben-Links: 0 | Oben-Rechts: 44 | Unten-Rechts: 0 | Unten-Links: 44 */
    border-radius: 0px 44px 0px 44px !important; 
}

/* 2. HOVER & AKTIVE SEITE (Goldener Balken) */
/* Hier stellen wir sicher, dass die Form beim Drüberfahren exakt gleich bleibt */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown a:hover,
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown .current-menu-item a {
    background-color: #C3AC48 !important;
    color: #ffffff !important;
    
    /* Wichtig: Hier darf kein anderer Radius stehen! */
    border-radius: 0px 44px 0px 44px !important;
}

/* 3. OPTIONAL: Der weiße Kasten selbst (falls der auch so aussehen soll) */
div#mein-desktop-burger.is-active .elementor-nav-menu--dropdown {
    border-radius: 0px 44px 0px 44px !important;
}





/* 1. DER BURGER IM HEADER (IMMER MITTIG) */
#mein-desktop-burger .elementor-menu-toggle {
    display: flex !important;
    position: absolute !important; 
    top: 50% !important;
    right: 20px !important;
    transform: translateY(-50%) !important; /* Zwingt das Icon exakt in die vertikale Mitte */
    
    z-index: 2000001 !important;
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
}




/* 2. DIE LISTE DARIN BEREINIGEN */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown ul.elementor-nav-menu {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    
    /* WICHTIG: Alle Standard-Abstände von Elementor löschen */
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    gap: 8px !important; /* Dein Abstand zwischen den Wörtern */
}

/* 1. DIE LINKS - Hier legen wir die feste Breite fest */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown a {
    display: inline-block !important; /* WICHTIG: Damit width und padding funktionieren */
    
    /* DIE BREITE: Hier stellst du ein, wie breit alle Balken sein sollen */
    width: 220px !important; 
    text-align: center !important; /* Zentriert das Wort im Balken */
    
    /* PADDING: Nur noch für oben/unten wichtig, links/rechts regelt jetzt die 'width' */
    padding: 10px 0px !important; 
    
    /* Ändere diesen Wert an allen Stellen, wo 'border-radius' vorkommt: */

    
    /* Deine restlichen Styles (Farbe, Font etc.) */
    color: #646363 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    transition: all 0.3s ease;
}

/* 2. HOVER & AKTIVE SEITE - Gleiche Optik für beide */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown a:hover,
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown .current-menu-item a {
    background-color: #C3AC48 !important;
    color: #ffffff !important;
    
    /* Sicherstellen, dass die Breite auch hier bleibt */
    width: 220px !important; 
    
      border-radius: 0px 44px 0px 44px !important;
}

/* 1. Die normalen Links & Hover-Zustand */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown a,
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown a:hover {
    /* ... deine restlichen Styles ... */
    
    border-radius: 0px 44px 0px 44px !important; /* LINKS UNTEN & RECHTS OBEN RUND */
}



/* 3. OPTIK-KORREKTUR FÜR DEN LETZTEN PUNKT */
#mein-desktop-burger.is-active .elementor-nav-menu--dropdown ul.elementor-nav-menu li:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}





/* --- TABLET-ANSICHT (768px bis 1024px) --- */
@media (min-width: 768px) and (max-width: 1024px) {
    
    /* Die Menü-Links im Dropdown auf 18px festlegen */
    div#mein-desktop-burger.is-active .elementor-nav-menu--dropdown a {
        font-size: 20px !important;
        letter-spacing: 1px !important; /* Optional: Abstand etwas verringern */
        padding: 10px 20px !important;   /* Optional: Falls der goldene Balken zu groß ist */
        color: #646363 !important; /* Deine gewünschte Farbe */
    }

    /* Optional: Den Abstand zwischen den Wörtern auf Tablet anpassen */
    div#mein-desktop-burger.is-active .elementor-nav-menu--dropdown ul.elementor-nav-menu {
        gap: 8px !important; 
    }
    
    
    
    
        /* Der weiße Kasten - Echte Zentrierung und feste Mindesthöhe */
div#mein-desktop-burger.is-active .elementor-nav-menu--dropdown {


    

    
    /* Hier erzwingen wir die Größe */
    width: 250px !important; 
    height: auto !important;     /* 80% der Bildschirmhöhe */
    min-height: 350px !important; /* Verhindert, dass es zu schmal wird */
    

}
    
}




/* 3. RESPONSIVE OPTIMIERUNG (MOBILE) */
@media (max-width: 767px) {
    /* Burger auf Mobile mittig halten */
    #mein-desktop-burger .elementor-menu-toggle {
        right: 15px !important;
    }
    
    #mein-desktop-burger .elementor-menu-toggle svg {
        width: 25px !important; /* Etwas kleiner auf dem Handy */
    }


    
    /* Der weiße Kasten - Echte Zentrierung und feste Mindesthöhe */
div#mein-desktop-burger.is-active .elementor-nav-menu--dropdown {
    display: flex !important;
    flex-direction: column !important;

    
  /* POSITIONIERUNG */
    position: fixed !important;   /* Bezieht sich auf das gesamte Browserfenster */
    top: 7% !important;            /* Ganz oben am Rand */
    right: 0 !important;          /* Ganz rechts am Rand */
    left: auto !important;        /* Wichtig: Hebt linke Ausrichtung auf */
    transform: none !important;   /* Entfernt die Zentrierung */
  
    
    /* Hier erzwingen wir die Größe */
    width: 250px !important; 
    height: auto !important;     /* 80% der Bildschirmhöhe */
    min-height: 350px !important; /* Verhindert, dass es zu schmal wird */
    
    border-radius: 0px 44px 0px 44px !important;
    
    
        /* 2. DER INNENABSTAND: Hier steuerst du den weißen Rand oben und unten */
    /* Wert 1: Oben | Wert 2: Rechts | Wert 3: Unten | Wert 4: Links */
    padding: 30px 4px 0px 4px !important; 
  
    
    background-color: #ffffff !important;
    box-shadow: 0px 0px 60px rgba(0,0,0,0) !important;
    z-index: 2000000 !important;
  
    opacity: 1 !important;
    visibility: visible !important;
}
    


    /* Schrift im Menü auf Mobile */
    #mein-desktop-burger.is-active .elementor-nav-menu--dropdown a {
        font-size: 18px !important;
        letter-spacing: 2px !important;
 
         /* HIER DIE ANPASSUNG: */
    /* Wert 1: Oben/Unten (z.B. 10px) | Wert 2: Links/Rechts (hier erhöhen!) */
    padding: 10px 40px !important;
    color: #646363 !important; /* Deine gewünschte Farbe */
    }
    
    /* Abstände der Menüpunkte */
    #mein-desktop-burger.is-active .elementor-nav-menu--dropdown ul.elementor-nav-menu {
        gap: 8px !important;
        
        
    }
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-fdf4f80 *//* Grundzustand: Transparent */
.elementor-147 .elementor-element.elementor-element-fdf4f80.elementor-sticky--effects {
    background-color: rgba(255, 255, 255, 1) !important; /* Weiß beim Scrollen */
    transition: background-color 0.4s ease-in-out;
    box-shadow: 0px 5px 10px rgba(0,0,0,0.1); /* Optionaler Schatten */
}

.elementor-147 .elementor-element.elementor-element-fdf4f80 {
    transition: background-color 0.4s ease-in-out;
}


/* Erzeugt ein Flex-Layout, das alle Kinder vertikal zentriert */
.elementor-147 .elementor-element.elementor-element-fdf4f80 {
    display: flex !important;
    align-items: center !important; /* Vertikale Zentrierung */
    justify-content: space-between !important; /* Logo links, Menü rechts */
}

/* Stellt sicher, dass die inneren Elemente keine eigenen störenden Margins haben */
.elementor-147 .elementor-element.elementor-element-fdf4f80 > .elementor-container > .elementor-column > .elementor-widget-wrap,
.elementor-147 .elementor-element.elementor-element-fdf4f80 > .elementor-widget-wrap {
    display: flex !important;
    align-items: center !important;
}/* End custom CSS */