/*
	Theme Name: Hello Elementor
	Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
	Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
	Author: Elementor Team
	Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
	Version: 3.4.9
	Stable tag: 3.4.9
	Requires at least: 6.0
	Tested up to: 6.8
	Requires PHP: 7.4
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: hello-elementor
	Tags: accessibility-ready, flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready,
*/
 /* ==========================================================================
   GLOBAL SETTINGS (Ausblendungen & Logo)
   ========================================================================== */
/* ==========================================================================
   GLOBAL SETTINGS (Ausblendungen & Logo)
   ========================================================================== */
.page-header .entry-title {
  display: none !important;
}

/* Verhindert, dass das Logo die Seite sprengt */
.custom-logo {
  max-width: 320px !important;
  height: auto !important;
  display: block !important;
}

/* ==========================================================================
   EBENE 1: LOGO LINKS, NAVI RECHTS (Nebeneinander statt untereinander)
   ========================================================================== */

/* Der weiße Haupt-Header */
header.site-header {
  background-color: #ffffff !important;
  width: 100% !important;
  display: block !important;
  box-sizing: border-box !important;
  position: relative !important;
}

/* ÄNDERUNG: Macht die 1140px-Box zu einer Reihe (Flex-Row) */
header.site-header .header-inner {
  display: flex !important;
  flex-direction: row !important; /* Logo und Navi nebeneinander! */
  justify-content: space-between !important; /* Schiebt Logo nach links, Navi nach rechts */
  align-items: center !important; /* Zentriert beide vertikal zueinander */
  padding: 25px 0 !important; /* Angenehmer Abstand nach oben und unten */
  max-width: 1140px !important; /* Behält Ihre gewünschte Inhaltsbreite */
  margin: 0 auto !important; /* Zentriert die gesamte Box auf dem Bildschirm */
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Der Logo-Bereich (Kein Abstand mehr nach unten nötig) */
header.site-header .site-branding {
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
}

/* Zwingt die Navigation in die waagerechte Reihe mit viel Platz */
nav.site-navigation {
  display: flex !important;
  justify-content: flex-end !important; /* Richtet die Schrift nach rechts aus */
  background: transparent !important;
  box-shadow: none !important;
}

/* Die Menüpunkte (ul) schön aufreihen */
#menu-main-menu-1 {
  display: flex !important;
  flex-direction: row !important; /* Waagerecht nebeneinander */
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 30px !important; /* Perfekter Platz zwischen den Wörtern */
  align-items: center !important;
}

/* Die Links formatieren */
#menu-main-menu-1 li a {
  font-family: 'Open Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #222529 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  letter-spacing: 0.8px !important;
  padding: 5px 0 !important;
  display: inline-block !important;
}

/* Hover- & Aktiv-Zustand (Weinrot) */
#menu-main-menu-1 li a:hover,
#menu-main-menu-1 li.current-menu-item a {
  color: #7d091e !important;
}

/* Verhindert mobiles Hamburger-Menü auf Desktop */
.site-navigation-toggle-holder,
.site-navigation-dropdown {
  display: none !important;
}

/* ==========================================================================
   EBENE 2: LEISTUNGS-ICON-MENÜ (Ganz unten, Volle Breite in Weinrot)
   ========================================================================== */
.leistungs-icon-menu {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  background-color: #7d091e !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.12) !important;
  box-sizing: border-box !important;
}

.leistungs-icon-menu .icon-box-item {
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 18px 10px !important;
  text-align: center !important;
  text-decoration: none !important;
  color: #ffffff !important;
  border-right: 1px solid rgba(255, 255, 255, 0.15) !important;
  transition: background-color 0.2s ease !important;
}

.leistungs-icon-menu .icon-box-item:last-child {
  border-right: none !important;
}

.leistungs-icon-menu .icon-placeholder {
  font-size: 22px !important;
  margin-bottom: 6px !important;
}

.leistungs-icon-menu .icon-title {
  font-family: 'Open Sans', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.6px !important;
  color: #ffffff !important;
}

.leistungs-icon-menu .icon-box-item:hover {
  background-color: #5c0514 !important;
}

/* ==========================================================================
   MOBILE OPTIMIERUNG (Smartphones)
   ========================================================================== */
@media (max-width: 767px) {
  header.site-header .header-inner {
    padding: 20px !important;
    align-items: center !important;
    text-align: center !important;
  }
  
  nav.site-navigation,
  nav.site-navigation ul.menu {
    flex-wrap: wrap !important;
    gap: 15px !important;
    justify-content: center !important;
  }

  .leistungs-icon-menu {
    flex-direction: column !important;
  }
  
  .leistungs-icon-menu .icon-box-item {
    border-right: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    padding: 12px !important;
  }
}

