:root {
  --kn-orange: #ef7d00;
  --kn-orange-dark: #bc6100;
  --kn-orange-soft: #fff2e2;
  --kn-orange-soft-2: #f9dfbf;
  --kn-dark: #2d2d2c;
  --kn-dark-2: #1f1f1e;
  --kn-text: #242424;
  --kn-muted: #6f6a63;
  --kn-border: #e2ded7;
  --kn-paper: #fbfaf7;
  --kn-section-space: clamp(3rem, 6vw, 6rem);
  --kn-radius: 1.15rem;
  --kn-shadow: 0 1.2rem 3rem rgba(45, 45, 44, .10);
  --kn-container-narrow: 980px;
}

html { scroll-behavior: smooth; }
body {
  color: var(--kn-text);
  font-family: "gill-sans-nova", "Gill Sans MT", "Gill Sans", Calibri, Arial, sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.58;
  background: #fff;
  text-rendering: optimizeLegibility;
}
a { color: var(--kn-orange); text-decoration-thickness: .08em; text-underline-offset: .22em; transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease; }
a:hover { color: var(--kn-orange-dark); }

.skip-link { z-index: 2000; }

.site-header {
  position: relative;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid rgba(45,45,44,.07);
  box-shadow: none;
  backdrop-filter: saturate(1.35) blur(12px);
}

/* v0.5.7: Keine dunkle Schattenkante ueber dem Hero-Slider. */
.site-header::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(239,125,0,.18), transparent);
}
.kn-navbar { min-height: 88px; }
.navbar-brand { padding: .55rem 0; }
.kn-logo {
  width: min(355px, 58vw);
  max-width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: left center;
  display: block;
}
.navbar-toggler {
  border: 1px solid rgba(239,125,0,.32);
  border-radius: 999px;
  padding: .55rem .7rem;
}
.navbar-toggler:focus { box-shadow: 0 0 0 .22rem rgba(239,125,0,.18); }

.navbar-nav { gap: .35rem; align-items: center; }
.kn-main-nav,
.kn-main-nav ul { list-style: none; margin: 0; padding: 0; }
.kn-main-nav > li { position: relative; }
.nav-link {
  color: var(--kn-orange);
  font-weight: 600;
  font-size: .98rem;
  letter-spacing: .01em;
  border-radius: 999px;
  padding: .58rem 1.05rem !important;
  position: relative;
  text-decoration: none;
}
.nav-link:hover { color: var(--kn-orange-dark); background: var(--kn-orange-soft); }
.nav-item.menu-current > .nav-link,
.nav-item.menu-parent > .nav-link,
.nav-item.current > .nav-link,
.nav-item.active > .nav-link {
  color: #fff;
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
  box-shadow: 0 .55rem 1.15rem rgba(239,125,0,.23);
}
.kn-main-nav li.has-children > .nav-link { padding-right: 2.15rem !important; }
.kn-main-nav li.has-children > .nav-link::after {
  content: "";
  position: absolute;
  right: .95rem;
  top: 50%;
  width: .45rem;
  height: .45rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-62%) rotate(45deg);
  opacity: .72;
}
.kn-main-nav li > ul {
  position: absolute;
  left: 50%;
  top: calc(100% + .8rem);
  min-width: 14rem;
  display: block;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, .45rem);
  background: rgba(255,255,255,.98);
  border: 1px solid rgba(45,45,44,.08);
  border-radius: 1rem;
  box-shadow: 0 1.4rem 3rem rgba(45,45,44,.14);
  padding: .55rem;
  z-index: 1100;
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .24s;
  backdrop-filter: blur(12px);
}
.kn-main-nav li > ul::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -.48rem;
  width: .9rem;
  height: .9rem;
  background: rgba(255,255,255,.98);
  border-left: 1px solid rgba(45,45,44,.08);
  border-top: 1px solid rgba(45,45,44,.08);
  transform: translateX(-50%) rotate(45deg);
}
.kn-main-nav > li.has-children::after {
  content: "";
  position: absolute;
  left: -.35rem;
  right: -.35rem;
  top: 100%;
  height: 1.05rem;
  display: block;
  z-index: 1090;
}
.kn-main-nav li:hover > ul,
.kn-main-nav li:focus-within > ul,
.kn-main-nav li.submenu-open > ul,
.kn-main-nav li.submenu-hover > ul {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
  transition-delay: 0s;
}
.kn-main-nav li > ul li { width: 100%; }
.kn-main-nav li > ul .nav-link {
  display: flex;
  width: 100%;
  color: var(--kn-dark);
  background: transparent;
  border-radius: .72rem;
  box-shadow: none;
  padding: .68rem .85rem !important;
  font-size: .95rem;
  line-height: 1.25;
  white-space: nowrap;
}
.kn-main-nav li > ul .nav-link:hover,
.kn-main-nav li > ul .menu-current > .nav-link,
.kn-main-nav li > ul .current > .nav-link,
.kn-main-nav li > ul .active > .nav-link {
  color: var(--kn-orange-dark);
  background: var(--kn-orange-soft);
}
.kn-main-nav li > ul li > ul {
  left: calc(100% + .65rem);
  top: -.55rem;
  transform: translate(.45rem, 0);
}
.kn-main-nav li > ul li:hover > ul,
.kn-main-nav li > ul li:focus-within > ul,
.kn-main-nav li > ul li.submenu-open > ul,
.kn-main-nav li > ul li.submenu-hover > ul { transform: translate(0, 0); transition-delay: 0s; }
.kn-main-nav li > ul li > ul::before { display: none; }
.kn-submenu-toggle {
  display: none;
  border: 0;
  background: rgba(239,125,0,.1);
  color: var(--kn-orange-dark);
  border-radius: .65rem;
  width: 2.45rem;
  min-width: 2.45rem;
  height: 2.45rem;
  align-items: center;
  justify-content: center;
}
.kn-submenu-toggle::before {
  content: "+";
  display: block;
  width: auto;
  height: auto;
  border: 0;
  transform: none;
  color: currentColor;
  font-size: 1.45rem;
  font-weight: 800;
  line-height: 1;
  transition: transform .18s ease;
}
.submenu-open > .kn-submenu-toggle::before {
  content: "−";
  transform: none;
}

