/* ==========================================================================
   NX24 – Basis (aus Gripfruit 0.41.2)
   Breakpoints: Mobil < 768 · Tablet 768–1023 · Desktop ≥ 1024 · Raster fix ab 1600
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0; background: var(--pws-c-bg, #fff); color: var(--pws-c-text, #0C0C0C);
	font-family: var(--pws-font, system-ui, sans-serif);
	font-size: var(--pws-fs-body, 16px); line-height: var(--pws-lh-body, 1.75); font-weight: var(--pws-fw-body, 400);
	-webkit-font-smoothing: antialiased; overflow-x: clip;
}
/* Silbentrennung: per Theme-Einstellung (Allgemein) an/aus */
.pws-no-hyphens { -webkit-hyphens: none; hyphens: none; word-break: normal; overflow-wrap: normal; }
.pws-hyphens { -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }
.pws-hyphens .pws-slide-heading, .pws-hyphens .pws-hero__word, .pws-hyphens .pws-map__value { -webkit-hyphens: none; hyphens: none; }

img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
:focus-visible { outline: 2px solid var(--pws-c-accent); outline-offset: 3px; }
/* „Zum Inhalt springen“ – nur für Tastatur-/Screenreader-Nutzer, erscheint ausschließlich per Tab-Taste */
.pws-skip { position: fixed; left: 12px; top: 12px; z-index: 1000; padding: 10px 16px; background: var(--pws-c-primary); color: var(--pws-c-bg);
	clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; white-space: nowrap; }
.pws-skip:focus-visible { clip-path: none; width: auto; height: auto; overflow: visible; }

.pws-container { width: min(var(--pws-grid, 1500px), 100% - 2 * var(--pws-gutter, 60px)); margin-inline: auto; }

/* Typografie ------------------------------------------------------------ */
h1, h2, h3, h4 { margin: 0 0 .6em; color: var(--pws-c-primary); }
h1, .pws-h1 { font-size: var(--pws-fs-h1); line-height: var(--pws-lh-h1); font-weight: var(--pws-fw-h1); }
h2, .pws-h2 { font-size: var(--pws-fs-h2); line-height: var(--pws-lh-h2); font-weight: var(--pws-fw-h2); }
h3, .pws-h3 { font-size: var(--pws-fs-h3); line-height: var(--pws-lh-h3); font-weight: var(--pws-fw-h3); }
h4, .pws-h4 { font-size: var(--pws-fs-h4); line-height: var(--pws-lh-h4); font-weight: var(--pws-fw-h4); }
.pws-richtext > :first-child { margin-top: 0; }
.pws-richtext > :last-child { margin-bottom: 0; }
.pws-richtext p { margin: 0 0 1em; }

/* Menüs ------------------------------------------------------------------ */
.pws-menu, .pws-footmenu, .pws-mobile-nav__main { list-style: none; margin: 0; padding: 0; }
.pws-menu { display: flex; gap: clamp(24px, 3vw, 56px); }
.pws-menu a { text-decoration: none; font-size: var(--pws-fs-menu, 15px); line-height: var(--pws-lh-menu, 1.3); font-weight: var(--pws-fw-menu, 500); }
.pws-menu a:hover { color: var(--pws-c-accent); }
/* Menüpunkt mit CSS-Klasse „is-button“ (Design → Menüs → Ansicht-Optionen → CSS-Klassen): umrandeter Button */
.pws-menu .is-button > a { padding: .45em 1.2em; margin-block: -.45em; border: 1.5px solid currentColor; border-radius: 999px; }
.pws-menu .is-button > a::after { display: none; }
.pws-menu .is-button > a:hover { color: inherit; background: color-mix(in srgb, currentColor 14%, transparent); }
/* Aktiver Menüpunkt (Onepager, per Skript beim Scrollen gesetzt). Die unsichtbare Kopie in Fett
   hält die Breite fest, damit die Nachbarn beim Wechsel nicht verrutschen. */
.pws-menu a, .pws-footmenu a { display: inline-flex; flex-direction: column; }
.pws-menu a::after, .pws-footmenu a::after, .pws-mobile-nav__main a::after {
	content: attr(data-label); display: block; font-weight: 700; height: 0; overflow: hidden; visibility: hidden; pointer-events: none; user-select: none;
}
.pws-menu a.is-active, .pws-footmenu a.is-active, .pws-mobile-nav__main a.is-active, .pws-hero__nav .pws-menu a.is-active { font-weight: 700; }

.pws-footmenu { display: flex; justify-content: space-between; gap: 8px 24px; }
.pws-footmenu a { text-decoration: none; font-size: var(--pws-fs-small); line-height: var(--pws-lh-small); font-weight: var(--pws-fw-small); }
.pws-footmenu a:hover { color: var(--pws-c-accent); }
@media (max-width: 1023px) { .pws-footmenu { display: grid; grid-template-columns: repeat(4, 1fr); } }   /* Tablet: 2 Zeilen */
@media (max-width: 767px)  { .pws-footmenu { grid-template-columns: repeat(2, 1fr); } }                 /* Mobil: 2 Spalten */

/* Sticky-Header (erscheint beim Hochscrollen) ------------------------------ */
.pws-header {
	position: fixed; inset: 0 0 auto; z-index: 100; height: 60px; display: flex; align-items: center;
	background: var(--pws-c-bg); color: var(--pws-c-primary);
	transform: translateY(-100%); transition: transform .35s ease, background-color .3s;
}
.pws-header.is-visible, body:not(.has-pws-hero) .pws-header.is-top { transform: none; }
.pws-header__inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.pws-header__logo { width: var(--pws-logo-l, 240px); }
.pws-hero__logo .pws-logo { width: var(--pws-logo-s, 220px); }
.pws-logo svg, .pws-logo img { width: 100%; height: auto; }
.pws-logo { display: inline-grid; text-decoration: none; }
.pws-logo__img { grid-area: 1 / 1; display: block; transition: opacity .35s ease; }
.pws-logo__img--light { opacity: 0; }
.pws-logo.use-light .pws-logo__img--dark { opacity: 0; }
.pws-logo.use-light .pws-logo__img--light { opacity: 1; }
.pws-logo__text { font-weight: 600; font-size: 22px; color: var(--pws-c-primary); }
body:not(.has-pws-hero) #pws-main { padding-top: 60px; }

.pws-burger { display: none; width: 40px; height: 40px; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; position: relative; }
.pws-burger span, .pws-burger span::before, .pws-burger span::after {
	position: absolute; left: 8px; right: 8px; height: 2px; background: currentColor; content: ""; transition: transform .25s, opacity .25s;
}
.pws-burger span { top: 19px; }
.pws-burger span::before { left: 0; right: 0; top: -7px; }
.pws-burger span::after { left: 0; right: 0; top: 7px; }
.pws-burger[aria-expanded="true"] span { background: transparent; }
.pws-burger[aria-expanded="true"] span::before { transform: translateY(7px) rotate(45deg); }
.pws-burger[aria-expanded="true"] span::after { transform: translateY(-7px) rotate(-45deg); }
@media (max-width: 1023px) {
	.pws-header__nav, .pws-hero__nav { display: none; }
	.pws-burger { display: block; }
}

.pws-mobile-nav { position: fixed; inset: 0; z-index: 99; background: var(--pws-c-bg); padding: 110px 0 40px; overflow-y: auto; }
.pws-mobile-nav__main a { display: block; padding: 10px 0; font-size: 28px; font-weight: 500; text-decoration: none; color: var(--pws-c-primary); }
.pws-mobile-nav .pws-footmenu { margin-top: 48px; }
body.pws-nav-open { overflow: hidden; }
body.pws-nav-open .pws-header { transform: none; }

/* Footer-Leiste: erscheint zusammen mit dem Header beim Hochscrollen (ab Tablet) */
.pws-footbar {
	position: fixed; inset: auto 0 0; z-index: 100; height: 60px; display: flex; align-items: center;
	background: var(--pws-c-bg); color: var(--pws-c-text);
	transform: translateY(100%); transition: transform .35s ease, background-color .3s;
}
.pws-footbar.is-visible:not(.is-covered) { transform: none; }
@media (max-width: 767px) { .pws-footbar { display: none; } }
body.pws-nav-open .pws-footbar { transform: translateY(100%); }

/* Videoscroll: Standphase – die Bühne bleibt oben kleben, solange die Seite um --vs-pin weiterscrollt */
.pws-videoscroll { height: calc(100vh + var(--vs-pin, 0vh)); height: calc(100lvh + var(--vs-pin, 0vh)); }
/* Handy: Bühne so hoch wie der Bildschirm mit eingeklappter Adressleiste (lvh) – sonst entsteht beim Scrollen
   unten ein Streifen. Logo, Menü und Texte bleiben trotzdem im kleinsten sichtbaren Bereich (svh). */
