.elementor-kit-6{--e-global-color-primary:#73A13D;--e-global-color-secondary:#54595F;--e-global-color-text:#000000;--e-global-color-accent:#B9CDA0;--e-global-typography-primary-font-family:"HK Grotesk";--e-global-typography-primary-font-size:62px;--e-global-typography-primary-font-weight:400;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"HK Grotesk";--e-global-typography-text-font-size:clamp(1.25rem, 0.462vw + 1.13rem, 1.5rem);--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:line-height: clamp(1.575rem, 1.247vw + 1.252rem, 2.25rem);--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-text );}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.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 *//* Grundzustand: groß (Top der Seite) */
.smart-header {
  transition: transform 0.28s ease, opacity 0.28s ease, padding 0.28s ease, background-color 0.28s ease;
  padding-block: 10px;               /* „groß“ */
  background-color: var(--hdr-bg, #ffffff);
  opacity: 1;
  will-change: transform, opacity, padding, background-color; /* falls dein Validator meckert, kannst du die Zeile löschen */
}

/* Ausblenden beim Runterscrollen */
.smart-header.is-hidden {
  transform: translateY(-100%);
  opacity: 0;
}

/* Kompakt + transparent beim Hochscrollen (nicht ganz oben) */
.smart-header.is-compact {
  padding-block: 10px;                                /* „klein“ */
  background-color: rgba(255, 255, 255, 0.78);        /* halbtransparent */
  backdrop-filter: blur(8px) saturate(140%);          /* schöner Glass-Effekt (unterstützte Browser) */
  -webkit-backdrop-filter: blur(8px) saturate(140%);
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

/* Logo/ Menühöhen in „kompakt“ verkleinern (passe Selektoren auf dein Markup an) */
.smart-header.is-compact .elementor-widget-image img,
.smart-header.is-compact .site-logo img {
  max-height: 36px;           /* z. B. von ~52px auf 36px */
  transition: max-height 0.28s ease;
}

/* Admin-Bar berücksichtigen */
.admin-bar .smart-header.elementor-sticky--effects { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .smart-header.elementor-sticky--effects { top: 46px; }
}

/* Motion-Respekt */
@media (prefers-reduced-motion: reduce) {
  .smart-header { transition: none; }
}


/* Höhen definieren */
.smart-header { 
  --logo-big: 100px;    /* Höhe ganz oben (groß) */
  --logo-small: 60px;  /* Höhe im kompakten Zustand */
}

/* Link-Wrapper sauber ausrichten */
.smart-header .elementor-widget-theme-site-logo a {
  display: inline-flex;
  align-items: center;
  line-height: 0;
}

/* Logo nie verzerren: nur über max-height steuern */
.smart-header .elementor-widget-theme-site-logo img,
.smart-header .elementor-widget-image img {
  height: auto !important;        /* verhindert gestauchte Höhe */
  width: auto !important;         /* überschreibt Elementor width:100% */
  max-width: 100%;
  max-height: var(--logo-big);
  display: block;
  transition: max-height .28s ease, transform .28s ease;
}

/* kompakter Zustand beim Hochscrollen */
.smart-header.is-compact .elementor-widget-theme-site-logo img,
.smart-header.is-compact .elementor-widget-image img {
  max-height: var(--logo-small);
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'HK Grotesk';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://michaelspleth.4kmanagement.de/wp-content/uploads/2025/10/hk-grotesk.semibold.ttf') format('truetype');
}
@font-face {
	font-family: 'HK Grotesk';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url('https://michaelspleth.4kmanagement.de/wp-content/uploads/2025/10/hk-grotesk.regular.ttf') format('truetype');
}
@font-face {
	font-family: 'HK Grotesk';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('https://michaelspleth.4kmanagement.de/wp-content/uploads/2025/10/hk-grotesk.medium.ttf') format('truetype');
}
@font-face {
	font-family: 'HK Grotesk';
	font-style: normal;
	font-weight: 200;
	font-display: auto;
	src: url('https://michaelspleth.4kmanagement.de/wp-content/uploads/2025/10/hk-grotesk.light_.ttf') format('truetype');
}
@font-face {
	font-family: 'HK Grotesk';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://michaelspleth.4kmanagement.de/wp-content/uploads/2025/10/hk-grotesk.bold_.ttf') format('truetype');
}
@font-face {
	font-family: 'HK Grotesk';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: ;
}
/* End Custom Fonts CSS */