@import "../gestaltung/marke.css";
/* Ausschließlich die gemeinsame Schwerpunkt-Navigation, keine Partnerprofile. */
.khit-mega { position: relative; z-index: 50; background: #fff; color: #384150; border-bottom: 1px solid #dcdcdc; font-family: var(--font-body, 'IBM Plex Sans', sans-serif); }
.khit-mega * { box-sizing: border-box; }
.khit-mega-inner { width: 100%; max-width: var(--layout-max, 100rem); padding-inline: var(--layout-gutter, 2rem); box-sizing: border-box; margin-inline: auto; min-height: 6rem; display: flex; align-items: center; gap: 1rem 2rem; }
.khit-mega a { color: #384150; text-decoration: none; }
.khit-mega :is(a,summary,button):focus-visible { outline: 2px solid #384150; outline-offset: 4px; }
.khit-mega-brand { display: block; flex: 0 0 auto; margin-right: auto; }
.khit-mega-nav { display: flex; align-items: center; gap: clamp(1rem,2vw,2rem); }
.khit-mega-nav > a, .khit-mega summary { font-size: .9375rem; line-height: 1.35; min-height: 2.75rem; display: flex; align-items: center; gap: .65rem; padding-block: .65rem; font-weight: 500; }
.khit-mega-nav > a[aria-current], .khit-mega summary.khit-mega-current { color: #c50510; }
.khit-mega summary { cursor: pointer; list-style: none; transition: color .18s ease; }
.khit-mega summary::-webkit-details-marker { display: none; }
.khit-mega-chevron { display: block; flex: 0 0 1rem; transition: transform .24s cubic-bezier(.22,1,.36,1); }
.khit-mega summary:hover, .khit-mega details[open] > summary { color: #c50510; }
.khit-mega details[open]:not(.khit-mega-closing) > summary .khit-mega-chevron { transform: rotate(180deg); }
.khit-mega-animating .khit-mega-panel { overflow: hidden; }
.khit-mega-panel { position: absolute; top: 100%; left: 0; right: 0; padding: 2rem max(var(--layout-gutter,2rem), calc((100% - var(--layout-max, 100rem))/2 + var(--layout-gutter, 2rem))); display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; background: #fff; border-bottom: 1px solid #dcdcdc; box-shadow: 0 18px 28px #11151b15; max-height: calc(100dvh - 7rem); overflow-y: auto; }
.khit-mega-panel p, .khit-mega-panel h2 { margin: 0; }
.khit-mega .khit-mega-feature { padding: 2rem; background: #384150; color: #fff; }
.khit-mega .khit-mega-feature :is(h2,p,a,span) { color: #fff !important; }
.khit-mega .khit-mega-feature h2 { font-size: clamp(1.4rem,2vw,2rem); font-weight: 500; line-height: 1.2; margin: 1rem 0; letter-spacing: -.025em; }
.khit-mega-feature p { line-height: 1.6; font-size: .9375rem; }
.khit-mega-feature a { display: inline-flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 3.25rem; max-width: 100%; margin-top: 1.5rem; padding: .9rem 1.25rem; border: 1px solid #e30613; background: #e30613; font-size: .9375rem; font-weight: 500; text-decoration: none; }
.khit-mega .khit-mega-feature a:is(:hover,:focus-visible,:active) { background: #b8050f; border-color: #b8050f; color: #fff; }
.khit-mega-feature a > span { flex-shrink: 0; }
.khit-mega .khit-mega-feature a:focus-visible { outline-color: #fff; }
.khit-mega .khit-mega-label { font: .75rem/1.4 var(--font-mono,monospace); text-transform: uppercase; letter-spacing: .05em; }
.khit-mega-group { padding-block: .5rem; }
.khit-mega .khit-mega-group h2 { font-size: .75rem; font-weight: 500; color: #384150; letter-spacing: .05em; text-transform: uppercase; margin-bottom: 1rem; font-family: var(--font-mono,monospace); }
.khit-mega-group a { display: block; padding: 1rem 0; border-top: 1px solid #dcdcdc; }
.khit-mega-group a strong { display: block; color: #11151b; font-size: 1rem; font-weight: 500; }
.khit-mega-group a span { display: block; font-size: .875rem; line-height: 1.5; margin-top: .35rem; }
.khit-mega-group a:hover strong { color: #c50510; }
/* Buchungsstand bei pausiertem Bestellweg: ruhige Monozeile, bewusst kein Förderhinweis. */
.khit-mega-group a .khit-mega-status { margin-top: .5rem; color: #384150; font: .75rem/1.4 var(--font-mono,monospace); letter-spacing: .02em; }
.khit-mega .khit-mega-cta { background: #e30613; color: #fff; padding: .85rem 1rem; white-space: nowrap; }
.khit-mega .khit-mega-cta:is(:hover,:focus-visible,:active) { background: #b8050f; color: #fff; }
.khit-mega-toggle { display: none; }
@media (max-width: 74.99rem) {
  .khit-mega-inner { flex-wrap: wrap; gap: 0; padding-block: 1rem; }
  .khit-mega-brand { flex-basis: auto; }
  .khit-mega-ready .khit-mega-toggle { display: flex; gap: 1rem; align-items: center; padding: .65rem 1rem; border: 1px solid #dcdcdc; min-height: 2.75rem; background: #fff; color: #384150; font: 500 .9375rem var(--font-body); cursor: pointer; }
  .khit-mega-nav { flex-basis: 100%; display: grid; gap: .25rem; margin-top: 1rem; max-height: calc(100dvh - 7rem); overflow-y: auto; }
  .khit-mega-ready:not(.khit-mega-expanded) .khit-mega-nav { display: none; }
  .khit-mega-nav > a, .khit-mega summary { padding: .8rem 0; min-height: 3rem; }
  .khit-mega summary { justify-content: space-between; }
  .khit-mega-panel { position: static; display: grid; grid-template-columns: minmax(0,1fr); padding: 1rem 0; gap: 1.5rem; box-shadow: none; border: 0; max-height: none; overflow: visible; }
  .khit-mega-feature { grid-column: 1 / -1; }
  .khit-mega .khit-mega-feature { padding: 1.25rem; }
  .khit-mega-feature a { margin-top: .75rem; }
  .khit-mega .khit-mega-cta { justify-content: space-between; margin: .5rem 0; }
}
@media (max-width: 35rem) { .khit-mega-panel { grid-template-columns: minmax(0,1fr); } }
.khit-nav-shell { position: sticky; top: 0; z-index: 50; }
.khit-mega-toggle[aria-expanded='true'] > span { transform: rotate(45deg); }
@media (prefers-reduced-motion: reduce) { .khit-mega summary, .khit-mega-chevron { transition: none; } }

/* Die Leiste bleibt wie die Navigation auch im Dunkelmodus hell. Ohne eigene
   Schriftfarbe erbte sie die helle Schrift des Dunkelmodus, und „Partnerportal“
   stand weiß auf weiß (#317). Die hellen Gestaltungswerte gelten nur hier, damit
   auch das Kontomenü darin hell und lesbar bleibt. */
.khit-account-bar { position: relative; z-index: 45; border-bottom: 1px solid #dcdcdc; background: #fff; color: #11151b; --grund: #fff; --grund-alt: #f5f5f7; --text: #11151b; --text-2: #384150; --text-3: #535e6d; --linie: #dcdcdc; --linie-2: #e7e9ec; }
.khit-account-bar > div { width: 100%; max-width: var(--layout-max, 100rem); padding-inline: var(--layout-gutter, 2rem); box-sizing: border-box; min-height: 3rem; margin-inline: auto; display: flex; justify-content: flex-end; align-items: center; }
.khit-context-nav { width: 100%; max-width: var(--layout-max, 100rem); padding-inline: var(--layout-gutter, 2rem); box-sizing: border-box; margin-inline: auto; padding-block: 1rem; display: flex; gap: 1rem 2rem; flex-wrap: wrap; font-size: .875rem; color: #384150; }
.khit-context-nav a { min-height: 2.75rem; display: inline-flex; align-items: center; text-decoration: underline; text-underline-offset: .25em; }

html:has(.khit-nav-shell) { scroll-padding-top: 7rem; }
.skip-link:focus { z-index: 100; }