.pws-videoscroll .pws-hero__stage { position: sticky; top: 0; height: 100vh; height: 100lvh; }
@supports (height: 100svh) {
	.pws-videoscroll .pws-hero__ui { bottom: calc(var(--f) + (100lvh - 100svh)); }
}

/* Kreis am unteren Rand (Videoscroll): rein per CSS positioniert (sticky), damit nichts nachruckelt.
   Die Spur reicht einen halben Kreis über das Modul hinaus. Der Kreis klebt mit seinem Mittelpunkt an der
   Unterkante des Bildschirms – anfangs halb verdeckt – und rollt nach der Standphase mit der Seite ganz ins Bild,
   bis sein Mittelpunkt auf der Unterkante des Moduls liegt. Drehung: main.js (weich nachgeführt). */
.pws-videoscroll { position: relative; z-index: 2; }
.pws-circle-track { --s: var(--size, 180px); position: absolute; inset: 0 0 calc(var(--s) / -2); z-index: 3; pointer-events: none; }
.pws-circle {
	position: sticky; top: calc(100vh - var(--s) / 2); top: calc(100svh - var(--s) / 2);
	width: var(--s); height: var(--s); margin-left: calc(var(--x, 38%) - var(--s) / 2); color: #fff;
}
.pws-circle__rot, .pws-circle svg, .pws-circle__rot img { width: 100%; height: 100%; }
.pws-circle__rot { will-change: transform; transform: translateZ(0); }
.pws-circle text { fill: currentColor; font-family: var(--pws-font); font-weight: 500; letter-spacing: .02em; }
/* Tablet/Mobil: Kreis rechts, Texte im Hero rücken um den halben Kreis nach oben */
@media (max-width: 1023px) {
	.pws-circle { margin-left: calc(100% - var(--pws-gutter, 24px) - var(--s)); }
	.pws-videoscroll:has(.pws-circle) .pws-hero__content { padding-bottom: calc(var(--circ, 180px) * .5 + 12px); }
}
@media (max-width: 767px) {
	.pws-circle-track { --s: calc(var(--size, 180px) * .7); }
	.pws-videoscroll:has(.pws-circle) .pws-hero__content { padding-bottom: calc(var(--circ, 180px) * .35 + 12px); }
}
/* Einrückung einzelner Zeilen in Überschriften (Leerzeichen am Zeilenanfang) */
.pws-indent { display: inline-block; padding-left: calc(var(--in, 0) * .2em); }

/* Videoscroll: Übergang in die Content-Farbe. Unterste Zeile immer 100 % Deckkraft → nahtlos bei jedem Videobild.
   Leicht geschwungene Kurve statt linearem Verlauf, damit keine sichtbare Kante am oberen Ende entsteht. */
.pws-videoscroll.has-fade { --vs-fade-c: var(--vs-fade, var(--vs-fade-auto, var(--pws-c-bg))); }
.pws-videoscroll.has-fade .pws-hero__media::after {
	content: ""; position: absolute; inset: auto 0 -1px; height: var(--vs-fade-h, 35%); pointer-events: none;
	opacity: var(--vs-fade-o, 1);   /* 0 am Anfang der Standphase, 1 sobald die Seite zu scrollen beginnt (main.js) */
	background: linear-gradient(to bottom,
		color-mix(in srgb, var(--vs-fade-c) 0%, transparent) 0%,
		color-mix(in srgb, var(--vs-fade-c) 12%, transparent) 25%,
		color-mix(in srgb, var(--vs-fade-c) 38%, transparent) 50%,
		color-mix(in srgb, var(--vs-fade-c) 72%, transparent) 75%,
		var(--vs-fade-c) 100%);
}