.kn-orange-rule {
  height: clamp(10px, 1.6vw, 17px);
  background: linear-gradient(90deg, var(--kn-orange), #f59a24 48%, var(--kn-orange));
}

.kn-section { padding: var(--kn-section-space) 0; position: relative; overflow: clip; }

/* v0.5.9: Erster Inhaltsblock nach Slider/Breadcrumb etwas kompakter,
   damit die H1 naeher am Hero beginnt. */
.kn-breadcrumb + .kn-section {
  padding-top: clamp(2rem, 3.2vw, 3.4rem);
}

.kn-no-padding,
.kn-hero-section,
.kn-block-1.kn-hero { padding-top: 0; padding-bottom: 0; }
.kn-hero-section,
.kn-block-1.kn-hero { background: var(--kn-dark-2); }

.kn-fullwidth img { width: 100%; height: auto; display: block; }
.kn-narrow > .container { max-width: var(--kn-container-narrow); }
.kn-bg-white { background: #fff; }
.kn-bg-light,
.kn-grau,
.kn-gray,
.kn-grey {
  background: radial-gradient(circle at top left, rgba(239,125,0,.08), transparent 34rem), var(--kn-paper);
}
.kn-bg-orange {
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
  color: #fff;
}
.kn-bg-orange a { color: #fff; }
.kn-bg-orange-soft,
.kn-hellorange {
  background: linear-gradient(135deg, var(--kn-orange-soft), #fff 72%);
}
.kn-bg-dark {
  background: radial-gradient(circle at 12% 20%, rgba(239,125,0,.18), transparent 22rem), var(--kn-dark);
  color: #fff;
}
.kn-bg-dark a { color: #fff; }
.kn-section:where(.kn-bg-light,.kn-bg-orange-soft)::after {
  content: "";
  position: absolute;
  right: clamp(1rem, 5vw, 6rem);
  top: 1.4rem;
  width: 8.5rem;
  height: 8.5rem;
  border: 1px solid rgba(239,125,0,.16);
  border-radius: 50%;
  pointer-events: none;
}

.kn-title-row { margin-bottom: 1.35rem; }
.kn-title-row-after-h1 { margin-top: -.35rem; margin-bottom: 1.65rem; }
.kn-squares { display: inline-flex; gap: .62rem; transform: translateX(-.05rem); }
.kn-squares span {
  display: block;
  width: clamp(14px, 2vw, 22px);
  height: clamp(14px, 2vw, 22px);
  background: var(--kn-orange);
  border-radius: .1rem;
  box-shadow: 0 .35rem .75rem rgba(239,125,0,.18);
}

h1, .h1, h2, .h2, h3, .h3 {
  font-family: "gill-sans-nova", "Gill Sans MT", "Gill Sans", Calibri, Arial, sans-serif;
  font-weight: 600;
  letter-spacing: -.018em;
  color: inherit;
}
h1, .h1 { font-size: clamp(2.15rem, 4.6vw, 4.25rem); line-height: 1.02; margin-bottom: 1rem; }
h2, .h2 { font-size: clamp(1.8rem, 3vw, 2.65rem); line-height: 1.1; margin-bottom: 1rem; }
h3, .h3 { font-size: clamp(1.25rem, 2vw, 1.65rem); }
p:last-child { margin-bottom: 0; }
.lead { color: var(--kn-muted); font-weight: 300; }

.btn,
button,
input[type="submit"],
input[type="button"],
.mpform_submit,
.kn-button,
a.kn-button {
  border-radius: 999px !important;
  border: 1px solid transparent;
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
  color: #fff !important;
  font-weight: 600;
  letter-spacing: .015em;
  padding: .72rem 1.35rem;
  text-decoration: none !important;
  box-shadow: 0 .7rem 1.45rem rgba(239,125,0,.22);
}
.btn:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.mpform_submit:hover,
.kn-button:hover,
a.kn-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 .95rem 1.8rem rgba(239,125,0,.27);
}
.btn-outline,
.btn-outline-primary {
  color: var(--kn-orange) !important;
  background: transparent;
  border-color: rgba(239,125,0,.45);
  box-shadow: none;
}
.btn-outline:hover,
.btn-outline-primary:hover {
  background: var(--kn-orange);
  color: #fff !important;
}

/* Hero / Members Slider */
.kn-block-1 { padding: 0; background: #eee; }
.kn-block-1 .mod_members,
.kn-block-1 .members,
.kn-block-1 .carousel,
.kn-block-1 .oneByOne1 { margin: 0; }
.kn-block-1 img { width: 100%; min-height: clamp(270px, 44vw, 560px); max-height: 620px; object-fit: cover; display: block; }
.kn-block-1 h1,
.kn-block-1 h2,
.kn-block-1 .caption,
.kn-block-1 .members-caption {
  background: linear-gradient(135deg, rgba(239,125,0,.94), rgba(188,97,0,.92));
  color: #fff;
  display: inline-block;
  padding: .32em .55em;
  box-shadow: 0 .75rem 1.5rem rgba(0,0,0,.18);
}

/* Allgemeine Content-Veredelung */
.kn-main-column img,
.kn-block-4 img,
.kn-block-6 img {
  border-radius: calc(var(--kn-radius) * .55);
}
.kn-block-4 .row { align-items: center; }
.kn-block-4 .container,
.kn-block-6 .container,
.kn-block-7 .container,
.kn-block-8 .container {
  position: relative;
  z-index: 1;
}

/* Bildband wie Screendesign, aber moderner */
.kn-block-3 { background: #fff; }
.kn-block-3 img {
  max-height: 430px;
  object-fit: cover;
}

/* Leistungskacheln - robust fuer OneByOne/Module-Ausgaben */
.kn-block-5 .onebyone,
.kn-block-5 .oneByOne,
.kn-block-5 .mod_onebyone,
.kn-block-5 .items,
.kn-block-5 .row { row-gap: 1.5rem; }
.kn-block-5 .item,
.kn-block-5 article,
.kn-block-5 .card {
  position: relative;
  overflow: hidden;
  border: 0;
  border-radius: var(--kn-radius);
  background: #fff;
  box-shadow: var(--kn-shadow);
}
.kn-block-5 .item a,
.kn-block-5 article a,
.kn-block-5 .card a { color: inherit; text-decoration: none; }
.kn-block-5 .item img,
.kn-block-5 article img,
.kn-block-5 .card img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform .35s ease;
}
.kn-block-5 .item:hover img,
.kn-block-5 article:hover img,
.kn-block-5 .card:hover img { transform: scale(1.035); }
.kn-block-5 .item h2,
.kn-block-5 .item h3,
.kn-block-5 article h2,
.kn-block-5 article h3,
.kn-block-5 .card-title {
  background: rgba(239,125,0,.88);
  color: #fff;
  padding: .85rem 1rem;
  border-radius: .75rem;
}

/* Sidebar / Infobox wie Screendesign Detailseite, moderner */
.kn-sidebar > * {
  border: 1px solid rgba(239,125,0,.38);
  background: #fff;
  border-radius: var(--kn-radius);
  padding: 1.35rem;
  box-shadow: var(--kn-shadow);
}
.kn-sidebar h2,
.kn-sidebar h3 {
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
  color: #fff;
  margin: -1.35rem -1.35rem 1.35rem;
  padding: 1rem 1.25rem;
  text-align: center;
  border-radius: var(--kn-radius) var(--kn-radius) 0 0;
}

/* Accordion / FAQ */
.accordion-item {
  border: 1px solid var(--kn-border);
  border-radius: .85rem !important;
  overflow: hidden;
  margin-bottom: .85rem;
  box-shadow: 0 .5rem 1.3rem rgba(45,45,44,.05);
}
.accordion-button { font-weight: 600; }
.accordion-button:not(.collapsed) { color: var(--kn-dark); background: var(--kn-orange-soft); box-shadow: none; }
.accordion-button:focus { box-shadow: 0 0 0 .22rem rgba(239,125,0,.16); border-color: rgba(239,125,0,.35); }

/* mpForm */
input[type="text"], input[type="email"], input[type="tel"], textarea, select,
.form-control, .form-select {
  border-radius: .75rem;
  border-color: var(--kn-border);
  padding: .72rem .9rem;
}
input:focus, textarea:focus, select:focus,
.form-control:focus, .form-select:focus {
  border-color: rgba(239,125,0,.6);
  box-shadow: 0 0 0 .22rem rgba(239,125,0,.14);
}

.kn-action-section { padding-top: 2.25rem; }
.kn-action-section > .container {
  border-top: 1px solid var(--kn-border);
  padding-top: 2.5rem;
}
.kn-action-section img {
  width: 100%;
  height: auto;
  border-radius: var(--kn-radius);
  box-shadow: var(--kn-shadow);
}

.site-footer {
  background: radial-gradient(circle at 12% 5%, rgba(239,125,0,.18), transparent 22rem), var(--kn-dark-2);
  color: #fff;
  padding: clamp(2rem, 4vw, 3rem) 0;
  font-size: .96rem;
}
.site-footer a { color: #fff; text-decoration: none; }
.site-footer a:hover { color: var(--kn-orange); }
.footer-meta-nav { margin: 0; padding: 0; }
.footer-meta-nav li { margin: .24rem 0; }
.footer-meta-nav a { display: inline-block; padding: .08rem 0; }
.footer-meta-nav .menu-current > a,
.footer-meta-nav .current > a,
.footer-meta-nav .active > a { color: var(--kn-orange); }
.footer-logo {
  width: min(335px, 76vw);
  max-width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
  object-position: left center;
  background: #fff;
  border-radius: .55rem;
  padding: .45rem .6rem;
}

@media (max-width: 991.98px) {
  body { font-size: 16px; }
  .kn-navbar { min-height: 74px; }
  .kn-logo { width: min(300px, 68vw); }
  .navbar-collapse {
    margin-top: .85rem;
    padding: .85rem;
    background: rgba(255,255,255,.98);
    border: 1px solid rgba(45,45,44,.08);
    border-radius: 1rem;
    box-shadow: 0 1rem 2.4rem rgba(45,45,44,.11);
  }
  .navbar-nav { align-items: stretch; gap: .28rem; }
  .kn-main-nav > li,
  .kn-main-nav li > ul li {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .45rem;
    width: 100%;
  }
  .kn-main-nav > li > .nav-link,
  .kn-main-nav li > ul li > .nav-link { flex: 1 1 auto; }
  .nav-link {
    color: var(--kn-dark);
    background: #fff;
    padding: .78rem .95rem !important;
    border-radius: .82rem;
    min-height: 48px;
    display: flex;
    align-items: center;
  }
  .nav-link:hover,
  .nav-link:focus-visible {
    color: var(--kn-orange-dark);
    background: var(--kn-orange-soft);
  }
  .kn-main-nav li.has-children > .nav-link { padding-right: .95rem !important; }
  .kn-main-nav li.has-children > .nav-link::after { display: none; }
  .kn-submenu-toggle {
    display: inline-flex;
    width: 48px;
    min-width: 48px;
    height: 48px;
    border: 1px solid rgba(239,125,0,.35);
    background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
    color: #fff;
    border-radius: .82rem;
    box-shadow: 0 .45rem 1rem rgba(239,125,0,.18);
  }
  .kn-submenu-toggle:focus-visible {
    outline: 3px solid rgba(239,125,0,.32);
    outline-offset: 2px;
  }
  .kn-main-nav li > ul,
  .kn-main-nav li > ul li > ul {
    position: static;
    left: auto;
    top: auto;
    flex: 0 0 100%;
    min-width: 0;
    width: 100%;
    opacity: 1;
    visibility: visible;
    transform: none;
    display: none;
    background: #fff7ed;
    border: 1px solid rgba(239,125,0,.18);
    border-left: 4px solid var(--kn-orange);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
    border-radius: .9rem;
    padding: .45rem;
    margin: .12rem 0 .45rem 0;
    backdrop-filter: none;
  }
  .kn-main-nav li > ul::before,
  .kn-main-nav > li.has-children::after { display: none; }
  .kn-main-nav li.submenu-open > ul { display: block; }
  .kn-main-nav li > ul .nav-link {
    color: var(--kn-dark);
    background: rgba(255,255,255,.72);
    white-space: normal;
    padding: .72rem .85rem !important;
    min-height: 44px;
  }
  .kn-main-nav li > ul .nav-link:hover,
  .kn-main-nav li > ul .nav-link:focus-visible {
    color: var(--kn-orange-dark);
    background: #fff;
  }
  .kn-main-nav li > ul .menu-current > .nav-link,
  .kn-main-nav li > ul .current > .nav-link,
  .kn-main-nav li > ul .active > .nav-link {
    color: #fff;
    background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
  }
  .kn-sidebar { margin-top: 2rem; }
}

@media (max-width: 575.98px) {
  .kn-logo { width: min(255px, 78vw); }
  .kn-section { padding: 2.5rem 0; }
  .kn-breadcrumb + .kn-section { padding-top: 2rem; }
  .kn-block-1 img { min-height: 240px; }
  .site-footer { text-align: left; }
}

/* SEO/GEO + Barrierefreiheit Basics ab v0.5.0 */
:focus-visible {
  outline: 3px solid var(--kn-orange);
  outline-offset: .22rem;
}
#maincontent:focus { outline: none; }
.kn-breadcrumb {
  font-size: .92rem;
  color: var(--kn-muted);
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid rgba(45,45,44,.06);
}
.kn-breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem .6rem;
  list-style: none;
  margin: 0;
  padding: .72rem 0;
}
.kn-breadcrumb li { display: inline-flex; align-items: center; }
.kn-breadcrumb li + li::before {
  content: "/";
  margin-right: .6rem;
  color: rgba(45,45,44,.35);
}
.kn-breadcrumb a {
  color: var(--kn-muted);
  text-decoration: none;
}
.kn-breadcrumb a:hover { color: var(--kn-orange-dark); text-decoration: underline; }
.kn-breadcrumb [aria-current="page"] { color: var(--kn-dark); font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}

/* Mobile Navigation Fix ab v0.5.3 */
@media (max-width: 991.98px) {
  .site-header {
    overflow: visible;
  }

  .kn-navbar > .container {
    align-items: center;
  }

  .navbar-toggler {
    width: 54px;
    height: 54px;
    min-width: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
    box-shadow: 0 .75rem 1.8rem rgba(239,125,0,.26);
  }

  .navbar-toggler-icon {
    width: 1.45rem;
    height: 1.45rem;
    background-image: none;
    position: relative;
  }

  .navbar-toggler-icon::before,
  .navbar-toggler-icon::after,
  .navbar-toggler-icon {
    border-top: 2px solid rgba(45,45,44,.82);
  }

  .navbar-toggler-icon::before,
  .navbar-toggler-icon::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
  }

  .navbar-toggler-icon::before { top: .42rem; }
  .navbar-toggler-icon::after { top: .88rem; }

  .navbar-collapse {
    width: 100%;
    flex-basis: 100%;
    margin-top: 1rem;
    padding: 1rem;
    overflow: visible;
  }

  .kn-main-nav.navbar-nav {
    display: block;
    width: 100%;
    margin: 0 !important;
  }

  .kn-main-nav,
  .kn-main-nav ul {
    width: 100%;
    max-width: 100%;
  }

  .kn-main-nav > li,
  .kn-main-nav li > ul li {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 50px;
    column-gap: .55rem;
    row-gap: .45rem;
    align-items: stretch;
    width: 100%;
    position: relative;
  }

  .kn-main-nav > li + li {
    margin-top: .45rem;
  }

  .kn-main-nav li:not(.has-children) > .nav-link {
    grid-column: 1 / -1;
  }

  .kn-main-nav li.has-children > .nav-link {
    grid-column: 1 / 2;
    padding-right: .95rem !important;
  }

  .kn-submenu-toggle {
    grid-column: 2 / 3;
    grid-row: 1;
    align-self: stretch;
    justify-self: stretch;
    display: inline-flex;
    width: 50px;
    min-width: 50px;
    height: auto;
    min-height: 50px;
    border-radius: .9rem;
  }

  .kn-main-nav li > ul,
  .kn-main-nav li > ul li > ul,
  .kn-main-nav li:hover > ul,
  .kn-main-nav li:focus-within > ul,
  .kn-main-nav li.submenu-hover > ul {
    grid-column: 1 / -1;
    position: static;
    inset: auto;
    left: auto;
    top: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    display: none !important;
    opacity: 1;
    visibility: visible;
    transform: none;
    margin: .1rem 0 .15rem 0;
    padding: .5rem;
    background: #fff8ef;
    border: 1px solid rgba(239,125,0,.2);
    border-left: 4px solid var(--kn-orange);
    border-radius: 1rem;
    box-shadow: none;
    overflow: hidden;
  }

  .kn-main-nav li.submenu-open > ul {
    display: block !important;
  }

  .kn-main-nav li > ul li {
    display: block;
  }

  .kn-main-nav li > ul li + li {
    margin-top: .35rem;
  }

  .kn-main-nav li > ul .nav-link {
    display: flex;
    width: 100%;
    min-height: 46px;
    color: var(--kn-dark);
    background: #fff;
    border: 1px solid rgba(45,45,44,.06);
    border-radius: .78rem;
    white-space: normal;
    overflow-wrap: anywhere;
    box-shadow: 0 .35rem .85rem rgba(45,45,44,.04);
  }

  .kn-main-nav li > ul .nav-link:hover,
  .kn-main-nav li > ul .nav-link:focus-visible {
    color: var(--kn-orange-dark);
    background: var(--kn-orange-soft);
  }
}

@media (max-width: 575.98px) {
  .navbar > .container {
    padding-left: .85rem;
    padding-right: .85rem;
  }

  .kn-logo {
    width: min(270px, calc(100vw - 5.8rem));
  }

  .navbar-toggler {
    width: 50px;
    height: 50px;
    min-width: 50px;
  }

  .navbar-collapse {
    padding: .85rem;
    border-radius: 1rem;
  }

  .kn-main-nav > li,
  .kn-main-nav li > ul li {
    grid-template-columns: minmax(0, 1fr) 48px;
    column-gap: .45rem;
  }

  .nav-link {
    min-height: 48px;
    padding: .74rem .85rem !important;
  }

  .kn-submenu-toggle {
    width: 48px;
    min-width: 48px;
    min-height: 48px;
  }
}

/* Hero Top-Strip Fix ab v0.5.7
   Entfernt moegliche Restabstaende/Schatten direkt am Slideranfang. */
.kn-hero-section {
  overflow: hidden;
}

.kn-hero-section > .container-fluid,
.kn-hero-section .kn-hero-members,
.kn-hero-section .kn-hero-group,
.kn-hero-section .kn-hero-slider,
.kn-hero-section .carousel-inner,
.kn-hero-section .carousel-item,
.kn-hero-section .kn-hero-slide {
  margin-top: 0 !important;
  border-top: 0 !important;
}

.kn-hero-section .kn-hero-members > :first-child,
.kn-hero-section .kn-hero-group > :first-child,
.kn-hero-section .carousel-inner > :first-child,
.kn-hero-section .carousel-item > :first-child,
.kn-hero-section .kn-hero-slide > :first-child {
  margin-top: 0 !important;
}

.kn-hero-members figure,
.kn-hero-members picture,
.kn-hero-members p {
  margin-top: 0;
}

.kn-hero-members img {
  display: block;
}

/* ==========================================================
   Klein-Noeh Hero Slider via WBCE Members Modul
   Eine Members-Gruppe = ein Hero-Slider
   Ein Members-Eintrag = eine Slide
   ========================================================== */

.kn-hero-members {
  position: relative;
  overflow: hidden;
  background: var(--kn-dark-2);
}

.kn-hero-group {
  position: relative;
}

.kn-hero-slider,
.kn-hero-slider .carousel-inner,
.kn-hero-slider .carousel-item,
.kn-hero-slide {
  position: relative;
  height: clamp(430px, 43vw, 620px);
  min-height: 0;
}

.kn-hero-slider,
.kn-hero-slider .carousel-inner,
.kn-hero-slider .carousel-item {
  overflow: hidden;
}

.kn-hero-slide {
  display: flex;
  align-items: center;
}

/* Bild / Hintergrund */

.kn-hero-media,
.kn-hero-media img,
.kn-hero-overlay {
  position: absolute;
  inset: 0;
}

.kn-hero-media {
  z-index: 0;
  overflow: hidden;
  background: var(--kn-dark-2);
}

.kn-hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}


/* Hero: schwarze Randflaechen vermeiden, auch wenn Members das Bild ohne Media-Wrapper ausgibt. */
.kn-hero-members .carousel-item > img,
.kn-hero-members .kn-hero-slide > img,
.kn-hero-members .member-image img,
.kn-hero-members .member-img img,
.kn-hero-members .member-picture img,
.kn-hero-members .member-photo img,
.kn-hero-members .member-image a > img,
.kn-hero-members .member-img a > img,
.kn-hero-members figure > img,
.kn-hero-members picture img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

/* Abdunklung fuer bessere Lesbarkeit */

.kn-hero-overlay {
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 46%, rgba(239, 125, 0, 0.24), transparent 30rem),
    linear-gradient(
      90deg,
      rgba(31, 31, 30, 0.86) 0%,
      rgba(45, 45, 44, 0.62) 44%,
      rgba(45, 45, 44, 0.18) 100%
    ),
    linear-gradient(
      0deg,
      rgba(31, 31, 30, 0.38) 0%,
      rgba(31, 31, 30, 0.02) 55%
    );
}

/* Inhalt */

.kn-hero-content {
  position: relative;
  z-index: 2;
  max-width: 760px;
  padding: clamp(72px, 9vw, 125px) 0 clamp(56px, 7vw, 96px);
  color: #fff;
}

.kn-hero-kicker {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 0.55rem 0.85rem;
  border-radius: 999px;
  background: rgba(239, 125, 0, 0.75);
  box-shadow: inset 0 0 0 1px rgba(239, 125, 0, 0.32), 0 10px 24px rgba(0, 0, 0, 0.16);
  margin-bottom: 18px;
  color: #fff;
  font-size: clamp(0.85rem, 1.2vw, 1rem);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.kn-hero-kicker p,
.kn-hero-kicker .member-short1 {
  margin: 0;
}

.kn-hero-title {
  margin: 0 0 24px;
  max-width: 860px;
  font-size: clamp(2.3rem, 6vw, 5.4rem);
  line-height: 0.98;
  font-weight: 800;
  letter-spacing: -0.045em;
  color: #fff;
  text-shadow: 0 0.45rem 1.6rem rgba(0, 0, 0, 0.26);
}

.kn-hero-text {
  max-width: 650px;
  font-size: clamp(1.05rem, 1.5vw, 1.32rem);
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.9);
}

.kn-hero-text p {
  margin: 0 0 1rem;
}

.kn-hero-text p:last-child {
  margin-bottom: 0;
}

.kn-hero-text .member-long1 {
  margin: 0;
}

.kn-hero-additional {
  margin-top: 18px;
  max-width: 620px;
  font-size: 1rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.78);
}

.kn-hero-additional p {
  margin: 0 0 0.85rem;
}

.kn-hero-additional p:last-child {
  margin-bottom: 0;
}

.kn-hero-additional .member-long2 {
  margin: 0;
}

/* Leere Felder ausblenden */

.kn-hero-kicker:empty,
.kn-hero-text:empty,
.kn-hero-additional:empty,
.kn-hero-actions:empty,
.kn-hero-kicker .member-short1:empty,
.kn-hero-text .member-long1:empty,
.kn-hero-additional .member-long2:empty,
.kn-hero-actions .member-link:empty {
  display: none;
}

/* Buttonbereich nur anzeigen, wenn wirklich ein Link vorhanden ist */

.kn-hero-actions:not(:has(a)) {
  display: none;
  margin-top: 0;
}

/* Button */

.kn-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.kn-hero-actions .member-link {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin: 0;
}

.kn-hero-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 14px 26px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  transition:
    transform 0.2s ease,
    background 0.2s ease,
    color 0.2s ease,
    box-shadow 0.2s ease;
}

.kn-hero-actions a:hover,
.kn-hero-actions a:focus {
  background: linear-gradient(135deg, #ff9a1f, var(--kn-orange));
  color: #fff;
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(239, 125, 0, 0.25);
}

.kn-hero-actions a:focus-visible {
  outline: 3px solid var(--kn-orange-soft);
  outline-offset: 4px;
}

/* Slider-Steuerung */

.kn-hero-slider .carousel-control-prev,
.kn-hero-slider .carousel-control-next {
  z-index: 4;
  width: 64px;
  opacity: 0.85;
  transition: opacity 0.2s ease;
}

.kn-hero-slider .carousel-control-prev:hover,
.kn-hero-slider .carousel-control-next:hover,
.kn-hero-slider .carousel-control-prev:focus,
.kn-hero-slider .carousel-control-next:focus {
  opacity: 1;
}

.kn-hero-slider .carousel-control-prev-icon,
.kn-hero-slider .carousel-control-next-icon {
  width: 2.4rem;
  height: 2.4rem;
  filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.45));
}

/* Slider-Indikatoren */

.kn-hero-indicators {
  z-index: 4;
  right: auto;
  bottom: 34px;
  left: max(24px, calc((100vw - 1320px) / 2 + 12px));
  justify-content: flex-start;
  gap: 8px;
  margin: 0;
}

.kn-hero-indicators [data-bs-target] {
  width: 38px;
  height: 4px;
  margin: 0;
  border: 0;
  border-radius: 99px;
  background-color: rgba(255, 255, 255, 0.55);
  opacity: 1;
  transition:
    width 0.2s ease,
    background-color 0.2s ease;
}

.kn-hero-indicators .active {
  width: 54px;
  background-color: var(--kn-orange);
}

/* Barrierefreiheit: versteckte Gruppenueberschrift */

.kn-hero-members .visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Wenn Nutzer reduzierte Bewegung wuenschen */

@media (prefers-reduced-motion: reduce) {
  .kn-hero-slider.carousel,
  .kn-hero-slider .carousel-item,
  .kn-hero-actions a,
  .kn-hero-indicators [data-bs-target] {
    transition: none !important;
  }
}

/* Tablet */

@media (max-width: 991.98px) {
  .kn-hero-slider,
  .kn-hero-slider .carousel-inner,
  .kn-hero-slider .carousel-item,
  .kn-hero-slide {
    height: clamp(500px, 72vh, 640px);
  }

  .kn-hero-overlay {
    background:
      linear-gradient(
        0deg,
        rgba(31, 31, 30, 0.86) 0%,
        rgba(45, 45, 44, 0.58) 58%,
        rgba(45, 45, 44, 0.24) 100%
      );
  }

  .kn-hero-content {
    max-width: 100%;
    padding-top: 120px;
    padding-bottom: 96px;
  }

  .kn-hero-slider .carousel-control-prev,
  .kn-hero-slider .carousel-control-next {
    display: none;
  }

  .kn-hero-indicators {
    left: 24px;
  }
}

/* Smartphone */