/* ==========================================================================
   BREAKOUT: MOBILE BLOCKADE DES HELLO THEMES DEAKTIVIEREN
   ========================================================================== */

/* 1. Verhindert, dass das Theme das Desktop-Menü wie ein Handy-Menü behandelt */
.site-header.menu-dropdown-tablet .site-navigation,
.site-header.dynamic-header .site-navigation {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 60% !important;
}

/* 2. Zwingt die Liste bedingungslos in eine waagerechte Reihe nebeneinander */
.site-header.menu-dropdown-tablet nav.site-navigation ul.menu,
.site-header.dynamic-header #menu-main-menu-1,
#site-header #menu-main-menu-1 {
  display: flex !important;
  flex-direction: row !important; /* REIHE NEBENEINANDER */
  flex-wrap: nowrap !important; /* Verhindert das Umbrechen */
  list-style: none !important;
  gap: 35px !important; /* Perfekter Abstand zwischen den Menüpunkten */
  justify-content: flex-start !important;
  align-items: center !important;
}

/* 3. Schaltet das fälschlicherweise geladene mobile Dropdown-Menü komplett ab */
.site-navigation-toggle-holder,
.site-navigation-dropdown,
button.site-navigation-toggle {
  display: none !important;
}

/* 4. Formatiert die Menülinks sauber in dunklem Anthrazit */
#menu-main-menu-1 li a {
  font-family: 'Open Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #222529 !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  letter-spacing: 1px !important;
  display: inline-block !important;
  position: relative !important;
}

/* Hover- & Aktiv-Zustand für die Text-Links (Weinrot) */
#menu-main-menu-1 li a:hover,
#menu-main-menu-1 li.current-menu-item a {
  color: #7d091e !important;
}

/* ==========================================================================
   FINALTUNING: SCHRIFT REPRÄSENTATIV & NACH UNTEN AUSRICHTEN
   ========================================================================== */

/* Richtet das gesamte Menüband vertikal weiter nach unten aus, bündig zur Logo-Unterkante */
nav.site-navigation {
  margin-top: 22px !important; /* Schiebt die Navigation elegant nach unten */
}

/* Macht die Menüpunkte größer, dünner und edler */
#menu-main-menu-1 li a {
  font-family: 'Open Sans', sans-serif !important;
  font-size: 16px !important;       /* ÄNDERUNG: Größere Schrift für bessere Lesbarkeit */
  font-weight: 400 !important;      /* ÄNDERUNG: Schlank (dünner) statt fett für edle Optik */
  letter-spacing: 1.5px !important; /* Etwas mehr Zeichenabstand für modernen Look */
  color: #222529 !important;
  text-transform: uppercase !important;
  transition: color 0.25s ease !important;
}

/* Hover- & Aktiv-Zustand (Weinrot) */
#menu-main-menu-1 li a:hover,
#menu-main-menu-1 li.current-menu-item a {
  color: #7d091e !important;
  font-weight: 400 !important; /* Bleibt elegant dünner auch beim Drüberfahren */
}

/* Eine feine weinrote Unterstreichungslinie, die perfekt mitschwebt */
#menu-main-menu-1 li a::after {
  content: '' !important;
  position: absolute !important;
  width: 0;
  height: 1px !important; /* Schön dünne, elegante Linie */
  bottom: -6px !important;
  left: 0;
  background-color: #7d091e !important;
  transition: width 0.25s ease !important;
}

#menu-main-menu-1 li a:hover::after,
#menu-main-menu-1 li.current-menu-item a::after {
  width: 100% !important;
}

/* ==========================================================================
   EIN FÜR ALLE MAL: WEISSES HOME-ICON EXAKT IN PRAXIS-WEINROT (#7d091e)
   ========================================================================== */
/* ==========================================================================
   EIN FÜR ALLE MAL: WEISSES HOME-ICON EXAKT IN PRAXIS-WEINROT (#7d091e)
   ========================================================================== */
nav.site-navigation ul.menu li a img,
#menu-main-menu-1 li a img {
  /* Berechneter Filter, der Weiß zu 100% in #7d091e verwandelt */
  filter: invert(11%) sepia(84%) saturate(4155%) hue-rotate(338deg) brightness(83%) contrast(95%) !important;
  
  display: inline-block !important;
  vertical-align: middle !important;
  transition: transform 0.25s ease, opacity 0.25s ease !important;
}

/* Weicher Übergang beim Drüberfahren (Hover) */
nav.site-navigation ul.menu li a:hover img,
#menu-main-menu-1 li a:hover img {
  transform: scale(1.1) !important; /* Minimales Vergrößern beim Drüberfahren */
  opacity: 0.8 !important;          /* Wird elegant leicht transparent */
}
/Footer**/
/* ==========================================================================
   FINALER PRAXIS-FOOTER: ALTEN AUSBLENDEN, NEUEN FORMATIEREN
   ========================================================================== */

