.elementor-location-header {
  position:sticky; top:0; z-index:100;
}
.elementor-location-header .kb-header {
  transition: padding-top .25s ease, padding-bottom .25s ease;
}
.is-scrolled .elementor-location-header .kb-header {
  padding-block-start:10px;
  padding-block-end:10px;
}

@media (min-width:768px){
.is-scrolled .elementor-location-header .kb-header {
  padding-block-start:12px;
  padding-block-end:6px;
}
}

@media (min-width:1141px){
.is-scrolled .elementor-location-header .kb-header {
  padding-block-start:16px;
  padding-block-end:12px;
}
}
@media (prefers-reduced-motion:reduce) {
  .elementor-location-header .kb-header { transition:none; }
}

.kb-overlay {
	position:fixed !important; inset:0 !important;
  width:100% !important; height:100vh !important; height:100dvh !important;
  margin:0 !important; z-index:200 !important;
  display:flex !important; flex-direction:column;
  position:fixed; inset:0; z-index:200; overflow-y:auto;
  height:100vh; height:100dvh; box-sizing:border-box;
  visibility:hidden; opacity:0; transform:translateY(-12px);
  transition: opacity .25s ease, transform .3s cubic-bezier(.2,.7,.2,1), visibility 0s linear .3s;
}
.kb-overlay[data-open="true"] {
  visibility:visible; opacity:1; transform:none;
  transition: opacity .25s ease, transform .3s cubic-bezier(.2,.7,.2,1), visibility 0s;
}

/* Menüpunkte leicht versetzt einblenden */
.kb-overlay .kb-nav__list li { opacity:0; transform:translateY(8px);
  transition: opacity .3s ease, transform .3s ease; }
.kb-overlay[data-open="true"] .kb-nav__list li { opacity:1; transform:none; }
.kb-overlay[data-open="true"] .kb-nav__list li:nth-child(2) { transition-delay:50ms; }
.kb-overlay[data-open="true"] .kb-nav__list li:nth-child(3) { transition-delay:100ms; }
.kb-overlay[data-open="true"] .kb-nav__list li:nth-child(4) { transition-delay:150ms; }
.kb-overlay[data-open="true"] .kb-nav__list li:nth-child(5) { transition-delay:200ms; }
.kb-overlay[data-open="true"] .kb-nav__list li:nth-child(6) { transition-delay:250ms; }

body.kb-lock { overflow:hidden; }

@media (min-width:1141px) { .kb-toggle, .kb-overlay { display:none !important; } }

@media (prefers-reduced-motion:reduce) {
  .kb-overlay, .kb-overlay .kb-nav__list li { transition:none; transform:none; }
}
.elementor-edit-area .kb-overlay {
  position:relative !important; inset:auto !important; height:auto !important;
  visibility:visible; opacity:1; transform:none;
}
.elementor-edit-area .kb-overlay .kb-nav__list li { opacity:1; transform:none; }

.kb-button,
.kb-link {
	transition-duration: 0.3s;
}

/* Atomic Button – Icon rechts */
[data-kb-button-icon] {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
}

[data-kb-button-icon]::after {
  content: "";
  flex: none;
width: var(--kb-icon-size, 1em);
  height: var(--kb-icon-size, 1em);
  background-color: var(--kb-icon-color, currentColor);
  -webkit-mask: var(--kb-icon) center / contain no-repeat;
          mask: var(--kb-icon) center / contain no-repeat;
  transition: transform 0.2s ease;
}



@media (prefers-reduced-motion: reduce) {
  [data-kb-button-icon]::after { transition: none; }
}

/* Icon-Varianten */

[data-kb-button-icon="external"] {
  --kb-icon-size: 34px;
  --kb-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 34'%3E%3Crect width='34' height='34' rx='17' fill-opacity='.14'/%3E%3Cpath d='M13.5497 21.4446L12.7741 20.669L18.5412 14.892H14.0866L14.0966 13.8182H20.3906V20.1222H19.3068L19.3168 15.6676L13.5497 21.4446Z'/%3E%3C/svg%3E");
}
/* Showcase-Seite: Template-Label vor jeder Sektion (nur interne Übersicht) */
[data-kb-showcase-label] {
  background: #ffe14d;
  color: #111;
  font: 600 14px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
  padding: 10px 16px;
  border-top: 2px solid #111;
}
[data-kb-showcase-label] p { margin: 0; font: inherit; color: inherit; }