@media (max-width: 575.98px) {
  .kn-hero-slider,
  .kn-hero-slider .carousel-inner,
  .kn-hero-slider .carousel-item,
  .kn-hero-slide {
    height: clamp(520px, 78vh, 620px);
  }

  .kn-hero-content {
    padding-top: 110px;
    padding-bottom: 86px;
  }

  .kn-hero-kicker {
    margin-bottom: 14px;
    font-size: 0.78rem;
    letter-spacing: 0.06em;
  }

  .kn-hero-title {
    margin-bottom: 20px;
    font-size: clamp(2.1rem, 13vw, 3.4rem);
    line-height: 1;
  }

  .kn-hero-text {
    font-size: 1.02rem;
    line-height: 1.55;
  }

  .kn-hero-additional {
    font-size: 0.95rem;
  }

  .kn-hero-actions {
    margin-top: 28px;
  }

  .kn-hero-actions a {
    width: 100%;
    min-height: 50px;
    padding: 13px 22px;
  }

  .kn-hero-indicators {
    bottom: 24px;
    left: 12px;
  }

  .kn-hero-indicators [data-bs-target] {
    width: 30px;
  }

  .kn-hero-indicators .active {
    width: 44px;
  }
}

/* ==========================================================
   Klein-Noeh Leistungskacheln via WBCE Members Modul
   Block 05 Leistungen / Kacheln
   Eine Members-Gruppe = Leistungsuebersicht
   Ein Members-Eintrag = eine Kachel
   Version 0.5.11: Hintergrund auf gesamten WBCE-Abschnitt gezogen
   ========================================================== */

.kn-block-5.kn-leistungen {
  background:
    radial-gradient(circle at 12% 0%, rgba(239, 125, 0, .10), transparent 34rem),
    linear-gradient(180deg, var(--kn-paper) 0%, #f7f4ee 100%);
}

.kn-block-5.kn-leistungen > .container {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}

.kn-service-tiles {
  position: relative;
  padding: 0;
  background: transparent;
}

.kn-service-tiles > .container {
  max-width: var(--bs-container-width, 1140px);
}

@media (min-width: 1200px) {
  .kn-service-tiles > .container { max-width: 1140px; }
}

@media (min-width: 1400px) {
  .kn-service-tiles > .container { max-width: 1320px; }
}

.kn-service-tiles-header {
  max-width: 820px;
  margin: 0 auto clamp(32px, 4vw, 52px);
  text-align: center;
}

.kn-service-tiles-header h2 {
  margin: 0 0 16px;
  color: var(--kn-text);
}

.kn-service-tiles-header h2::after {
  content: "";
  display: block;
  width: 84px;
  height: 5px;
  margin: 18px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--kn-orange), var(--kn-orange-dark));
}

.kn-service-tiles-intro {
  margin: 0 auto;
  max-width: 760px;
  font-size: clamp(1.05rem, 1.4vw, 1.2rem);
  line-height: 1.65;
  color: var(--kn-muted);
}

.kn-service-tiles-intro p,
.kn-service-tiles-intro .mgroup-desc {
  margin: 0;
}

.kn-service-tiles-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2vw, 28px);
}

.kn-service-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 100%;
  border: 1px solid rgba(45, 45, 44, .09);
  border-radius: 24px;
  background: #fff;
  color: var(--kn-text);
  box-shadow: 0 18px 46px rgba(45, 45, 44, .07);
  overflow: hidden;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.kn-service-tile::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  left: 24px;
  right: 24px;
  height: 5px;
  border-radius: 0 0 99px 99px;
  background: linear-gradient(90deg, var(--kn-orange), var(--kn-orange-dark));
  opacity: .98;
}

.kn-service-tile:hover,
.kn-service-tile:focus-within {
  transform: translateY(-4px);
  border-color: rgba(239, 125, 0, .42);
  box-shadow: 0 24px 60px rgba(45, 45, 44, .13);
}

.kn-service-tile-media {
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--kn-orange-soft);
  overflow: hidden;
}

.kn-service-tile-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .32s ease;
}

.kn-service-tile:hover .kn-service-tile-media img,
.kn-service-tile:focus-within .kn-service-tile-media img {
  transform: scale(1.035);
}

.kn-service-tile-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: clamp(24px, 3vw, 34px);
}

.kn-service-tile h3 {
  margin: 0 0 14px;
  font-size: clamp(1.25rem, 1.8vw, 1.55rem);
  line-height: 1.18;
  font-weight: 700;
  color: var(--kn-text);
}

.kn-service-tile-text {
  font-size: 1rem;
  line-height: 1.65;
  color: var(--kn-muted);
}

.kn-service-tile-text .member-long1 {
  margin: 0;
}

.kn-service-tile-text p {
  margin: 0 0 1rem;
}

.kn-service-tile-text p:last-child {
  margin-bottom: 0;
}

.kn-service-tile-more {
  margin-top: auto;
  padding-top: 22px;
}

.kn-service-tile-more .member-page {
  margin: 0;
}

.kn-service-tile-more a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  color: var(--kn-orange-dark);
  font-weight: 700;
  text-decoration: none;
}

.kn-service-tile-more a::after {
  content: "\2192";
  line-height: 1;
  transition: transform .18s ease;
}

.kn-service-tile-more a:hover,
.kn-service-tile-more a:focus {
  color: var(--kn-text);
  text-decoration: none;
}

.kn-service-tile-more a:hover::after,
.kn-service-tile-more a:focus::after {
  transform: translateX(4px);
}

.kn-service-tile-text:empty,
.kn-service-tile-text .member-long1:empty,
.kn-service-tile-more:empty,
.kn-service-tile-more:not(:has(a)) {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .kn-service-tile,
  .kn-service-tile-media img,
  .kn-service-tile-more a::after {
    transition: none !important;
  }
}

@media (max-width: 991.98px) {
  .kn-service-tiles-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .kn-service-tiles-grid {
    grid-template-columns: 1fr;
  }

  .kn-service-tile {
    border-radius: 20px;
  }

  .kn-service-tile-body {
    padding: 24px;
  }
}

/* ==========================================================
   v0.5.12: Infobox und WBCE Accordion optisch harmonisiert
   ========================================================== */

/* Sidebar / Infobox als eine geschlossene Karte statt einzelner Teilboxen */
.kn-sidebar {
  position: relative;
  align-self: flex-start;
  overflow: hidden;
  border: 1px solid rgba(239, 125, 0, .22);
  border-radius: 1.25rem;
  background:
    linear-gradient(180deg, #fff 0%, #fffaf3 100%);
  box-shadow: 0 1.2rem 3rem rgba(45, 45, 44, .10);
}

.kn-sidebar::after {
  content: "";
  position: absolute;
  right: -2.8rem;
  bottom: -2.8rem;
  width: 7rem;
  height: 7rem;
  border: 1px solid rgba(239, 125, 0, .16);
  border-radius: 50%;
  pointer-events: none;
}

.kn-sidebar > * {
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.kn-sidebar > .section_anchor {
  display: none !important;
}

.kn-sidebar h2,
.kn-sidebar h3 {
  margin: 0 !important;
  padding: 1.05rem 1.35rem !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark)) !important;
  border-radius: 0 !important;
  text-align: left !important;
  font-size: clamp(1.2rem, 2vw, 1.55rem);
  line-height: 1.15;
  font-weight: 700;
}

.kn-sidebar h2::after,
.kn-sidebar h3::after {
  content: "";
  display: block;
  width: 2.2rem;
  height: .2rem;
  margin-top: .55rem;
  border-radius: 99px;
  background: rgba(255, 255, 255, .78);
}

.kn-sidebar ul {
  position: relative;
  z-index: 1;
  margin: 0;
  padding: 1.05rem 1.35rem 1.2rem !important;
  list-style: none;
}

.kn-sidebar li {
  position: relative;
  margin: 0;
  padding: .42rem 0 .42rem 1.35rem;
  color: var(--kn-text);
  font-size: .98rem;
  line-height: 1.35;
  border-bottom: 1px solid rgba(45, 45, 44, .07);
}

.kn-sidebar li:last-child {
  border-bottom: 0;
}

.kn-sidebar li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .88rem;
  width: .45rem;
  height: .45rem;
  border-radius: .12rem;
  background: var(--kn-orange);
  box-shadow: 0 .25rem .65rem rgba(239, 125, 0, .28);
}

.kn-sidebar p,
.kn-sidebar .mod-wysiwyg,
.kn-sidebar .content {
  padding: 1.05rem 1.35rem 1.2rem !important;
  margin: 0;
}

@media (min-width: 992px) {
  .kn-sidebar {
    margin-top: .25rem;
    position: sticky;
    top: 7.25rem;
  }
}

@media (max-width: 991.98px) {
  .kn-sidebar {
    margin-top: 2rem;
  }
}

/* WBCE Accordion Modul als moderne FAQ-Liste */
.kn-block-7.kn-faq {
  background: #fff;
}

.kn-block-7 .container {
  max-width: 980px;
}

.eqd-accordion {
  display: grid;
  gap: .82rem;
  margin: 0;
}

.eqd-accordion__heading {
  margin: 0 !important;
  font-size: 1rem;
  line-height: 1.25;
}

.eqd-accordion__button {
  position: relative;
  display: flex !important;
  align-items: center;
  width: 100%;
  min-height: 3.35rem;
  padding: 1rem 4.2rem 1rem 1.3rem !important;
  border: 1px solid rgba(45, 45, 44, .08) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #f6f4ef, #efebe4) !important;
  color: var(--kn-dark) !important;
  box-shadow: none !important;
  font-family: inherit;
  font-size: clamp(1rem, 1.35vw, 1.08rem);
  font-weight: 650;
  line-height: 1.25;
  text-align: left;
  transition:
    color .2s ease,
    background .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

.eqd-accordion__button::before {
  content: "+";
  position: absolute;
  right: .55rem;
  top: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 999px;
  background: #fff;
  color: var(--kn-orange-dark);
  box-shadow: 0 .55rem 1.15rem rgba(45, 45, 44, .08);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  transform: translateY(-50%);
  transition: transform .2s ease, background .2s ease, color .2s ease;
}

.eqd-accordion__button:hover,
.eqd-accordion__button:focus-visible {
  border-color: rgba(239, 125, 0, .28) !important;
  background: linear-gradient(180deg, #fff8ef, #f7efe3) !important;
  color: var(--kn-orange-dark) !important;
  box-shadow: 0 .85rem 1.8rem rgba(45, 45, 44, .07) !important;
  transform: translateY(-1px);
}

.eqd-accordion__button:focus-visible {
  outline: 3px solid rgba(239, 125, 0, .28);
  outline-offset: .18rem;
}

.eqd-accordion__button[aria-expanded="true"] {
  border-color: rgba(239, 125, 0, .42) !important;
  border-radius: 1.35rem 1.35rem 0 0 !important;
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark)) !important;
  color: #fff !important;
  box-shadow: 0 1rem 2.1rem rgba(239, 125, 0, .14) !important;
}

.eqd-accordion__button[aria-expanded="true"]::before {
  content: "−";
  background: rgba(255, 255, 255, .96);
  color: var(--kn-orange-dark);
  transform: translateY(-50%) rotate(180deg);
}

.eqd-accordion__content {
  margin: -.82rem 0 .2rem;
  padding: 1.15rem 1.35rem 1.25rem !important;
  border: 1px solid rgba(239, 125, 0, .24);
  border-top: 0;
  border-radius: 0 0 1.35rem 1.35rem;
  background: #fff;
  color: var(--kn-text);
  box-shadow: 0 1.15rem 2.4rem rgba(45, 45, 44, .07);
}

.eqd-accordion__content p:last-child,
.eqd-accordion__content ul:last-child,
.eqd-accordion__content ol:last-child {
  margin-bottom: 0;
}

@media (max-width: 575.98px) {
  .eqd-accordion {
    gap: .65rem;
  }

  .eqd-accordion__button {
    border-radius: 1rem !important;
    padding: .9rem 3.65rem .9rem 1rem !important;
  }

  .eqd-accordion__button::before {
    right: .48rem;
    width: 2rem;
    height: 2rem;
  }

  .eqd-accordion__content {
    margin-top: -.65rem;
    padding: 1rem !important;
  }
}

/* ==========================================================
   v0.5.13: Feinschliff Infobox, FAQ und Leistungskacheln
   ========================================================== */

/* Infobox: Verlauf im Kopf ueber die volle Kartenbreite */
.kn-sidebar {
  padding: 0 !important;
}

.kn-sidebar h2,
.kn-sidebar h3 {
  display: block;
  width: 100%;
  margin: 0 !important;
  padding: 1.15rem 1.45rem 1.05rem !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255, 255, 255, .24) 0, rgba(255, 255, 255, 0) 34%),
    linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark)) !important;
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, .18);
}

.kn-sidebar ul {
  padding-top: 1.15rem !important;
}

/* Leistungskacheln: Ueberschrift mit 5 Mini-Klein-Noeh-Kaestchen */
.kn-service-tiles-header h2::after {
  width: 6rem;
  height: .72rem;
  margin-top: 1rem;
  border-radius: 0;
  background: repeating-linear-gradient(
    90deg,
    var(--kn-orange) 0,
    var(--kn-orange) .72rem,
    transparent .72rem,
    transparent 1.18rem
  );
}

/* Leistungskacheln: Hover deutlich weicher */
.kn-service-tile {
  transition:
    transform .42s cubic-bezier(.2, .8, .2, 1),
    box-shadow .42s cubic-bezier(.2, .8, .2, 1),
    border-color .42s ease,
    background-color .42s ease;
  will-change: transform;
}

.kn-service-tile::before {
  transition:
    left .42s cubic-bezier(.2, .8, .2, 1),
    right .42s cubic-bezier(.2, .8, .2, 1),
    opacity .42s ease;
}

.kn-service-tile:hover,
.kn-service-tile:focus-within {
  transform: translateY(-5px);
  box-shadow: 0 1.75rem 4.5rem rgba(45, 45, 44, .12);
}

.kn-service-tile:hover::before,
.kn-service-tile:focus-within::before {
  left: 1.4rem;
  right: 1.4rem;
}

.kn-service-tile-media img {
  transition:
    transform .62s cubic-bezier(.2, .8, .2, 1),
    filter .62s ease;
}

.kn-service-tile:hover .kn-service-tile-media img,
.kn-service-tile:focus-within .kn-service-tile-media img {
  transform: scale(1.045);
  filter: saturate(1.04) contrast(1.02);
}

.kn-service-tile-more a,
.kn-service-tile-more a::after {
  transition:
    color .28s ease,
    transform .32s cubic-bezier(.2, .8, .2, 1);
}

/* FAQ: Fragen typografisch an restliche Seite angleichen */
.eqd-accordion {
  gap: .95rem;
}

.eqd-accordion__button {
  min-height: 3.75rem;
  padding: 1.08rem 4.35rem 1.08rem 1.45rem !important;
  font-size: clamp(1.12rem, 1.55vw, 1.32rem);
  font-weight: 700;
  letter-spacing: -.012em;
}

.eqd-accordion__button::before {
  width: 2.35rem;
  height: 2.35rem;
  font-size: 1.35rem;
}

.eqd-accordion__content {
  font-size: clamp(1rem, 1.15vw, 1.08rem);
  line-height: 1.65;
}

@media (max-width: 575.98px) {
  .kn-service-tiles-header h2::after {
    width: 5.25rem;
    height: .64rem;
    background: repeating-linear-gradient(
      90deg,
      var(--kn-orange) 0,
      var(--kn-orange) .64rem,
      transparent .64rem,
      transparent 1.02rem
    );
  }

  .eqd-accordion__button {
    min-height: 3.35rem;
    padding: .95rem 3.75rem .95rem 1.08rem !important;
    font-size: 1.08rem;
  }
}


/* ==========================================================
   v0.5.14: FAQ, Buttonklassen und geometrische Akzente
   ========================================================== */

/* Helle Abschnitts-Akzente: keine Kreise mehr, sondern kleine Logo-Quadrate */
.kn-section:where(.kn-bg-light,.kn-bg-orange-soft)::after {
  width: 8.4rem;
  height: 1.35rem;
  top: 2.4rem;
  right: clamp(1.2rem, 5vw, 6rem);
  border: 0;
  border-radius: 0;
  opacity: .34;
  background:
    linear-gradient(rgba(239,125,0,.22), rgba(239,125,0,.22)) 0 0 / 1.05rem 1.05rem no-repeat,
    linear-gradient(rgba(239,125,0,.22), rgba(239,125,0,.22)) 1.55rem 0 / 1.05rem 1.05rem no-repeat,
    linear-gradient(rgba(239,125,0,.22), rgba(239,125,0,.22)) 3.1rem 0 / 1.05rem 1.05rem no-repeat,
    linear-gradient(rgba(239,125,0,.22), rgba(239,125,0,.22)) 4.65rem 0 / 1.05rem 1.05rem no-repeat,
    linear-gradient(rgba(239,125,0,.22), rgba(239,125,0,.22)) 6.2rem 0 / 1.05rem 1.05rem no-repeat;
  pointer-events: none;
}