/* 1. Blendet den fehlerhaften Standard-Theme-Footer komplett aus */
footer#site-footer,
.site-footer.dynamic-footer {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  padding: 0 !important;
}

/* 2. Formatiert unseren neuen weinroten Footer-Balken */
.custom-praxis-footer {
  background-color: #7d091e !important; /* Ihr Praxis-Weinrot */
  padding: 25px 20px !important;
  width: 100% !important;
  display: block !important;
  box-sizing: border-box !important;
  border-top: 3px solid #5c0514 !important; /* Dezente obere Kante */
}

/* Zentriert den Textinhalt */
.custom-praxis-footer .custom-footer-inner {
  max-width: 1140px !important;
  margin: 0 auto !important;
  text-align: center !important;
}

/* Der Text in feinem Weiß */
.custom-praxis-footer p {
  margin: 0 !important;
  padding: 0 !important;
  font-family: 'Open Sans', sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #ffffff !important;
  letter-spacing: 0.5px !important;
  line-height: 22px !important;
}

/* Die Links für Impressum & Datenschutz */
.custom-praxis-footer .footer-links a {
  color: #ffffff !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  margin: 0 8px !important;
  transition: color 0.2s ease !important;
}

/* Hover-Effekt für die Links */
.custom-praxis-footer .footer-links a:hover {
  color: #e5e5e5 !important; /* Leichtes Silber-Weiß beim Drüberfahren */
  text-decoration: underline !important;
}

/* ==========================================================================
   ENTFERNUNG DES DOPPELTEN MENÜS UND TEXTES ÜBER DEM FOOTER
   ========================================================================== */

/* Blendet die doppelte Navigation und das englische Copyright radikal aus */
.site-footer,
#site-footer,
footer.site-footer,
.site-footer-inner,
.site-footer .copyright,
.site-footer .site-navigation {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
}

/* ==========================================================================
   ENTFERNUNG DER ALTEN ELEMENTOR-SEKTION (UEBERFOOTER)
   ========================================================================== */

/* Blendet die alte, dreispaltige Sektion mit Impressum/Datenschutz komplett aus */
.ueberfooter,
.elementor-section .ueberfooter,
[data-id="2c40c64"] {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 0 !important;
}

#gdpr-cookie-revoke {
  padding-bottom: 27px;
  background: #333 !important;
}


/*Unterseiten*/
.elementor-widget-heading h3 {
	margin-top: 50px;
}


/*Mobile Anpassung*/
/* ==========================================================================
   FINALE ELIMINIERUNG DES ALTEN SMARPHONE-LOGOS (1log.png)
   ========================================================================== */
