/* Core-Layer f Builder-Template-Assets (global, template-unabhaengig) */
html,
html body,
body,
.sticky-footer-wrapper {
  background-color: var(--nx-page-bg, initial) !important;
  color: var(--nx-page-text, inherit) !important;
}

body.builder-active,
body.builder-active body,
body.builder-active .sticky-footer-wrapper {
  background-color: var(--nx-builder-shell-bg, initial) !important;
}

body.builder-active main.flex-fill {
  background-color: var(--nx-builder-main-bg, transparent) !important;
}

html body a {
  color: var(--nx-color-link, var(--bs-link-color, inherit));
  text-decoration: var(--bs-link-decoration, none) !important;
}

html body a:hover,
html body a:focus {
  color: var(--nx-color-link-hover, var(--bs-link-hover-color, var(--nx-color-primary, var(--bs-primary))));
  text-decoration: var(--bs-link-hover-decoration, var(--bs-link-decoration, none)) !important;
}

html body .nav-link,
html body .dropdown-item {
  color: var(--nx-color-link, var(--bs-link-color, inherit));
}

html body .nav-link:hover,
html body .nav-link:focus,
html body .dropdown-item:hover,
html body .dropdown-item:focus {
  color: var(--nx-color-link-hover, var(--bs-link-hover-color, var(--nx-color-primary, var(--bs-primary))));
}

main,
.nx-live-zone,
.nx-live-content {
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529));
}

/*
 * Kompatibilitaetsbruecke fuer bestehende Plugin-CSS.
 * Neue Plugins sollen direkt --nx-color-* und --nx-component-* verwenden.
 */
:root {
  --nx-theme-surface-2: var(--nx-component-card-bg, var(--nx-color-card-bg, var(--bs-card-bg, var(--bs-body-bg, #fff))));
  --nx-theme-text: var(--nx-color-on-surface, var(--bs-body-color, #212529));
  --nx-theme-muted: var(--nx-color-muted, var(--bs-secondary-color, #6c757d));
  --nx-theme-card-border: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color)));
  --nx-theme-accent: var(--nx-color-primary, var(--bs-primary));
  --nx-theme-card-shadow: var(--nx-component-shadow, var(--nx-shadow-card, none));
  --nx-theme-radius-sm: var(--nx-component-radius, var(--bs-border-radius-sm, .25rem));
  --nx-theme-radius-md: var(--nx-component-radius, var(--bs-border-radius, .375rem));
  --nx-theme-radius-lg: var(--nx-component-radius, var(--bs-border-radius-lg, .5rem));
}

/*
 * Text elements inherit from their nearest section/card.
 * The palette defines the page default on main, but must not force one
 * foreground color onto mixed light/dark template sections.
 */

main :is(.text-muted, .nx-tk-text-muted),
.nx-live-zone :is(.text-muted, .nx-tk-text-muted),
.nx-live-content :is(.text-muted, .nx-tk-text-muted) {
  color: var(--nx-color-muted, var(--bs-secondary-color, #6c757d)) !important;
}

/* =========================================================
   Zentrale Template-Komponenten-Schicht
   Plugins verwenden Bootstrap-/Standardklassen; das aktive
   Template liefert ausschließlich --nx-component-*-Tokens.
   ========================================================= */
body.nx-frontend-subpage:not(.builder-active) main.flex-fill {
  --bs-card-bg: var(--nx-component-card-bg, var(--nx-color-card-bg, var(--bs-body-bg, #fff)));
  --bs-card-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-card-border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color)));
  --bs-border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color)));
  --bs-table-bg: var(--nx-component-table-bg, var(--nx-component-card-body-bg, var(--bs-card-bg)));
  --bs-table-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-table-border-color: var(--nx-component-border, var(--bs-border-color));
  --bs-list-group-bg: var(--nx-component-list-bg, var(--nx-component-card-body-bg, var(--bs-card-bg)));
  --bs-list-group-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-list-group-border-color: var(--nx-component-border, var(--bs-border-color));
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .card {
  border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color))) !important;
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529));
  overflow: hidden;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .card:not([class*="bg-"]) {
  background: var(--nx-component-card-bg, var(--nx-color-card-bg, var(--bs-card-bg))) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .card:not([class*="rounded"]) {
  border-radius: var(--nx-component-radius, var(--nx-radius-lg, .5rem)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .card:not([class*="shadow"]) {
  box-shadow: var(--nx-component-shadow, var(--nx-shadow-card, none)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .card:not([class*="shadow"]):hover {
  box-shadow: var(--nx-component-shadow-hover, var(--nx-component-shadow, var(--nx-shadow-card, none))) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .card > .card-header:not(.nx-page-head) {
  background: var(--nx-component-card-header-bg, color-mix(in srgb, var(--nx-color-card-bg, var(--bs-card-bg, #fff)) 92%, var(--nx-color-on-surface, #212529) 8%)) !important;
  border-bottom-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color))) !important;
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529));
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .card > :is(.card-body, .card-footer):not([class~="bg-primary"]):not([class~="bg-secondary"]):not([class~="bg-success"]):not([class~="bg-danger"]):not([class~="bg-warning"]):not([class~="bg-info"]):not([class~="bg-light"]):not([class~="bg-dark"]):not([class~="bg-white"]):not([class~="bg-black"]):not([class~="bg-transparent"]):not([class~="bg-body"]):not([class~="bg-body-secondary"]):not([class~="bg-body-tertiary"]) {
  background: var(--nx-component-card-body-bg, var(--nx-component-card-bg, var(--nx-color-card-bg))) !important;
  border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color))) !important;
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529));
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill :is(.form-control, .form-select) {
  background-color: var(--nx-component-control-bg, color-mix(in srgb, var(--nx-color-card-body-bg, var(--nx-color-card-bg, var(--bs-body-bg))) 97%, var(--nx-color-on-surface, #212529) 3%)) !important;
  border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color))) !important;
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill :is(.form-control, .form-select):focus {
  background-color: var(--nx-component-control-bg, color-mix(in srgb, var(--nx-color-card-body-bg, var(--nx-color-card-bg, var(--bs-body-bg))) 97%, var(--nx-color-on-surface, #212529) 3%)) !important;
  border-color: var(--nx-color-primary, var(--bs-primary)) !important;
  box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--nx-color-primary, var(--bs-primary)) 18%, transparent) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .input-group-text {
  background: var(--nx-component-control-addon-bg, color-mix(in srgb, var(--nx-color-card-bg, var(--bs-card-bg, #fff)) 88%, var(--nx-color-on-surface, #212529) 12%)) !important;
  border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color))) !important;
  color: var(--nx-color-muted, var(--bs-secondary-color, #6c757d)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill :is(.list-group, .table-responsive, .accordion) {
  border-radius: var(--nx-component-radius, var(--nx-radius-lg, .5rem));
  box-shadow: var(--nx-component-shadow, var(--nx-shadow-card, none));
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .list-group {
  overflow: hidden;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .list-group-item {
  background: var(--nx-component-list-bg, var(--nx-component-card-body-bg, var(--bs-card-bg))) !important;
  border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color))) !important;
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529));
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .table:not(.table-primary):not(.table-secondary):not(.table-success):not(.table-danger):not(.table-warning):not(.table-info):not(.table-light):not(.table-dark) {
  --bs-table-bg: var(--nx-component-table-bg, var(--nx-component-card-body-bg, var(--bs-card-bg)));
  --bs-table-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-table-border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color)));
  color: var(--bs-table-color);
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill :is(.modal-content, .offcanvas, .dropdown-menu) {
  background: var(--nx-component-card-bg, var(--nx-color-card-bg, var(--bs-body-bg))) !important;
  border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color))) !important;
  border-radius: var(--nx-component-radius, var(--nx-radius-lg, .5rem));
  box-shadow: var(--nx-component-shadow, var(--nx-shadow-card, none));
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529));
}

/*
 * Kontrastfeste Status-Komponenten fuer Plugins.
 * Helle Paletten duerfen bei Bootstrap-Badges keine helle Schrift auf
 * hellem Hintergrund erzeugen.
 */