.kn-section:where(.kn-bg-light,.kn-bg-orange-soft)::before {
  content: "";
  position: absolute;
  right: clamp(1.2rem, 5vw, 6rem);
  top: 2.4rem;
  width: 8.4rem;
  height: 1.35rem;
  border-radius: .18rem;
  filter: blur(1.1rem);
  background: rgba(239,125,0,.12);
  pointer-events: none;
}

/* Bootstrap-kompatible Klein-Noeh Buttons fuer WYSIWYG-Inhalte */
.btn.btn-kn-orange,
a.btn.btn-kn-orange {
  --bs-btn-padding-x: 1.25rem;
  --bs-btn-padding-y: .72rem;
  --bs-btn-border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  min-height: 2.8rem;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
  color: #fff !important;
  font-weight: 700;
  line-height: 1.15;
  text-decoration: none !important;
  box-shadow: 0 .75rem 1.55rem rgba(239,125,0,.22);
  transition:
    transform .28s cubic-bezier(.2, .8, .2, 1),
    box-shadow .28s cubic-bezier(.2, .8, .2, 1),
    background .28s ease,
    color .28s ease;
}

.btn.btn-kn-orange:hover,
.btn.btn-kn-orange:focus-visible,
a.btn.btn-kn-orange:hover,
a.btn.btn-kn-orange:focus-visible {
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 1rem 2.1rem rgba(239,125,0,.30);
}