@media (max-width: 767px) {

  /* Blendet das alte Logo mit dem schwarzen Text komplett aus */
  .mob-menu-logo-holder,
  .mob-standard-logo,
  .mob-retina-logo,
  a.headertext img {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Blendet den eventuell verbleibenden Text-Link aus */
  a.headertext {
    display: none !important;
  }

  /* Stellt sicher, dass das neue, große Grafik-Logo stattdessen geladen wird */
  .custom-logo-link, 
  img.custom-logo {
    display: block !important;
    max-width: 220px !important; /* Optimale Größe für Handydisplays */
    height: auto !important;
    margin: 0 auto !important; /* Zentriert das korrekte Logo in der Mitte */
  }
}

/* ==========================================================================
   SMARTPHONE: LOGO EXAKT MITTIG ZENTRIEREN
   ========================================================================== */
@media (max-width: 767px) {
  
  /* Zentriert den Logo-Container auf Handys */
  header.site-header .site-branding,
  header.site-header .site-logo,
  .site-header .header-inner .site-branding {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;   /* Zentriert das Logo horizontal */
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
    margin: 0 auto 15px auto !important; /* Zentriert die Box und gibt etwas Abstand nach unten */
  }

  /* Stellt sicher, dass das Logo-Bild selbst mittig sitzt */
  header.site-header .custom-logo-link,
  header.site-header .custom-logo {
    margin: 0 auto !important;
    display: block !important;
    text-align: center !important;
  }
}

/* ==========================================================================
   SMARTPHONE: BIG BURGER (46PX), DÜNNE LINIEN & NACH UNTEN VERSCHOBEN
   ========================================================================== */
@media (max-width: 767px) {
  
  /* 1. Header-Bereich vorbereiten und Platz für das Logo sichern */
  header.site-header .header-inner,
  .site-header .header-inner {
    position: relative !important;
    display: flex !important;
    justify-content: center !important; /* Logo bleibt zentriert */
    align-items: center !important;
    padding: 20px !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 2. Den Menü-Container RECHTS AUSSEN und NACH UNTEN verschieben */
  /* Er sitzt jetzt tiefer, unterhalb der Höhe des Logos, um jegliche Quetschung zu verhindern */
  .mobmenul-container {
    position: absolute !important;
    right: 15px !important; /* Fest am rechten Rand gepinnt */
    top: auto !important;   /* Hebt die vertikale Zentrierung auf */
    bottom: -15px !important; /* Schiebt das gesamte Element nach unten über das rote Band */
    display: flex !important;
    align-items: center !important;
    z-index: 9999 !important;
    height: 46px !important;
  }

  /* 3. RIESIGES ICON (46PX) MIT ELEGANTEN DÜNNEN STRICHEN */
  .mob-menu-icon,
  .mob-icon-menu,
  .mobmenul-container i.mob-menu-icon {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #7d091e !important; /* Ihr Praxis-Weinrot */
    font-size: 46px !important; /* Wunschgröße: 46px */
    line-height: 46px !important;
    font-weight: 100 !important; /* Macht die Striche des Icon-Fonts so dünn wie möglich */
    letter-spacing: normal !important;
    
  }

  /* Falls es sich um gezeichnete CSS-Linien handelt, machen wir sie hier hauchdünn */
  .mob-menu-icon::before,
  .mob-menu-icon::after,
  .mob-icon-menu::before {
    font-weight: 100 !important;
  }

  /* 4. Das Schließen-Kreuz (X) ebenfalls auf 46px anpassen und im geschlossenen Zustand verbergen */
  .mob-cancel-button,
  .mob-icon-cancel-1,
  .mobmenul-container i.mob-cancel-button {
    display: none !important;
  }

  /* Steuerung für den geöffneten Zustand */
  body.mob-menu-open .mob-menu-icon { 
    display: none !important; 
  }
  body.mob-menu-open .mob-cancel-button { 
    display: inline-block !important; 
    color: #7d091e !important; 
    font-size: 46px !important; 
    font-weight: 100 !important;
  }
}

/* ==========================================================================
   SMARTPHONE: LOGO LINKS & BIG BURGER (46PX) RECHTS UNTEN
   ========================================================================== */
@media (max-width: 767px) {
  
  /* 1. Header-Inner von Zentrierung auf Linksbündig umstellen */
  header.site-header .header-inner,
  .site-header .header-inner {
    position: relative !important;
    display: flex !important;
    justify-content: flex-start !important; /* ÄNDERUNG: Schiebt das Logo nach ganz links */
    align-items: center !important;
    padding: 20px 15px !important; /* Angenehmer Randabstand links */
    width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 2. Logo-Bereich linksbündig fixieren */
  header.site-header .site-branding,
  .site-header .header-inner .site-branding {
    display: block !important;
    text-align: left !important; /* Linksbündiger Text */
    margin: 0 !important;
    padding: 0 !important;
    max-width: 70% !important; /* Blockiert Überschneidungen mit rechts */
  }

  /* Das Logo-Bild links ausrichten */
  header.site-header .custom-logo-link,
  header.site-header .custom-logo {
    margin: 0 !important; /* Entfernt die automatische Zentrierung */
    display: block !important;
    max-width: 200px !important; /* Schöne Handyskalierung */
    height: auto !important;
  }

  /* 3. Das 46px Burger-Menü exakt RECHTS UNTEN auf dem weinroten Band positionieren */
  .mobmenul-container {
    position: absolute !important;
    right: 15px !important; /* Fest am rechten Displayrand gepinnt */
    top: auto !important;
    bottom: -15px !important; /* Sitzt tiefer über dem roten Band */
    display: flex !important;
    align-items: center !important;
    z-index: 9999 !important;
    height: 46px !important;
  }

  /* 4. RIESIGES & DÜNNES ICON (46PX) */
  .mob-menu-icon,
  .mob-icon-menu,
  .mobmenul-container i.mob-menu-icon {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #7d091e !important; /* Praxis-Weinrot */
    font-size: 46px !important; /* Wunschgröße */
    line-height: 46px !important;
    font-weight: 100 !important; /* Macht die Striche maximal dünn */
    letter-spacing: normal !important;
  }

  /* 5. Das Schließen-Kreuz (X) ebenfalls auf 46px links sperren */
  .mob-cancel-button,
  .mob-icon-cancel-1,
  .mobmenul-container i.mob-cancel-button {
    display: none !important;
  }

  /* Steuerung für den geöffneten Zustand */
  body.mob-menu-open .mob-menu-icon { 
    display: none !important; 
  }
  body.mob-menu-open .mob-cancel-button { 
    display: inline-block !important; 
    color: #7d091e !important; 
    font-size: 46px !important; 
    font-weight: 100 !important;
  }
}
.elementor-heading-title {
	margin-top:30px;
}