.elementor-kit-9{--e-global-color-primary:#1D1D1B;--e-global-color-secondary:#F8F8F8;--e-global-color-text:#1D1D1B;--e-global-color-accent:#02423A;--e-global-color-2182bff:#FFFFFF;--e-global-color-aa70b5d:#0C9A39;--e-global-typography-primary-font-family:"Lato";--e-global-typography-primary-font-weight:800;--e-global-typography-secondary-font-family:"Lato";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Lato";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Lato";--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-2182bff );color:var( --e-global-color-primary );}.elementor-kit-9 e-page-transition{background-color:#FFBC7D;}.elementor-kit-9 a{color:var( --e-global-color-aa70b5d );}.elementor-kit-9 h1{color:var( --e-global-color-2182bff );}.elementor-kit-9 h2{color:var( --e-global-color-primary );}.elementor-kit-9 h3{color:var( --e-global-color-primary );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1400px;}.e-con{--container-max-width:1400px;--container-default-padding-top:0px;--container-default-padding-right:0px;--container-default-padding-bottom:0px;--container-default-padding-left:0px;}.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);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:480px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */:root{
  --fs-h1: clamp(2.2rem, 1.6rem + 2vw, 3.4rem);
  --fs-h2: clamp(1.8rem, 1.3rem + 1.5vw, 2.6rem);
  --fs-h3: clamp(1.4rem, 1.1rem + 0.8vw, 1.9rem);
  --fs-body: clamp(1rem, 0.95rem + 0.2vw, 1.125rem);
  --lh-head: 1.15;
  --lh-body: 1.6;
}

h1{ font-size: var(--fs-h1); line-height: var(--lh-head); }
h2{ font-size: var(--fs-h2); line-height: var(--lh-head); }
h3{ font-size: var(--fs-h3); line-height: var(--lh-head); }
body{ font-size: var(--fs-body); line-height: var(--lh-body); }

body {
  padding-top: 3rem;
}

/* Wrapper muss die Bühne sein */
.qlout-overlay {
  position: relative;
  display: inline-block; /* wichtig, damit es sich ans Bild schmiegt */
  overflow: hidden;      /* damit Pseudos nicht rauslaufen */
  border-radius: 22px;   /* anpassen */
}

/* Bild sauber auf volle Breite */
.qlout-overlay img {
  display: block;
  width: 100%;
  height: auto;
}

/* Verlauf/Overlay */
.qlout-overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 50%;

  /* Teal-Overlay wie im Screenshot: rechts/unten stärker */
  background:
    radial-gradient(120% 120% at 85% 75%,
      rgba(0, 68, 78, 0.82) 0%,
      rgba(0, 68, 78, 0.72) 35%,
      rgba(0, 68, 78, 0.25) 62%,
      rgba(0, 68, 78, 0.00) 78%
    );

  /* optional: macht das Ganze “weicher” */
  /* backdrop-filter: blur(0px); */
}

/* Icon unten rechts */
.qlout-overlay::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  pointer-events: none;

  /* Weißes Icon (ähnlich dem im Screenshot) als inline SVG */
  background: no-repeat center / contain url("https://hbe.digital/wp-content/uploads/2026/03/Symbol-HBE-White-1.svg");

  opacity: 0.95;
}

/* Optional: Hover-Effekt (wenn das Bild klickbar ist) */
.qlout-overlay:hover::before {
  background:
    radial-gradient(120% 120% at 85% 75%,
      rgba(0, 68, 78, 0.88) 0%,
      rgba(0, 68, 78, 0.78) 35%,
      rgba(0, 68, 78, 0.30) 62%,
      rgba(0, 68, 78, 0.00) 78%
    );
}

/* Wrapper muss die Bühne sein */
.qlout-overlay-dark {
  position: relative;
  display: inline-block; /* wichtig, damit es sich ans Bild schmiegt */
  overflow: hidden;      /* damit Pseudos nicht rauslaufen */
  border-radius: 22px;   /* anpassen */
}

/* Bild sauber auf volle Breite */
.qlout-overlay-dark img {
  display: block;
  width: 100%;
  height: auto;
}

/* Verlauf/Overlay */
.qlout-overlay-dark::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 25%;

  /* Teal-Overlay wie im Screenshot: rechts/unten stärker */
  background:
    radial-gradient(120% 120% at 85% 75%,
      rgba(0, 68, 78, 0.82) 0%,
      rgba(0, 68, 78, 0.72) 35%,
      rgba(0, 68, 78, 0.25) 62%,
      rgba(0, 68, 78, 0.00) 78%
    );

  /* optional: macht das Ganze “weicher” */
  /* backdrop-filter: blur(0px); */
}

/* Icon unten rechts */
.qlout-overlay-dark::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  pointer-events: none;

  /* Weißes Icon (ähnlich dem im Screenshot) als inline SVG */
  background: no-repeat center / contain url("https://hbe.digital/wp-content/uploads/2026/03/Symbol-HBE-White-1.svg");

  opacity: 0.95;
}

/* Optional: Hover-Effekt (wenn das Bild klickbar ist) */
.qlout-overlay-dark:hover::before {
  background:
    radial-gradient(120% 120% at 85% 75%,
      rgba(0, 68, 78, 0.88) 0%,
      rgba(0, 68, 78, 0.78) 35%,
      rgba(0, 68, 78, 0.30) 62%,
      rgba(0, 68, 78, 0.00) 78%
    );
}

/* Wrapper muss die Bühne sein */
.qlout-overlay-light {
  position: relative;
  display: inline-block; /* wichtig, damit es sich ans Bild schmiegt */
  overflow: hidden;      /* damit Pseudos nicht rauslaufen */
  border-radius: 22px;   /* anpassen */
}

/* Bild sauber auf volle Breite */
.qlout-overlay-light img {
  display: block;
  width: 100%;
  height: auto;
}

/* Verlauf/Overlay */
.qlout-overlay-light::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 25%;

  /* Teal-Overlay wie im Screenshot: rechts/unten stärker */
  background:
    radial-gradient(120% 120% at 85% 75%,
      rgba(0, 68, 78, 0.82) 0%,
      rgba(0, 68, 78, 0.72) 35%,
      rgba(0, 68, 78, 0.25) 62%,
      rgba(0, 68, 78, 0.00) 78%
    );

  /* optional: macht das Ganze “weicher” */
  /* backdrop-filter: blur(0px); */
}

/* Icon unten rechts */
.qlout-overlay-light::after {
  content: "";
  position: absolute;
  right: 18px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  pointer-events: none;

  /* Weißes Icon (ähnlich dem im Screenshot) als inline SVG */
  background: no-repeat center / contain url("https://hbe.digital/wp-content/uploads/2026/03/Symbol-HBE-White-1.svg");

  opacity: 0.95;
}

/* Optional: Hover-Effekt (wenn das Bild klickbar ist) */
.qlout-overlay-light:hover::before {
  background:
    radial-gradient(120% 120% at 85% 75%,
      rgba(0, 68, 78, 0.88) 0%,
      rgba(0, 68, 78, 0.78) 35%,
      rgba(0, 68, 78, 0.30) 62%,
      rgba(0, 68, 78, 0.00) 78%
    );
}


.qlout-info-container a{
    color: #fff;
}


.team-extra {
  max-height: 0;
  overflow: hidden;
  transform: translateY(20px);
  opacity: 0;
  transition: all 0.5s ease-in-out;
}

.team-card:hover .team-extra {
  max-height: 200px;
  transform: translateY(0);
  opacity: 1;
}/* End custom CSS */