.btn.btn-kn-grey,
a.btn.btn-kn-grey {
  --bs-btn-padding-x: 1.25rem;
  --bs-btn-padding-y: .72rem;
  --bs-btn-border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  min-height: 2.8rem;
  border: 1px solid rgba(45,45,44,.12);
  border-radius: 999px;
  background: linear-gradient(180deg, #fff, #f3f0ea);
  color: var(--kn-dark) !important;
  font-weight: 700;
  line-height: 1.15;
  text-decoration: none !important;
  box-shadow: 0 .75rem 1.55rem rgba(45,45,44,.08);
  transition:
    transform .28s cubic-bezier(.2, .8, .2, 1),
    box-shadow .28s cubic-bezier(.2, .8, .2, 1),
    border-color .28s ease,
    color .28s ease;
}

.btn.btn-kn-grey:hover,
.btn.btn-kn-grey:focus-visible,
a.btn.btn-kn-grey:hover,
a.btn.btn-kn-grey:focus-visible {
  border-color: rgba(239,125,0,.26);
  color: var(--kn-orange-dark) !important;
  transform: translateY(-2px);
  box-shadow: 0 1rem 2rem rgba(45,45,44,.12);
}

.btn.btn-kn-orange:focus-visible,
.btn.btn-kn-grey:focus-visible {
  outline: 3px solid rgba(239,125,0,.28);
  outline-offset: .18rem;
}

/* Leistungskacheln: Mini-Kaestchen ohne rechten Reststrich */
.kn-service-tiles-header h2::after {
  width: 4.7rem;
  height: .68rem;
  margin-top: 1rem;
  border-radius: 0;
  background:
    linear-gradient(var(--kn-orange), var(--kn-orange)) 0 0 / .68rem .68rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 1.0rem 0 / .68rem .68rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 2.0rem 0 / .68rem .68rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 3.0rem 0 / .68rem .68rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 4.0rem 0 / .68rem .68rem no-repeat;
  box-shadow: none;
}

/* Leistungskacheln: Hover und Rueckanimation nochmals sanfter */
.kn-service-tile {
  transition:
    transform .58s cubic-bezier(.16, 1, .3, 1),
    box-shadow .58s cubic-bezier(.16, 1, .3, 1),
    border-color .42s ease,
    background-color .42s ease;
}

.kn-service-tile::before {
  transition:
    left .58s cubic-bezier(.16, 1, .3, 1),
    right .58s cubic-bezier(.16, 1, .3, 1),
    opacity .42s ease;
}

.kn-service-tile-media img {
  transition:
    transform .72s cubic-bezier(.16, 1, .3, 1),
    filter .72s ease;
}

/* FAQ: Modul-frontend.css sicher ueberschreiben */
.kn-faq .eqd-accordion .eqd-accordion__heading,
.kn-block-7 .eqd-accordion .eqd-accordion__heading {
  font-size: 1rem !important;
}

.kn-faq .eqd-accordion .eqd-accordion__button,
.kn-block-7 .eqd-accordion .eqd-accordion__button,
.eqd-accordion .eqd-accordion__button {
  min-height: 3.95rem !important;
  padding: 1.14rem 4.45rem 1.14rem 1.5rem !important;
  font-size: clamp(1.2rem, 1.65vw, 1.42rem) !important;
  font-weight: 700 !important;
  letter-spacing: -.015em !important;
  line-height: 1.22 !important;
}

.kn-faq .eqd-accordion .eqd-accordion__button::before,
.kn-block-7 .eqd-accordion .eqd-accordion__button::before,
.eqd-accordion .eqd-accordion__button::before {
  width: 2.45rem !important;
  height: 2.45rem !important;
  font-size: 1.42rem !important;
}

.kn-faq .eqd-accordion .eqd-accordion__content,
.kn-block-7 .eqd-accordion .eqd-accordion__content,
.eqd-accordion .eqd-accordion__content {
  font-size: clamp(1rem, 1.2vw, 1.1rem) !important;
  line-height: 1.65 !important;
}

@media (max-width: 575.98px) {
  .kn-section:where(.kn-bg-light,.kn-bg-orange-soft)::before,
  .kn-section:where(.kn-bg-light,.kn-bg-orange-soft)::after {
    right: 1rem;
    top: 1.2rem;
    transform: scale(.76);
    transform-origin: top right;
  }

  .kn-service-tiles-header h2::after {
    width: 4.35rem;
    height: .62rem;
    background:
      linear-gradient(var(--kn-orange), var(--kn-orange)) 0 0 / .62rem .62rem no-repeat,
      linear-gradient(var(--kn-orange), var(--kn-orange)) .93rem 0 / .62rem .62rem no-repeat,
      linear-gradient(var(--kn-orange), var(--kn-orange)) 1.86rem 0 / .62rem .62rem no-repeat,
      linear-gradient(var(--kn-orange), var(--kn-orange)) 2.79rem 0 / .62rem .62rem no-repeat,
      linear-gradient(var(--kn-orange), var(--kn-orange)) 3.72rem 0 / .62rem .62rem no-repeat;
  }

  .kn-faq .eqd-accordion .eqd-accordion__button,
  .kn-block-7 .eqd-accordion .eqd-accordion__button,
  .eqd-accordion .eqd-accordion__button {
    min-height: 3.55rem !important;
    padding: .98rem 3.9rem .98rem 1.12rem !important;
    font-size: 1.12rem !important;
  }
}

/* ==========================================================
   Klein-Noeh Ansprechpartner / Team via WBCE Members Modul
   Overlay-Variante: Team-Infos liegen direkt ueber dem Bild,
   damit kein weisser Unterbereich entsteht.
   Optimiert fuer Eintragsschleife:
   SHORT2 optionales Badge, NAME als orange Namenslabel,
   SHORT1 als Rollenlabel darunter.
   ========================================================== */

.kn-team-members {
  position: relative;
  padding: clamp(3.5rem, 6vw, 6rem) 0;
}

.kn-team-members-header {
  max-width: 760px;
  margin: 0 0 clamp(2rem, 4vw, 3.5rem);
}

.kn-team-members-header h2 {
  margin: 0 0 0.9rem;
  font-size: clamp(2rem, 4vw, 3.6rem);
  line-height: 1.05;
  font-weight: 700;
  color: var(--kn-dark, #242424);
}

.kn-team-members-header h2::after {
  content: "";
  display: block;
  width: 5.25rem;
  height: 0.72rem;
  margin-top: 0.75rem;
  background: linear-gradient(
    90deg,
    var(--kn-orange, #ef7d00) 0 14%,
    transparent 14% 21.5%,
    var(--kn-orange, #ef7d00) 21.5% 35.5%,
    transparent 35.5% 43%,
    var(--kn-orange, #ef7d00) 43% 57%,
    transparent 57% 64.5%,
    var(--kn-orange, #ef7d00) 64.5% 78.5%,
    transparent 78.5% 86%,
    var(--kn-orange, #ef7d00) 86% 100%
  );
  border-radius: 0.18rem;
}

.kn-team-members-header .kn-team-intro {
  max-width: 680px;
  margin-top: 1.15rem;
  font-size: clamp(1.05rem, 1.3vw, 1.22rem);
  line-height: 1.65;
  color: rgba(36, 36, 36, 0.76);
}

.kn-team-members-header .kn-team-intro p { margin: 0; }
.kn-team-members-header .kn-team-intro p + p { margin-top: 0.85rem; }

.kn-team-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.25rem, 2vw, 2rem);
}

.kn-team-card {
  position: relative;
  min-height: 100%;
  overflow: hidden;
  border: 1px solid rgba(36, 36, 36, 0.08);
  border-radius: 1.35rem;
  background: #1f1c18;
  color: #fff;
  box-shadow: 0 18px 44px rgba(36, 36, 36, 0.10);
  transition:
    transform 0.36s cubic-bezier(.2,.8,.2,1),
    box-shadow 0.36s cubic-bezier(.2,.8,.2,1),
    border-color 0.36s ease;
}

.kn-team-card::before {
  content: "";
  position: absolute;
  z-index: 4;
  top: 0;
  left: 1.35rem;
  right: 1.35rem;
  height: 4px;
  border-radius: 0 0 99px 99px;
  background: var(--kn-orange, #ef7d00);
  opacity: 0.96;
}

.kn-team-card:hover,
.kn-team-card:focus-within {
  transform: translateY(-5px);
  border-color: rgba(239, 125, 0, 0.34);
  box-shadow: 0 28px 68px rgba(36, 36, 36, 0.18);
}

.kn-team-photo {
  position: relative;
  aspect-ratio: 4 / 4.6;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(239, 125, 0, 0.10), rgba(36, 36, 36, 0.06));
}

.kn-team-photo::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 36% 0 0;
  background:
    linear-gradient(180deg, rgba(31, 28, 24, 0) 0%, rgba(31, 28, 24, 0.34) 34%, rgba(31, 28, 24, 0.74) 100%);
  pointer-events: none;
}

.kn-team-photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.55s cubic-bezier(.2,.8,.2,1);
}

.kn-team-card:hover .kn-team-photo img,
.kn-team-card:focus-within .kn-team-photo img {
  transform: scale(1.035);
}

.kn-team-body {
  position: absolute;
  z-index: 5;
  left: 0;
  right: 0;
  bottom: 0;
  padding: clamp(1rem, 2vw, 1.3rem);
  pointer-events: none;
}

.kn-team-body a,
.kn-team-body button { pointer-events: auto; }

.kn-team-subrole,
.kn-team-role,
.kn-team-text,
.kn-team-action {
  position: relative;
  z-index: 3;
}

.kn-team-subrole {
  display: none;
  align-items: center;
  width: fit-content;
  max-width: calc(100% - 0.75rem);
  margin: -1.95rem 0 -0.2rem -0.25rem;
  padding: 0.38rem 0.74rem 0.32rem;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--kn-orange, #ef7d00), var(--kn-orange-dark, #bc6100));
  color: #fff;
  font-size: 0.64rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  box-shadow: 0 10px 22px rgba(239, 125, 0, 0.28);
}

.kn-team-subrole:has(.member-short2:not(:empty)),
.kn-team-subrole:has(p:not(:empty)) {
  display: inline-flex;
}

.kn-team-subrole p,
.kn-team-subrole .member-short2 { margin: 0; }

.kn-team-name {
  position: relative;
  z-index: 2;
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 0 0.32rem -0.15rem;
  padding: 0.5rem 0.86rem 0.44rem;
  border-radius: 0.5rem;
  background: linear-gradient(135deg, var(--kn-orange, #ef7d00), #f08b14);
  color: #fff;
  font-size: clamp(1.18rem, 1.55vw, 1.48rem);
  line-height: 1.08;
  font-weight: 800;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.18);
}

.kn-team-role {
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  margin: -0.12rem 0 0 -0.05rem;
  color: var(--kn-orange, #ef7d00);
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.2;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.28);
}

.kn-team-role:has(.member-short1:empty),
.kn-team-role:has(p:empty) {
  display: none;
}

.kn-team-role p,
.kn-team-role .member-short1 { margin: 0; }

.kn-team-text {
  margin-top: 0.65rem;
  color: rgba(255, 255, 255, 0.86);
  font-size: 0.96rem;
  line-height: 1.55;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.22);
}

.kn-team-text:has(.member-long1:empty),
.kn-team-text:has(p:empty):not(:has(p:not(:empty))) {
  display: none;
}

.kn-team-text p { margin: 0 0 0.75rem; }
.kn-team-text p:last-child { margin-bottom: 0; }

.kn-team-action {
  margin-top: 0.85rem;
}

.kn-team-action:empty,
.kn-team-action:not(:has(a)) { display: none; }

.kn-team-action .member-link { margin: 0; }

.kn-team-action a {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: #fff;
  font-weight: 800;
  text-decoration: none;
}

.kn-team-action a::after {
  content: "\2192";
  transition: transform 0.22s ease;
}

.kn-team-action a:hover,
.kn-team-action a:focus {
  color: var(--kn-orange, #ef7d00);
  text-decoration: none;
}

.kn-team-action a:hover::after,
.kn-team-action a:focus::after { transform: translateX(4px); }

.kn-team-subrole:empty,
.kn-team-role:empty,
.kn-team-text:empty,
.kn-team-action:empty { display: none; }

/* Sidebar: alte runde Dekoform entfernen, damit das CD konsequent bei Quadraten bleibt. */
.kn-sidebar::after { content: none !important; display: none !important; }

@media (max-width: 991.98px) {
  .kn-team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
  .kn-team-members { padding: 3rem 0; }
  .kn-team-grid { grid-template-columns: 1fr; }
  .kn-team-card { border-radius: 1.15rem; }
  .kn-team-photo { aspect-ratio: 4 / 3.9; }
  .kn-team-photo::after { inset: 30% 0 0; }
  .kn-team-body { padding: 1.05rem; }
  .kn-team-subrole {
    margin: -1.85rem 0 -0.16rem -0.15rem;
    font-size: 0.62rem;
  }
  .kn-team-name {
    margin-left: 0;
    font-size: 1.25rem;
  }
  .kn-team-role {
    margin-left: 0.05rem;
  }
}


/* ==========================================================
   OneByOne Bildbox / Bildband: typografische Abstufung
   H2 bleibt plakativ, Fliesstext darunter wirkt wie normaler Absatz.
   ========================================================== */

/* Bildband wieder etwas luftiger halten, damit Team-/Gruppenbilder nicht zu stark beschnitten werden. */
.kn-block-3 .onebyone-imagebox {
  min-height: clamp(340px, 30vw, 500px);
}

.kn-block-3 .onebyone-imagebox-media img {
  object-position: center 34%;
}

.onebyone-imagebox-text h2,
.onebyone-imagebox-text .h2 {
  margin: 0 auto 0.95rem;
  max-width: 860px;
  font-size: clamp(1.9rem, 3.1vw, 3.25rem);
  line-height: 1.08;
  font-weight: 700;
  color: #fff;
}

.onebyone-imagebox-text p {
  margin: 0 auto 1rem;
  max-width: 780px;
  font-size: clamp(1.04rem, 1.15vw, 1.18rem);
  line-height: 1.72;
  font-weight: 400;
  letter-spacing: normal;
  color: rgba(255, 255, 255, 0.94);
}

.onebyone-imagebox-text p:last-child {
  margin-bottom: 0;
}

.onebyone-imagebox-text .kn-imagebox-subline {
  max-width: 760px;
  font-size: clamp(1.04rem, 1.15vw, 1.18rem);
  line-height: 1.72;
  font-weight: 400;
  letter-spacing: normal;
  color: rgba(255, 255, 255, 0.94);
}

.onebyone-imagebox-text a {
  color: #fff;
  font-weight: 700;
  text-decoration-thickness: 2px;
  text-underline-offset: 0.18em;
}

.onebyone-imagebox-text a:hover,
.onebyone-imagebox-text a:focus {
  color: var(--kn-orange-light, #ff9a22);
}

/* ==========================================================
   MPForm: modernes Formular-Template fuer Klein-Noeh
   Nutzt das tabellenlose MPForm-Layout und ueberschreibt Modul-Defaults.
   ========================================================== */

.kn-mpform {
  position: relative;
  max-width: 900px;
  margin: 0 auto;
  padding: clamp(1.35rem, 3vw, 2.6rem);
  border: 1px solid rgba(45, 45, 44, 0.08);
  border-radius: clamp(1rem, 2vw, 1.45rem);
  background: linear-gradient(145deg, #fff 0%, #fffaf4 100%);
  box-shadow: 0 1.35rem 3.8rem rgba(45, 45, 44, 0.09);
}

.kn-mpform::before {
  content: "";
  position: absolute;
  top: 0;
  left: clamp(1rem, 2vw, 1.6rem);
  right: clamp(1rem, 2vw, 1.6rem);
  height: 4px;
  border-radius: 0 0 99px 99px;
  background: linear-gradient(90deg, var(--kn-orange), var(--kn-orange-dark));
}

.kn-mpform-intro {
  max-width: 760px;
  margin: 0 0 clamp(1.25rem, 2.5vw, 2rem);
  color: var(--kn-muted);
  font-size: clamp(1.02rem, 1.25vw, 1.15rem);
  line-height: 1.65;
}

.kn-mpform-intro p { margin: 0 0 1rem; }
.kn-mpform-intro p:last-child { margin-bottom: 0; }

.kn-mpform-field,
.mpform .kn-mpform-field {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.48rem;
  margin: 0 0 1.05rem;
}

.kn-mpform-label,
.kn-mpform .mpform_title {
  margin: 0;
  color: var(--kn-dark);
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.28;
}

.kn-mpform-label .required,
.kn-mpform-label .mpform_required,
.kn-mpform .required,
.kn-mpform .mpform_required {
  color: var(--kn-orange-dark);
  font-weight: 700;
}

.kn-mpform-help,
.kn-mpform .mpform_help {
  order: 3;
  margin: -0.18rem 0 0;
  color: rgba(36, 36, 36, 0.64);
  font-size: 0.92rem;
  line-height: 1.45;
}

.kn-mpform-control,
.kn-mpform .mpform_field {
  min-width: 0;
}

.kn-mpform input[type="text"],
.kn-mpform input[type="email"],
.kn-mpform input[type="tel"],
.kn-mpform input[type="url"],
.kn-mpform input[type="number"],
.kn-mpform input[type="date"],
.kn-mpform input[type="file"],
.kn-mpform select,
.kn-mpform textarea,
.kn-mpform .mpform_field input[type="text"],
.kn-mpform .mpform_field input[type="email"],
.kn-mpform .mpform_field input[type="tel"],
.kn-mpform .mpform_field select,
.kn-mpform .mpform_field textarea {
  width: 100%;
  min-height: 3.15rem;
  padding: 0.8rem 1rem;
  border: 1px solid rgba(45, 45, 44, 0.16);
  border-radius: 0.85rem;
  background: #fff;
  color: var(--kn-text);
  font: inherit;
  line-height: 1.4;
  box-shadow: 0 0.55rem 1.45rem rgba(45, 45, 44, 0.04);
  transition: border-color 0.22s ease, box-shadow 0.22s ease, background-color 0.22s ease;
}

.kn-mpform textarea,
.kn-mpform .mpform_field textarea {
  min-height: 9.5rem;
  resize: vertical;
}

.kn-mpform input[type="file"] {
  padding: 0.68rem 1rem;
  background: #fff;
}

.kn-mpform input:focus,
.kn-mpform select:focus,
.kn-mpform textarea:focus {
  border-color: var(--kn-orange);
  outline: 0;
  box-shadow: 0 0 0 0.24rem rgba(239, 125, 0, 0.16), 0 0.8rem 1.8rem rgba(45, 45, 44, 0.07);
}

.kn-mpform input::placeholder,
.kn-mpform textarea::placeholder {
  color: rgba(36, 36, 36, 0.48);
}

.kn-mpform input[type="checkbox"],
.kn-mpform input[type="radio"] {
  width: 1.15rem;
  height: 1.15rem;
  margin: 0.18rem 0.5rem 0 0;
  accent-color: var(--kn-orange);
}

.kn-mpform .mpform_field label,
.kn-mpform .checkbox,
.kn-mpform .radio {
  display: inline-flex;
  align-items: flex-start;
  gap: 0.35rem;
  margin: 0.25rem 1rem 0.25rem 0;
  color: var(--kn-text);
  line-height: 1.45;
}

.kn-mpform fieldset {
  margin: 1.4rem 0;
  padding: clamp(1rem, 2vw, 1.45rem);
  border: 1px solid rgba(45, 45, 44, 0.11);
  border-radius: 1rem;
  background: rgba(255, 255, 255, 0.72);
}

.kn-mpform legend {
  float: none;
  width: auto;
  padding: 0 0.45rem;
  color: var(--kn-dark);
  font-size: clamp(1.15rem, 1.45vw, 1.35rem);
  font-weight: 700;
}

.kn-mpform-submit,
.kn-mpform .submitbox {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.85rem;
  margin-top: clamp(1.25rem, 2.8vw, 2rem);
}

.kn-mpform input[type="submit"],
.kn-mpform button[type="submit"],
.kn-mpform .mpform_submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.15rem;
  padding: 0.78rem 1.35rem;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--kn-orange), var(--kn-orange-dark));
  color: #fff;
  font: inherit;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  box-shadow: 0 0.85rem 1.8rem rgba(239, 125, 0, 0.25);
  transition: transform 0.24s ease, box-shadow 0.24s ease, filter 0.24s ease;
  cursor: pointer;
}

.kn-mpform input[type="submit"]:hover,
.kn-mpform input[type="submit"]:focus,
.kn-mpform button[type="submit"]:hover,
.kn-mpform button[type="submit"]:focus,
.kn-mpform .mpform_submit:hover,
.kn-mpform .mpform_submit:focus {
  color: #fff;
  transform: translateY(-2px);
  filter: brightness(1.03);
  box-shadow: 0 1.05rem 2.15rem rgba(239, 125, 0, 0.32);
}

.kn-mpform input[type="submit"]:focus-visible,
.kn-mpform button[type="submit"]:focus-visible,
.kn-mpform .mpform_submit:focus-visible {
  outline: 3px solid rgba(239, 125, 0, 0.28);
  outline-offset: 4px;
}

.kn-mpform .errortext,
.kn-mpform .mpform_error,
.kn-mpform .error,
.kn-mpform .mpform_errortext {
  display: block;
  margin-top: 0.45rem;
  color: #9f2600;
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.4;
}

.kn-mpform .error input,
.kn-mpform .error textarea,
.kn-mpform .error select,
.kn-mpform .mpform_error input,
.kn-mpform .mpform_error textarea,
.kn-mpform .mpform_error select,
.kn-mpform .required_missing input,
.kn-mpform .required_missing textarea,
.kn-mpform .required_missing select {
  border-color: #c63a00;
  background: #fff9f5;
}

.kn-mpform .success,
.kn-mpform .mpform_success,
.kn-mpform .mpform_confirmation,
.kn-mpform .message {
  padding: 1rem 1.15rem;
  border: 1px solid rgba(239, 125, 0, 0.22);
  border-radius: 0.95rem;
  background: var(--kn-orange-soft);
  color: var(--kn-dark);
}

.kn-mpform .newline { display: none; }

@media (min-width: 992px) {
  .kn-mpform-field.kn-mpform-field-inline {
    grid-template-columns: minmax(180px, 0.34fr) minmax(0, 0.66fr);
    gap: 1.2rem;
    align-items: start;
  }
  .kn-mpform-field.kn-mpform-field-inline .kn-mpform-help { grid-column: 2; }
}

@media (max-width: 575.98px) {
  .kn-mpform { padding: 1.15rem; border-radius: 1rem; }
  .kn-mpform input[type="submit"],
  .kn-mpform button[type="submit"],
  .kn-mpform .mpform_submit { width: 100%; }
}

/* ==========================================================
   0.5.19 - MPForm: transparentes Formularlayout
   Abschnittshintergrund kommt vom WBCE-Block, das Formular selbst
   ist keine eigene helle Karte mehr.
   ========================================================== */

.kn-mpform {
  max-width: 900px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.kn-mpform::before {
  display: none;
}

.kn-mpform-intro {
  margin-bottom: clamp(1.35rem, 2.4vw, 2rem);
}

.kn-mpform-field,
.mpform .kn-mpform-field,
.kn-mpform .mpform_title,
.kn-mpform .mpform_field,
.kn-mpform .mpform_help {
  background: transparent !important;
  box-shadow: none !important;
}

.kn-mpform-field,
.mpform .kn-mpform-field {
  margin-bottom: clamp(1.05rem, 1.8vw, 1.35rem);
}

.kn-mpform input[type="text"],
.kn-mpform input[type="email"],
.kn-mpform input[type="tel"],
.kn-mpform input[type="url"],
.kn-mpform input[type="number"],
.kn-mpform input[type="date"],
.kn-mpform input[type="file"],
.kn-mpform select,
.kn-mpform textarea,
.kn-mpform .mpform_field input[type="text"],
.kn-mpform .mpform_field input[type="email"],
.kn-mpform .mpform_field input[type="tel"],
.kn-mpform .mpform_field select,
.kn-mpform .mpform_field textarea {
  background: rgba(255, 255, 255, 0.94);
  border-color: rgba(45, 45, 44, 0.14);
  box-shadow: 0 0.65rem 1.5rem rgba(45, 45, 44, 0.045);
}

.kn-mpform .mpform_field label,
.kn-mpform .checkbox,
.kn-mpform .radio {
  background: transparent !important;
}

.kn-mpform-submit,
.kn-mpform .submitbox {
  justify-content: center;
}

/* ==========================================================
   0.5.19 - Leistungsuebersicht: 10 Kacheln kompakt auf Unterseite
   Nutzung: <section class="kn-service-tiles kn-service-tiles-overview">
   ========================================================== */

.kn-service-tiles-overview .kn-service-tiles-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(1rem, 1.6vw, 1.45rem);
}

.kn-service-tiles-overview .kn-service-tile {
  border-radius: 1rem;
}

.kn-service-tiles-overview .kn-service-tile-body {
  padding: clamp(1rem, 1.6vw, 1.35rem);
}

.kn-service-tiles-overview .kn-service-tile h3 {
  font-size: clamp(1rem, 1.1vw, 1.18rem);
}

.kn-service-tiles-overview .kn-service-tile-text {
  font-size: 0.92rem;
  line-height: 1.5;
}

.kn-service-tiles-overview .kn-service-tile-media {
  aspect-ratio: 4 / 3;
}

@media (max-width: 1199.98px) {
  .kn-service-tiles-overview .kn-service-tiles-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .kn-service-tiles-overview .kn-service-tiles-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .kn-service-tiles-overview .kn-service-tiles-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================
   0.5.20 - MPForm: starke Overrides gegen Modul-Frontend-CSS
   Das mpform/frontend.css wird in WBCE nach dem Template geladen.
   Deshalb sind hier bewusst hohe Spezifitaet und !important gesetzt.
   ========================================================== */

.kn-formular .mpform,
.kn-formular .mpform form,
.kn-formular .mpform .kn-mpform {
  max-width: 900px !important;
  margin-right: auto !important;
  margin-left: auto !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.kn-formular .mpform .nixhier {
  position: absolute !important;
  overflow: hidden !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
}

.kn-formular .mpform .kn-mpform-field,
.kn-formular .mpform .kn-mpform .mpform_title,
.kn-formular .mpform .kn-mpform .mpform_field,
.kn-formular .mpform .kn-mpform .mpform_help,
.kn-formular .mpform .kn-mpform .captcha,
.kn-formular .mpform .kn-mpform .captcha_table,
.kn-formular .mpform .kn-mpform .captcha_table td,
.kn-formular .mpform .kn-mpform .mpform_small {
  width: 100% !important;
  max-width: none !important;
  padding-right: 0 !important;
  padding-left: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.kn-formular .mpform .kn-mpform .mpform_title,
.kn-formular .mpform .kn-mpform-label {
  display: block !important;
  margin: 0 0 0.42rem !important;
  color: var(--kn-dark) !important;
  font-size: 1.03rem !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

.kn-formular .mpform .kn-mpform .mpform_field {
  display: block !important;
  min-height: 0 !important;
  margin: 0 !important;
}

.kn-formular .mpform .kn-mpform .mpform_help,
.kn-formular .mpform .kn-mpform .mpform_small {
  color: rgba(36, 36, 36, 0.58) !important;
  font-size: 0.88rem !important;
  line-height: 1.45 !important;
}

.kn-formular .mpform .kn-mpform input[type="text"],
.kn-formular .mpform .kn-mpform input[type="email"],
.kn-formular .mpform .kn-mpform input[type="tel"],
.kn-formular .mpform .kn-mpform input[type="url"],
.kn-formular .mpform .kn-mpform input[type="number"],
.kn-formular .mpform .kn-mpform input[type="date"],
.kn-formular .mpform .kn-mpform input[type="file"],
.kn-formular .mpform .kn-mpform select,
.kn-formular .mpform .kn-mpform textarea {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 3.15rem !important;
  padding: 0.82rem 1rem !important;
  border: 1px solid rgba(45, 45, 44, 0.15) !important;
  border-radius: 0.85rem !important;
  background: rgba(255, 255, 255, 0.96) !important;
  color: var(--kn-text) !important;
  font-family: inherit !important;
  font-size: 1rem !important;
  line-height: 1.45 !important;
  box-shadow: 0 0.65rem 1.5rem rgba(45, 45, 44, 0.045) !important;
  transition: border-color 0.22s ease, box-shadow 0.22s ease, background-color 0.22s ease !important;
}

.kn-formular .mpform .kn-mpform textarea {
  min-height: 10rem !important;
  resize: vertical !important;
}

.kn-formular .mpform .kn-mpform input[type="file"] {
  min-height: auto !important;
  padding: 0.72rem 1rem !important;
}

.kn-formular .mpform .kn-mpform input:focus,
.kn-formular .mpform .kn-mpform select:focus,
.kn-formular .mpform .kn-mpform textarea:focus {
  border-color: var(--kn-orange) !important;
  outline: 0 !important;
  background: #fff !important;
  box-shadow: 0 0 0 0.22rem rgba(239, 125, 0, 0.15), 0 0.9rem 1.8rem rgba(45, 45, 44, 0.07) !important;
}

.kn-formular .mpform .kn-mpform input[type="checkbox"],
.kn-formular .mpform .kn-mpform input[type="radio"] {
  display: inline-block !important;
  width: 1.16rem !important;
  height: 1.16rem !important;
  min-height: auto !important;
  padding: 0 !important;
  margin: 0.18rem 0.58rem 0 0 !important;
  border-radius: 0.2rem !important;
  background: #fff !important;
  box-shadow: none !important;
  accent-color: var(--kn-orange) !important;
}

.kn-formular .mpform .kn-mpform .mpform_checkbox_label,
.kn-formular .mpform .kn-mpform .mpform_field label {
  display: inline !important;
  color: var(--kn-text) !important;
  font-size: 0.98rem !important;
  line-height: 1.5 !important;
  background: transparent !important;
}

.kn-formular .mpform .kn-mpform .captcha_table {
  border-collapse: separate !important;
  border-spacing: 0.45rem 0 !important;
}

.kn-formular .mpform .kn-mpform .captcha_table input[type="text"] {
  max-width: 9rem !important;
}

.kn-formular .mpform .kn-mpform-submit,
.kn-formular .mpform .kn-mpform .submitbox {
  display: flex !important;
  justify-content: center !important;
  margin-top: clamp(1.4rem, 2.8vw, 2.2rem) !important;
  padding: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.kn-formular .mpform .kn-mpform input[type="submit"],
.kn-formular .mpform .kn-mpform .mpform_submit,
.kn-formular .mpform .kn-mpform .btn-kn-orange {
  width: auto !important;
  min-width: 12rem !important;
}

@media (max-width: 575.98px) {
  .kn-formular .mpform .kn-mpform input[type="submit"],
  .kn-formular .mpform .kn-mpform .mpform_submit,
  .kn-formular .mpform .kn-mpform .btn-kn-orange {
    width: 100% !important;
  }
}


/* ==========================================================
   0.5.21 - MPForm: zweispaltige Projektanfrage und Feinschliff
   - Intro optisch an Klein-Noeh angepasst
   - Desktop: kompakteres 2-Spalten-Layout
   - Datei-Upload und Captcha sauber gestaltet
   ========================================================== */

.kn-formular .mpform .kn-mpform {
  max-width: 860px !important;
}

.kn-formular .mpform .kn-mpform-intro,
.kn-formular .mpform .kn-mpform .kn-mpform-intro {
  max-width: 760px !important;
  margin: 0 0 clamp(1.35rem, 2.4vw, 2rem) !important;
  padding: 0 !important;
  color: rgba(36, 36, 36, 0.72) !important;
}

.kn-formular .mpform .kn-mpform-intro h2,
.kn-formular .mpform .kn-mpform .kn-mpform-intro h2 {
  margin: 0 0 0.75rem !important;
  color: var(--kn-dark) !important;
  font-size: clamp(2rem, 3.2vw, 3.25rem) !important;
  line-height: 1.08 !important;
  font-weight: 700 !important;
  letter-spacing: -0.035em !important;
}

.kn-formular .mpform .kn-mpform-intro h2::after {
  content: "";
  display: block;
  width: 0.58rem;
  height: 0.58rem;
  margin-top: 0.72rem;
  border-radius: 0.14rem;
  background: var(--kn-orange);
  box-shadow:
    0.82rem 0 0 var(--kn-orange),
    1.64rem 0 0 var(--kn-orange),
    2.46rem 0 0 var(--kn-orange),
    3.28rem 0 0 var(--kn-orange);
}

.kn-formular .mpform .kn-mpform-intro p,
.kn-formular .mpform .kn-mpform .kn-mpform-intro p {
  max-width: 680px !important;
  margin: 0 !important;
  font-size: clamp(1rem, 1.18vw, 1.12rem) !important;
  line-height: 1.65 !important;
  color: rgba(36, 36, 36, 0.68) !important;
}

@media (min-width: 768px) {
  .kn-formular .mpform .kn-mpform {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    column-gap: clamp(1.05rem, 2vw, 1.65rem) !important;
    row-gap: clamp(1rem, 1.6vw, 1.35rem) !important;
    align-items: start !important;
  }

  .kn-formular .mpform .kn-mpform-intro,
  .kn-formular .mpform .kn-mpform .fid3,
  .kn-formular .mpform .kn-mpform .fid10,
  .kn-formular .mpform .kn-mpform .fid11,
  .kn-formular .mpform .kn-mpform .captcha,
  .kn-formular .mpform .kn-mpform-submit,
  .kn-formular .mpform .kn-mpform .submitbox {
    grid-column: 1 / -1 !important;
  }

  .kn-formular .mpform .kn-mpform-field,
  .kn-formular .mpform .kn-mpform .kn-mpform-field {
    margin-bottom: 0 !important;
  }
}

.kn-formular .mpform .kn-mpform .fid3 textarea {
  min-height: 8.2rem !important;
}

.kn-formular .mpform .kn-mpform .fid9 .mpform_field,
.kn-formular .mpform .kn-mpform .fid11 .mpform_field {
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.62rem !important;
}

.kn-formular .mpform .kn-mpform .fid9 input[type="checkbox"],
.kn-formular .mpform .kn-mpform .fid11 input[type="checkbox"] {
  flex: 0 0 auto !important;
  margin-top: 0.25rem !important;
}

.kn-formular .mpform .kn-mpform .fid10 .mpform_field {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 0.78rem !important;
  padding: 1rem !important;
  border: 1px dashed rgba(239, 125, 0, 0.34) !important;
  border-radius: 1rem !important;
  background: rgba(255, 255, 255, 0.54) !important;
}

.kn-formular .mpform .kn-mpform .fid10 .mpform_small {
  display: block !important;
  margin: 0 !important;
  color: rgba(36, 36, 36, 0.58) !important;
  font-size: 0.86rem !important;
  line-height: 1.5 !important;
}

.kn-formular .mpform .kn-mpform .fid10 .mpform_title .mpform_small,
.kn-formular .mpform .kn-mpform .fid10 .kn-mpform-help .mpform_small {
  display: none !important;
}

.kn-formular .mpform .kn-mpform .fid10 input[type="file"] {
  width: 100% !important;
  min-height: 3.1rem !important;
  padding: 0.72rem 1rem !important;
  border-style: solid !important;
  background: #fff !important;
  cursor: pointer !important;
}

.kn-formular .mpform .kn-mpform .captcha {
  padding: clamp(1rem, 2vw, 1.35rem) !important;
  border: 1px solid rgba(45, 45, 44, 0.09) !important;
  border-radius: 1rem !important;
  background: rgba(255, 255, 255, 0.46) !important;
}

.kn-formular .mpform .kn-mpform .captcha .mpform_field,
.kn-formular .mpform .kn-mpform .captcha_table,
.kn-formular .mpform .kn-mpform .captcha_table tbody,
.kn-formular .mpform .kn-mpform .captcha_table tr {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0.6rem !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.kn-formular .mpform .kn-mpform .captcha_table td,
.kn-formular .mpform .kn-mpform .captcha_table .text_captcha,
.kn-formular .mpform .kn-mpform .captcha_table .captcha_expl {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}

.kn-formular .mpform .kn-mpform .captcha_table .text_captcha {
  min-width: 6.8rem !important;
  padding: 0.72rem 0.95rem !important;
  border: 1px solid rgba(45, 45, 44, 0.12) !important;
  border-radius: 0.78rem !important;
  background: #fff !important;
  color: var(--kn-dark) !important;
  font-weight: 700 !important;
  text-align: center !important;
}

.kn-formular .mpform .kn-mpform .captcha_table input[type="text"] {
  width: 7.5rem !important;
  max-width: 7.5rem !important;
  min-height: 2.9rem !important;
  text-align: center !important;
}

.kn-formular .mpform .kn-mpform .captcha_table .captcha_expl {
  color: rgba(36, 36, 36, 0.6) !important;
  font-size: 0.88rem !important;
  line-height: 1.35 !important;
}

@media (max-width: 767.98px) {
  .kn-formular .mpform .kn-mpform {
    max-width: 100% !important;
  }

  .kn-formular .mpform .kn-mpform-intro h2,
  .kn-formular .mpform .kn-mpform .kn-mpform-intro h2 {
    font-size: clamp(1.8rem, 9vw, 2.5rem) !important;
  }

  .kn-formular .mpform .kn-mpform .captcha .mpform_field,
  .kn-formular .mpform .kn-mpform .captcha_table,
  .kn-formular .mpform .kn-mpform .captcha_table tbody,
  .kn-formular .mpform .kn-mpform .captcha_table tr {
    align-items: stretch !important;
  }
}


/* ==========================================================
   0.5.23 - FAQ-Header/Footer, flexible Blockhintergruende und leere Heros
   ========================================================== */

/* Komfort-Hintergrund fuer Blocknamen wie "warm", "beige" oder "papier" */
.kn-bg-warm,
.kn-warm,
.kn-beige,
.kn-papier {
  background:
    radial-gradient(circle at top left, rgba(239, 125, 0, 0.08), transparent 34rem),
    linear-gradient(135deg, #fbf6ee 0%, #f7f4ee 100%);
}

/* Fallback: leere Hero-/Members-Slider ausblenden, damit kein schwarzer Balken bleibt */
.kn-hero-section:has(.kn-hero-slider .carousel-inner:empty),
.kn-hero-members:has(.kn-hero-slider .carousel-inner:empty),
.kn-hero-slider:has(.carousel-inner:empty) {
  display: none !important;
}

/* FAQ-Modul: Header und Footer fuer Accordion-Bereiche */
.kn-faq-header {
  max-width: 760px;
  margin: 0 auto clamp(2rem, 3.5vw, 3rem) !important;
  text-align: left;
}

.kn-faq-header .kn-section-kicker {
  margin: 0 0 0.55rem !important;
  color: var(--kn-orange) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}

.kn-faq-header h2 {
  margin: 0 0 0.75rem !important;
  color: var(--kn-dark) !important;
}

.kn-faq-header h2::after {
  content: "";
  display: block;
  width: 4.7rem;
  height: 0.68rem;
  margin-top: 0.95rem;
  background:
    linear-gradient(var(--kn-orange), var(--kn-orange)) 0 0 / 0.68rem 0.68rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 1.0rem 0 / 0.68rem 0.68rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 2.0rem 0 / 0.68rem 0.68rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 3.0rem 0 / 0.68rem 0.68rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 4.0rem 0 / 0.68rem 0.68rem no-repeat;
}

.kn-faq-header p:not(.kn-section-kicker) {
  max-width: 720px;
  margin: 0 !important;
  color: rgba(36, 36, 36, 0.72) !important;
  font-size: clamp(1rem, 1.2vw, 1.1rem) !important;
  line-height: 1.65 !important;
}

.kn-faq-header p:last-child {
  margin-bottom: 0 !important;
}

.kn-faq-header + .eqd-accordion {
  margin-top: clamp(1.5rem, 3vw, 2.4rem) !important;
}

.kn-faq-footer {
  max-width: 760px;
  margin: clamp(1.75rem, 3vw, 2.5rem) auto 0 !important;
  padding: clamp(1.35rem, 2.5vw, 2rem) !important;
  border: 1px solid rgba(239, 125, 0, 0.16) !important;
  border-radius: 1.15rem !important;
  background:
    radial-gradient(circle at top right, rgba(239, 125, 0, 0.10), transparent 16rem),
    rgba(239, 125, 0, 0.055) !important;
}

.kn-faq-footer h3 {
  margin: 0 0 0.45rem !important;
  color: var(--kn-dark) !important;
}

.kn-faq-footer p {
  margin: 0 0 0.95rem !important;
  color: rgba(36, 36, 36, 0.74) !important;
  line-height: 1.65 !important;
}

.kn-faq-footer p:last-child {
  margin-bottom: 0 !important;
}

@media (max-width: 575.98px) {
  .kn-faq-header h2::after {
    width: 4.35rem;
    height: 0.62rem;
    background:
      linear-gradient(var(--kn-orange), var(--kn-orange)) 0 0 / 0.62rem 0.62rem no-repeat,
      linear-gradient(var(--kn-orange), var(--kn-orange)) 0.93rem 0 / 0.62rem 0.62rem no-repeat,
      linear-gradient(var(--kn-orange), var(--kn-orange)) 1.86rem 0 / 0.62rem 0.62rem no-repeat,
      linear-gradient(var(--kn-orange), var(--kn-orange)) 2.79rem 0 / 0.62rem 0.62rem no-repeat,
      linear-gradient(var(--kn-orange), var(--kn-orange)) 3.72rem 0 / 0.62rem 0.62rem no-repeat;
  }

  .kn-faq-footer {
    border-radius: 1rem !important;
  }
}

/* ==========================================================
   0.5.32 - Startseite: Leistungsbilder im 16:9-Format nach oben schieben
   Betrifft nur die Startseite. Die kompakte Leistungsuebersicht
   (.kn-service-tiles-overview) bleibt unveraendert.
   ========================================================== */

.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) .kn-service-tile-media img,
.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) .item img,
.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) article img,
.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) .card img {
  height: 125%;
  object-fit: cover;
  object-position: center top;
  transform: translateY(-20%);
}

.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) .kn-service-tile:hover .kn-service-tile-media img,
.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) .kn-service-tile:focus-within .kn-service-tile-media img,
.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) .item:hover img,
.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) article:hover img,
.kn-page.page-1 .kn-block-5:not(.kn-service-tiles-overview) .card:hover img {
  transform: translateY(-20%) scale(1.045);
}

.kn-service-tiles-overview .kn-service-tile-media img {
  height: 100%;
  object-position: center center;
  transform: none;
}

.kn-service-tiles-overview .kn-service-tile:hover .kn-service-tile-media img,
.kn-service-tiles-overview .kn-service-tile:focus-within .kn-service-tile-media img {
  transform: scale(1.045);
}


/* ==========================================================
   0.5.35 - Members Referenz-Galerie: Multi-Members,
   95vw-Raster, Bildfokus und Tooltip-Infos per Fragezeichen.
   ========================================================== */

.kn-reference-gallery {
  position: relative;
  width: 100%;
}

.kn-reference-gallery-inner,
.kn-reference-gallery > .container,
.kn-reference-gallery .container {
  position: relative;
  width: min(95vw, 1840px);
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: clamp(0.75rem, 1.25vw, 1.25rem);
  padding-right: clamp(0.75rem, 1.25vw, 1.25rem);
}

.kn-reference-header {
  width: min(95vw, 1180px);
  max-width: none;
  margin: 0 auto clamp(1.35rem, 2.4vw, 2.2rem);
  text-align: center;
}

.kn-reference-header .kn-section-kicker {
  margin: 0 0 0.45rem;
  color: var(--kn-orange);
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.kn-reference-header h2 {
  margin: 0;
  color: var(--kn-dark);
  font-size: clamp(2rem, 3.1vw, 3rem);
}

.kn-reference-header h2::after {
  content: "";
  display: block;
  width: 4.2rem;
  height: 0.58rem;
  margin: 0.75rem auto 0;
  background:
    linear-gradient(var(--kn-orange), var(--kn-orange)) 0 0 / 0.58rem 0.58rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 0.9rem 0 / 0.58rem 0.58rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 1.8rem 0 / 0.58rem 0.58rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 2.7rem 0 / 0.58rem 0.58rem no-repeat,
    linear-gradient(var(--kn-orange), var(--kn-orange)) 3.6rem 0 / 0.58rem 0.58rem no-repeat;
}

.kn-reference-header p:not(.kn-section-kicker) {
  max-width: 780px;
  margin: 0.9rem auto 0;
  color: rgba(36, 36, 36, 0.68);
  font-size: clamp(0.95rem, 1vw, 1.02rem);
  line-height: 1.58;
}

.kn-reference-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  width: min(95vw, 1660px);
  max-width: none;
  margin: 0 auto clamp(1.35rem, 2.6vw, 2.35rem);
}

button.kn-reference-filter,
.kn-reference-filter,
.kn-reference-gallery .kn-reference-filter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.2rem;
  padding: 0.48rem 0.88rem 0.42rem;
  border: 1px solid rgba(239, 125, 0, 0.45) !important;
  border-radius: 999px;
  background: #fffaf3 !important;
  color: var(--kn-orange) !important;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.1;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 7px 18px rgba(36, 36, 36, 0.055);
  transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

button.kn-reference-filter:hover,
button.kn-reference-filter:focus-visible,
.kn-reference-filter:hover,
.kn-reference-filter:focus-visible,
.kn-reference-gallery .kn-reference-filter:hover,
.kn-reference-gallery .kn-reference-filter:focus-visible {
  border-color: rgba(239, 125, 0, 0.78) !important;
  background: #fff !important;
  color: #d66f00 !important;
  transform: translateY(-1px);
  box-shadow: 0 11px 23px rgba(36, 36, 36, 0.10);
  outline: none;
}

button.kn-reference-filter.is-active,
.kn-reference-filter.is-active,
.kn-reference-gallery .kn-reference-filter.is-active,
.kn-reference-filter[aria-pressed="true"] {
  border-color: var(--kn-orange) !important;
  background: var(--kn-orange) !important;
  color: #fff !important;
  box-shadow: 0 13px 26px rgba(239, 125, 0, 0.25);
}

.kn-reference-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(0.78rem, 1vw, 1.05rem);
  align-items: start;
  width: 100%;
}

.kn-reference-source.is-collected,
.kn-reference-collected-section {
  display: none !important;
}

.kn-reference-group {
  display: contents;
}

.kn-reference-group-heading {
  display: none;
}

.kn-reference-card {
  position: relative;
  overflow: visible;
  border-radius: 1rem;
  opacity: 1;
  transform: translateY(0) scale(1);
  will-change: transform, opacity;
  transition: opacity 0.24s ease, transform 0.30s ease;
}

.kn-reference-card.is-filtering-out {
  opacity: 0;
  transform: translateY(0.55rem) scale(0.98);
  pointer-events: none;
}

.kn-reference-card.is-hidden {
  display: none !important;
}

.kn-reference-card:hover,
.kn-reference-card:focus-within {
  transform: translateY(-3px);
}

.kn-reference-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.kn-reference-media {
  position: relative;
  overflow: hidden;
  border-radius: 1rem;
  background: #eee7dc;
  aspect-ratio: 4 / 3;
  box-shadow: 0 14px 31px rgba(32, 28, 23, 0.11);
  border: 1px solid rgba(32, 28, 23, 0.055);
}

.kn-reference-media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(to top, rgba(22, 18, 14, 0.78) 0%, rgba(22, 18, 14, 0.38) 34%, rgba(22, 18, 14, 0.08) 62%, rgba(22, 18, 14, 0) 100%);
  opacity: 0.92;
  transition: opacity 0.25s ease;
  pointer-events: none;
}