body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.badge.bg-primary, .badge.text-bg-primary) {
  background-color: var(--nx-color-primary, var(--bs-primary)) !important;
  color: var(--nx-color-button-text, var(--nx-on-inverse-text, #fff)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.badge.bg-secondary, .badge.text-bg-secondary) {
  background-color: color-mix(
    in srgb,
    var(--nx-color-card-bg, var(--bs-card-bg, var(--bs-body-bg))) 76%,
    var(--nx-color-on-surface, var(--bs-body-color)) 24%
  ) !important;
  border: 1px solid color-mix(
    in srgb,
    var(--nx-color-card-border, var(--bs-border-color)) 72%,
    var(--nx-color-on-surface, var(--bs-body-color)) 28%
  );
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.badge.bg-success, .badge.text-bg-success) {
  background-color: var(--bs-success, #198754) !important;
  color: #fff !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.badge.bg-danger, .badge.text-bg-danger) {
  background-color: var(--bs-danger, #dc3545) !important;
  color: #fff !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.badge.bg-warning, .badge.text-bg-warning) {
  background-color: var(--bs-warning, #ffc107) !important;
  color: #1f2937 !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.badge.bg-info, .badge.text-bg-info) {
  background-color: var(--bs-info, #0dcaf0) !important;
  color: #10212a !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.badge.bg-light, .badge.text-bg-light) {
  background-color: color-mix(
    in srgb,
    var(--nx-color-card-bg, var(--bs-card-bg, var(--bs-body-bg))) 92%,
    var(--nx-color-on-surface, var(--bs-body-color)) 8%
  ) !important;
  border: 1px solid var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color)));
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.text-bg-secondary:not(.badge), .bg-secondary-subtle) {
  background-color: color-mix(
    in srgb,
    var(--nx-color-card-bg, var(--bs-card-bg, var(--bs-body-bg))) 88%,
    var(--nx-color-on-surface, var(--bs-body-color)) 12%
  ) !important;
  border-color: var(--nx-component-border, var(--nx-color-card-border, var(--bs-border-color))) !important;
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill
  :is(.text-bg-primary:not(.badge), .bg-primary-subtle) {
  background-color: color-mix(
    in srgb,
    var(--nx-color-primary, var(--bs-primary)) 16%,
    var(--nx-color-card-bg, var(--bs-card-bg, var(--bs-body-bg))) 84%
  ) !important;
  border-color: color-mix(
    in srgb,
    var(--nx-color-primary, var(--bs-primary)) 38%,
    var(--nx-color-card-border, var(--bs-border-color)) 62%
  ) !important;
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529)) !important;
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .progress {
  --bs-progress-bg: color-mix(
    in srgb,
    var(--nx-color-card-bg, var(--bs-card-bg, var(--bs-body-bg))) 82%,
    var(--nx-color-on-surface, var(--bs-body-color)) 18%
  );
  background-color: var(--bs-progress-bg) !important;
  border-radius: var(--nx-component-radius, var(--bs-border-radius, .375rem));
}

body.nx-frontend-subpage:not(.builder-active) main.flex-fill .progress-bar {
  background-color: var(--nx-color-primary, var(--bs-primary)) !important;
}

main :is(.btn, a.btn),
.nx-live-zone :is(.btn, a.btn),
.nx-live-content :is(.btn, a.btn),
.nxm-page .nxm-btn {
  transition: color .14s ease, background-color .14s ease, border-color .14s ease;
}

main :is(.btn-primary, a.btn-primary, .nxm-btn--primary),
.nx-live-zone :is(.btn-primary, a.btn-primary, .nxm-btn--primary),
.nx-live-content :is(.btn-primary, a.btn-primary, .nxm-btn--primary),
.nxm-page .nxm-btn--primary {
  color: var(--nx-color-button-text, var(--nx-on-inverse-text, #fff)) !important;
  background-color: var(--nx-color-button-bg, var(--nx-color-primary, var(--bs-primary))) !important;
  border-color: var(--nx-color-button-border, var(--nx-color-button-bg, var(--bs-primary))) !important;
}

main :is(.btn-primary, a.btn-primary, .nxm-btn--primary):hover,
main :is(.btn-primary, a.btn-primary, .nxm-btn--primary):focus,
.nx-live-zone :is(.btn-primary, a.btn-primary, .nxm-btn--primary):hover,
.nx-live-zone :is(.btn-primary, a.btn-primary, .nxm-btn--primary):focus,
.nx-live-content :is(.btn-primary, a.btn-primary, .nxm-btn--primary):hover,
.nx-live-content :is(.btn-primary, a.btn-primary, .nxm-btn--primary):focus,
.nxm-page .nxm-btn--primary:hover,
.nxm-page .nxm-btn--primary:focus {
  color: var(--nx-color-button-hover-text, var(--nx-color-button-text, #fff)) !important;
  background-color: var(--nx-color-button-hover-bg, var(--nx-color-link-hover, var(--bs-primary))) !important;
  border-color: var(--nx-color-button-hover-border, var(--nx-color-button-hover-bg, var(--bs-primary))) !important;
}

main :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost),
.nx-live-zone :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost),
.nx-live-content :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost),
.nxm-page .nxm-btn--ghost {
  color: var(--nx-color-button-outline-text, var(--nx-color-link, var(--bs-primary))) !important;
  border-color: var(--nx-color-button-outline-border, var(--nx-color-button-outline-text, var(--bs-primary))) !important;
  background-color: transparent !important;
}

main .btn[class*="btn-outline-"]:not(.profile-edit-button):not(:hover):not(:focus):not(:active):not(.active),
.nx-live-zone .btn[class*="btn-outline-"]:not(.profile-edit-button):not(:hover):not(:focus):not(:active):not(.active),
.nx-live-content .btn[class*="btn-outline-"]:not(.profile-edit-button):not(:hover):not(:focus):not(:active):not(.active) {
  background-color: transparent !important;
}

main :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost):hover,
main :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost):focus,
.nx-live-zone :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost):hover,
.nx-live-zone :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost):focus,
.nx-live-content :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost):hover,
.nx-live-content :is(.btn-outline-primary:not(.profile-edit-button), a.btn-outline-primary:not(.profile-edit-button), .nxm-btn--ghost):focus,
.nxm-page .nxm-btn--ghost:hover,
.nxm-page .nxm-btn--ghost:focus {
  color: var(--nx-color-button-hover-text, var(--nx-color-button-text, #fff)) !important;
  background-color: var(--nx-color-button-bg, var(--bs-primary)) !important;
  border-color: var(--nx-color-button-border, var(--nx-color-button-bg, var(--bs-primary))) !important;
}

#mainNavbar .navbar-nav .nav-link,
#mainNavbar .navbar-brand {
  color: var(--nx-color-link, var(--bs-link-color, var(--bs-body-color))) !important;
}

#mainNavbar .navbar-brand,
.nx-nav-core-demo .navbar-brand {
  flex-shrink: 0;
}

#mainNavbar .navbar-brand img,
.nx-nav-core-demo .navbar-brand img {
  width: auto !important;
  max-width: none;
  object-fit: contain;
  flex: 0 0 auto;
}

#mainNavbar .navbar-nav .nav-link:hover,
#mainNavbar .navbar-nav .nav-link:focus,
#mainNavbar .nav-item.dropdown.show > .nav-link,
#mainNavbar .nav-item.dropdown:hover > .nav-link {
  color: var(--nx-color-link-hover, var(--bs-link-hover-color, var(--nx-color-primary, var(--bs-primary)))) !important;
}

#mainNavbar .navbar-nav .nav-link.active {
  color: var(--nx-color-link-hover, var(--bs-link-hover-color, var(--nx-color-primary, var(--bs-primary)))) !important;
}

#mainNavbar #themeToggle {
  color: var(--bs-link-color, var(--nx-toggle-fg)) !important;
}

#mainNavbar #themeToggle:hover {
  color: var(--nx-color-link-hover, var(--bs-link-hover-color, var(--nx-color-primary, var(--bs-primary)))) !important;
}

.nx-gallery {
  --nx-gallery-image-height: clamp(160px, 22vw, 280px);
}

.nx-gallery--cols-2 {
  --nx-gallery-image-height: clamp(190px, 28vw, 340px);
}

.nx-gallery--cols-4 {
  --nx-gallery-image-height: clamp(140px, 18vw, 240px);
}

.nx-gallery-figure {
  overflow: hidden;
}

.nx-gallery-img {
  width: 100% !important;
  height: var(--nx-gallery-image-height) !important;
  object-fit: cover;
  object-position: center;
}

