*{box-sizing:border-box}html{font-size:100%;scroll-behavior:smooth}body{margin:0;background:var(--kf-bg);color:var(--kf-text);font-family:var(--kf-font);font-size:var(--kf-font-size);line-height:1.62}:where(.topbar,.site-header,.hero-section,.phase2-hero,.site-footer) a{color:var(--kf-primary);text-decoration-thickness:.09em;text-underline-offset:.18em}:where(.topbar,.site-header,.hero-section,.phase2-hero,.site-footer) a:hover{color:var(--kf-secondary)}img{max-width:100%;height:auto}.container{width:min(calc(100% - 32px),var(--kf-container));margin-inline:auto}.skip-link{position:absolute;left:-999px;top:8px;z-index:9999;background:#fff;color:#000;padding:.75rem 1rem;border-radius:.5rem}.skip-link:focus{left:8px}.topbar{background:var(--kf-primary);color:#fff;font-size:.95rem}.topbar a{color:#fff}.topbar .container{display:flex;justify-content:flex-end;gap:1rem;padding:.35rem 0}.site-header{background:rgba(255,255,255,.94);border-bottom:1px solid rgba(11,79,138,.12);backdrop-filter:blur(10px);z-index:20}.has-sticky-header .site-header{position:sticky;top:0}.header-inner{min-height:86px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:1.25rem}.brand{display:inline-flex;align-items:center;gap:.85rem;color:var(--kf-text);text-decoration:none}.brand-logo{width:auto;max-width:220px;max-height:58px}.brand-mark{display:grid;place-items:center;width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,var(--kf-primary),var(--kf-secondary));color:#fff;font-weight:800;font-size:1.6rem;box-shadow:0 10px 24px rgba(11,79,138,.18)}.brand-text{display:flex;flex-direction:column;line-height:1.15}.brand-text strong{font-size:1.25rem}.brand-text small{font-size:.86rem;color:#64748b;margin-top:.25rem}.mainnav{justify-self:end}.mainnav ul{display:flex;align-items:center;gap:.25rem;list-style:none;margin:0;padding:0}.mainnav li{position:relative}.mainnav a,.mainnav .mod-menu__heading,.mainnav .nav-header,.mainnav .separator{display:flex;align-items:center;gap:.35rem;padding:.65rem .8rem;border-radius:999px;text-decoration:none;color:var(--kf-text);font-weight:650;white-space:nowrap}.mainnav a:hover,.mainnav .mod-menu__heading:hover,.mainnav .nav-header:hover,.mainnav .separator:hover,.mainnav .current>a,.mainnav .active>a,.mainnav .current>.mod-menu__heading,.mainnav .active>.mod-menu__heading,.mainnav .current>.nav-header,.mainnav .active>.nav-header,.mainnav .current>.separator,.mainnav .active>.separator{background:rgba(11,79,138,.09);color:var(--kf-primary)}.mainnav li.parent>a::after,.mainnav li.deeper>a::after,.mainnav li.parent>.mod-menu__heading::after,.mainnav li.deeper>.mod-menu__heading::after,.mainnav li.parent>.nav-header::after,.mainnav li.deeper>.nav-header::after,.mainnav li.parent>.separator::after,.mainnav li.deeper>.separator::after{content:"▾";font-size:.68em;line-height:1;opacity:.75}.mainnav ul ul{display:none;position:absolute;top:calc(100% + .45rem);left:0;z-index:50;min-width:240px;align-items:stretch;gap:.15rem;padding:.45rem;margin:0;background:#fff;border:1px solid rgba(11,79,138,.12);border-radius:18px;box-shadow:0 18px 45px rgba(15,23,42,.14)}.mainnav ul ul::before{content:"";position:absolute;left:0;right:0;top:-.55rem;height:.55rem}.mainnav li:hover>ul,.mainnav li:focus-within>ul{display:flex;flex-direction:column}.mainnav ul ul a,.mainnav ul ul .mod-menu__heading,.mainnav ul ul .nav-header,.mainnav ul ul .separator{border-radius:12px;padding:.62rem .85rem;font-weight:650}.mainnav ul ul ul{top:-.45rem;left:calc(100% + .45rem)}.mainnav ul ul li.parent>a::after,.mainnav ul ul li.deeper>a::after,.mainnav ul ul li.parent>.mod-menu__heading::after,.mainnav ul ul li.deeper>.mod-menu__heading::after,.mainnav ul ul li.parent>.nav-header::after,.mainnav ul ul li.deeper>.nav-header::after,.mainnav ul ul li.parent>.separator::after,.mainnav ul ul li.deeper>.separator::after{content:"›";margin-left:auto}.menu-toggle{display:none;border:0;background:var(--kf-primary);color:#fff;border-radius:999px;padding:.65rem 1rem;font-weight:700}.header-search{justify-self:end}.hero-section{background:radial-gradient(circle at 20% 20%,rgba(242,194,48,.26),transparent 32%),linear-gradient(135deg,rgba(11,79,138,.10),rgba(255,255,255,.86));padding:3.5rem 0}.main-content{position:relative;z-index:6;margin-top:var(--tpl4j-main-offset,0);padding:var(--tpl4j-main-padding-top,2rem) 0 var(--tpl4j-main-padding-bottom,3rem)}.breadcrumbs{margin-bottom:1rem;font-size:.95rem;color:#64748b}.content-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:1.5rem}.sidebar-left+.content,.content:has(+.sidebar-right){min-width:0}@media (min-width:960px){.content-grid:has(.sidebar-left){grid-template-columns:280px minmax(0,1fr)}.content-grid:has(.sidebar-right){grid-template-columns:minmax(0,1fr) 280px}.content-grid:has(.sidebar-left):has(.sidebar-right){grid-template-columns:260px minmax(0,1fr) 260px}}.module-card,.content{background:#fff;border:1px solid rgba(11,79,138,.10);border-radius:24px;padding:var(--tpl4j-content-padding,1.35rem);box-shadow:0 16px 40px rgba(15,23,42,.06)}.main-content.is-plain-content .content{background:transparent;border:0;border-radius:0;box-shadow:none}.main-content.is-fullwidth-content>.container{width:100%;max-width:none;padding-inline:0}.main-content.is-fullwidth-content .content-grid{width:100%}@media (max-width:760px){.main-content{margin-top:calc(var(--tpl4j-main-offset,0px) * .55)}}.module-title{margin:.1rem 0 1rem;font-size:clamp(1.25rem,2vw,1.7rem);color:var(--kf-primary)}:where(.hero-section,.phase2-hero,.main-top,.main-bottom,.sidebar-left,.sidebar-right,.site-footer) h1,:where(.hero-section,.phase2-hero,.main-top,.main-bottom,.sidebar-left,.sidebar-right,.site-footer) h2,:where(.hero-section,.phase2-hero,.main-top,.main-bottom,.sidebar-left,.sidebar-right,.site-footer) h3{line-height:1.18;color:#14213d}:where(.hero-section,.phase2-hero,.main-top,.main-bottom,.sidebar-left,.sidebar-right,.site-footer) h1{font-size:clamp(2rem,4.6vw,4rem);letter-spacing:-.04em}:where(.hero-section,.phase2-hero,.main-top,.main-bottom,.sidebar-left,.sidebar-right,.site-footer) h2{font-size:clamp(1.55rem,3vw,2.4rem);letter-spacing:-.03em}.home-panels{display:grid;gap:1.5rem;margin-top:2rem}@media (min-width:900px){.home-panels{grid-template-columns:1fr 1fr}}.site-footer{background:#10233f;color:#dbeafe;margin-top:2rem}.site-footer a{color:#fff}.footer-grid{display:grid;gap:2rem;padding:2.5rem 0}@media (min-width:760px){.footer-grid{grid-template-columns:repeat(3,1fr)}}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:1rem 0;color:#b6c8df}:where(.topbar,.site-header,.hero-section,.phase2-hero,.main-top,.main-bottom,.sidebar-left,.sidebar-right,.site-footer) :is(.button,.btn,.readmore a,button[type=submit],input[type=submit]){display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border:0;border-radius:999px;background:var(--kf-primary);color:#fff!important;text-decoration:none;padding:.75rem 1.05rem;font-weight:750;box-shadow:0 10px 22px rgba(11,79,138,.18);cursor:pointer}:where(.topbar,.site-header,.hero-section,.phase2-hero,.main-top,.main-bottom,.sidebar-left,.sidebar-right,.site-footer) :is(.button,.btn,.readmore a):hover{background:var(--kf-secondary);color:#fff!important}:where(.topbar,.site-header,.hero-section,.phase2-hero,.main-top,.main-bottom,.sidebar-left,.sidebar-right,.site-footer) :is(.badge,.label){display:inline-flex;align-items:center;border-radius:999px;background:rgba(242,194,48,.25);color:#573b00;padding:.25rem .65rem;font-weight:700;font-size:.85rem}@media (max-width:860px){.header-inner{grid-template-columns:1fr auto;min-height:76px}.menu-toggle{display:inline-flex}.mainnav{display:none;grid-column:1/-1;justify-self:stretch}.mainnav.is-open{display:block}.mainnav ul{display:block}.mainnav li{position:relative}.mainnav a,.mainnav .mod-menu__heading,.mainnav .nav-header,.mainnav .separator{border-radius:14px;padding:.85rem 1rem;white-space:normal}.mainnav ul ul{display:block;position:static;min-width:0;margin:.1rem 0 .45rem 1rem;padding:.25rem 0 .25rem .65rem;background:transparent;border:0;border-left:2px solid rgba(11,79,138,.14);border-radius:0;box-shadow:none}.mainnav ul ul::before{display:none}.mainnav ul ul a,.mainnav ul ul .mod-menu__heading,.mainnav ul ul .nav-header,.mainnav ul ul .separator{padding:.62rem .85rem}.mainnav ul ul ul{position:static;margin-left:.75rem}.mainnav ul ul li.parent>a::after,.mainnav ul ul li.deeper>a::after,.mainnav ul ul li.parent>.mod-menu__heading::after,.mainnav ul ul li.deeper>.mod-menu__heading::after,.mainnav ul ul li.parent>.nav-header::after,.mainnav ul ul li.deeper>.nav-header::after,.mainnav ul ul li.parent>.separator::after,.mainnav ul ul li.deeper>.separator::after{content:"▾";margin-left:0}.header-search{grid-column:1/-1;justify-self:stretch}.brand-text small{display:none}}@media (prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Phase 2: Hero-System */
.phase2-hero{position:relative;overflow:hidden;padding:clamp(3rem,6vw,6rem) 0 5rem;background:radial-gradient(circle at 78% 22%,rgba(242,194,48,.32),transparent 28%),radial-gradient(circle at 10% 18%,rgba(199,54,46,.16),transparent 24%),linear-gradient(135deg,rgba(11,79,138,.12),rgba(255,255,255,.9));background-size:cover;background-position:center}.phase2-hero.has-bg-image{color:#fff}.phase2-hero.has-bg-image h1,.phase2-hero.has-bg-image .hero-text{color:#fff}.hero-layout{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(280px,.86fr);gap:clamp(2rem,5vw,5rem);align-items:center}.hero-copy{position:relative;z-index:2;max-width:720px}.hero-kicker{display:inline-flex;align-items:center;gap:.5rem;margin:0 0 1rem;padding:.42rem .82rem;border-radius:999px;background:rgba(242,194,48,.22);color:var(--kf-primary);font-weight:800}.phase2-hero.has-bg-image .hero-kicker{background:rgba(255,255,255,.18);color:#fff;backdrop-filter:blur(8px)}.hero-copy h1{margin:.2rem 0 1rem;font-size:clamp(2.4rem,5.2vw,5.1rem);letter-spacing:-.055em;max-width:820px}.hero-text{margin:0;font-size:clamp(1.06rem,1.45vw,1.28rem);line-height:1.72;color:#334155}.hero-actions{margin:1.6rem 0 0}.hero-button{font-size:1.02rem;padding:.85rem 1.25rem}.hero-visual{position:relative;z-index:1;display:flex;justify-content:flex-end;align-items:center;min-height:280px}.hero-visual.is-top{align-items:flex-start}.hero-visual.is-bottom{align-items:flex-end}.hero-visual img{width:var(--kf-hero-img-width);min-width:270px;max-width:620px;aspect-ratio:4/3;object-fit:cover;border-radius:var(--kf-hero-img-radius);opacity:var(--kf-hero-img-opacity);box-shadow:0 28px 70px rgba(15,23,42,.24);border:7px solid rgba(255,255,255,.72);transform:rotate(1.5deg)}.hero-visual::before{content:"";position:absolute;right:8%;top:8%;width:min(52%,340px);aspect-ratio:1;border-radius:999px;background:linear-gradient(135deg,var(--kf-accent),var(--kf-secondary));opacity:.22;filter:blur(4px)}.hero-wave{position:absolute;left:0;right:0;bottom:-1px;height:90px;line-height:0}.hero-wave svg{width:100%;height:100%;display:block}.hero-wave path{fill:var(--kf-bg)}.hero-modules{margin-top:2rem}.phase2-hero.has-bg-image .module-card{background:rgba(255,255,255,.9)}@media (max-width:900px){.hero-layout{grid-template-columns:1fr}.hero-visual{justify-content:flex-start;min-height:0}.hero-visual img{width:min(100%,520px);min-width:0;transform:none}.phase2-hero{padding-bottom:4rem}}@media (max-width:560px){.phase2-hero{padding-top:2.4rem}.hero-copy h1{font-size:clamp(2rem,12vw,3.2rem)}.hero-kicker{font-size:.92rem}.hero-wave{height:54px}}


/* TPL4J 0.3.7: Eine Menü-Überschrift bleibt bei aktivem Untermenü optisch neutral. */
.mainnav li.active>.mod-menu__heading:not(:hover),
.mainnav li.active>.nav-header:not(:hover),
.mainnav li.active>.separator:not(:hover){
  background:transparent;
  color:var(--kf-text);
}

/* TPL4J 0.3.8: Menü-Überschriften behalten auch als aktiver Elternpunkt exakt die Typografie der Hauptnavigation. */
.mainnav > ul > li > .mod-menu__heading,
.mainnav > ul > li > .nav-header,
.mainnav > ul > li > .separator,
.mainnav > ul > li.active > .mod-menu__heading,
.mainnav > ul > li.active > .nav-header,
.mainnav > ul > li.active > .separator,
.mainnav > ul > li.current > .mod-menu__heading,
.mainnav > ul > li.current > .nav-header,
.mainnav > ul > li.current > .separator {
  font-family: inherit;
  font-size: inherit;
  font-style: normal;
  line-height: inherit;
  letter-spacing: normal;
  text-transform: none;
}

/* TPL4J 0.3.9: Joomla-Systemlink „Menü-Überschrift“ mit beiden Klassen
   exakt wie einen normalen Hauptmenü-Link darstellen. Der zusammengesetzte
   Selektor überschreibt auch Joomla-/Bootstrap-Regeln für .nav-header. */
.mainnav .mod-menu__heading.nav-header,
.mainnav li.active > .mod-menu__heading.nav-header,
.mainnav li.current > .mod-menu__heading.nav-header {
  display: flex !important;
  align-items: center;
  gap: .35rem;
  padding: .65rem .8rem;
  border-radius: 999px;
  margin: 0;
  color: var(--kf-text);
  background: transparent;
  font-family: var(--kf-font) !important;
  font-size: 1rem !important;
  font-style: normal !important;
  font-weight: 650 !important;
  line-height: 1.62 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  white-space: nowrap;
}

.mainnav .mod-menu__heading.nav-header:hover,
.mainnav li.active > .mod-menu__heading.nav-header:hover,
.mainnav li.current > .mod-menu__heading.nav-header:hover {
  background: rgba(11,79,138,.09);
  color: var(--kf-primary);
}

@media (max-width:860px) {
  .mainnav .mod-menu__heading.nav-header,
  .mainnav li.active > .mod-menu__heading.nav-header,
  .mainnav li.current > .mod-menu__heading.nav-header {
    padding: .85rem 1rem;
    border-radius: 14px;
    white-space: normal;
  }
}

/* TPL4J 0.3.10: Aktive Menü-Überschrift wie einen aktiven Hauptmenü-Link hervorheben. */
.mainnav li.active > .mod-menu__heading.nav-header,
.mainnav li.current > .mod-menu__heading.nav-header {
  background: rgba(11,79,138,.09) !important;
  color: var(--kf-primary) !important;
}


/* TPL4J 0.3.14: Dropdown-Oberpunkt hervorheben, sobald ein Unterpunkt aktiv ist. */
.mainnav li.tpl4j-active-parent > .mod-menu__heading.nav-header,
.mainnav li.tpl4j-active-parent > .mod-menu__heading,
.mainnav li.tpl4j-active-parent > .nav-header,
.mainnav li.tpl4j-active-parent > .separator,
.mainnav li.tpl4j-active-parent > a {
  background: rgba(11,79,138,.09) !important;
  color: var(--kf-primary) !important;
}

/* TPL4J 0.3.15: Menü-Überschrift aktiv, sobald ein aktiver Unterpunkt enthalten ist. */
.mainnav li:has(> ul li.current) > .mod-menu__heading.nav-header,
.mainnav li:has(> ul li.active) > .mod-menu__heading.nav-header,
.mainnav li:has(> ul [aria-current="page"]) > .mod-menu__heading.nav-header,
.mainnav li:has(> ul [aria-current="true"]) > .mod-menu__heading.nav-header,
.mainnav li.tpl4j-active-parent > .mod-menu__heading.nav-header {
  background: rgba(11,79,138,.09) !important;
  color: var(--kf-primary) !important;
}




/* TPL4J 0.3.18: Komponenten und Module im Inhaltsbereich bestimmen ihre Linkgestaltung selbst.
   Template-Linkfarben bleiben ausschließlich auf klar templateeigene Bereiche begrenzt. */
:where(a,button,input,select,textarea,[tabindex]):focus-visible {
  outline: 3px solid var(--kf-accent);
  outline-offset: 3px;
}

/* Keine pauschale Linkgestaltung innerhalb des Komponenten- oder Modulbereichs.
   Diese Selektoren setzen bewusst weder Farbe noch Unterstreichung. */
.content,
.main-top,
.main-bottom,
.sidebar-left,
.sidebar-right {
  --tpl4j-component-links-unmodified: 1;
}

/* TPL4J 0.3.18: Links im Inhaltsbereich und Footer ohne pauschale Unterstreichung. */
.content a,
.site-footer a {
  text-decoration: none;
}


/* TPL4J 0.3.19: Modulüberschriften im Footer anzeigen. */
.footer-module{min-width:0}
.footer-module+.footer-module{margin-top:1.5rem}
.site-footer .footer-module-title{margin:0 0 .85rem;color:#fff;font-size:clamp(1.1rem,1.6vw,1.35rem);line-height:1.25;letter-spacing:-.01em}
.footer-bottom .footer-module-title{font-size:1rem;margin-bottom:.55rem}


/* Joomla HTML5 module chrome in footer */
.site-footer .moduletable,
.site-footer .moduletable[class*=" moduletable"],
.site-footer .moduletable[class^="moduletable"] {
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}
.site-footer .moduletable > h1,
.site-footer .moduletable > h2,
.site-footer .moduletable > h3,
.site-footer .moduletable > h4,
.site-footer .moduletable > h5,
.site-footer .moduletable > h6 {
  margin: 0 0 .85rem;
  color: #fff;
  font-size: clamp(1.1rem, 1.6vw, 1.35rem);
  line-height: 1.25;
  letter-spacing: -.01em;
}
.footer-bottom .moduletable > h1,
.footer-bottom .moduletable > h2,
.footer-bottom .moduletable > h3,
.footer-bottom .moduletable > h4,
.footer-bottom .moduletable > h5,
.footer-bottom .moduletable > h6 {
  margin-bottom: .55rem;
  font-size: 1rem;
}