.kn-reference-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transition: transform 0.38s ease;
}

.kn-reference-card:hover .kn-reference-media img,
.kn-reference-card:focus-within .kn-reference-media img {
  transform: scale(1.045);
}

.kn-reference-card:hover .kn-reference-media::after,
.kn-reference-card:focus-within .kn-reference-media::after {
  opacity: 1;
}

.kn-reference-media img[src*="/nopic"],
.kn-reference-media img[src*="xnopic"] {
  object-fit: contain;
  padding: clamp(1rem, 2.4vw, 2rem);
  opacity: 0.26;
  filter: grayscale(1);
  background: #f3eee6;
}

.kn-reference-link[href*="/nopic"] .kn-reference-media-icon {
  display: none;
}

.kn-reference-media-icon {
  position: absolute;
  right: 0.62rem;
  top: 0.62rem;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  color: var(--kn-orange);
  font-size: 1.02rem;
  font-weight: 850;
  line-height: 1;
  box-shadow: 0 9px 18px rgba(0, 0, 0, 0.15);
  opacity: 0;
  transform: translateY(-0.25rem);
  transition: opacity 0.22s ease, transform 0.22s ease;
}

.kn-reference-card:hover .kn-reference-media-icon,
.kn-reference-card:focus-within .kn-reference-media-icon {
  opacity: 1;
  transform: translateY(0);
}