/* Seiten, die mit einem Videoscroll-Modul beginnen: Header und Footer-Leiste ohne Hintergrund */
.has-pws-videoscroll .pws-header, .has-pws-videoscroll .pws-footbar { background: transparent; }
/* Seite mit „Logo und Menü immer weiß“: kein Farbwechsel, Header durchsichtig mit weißer Schrift */
.pws-ui-light .pws-header, .pws-ui-light .pws-footbar { background: transparent; color: #fff; }
.pws-ui-light .pws-hero__nav .pws-menu a, .pws-ui-light .pws-hero__nav.is-on-light .pws-menu a,
.pws-ui-light .pws-burger--hero, .pws-ui-light .pws-burger--hero.is-on-light,
.pws-ui-light .pws-header .pws-menu a, .pws-ui-light .pws-header .pws-burger, .pws-ui-light .pws-logo__text { color: #fff; }
.pws-ui-light .pws-logo.has-light .pws-logo__img--dark { opacity: 0; }
.pws-ui-light .pws-logo.has-light .pws-logo__img--light { opacity: 1; }
body.pws-ui-light.pws-nav-open .pws-header { background: var(--pws-c-bg); color: var(--pws-c-primary); }
body.pws-ui-light.pws-nav-open .pws-header .pws-burger { color: var(--pws-c-primary); }
body.pws-ui-light.pws-nav-open .pws-header .pws-logo.has-light .pws-logo__img--dark { opacity: 1; }
body.pws-ui-light.pws-nav-open .pws-header .pws-logo.has-light .pws-logo__img--light { opacity: 0; }

body { transition: background-color .3s, color .3s; }

/* Seiten-Hülle für das Anhalten der Seite (animations.js → createFreeze) */
#pws-page { position: relative; background: var(--pws-c-bg); }
/* Haltepunkte verschieben #pws-page per margin-top: kein Zusammenfallen der Ränder, keine automatische Scroll-Korrektur des Browsers */
#pws-page-holder { display: flow-root; overflow-anchor: none; }

/* Footer ----------------------------------------------------------------- */
.pws-footer { padding: 22px 0 28px; background: var(--pws-c-bg); color: var(--pws-c-text); }
.pws-footer .pws-footmenu a:hover, .pws-footbar .pws-footmenu a:hover { color: inherit; opacity: .7; }
.pws-footer:empty, .pws-footer:not(:has(li)) { display: none; }
html[style*="--pws-overscroll"], html[style*="--pws-overscroll"] body { background: var(--pws-overscroll); }

/* ==========================================================================
   Hero
   ========================================================================== */
.pws-hero { --hero-end: var(--hero-end-d, 200px); --f: var(--hero-frame, 60px); position: relative; color: #fff; }
@media (max-width: 1023px) { .pws-hero { --hero-end: var(--hero-end-t, 160px); } }
@media (max-width: 767px)  { .pws-hero { --hero-end: var(--hero-end-m, 110px); --f: min(var(--hero-frame, 60px), var(--pws-gutter)); } }

.pws-hero__stage { position: relative; height: 100vh; height: 100svh; overflow: hidden; background: var(--pws-c-bg); }
.pws-hero__media { position: absolute; inset: var(--f); will-change: transform; transform-origin: 50% 50%; }
.pws-hero__media img, .pws-hero__media video, .pws-hero__media picture { width: 100%; height: 100%; object-fit: cover; }
/* Video: absolut über die ganze Fläche, 1px Überstand gegen Rundungskanten (Safari).
   Dahinter liegt das Posterbild – falls ein Browser einen Streifen nicht füllt, sieht man das Bild statt Grau. */
.pws-hero__media { overflow: hidden; background: var(--pws-ink, #0C0C0C) var(--hero-poster, none) center / cover no-repeat; }
.pws-hero__media video { position: absolute; inset: -1px; width: calc(100% + 2px); height: calc(100% + 2px); max-width: none; object-fit: cover; object-position: center; }
.pws-hero__overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,20,40,var(--hero-overlay,.2)), transparent 60%); }

/* Rahmen: Das Bild sitzt exakt im Fenster (Bildschirm minus Rahmen), der weiße Rand ist Seitenhintergrund.
   Das Rahmen-Element trägt nur das Footer-Menü und skaliert beim Scrollen nach außen. */
.pws-hero__frame { position: absolute; inset: var(--f); pointer-events: none; will-change: transform; }
.pws-hero__footnav { position: absolute; left: calc(-1 * var(--f)); right: calc(-1 * var(--f)); top: 100%; height: var(--f); display: flex; align-items: center; pointer-events: auto; color: var(--pws-c-primary); overflow: hidden; } /* bei Rahmen 0 px komplett unsichtbar */
@media (max-width: 767px) { .pws-hero__footnav { display: none; } }

.pws-hero .pws-container { width: min(var(--pws-grid, 1500px), 100% - 2 * (var(--f) + var(--pws-gutter))); }
/* Abstand oben (Bildkante → Logo/Menü): nach Bildschirmbreite skaliert, nie größer als der bisherige Wert.
   390px → 40px · 1700px → 80px · ab ca. 1920px wieder der bisherige Wert (12vh, max. 140px). */
.pws-hero__ui {
	--hero-top-max: clamp(40px, 12vh, 140px);
	--hero-top: min(var(--hero-top-max), clamp(40px, calc(40px + (100vw - 390px) * 0.0305), 80px));
	position: absolute; inset: var(--f) 0; display: flex; flex-direction: column; justify-content: space-between;
	padding-block: var(--hero-top) clamp(40px, 11vh, 110px);
}
@media (min-width: 1700px) {
	.pws-hero__ui { --hero-top: min(var(--hero-top-max), calc(80px + (100vw - 1700px) * 0.27)); }
}
.pws-hero__top { display: flex; align-items: center; justify-content: space-between; }
.pws-hero__nav .pws-menu a { color: #fff; transition: color .35s ease; font-size: var(--pws-fs-heromenu, 15px); line-height: var(--pws-lh-heromenu, 1.3); font-weight: var(--pws-fw-heromenu, 500); }
.pws-burger--hero { color: #fff; transition: color .35s ease; }
/* Heller Hintergrund hinter dem Menü (automatisch per Skript erkannt) → Dunkelblau, unabhängig vom dunklen Modus */
.pws-hero__nav.is-on-light .pws-menu a, .pws-burger--hero.is-on-light { color: var(--pws-c-navy); }
.pws-hero__content { display: grid; grid-template-columns: 1fr 1fr; gap: 40px var(--pws-gutter); align-items: end; }
.pws-hero__headline { margin: 0; color: #fff; }
.pws-hero__text {
	margin: 0; max-width: 34em; text-align: left;
	justify-self: end; /* rechte Kante bündig mit Menü und Footer-Menü, Text bleibt linksbündig */
	font-size: var(--pws-fs-herotext, 15px); line-height: var(--pws-lh-herotext, 2); font-weight: var(--pws-fw-herotext, 300);
}
@media (max-width: 1023px) { .pws-hero__content { grid-template-columns: 1fr; } .pws-hero__text { justify-self: start; } }
/* Videoscroll: eigene Schrift nur in diesem Modul (Felder „Schrift nur in diesem Modul“) */
.pws-videoscroll .pws-hero__headline { font-weight: var(--vs-hw, var(--pws-fw-h1)); }
.pws-videoscroll .pws-hero__text { font-size: var(--vs-ts, var(--pws-fs-herotext, 15px)); line-height: var(--vs-tlh, var(--pws-lh-herotext, 2)); font-weight: var(--vs-tw, var(--pws-fw-herotext, 300)); }
@media (max-width: 767px) { .pws-videoscroll .pws-hero__text { font-size: var(--vs-ts-m, var(--pws-fs-herotext, 15px)); } }

/* ==========================================================================
   Module & Bausteine
   ========================================================================== */
.pws-module { padding-block: var(--mod-pt, 120px) var(--mod-pb, 120px); overflow-x: clip; }
@media (max-width: 767px) { .pws-module { padding-block: calc(var(--mod-pt, 120px) * .6) calc(var(--mod-pb, 120px) * .6); } }
.pws-b + .pws-b { margin-top: 48px; }
/* Inhalt-Modul mit dunklem Hintergrund: helle Schrift (Feld „Schrift“, automatisch nach Hintergrundfarbe) */
.pws-on-dark { --pws-c-text: #fff; --pws-c-primary: #fff; color: #fff; }
.pws-on-dark .pws-check li::before { background: currentColor; }

.pws-slide-heading {
	margin: 0; white-space: nowrap; color: var(--pws-c-primary);
	font-size: var(--sl, var(--pws-fs-slide)); line-height: var(--pws-lh-slide); font-weight: var(--pws-fw-slide); letter-spacing: -.015em;
}
/* Eigene Größe pro Baustein (Felder im Baustein „Schiebe-Überschrift“), sonst Theme-Einstellung */
.pws-slide { --sl: var(--sl-d, var(--pws-fs-slide)); }
@media (max-width: 1500px) { .pws-slide { --sl: var(--sl-l, var(--sl-d, var(--pws-fs-slide))); } }
@media (max-width: 1023px) { .pws-slide { --sl: var(--sl-t, var(--pws-fs-slide)); } }
@media (max-width: 767px)  { .pws-slide { --sl: var(--sl-m, var(--pws-fs-slide)); } }
.pws-slide-heading__inner { display: inline-block; will-change: transform; }


.pws-cols { display: flex; flex-wrap: wrap; gap: var(--gap, 60px); align-items: flex-start; }
.pws-cols--center { align-items: center; }
.pws-cols--end { align-items: flex-end; }
.pws-col { --w: var(--w-d, 50); flex: 0 0 calc(var(--w) * 1% - var(--gap, 60px) * (1 - var(--w) / 100)); min-width: 0; }
@media (max-width: 1023px) { .pws-col { --w: var(--w-t, 100); } }
@media (max-width: 767px)  { .pws-col { --w: var(--w-m, 100); } .pws-cols--rev { flex-direction: column-reverse; } }

.pws-acc__item { border-bottom: 1px solid color-mix(in srgb, var(--pws-c-primary) 20%, transparent); }
.pws-acc__title { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 16px 0; cursor: pointer; list-style: none;
	font-size: var(--pws-fs-h4); line-height: var(--pws-lh-h4); font-weight: var(--pws-fw-h4); color: var(--pws-c-primary); }
.pws-acc__title::-webkit-details-marker { display: none; }
.pws-acc__icon { position: relative; flex: 0 0 14px; height: 14px; }
.pws-acc__icon::before, .pws-acc__icon::after { content: ""; position: absolute; left: 0; right: 0; top: 6px; height: 2px; background: currentColor; transition: transform .25s; }
.pws-acc__icon::after { transform: rotate(90deg); }
.pws-acc__item[open] .pws-acc__icon::after, .pws-acc__item.is-open .pws-acc__icon::after { transform: rotate(0); }
.pws-acc__item.is-closing .pws-acc__icon::after { transform: rotate(90deg); }
.pws-acc__body { padding: 0 0 20px; }
@media (min-width: 1024px) { .pws-acc__body { max-width: 85%; } }

.pws-check { list-style: none; margin: 0; padding: 0; }
.pws-check li { position: relative; padding: .375em 0 .375em 2em; font-size: var(--pws-fs-check, 16px); line-height: var(--pws-lh-check, 1.5); font-weight: var(--pws-fw-check, 400); }
.pws-check li::before {
	content: ""; position: absolute; left: 0; top: .5em; width: 1.15em; height: 1.15em; background: var(--pws-c-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M3 9.5l3.5 3.5L15 4.5' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M3 9.5l3.5 3.5L15 4.5' fill='none' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.pws-check--light { color: #fff; }
.pws-richtext .pws-check { margin: 0 0 1em; }

/* Buttons nebeneinander */
.pws-btns { display: flex; flex-wrap: wrap; align-items: center; gap: var(--gap, 16px); }
.pws-btns--center { justify-content: center; }
.pws-btns--end { justify-content: flex-end; }
@media (max-width: 767px) {
	.pws-btns--stack { flex-direction: column; align-items: stretch; }
	.pws-btns--stack.pws-btns--center { align-items: center; }
}
.pws-check--light li::before { background: #fff; }

.pws-acc__body .pws-check { margin: 0 0 1em; }

.pws-svg { max-width: var(--w-d, 100%); }
.pws-svg svg, .pws-svg img { width: 100%; height: auto; }
@media (max-width: 1023px) { .pws-svg { max-width: var(--w-t, var(--w-d, 100%)); } }
@media (max-width: 767px)  { .pws-svg { max-width: var(--w-m, var(--w-t, var(--w-d, 100%))); } }

.pws-spacer { height: var(--h-d); }
@media (max-width: 1023px) { .pws-spacer { height: var(--h-t); } }
@media (max-width: 767px)  { .pws-spacer { height: var(--h-m); } }
.pws-b + .pws-spacer, .pws-spacer + .pws-b { margin-top: 0; }

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

/* ==========================================================================
   FAQ (Baustein „FAQ“)
   ========================================================================== */
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.pws-faq__tools { display: grid; gap: 20px; margin-bottom: clamp(32px, 5vw, 64px); }
.pws-faq__search input {
	width: 100%; max-width: 560px; padding: 14px 18px; border: 1px solid color-mix(in srgb, var(--pws-c-primary) 30%, transparent); border-radius: 999px;
	background: transparent; color: var(--pws-c-text); font: inherit; font-size: var(--pws-fs-body); -webkit-appearance: none; appearance: none;
}
.pws-faq__search input:focus { outline: none; border-color: var(--pws-c-primary); }
.pws-faq__nav { display: flex; flex-wrap: wrap; gap: 8px; }
.pws-faq__nav a {
	padding: 7px 14px; border: 1px solid color-mix(in srgb, var(--pws-c-primary) 25%, transparent); border-radius: 999px; text-decoration: none;
	font-size: var(--pws-fs-small); line-height: 1.3; font-weight: var(--pws-fw-small); color: var(--pws-c-primary); transition: border-color .2s, background .2s, color .2s;
}
.pws-faq__nav a:hover { background: var(--pws-c-primary); border-color: var(--pws-c-primary); color: var(--pws-c-bg); }
.pws-faq__group + .pws-faq__group { margin-top: clamp(48px, 7vw, 96px); }
.pws-faq__heading { font-size: var(--pws-fs-h3); line-height: var(--pws-lh-h3); font-weight: var(--pws-fw-h3); margin-bottom: .5em; }
.pws-faq__group, .pws-faq .pws-acc__item { scroll-margin-top: 110px; }
.pws-faq__lead { font-weight: 600; }
.pws-faq__src { font-size: var(--pws-fs-small); line-height: var(--pws-lh-small); opacity: .8; }
.pws-faq__src a { color: inherit; }
.pws-faq__empty { margin: 24px 0 0; }
.pws-faq [hidden] { display: none !important; }
@media (max-width: 767px) {
	/* Mobil: Kategorien als wischbare Zeile statt 12 Zeilen Buttons */
	.pws-faq__nav { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--pws-gutter) * -1); padding-inline: var(--pws-gutter); scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.pws-faq__nav::-webkit-scrollbar { display: none; }
	.pws-faq__nav a { flex: 0 0 auto; white-space: nowrap; }
}

/* ==========================================================================
   Downloads & passwortgeschützte Downloads
   ========================================================================== */
.pws-dl { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--pws-c-primary); }
.pws-dl__item { border-bottom: 1px solid var(--pws-c-primary); }
.pws-dl__link {
	display: grid; grid-template-columns: 1fr auto 24px; align-items: center; gap: 16px clamp(24px, 6vw, 100px);
	padding: 22px 0; text-decoration: none; color: var(--pws-c-primary);
}
.pws-dl__title { min-width: 0; overflow-wrap: break-word; font-size: var(--pws-fs-h4); line-height: var(--pws-lh-h4); font-weight: var(--pws-fw-h4); }
.pws-dl__ext { font-size: var(--pws-fs-small); line-height: 1; font-weight: 400; opacity: .9; }
.pws-dl__icon { width: 24px; height: 26px; justify-self: end; fill: none; stroke: currentColor; stroke-width: 1.5; transition: transform .25s ease; overflow: visible; }
.pws-dl__link:hover { color: var(--pws-c-accent); }
.pws-dl__link:hover .pws-dl__icon { transform: translateY(4px); }
.pws-dl__link:focus-visible { outline-offset: 4px; }
@media (max-width: 767px) {
	.pws-dl__link { grid-template-columns: 1fr auto 18px; gap: 10px 12px; padding: 18px 0; }
	.pws-dl__icon { width: 18px; height: 20px; }
	body:not(.pws-no-hyphens) .pws-dl__title { hyphens: auto; }
}

/* Passwortfeld (Pille) mit Pfeil-Button */
.pws-dlp__field { position: relative; display: block; width: min(100%, 360px); }
.pws-dlp__field input {
	width: 100%; height: 56px; padding: 0 60px 0 24px; border: 1.5px solid var(--pws-c-primary); border-radius: 999px;
	background: transparent; color: var(--pws-c-text); font: inherit; font-size: var(--pws-fs-body); letter-spacing: .12em;
	-webkit-appearance: none; appearance: none;
}
.pws-dlp__field input::placeholder { color: color-mix(in srgb, var(--pws-c-primary) 40%, transparent); letter-spacing: 0; }
.pws-dlp__field input:focus { outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--pws-c-accent) 45%, transparent); }
.pws-dlp__field input[aria-invalid="true"] { border-color: #FF4D6A; }
.pws-dlp__go {
	position: absolute; right: 6px; top: 6px; width: 44px; height: 44px; border: 0; border-radius: 50%; padding: 0; cursor: pointer;
	display: grid; place-items: center; background: var(--pws-c-primary); color: var(--pws-c-bg); transition: background .2s;
}
.pws-dlp__go:hover, .pws-dlp__go:focus-visible { background: var(--pws-c-accent); color: var(--pws-c-on-accent, #0C0C0C); }
.pws-dlp__arrow { width: 18px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.pws-dlp__error { margin: 12px 0 0; color: #FF4D6A; font-size: var(--pws-fs-small); }

/* FAQ: Prüfvermerk, Direktlink, Einzelseite */
.pws-faq__permalink { font-size: var(--pws-fs-small); line-height: var(--pws-lh-small); }
.pws-faq__permalink a { color: inherit; }
.pws-faq-single .pws-container { max-width: 900px; }
.pws-faq-single__crumbs { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-bottom: clamp(24px, 4vw, 48px); font-size: var(--pws-fs-small); line-height: var(--pws-lh-small); }
.pws-faq-single__crumbs a { color: inherit; text-decoration: none; opacity: .75; }
.pws-faq-single__crumbs a:hover { opacity: 1; color: var(--pws-c-accent); }
.pws-faq-single__q { font-size: var(--pws-fs-h2); line-height: var(--pws-lh-h2); font-weight: var(--pws-fw-h2); margin: 0 0 .8em; }
.pws-faq-single__a .pws-faq__lead { font-size: calc(var(--pws-fs-body) * 1.15); }
.pws-faq-single__more { margin-top: clamp(48px, 7vw, 96px); }
.pws-faq-single__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid color-mix(in srgb, var(--pws-c-primary) 20%, transparent); }
.pws-faq-single__list li { border-bottom: 1px solid color-mix(in srgb, var(--pws-c-primary) 20%, transparent); }
.pws-faq-single__list a { display: block; padding: 14px 0; color: var(--pws-c-primary); text-decoration: none; font-size: var(--pws-fs-h4); line-height: var(--pws-lh-h4); font-weight: var(--pws-fw-h4); }
.pws-faq-single__list a:hover { color: var(--pws-c-accent); }
.pws-faq-single__back { margin-top: 40px; }

/* =========================================================
   Modul „FAQ“: Intro links (mitlaufend), Fragen rechts
   ========================================================= */
.pws-fq { color: var(--fq-fg); padding-block: var(--fq-pt, 100px) var(--fq-pb, 140px); }
.pws-fq__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: clamp(40px, 6vw, 120px); align-items: start; }
.pws-fq--plain .pws-fq__grid { grid-template-columns: minmax(0, 1fr); }
.pws-fq__intro { position: sticky; top: 120px; }
.pws-fq__head { margin: 0; color: var(--fq-fg); font-size: clamp(40px, 6vw, 96px); line-height: .95; font-weight: 600; letter-spacing: -.02em; }
.pws-fq__lead { margin: clamp(16px, 2vw, 28px) 0 0; font-size: clamp(17px, 1.4vw, 22px); line-height: 1.4; opacity: .85; max-width: 30ch; }
.pws-fq__btn {
	display: inline-flex; align-items: center; min-height: 44px; margin-top: clamp(24px, 3vw, 40px); padding: 0 1.5em; border: 2px solid var(--fq-c); border-radius: 999px;
	color: var(--fq-c); text-decoration: none; font-size: 16px; font-weight: 600; transition: background-color .2s;
}
.pws-fq__btn:hover { background: color-mix(in srgb, var(--fq-c) 16%, transparent); }
.pws-fq__btn:focus-visible { outline: 2px solid var(--fq-fg); outline-offset: 3px; }

.pws-fq__list { border-top: 1.5px solid color-mix(in srgb, var(--fq-fg) 14%, transparent); }
.pws-fq .pws-fq__item { --c: var(--fq-c); border-bottom: 1.5px solid color-mix(in srgb, var(--fq-fg) 14%, transparent); transition: border-color .3s; }
.pws-fq .pws-fq__item.is-open { border-bottom-color: var(--c); }
.pws-fq .pws-fq__q {
	display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: baseline; gap: clamp(14px, 1.6vw, 24px);
	padding: clamp(18px, 1.8vw, 28px) 0; color: var(--fq-fg); font-size: clamp(19px, 1.6vw, 26px); line-height: 1.25; font-weight: 600;
}
.pws-fq__nr { min-width: 2ch; color: var(--c); font-size: .6em; font-weight: 600; letter-spacing: .04em; font-variant-numeric: tabular-nums; transform: translateY(-.15em); }
.pws-fq__qt { transition: opacity .25s; }
.pws-fq .pws-fq__q:hover .pws-fq__qt { opacity: .75; }
.pws-fq .pws-fq__q:focus-visible { outline: 2px solid var(--fq-fg); outline-offset: 4px; border-radius: 4px; }
/* Plus → Minus im Kreis in der Akzentfarbe */
.pws-fq__icon { position: relative; align-self: center; flex: none; width: 1.5em; height: 1.5em; border: 1.5px solid var(--c); border-radius: 50%; transition: background-color .25s; }
.pws-fq__icon::before, .pws-fq__icon::after { content: ""; position: absolute; left: 50%; top: 50%; width: 42%; height: 2px; margin: -1px 0 0 -21%; border-radius: 1px; background: var(--c); transition: transform .3s, background-color .25s; }
.pws-fq__icon::after { transform: rotate(90deg); }
.pws-fq__item.is-open .pws-fq__icon { background: var(--c); }
.pws-fq__item.is-open .pws-fq__icon::before, .pws-fq__item.is-open .pws-fq__icon::after { background: var(--fq-bg); }
.pws-fq__item.is-open .pws-fq__icon::after { transform: rotate(0); }
.pws-fq__item.is-closing .pws-fq__icon { background: transparent; }
.pws-fq__item.is-closing .pws-fq__icon::before, .pws-fq__item.is-closing .pws-fq__icon::after { background: var(--c); }
.pws-fq__item.is-closing .pws-fq__icon::after { transform: rotate(90deg); }
.pws-fq .pws-fq__a { max-width: none; padding: 0 calc(1.5em + clamp(14px, 1.6vw, 24px)) clamp(22px, 2.2vw, 32px) calc(2ch * .6 + clamp(14px, 1.6vw, 24px) + .4em);
	font-size: clamp(15px, 1.15vw, 18px); line-height: 1.6; }
.pws-fq .pws-fq__a > * { margin: 0; }
.pws-fq .pws-fq__a > * + * { margin-top: .8em; }
.pws-fq__a p, .pws-fq__a li { opacity: .85; }
.pws-fq__a .pws-faq__lead { opacity: 1; font-weight: 600; }
.pws-fq__a ul { padding-left: 1.2em; }
.pws-fq__a li::marker { color: var(--c); }
.pws-fq__a a { color: var(--c); }
.pws-fq__a strong { font-weight: 600; opacity: 1; }
.pws-fq__item { scroll-margin-top: 110px; }

@media (max-width: 1023px) {
	.pws-fq__grid { grid-template-columns: minmax(0, 1fr); gap: clamp(32px, 5vw, 56px); }
	.pws-fq__intro { position: static; }
	.pws-fq__lead { max-width: 40ch; }
}
@media (max-width: 767px) {
	.pws-fq { padding-block: calc(var(--fq-pt, 100px) * .6) calc(var(--fq-pb, 140px) * .6); }
	.pws-fq .pws-fq__q { gap: 12px; }
	.pws-fq .pws-fq__a { padding-left: 0; padding-right: 0; }
}
@media (prefers-reduced-motion: reduce) { .pws-fq__item, .pws-fq__qt, .pws-fq__icon, .pws-fq__icon::before, .pws-fq__icon::after { transition: none; } }


/* ==========================================================================
   NX24 – Gestaltung
   Farben: Lime #D4F518 · Schwarz #0C0C0C · Weiß (Theme-Einstellungen → Farben)
   Dunkler Modus: html[data-theme="dark"] – Variablen kommen aus inc/css-vars.php
   Flächen: .pws-surface--soft | --accent | --inverse (inc/colors.php)
   ========================================================================== */
:root {
	--pws-radius: 22px; --pws-radius-s: 14px;
	--pws-hl: var(--pws-c-accent, #D4F518);            /* Markierung: Lime-Fläche … */
	--pws-on-hl: var(--pws-c-on-accent, #0C0C0C);      /* … mit dunkler Schrift darauf */
	--pws-line: color-mix(in srgb, var(--pws-c-primary) 16%, transparent);
	--pws-header-h: 72px;
}
/* Linienfarbe hängt von der Schriftfarbe ab: in jeder Fläche neu berechnen (Variablen erben sonst den Wert von :root) */
html[data-theme], .pws-surface, .pws-fq { --pws-line: color-mix(in srgb, var(--pws-c-primary) 16%, transparent); }
/* Auf Lime wird die Markierung schwarz mit Lime-Schrift */
.pws-surface--accent { --pws-hl: var(--pws-ink, #0C0C0C); --pws-on-hl: var(--pws-c-accent, #D4F518); }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { font-feature-settings: "ss01" 0; text-rendering: optimizeLegibility; }
::selection { background: var(--pws-c-accent); color: var(--pws-c-on-accent); }
:focus-visible { outline-color: var(--pws-c-primary); }
h1, h2, h3, h4, .pws-h1, .pws-h2, .pws-h3 { letter-spacing: -.025em; text-wrap: balance; }
.pws-richtext a { text-decoration-color: var(--pws-hl); text-decoration-thickness: 3px; text-underline-offset: .2em; }
.pws-richtext a:hover { background: var(--pws-hl); color: var(--pws-on-hl); text-decoration: none; }
.pws-richtext strong { font-weight: 700; }
.pws-richtext ul:not(.pws-check) { padding-left: 1.2em; }
.pws-richtext ul:not(.pws-check) li::marker { color: currentColor; }

/* Flächen ----------------------------------------------------------------- */
.pws-surface { color: var(--pws-c-text); }
.pws-surface--soft { background: var(--pws-c-soft); }
.pws-surface--accent { background: var(--pws-c-accent); }
.pws-surface--inverse, .pws-surface--darkfixed { background: var(--pws-c-bg); }
.pws-module.has-own-bg { background: var(--mod-bg-l); }
html[data-theme="dark"] .pws-module.has-own-bg { background: var(--mod-bg-d, var(--mod-bg-l)); }
.pws-module { position: relative; }

/* Grafische Formen aus dem Layout (Feld „Form im Hintergrund“) */
.has-deco { isolation: isolate; overflow: clip; }
.has-deco::before { content: ""; position: absolute; z-index: -1; pointer-events: none; background: var(--pws-hl); }
.pws-deco--arrow::before { top: 0; bottom: 0; right: 0; width: min(46%, 760px); clip-path: polygon(0 0, 62% 0, 100% 50%, 62% 100%, 0 100%, 38% 50%); }
.pws-deco--corner::before { top: 0; right: 0; width: min(36%, 620px); height: min(64%, 520px); border-bottom-left-radius: calc(var(--pws-radius) * 2); }
.pws-deco--corner-left::before { bottom: 0; left: 0; width: min(30%, 520px); height: 48%; border-top-right-radius: calc(var(--pws-radius) * 2); }
.pws-deco--band::before { left: 0; right: 0; bottom: 0; height: 34%; clip-path: polygon(0 55%, 100% 0, 100% 100%, 0 100%); }
@media (max-width: 1023px) {
	.pws-deco--arrow::before { width: 70%; height: 220px; top: auto; }
	.pws-deco--corner::before { width: 46%; height: 180px; }
	.pws-deco--corner-left::before { width: 46%; height: 160px; }
}
@media (max-width: 767px) {
	.pws-deco--arrow::before { width: 56%; height: 160px; }
	.pws-deco--corner::before { width: 34%; height: 90px; border-bottom-left-radius: var(--pws-radius); }
	.pws-deco--corner-left::before { width: 34%; height: 90px; border-top-right-radius: var(--pws-radius); }
}

/* Typo-Bausteine ---------------------------------------------------------- */
.pws-kicker {
	display: inline-flex; align-items: center; gap: .55em; margin: 0 0 1.4em; padding: .55em 1em .5em; border-radius: 999px;
	background: var(--pws-hl); color: var(--pws-on-hl);
	font-size: var(--pws-fs-kicker, 13px); line-height: var(--pws-lh-kicker, 1.3); font-weight: var(--pws-fw-kicker, 700);
	letter-spacing: .08em; text-transform: uppercase;
}
.pws-kicker::before { content: ""; width: .5em; height: .5em; border-radius: 50%; background: currentColor; }
.pws-b--text .pws-richtext { max-width: var(--max, none); }
.pws-b--text .pws-headline { max-width: calc(var(--max, 100em) * .9); }
.pws-b--text.pws-b--center { text-align: center; }
.pws-b--text.pws-b--center :is(.pws-richtext, .pws-headline) { margin-inline: auto; }
.pws-b--text.pws-b--end { text-align: right; }
.pws-b--text.pws-b--end :is(.pws-richtext, .pws-headline) { margin-left: auto; }
.pws-headline { margin-bottom: .5em; }
.pws-b--text.has-rule .pws-headline::after {
	content: ""; display: block; width: min(150px, 40%); height: 3px; margin-top: .42em; border-radius: 2px; background: currentColor;
}
.pws-b--text.pws-b--center.has-rule .pws-headline::after { margin-inline: auto; }
.pws-b--text.pws-b--end.has-rule .pws-headline::after { margin-left: auto; }
.pws-b--text.has-rule .pws-headline { margin-bottom: .75em; }
h1.pws-headline { font-size: var(--pws-fs-h1); line-height: var(--pws-lh-h1); font-weight: var(--pws-fw-h1); letter-spacing: -.035em; }
.has-lead .pws-richtext > p:first-child, .pws-lead {
	font-size: var(--pws-fs-lead); line-height: var(--pws-lh-lead); font-weight: var(--pws-fw-lead); letter-spacing: -.01em;
}
.pws-richtext p { text-wrap: pretty; }

/* Abstände zwischen Bausteinen */
.pws-b + .pws-b { margin-top: clamp(28px, 3.4vw, 48px); }
.pws-b--text + .pws-btns, .pws-b--text + .pws-b--button, .pws-check + .pws-btns, .pws-b:has(> .pws-check) + .pws-btns { margin-top: 32px; }

/* Spalten */
.pws-cols--stretch { align-items: stretch; }
.pws-col--panel { padding: clamp(26px, 3vw, 48px); border-radius: var(--pws-radius); }
.pws-col--panel > .pws-b:first-child { margin-top: 0; }
.pws-col--panel h3 { font-size: var(--pws-fs-h3); line-height: var(--pws-lh-h3); }
@media (min-width: 1024px) { .pws-col--sticky { position: sticky; top: calc(var(--pws-header-h) + 32px); } }
.pws-cols--stretch > .pws-col--panel { display: flex; flex-direction: column; justify-content: flex-end; }

/* Checkliste: Haken im Lime-Kreis */
.pws-check li { padding: .45em 0 .45em 2.3em; }
.pws-check li::before {
	top: .42em; width: 1.5em; height: 1.5em; border-radius: 50%; background: var(--pws-hl); -webkit-mask: none; mask: none;
}
.pws-check li::after {
	content: ""; position: absolute; left: .32em; top: .74em; width: .86em; height: .86em; background: var(--pws-on-hl);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M3 9.5l3.5 3.5L15 4.5' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M3 9.5l3.5 3.5L15 4.5' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.pws-check--light li::before, .pws-on-dark .pws-check li::before { background: var(--pws-hl); }
.pws-check--light { color: inherit; }

/* Kacheln ----------------------------------------------------------------- */
.pws-cards { display: grid; grid-template-columns: repeat(var(--cols, 3), minmax(0, 1fr)); gap: clamp(14px, 1.6vw, 24px); }
@media (max-width: 1023px) { .pws-cards:not([style*="--cols:1"]) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px)  { .pws-cards, .pws-cards:not([style*="--cols:1"]) { grid-template-columns: minmax(0, 1fr); } }
.pws-card {
	position: relative; display: flex; flex-direction: column; gap: 14px; min-width: 0;
	padding: clamp(24px, 2.4vw, 36px); border-radius: var(--pws-radius); color: var(--pws-c-text); text-decoration: none;
	transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s, background-color .3s;
}
.pws-card--outline { box-shadow: inset 0 0 0 1.5px var(--pws-line); }
.pws-card--raised { background: var(--pws-c-bg); box-shadow: 0 1px 2px rgb(0 0 0 / .05), 0 18px 40px -18px rgb(0 0 0 / .22); }
html[data-theme="dark"] .pws-card--raised { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--pws-c-text) 14%, transparent); }
html[data-theme="dark"] .pws-surface--accent .pws-card--raised, .pws-surface--accent .pws-card--raised { box-shadow: 0 18px 40px -20px rgb(0 0 0 / .3); }
a.pws-card:hover { transform: translateY(-4px); }
a.pws-card:hover .pws-card__more svg { transform: translateX(4px); }
.pws-card__icon {
	display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; margin-bottom: 6px;
	background: var(--pws-hl); color: var(--pws-on-hl);
}
.pws-card__icon .pws-icon { width: 26px; height: 26px; }
.pws-card__nr { font-size: 14px; font-weight: 700; letter-spacing: .06em; font-variant-numeric: tabular-nums; padding-bottom: 4px; border-bottom: 3px solid var(--pws-hl); align-self: flex-start; }
.pws-card__title { margin: 0; color: var(--pws-c-primary); font-size: var(--pws-fs-h3); line-height: var(--pws-lh-h3); font-weight: var(--pws-fw-h3); }
.pws-card__text { opacity: .82; }
.pws-surface--accent.pws-card .pws-card__text, .pws-surface--accent .pws-card__text { opacity: .9; }
.pws-card__more { display: inline-flex; align-items: center; gap: .6em; margin-top: auto; padding-top: 8px; font-weight: 700; font-size: 15px; }
.pws-card__more svg { width: 18px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; transition: transform .25s; }
/* Größen */
.pws-cards--l .pws-card__title { font-size: clamp(28px, 2.8vw, 42px); line-height: 1.05; font-weight: 500; letter-spacing: -.03em; }
.pws-cards--l .pws-card { padding: clamp(28px, 3vw, 44px); min-height: clamp(220px, 22vw, 300px); }
.pws-cards--l .pws-card__text { margin-top: auto; }
.pws-cards--s .pws-card { padding: clamp(20px, 2vw, 28px); gap: 10px; }
.pws-cards--s .pws-card__title { font-size: var(--pws-fs-h4); line-height: var(--pws-lh-h4); }
.pws-cards--s .pws-card__icon { width: 44px; height: 44px; }
.pws-cards--s .pws-card__icon .pws-icon { width: 22px; height: 22px; }

/* Kennzahlen -------------------------------------------------------------- */
.pws-stats { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: clamp(20px, 3vw, 48px); }
@media (max-width: 1023px) { .pws-stats:not([style*="--cols:1"]) { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 359px)  { .pws-stats, .pws-stats:not([style*="--cols:1"]) { grid-template-columns: minmax(0, 1fr); } }
.pws-stat > p { margin: 0; }
.pws-stats--plain .pws-stat { padding-top: 18px; border-top: 2px solid var(--pws-c-primary); }
.pws-stats--boxed .pws-stat { padding: clamp(22px, 2.4vw, 34px); border-radius: var(--pws-radius); }
.pws-stat__top { font-size: var(--pws-fs-small); line-height: 1.4; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; opacity: .75; }
.pws-stat__value {
	margin-top: .18em !important; color: var(--pws-c-primary); font-size: var(--pws-fs-stat); line-height: var(--pws-lh-stat); font-weight: var(--pws-fw-stat);
	letter-spacing: -.04em; font-variant-numeric: tabular-nums; white-space: nowrap;
}
.pws-stat__label { margin-top: .7em !important; font-size: 15px; line-height: 1.45; opacity: .8; }

/* Preise ------------------------------------------------------------------ */
.pws-prices__list { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.pws-price {
	display: grid; grid-template-columns: minmax(150px, .85fr) minmax(0, 2fr); align-items: center; gap: 12px clamp(20px, 3vw, 40px);
	padding: clamp(20px, 2.2vw, 30px) clamp(22px, 2.6vw, 36px); border-radius: var(--pws-radius); color: var(--pws-c-text);
}
.pws-price__amount { margin: 0; display: flex; flex-direction: column; }
.pws-price__amount + .pws-price__amount { margin-top: 10px; }
.pws-price__amount strong { color: var(--pws-c-primary); font-size: clamp(26px, 2.6vw, 38px); line-height: 1; font-weight: 700; letter-spacing: -.03em; white-space: nowrap; }
.pws-price__amount span { margin-top: 4px; font-size: 13px; line-height: 1.3; font-weight: 600; opacity: .7; }
.pws-price__title { margin: 0 0 .25em; font-size: var(--pws-fs-h4); line-height: var(--pws-lh-h4); font-weight: 700; }
.pws-price__text { margin: 0; font-size: 15px; line-height: 1.5; opacity: .8; }
.pws-price__body { padding-left: clamp(20px, 3vw, 40px); border-left: 2px solid var(--pws-hl); }
.pws-card--raised.pws-price .pws-price__body { border-left-color: var(--pws-c-accent); }
.pws-prices__note { margin: 16px 0 0; font-size: var(--pws-fs-small); line-height: var(--pws-lh-small); opacity: .8; }
@media (max-width: 559px) {
	.pws-price { grid-template-columns: minmax(0, 1fr); }
	.pws-price__body { padding-left: 0; padding-top: 14px; border-left: 0; border-top: 2px solid var(--pws-hl); }
}

/* Bild -------------------------------------------------------------------- */
.pws-img { margin: 0; max-width: var(--max, 100%); }
.pws-img[style*="--max"] { margin-inline: auto; }
.pws-img__frame { position: relative; z-index: 1; overflow: hidden; border-radius: var(--pws-radius); aspect-ratio: var(--ratio, auto); }
.pws-img__frame img { width: 100%; height: auto; }
.pws-img[style*="--ratio"] .pws-img__frame img { height: 100%; object-fit: cover; }
.pws-img--contain .pws-img__frame img { object-fit: contain !important; }
.pws-img--none .pws-img__frame { border-radius: 0; }
.pws-img--offset { position: relative; padding: 0 clamp(14px, 2vw, 26px) clamp(14px, 2vw, 26px) 0; }
.pws-img--offset::before { content: ""; position: absolute; inset: clamp(14px, 2vw, 26px) 0 0 clamp(14px, 2vw, 26px); border-radius: var(--pws-radius); background: var(--pws-hl); }
.pws-img--float .pws-img__frame { overflow: visible; border-radius: 0; }
.pws-img--float img { filter: drop-shadow(0 40px 40px rgb(0 0 0 / .28)); }
html[data-theme="dark"] .pws-img--float img { filter: drop-shadow(0 30px 50px rgb(0 0 0 / .7)); }
.pws-img__cap { margin-top: 10px; font-size: var(--pws-fs-small); line-height: var(--pws-lh-small); opacity: .75; }

/* Logo-Leiste ------------------------------------------------------------- */
.pws-logos__title { display: block; margin: 0 0 14px; padding: 0; background: none; color: inherit; opacity: .7; }
.pws-logos__title::before { display: none; }
.pws-logos__list { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; padding: 0; list-style: none; }
.pws-logos__item { display: flex; }
.pws-logos__item a { display: flex; }
.pws-logos--chips .pws-logos__item {
	align-items: center; justify-content: center; padding: 14px 22px; min-height: calc(var(--logo-h) + 28px);
	border-radius: var(--pws-radius-s); background: #fff; box-shadow: inset 0 0 0 1px rgb(0 0 0 / .08);
}
.pws-logos__item img, .pws-logos__item svg { height: var(--logo-h); width: auto; max-width: min(200px, 60vw); object-fit: contain; }

/* Header ------------------------------------------------------------------ */
.pws-header { height: var(--pws-header-h); color: var(--pws-c-primary); }
body:not(.has-pws-hero) #pws-main { padding-top: var(--pws-header-h); }
.pws-header.is-visible:not(.is-top) { box-shadow: 0 1px 0 var(--pws-line); }
.pws-header__inner { gap: clamp(16px, 3vw, 40px); }
.pws-header__nav { margin-left: auto; }
.pws-header__tools { display: flex; align-items: center; gap: 8px; }
.pws-logo { color: var(--pws-c-primary); }
.pws-logo.is-tinted svg :is(path, polygon, rect, circle, ellipse, polyline, line) { fill: currentColor; }
html[data-theme="dark"] .pws-logo.has-light:not(.is-tinted) .pws-logo__img--dark { opacity: 0; }
html[data-theme="dark"] .pws-logo.has-light:not(.is-tinted) .pws-logo__img--light { opacity: 1; }
.pws-menu { gap: clamp(18px, 2.2vw, 36px); align-items: center; }
.pws-menu a { position: relative; }
.pws-menu a:hover { color: inherit; }
.pws-menu li:not(.is-button) > a::before {
	content: ""; position: absolute; left: 0; right: 0; bottom: -7px; height: 3px; border-radius: 2px; background: var(--pws-c-accent);
	transform: scaleX(0); transform-origin: left; transition: transform .3s cubic-bezier(.2, .7, .2, 1);
}
.pws-menu li:not(.is-button) > a:hover::before, .pws-menu li:not(.is-button) > a.is-active::before { transform: scaleX(1); }
.pws-menu .is-button > a, .pws-mobile-nav__main .is-button > a {
	padding: .75em 1.35em; margin-block: -.75em; border: 0; border-radius: 999px; background: var(--pws-c-primary); color: var(--pws-c-bg);
	transition: background-color .2s, color .2s;
}
.pws-menu .is-button > a:hover, .pws-mobile-nav__main .is-button > a:hover { background: var(--pws-c-accent); color: var(--pws-c-on-accent); }
.pws-menu .is-button > a.is-active { font-weight: inherit; }

/* Schalter hell/dunkel */
.pws-theme-toggle {
	display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; cursor: pointer;
	background: transparent; color: inherit; box-shadow: inset 0 0 0 1.5px var(--pws-line); transition: background-color .2s, color .2s, box-shadow .2s;
}
.pws-theme-toggle:hover { background: var(--pws-c-accent); color: var(--pws-c-on-accent); box-shadow: none; }
.pws-theme-toggle svg { grid-area: 1 / 1; width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; transition: opacity .25s, transform .35s; }
.pws-theme-toggle__moon { fill: currentColor; stroke: none; }
.pws-theme-toggle__sun { opacity: 0; transform: rotate(-60deg) scale(.6); }
html[data-theme="dark"] .pws-theme-toggle__sun { opacity: 1; transform: none; }
html[data-theme="dark"] .pws-theme-toggle__moon { opacity: 0; transform: rotate(60deg) scale(.6); }
.pws-hero .pws-theme-toggle { color: #fff; }

/* Mobiles Menü */
.pws-mobile-nav { padding-top: calc(var(--pws-header-h) + 32px); }
.pws-mobile-nav__main a { font-size: 30px; font-weight: 700; letter-spacing: -.02em; }
.pws-mobile-nav__main .is-button { margin-top: 20px; }
.pws-mobile-nav__main .is-button > a { display: inline-block; margin: 0; font-size: 18px; }

/* Footer ------------------------------------------------------------------ */
.pws-footer { padding: clamp(56px, 7vw, 96px) 0 28px; }
.pws-footer__top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) minmax(0, 1fr); gap: 32px clamp(24px, 4vw, 64px); align-items: start; padding-bottom: clamp(40px, 5vw, 64px); }
.pws-footer__logo { width: clamp(110px, 12vw, 150px); }
.pws-footer__text, .pws-footer__contact { margin: 0; font-size: 15px; line-height: 1.6; }
.pws-footer__text { opacity: .85; }
.pws-footer__contact a { text-decoration: none; }
.pws-footer__contact a:hover { text-decoration: underline; text-decoration-color: var(--pws-c-accent); text-decoration-thickness: 2px; }
.pws-footer__bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px; padding-top: 22px; border-top: 1px solid var(--pws-line); }
.pws-footer__copy { margin: 0; font-size: var(--pws-fs-small); line-height: var(--pws-lh-small); opacity: .7; }
.pws-footer .pws-footmenu, .pws-footbar .pws-footmenu { display: flex; flex-wrap: wrap; gap: 8px 28px; justify-content: flex-end; }
.pws-footbar .pws-footmenu { justify-content: space-between; }
.pws-footer .pws-footmenu a:hover { opacity: 1; text-decoration: underline; text-decoration-color: var(--pws-c-accent); text-decoration-thickness: 2px; text-underline-offset: .3em; }
@media (max-width: 1023px) { .pws-footer__top { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .pws-footer__brand { grid-column: 1 / -1; } }
@media (max-width: 767px) { .pws-footer__top { grid-template-columns: minmax(0, 1fr); } .pws-footer .pws-footmenu { justify-content: flex-start; } }

/* FAQ-Modul --------------------------------------------------------------- */
.pws-fq { --fq-fg: var(--fq-fg-l, var(--pws-c-text)); --fq-bg: var(--fq-bg-l, var(--pws-c-bg)); --fq-c: var(--pws-c-primary); }
html[data-theme="dark"] .pws-fq { --fq-fg: var(--fq-fg-d, var(--fq-fg-l, var(--pws-c-text))); --fq-bg: var(--fq-bg-d, var(--fq-bg-l, var(--pws-c-bg))); }
.pws-fq.has-own-bg { background: var(--fq-bg); }
.pws-fq__intro { top: calc(var(--pws-header-h) + 40px); }
.pws-fq__head { font-size: var(--pws-fs-h2); line-height: var(--pws-lh-h2); font-weight: var(--pws-fw-h2); letter-spacing: -.025em; }
.pws-fq__head::after { content: ""; display: block; width: min(150px, 40%); height: 3px; margin-top: .42em; border-radius: 2px; background: currentColor; }
.pws-fq__lead { font-size: var(--pws-fs-lead); line-height: var(--pws-lh-lead); font-weight: var(--pws-fw-lead); }
.pws-fq__cta { margin-top: clamp(24px, 3vw, 40px); }
.pws-fq .pws-fq__q { font-size: clamp(18px, 1.5vw, 23px); font-weight: 700; letter-spacing: -.015em; }
.pws-fq__item.is-open .pws-fq__icon { background: var(--pws-hl); border-color: var(--pws-hl); }
.pws-fq__item.is-open .pws-fq__icon::before, .pws-fq__item.is-open .pws-fq__icon::after { background: var(--pws-on-hl); }
.pws-fq .pws-fq__item.is-open { border-bottom-color: var(--fq-c); }
.pws-fq__a .pws-faq__lead { font-weight: 700; }

/* Erscheinen beim Scrollen (main.js setzt .is-in) -------------------------- */
.pws-js [data-pws-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .8s ease, transform .9s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--i, 0) * 70ms); }
.pws-js [data-pws-reveal].is-in { opacity: 1; transform: none; }
.pws-js a.pws-card[data-pws-reveal].is-in:hover { transform: translateY(-4px); transition-delay: 0s; }
@media (prefers-reduced-motion: reduce) { .pws-js [data-pws-reveal] { opacity: 1; transform: none; transition: none; } }

/* Druck */
@media print {
	.pws-header, .pws-footbar, .pws-theme-toggle, .pws-burger { display: none !important; }
	.pws-js [data-pws-reveal] { opacity: 1; transform: none; }
}
html.pws-theme-switching *, html.pws-theme-switching *::before, html.pws-theme-switching *::after { transition: none !important; }

/* ==========================================================================
   Modul „Einrichtung“ – Scroll-Grafik in vier Phasen (inc/setup-module.php, main.js → initSetup)
   Ohne Skript / „weniger Bewegung“: fertige Grafik, alle Schritte sichtbar, kein Anhalten.
   ========================================================================== */
.pws-st { position: relative; padding-block: var(--st-pt, 40px) var(--st-pb, 40px); --lan: 1; --dongle: 1; --hs: 1; }
.pws-st.is-ready { height: calc(100vh + var(--st-pin, 360vh)); height: calc(100svh + var(--st-pin, 360vh)); padding-block: 0; --lan: 0; --dongle: 0; --hs: 0; }
.pws-st.is-ready .pws-st__sticky { position: sticky; top: 0; height: 100vh; height: 100svh; display: flex; align-items: center; overflow: hidden; }
.pws-st__grid { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: clamp(32px, 5vw, 90px); align-items: center; }
.pws-st__head { margin-bottom: clamp(24px, 3vw, 40px); }

.pws-st__steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pws-st__step { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-top: 1px solid var(--pws-line); cursor: default; }
.pws-st.is-ready .pws-st__step { cursor: pointer; opacity: .42; transition: opacity .4s; }
.pws-st.is-ready .pws-st__step.is-active, .pws-st.is-ready .pws-st__step:hover { opacity: 1; }
.pws-st__nr {
	display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums;
	box-shadow: inset 0 0 0 1.5px var(--pws-line); transition: background-color .35s, color .35s, box-shadow .35s;
}
.pws-st__step.is-active .pws-st__nr, .pws-st__step.is-done .pws-st__nr { background: var(--pws-hl); color: var(--pws-on-hl); box-shadow: none; }
.pws-st__title { margin: 8px 0 0; color: var(--pws-c-primary); font-size: var(--pws-fs-h4); line-height: var(--pws-lh-h4); font-weight: 700; }
.pws-st__desc { margin: .45em 0 0; font-size: 16px; line-height: 1.55; opacity: .85; }
/* Text nur beim aktiven Schritt aufgeklappt */
.pws-st.is-ready .pws-st__desc { display: grid; max-height: 0; overflow: hidden; margin-top: 0; opacity: 0; transition: max-height .5s cubic-bezier(.2, .7, .2, 1), opacity .4s, margin-top .4s; }
.pws-st.is-ready .pws-st__step.is-active .pws-st__desc { max-height: 8em; opacity: .85; margin-top: .45em; }
.pws-st__progress { display: none; }
.pws-st.is-ready .pws-st__progress { display: block; height: 3px; margin-top: 18px; border-radius: 2px; background: var(--pws-line); overflow: hidden; }
.pws-st__progress span { display: block; height: 100%; width: calc(var(--st-p, 0) * 100%); background: var(--pws-c-accent); }

/* Bühne */
.pws-st__stage { position: relative; aspect-ratio: 16 / 10; display: grid; align-items: center; }
.pws-st__graphic { width: 100%; }
.pws-st__svg { display: block; width: 100%; height: auto; overflow: hidden; }
.pws-st__svg text { font-family: var(--pws-font); }
.pws-st__brand { fill: #8c8c8c; font-size: 13px; font-weight: 600; letter-spacing: .06em; }
.pws-st__side { fill: currentColor; opacity: .5; font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.pws-st__cable { fill: none; stroke: #d6d6d6; stroke-width: 9; stroke-linecap: round; }
.pws-st__energy { fill: none; stroke: var(--pws-c-accent); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 10 26; opacity: 0; transition: opacity .4s; }
.pws-st__lan { transform: translateX(calc((1 - var(--lan)) * -420px)); }
.pws-st__dongle { transform: translateX(calc((1 - var(--dongle)) * 230px)); }
.pws-st__dongle-led { fill: #555; transition: fill .3s; }
.pws-st__headset { opacity: var(--hs); transform: translateY(calc((1 - var(--hs)) * 24px)); transform-box: fill-box; }
.pws-st__hs-band, .pws-st__hs-mic { fill: none; stroke: currentColor; stroke-width: 7; stroke-linecap: round; }
.pws-st__hs-mic { stroke-width: 4; }
.pws-st__hs-cup { fill: var(--pws-c-bg); stroke: currentColor; stroke-width: 4; }
.pws-st__hs-micend { fill: currentColor; }
.pws-st__waves path { fill: none; stroke: var(--pws-c-accent); stroke-width: 3.5; stroke-linecap: round; opacity: 0; }
.pws-st__led { fill: #3a3a3a; transition: fill .3s; }
.pws-st__ledglow { opacity: 0; transition: opacity .4s; }
/* Zustände (ohne Skript = fertig) */
.pws-st:not(.is-ready) .pws-st__energy, .pws-st.is-power .pws-st__energy { opacity: 1; animation: pws-st-flow 1.1s linear infinite; }
.pws-st:not(.is-ready) .pws-st__led, .pws-st.is-power .pws-st__led { fill: var(--pws-c-accent); }
.pws-st:not(.is-ready) .pws-st__ledglow, .pws-st.is-power .pws-st__ledglow { opacity: 1; animation: pws-st-pulse 1.8s ease-in-out infinite; }
.pws-st:not(.is-ready) .pws-st__dongle-led, .pws-st.is-paired .pws-st__dongle-led { fill: var(--pws-c-accent); }
.pws-st:not(.is-ready) .pws-st__waves path { opacity: .9; }
.pws-st.is-paired .pws-st__waves path { animation: pws-st-wave 1.6s ease-out infinite; }
.pws-st.is-paired .pws-st__waves path:nth-child(2) { animation-delay: .2s; }
.pws-st.is-paired .pws-st__waves path:nth-child(3) { animation-delay: .4s; }
@keyframes pws-st-flow { to { stroke-dashoffset: -36; } }
@keyframes pws-st-pulse { 50% { opacity: .45; } }
@keyframes pws-st-wave { 0% { opacity: 0; } 30% { opacity: 1; } 100% { opacity: 0; } }

/* Phase 4: Video */
.pws-st__media { border-radius: var(--pws-radius); overflow: hidden; background: #000; }
.pws-st__media video, .pws-st__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.pws-st:not(.is-ready) .pws-st__media { margin-top: 24px; aspect-ratio: 16 / 9; }
.pws-st.is-ready .pws-st__media { position: absolute; inset: 0; opacity: 0; transform: scale(.92); transition: opacity .6s ease, transform .8s cubic-bezier(.2, .7, .2, 1); pointer-events: none; }
.pws-st.is-ready .pws-st__graphic { transition: opacity .6s, transform .8s cubic-bezier(.2, .7, .2, 1); }
.pws-st.is-live .pws-st__media { opacity: 1; transform: none; }
.pws-st.is-live .pws-st__graphic { opacity: 0; transform: scale(.94); }
.pws-st__badge {
	position: absolute; left: 18px; bottom: 18px; display: inline-flex; align-items: center; gap: .6em; margin: 0; padding: .6em 1.1em; border-radius: 999px;
	background: var(--pws-c-accent); color: var(--pws-c-on-accent); font-size: 14px; font-weight: 700;
}
.pws-st__badge span { width: .6em; height: .6em; border-radius: 50%; background: currentColor; animation: pws-st-pulse 1.4s ease-in-out infinite; }

@media (max-width: 1023px) {
	.pws-st__grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.pws-st.is-ready .pws-st__stage { order: -1; width: min(100%, 640px); justify-self: center; }
	.pws-st__head { font-size: calc(var(--pws-fs-h2) * .8); margin-bottom: 14px; }
	.pws-st.is-ready .pws-st__text .pws-kicker { display: none; }
	.pws-st.is-ready .pws-st__step:not(.is-active) { display: none; }
	.pws-st.is-ready .pws-st__step { opacity: 1; border-top: 0; padding-top: 4px; }
	.pws-st.is-ready .pws-st__steps { min-height: 9.5em; align-content: start; }
	.pws-st.is-ready .pws-st__stage { aspect-ratio: 16 / 9; }
}
@media (prefers-reduced-motion: reduce) {
	.pws-st__energy, .pws-st__ledglow, .pws-st__waves path, .pws-st__badge span { animation: none !important; }
}