/* Platzhalter für noch nicht designte Blöcke (wird ersetzt, sobald Design da ist) */
[data-kb-placeholder] {
  border: 2px dashed currentColor;
  border-radius: 16px;
  padding: 32px;
  opacity: .75;
}
[data-kb-placeholder] p { margin: 0; }

/* ---------- Barrierefreiheit (WCAG 2.2) ---------- */

/* Sichtbarer Tastaturfokus überall (2.4.7 / 1.4.11): zweifarbig – innen weißer Ring,
   außen blauer Rahmen –, damit er auf hellen und dunklen Flächen (Hero, Footer) sichtbar ist. */
:focus-visible {
  outline: 3px solid var(--e-global-color-primary, #0c436b) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 2px #fff !important;
}

/* Fokussierter Inhalt darf nicht unter dem fixierten Header verschwinden (2.4.11),
   gilt auch für Sprungmarken/Anker. Header eingeklappt = 80px. */
html {
  scroll-padding-top: 100px;
}

/* Pill auf mittelblauer Sektion (kb-section--bg-blue, #7490A6): weißer 15%-Hintergrund ergab nur 2,7:1.
   Dunkelblau 45 % → ca. 5,6:1 (WCAG 1.4.3). Auf dunkelblauen Sektionen bleibt die Pill unverändert. */
.kb-section--bg-blue .kb-pill.kb-pill--on-dark {
  background-color: rgba(12, 67, 107, .45);
}

/* Footer: Telefon/Mail stehen direkt untereinander → jede Zeile mind. 24px hoch (WCAG 2.5.8).
   Zeilenhöhe 23px → 24px, die Liste wird dadurch nur je 1px höher. */
.elementor-location-footer .kb-link a {
  display: inline-block;
  min-height: 24px;
  line-height: 24px;
}

/* Links im Fließtext von Seiten ohne Elementor-Layout (.kb-prose, siehe functions.php):
   Hello-Standard (#cc3366) hat zu wenig Kontrast (4,47:1) und ist nicht unterstrichen
   → Primärfarbe + Unterstreichung (1.4.3 / 1.4.1). Buttons ausgenommen. */
.kb-prose a:not(.wp-block-button__link, .wp-element-button) {
  color: var(--e-global-color-primary, #1e3954);
  text-decoration: underline;
  text-underline-offset: .15em;
}
.kb-prose a:not(.wp-block-button__link, .wp-element-button):hover {
  text-decoration-thickness: 2px;
}

/* Seiten ohne Elementor-Layout (Rechtstexte): lesbare Spaltenbreite statt volle Seitenbreite,
   Abstand zum Rand wie bei den Sektionen (Gutter 85px Desktop / 16px Tablet+Mobil). */
.kb-prose {
  box-sizing: content-box;
  max-width: 840px;
  margin-inline: auto;
  padding: 80px var(--kb-container-gutter, 85px) 96px;
}
@media (max-width: 1140px) {
  .kb-prose { padding: 56px var(--kb-container-gutter-tablet, 16px) 72px; }
}
@media (max-width: 767px) {
  .kb-prose { padding: 40px var(--kb-container-gutter-mobile, 16px) 56px; }
}

/* Überschriften der Rechtstexte im Stil der Seite (kb-h2 / Hero-Headline: 800, Textfarbe, enge Laufweite),
   aber kleiner, da Fließtext. H1 = Werte der Hero-Headline (44/52 Desktop+Tablet, 32/37 Mobil). */
.kb-prose .kb-page-title {
  margin: 0 0 40px;
  font-size: 44px;
  line-height: 52px;
  font-weight: 800;
  letter-spacing: -1.7px;
  color: var(--color-text, #14191e);
}
.kb-prose h2 {
  margin: 48px 0 16px;
  font-size: 28px;
  line-height: 34px;
  font-weight: 800;
  letter-spacing: -.5px;
  color: var(--color-text, #14191e);
}
.kb-prose h3 {
  margin: 32px 0 12px;
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  color: var(--color-text, #14191e);
}
@media (max-width: 767px) {
  .kb-prose .kb-page-title { margin-bottom: 32px; font-size: 32px; line-height: 37px; letter-spacing: -.8px; }
  .kb-prose h2 { margin-top: 40px; font-size: 24px; line-height: 30px; letter-spacing: -.4px; }
  .kb-prose h3 { font-size: 18px; line-height: 26px; }
}

/* Nur für Screenreader (z. B. Hinweis „öffnet in neuem Tab“) */
.kb-sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%);
  white-space: nowrap; border: 0;
}