.kn-reference-body {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0.82rem 0.82rem 0.86rem;
  pointer-events: none;
}

.kn-reference-category {
  display: none;
  align-items: center;
  width: fit-content;
  max-width: calc(100% - 3.15rem);
  margin: 0 0 -0.08rem -0.08rem;
  padding: 0.29rem 0.58rem 0.24rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--kn-orange);
  font-size: 0.58rem;
  font-weight: 850;
  line-height: 1.1;
  letter-spacing: 0.055em;
  text-transform: uppercase;
  box-shadow: 0 7px 17px rgba(0, 0, 0, 0.14);
  position: relative;
  z-index: 2;
}

.kn-reference-category:not(:empty):not(:has(.member-short1:empty)) {
  display: inline-flex;
}

.kn-reference-title {
  display: inline-block;
  max-width: calc(100% - 3.1rem);
  margin: 0;
  padding: 0.48rem 0.72rem 0.42rem;
  border-radius: 0.52rem;
  background: var(--kn-orange);
  color: #fff;
  font-size: clamp(0.95rem, 1.02vw, 1.13rem);
  font-weight: 850;
  line-height: 1.08;
  box-shadow: 0 9px 20px rgba(239, 125, 0, 0.26);
}

.kn-reference-tooltip {
  position: absolute;
  right: 0.78rem;
  bottom: 0.86rem;
  z-index: 8;
  pointer-events: auto;
}

.kn-reference-tooltip:empty,
.kn-reference-tooltip:not(:has(.member-long1)),
.kn-reference-tooltip:has(.member-long1:empty) {
  display: none;
}

.kn-reference-tooltip-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.05rem;
  height: 2.05rem;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.95);
  color: var(--kn-orange);
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.16);
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.kn-reference-tooltip-button:hover,
.kn-reference-tooltip-button:focus-visible,
.kn-reference-tooltip.is-open .kn-reference-tooltip-button {
  background: var(--kn-orange);
  color: #fff;
  transform: translateY(-1px);
  outline: none;
}

.kn-reference-tooltip-content {
  position: absolute;
  right: 0;
  bottom: calc(100% + 0.68rem);
  width: min(17.5rem, 82vw);
  padding: 0.78rem 0.9rem;
  border-radius: 0.78rem;
  background: rgba(255, 255, 255, 0.98);
  color: rgba(36, 36, 36, 0.78);
  font-size: 0.82rem;
  line-height: 1.45;
  box-shadow: 0 16px 35px rgba(32, 28, 23, 0.20);
  opacity: 0;
  visibility: hidden;
  transform: translateY(0.45rem);
  transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
  pointer-events: none;
}

.kn-reference-tooltip-content::after {
  content: "";
  position: absolute;
  right: 0.78rem;
  top: 100%;
  width: 0;
  height: 0;
  border-left: 0.42rem solid transparent;
  border-right: 0.42rem solid transparent;
  border-top: 0.42rem solid rgba(255, 255, 255, 0.98);
}

.kn-reference-tooltip-content p {
  margin: 0 0 0.42rem;
}

.kn-reference-tooltip-content p:last-child {
  margin-bottom: 0;
}

.kn-reference-tooltip:hover .kn-reference-tooltip-content,
.kn-reference-tooltip:focus-within .kn-reference-tooltip-content,
.kn-reference-tooltip.is-open .kn-reference-tooltip-content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}

.kn-reference-empty {
  display: none;
  max-width: 760px;
  margin: 2rem auto 0;
  padding: 1.25rem 1.5rem;
  border-radius: 1rem;
  background: rgba(239, 125, 0, 0.08);
  color: rgba(36, 36, 36, 0.72);
  text-align: center;
}

.kn-reference-gallery.is-empty .kn-reference-empty {
  display: block;
}

@media (max-width: 1699.98px) {
  .kn-reference-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 1399.98px) {
  .kn-reference-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1099.98px) {
  .kn-reference-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .kn-reference-gallery-inner,
  .kn-reference-gallery > .container,
  .kn-reference-gallery .container {
    width: 100%;
  }

  .kn-reference-header {
    width: 100%;
    text-align: left;
  }

  .kn-reference-header h2::after {
    margin-left: 0;
    margin-right: 0;
  }

  .kn-reference-filters {
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    width: 100%;
    padding-bottom: 0.35rem;
    scrollbar-width: thin;
  }

  .kn-reference-filter {
    flex: 0 0 auto;
  }

  .kn-reference-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kn-reference-body {
    padding: 0.68rem 0.68rem 0.72rem;
  }

  .kn-reference-title {
    max-width: calc(100% - 2.75rem);
    font-size: 0.92rem;
  }

  .kn-reference-tooltip {
    right: 0.66rem;
    bottom: 0.74rem;
  }

  .kn-reference-tooltip-button {
    width: 1.88rem;
    height: 1.88rem;
    font-size: 0.94rem;
  }

  .kn-reference-tooltip-content {
    width: min(15.5rem, 78vw);
    font-size: 0.8rem;
  }
}

@media (max-width: 479.98px) {
  .kn-reference-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kn-reference-card,
  .kn-reference-card *,
  .kn-reference-filter {
    transition: none !important;
  }
}

/* FolderGallery Referenzen: Klein-Noeh Optik -------------------------------------------------- */
.kn-reference-section .kn-foldergallery,
.kn-reference-section .kn-foldergallery-wrapper,
.kn-reference-section .kn-foldergallery-breadcrumb {
  width: min(95vw, 1660px);
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

.kn-reference-section .kn-foldergallery {
  margin-bottom: clamp(1rem, 2vw, 1.8rem);
  text-align: center;
}

.kn-reference-section .kn-foldergallery-header {
  max-width: 820px;
  margin: 0 auto;
}

.kn-reference-section .kn-foldergallery-title,
.kn-reference-section .fg_title {
  margin: 0;
  color: var(--kn-dark);
  font-size: clamp(1.8rem, 3.2vw, 3rem);
  font-weight: 850;
  line-height: 1.08;
}

.kn-reference-section .kn-foldergallery-title:empty,
.kn-reference-section .fg_title:empty {
  display: none;
}

.kn-reference-section .kn-foldergallery-description,
.kn-reference-section .fg_cat_description {
  max-width: 760px;
  margin: 0.75rem auto 0;
  color: rgba(36, 36, 36, 0.70);
  font-size: clamp(0.95rem, 1vw, 1.02rem);
  line-height: 1.58;
}

.kn-reference-section .kn-foldergallery-description:empty,
.kn-reference-section .fg_cat_description:empty {
  display: none;
}

.kn-reference-section .kn-foldergallery-breadcrumb,
.kn-reference-section .fg_bread_nav {
  margin-bottom: clamp(1.25rem, 2.3vw, 2.2rem);
  text-align: center;
}

.kn-reference-section .fg_bread_nav br {
  display: none;
}

.kn-reference-section .fg_crumb_nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.55rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kn-reference-section .fg_crumb_nav li {
  display: inline-flex;
  margin: 0;
  padding: 0;
}

.kn-reference-section .fg_crumb_nav a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.2rem;
  padding: 0.48rem 0.88rem 0.42rem;
  border: 1px solid rgba(239, 125, 0, 0.45);
  border-radius: 999px;
  background: #fffaf3;
  color: var(--kn-orange);
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.1;
  text-decoration: none;
  box-shadow: 0 7px 18px rgba(36, 36, 36, 0.055);
  transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
}

.kn-reference-section .fg_crumb_nav a:hover,
.kn-reference-section .fg_crumb_nav a:focus-visible {
  border-color: var(--kn-orange);
  background: var(--kn-orange);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 13px 26px rgba(239, 125, 0, 0.25);
  outline: none;
}

.kn-reference-section .kn-foldergallery-wrapper,
.kn-reference-section .fg_wrapper {
  padding: 0;
  color: var(--kn-dark);
}

.kn-reference-section .kn-foldergallery-categories,
.kn-reference-section .fg_categories,
.kn-reference-section .kn-foldergallery-images,
.kn-reference-section .fg_category {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(0.78rem, 1vw, 1.05rem);
  align-items: start;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
}

.kn-reference-section .kn-foldergallery-categories:empty,
.kn-reference-section .fg_categories:empty,
.kn-reference-section .kn-foldergallery-images:empty,
.kn-reference-section .fg_category:empty {
  display: none;
}

.kn-reference-section .kn-foldergallery-category-item,
.kn-reference-section .fg_categories li {
  display: block;
  margin: 0;
  padding: 0;
}

.kn-reference-section .kn-foldergallery-category-link,
.kn-reference-section .fg_categories li > a,
.kn-reference-section .kn-foldergallery-image-link,
.kn-reference-section .fg_category > a {
  position: relative;
  display: block;
  overflow: hidden;
  min-width: 0;
  border-radius: 1rem;
  color: inherit;
  text-decoration: none;
  background: #eee7dc;
  box-shadow: 0 14px 31px rgba(32, 28, 23, 0.11);
  border: 1px solid rgba(32, 28, 23, 0.055);
  transform: translateY(0);
  transition: transform 0.24s ease, box-shadow 0.24s ease, border-color 0.24s ease;
}

.kn-reference-section .kn-foldergallery-category-link:hover,
.kn-reference-section .kn-foldergallery-category-link:focus-visible,
.kn-reference-section .fg_categories li > a:hover,
.kn-reference-section .fg_categories li > a:focus-visible,
.kn-reference-section .kn-foldergallery-image-link:hover,
.kn-reference-section .kn-foldergallery-image-link:focus-visible,
.kn-reference-section .fg_category > a:hover,
.kn-reference-section .fg_category > a:focus-visible {
  transform: translateY(-3px);
  border-color: rgba(239, 125, 0, 0.24);
  box-shadow: 0 18px 36px rgba(32, 28, 23, 0.16);
  outline: none;
}

.kn-reference-section .kn-foldergallery-category-media,
.kn-reference-section .fg_categories li > a,
.kn-reference-section .kn-foldergallery-image-link,
.kn-reference-section .fg_category > a {
  aspect-ratio: 4 / 3;
}

.kn-reference-section .kn-foldergallery-category-media {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #eee7dc;
}

.kn-reference-section .kn-foldergallery-category-media::after,
.kn-reference-section .fg_categories li > a::before,
.kn-reference-section .kn-foldergallery-image-link::before,
.kn-reference-section .fg_category > a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(to top, rgba(22, 18, 14, 0.78) 0%, rgba(22, 18, 14, 0.38) 34%, rgba(22, 18, 14, 0.08) 62%, rgba(22, 18, 14, 0) 100%);
  opacity: 0.92;
  transition: opacity 0.25s ease;
  pointer-events: none;
}

.kn-reference-section .kn-foldergallery-image-link::before,
.kn-reference-section .fg_category > a::before {
  opacity: 0.32;
  background: linear-gradient(to top, rgba(22, 18, 14, 0.42) 0%, rgba(22, 18, 14, 0.08) 42%, rgba(22, 18, 14, 0) 100%);
}

.kn-reference-section .kn-foldergallery-category-link:hover .kn-foldergallery-category-media::after,
.kn-reference-section .kn-foldergallery-category-link:focus-visible .kn-foldergallery-category-media::after,
.kn-reference-section .fg_categories li > a:hover::before,
.kn-reference-section .fg_categories li > a:focus-visible::before,
.kn-reference-section .kn-foldergallery-image-link:hover::before,
.kn-reference-section .kn-foldergallery-image-link:focus-visible::before,
.kn-reference-section .fg_category > a:hover::before,
.kn-reference-section .fg_category > a:focus-visible::before {
  opacity: 1;
}

.kn-reference-section .kn-foldergallery-category-media img,
.kn-reference-section .fg_categories img,
.kn-reference-section .kn-foldergallery-image-link img,
.kn-reference-section .fg_category img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  transition: transform 0.38s ease;
}

.kn-reference-section .kn-foldergallery-category-link:hover img,
.kn-reference-section .kn-foldergallery-category-link:focus-visible img,
.kn-reference-section .fg_categories li > a:hover img,
.kn-reference-section .fg_categories li > a:focus-visible img,
.kn-reference-section .kn-foldergallery-image-link:hover img,
.kn-reference-section .kn-foldergallery-image-link:focus-visible img,
.kn-reference-section .fg_category > a:hover img,
.kn-reference-section .fg_category > a:focus-visible img {
  transform: scale(1.045);
}

.kn-reference-section .kn-foldergallery-category-title,
.kn-reference-section .fg_categories li > a {
  font-size: 0;
}

.kn-reference-section .kn-foldergallery-category-title {
  position: absolute;
  left: 0.82rem;
  bottom: 0.86rem;
  z-index: 3;
  display: inline-block;
  max-width: calc(100% - 1.64rem);
  padding: 0.48rem 0.72rem 0.42rem;
  border-radius: 0.52rem;
  background: var(--kn-orange);
  color: #fff;
  font-size: clamp(0.95rem, 1.02vw, 1.13rem);
  font-weight: 850;
  line-height: 1.08;
  box-shadow: 0 9px 20px rgba(239, 125, 0, 0.26);
}

.kn-reference-section .fg_categories li > a br {
  display: none;
}

.kn-reference-section .fg_categories li > a img + br + * {
  font-size: initial;
}

.kn-reference-section .kn-foldergallery-category-link::after,
.kn-reference-section .fg_categories li > a::after,
.kn-reference-section .kn-foldergallery-image-link::after,
.kn-reference-section .fg_category > a::after {
  position: absolute;
  right: 0.62rem;
  top: 0.62rem;
  z-index: 4;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.94);
  color: var(--kn-orange);
  font-size: 1.02rem;
  font-weight: 850;
  line-height: 1;
  box-shadow: 0 9px 18px rgba(0, 0, 0, 0.15);
  opacity: 0;
  transform: translateY(-0.25rem);
  transition: opacity 0.22s ease, transform 0.22s ease;
  pointer-events: none;
}

.kn-reference-section .kn-foldergallery-category-link::after,
.kn-reference-section .fg_categories li > a::after {
  content: "→";
}

.kn-reference-section .kn-foldergallery-image-link::after,
.kn-reference-section .fg_category > a::after {
  content: "+";
}

.kn-reference-section .kn-foldergallery-category-link:hover::after,
.kn-reference-section .kn-foldergallery-category-link:focus-visible::after,
.kn-reference-section .fg_categories li > a:hover::after,
.kn-reference-section .fg_categories li > a:focus-visible::after,
.kn-reference-section .kn-foldergallery-image-link:hover::after,
.kn-reference-section .kn-foldergallery-image-link:focus-visible::after,
.kn-reference-section .fg_category > a:hover::after,
.kn-reference-section .fg_category > a:focus-visible::after {
  opacity: 1;
  transform: translateY(0);
}

.kn-reference-section .kn-foldergallery-images {
  margin-top: 0;
}

.kn-reference-section .fg_pagination_wrapper,
.kn-reference-section .kn-foldergallery-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  margin: clamp(1.5rem, 2.5vw, 2.5rem) auto 0;
  color: rgba(36, 36, 36, 0.66);
  font-size: 0.9rem;
  font-weight: 700;
}

.kn-reference-section .fg_pagination_wrapper a,
.kn-reference-section .fg_pagination_wrapper strong,
.kn-reference-section .fg_pagination_wrapper span:not(.fg_pagination_label) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  min-height: 2rem;
  padding: 0.35rem 0.62rem 0.3rem;
  border-radius: 999px;
  background: #fffaf3;
  color: var(--kn-orange);
  text-decoration: none;
  box-shadow: 0 7px 18px rgba(36, 36, 36, 0.055);
}

.kn-reference-section .fg_pagination_wrapper strong,
.kn-reference-section .fg_pagination_wrapper span:not(.fg_pagination_label) {
  background: var(--kn-orange);
  color: #fff;
}