.nx-clan-match-showcase {
  background:
    radial-gradient(circle at 15% 0%, color-mix(in srgb, var(--nx-color-primary, #ffc107) 14%, transparent) 0%, transparent 32%),
    linear-gradient(135deg, color-mix(in srgb, var(--nx-color-surface, #0b111c) 78%, #000 22%), color-mix(in srgb, var(--nx-color-secondary, #111827) 52%, #000 48%));
  color: var(--nx-color-on-surface, #f8fafc);
  border-top: 1px solid color-mix(in srgb, var(--nx-color-card-border, rgba(255,255,255,.12)) 75%, transparent);
  border-bottom: 1px solid color-mix(in srgb, var(--nx-color-card-border, rgba(255,255,255,.12)) 75%, transparent);
}

.nx-clan-match-showcase :is(h1, h2, h3, h4, h5, h6, p, span) {
  color: inherit;
}

.nx-clan-match-showcase__league,
.nx-clan-match-showcase__vs,
.nx-clan-match-showcase__score {
  color: var(--nx-color-primary, var(--bs-primary)) !important;
}

.nx-clan-match-showcase__team,
.nx-clan-match-showcase__cell {
  min-height: 4.75rem;
  background: linear-gradient(180deg, color-mix(in srgb, var(--nx-color-card-bg, #1f2937) 88%, #fff 5%), color-mix(in srgb, var(--nx-color-card-bg, #111827) 82%, #000 18%));
  border: 1px solid color-mix(in srgb, var(--nx-color-card-border, rgba(255,255,255,.15)) 80%, transparent);
  border-radius: .45rem;
  box-shadow: 0 14px 35px rgba(0, 0, 0, .18);
}

.nx-clan-match-showcase__team {
  min-height: 6.25rem;
}

.nx-clan-match-showcase__logo {
  max-height: 4.5rem;
  width: auto;
  object-fit: contain;
}

.nx-clan-match-showcase__mini {
  width: 2.3rem;
  min-height: 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nx-clan-match-showcase__mini img {
  max-width: 2.2rem;
  max-height: 1.6rem;
  object-fit: contain;
}

.nx-clan-match-showcase__score {
  min-width: 3rem;
  text-align: center;
}

body.builder-active .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary),
body.builder-active .nx-live-zone .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary),
body.builder-active .nx-live-content .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary),
html body .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary),
html body .nx-live-zone .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary),
html body .nx-live-content .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary) {
  color: var(--nx-color-button-text, var(--nx-on-inverse-text, #fff)) !important;
  background-color: var(--nx-color-button-bg, var(--nx-color-primary, var(--bs-primary))) !important;
  background-image: none !important;
  border-color: var(--nx-color-button-border, var(--nx-color-button-bg, var(--nx-color-primary, var(--bs-primary)))) !important;
}

body.builder-active .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):hover,
body.builder-active .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):focus,
body.builder-active .nx-live-zone .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):hover,
body.builder-active .nx-live-zone .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):focus,
body.builder-active .nx-live-content .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):hover,
body.builder-active .nx-live-content .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):focus,
html body .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):hover,
html body .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):focus,
html body .nx-live-zone .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):hover,
html body .nx-live-zone .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):focus,
html body .nx-live-content .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):hover,
html body .nx-live-content .nx-slider :is(.btn-primary, .nx-clan-slider-cta-primary):focus {
  color: var(--nx-color-button-hover-text, var(--nx-color-button-text, #fff)) !important;
  background-color: var(--nx-color-button-hover-bg, var(--nx-color-link-hover, var(--nx-color-primary, var(--bs-primary)))) !important;
  background-image: none !important;
  border-color: var(--nx-color-button-hover-border, var(--nx-color-button-hover-bg, var(--nx-color-primary, var(--bs-primary)))) !important;
}

.nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary),
.nx-live-zone .nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary),
.nx-live-content .nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary) {
  color: var(--nx-color-button-outline-text, var(--nx-color-link, var(--nx-color-primary, var(--bs-primary)))) !important;
  background-color: color-mix(in srgb, var(--nx-color-card-bg, transparent) 35%, transparent) !important;
  border-color: var(--nx-color-button-outline-border, var(--nx-color-button-outline-text, var(--nx-color-primary, var(--bs-primary)))) !important;
}

.nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary):hover,
.nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary):focus,
.nx-live-zone .nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary):hover,
.nx-live-zone .nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary):focus,
.nx-live-content .nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary):hover,
.nx-live-content .nx-slider :is(.nx-slider-cta-secondary, .nx-clan-slider-cta-secondary):focus {
  color: var(--nx-color-button-hover-text, var(--nx-color-button-text, #fff)) !important;
  background-color: var(--nx-color-button-bg, var(--nx-color-primary, var(--bs-primary))) !important;
  border-color: var(--nx-color-button-border, var(--nx-color-button-bg, var(--nx-color-primary, var(--bs-primary)))) !important;
}

.nx-accordion-theme {
  --bs-accordion-bg: var(--nx-color-card-bg, var(--nx-color-surface, var(--bs-body-bg)));
  --bs-accordion-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color)));
  --bs-accordion-border-color: var(--nx-color-card-border, var(--bs-border-color));
  --bs-accordion-btn-bg: var(--nx-color-card-bg, var(--nx-color-surface, var(--bs-body-bg)));
  --bs-accordion-btn-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color)));
  --bs-accordion-active-bg: color-mix(in srgb, var(--nx-color-primary, var(--bs-primary)) 18%, var(--nx-color-card-bg, var(--nx-color-surface, var(--bs-body-bg))));
  --bs-accordion-active-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color)));
  --bs-accordion-btn-focus-box-shadow: 0 0 0 .15rem color-mix(in srgb, var(--nx-color-primary, var(--bs-primary)) 35%, transparent);
}

.nx-accordion-theme .accordion-item,
.nx-accordion-theme .accordion-button,
.nx-accordion-theme .accordion-body {
  background-color: var(--bs-accordion-bg) !important;
  color: var(--bs-accordion-color) !important;
  border-color: var(--bs-accordion-border-color) !important;
}

.nx-accordion-theme .accordion-button:not(.collapsed) {
  background-color: var(--bs-accordion-active-bg) !important;
  color: var(--bs-accordion-active-color) !important;
}
/*
 * Text auf Komponentenflaechen folgt deren Hintergrund statt der Seitenflaeche.
 * Das verhindert hellen Seitentext auf hellen Cards/Accordions in Dark-Themes.
 */
:is(
  .card,
  .nx-card,
  .nx-widget,
  .nx-accordion-theme .accordion-item,
  .nx-accordion-theme .accordion-button,
  .nx-accordion-theme .accordion-body,
  .list-group-item,
  .table,
  .pricing .box,
  .pricing-main-card,
  .pricing-main-panel,
  .pricing-detail-panel-muted,
  .pricing-todo-card,
  .pricing-todo-panel
) {
  --bs-card-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-table-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-list-group-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
}

:is(.card, .nx-card, .nx-widget, .nx-accordion-theme, .list-group-item, .table,
  .pricing .box, .pricing-main-card, .pricing-main-panel, .pricing-detail-panel-muted,
  .pricing-todo-card, .pricing-todo-panel)
  :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, small, th, td, label):not([class*="text-"]) {
  color: inherit !important;
}

