.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-ee7f5b0:#FFFFFF;--e-global-color-be7d0e2:#E7000F;--e-global-color-274a0c4:#000000;--e-global-color-8b1da0e:#FFD700;--e-global-color-0e9e7da:#2E2E2E;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1300px;}.e-con{--container-max-width:1300px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ===============================
   1) Grundkonfiguration
   - weiches Scrollen
   - Offset für fixierten Header + Adminbar
   =============================== */
:root{
  /* Passe diese Werte an dein Theme an */
  --header-h: 96px;          /* Höhe des (fixierten) Headers auf Desktop */
  --header-h-sticky: 72px;   /* Höhe, wenn der Header verkleinert (sticky) ist */
  --adminbar: 0px;           /* WP-Adminbar (nur wenn eingeloggt) */

  /* Weiches Scrollen zu #Ankern */
  scroll-behavior: smooth;

  /* Globaler Scroll-Offset (wird genutzt, wenn der Browser den Offset aus dem Container holt) */
  scroll-padding-top: calc(var(--header-h) + var(--adminbar));
}

/* Barrierefreiheit: respektiere "Bewegung reduzieren" */
@media (prefers-reduced-motion: reduce){
  :root{ scroll-behavior: auto; }
}

/* ===============================
   2) WordPress-Adminbar berücksichtigen
   (32px Desktop, 46px unter 782px – WP-Standard)
   =============================== */
body.admin-bar{ --adminbar: 32px; }
@media (max-width: 782px){
  body.admin-bar{ --adminbar: 46px; }
}

/* ===============================
   3) Sticky-Header in Elementor
   - wenn Header sticky/mit Effekten aktiv ist, kleineren Offset nutzen
   - :has() ist in aktuellen Browsern breit unterstützt
   =============================== */
html:has(header.elementor-sticky--active),
html:has(header.elementor-sticky--effects){
  scroll-padding-top: calc(var(--header-h-sticky) + var(--adminbar));
}

/* ===============================
   4) Ziel-Elemente korrekt ansteuern
   - scroll-margin-top sorgt dafür, dass der Anker nicht unter dem Header verschwindet
   - wirkt für #id auf Überschriften, Sektionen und Elementor Menu Anchor
   =============================== */
[id],
.elementor-section[id],
.elementor-menu-anchor{
  scroll-margin-top: calc(var(--header-h) + var(--adminbar));
}

/* Wenn der Header verkleinert ist, die Margin entsprechend anpassen */
html:has(header.elementor-sticky--active) [id],
html:has(header.elementor-sticky--active) .elementor-section[id],
html:has(header.elementor-sticky--active) .elementor-menu-anchor,
html:has(header.elementor-sticky--effects) [id],
html:has(header.elementor-sticky--effects) .elementor-section[id],
html:has(header.elementor-sticky--effects) .elementor-menu-anchor{
  scroll-margin-top: calc(var(--header-h-sticky) + var(--adminbar));
}

/* ===============================
   5) Breakpoints (Werte an dein Layout anpassen)
   =============================== */
@media (max-width: 1024px){
  :root{ --header-h: 84px; --header-h-sticky: 64px; }
}
@media (max-width: 767px){
  :root{ --header-h: 72px; --header-h-sticky: 56px; }
}

/* ===============================
   6) Fallback für Browser ohne :has()
   - setzt Anker-Offset per ::before-Technik
   - deckt nicht die „verkleinerte“ Headerhöhe dynamisch ab,
     wähle deshalb konservativ den größeren Headerwert
   =============================== */
@supports not .elementor-kit-6(:has(*)){
  [id], .elementor-section[id], .elementor-menu-anchor{
    scroll-margin-top: 0; /* neutralisieren, wir nutzen stattdessen ::before */
  }
  [id]::before,
  .elementor-section[id]::before,
  .elementor-menu-anchor::before{
    content: "";
    display: block;
    height: calc(var(--header-h) + var(--adminbar));
    margin-top: calc((var(--header-h) + var(--adminbar)) * -1);
    visibility: hidden;
    pointer-events: none;
  }
}/* End custom CSS */