@media (max-width: 1699.98px) {
  .kn-reference-section .kn-foldergallery-categories,
  .kn-reference-section .fg_categories,
  .kn-reference-section .kn-foldergallery-images,
  .kn-reference-section .fg_category {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 1399.98px) {
  .kn-reference-section .kn-foldergallery-categories,
  .kn-reference-section .fg_categories,
  .kn-reference-section .kn-foldergallery-images,
  .kn-reference-section .fg_category {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1099.98px) {
  .kn-reference-section .kn-foldergallery-categories,
  .kn-reference-section .fg_categories,
  .kn-reference-section .kn-foldergallery-images,
  .kn-reference-section .fg_category {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 767.98px) {
  .kn-reference-section .kn-foldergallery,
  .kn-reference-section .kn-foldergallery-wrapper,
  .kn-reference-section .kn-foldergallery-breadcrumb {
    width: 100%;
  }

  .kn-reference-section .kn-foldergallery-categories,
  .kn-reference-section .fg_categories,
  .kn-reference-section .kn-foldergallery-images,
  .kn-reference-section .fg_category {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kn-reference-section .kn-foldergallery-category-title {
    left: 0.68rem;
    bottom: 0.72rem;
    max-width: calc(100% - 1.36rem);
    font-size: 0.92rem;
  }

  .kn-reference-section .kn-foldergallery-category-link::after,
  .kn-reference-section .fg_categories li > a::after,
  .kn-reference-section .kn-foldergallery-image-link::after,
  .kn-reference-section .fg_category > a::after {
    width: 1.72rem;
    height: 1.72rem;
    font-size: 0.96rem;
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 479.98px) {
  .kn-reference-section .kn-foldergallery-categories,
  .kn-reference-section .fg_categories,
  .kn-reference-section .kn-foldergallery-images,
  .kn-reference-section .fg_category {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .kn-reference-section .kn-foldergallery-category-link,
  .kn-reference-section .fg_categories li > a,
  .kn-reference-section .kn-foldergallery-image-link,
  .kn-reference-section .fg_category > a,
  .kn-reference-section .kn-foldergallery-category-link *,
  .kn-reference-section .fg_categories li > a *,
  .kn-reference-section .kn-foldergallery-image-link *,
  .kn-reference-section .fg_category > a * {
    transition: none !important;
  }
}

/* FolderGallery Bildbeschreibung / Info-Tooltip --------------------------------------------- */
/* Caption wird nur ueber Info-Button-Hover/Fokus oder per Klick angezeigt, nicht beim Bild-Hover. */
.kn-reference-section .kn-foldergallery-image-card,
.kn-reference-section .fg_category > figure.kn-foldergallery-image-card {
  position: relative;
  display: block;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
}

.kn-reference-section .kn-foldergallery-image-card .kn-foldergallery-image-link {
  width: 100%;
  height: auto;
}

.kn-reference-section .kn-foldergallery-info-button {
  position: absolute;
  right: 0.72rem;
  bottom: 0.72rem;
  z-index: 8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.05rem;
  height: 2.05rem;
  border: 0;
  border-radius: 999px;
  background: rgba(239, 125, 0, 0.97);
  color: #fff;
  font-size: 1rem;
  font-weight: 850;
  line-height: 1;
  box-shadow: 0 10px 23px rgba(32, 28, 23, 0.22);
  cursor: pointer;
  opacity: 1;
  transform: none;
  transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
}

.kn-reference-section .kn-foldergallery-image-card.has-caption .kn-foldergallery-info-button {
  opacity: 1;
  transform: none;
}

.kn-reference-section .kn-foldergallery-info-button:hover,
.kn-reference-section .kn-foldergallery-info-button:focus-visible,
.kn-reference-section .kn-foldergallery-image-card.is-caption-open .kn-foldergallery-info-button {
  background: var(--kn-dark);
  color: #fff;
  outline: none;
  transform: translateY(-0.08rem) scale(1.04);
  box-shadow: 0 14px 28px rgba(32, 28, 23, 0.28);
}

.kn-reference-section .kn-foldergallery-image-caption {
  position: absolute;
  right: 0.72rem;
  bottom: 3.25rem;
  z-index: 9;
  width: min(20rem, calc(100% - 1.44rem));
  padding: 0.86rem 1rem 0.78rem;
  border-radius: 0.78rem;
  background: rgba(31, 26, 21, 0.95);
  color: #fff;
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
  text-align: left;
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.28);
  opacity: 0;
  visibility: hidden;
  transform: translateY(0.45rem);
  transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
  pointer-events: none;
}

.kn-reference-section .kn-foldergallery-image-caption::after {
  content: "";
  position: absolute;
  right: 1.08rem;
  bottom: -0.4rem;
  width: 0.82rem;
  height: 0.82rem;
  background: rgba(31, 26, 21, 0.95);
  transform: rotate(45deg);
}

.kn-reference-section .kn-foldergallery-info-button:hover + .kn-foldergallery-image-caption,
.kn-reference-section .kn-foldergallery-info-button:focus-visible + .kn-foldergallery-image-caption,
.kn-reference-section .kn-foldergallery-image-card.has-caption.is-caption-open .kn-foldergallery-image-caption {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.kn-reference-section .kn-foldergallery-image-card:not(.has-caption) .kn-foldergallery-info-button,
.kn-reference-section .kn-foldergallery-image-card:not(.has-caption) .kn-foldergallery-image-caption {
  display: none;
}

@media (max-width: 767.98px) {
  .kn-reference-section .kn-foldergallery-info-button {
    opacity: 1;
    transform: none;
  }
}

@media (max-width: 575.98px) {
  .kn-reference-section .kn-foldergallery-image-caption {
    left: 0.62rem;
    right: 0.62rem;
    bottom: 3.05rem;
    width: auto;
    font-size: 0.86rem;
  }
}

/* Nachhaltigkeit Kacheln */
.kn-sustainability-tiles {
  background: #f7f4ee;
}

.kn-sustainability-tile .kn-service-tile-media {
  aspect-ratio: 4 / 3;
}

.kn-sustainability-tile h3 {
  color: #1f1b16;
}

/* Nachhaltigkeit Members-Iconkarten ab v0.5.43 */
.kn-sustainability-tiles {
  background: #f7f4ee;
  padding: clamp(3.5rem, 6vw, 6rem) 0;
}

.kn-sustainability-tiles > .container {
  max-width: min(1180px, calc(100% - 32px));
}

.kn-sustainability-header {
  max-width: 820px;
  margin: 0 auto clamp(2rem, 4vw, 3.2rem);
  text-align: center;
}

.kn-sustainability-header .kn-section-kicker {
  margin-left: auto;
  margin-right: auto;
}

.kn-sustainability-header h2 {
  color: #1f1b16;
  margin-bottom: 0.9rem;
}

.kn-sustainability-header p {
  color: rgba(31, 27, 22, 0.78);
  font-size: clamp(1rem, 1.3vw, 1.12rem);
  line-height: 1.65;
  margin-bottom: 0;
}

.kn-sustainability-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1rem, 2vw, 1.45rem);
}

.kn-sustainability-group {
  display: contents;
}

.kn-sustainability-card {
  position: relative;
  min-height: 100%;
  padding: clamp(1.35rem, 2vw, 1.75rem);
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(31, 27, 22, 0.08);
  box-shadow: 0 18px 46px rgba(31, 27, 22, 0.09);
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.kn-sustainability-card::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 5px;
  background: linear-gradient(90deg, #ef7d00, rgba(239, 125, 0, 0.22));
}

.kn-sustainability-card::after {
  content: "";
  position: absolute;
  right: -34px;
  bottom: -38px;
  width: 130px;
  height: 130px;
  border-radius: 999px;
  background: rgba(239, 125, 0, 0.06);
  pointer-events: none;
}

.kn-sustainability-card:hover,
.kn-sustainability-card:focus-within {
  transform: translateY(-4px);
  border-color: rgba(239, 125, 0, 0.22);
  box-shadow: 0 24px 58px rgba(31, 27, 22, 0.13);
}

.kn-sustainability-icon {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 74px;
  height: 74px;
  margin-bottom: 1.15rem;
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(239, 125, 0, 0.16), rgba(239, 125, 0, 0.06));
  box-shadow: inset 0 0 0 1px rgba(239, 125, 0, 0.18);
}

.kn-sustainability-icon::before {
  content: "";
  display: block;
  width: 42px;
  height: 42px;
  background: #ef7d00;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

.kn-sustainability-icon-quality .kn-sustainability-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 5 52 13v16c0 14-8 25-20 30C20 54 12 43 12 29V13L32 5Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='m22 32 7 7 15-17' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 5 52 13v16c0 14-8 25-20 30C20 54 12 43 12 29V13L32 5Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='m22 32 7 7 15-17' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.kn-sustainability-icon-planning .kn-sustainability-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M10 52 34 10l20 42H10Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M25 52 34 36l8 16' fill='none' stroke='black' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M18 44h6M22 38h5M26 31h5M30 25h5' stroke='black' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M10 52 34 10l20 42H10Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M25 52 34 36l8 16' fill='none' stroke='black' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M18 44h6M22 38h5M26 31h5M30 25h5' stroke='black' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.kn-sustainability-icon-material .kn-sustainability-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M50 10C31 9 14 21 13 42c17 5 35-2 41-22 2-6 1-9-4-10Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M16 47c12-16 22-21 35-31' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M27 34c-1-5-3-9-7-12M35 28c4 0 8 1 12 3' fill='none' stroke='black' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M50 10C31 9 14 21 13 42c17 5 35-2 41-22 2-6 1-9-4-10Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M16 47c12-16 22-21 35-31' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M27 34c-1-5-3-9-7-12M35 28c4 0 8 1 12 3' fill='none' stroke='black' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E");
}

.kn-sustainability-icon-region .kn-sustainability-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 58s19-18 19-34C51 13 43 6 32 6S13 13 13 24c0 16 19 34 19 34Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Ccircle cx='32' cy='24' r='7' fill='none' stroke='black' stroke-width='5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 58s19-18 19-34C51 13 43 6 32 6S13 13 13 24c0 16 19 34 19 34Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Ccircle cx='32' cy='24' r='7' fill='none' stroke='black' stroke-width='5'/%3E%3C/svg%3E");
}

.kn-sustainability-icon-technology .kn-sustainability-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 22a10 10 0 1 0 0 20 10 10 0 0 0 0-20Z' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M32 5v9M32 50v9M12 17l7 6M45 41l7 6M5 32h9M50 32h9M12 47l7-6M45 23l7-6' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 22a10 10 0 1 0 0 20 10 10 0 0 0 0-20Z' fill='none' stroke='black' stroke-width='5'/%3E%3Cpath d='M32 5v9M32 50v9M12 17l7 6M45 41l7 6M5 32h9M50 32h9M12 47l7-6M45 23l7-6' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.kn-sustainability-icon-repair .kn-sustainability-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M48 18A22 22 0 0 0 14 27' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M14 16v11h11' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16 46a22 22 0 0 0 34-9' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M50 48V37H39' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M48 18A22 22 0 0 0 14 27' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M14 16v11h11' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M16 46a22 22 0 0 0 34-9' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M50 48V37H39' fill='none' stroke='black' stroke-width='5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.kn-sustainability-card:not([class*="kn-sustainability-icon-"]) .kn-sustainability-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M50 10C31 9 14 21 13 42c17 5 35-2 41-22 2-6 1-9-4-10Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M16 47c12-16 22-21 35-31' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M50 10C31 9 14 21 13 42c17 5 35-2 41-22 2-6 1-9-4-10Z' fill='none' stroke='black' stroke-width='5' stroke-linejoin='round'/%3E%3Cpath d='M16 47c12-16 22-21 35-31' fill='none' stroke='black' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
}

.kn-sustainability-body {
  position: relative;
  z-index: 1;
}

.kn-sustainability-card h3 {
  color: #1f1b16;
  font-size: clamp(1.2rem, 1.6vw, 1.42rem);
  line-height: 1.2;
  margin: 0 0 0.72rem;
}

.kn-sustainability-text,
.kn-sustainability-text p {
  color: rgba(31, 27, 22, 0.78);
  font-size: 1rem;
  line-height: 1.58;
}

.kn-sustainability-text p:last-child {
  margin-bottom: 0;
}

@media (max-width: 991.98px) {
  .kn-sustainability-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .kn-sustainability-tiles {
    padding: 3rem 0;
  }

  .kn-sustainability-grid {
    grid-template-columns: 1fr;
  }

  .kn-sustainability-card {
    border-radius: 20px;
  }

  .kn-sustainability-icon {
    width: 64px;
    height: 64px;
    border-radius: 19px;
  }

  .kn-sustainability-icon::before {
    width: 36px;
    height: 36px;
  }
}

/* Nachhaltigkeit Iconkarten ab v0.5.44: eigene Members-Bilder als Icons */
.kn-sustainability-card::after {
  display: none;
}

.kn-sustainability-icon {
  margin-left: auto;
  margin-right: auto;
  background: transparent;
  box-shadow: none;
}

.kn-sustainability-icon img {
  display: block;
  width: 58px;
  height: 58px;
  object-fit: contain;
  object-position: center;
}

.kn-sustainability-icon:has(img)::before {
  display: none;
}

.kn-sustainability-card h3 {
  text-align: center;
}

.kn-sustainability-text,
.kn-sustainability-text p {
  text-align: center;
}

@media (max-width: 575.98px) {
  .kn-sustainability-icon img {
    width: 52px;
    height: 52px;
  }
}

/* Nachhaltigkeit Kachelansicht ab v0.5.45: Variante mit Members-Bildern/Service-Tiles */
.kn-sustainability-tiles {
  background: none;
}

.kn-sustainability-tile .kn-service-tile-media {
  aspect-ratio: 4 / 3;
}

.kn-sustainability-tile h3 {
  color: #1f1b16;
  
}

.kn-job-tiles-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1199.98px) {
  .kn-job-tiles-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .kn-job-tiles-grid {
    grid-template-columns: 1fr;
  }
}

.kn-job-tile .kn-service-tile-media {
  aspect-ratio: 4 / 3;
}

.kn-job-tile h3 {
  color: #1f1b16;
}


.kn-job-tile h3 {
  font-size: clamp(1.35rem, 1.7vw, 1.75rem);
  line-height: 1.15;
  hyphens: auto;
}

.kn-job-tile .kn-service-tile-body h3 {
  word-break: normal;
  overflow-wrap: anywhere;
}

.kn-short-question-note {
  max-width: 760px;
  margin: 0 auto 36px;
  padding: 24px 28px;
  border-radius: 24px;
  background: #f7f4ee;
}

.kn-short-question-note p:last-child {
  margin-bottom: 0;
}


.kn-sustainability-highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 3vw, 32px);
  margin-top: clamp(32px, 5vw, 56px);
}

.kn-sustainability-highlight {
  padding: clamp(24px, 3vw, 34px);
  border-radius: 24px;
  background: #f7f4ee;
  box-shadow: 0 16px 42px rgba(31, 27, 22, 0.08);
}

.kn-sustainability-highlight-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  margin-bottom: 18px;
  border-radius: 14px;
  background: #ef7d00;
  color: #fff;
  font-weight: 700;
  font-size: 1.35rem;
}

.kn-sustainability-highlight h3 {
  margin-bottom: 14px;
  color: #1f1b16;
}

.kn-sustainability-highlight p {
  margin-bottom: 0;
}

@media (max-width: 991.98px) {
  .kn-sustainability-highlights {
    grid-template-columns: 1fr;
  }
}

.kn-sustainability-highlights {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(18px, 2.4vw, 28px);
  margin-top: clamp(28px, 4vw, 44px);
}

.kn-sustainability-highlight {
  padding: clamp(20px, 2.5vw, 28px);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 14px 36px rgba(31, 27, 22, 0.08);
}

.kn-sustainability-highlights-compact .kn-sustainability-highlight {
  padding: clamp(18px, 2vw, 24px);
}

.kn-sustainability-highlight h3 {
  margin: 0 0 12px;
  color: #1f1b16;
  font-size: clamp(1.25rem, 1.45vw, 1.55rem);
  line-height: 1.2;
}

.kn-sustainability-highlight p {
  margin-bottom: 0;
  font-size: 1rem;
  line-height: 1.6;
}

.kn-sdg-badge {
  display: inline-grid;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 7px;
  margin-bottom: 16px;
  padding: 8px 12px;
  border-radius: 14px;
  color: #fff;
  line-height: 1;
}

.kn-sdg-badge span {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  opacity: 0.9;
}

.kn-sdg-badge strong {
  font-size: 1.45rem;
  font-weight: 800;
}

/* SDG 8: Menschenwürdige Arbeit und Wirtschaftswachstum */
.kn-sdg-8 {
  background: #a21942;
}

/* SDG 12: Nachhaltiger Konsum und Produktion */
.kn-sdg-12 {
  background: #bf8b2e;
}

/* SDG 9: Industrie, Innovation und Infrastruktur */
.kn-sdg-9 {
  background: #fd6925;
}

@media (max-width: 991.98px) {
  .kn-sustainability-highlights {
    grid-template-columns: 1fr;
  }
}

.kn-info-note {
  margin-top: 24px;
  padding: 20px 24px;
  border-left: 4px solid #ef7d00;
  border-radius: 16px;
  background: #f7f4ee;
}

.kn-info-note p:last-child {
  margin-bottom: 0;
}