:is(.card, .nx-card, .nx-widget, .nx-accordion-theme, .list-group-item, .table,
  .pricing .box, .pricing-main-card, .pricing-main-panel, .pricing-detail-panel-muted,
  .pricing-todo-card, .pricing-todo-panel)
  :is(.text-muted, .nx-tk-text-muted) {
  color: var(--nx-color-muted-on-card, var(--nx-color-muted, var(--bs-secondary-color, #6c757d))) !important;
}

@media (max-width: 575.98px) {
  .nx-clan-match-showcase__vs {
    font-size: 1.5rem !important;
  }

  .nx-clan-match-showcase__team {
    min-height: 5rem;
  }
}

/* Keep explicit text-white containers consistent with the editor preview. */
body.nx-frontend-subpage:not(.builder-active) main.flex-fill .text-white :where(h1, h2, h3, h4, h5, h6, p, li, dt, dd, blockquote, small):not([class*="text-"]) {
  color: inherit !important;
}

/* NX_THEME_COMPONENT_RULES_EXTERNAL */
:where(.card) {
  --bs-card-bg: var(--nx-color-card-bg, var(--bs-body-bg, #fff));
  --bs-card-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-card-border-color: var(--nx-color-card-border, var(--bs-border-color, rgba(0, 0, 0, 0.12)));
  background-color: var(--bs-card-bg);
  color: var(--bs-card-color);
  border-color: var(--bs-card-border-color);
}
:where(.card-body) {
  background-color: var(--nx-color-card-body-bg, var(--nx-color-card-bg, var(--bs-card-bg, #fff)));
}
.breadcrumb {
  --bs-breadcrumb-divider-color: var(--bs-secondary-color, var(--nx-color-muted, #6c757d));
  --bs-breadcrumb-item-active-color: var(--bs-secondary-color, var(--nx-color-muted, #6c757d));
  background-color: color-mix(in srgb, var(--nx-color-card-bg, var(--bs-card-bg, #fff)) 94%, var(--nx-color-on-surface, var(--bs-body-color, #212529)) 6%) !important;
  border: 1px solid color-mix(in srgb, var(--nx-color-card-border, var(--bs-border-color)) 72%, transparent) !important;
  border-radius: var(--bs-border-radius, .375rem) !important;
  padding: .65rem .85rem !important;
  margin-bottom: 1rem;
}
.breadcrumb-item,
.breadcrumb-item.active,
.breadcrumb-item + .breadcrumb-item::before {
  color: var(--bs-breadcrumb-item-active-color, var(--nx-color-muted, #6c757d)) !important;
}

/* Einheitlicher Frontend-Seitenkopf. Diese Regeln werden nach Modul-CSS geladen;
   die eigentlichen Werte liefert das aktive Template über --nx-page-head-*. */
.nx-page-head-card{overflow:hidden;border-color:var(--nx-page-head-border,var(--nx-color-card-border,var(--nx-component-border,var(--bs-border-color,#dee2e6))))!important;border-radius:var(--nx-page-head-radius,var(--nx-component-radius,var(--bs-border-radius-lg,.5rem)))!important;box-shadow:var(--nx-page-head-shadow,var(--nx-component-shadow,none))!important}
.nx-page-head{position:relative;isolation:isolate;display:grid;align-items:center;min-height:var(--nx-page-head-min-height,11rem)!important;padding:var(--nx-page-head-padding,clamp(1.5rem,4vw,3rem))!important;overflow:hidden;color:var(--nx-page-head-text,var(--nx-color-on-surface,var(--bs-body-color,#212529)))!important;background-color:var(--nx-page-head-background,var(--nx-color-card-bg,var(--bs-card-bg,#fff)))!important;background-image:var(--nx-page-head-pattern,none)!important;background-position:var(--nx-page-head-pattern-position,center)!important;background-size:var(--nx-page-head-pattern-size,cover)!important;border:0!important;border-bottom:var(--nx-page-head-border-width,1px) solid var(--nx-page-head-border,var(--nx-color-card-border,var(--nx-component-border,var(--bs-border-color,#dee2e6))))!important;border-radius:0!important;box-shadow:none!important}
.nx-page-head.card-header:first-child{border-radius:var(--nx-page-head-radius,var(--nx-component-radius,var(--bs-border-radius-lg,.5rem))) var(--nx-page-head-radius,var(--nx-component-radius,var(--bs-border-radius-lg,.5rem))) 0 0!important}
.nx-page-head.profile-editor-heading{display:flex!important}
.nx-page-head::before,.nx-page-head::after{display:none!important;content:none!important}
.nx-page-head__content{position:relative;z-index:1;max-width:var(--nx-page-head-content-width,52rem)}
.nx-page-head .nx-page-head__eyebrow{color:var(--nx-page-head-eyebrow-text,var(--nx-color-button-text,#fff))!important;background:var(--nx-page-head-eyebrow-background,var(--nx-color-primary,var(--bs-primary,#0d6efd)))!important;font-size:var(--nx-page-head-eyebrow-size,.78rem)!important;font-weight:var(--nx-page-head-eyebrow-weight,700)!important}
.nx-page-head .nx-page-head__title,.nx-page-head h1{color:var(--nx-page-head-title-text,var(--nx-page-head-text,currentColor))!important;font-size:var(--nx-page-head-title-size,clamp(2rem,4vw,3.25rem))!important;font-weight:var(--nx-page-head-title-weight,800)!important;letter-spacing:var(--nx-page-head-title-spacing,-.035em)!important;line-height:var(--nx-page-head-title-line-height,1.05)!important}
.nx-page-head .nx-page-head__subtitle,.nx-page-head .nx-page-head__content>p{color:var(--nx-page-head-muted,var(--nx-color-muted,var(--bs-secondary-color,#667085)))!important;font-size:var(--nx-page-head-subtitle-size,1rem)!important;line-height:var(--nx-page-head-subtitle-line-height,1.6)!important}
@media(max-width:575.98px){.nx-page-head{min-height:var(--nx-page-head-min-height-mobile,9rem)!important;padding:var(--nx-page-head-padding-mobile,1.35rem)!important}.nx-page-head .nx-page-head__title,.nx-page-head h1{font-size:var(--nx-page-head-title-size-mobile,2rem)!important}}
.text-muted,
small.text-muted,
.card .text-muted,
.card small.text-muted {
  color: var(--nx-color-muted, var(--bs-secondary-color, #6c757d)) !important;
}
:where(body,
main,
.nx-live-zone,
.nx-live-content,
.card,
.card-body,
.card-header,
.card-footer) {
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529));
}
.nx-logo-marquee .nx-logo-marquee__title {
  color: var(--nx-color-on-surface, var(--bs-heading-color, var(--bs-body-color, #212529))) !important;
}
.nx-logo-marquee .nx-logo-marquee__subtitle {
  color: var(--nx-color-muted, var(--bs-secondary-color, #6c757d)) !important;
}
.nx-logo-marquee .nx-logo-marquee__hit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: calc(var(--nx-logo-marquee-logo-h, 48px) + 18px) !important;
  padding: .55rem .9rem !important;
  border: 1px solid color-mix(in srgb, var(--nx-color-card-border, var(--bs-border-color, rgba(0,0,0,.12))) 78%, transparent) !important;
  border-radius: var(--nx-radius-md, .375rem) !important;
  background: color-mix(in srgb, var(--nx-on-inverse-text, #fff) 94%, var(--nx-color-primary, var(--bs-primary, #0d6efd)) 6%) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.10) !important;
}
.nx-logo-marquee .nx-logo-marquee__img {
  opacity: 1 !important;
  filter: none !important;
}
.pricing h3,
.pricing-main-plan-label,
.pricing-todo-plan-label,
.pricing-main-panel h2,
.pricing-detail-panel-muted h2,
.pricing-todo-panel h2,
.pricing-main-amount,
.pricing-todo-amount {
  color: var(--nx-color-on-surface, var(--bs-body-color, #212529)) !important;
}
.pricing h4,
.pricing h4 sup,
.pricing .price,
.pricing-main-price,
.pricing-todo-price {
  color: var(--bs-primary, var(--nx-color-primary)) !important;
}
.pricing h4 span,
.pricing ul,
.pricing ul .na,
.pricing-detail-note,
.pricing-main-currency,
.pricing-main-unit,
.pricing-todo-currency,
.pricing-todo-unit,
.pricing-main-card .pricing-detail-note,
.pricing-todo-card .pricing-detail-note,
.pricing-todo-copy {
  color: var(--nx-color-muted, var(--bs-secondary-color, #6c757d)) !important;
}
.pricing .box,
.pricing-main-card,
.pricing-main-panel,
.pricing-detail-panel-muted,
.pricing-todo-card,
.pricing-todo-panel {
  background-color: var(--nx-color-card-bg, var(--bs-card-bg, #fff)) !important;
  border-color: var(--nx-color-card-border, var(--bs-card-border-color, var(--bs-border-color))) !important;
}
.pricing h3,
.pricing .btn-wrap,
.pricing-main-panel .pricing-detail-list li,
.pricing-detail-panel-muted .pricing-detail-list li,
.pricing-todo-panel .pricing-detail-list li {
  background-color: color-mix(in srgb, var(--nx-color-card-bg, var(--bs-card-bg, #fff)) 88%, var(--nx-color-on-surface, var(--bs-body-color, #212529)) 12%) !important;
  border-color: color-mix(in srgb, var(--nx-color-card-border, var(--bs-card-border-color, var(--bs-border-color))) 70%, transparent) !important;
}
.pricing .featured h3,
.pricing-detail-card.featured h3 {
  color: var(--nx-on-inverse-text, #fff) !important;
  background-color: var(--bs-primary, var(--nx-color-primary)) !important;
  border-color: var(--bs-primary, var(--nx-color-primary)) !important;
  box-shadow: none !important;
}
:root {
  --nx-color-on-card: var(--nx-component-card-color, var(--nx-theme-card-text, var(--nx-cms-text, var(--nx-color-on-surface, var(--bs-body-color, #212529)))));
  --nx-color-muted-on-card: var(--nx-component-card-muted, var(--nx-theme-card-muted, var(--nx-cms-muted, color-mix(in srgb, var(--nx-color-on-card) 68%, var(--nx-color-card-bg, var(--bs-card-bg, #fff))))));
}

/*
 * Kontrast innerhalb eigener Komponentenflaechen.
 * Seiten-/Hero-/Navigationsfarben bleiben auf --nx-color-on-surface;
 * nur Flaechen auf Basis von --nx-color-card-bg verwenden --nx-color-on-card.
 */
:is(.card:not(.nx-clan-card), .nx-card, .nx-widget, .list-group-item, .table,
  .pricing .box, .pricing-main-card, .pricing-main-panel, .pricing-detail-panel-muted,
  .pricing-todo-card, .pricing-todo-panel, .nx-clan-match-showcase__team,
  .nx-clan-match-showcase__cell) {
  --bs-card-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-table-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-list-group-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529))) !important;
}
.card:not(.nx-clan-card) > :is(.card-header, .card-body, .card-footer),
.nx-accordion-theme:not(.nx-clan-accordion) :is(.accordion-item, .accordion-button, .accordion-body) {
  color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529))) !important;
}
.nx-accordion-theme:not(.nx-clan-accordion) {
  --bs-accordion-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-accordion-btn-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
  --bs-accordion-active-color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529)));
}
:is(.card:not(.nx-clan-card), .nx-card, .nx-widget, .list-group-item,
  .nx-accordion-theme:not(.nx-clan-accordion), .pricing .box, .pricing-main-card,
  .pricing-main-panel, .pricing-detail-panel-muted, .pricing-todo-card, .pricing-todo-panel)
  :is(.text-muted, .nx-tk-text-muted) {
  color: var(--nx-color-muted-on-card, var(--nx-color-muted, var(--bs-secondary-color, #6c757d))) !important;
}
.pricing :is(h2, h3, .pricing-main-plan-label, .pricing-todo-plan-label,
  .pricing-main-amount, .pricing-todo-amount) {
  color: var(--nx-color-on-card, var(--nx-color-on-surface, var(--bs-body-color, #212529))) !important;
}
html body a { color: var(--nx-color-link, var(--bs-link-color, inherit)); text-decoration: var(--bs-link-decoration, none) !important; }
html body a:hover, html body a:focus { color: var(--bs-link-hover-color, var(--bs-primary)); text-decoration: var(--bs-link-hover-decoration, var(--bs-link-decoration, none)) !important; }
main .btn,
main a.btn,
.nx-live-zone .btn,
.nx-live-zone a.btn,
.nx-live-content .btn,
.nx-live-content a.btn,
.nxm-page .nxm-btn {
  transition: color .14s ease, background-color .14s ease, border-color .14s ease;
}
.btn.btn-primary,
a.btn.btn-primary {
  --bs-btn-color: var(--nx-template-button-primary-text, var(--nx-color-button-text, var(--nx-on-inverse-text, #fff)));
  --bs-btn-bg: var(--nx-template-button-primary-bg, var(--nx-color-button-bg, var(--bs-primary)));
  --bs-btn-border-color: var(--nx-template-button-primary-border, var(--nx-color-button-border, var(--nx-color-button-bg, var(--bs-primary))));
  --bs-btn-hover-color: var(--nx-template-button-primary-hover-text, var(--nx-color-button-hover-text, var(--nx-color-button-text, #fff)));
  --bs-btn-hover-bg: var(--nx-template-button-primary-hover-bg, var(--nx-color-button-hover-bg, var(--bs-link-hover-color, var(--bs-primary))));
  --bs-btn-hover-border-color: var(--nx-template-button-primary-hover-border, var(--nx-color-button-hover-border, var(--nx-color-button-hover-bg, var(--bs-link-hover-color, var(--bs-primary)))));
  --bs-btn-active-color: var(--nx-template-button-primary-hover-text, var(--nx-color-button-hover-text, var(--nx-color-button-text, #fff)));
  --bs-btn-active-bg: var(--nx-template-button-primary-hover-bg, var(--nx-color-button-hover-bg, var(--bs-link-hover-color, var(--bs-primary))));
  --bs-btn-active-border-color: var(--nx-template-button-primary-hover-border, var(--nx-color-button-hover-border, var(--nx-color-button-hover-bg, var(--bs-link-hover-color, var(--bs-primary)))));
  color: var(--bs-btn-color) !important;
  background-color: var(--bs-btn-bg) !important;
  border-color: var(--bs-btn-border-color) !important;
  transition: background-color .14s ease, border-color .14s ease;
}
.btn.btn-primary:hover,
a.btn.btn-primary:hover {
  color: var(--bs-btn-hover-color) !important;
  background-color: var(--bs-btn-hover-bg) !important;
  border-color: var(--bs-btn-hover-border-color) !important;
}
.btn.btn-primary:active,
a.btn.btn-primary:active {
  color: var(--bs-btn-active-color) !important;
  background-color: var(--bs-btn-active-bg) !important;
  border-color: var(--bs-btn-active-border-color) !important;
}
.btn.btn-outline-primary:not(.profile-edit-button),
a.btn.btn-outline-primary:not(.profile-edit-button) {
  --bs-btn-color: var(--nx-color-button-outline-text, var(--bs-link-color, var(--bs-primary)));
  --bs-btn-border-color: var(--nx-color-button-outline-border, var(--bs-btn-color));
  --bs-btn-hover-bg: var(--nx-template-button-primary-hover-bg, var(--nx-color-button-bg, var(--bs-primary)));
  --bs-btn-hover-border-color: var(--nx-template-button-primary-hover-border, var(--nx-color-button-border, var(--nx-color-button-bg, var(--bs-primary))));
  --bs-btn-hover-color: var(--nx-template-button-primary-hover-text, var(--nx-color-button-text, var(--nx-on-inverse-text, #fff)));
  --bs-btn-active-bg: var(--nx-template-button-primary-hover-bg, var(--nx-color-button-hover-bg, var(--bs-link-hover-color, var(--bs-primary))));
  --bs-btn-active-border-color: var(--nx-template-button-primary-hover-border, var(--nx-color-button-hover-border, var(--nx-color-button-hover-bg, var(--bs-link-hover-color, var(--bs-primary)))));
  --bs-btn-active-color: var(--nx-template-button-primary-hover-text, var(--nx-color-button-hover-text, var(--nx-color-button-text, #fff)));
  --bs-btn-disabled-color: var(--bs-btn-color);
  --bs-btn-disabled-border-color: var(--bs-btn-border-color);
  color: var(--bs-btn-color) !important;
  border-color: var(--bs-btn-border-color) !important;
  background-color: transparent !important;
}
.btn.btn-outline-primary:not(.profile-edit-button):hover,
a.btn.btn-outline-primary:not(.profile-edit-button):hover,
.btn.btn-outline-primary:not(.profile-edit-button):focus,
a.btn.btn-outline-primary:not(.profile-edit-button):focus,
.btn.btn-outline-primary:not(.profile-edit-button):active,
a.btn.btn-outline-primary:not(.profile-edit-button):active,
.btn.btn-outline-primary:not(.profile-edit-button).active,
a.btn.btn-outline-primary:not(.profile-edit-button).active,
.show > .btn.btn-outline-primary:not(.profile-edit-button).dropdown-toggle,
.show > a.btn.btn-outline-primary:not(.profile-edit-button).dropdown-toggle {
  background-color: var(--bs-btn-hover-bg) !important;
  border-color: var(--bs-btn-hover-border-color) !important;
  color: var(--bs-btn-hover-color) !important;
}
main .btn[class*="btn-outline-"]:not(.profile-edit-button):not(:hover):not(:focus):not(:active):not(.active),
.nx-live-zone .btn[class*="btn-outline-"]:not(.profile-edit-button):not(:hover):not(:focus):not(:active):not(.active),
.nx-live-content .btn[class*="btn-outline-"]:not(.profile-edit-button):not(:hover):not(:focus):not(:active):not(.active) {
  background-color: transparent !important;
}
html body :is(.nx-badge--primary, .badge.bg-primary, .badge.text-bg-primary) { background-color: var(--nx-template-badge-primary-bg, color-mix(in srgb, var(--nx-color-primary, var(--bs-primary)) 10%, transparent)) !important; border: 1px solid var(--nx-template-badge-primary-border, color-mix(in srgb, var(--nx-color-primary, var(--bs-primary)) 26%, transparent)) !important; color: var(--nx-template-badge-primary-text, var(--nx-color-primary, var(--bs-primary))) !important; }
html body :is(.nx-badge--secondary, .badge.bg-secondary, .badge.text-bg-secondary) { background-color: var(--nx-template-badge-secondary-bg, color-mix(in srgb, var(--nx-color-muted, var(--bs-secondary-color, #667085)) 9%, transparent)) !important; border: 1px solid var(--nx-template-badge-secondary-border, color-mix(in srgb, var(--nx-color-muted, var(--bs-secondary-color, #667085)) 22%, transparent)) !important; color: var(--nx-template-badge-secondary-text, var(--nx-color-muted, var(--bs-secondary-color, #667085))) !important; }
html body :is(.nx-badge--success, .badge.bg-success, .badge.text-bg-success) { background-color: var(--nx-template-badge-success-bg, color-mix(in srgb, var(--bs-success, #198754) 9%, transparent)) !important; border: 1px solid var(--nx-template-badge-success-border, color-mix(in srgb, var(--bs-success, #198754) 24%, transparent)) !important; color: var(--nx-template-badge-success-text, var(--bs-success, #198754)) !important; }
html body :is(.nx-badge--warning, .badge.bg-warning, .badge.text-bg-warning) { background-color: var(--nx-template-badge-warning-bg, color-mix(in srgb, var(--bs-warning, #ffc107) 13%, transparent)) !important; border: 1px solid var(--nx-template-badge-warning-border, color-mix(in srgb, var(--bs-warning, #ffc107) 30%, transparent)) !important; color: var(--nx-template-badge-warning-text, #9a6700) !important; }
html body :is(.nx-badge--danger, .badge.bg-danger, .badge.text-bg-danger) { background-color: var(--nx-template-badge-danger-bg, color-mix(in srgb, var(--bs-danger, #dc3545) 9%, transparent)) !important; border: 1px solid var(--nx-template-badge-danger-border, color-mix(in srgb, var(--bs-danger, #dc3545) 24%, transparent)) !important; color: var(--nx-template-badge-danger-text, var(--bs-danger, #dc3545)) !important; }
html body :is(.nx-badge--info, .badge.bg-info, .badge.text-bg-info) { background-color: var(--nx-template-badge-info-bg, color-mix(in srgb, var(--bs-info, #0dcaf0) 11%, transparent)) !important; border: 1px solid var(--nx-template-badge-info-border, color-mix(in srgb, var(--bs-info, #0dcaf0) 27%, transparent)) !important; color: var(--nx-template-badge-info-text, #087990) !important; }
html body .nx-slider .nx-slider-overlay-ctas > .btn,
html body .nx-slider .nx-clan-slider-ctas > .btn,
html body .nx-live-zone .nx-slider .nx-slider-overlay-ctas > .btn,
html body .nx-live-zone .nx-slider .nx-clan-slider-ctas > .btn,
html body .nx-live-content .nx-slider .nx-slider-overlay-ctas > .btn,
html body .nx-live-content .nx-slider .nx-clan-slider-ctas > .btn {
  padding: 1.08rem 3.25rem !important;
  min-height: 4rem !important;
  min-width: 0 !important;
  flex: 1 1 0 !important;
  white-space: nowrap;
  font-size: clamp(1.05rem, .35vw + .98rem, 1.18rem) !important;
  line-height: 1.15 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
html body .nx-ep-section a.nx-ep-button,
html body .nx-pro-section a.nx-pro-button,
html body .nx-ei-section a.nx-ei-button,
html body .nx-eg-button,
html body .nx-pro-button,
html body .nx-ep-button,
html body .nx-ei-button {
  padding: 1rem 2.6rem !important;
  min-height: 3.75rem !important;
  min-width: min(13rem, 100%) !important;
  font-size: clamp(1rem, .28vw + .96rem, 1.12rem) !important;
  line-height: 1.15 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
footer.nx-footer,
footer.nx-footer h1,
footer.nx-footer h2,
footer.nx-footer h3,
footer.nx-footer h4,
footer.nx-footer h5,
footer.nx-footer h6,
footer.nx-footer .fw-semibold {
  color: var(--nx-color-footer-text, var(--nx-color-on-surface, var(--bs-body-color, #212529))) !important;
}
footer.nx-footer p,
footer.nx-footer .text-muted,
footer.nx-footer .nx-tk-text-muted,
footer.nx-footer .small,
footer.nx-footer small {
  color: var(--nx-color-footer-muted, var(--nx-color-footer-text, var(--bs-secondary-color, #6c757d))) !important;
}
footer.nx-footer a,
footer.nx-footer a.nav-link,
footer.nx-footer a.nx-tk-text-muted {
  color: var(--nx-color-footer-link, var(--bs-link-color, var(--bs-primary))) !important;
  text-decoration: var(--bs-link-decoration, none) !important;
  transition: color .16s ease;
  opacity: 1;
}
footer.nx-footer a:hover,
footer.nx-footer a:focus,
footer.nx-footer a.nav-link:hover,
footer.nx-footer a.nav-link:focus,
footer.nx-footer a.nx-tk-text-muted:hover,
footer.nx-footer a.nx-tk-text-muted:focus {
  color: var(--nx-color-footer-link-hover, var(--bs-link-hover-color, var(--bs-primary))) !important;
  text-decoration: var(--bs-link-hover-decoration, var(--bs-link-decoration, none)) !important;
}

/* Gemeinsame Aktionsbuttons aller Core-Footer (Nach oben / Cookie-Einstellungen). */
footer.nx-footer .nx-footer-utility-btn {
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 2.25rem;
  padding: 0;
  border: 1px solid color-mix(
    in srgb,
    var(--nx-color-footer-text, var(--nx-color-on-surface, var(--bs-body-color, #212529))) 24%,
    transparent
  );
  border-radius: 50%;
  background: color-mix(
    in srgb,
    var(--nx-color-footer-text, var(--nx-color-on-surface, var(--bs-body-color, #212529))) 10%,
    transparent
  );
  color: var(--nx-color-footer-link, var(--bs-link-color, var(--bs-primary))) !important;
  font: inherit;
  line-height: 1;
  cursor: pointer;
  box-shadow: none;
  transition: color .16s ease, background-color .16s ease, border-color .16s ease, transform .16s ease;
}

footer.nx-footer .nx-footer-utility-btn:hover {
  border-color: var(--nx-color-footer-link-hover, var(--bs-link-hover-color, var(--bs-primary)));
  background: color-mix(
    in srgb,
    var(--nx-color-footer-link-hover, var(--bs-link-hover-color, var(--bs-primary))) 16%,
    transparent
  );
  color: var(--nx-color-footer-link-hover, var(--bs-link-hover-color, var(--bs-primary))) !important;
  transform: translateY(-1px);
}

footer.nx-footer .nx-footer-utility-btn:focus-visible {
  outline: 2px solid var(--nx-color-footer-link-hover, var(--bs-link-hover-color, var(--bs-primary)));
  outline-offset: 2px;
}

footer.nx-footer .nx-footer-utility-btn:active {
  transform: translateY(0);
}

footer.nx-footer .nx-footer-utility-btn i {
  display: block;
  font-size: 1rem;
  line-height: 1;
  pointer-events: none;
}
#mainNavbar .navbar-nav .nav-link,
#mainNavbar .navbar-brand { color: var(--nx-color-link, var(--bs-link-color, var(--bs-body-color))) !important; text-decoration: var(--bs-link-decoration, none) !important; }
#mainNavbar .navbar-nav .nav-link:hover,
#mainNavbar .navbar-nav .nav-link:focus,
#mainNavbar .nav-item.dropdown.show > .nav-link,
#mainNavbar .nav-item.dropdown:hover > .nav-link { color: var(--nx-color-link-hover, var(--bs-link-hover-color, var(--nx-color-primary, var(--bs-primary)))) !important; text-decoration: var(--bs-link-hover-decoration, var(--bs-link-decoration, none)) !important; }
#mainNavbar .navbar-nav .nav-link.active { color: var(--nx-color-link-hover, var(--bs-link-hover-color, var(--nx-color-primary, var(--bs-primary)))) !important; text-decoration: var(--bs-link-decoration, none) !important; }
#mainNavbar #themeToggle { color: var(--bs-link-color, var(--nx-toggle-fg)) !important; text-decoration: var(--bs-link-decoration, none) !important; }
#mainNavbar #themeToggle:hover { color: var(--nx-color-link-hover, var(--bs-link-hover-color, var(--nx-color-primary, var(--bs-primary)))) !important; text-decoration: var(--bs-link-hover-decoration, var(--bs-link-decoration, none)) !important; }
#mainNavbar.navbar { background-image: none !important; }
#mainNavbar {
  --nx-dd-bg: var(--nx-nav-bg, var(--nx-nav-surface-dark-bg)) !important;
  --nx-dd-fg: var(--nx-nav-fg, var(--nx-nav-surface-dark-fg)) !important;
  --nx-dd-glass-bg: var(--nx-nav-bg, var(--nx-nav-surface-dark-bg)) !important;
  --nx-dd-hover-bg: rgba(255,255,255,.18) !important;
  --nx-dd-hover-fg: var(--nx-dd-fg) !important;
  --bs-dropdown-bg: var(--nx-dd-bg) !important;
  --bs-dropdown-color: var(--nx-dd-fg) !important;
  --bs-dropdown-border-color: transparent !important;
}
#mainNavbar .dropdown-menu {
  background: var(--bs-dropdown-bg, var(--nx-dd-bg)) !important;
  background-color: var(--bs-dropdown-bg, var(--nx-dd-bg)) !important;
  color: var(--bs-dropdown-color, var(--nx-dd-fg)) !important;
  border-color: transparent !important;
}
#mainNavbar .dropdown-item {
  color: var(--nx-dd-fg, var(--nx-nav-fg, var(--bs-dropdown-color, #fff))) !important;
}
#mainNavbar .dropdown-item:hover,
#mainNavbar .dropdown-item:focus {
  background: var(--nx-dd-hover-bg, rgba(255,255,255,.18)) !important;
  color: var(--nx-dd-hover-fg, var(--nx-dd-fg, var(--nx-nav-fg, #fff))) !important;
}
#mainNavbar.nx-tk-nav-surface-light {
  background-color: var(--nx-nav-surface-light-bg) !important;
  --nx-nav-bg: var(--nx-nav-surface-light-bg);
  --nx-nav-fg: var(--nx-nav-surface-light-fg);
  --bs-navbar-bg: var(--nx-nav-surface-light-bg);
  --bs-navbar-color: var(--nx-nav-surface-light-fg);
  --nx-dd-bg: var(--nx-nav-surface-light-bg);
  --nx-dd-fg: var(--nx-nav-surface-light-fg);
  --nx-dd-border: transparent;
  --nx-dd-hover-bg: rgba(255,255,255,.18);
  --nx-dd-hover-fg: var(--nx-dd-fg);
}
#mainNavbar.nx-tk-nav-surface-dark {
  background-color: var(--nx-nav-surface-dark-bg) !important;
  --nx-nav-bg: var(--nx-nav-surface-dark-bg);
  --nx-nav-fg: var(--nx-nav-surface-dark-fg);
  --bs-navbar-bg: var(--nx-nav-surface-dark-bg);
  --bs-navbar-color: var(--nx-nav-surface-dark-fg);
  --nx-dd-bg: var(--nx-nav-surface-dark-bg);
  --nx-dd-fg: var(--nx-nav-surface-dark-fg);
  --nx-dd-border: transparent;
  --nx-dd-hover-bg: rgba(255,255,255,.18);
  --nx-dd-hover-fg: var(--nx-dd-fg);
}
#mainNavbar.bg-transparent,
#mainNavbar.navbar.bg-transparent,
#mainNavbar.nx-nav-overlay:not(.nx-nav-filled) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  --nx-nav-bg: transparent;
}
#mainNavbar.nx-tk-nav-surface-light .navbar-nav .nav-link,
#mainNavbar.nx-tk-nav-surface-light .navbar-brand,
#mainNavbar.nx-tk-nav-surface-light #themeToggle {
  color: var(--nx-nav-surface-light-fg) !important;
}
#mainNavbar.nx-tk-nav-surface-dark .navbar-nav .nav-link,
#mainNavbar.nx-tk-nav-surface-dark .navbar-brand,
#mainNavbar.nx-tk-nav-surface-dark #themeToggle {
  color: var(--nx-nav-surface-dark-fg) !important;
}

#mainNavbar:not(.nx-nav-overlay) .navbar-nav .nav-link,
#mainNavbar:not(.nx-nav-overlay) .navbar-brand {
  color: var(--nx-color-link, var(--bs-link-color, var(--nx-nav-fg))) !important;
}
@media (max-width: 991.98px) {
  html,
  body {
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  #mainNavbar.navbar {
    max-height: 100dvh;
  }
  #mainNavbar .navbar-collapse {
    max-height: calc(100dvh - 56px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  #mainNavbar .navbar-collapse.collapsing {
    overflow-y: hidden;
  }
  #mainNavbar .navbar-collapse.show {
    overflow-y: auto;
  }
  #mainNavbar .navbar-toggler {
    color: var(--nx-nav-fg, var(--bs-navbar-color, #212529)) !important;
    border-color: color-mix(in srgb, currentColor 45%, transparent) !important;
    background-color: color-mix(in srgb, currentColor 8%, transparent);
    box-shadow: none !important;
  }
  #mainNavbar .navbar-toggler:focus {
    box-shadow: 0 0 0 .15rem color-mix(in srgb, currentColor 24%, transparent) !important;
  }
  #mainNavbar .navbar-toggler-icon,
  #mainNavbar.navbar-light .navbar-toggler-icon,
  #mainNavbar[data-bs-theme="light"] .navbar-toggler-icon,
  #mainNavbar.nx-tk-nav-surface-light .navbar-toggler-icon {
    filter: none !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2833,37,41,0.92%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
  }
  #mainNavbar.navbar-dark .navbar-toggler-icon,
  #mainNavbar[data-bs-theme="dark"] .navbar-toggler-icon,
  #mainNavbar.nx-tk-nav-surface-dark .navbar-toggler-icon {
    filter: none !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,0.96%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
  }
}
#mainNavbar.nx-tk-nav-surface-light .dropdown-menu {
  background: var(--nx-nav-surface-light-bg) !important;
  color: var(--nx-nav-surface-light-fg) !important;
  border-color: transparent !important;
}
#mainNavbar.nx-tk-nav-surface-dark .dropdown-menu {
  background: var(--nx-nav-surface-dark-bg) !important;
  color: var(--nx-nav-surface-dark-fg) !important;
  border-color: transparent !important;
}
#mainNavbar.nx-tk-nav-surface-light .dropdown-item,
#mainNavbar.nx-tk-nav-surface-dark .dropdown-item {
  color: var(--nx-dd-fg, var(--nx-nav-fg, var(--bs-dropdown-color, #fff))) !important;
}
#mainNavbar.nx-tk-nav-surface-light .dropdown-item:hover,
#mainNavbar.nx-tk-nav-surface-light .dropdown-item:focus,
#mainNavbar.nx-tk-nav-surface-dark .dropdown-item:hover,
#mainNavbar.nx-tk-nav-surface-dark .dropdown-item:focus {
  background: var(--nx-dd-hover-bg, color-mix(in srgb, var(--nx-color-primary, var(--bs-primary, currentColor)) 12%, transparent)) !important;
  color: var(--nx-dd-hover-fg, var(--nx-dd-fg, var(--nx-nav-fg, #fff))) !important;
}
html body nav.nx-nav-core-demo.nx-tk-nav-surface-dark .dropdown-menu,
html body nav.nx-nav-core-demo.navbar-dark .dropdown-menu,
html body #mainNavbar.navbar-dark .dropdown-menu {
  --nx-dd-fg: var(--nx-nav-fg, var(--nx-nav-surface-dark-fg, #f3f5f8));
  --bs-dropdown-color: var(--nx-dd-fg);
  color: var(--nx-dd-fg) !important;
}
html body nav.nx-nav-core-demo.nx-tk-nav-surface-dark .dropdown-item,
html body nav.nx-nav-core-demo.navbar-dark .dropdown-item,
html body #mainNavbar.navbar-dark .dropdown-item {
  color: var(--nx-dd-fg, var(--nx-nav-fg, var(--nx-nav-surface-dark-fg, #f3f5f8))) !important;
}
html body nav.nx-nav-core-demo.nx-tk-nav-surface-dark .dropdown-item:hover,
html body nav.nx-nav-core-demo.nx-tk-nav-surface-dark .dropdown-item:focus,
html body nav.nx-nav-core-demo.navbar-dark .dropdown-item:hover,
html body nav.nx-nav-core-demo.navbar-dark .dropdown-item:focus,
html body #mainNavbar.navbar-dark .dropdown-item:hover,
html body #mainNavbar.navbar-dark .dropdown-item:focus {
  color: var(--nx-dd-hover-fg, var(--nx-color-link-hover, var(--bs-link-hover-color, #f09a55))) !important;
}
.nx-hero-h-40{min-height:40vh;display:flex;align-items:center;}
.nx-hero-h-50{min-height:50vh;display:flex;align-items:center;}
.nx-hero-h-60{min-height:60vh;display:flex;align-items:center;}
.nx-hero-h-80{min-height:80vh;display:flex;align-items:center;}
.nx-hero-h-100{min-height:100vh;display:flex;align-items:center;}
.nx-slider .nx-slider-stage.nx-slider-stage-vh-40{height:40vh;}
.nx-slider .nx-slider-stage.nx-slider-stage-vh-50{height:50vh;}
.nx-slider .nx-slider-stage.nx-slider-stage-vh-60{height:60vh;}
.nx-slider .nx-slider-stage.nx-slider-stage-vh-80{height:80vh;}
.nx-slider .nx-slider-stage.nx-slider-stage-vh-100{height:100vh;min-height:100vh;max-height:100vh;}
@media (max-width: 992px) {
  .nxm-page--commerce .nxm-hero.nxm-hero--commerce {
    padding-inline: clamp(1rem, 5vw, 2rem) !important;
    text-align: center !important;
  }
  .nxm-page--commerce .nxm-hero__inner {
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    width: min(100%, 42rem) !important;
    margin-inline: auto !important;
  }
  .nxm-page--commerce .nxm-hero__copy,
  .nxm-page--commerce .nxm-hero__aside {
    grid-column: 1 !important;
    width: min(100%, 42rem) !important;
    margin-inline: auto !important;
  }
  .nxm-page--commerce .nxm-hero__aside {
    align-items: center !important;
  }
  .nxm-page--commerce .nxm-hero__copy,
  .nxm-page--commerce .nxm-hero__title,
  .nxm-page--commerce .nxm-lead,
  .nxm-page--commerce .nxm-hero__panel {
    text-align: center !important;
  }
  .nxm-page--commerce .nxm-hero__title,
  .nxm-page--commerce .nxm-lead,
  .nxm-page--commerce .nxm-hero__shot,
  .nxm-page--commerce .nxm-hero__panel {
    margin-inline: auto !important;
  }
  .nxm-page--commerce .nxm-hero__shot,
  .nxm-page--commerce .nxm-hero__panel {
    width: min(100%, 38rem) !important;
  }
  .nxm-page--commerce .nxm-kicker,
  .nxm-page--commerce .nxm-eyebrow {
    display: inline-flex !important;
    justify-content: center !important;
    margin-inline: auto !important;
    text-align: center !important;
  }
  .nxm-page--commerce .nxm-actions {
    justify-content: center !important;
    align-items: center !important;
  }
}

html body main :is(a.btn,button.btn,.btn,.nxm-btn),
html body .nx-live-zone :is(a.btn,button.btn,.btn,.nxm-btn),
html body .nx-live-content :is(a.btn,button.btn,.btn,.nxm-btn),
html body .nxm-page .nxm-btn,
html body .nx-ep-section a.nx-ep-button,
html body .nx-pro-section a.nx-pro-button,
html body .nx-ei-section a.nx-ei-button,
html body .nx-eg-button,
html body .nx-pro-button,
html body .nx-ep-button,
html body .nx-ei-button {
  border-radius: var(--nx-template-button-radius, var(--nx-global-button-radius, .5rem)) !important;
  box-shadow: var(--nx-template-button-shadow, var(--nx-global-button-shadow, none)) !important;
  font-size: var(--nx-template-button-font-size, var(--nx-global-button-font-size, 1rem)) !important;
  padding-top: var(--nx-template-button-padding-y, var(--nx-global-button-padding-y, .375rem)) !important;
  padding-bottom: var(--nx-template-button-padding-y, var(--nx-global-button-padding-y, .375rem)) !important;
  padding-left: var(--nx-template-button-padding-x, var(--nx-global-button-padding-x, .75rem)) !important;
  padding-right: var(--nx-template-button-padding-x, var(--nx-global-button-padding-x, .75rem)) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-decoration: none !important;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}
/* NX_NAV_COMPONENT_EXTERNAL: zuvor pro Navbar inline ausgegeben. */
.nx-nav-core-demo .navbar-nav .nav-link:focus,.nx-nav-core-demo .navbar-nav .nav-link.dropdown-toggle:focus{outline:none !important;box-shadow:none !important;}
.nx-nav-core-demo .navbar-nav .nav-link.dropdown-toggle::after{display:none !important;}
.nx-nav-core-demo .navbar-nav .nav-link{position:relative;}
.nx-nav-core-demo .navbar-nav .nx-nav-user-toggle{white-space:nowrap;flex-wrap:nowrap;}
.nx-nav-core-demo .navbar-nav .nx-nav-user-name{white-space:nowrap;display:inline-block;}
.nx-nav-core-demo .navbar-collapse{align-items:stretch;}
.nx-nav-core-demo .nx-nav-actions{margin-inline-start:auto;flex:0 0 auto;align-items:stretch;}
.nx-nav-core-demo .nx-nav-actions>.nav-item{display:flex;align-items:stretch;}
.nx-nav-core-demo .nx-nav-actions>.nav-item>.nav-link{display:flex;align-items:center;}
.nx-nav-core-demo .navbar-nav .nav-link:is(.nx-nav-effect-default,.nx-nav-effect-center,.nx-nav-effect-swipe)::before{content:"";position:absolute;left:0;right:0;bottom:0;height:2px !important;min-height:2px !important;max-height:2px !important;background-color:var(--nx-nav-local-text-hover,var(--nx-color-link-hover,var(--nx-color-primary,var(--bs-primary))));transform:scaleX(0);transform-origin:left center;transition:transform .25s ease-out;pointer-events:none;}
.nx-nav-core-demo .navbar-nav .nav-link.nx-nav-effect-default:hover::before,.nx-nav-core-demo .navbar-nav .nav-link.nx-nav-effect-default:focus::before,.nx-nav-core-demo .nav-item.dropdown.show>.nav-link.nx-nav-effect-default::before,.nx-nav-core-demo .nav-item.dropdown:hover>.nav-link.nx-nav-effect-default::before{transform:scaleX(1);}
.nx-nav-core-demo .navbar-nav .nav-link.nx-nav-effect-center::before{left:50%;right:auto;width:100%;transform:translateX(-50%) scaleX(0);transform-origin:center;}
.nx-nav-core-demo .navbar-nav .nav-link.nx-nav-effect-center:hover::before,.nx-nav-core-demo .navbar-nav .nav-link.nx-nav-effect-center:focus::before,.nx-nav-core-demo .nav-item.dropdown.show>.nav-link.nx-nav-effect-center::before,.nx-nav-core-demo .nav-item.dropdown:hover>.nav-link.nx-nav-effect-center::before{transform:translateX(-50%) scaleX(1);}
.nx-nav-core-demo .navbar-nav .nav-link.nx-nav-effect-swipe:hover::before,.nx-nav-core-demo .navbar-nav .nav-link.nx-nav-effect-swipe:focus::before,.nx-nav-core-demo .nav-item.dropdown.show>.nav-link.nx-nav-effect-swipe::before,.nx-nav-core-demo .nav-item.dropdown:hover>.nav-link.nx-nav-effect-swipe::before{transform:scaleX(1);transform-origin:left center;}
.nx-nav-core-demo .navbar-nav .nav-link.nx-nav-effect-swipe:not(:hover):not(:focus)::before{transform:scaleX(0);transform-origin:right center;}
.nx-nav-hover .dropdown:hover .dropdown-menu,.nx-nav-hover .dropdown.show .dropdown-menu{display:block !important;}
.nx-nav-core-demo .dropdown-menu{background-color:var(--nx-nav-local-bg,var(--bs-dropdown-bg,var(--nx-dd-bg))) !important;border-color:var(--nx-nav-local-bg,var(--bs-dropdown-border-color,transparent)) !important;}
@media (max-width:991.98px){.nx-nav-core-demo .navbar-collapse{width:100%;flex-basis:100%;max-height:none !important;overflow:visible !important;padding-top:.25rem !important;padding-bottom:.35rem !important;touch-action:auto;}.nx-nav-core-demo .navbar-collapse .navbar-nav{width:100%;height:auto !important;min-height:0 !important;align-self:auto !important;align-items:stretch !important;gap:0 !important;margin:0 !important;}.nx-nav-core-demo .navbar-collapse .navbar-nav>.nav-item{width:100%;min-height:0 !important;height:auto !important;display:block !important;margin:0 !important;}.nx-nav-core-demo .navbar-collapse .navbar-nav .nav-link{width:100%;min-height:0 !important;height:auto !important;justify-content:flex-start !important;padding-top:.28rem !important;padding-bottom:.28rem !important;line-height:1.2 !important;}.nx-nav-core-demo .navbar-collapse .dropdown-menu{position:static !important;max-height:none !important;overflow:visible !important;margin:.1rem 0 .25rem !important;padding:.1rem 0 !important;}.nx-nav-core-demo .navbar-collapse .dropdown-item{padding-top:.3rem !important;padding-bottom:.3rem !important;line-height:1.2 !important;}}
.nx-empty-content-note{margin:2.25rem 0;padding:1rem 1.25rem;border:1px solid rgba(148,163,184,.35);border-radius:.5rem;background:rgba(248,250,252,.85);color:#64748b;font-size:.95rem;}
/* NX_STARTER_COMPONENT_EXTERNAL */
.nx-starter-info section{background:color-mix(in srgb,var(--nx-color-surface,var(--bs-body-bg,#fff)) 90%,var(--nx-color-primary,var(--bs-primary,#ff7a1a)) 10%)!important;color:var(--nx-color-on-surface,var(--bs-body-color,#172033))!important}.nx-starter-steps section{background:color-mix(in srgb,var(--nx-color-surface,var(--bs-body-bg,#fff)) 96%,var(--nx-color-primary,var(--bs-primary,#ff7a1a)) 4%)!important;color:var(--nx-color-on-surface,var(--bs-body-color,#172033))!important}.nx-starter-info h2,.nx-starter-info h3,.nx-starter-steps h2,.nx-starter-steps h3{color:var(--nx-color-on-surface,var(--bs-heading-color,#172033))!important}.nx-starter-info p,.nx-starter-steps p{color:var(--nx-color-muted,var(--bs-secondary-color,#5d6678))!important}.nx-starter-card,.nx-starter-step{background:var(--nx-color-card-bg,var(--bs-card-bg,#fff))!important;border-color:var(--nx-color-card-border,var(--bs-border-color,#e4e8f0))!important;color:var(--nx-color-on-surface,var(--bs-body-color,#172033))!important}.nx-starter-eyebrow,.nx-starter-step-num{color:var(--nx-color-primary,var(--bs-primary,#ff7a1a))!important}.nx-starter-cta section{background:var(--nx-nav-surface-dark-bg,var(--nx-color-secondary,#111827))!important;color:var(--nx-color-footer-text,var(--nx-on-inverse-text,#fff))!important}.nx-starter-cta h2{color:var(--nx-color-footer-text,var(--nx-on-inverse-text,#fff))!important}.nx-starter-cta p{color:var(--nx-color-footer-muted,var(--nx-on-inverse-muted,rgba(255,255,255,.78)))!important}.nx-starter-btn{background:var(--nx-color-button-bg,var(--nx-color-primary,#ff8a24))!important;color:var(--nx-color-button-text,var(--nx-on-inverse-text,#fff))!important;border-color:var(--nx-color-button-border,var(--nx-color-button-bg,var(--nx-color-primary,#ff8a24)))!important}.nx-starter-btn-outline{color:var(--nx-color-button-outline-text,var(--nx-on-inverse-text,#fff))!important;border-color:var(--nx-color-button-outline-border,rgba(255,255,255,.42))!important}
/* Frontend navigation must stay above module page shells and their isolated headers. */
body:not(.builder-active) [data-nx-zone="navbar"],
body:not(.builder-active) [data-nx-zone="navbar"] > .nx-live-item,
body:not(.builder-active) [data-nx-zone="navbar"] > .nx-live-item > .nx-live-content {
  position: relative;
  z-index: 1050;
  overflow: visible !important;
}
body:not(.builder-active) #mainNavbar,
body:not(.builder-active) nav.nx-nav-core-demo {
  position: relative;
  z-index: 1051;
  overflow: visible;
}
body:not(.builder-active) #mainNavbar .dropdown-menu,
body:not(.builder-active) nav.nx-nav-core-demo .dropdown-menu {
  z-index: 1060;
}
/* Frontend navigation pinning: the spacer replaces the fixed navigation in the document flow. */
body:not(.builder-active) nav.nx-nav-core-demo.nx-nav-is-fixed {
    position: fixed !important;
    top: var(--nx-nav-pin-top, 0px);
    right: 0;
    left: 0;
    width: 100%;
    z-index: 1050;
}
body:not(.builder-active) nav.nx-nav-core-demo.nx-nav-is-sticky {
    position: sticky !important;
    top: var(--nx-nav-pin-top, 0px);
    z-index: 1050;
}
body:not(.builder-active) .nx-nav-pin-spacer {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}

/* Individuelle Schriftfarbe des Navigations-Widgets. Ohne gesetzte Variable greifen die Farbschemata unverändert. */
html body nav.nx-nav-core-demo .navbar-brand,
html body nav.nx-nav-core-demo .navbar-text,
html body nav.nx-nav-core-demo .navbar-nav .nav-link,
html body nav.nx-nav-core-demo .navbar-toggler,
html body nav.nx-nav-core-demo .dropdown-item {
  color: var(--nx-nav-local-text) !important;
}
html body nav.nx-nav-core-demo .navbar-nav .nav-link:hover,
html body nav.nx-nav-core-demo .navbar-nav .nav-link:focus,
html body nav.nx-nav-core-demo .navbar-nav .nav-link.active,
html body nav.nx-nav-core-demo .nav-item.dropdown.show > .nav-link,
html body nav.nx-nav-core-demo .nav-item.dropdown:hover > .nav-link,
html body nav.nx-nav-core-demo .dropdown-item:hover,
html body nav.nx-nav-core-demo .dropdown-item:focus {
  color: var(--nx-nav-local-text-hover, var(--nx-nav-local-text)) !important;
}