/* ==========================================================================
   Vital Flow – Designsystem
   Schriften lokal (SIL OFL), keine externen Anfragen. Farben aus dem Logo.
   Alle Bewegungen entfallen bei „Bewegung reduzieren“; ohne JavaScript ist
   alles sichtbar und bedienbar.
   ========================================================================== */

@font-face { font-family: "Outfit"; src: url("../fonts/Outfit-Bold.woff") format("woff"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Regular.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Bold.woff") format("woff"); font-weight: 700; font-style: normal; font-display: swap; }

@property --vf-angle {
	syntax: "<angle>";
	inherits: false;
	initial-value: 0deg;
}

:root {
	/* Logo-Palette */
	--v50: #f2f7fb;
	--v100: #e1eef7;
	--v200: #bfd9ed;
	--v300: #93bfdf;
	--v400: #588db5;
	--v500: #3b6e94;
	--v600: #265378;
	--v700: #193d5c;
	--v800: #0f2942;
	--v900: #091b2e;
	--sky: #6cb4e0;
	/* Neutrale Töne */
	--paper: #f6f9fc;
	--line: #e2e9f1;
	--text: #1d2a3a;
	--muted: #526173;
	--white: #fff;
	--warn: #f59e0b;
	--error: #b42318;
	--ok: #2f7d55;

	--grad: linear-gradient(120deg, var(--v700) 0%, var(--v600) 35%, var(--v500) 65%, var(--sky) 100%);
	--grad-text: linear-gradient(100deg, var(--v600), var(--v400) 45%, var(--sky) 75%, var(--v500));

	--font-body: "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--font-head: "Outfit", "Instrument Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
	--fs-hero: clamp(2.1rem, 0.9rem + 4.4vw, 5.4rem);
	--fs-h1: clamp(2.1rem, 1.2rem + 3.4vw, 4.6rem);
	--fs-h2: clamp(2rem, 1.25rem + 2.9vw, 3.75rem);
	--fs-h3: clamp(1.2rem, 1.05rem + 0.6vw, 1.5rem);

	--gutter: clamp(1rem, 4vw, 2rem);
	--hh: 4.25rem;
	--radius: 1.6rem;
	--ease: cubic-bezier(0.16, 1, 0.3, 1);
	--ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--shadow-sm: 0 1px 2px rgba(15, 41, 66, 0.06), 0 2px 6px rgba(15, 41, 66, 0.05);
	--shadow-md: 0 10px 30px rgba(15, 41, 66, 0.09);
	--shadow-lg: 0 24px 60px rgba(15, 41, 66, 0.14);
	--glass: rgba(255, 255, 255, 0.72);
}

*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--hh) + 2rem);
}
body {
	margin: 0;
	font-family: var(--font-body);
	font-size: clamp(1rem, 0.96rem + 0.2vw, 1.075rem);
	line-height: 1.65;
	color: var(--text);
	background: var(--paper);
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
	overflow-wrap: break-word;
	text-rendering: optimizeLegibility;
}
::selection { background: var(--v600); color: #fff; }
img, svg { max-width: 100%; height: auto; }
a { color: var(--v600); text-underline-offset: 0.2em; text-decoration-thickness: 0.08em; }
a:hover { color: var(--v800); }
h1, h2, h3, h4 {
	margin: 0 0 0.6em;
	font-family: var(--font-head);
	font-weight: 700;
	line-height: 1.08;
	letter-spacing: -0.025em;
	color: var(--v900);
	text-wrap: balance;
	-webkit-hyphens: auto;
	hyphens: auto;
}
p, ul, ol { margin: 0 0 1.1em; }
:focus-visible { outline: 3px solid var(--v500); outline-offset: 3px; border-radius: 6px; }
.vf-section--dark :focus-visible,
.vf-footer :focus-visible,
.vf-menu :focus-visible,
.vf-cta :focus-visible,
.vf-phero--dark :focus-visible { outline-color: #fff; }

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
.skip-link {
	position: fixed;
	left: 1rem;
	top: -5rem;
	z-index: 1100;
	padding: 0.75rem 1.1rem;
	background: var(--v900);
	color: #fff;
	font-weight: 700;
	text-decoration: none;
	border-radius: 0.8rem;
}
.skip-link:focus { top: 1rem; color: #fff; }

.vf-wrap { width: min(100% - 2 * var(--gutter), 82rem); margin-inline: auto; }
.vf-center { text-align: center; }
.vf-main { position: relative; display: block; }

/* --------------------------------------------------------------------------
   Symbole, Buttons, Schlagworte
   -------------------------------------------------------------------------- */
.vf-icon {
	width: 1.25em;
	height: 1.25em;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
	flex: none;
	vertical-align: middle;
}

.vf-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; margin-top: 2rem; }
.vf-actions--center { justify-content: center; }
.vf-actions--small { margin-top: 1rem; gap: 0.5rem; }

.vf-btn {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	gap: 0.85rem;
	min-height: 3.4rem;
	padding: 0.4rem 0.45rem 0.4rem 1.4rem;
	font: inherit;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	border: 1px solid transparent;
	border-radius: 999px;
	cursor: pointer;
	transition: transform 0.35s var(--ease), box-shadow 0.35s, background-color 0.3s, color 0.3s, border-color 0.3s, translate 0.5s var(--ease);
}
.vf-btn__icon {
	display: grid;
	place-items: center;
	width: 2.6rem;
	height: 2.6rem;
	border-radius: 50%;
	transition: transform 0.45s var(--ease), background-color 0.3s;
}
.vf-btn__icon .vf-icon { width: 1.15rem; height: 1.15rem; }
.vf-btn::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: var(--grad);
	opacity: 0;
	transition: opacity 0.4s;
}
.vf-btn:hover { transform: translateY(-2px); }
.vf-btn:hover .vf-btn__icon--arrow { transform: rotate(-45deg); }
.vf-btn:hover .vf-btn__icon--arrow-up-right { transform: rotate(45deg); }
.vf-btn:hover .vf-btn__icon--phone .vf-icon { animation: vf-wiggle 0.7s ease; }
.vf-btn:hover .vf-btn__icon--download .vf-icon { animation: vf-bounce 0.7s var(--ease); }
.vf-btn:active { transform: translateY(0) scale(0.98); }

.vf-btn--primary { background: var(--v800); color: #fff; box-shadow: 0 12px 30px rgba(15, 41, 66, 0.25); }
.vf-btn--primary .vf-btn__icon { background: rgba(255, 255, 255, 0.14); }
.vf-btn--primary:hover { color: #fff; box-shadow: 0 18px 40px rgba(38, 83, 120, 0.35); }
.vf-btn--primary:hover::before { opacity: 1; }

.vf-btn--ghost { background: rgba(255, 255, 255, 0.7); color: var(--v900); border-color: var(--line); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.vf-btn--ghost .vf-btn__icon { background: var(--v50); color: var(--v600); }
.vf-btn--ghost:hover { color: var(--v900); border-color: var(--v200); box-shadow: var(--shadow-md); }
.vf-btn--ghost:hover .vf-btn__icon { background: var(--v600); color: #fff; }

.vf-btn--light { background: #fff; color: var(--v900); box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18); }
.vf-btn--light .vf-btn__icon { background: var(--v800); color: #fff; }
.vf-btn--light:hover { color: var(--v900); }

.vf-btn--outline-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, 0.35); }
.vf-btn--outline-light .vf-btn__icon { background: rgba(255, 255, 255, 0.12); }
.vf-btn--outline-light:hover { color: #fff; border-color: #fff; background: rgba(255, 255, 255, 0.08); }

.vf-actions--small .vf-btn { min-height: 2.9rem; padding-left: 1.1rem; font-size: 0.9rem; }
.vf-actions--small .vf-btn__icon { width: 2.1rem; height: 2.1rem; }

.vf-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.7rem;
	margin: 0 0 1rem;
	color: var(--v500);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.vf-eyebrow::before {
	content: "";
	width: 2rem;
	height: 2px;
	border-radius: 2px;
	background: var(--grad);
	transform-origin: 0 50%;
	transition: transform 0.9s 0.2s var(--ease);
}
.vf-tag {
	display: inline-flex;
	align-items: center;
	padding: 0.28rem 0.7rem;
	color: var(--v700);
	background: var(--v100);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border-radius: 999px;
}
.vf-tag--light { color: #fff; background: rgba(255, 255, 255, 0.14); }
.vf-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	margin: 0 0 1.6rem;
	padding: 0.45rem 1rem 0.45rem 0.8rem;
	color: var(--v700);
	background: rgba(255, 255, 255, 0.7);
	border: 1px solid var(--v200);
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 700;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
.vf-pill__dot { width: 0.55rem; height: 0.55rem; border-radius: 50%; background: var(--v500); animation: vf-pulse 2.6s ease-in-out infinite; }
.vf-note { color: var(--muted); font-size: 0.88rem; }
.vf-hint {
	max-width: 52rem;
	margin: 2rem auto 0;
	padding: 1.1rem 1.4rem;
	color: var(--muted);
	background: #fff;
	border: 1px solid var(--line);
	border-left: 4px solid var(--v400);
	border-radius: 0 1rem 1rem 0;
	font-size: 0.92rem;
}

/* --------------------------------------------------------------------------
   Logo-Intro (nur wenn flow.js es freischaltet)
   -------------------------------------------------------------------------- */
.vf-splash { display: none; }
.vf-intro .vf-splash {
	position: fixed;
	inset: 0;
	z-index: 1200;
	display: grid;
	place-items: center;
	background: radial-gradient(120% 90% at 50% 40%, #fff 0%, #fff 45%, var(--v50) 100%);
	animation: vf-splash-out 0.85s 1s var(--ease-in-out) forwards;
	pointer-events: none;
}
.vf-intro--skip .vf-splash { animation-duration: 0.45s; animation-delay: 0s; }
.vf-splash__inner { display: flex; flex-direction: column; align-items: center; }
.vf-splash img { display: block; width: min(17rem, 62vw); height: auto; animation: vf-splash-logo 0.8s var(--ease) both; }
.vf-splash__line { position: relative; width: min(10rem, 40vw); height: 3px; margin-top: 1.4rem; overflow: hidden; background: var(--v100); border-radius: 3px; }
.vf-splash__line::after { content: ""; position: absolute; inset: 0; background: var(--grad); transform-origin: 0 50%; animation: vf-splash-fill 0.95s 0.1s var(--ease) both; }
.vf-intro:not(.vf-intro--done) :is(.vf-topnotice, .vf-header, .vf-main),
.vf-intro:not(.vf-intro--done) :is(.vf-topnotice, .vf-header, .vf-main) *,
.vf-intro:not(.vf-intro--done) :is(.vf-topnotice, .vf-header, .vf-main) *::before,
.vf-intro:not(.vf-intro--done) :is(.vf-topnotice, .vf-header, .vf-main) *::after { animation-play-state: paused !important; }

/* --------------------------------------------------------------------------
   Hinweisleiste, Kopfzeile, Menüs
   -------------------------------------------------------------------------- */
.vf-topnotice {
	position: relative;
	z-index: 61;
	background: linear-gradient(90deg, #f59e0b, #f97316, #f59e0b) 0 0 / 200% 100%;
	color: #1c1206;
	font-size: 0.85rem;
	line-height: 1.4;
	animation: vf-grad 14s ease-in-out infinite;
}
.vf-topnotice p {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.35rem 0.8rem;
	margin: 0;
	padding: 0.55rem var(--gutter);
	text-align: center;
	font-weight: 700;
}
.vf-topnotice__label {
	padding: 0.15rem 0.55rem;
	color: #fbbf24;
	background: #1c1206;
	border-radius: 0.35rem;
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.vf-header {
	position: sticky;
	top: 0.75rem;
	z-index: 60;
	width: min(100% - 1.5rem, 86rem);
	margin: 0.75rem auto calc(-1 * (var(--hh) + 0.75rem));
	transition: transform 0.55s var(--ease);
}
.vf-header.is-hidden { transform: translateY(calc(-100% - 1.5rem)); }
.vf-header.is-hidden .vf-mega { opacity: 0; visibility: hidden; }
.vf-header:focus-within { transform: none; }
.vf-header__bar {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	height: var(--hh);
	padding: 0 0.5rem 0 1.1rem;
	background: var(--glass);
	-webkit-backdrop-filter: blur(18px) saturate(1.5);
	backdrop-filter: blur(18px) saturate(1.5);
	border: 1px solid rgba(255, 255, 255, 0.8);
	border-radius: 1.4rem;
	box-shadow: 0 10px 30px rgba(15, 41, 66, 0.07);
	transition: background-color 0.4s, box-shadow 0.4s;
}
.vf-header.is-scrolled .vf-header__bar { background: rgba(255, 255, 255, 0.88); box-shadow: 0 16px 44px rgba(15, 41, 66, 0.14); }
.vf-brand { flex: none; display: block; line-height: 0; border-radius: 0.5rem; }
.vf-brand img { display: block; width: auto; height: 2.7rem; mix-blend-mode: multiply; transition: transform 0.4s var(--ease); }
.vf-brand:hover img { transform: scale(1.03); }

.vf-nav { display: none; margin-inline: auto; }
.vf-nav__list { display: flex; gap: 0.15rem; margin: 0; padding: 0; list-style: none; }
.vf-nav__item { position: relative; }
.vf-nav__link {
	position: relative;
	display: block;
	padding: 0.6rem 0.85rem;
	color: var(--v900);
	font-size: 0.92rem;
	font-weight: 700;
	text-decoration: none;
	border-radius: 999px;
	transition: color 0.25s, background-color 0.25s;
}
.vf-nav__link:hover { color: var(--v600); background: var(--v50); }
.vf-nav__link[aria-current]::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0.2rem;
	width: 0.32rem;
	height: 0.32rem;
	margin-left: -0.16rem;
	border-radius: 50%;
	background: var(--v500);
}
.vf-nav__item--mega > .vf-nav__link { padding-right: 1.7rem; }
.vf-nav__item--mega > .vf-nav__link::before {
	content: "";
	position: absolute;
	right: 0.8rem;
	top: 50%;
	width: 0.36rem;
	height: 0.36rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-70%) rotate(45deg);
	transition: transform 0.3s var(--ease);
}
.vf-nav__item--mega:hover > .vf-nav__link::before,
.vf-nav__item--mega:focus-within > .vf-nav__link::before { transform: translateY(-30%) rotate(-135deg); }
.vf-mega {
	position: absolute;
	top: calc(100% + 1rem);
	left: 50%;
	width: min(44rem, 90vw);
	padding: 1rem;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 1.4rem;
	box-shadow: var(--shadow-lg);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 10px) scale(0.98);
	transition: opacity 0.3s, transform 0.4s var(--ease), visibility 0s 0.3s;
}
.vf-mega::before { content: ""; position: absolute; left: 0; right: 0; top: -1.1rem; height: 1.1rem; }
.vf-nav__item--mega:hover .vf-mega,
.vf-nav__item--mega:focus-within .vf-mega { opacity: 1; visibility: visible; transform: translate(-50%, 0) scale(1); transition-delay: 0s; }
.vf-mega__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.25rem; margin: 0; padding: 0; list-style: none; }
.vf-mega__link {
	display: flex;
	gap: 0.85rem;
	align-items: flex-start;
	padding: 0.8rem;
	color: var(--text);
	text-decoration: none;
	border-radius: 1rem;
	transition: background-color 0.25s;
}
.vf-mega__link:hover { background: var(--v50); color: var(--text); }
.vf-mega__icon { display: grid; place-items: center; flex: none; width: 2.6rem; height: 2.6rem; color: var(--v600); background: var(--v50); border-radius: 0.8rem; transition: background-color 0.3s, color 0.3s, transform 0.4s var(--ease); }
.vf-mega__link:hover .vf-mega__icon { color: #fff; background: var(--v600); transform: rotate(-6deg); }
.vf-mega__text strong { display: block; color: var(--v900); font-size: 0.95rem; }
.vf-mega__text small { display: block; color: var(--muted); font-size: 0.8rem; line-height: 1.4; }
.vf-mega__all { display: flex; align-items: center; justify-content: center; gap: 0.5rem; margin-top: 0.5rem; padding: 0.8rem; color: var(--v600); font-weight: 700; text-decoration: none; border-top: 1px solid var(--line); }
.vf-mega__all .vf-icon { transition: transform 0.3s var(--ease); }
.vf-mega__all:hover .vf-icon { transform: translateX(4px); }

.vf-header__call {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	margin-left: auto;
	padding: 0.35rem;
	color: #fff;
	background: var(--v800);
	border-radius: 999px;
	text-decoration: none;
	transition: background-color 0.3s, transform 0.3s var(--ease), translate 0.5s var(--ease);
}
.vf-header__call:hover { color: #fff; background: var(--v600); }
.vf-header__call-icon { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: rgba(255, 255, 255, 0.14); }
.vf-header__call:hover .vf-header__call-icon .vf-icon { animation: vf-wiggle 0.7s ease; }
.vf-header__call-text { display: none; padding-right: 0.9rem; font-weight: 700; font-size: 0.92rem; line-height: 1.15; }
.vf-header__call-text small { display: block; color: var(--v200); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }

.vf-burger {
	display: grid;
	place-items: center;
	width: 3.2rem;
	height: 3.2rem;
	padding: 0;
	color: var(--v900);
	background: var(--v50);
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color 0.3s;
}
.vf-burger:hover { background: var(--v100); }
.vf-burger__lines { position: relative; display: block; width: 1.25rem; height: 0.8rem; }
.vf-burger__lines span { position: absolute; left: 0; right: 0; height: 2px; border-radius: 2px; background: currentColor; transition: transform 0.45s var(--ease), top 0.45s var(--ease); }
.vf-burger__lines span:first-child { top: 0; }
.vf-burger__lines span:last-child { top: calc(100% - 2px); }
.vf-burger[aria-expanded="true"] .vf-burger__lines span:first-child { top: calc(50% - 1px); transform: rotate(45deg); }
.vf-burger[aria-expanded="true"] .vf-burger__lines span:last-child { top: calc(50% - 1px); transform: rotate(-45deg); }
.vf-menu-open .vf-header { z-index: 80; }
.vf-menu-open .vf-burger { color: #fff; background: rgba(255, 255, 255, 0.12); }
.vf-menu-open .vf-header__bar { background: transparent; border-color: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.vf-menu-open .vf-brand, .vf-menu-open .vf-header__call { visibility: hidden; }

.vf-menu {
	position: fixed;
	inset: 0;
	z-index: 75;
	overflow-y: auto;
	color: #fff;
	background: radial-gradient(120% 80% at 100% 0%, var(--v600) 0%, var(--v800) 45%, var(--v900) 100%);
	clip-path: circle(0 at calc(100% - 2.5rem) 2.5rem);
	transition: clip-path 0.7s var(--ease-in-out);
}
.vf-menu.is-open { clip-path: circle(150% at calc(100% - 2.5rem) 2.5rem); }
.vf-menu__inner { display: flex; flex-direction: column; min-height: 100%; padding: calc(var(--hh) + 3rem) var(--gutter) 2rem; }
.vf-menu__list { margin: 0; padding: 0; list-style: none; counter-reset: vfm; }
.vf-menu__list li { counter-increment: vfm; overflow: hidden; }
.vf-menu__list a {
	display: flex;
	align-items: baseline;
	gap: 0.9rem;
	padding: 0.25rem 0;
	color: #fff;
	font-family: var(--font-head);
	font-size: clamp(2rem, 1.2rem + 5vw, 3.4rem);
	letter-spacing: -0.03em;
	line-height: 1.15;
	text-decoration: none;
	transform: translateY(110%);
	transition: transform 0.7s var(--ease), color 0.3s;
	transition-delay: calc(var(--i, 0) * 50ms + 150ms);
}
.vf-menu__list a::before { content: counter(vfm, decimal-leading-zero); color: var(--v300); font-family: var(--font-body); font-size: 0.8rem; letter-spacing: 0.1em; }
.vf-menu.is-open .vf-menu__list a { transform: none; }
.vf-menu__list a:hover, .vf-menu__list a[aria-current] { color: var(--sky); }
.vf-menu__sub { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 2rem 0 0; padding: 0; list-style: none; opacity: 0; transition: opacity 0.6s 0.5s; }
.vf-menu.is-open .vf-menu__sub { opacity: 1; }
.vf-menu__sub a { display: block; padding: 0.45rem 0.9rem; color: var(--v100); font-size: 0.9rem; text-decoration: none; border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 999px; }
.vf-menu__sub a:hover { color: #fff; border-color: #fff; }
.vf-menu__foot { margin-top: auto; padding-top: 2.5rem; color: var(--v200); font-size: 0.9rem; }
.vf-menu__foot p { margin: 1rem 0 0; }

@media (min-width: 1140px) {
	.vf-nav { display: block; }
	.vf-burger { display: none; }
	.vf-header__call { margin-left: 0; }
}
@media (min-width: 1320px) {
	.vf-header__call-text { display: block; }
}
html:not(.js) .vf-burger { display: none; }
html:not(.js) .vf-header { position: relative; top: 0; margin-bottom: 0; }
@media (max-width: 1139px) {
	html:not(.js) .vf-header__bar { flex-wrap: wrap; height: auto; padding-block: 0.75rem; }
	html:not(.js) .vf-nav { display: block; order: 3; flex-basis: 100%; }
	html:not(.js) .vf-nav__list { flex-wrap: wrap; }
	html:not(.js) .vf-mega { display: none; }
}

/* --------------------------------------------------------------------------
   Hintergründe: Farbflächen, Punktraster, Filmkorn
   -------------------------------------------------------------------------- */
.vf-hero__bg,
.vf-phero__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.vf-hero__bg::before,
.vf-phero__bg::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(rgba(38, 83, 120, 0.14) 1px, transparent 1.3px);
	background-size: 26px 26px;
	-webkit-mask-image: radial-gradient(ellipse 70% 60% at 30% 40%, #000 10%, transparent 75%);
	mask-image: radial-gradient(ellipse 70% 60% at 30% 40%, #000 10%, transparent 75%);
}
.vf-hero__bg::after,
.vf-phero__bg::after,
.vf-section__grain {
	content: "";
	position: absolute;
	inset: 0;
	opacity: 0.22;
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='180'%20height='180'%3E%3Cfilter%20id='n'%3E%3CfeTurbulence%20type='fractalNoise'%20baseFrequency='.85'%20numOctaves='3'%20stitchTiles='stitch'/%3E%3CfeColorMatrix%20values='0%200%200%200%200.06%200%200%200%200%200.16%200%200%200%200%200.26%200%200%200%20.55%200'/%3E%3C/filter%3E%3Crect%20width='100%25'%20height='100%25'%20filter='url(%23n)'/%3E%3C/svg%3E");
	pointer-events: none;
}
.vf-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(70px);
	translate: calc(var(--px, 0) * var(--depth, 24px)) calc(var(--py, 0) * var(--depth, 24px));
	transition: translate 1.4s var(--ease);
}
.vf-orb--1 { --depth: 34px; width: 36rem; height: 36rem; top: -14rem; left: -10rem; background: var(--v100); animation: vf-drift1 26s ease-in-out infinite alternate; }
.vf-orb--2 { --depth: -40px; width: 30rem; height: 30rem; bottom: -14rem; right: -6rem; background: var(--v200); opacity: 0.7; animation: vf-drift2 30s ease-in-out infinite alternate; }
.vf-orb--3 { --depth: 20px; width: 22rem; height: 22rem; top: 25%; left: 42%; background: #d4e8f6; opacity: 0.8; animation: vf-drift3 34s ease-in-out infinite alternate; }

/* --------------------------------------------------------------------------
   Startseite: Einstieg
   -------------------------------------------------------------------------- */
.vf-hero {
	position: relative;
	isolation: isolate;
	display: grid;
	align-items: center;
	min-height: min(100svh, 62rem);
	padding: calc(var(--hh) + clamp(3rem, 8vw, 5.5rem)) 0 clamp(5rem, 9vw, 7rem);
	overflow: hidden;
	background: radial-gradient(110% 80% at 80% 10%, #fff 0%, var(--paper) 55%, var(--v50) 100%);
}
.vf-hero__grid { display: grid; gap: clamp(2.5rem, 6vw, 4rem); align-items: center; }
@media (min-width: 1200px) { .vf-hero__grid { grid-template-columns: 1.1fr 0.9fr; } }
.vf-hero__text { translate: 0 calc(var(--sy, 0) * 0.1px); opacity: calc(1 - var(--sy, 0) / 700); }
.vf-hero__title { max-width: 17ch; margin-bottom: 1.4rem; font-size: var(--fs-hero); line-height: 1.02; letter-spacing: -0.045em; }
.vf-hero__accent { position: relative; display: inline-block; padding-bottom: 0.08em; }
.vf-hero__accent,
.vf-split .vf-hero__accent .vf-w > span {
	background: var(--grad-text) 0 50% / 250% 100%;
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	animation: vf-shine 10s ease-in-out infinite;
}
.vf-split .vf-hero__accent { background: none; animation: none; color: inherit; }
.vf-swoosh { position: absolute; left: 0; right: 0; bottom: -0.12em; width: 100%; height: 0.28em; overflow: visible; }
.vf-swoosh path { fill: none; stroke: var(--sky); stroke-width: 4; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; animation: vf-draw 1.2s 1.1s var(--ease) forwards; }
.vf-hero__lead { max-width: 36rem; margin-bottom: 0; color: var(--muted); font-size: clamp(1.05rem, 1rem + 0.45vw, 1.3rem); }
.vf-trust { display: flex; flex-wrap: wrap; gap: 0.6rem 1.4rem; margin: 2.2rem 0 0; padding: 0; list-style: none; color: var(--v800); font-size: 0.9rem; font-weight: 700; }
.vf-trust li { display: inline-flex; align-items: center; gap: 0.5rem; }
.vf-trust__icon { display: grid; place-items: center; width: 2rem; height: 2rem; color: var(--v600); background: #fff; border: 1px solid var(--line); border-radius: 50%; }
.vf-trust__icon .vf-icon { width: 1rem; height: 1rem; }

/* Bildfläche: organische Form, Ringe, Puls und kreisende Therapien */
.vf-orbit { container-type: inline-size; position: relative; width: min(100%, 30rem); aspect-ratio: 1; margin-inline: auto; perspective: 1100px; }
.vf-orbit__stage {
	position: absolute;
	inset: 0;
	transform: rotateX(var(--ty, 0deg)) rotateY(var(--tx, 0deg));
	transform-style: preserve-3d;
	transition: transform 0.8s var(--ease);
}
.vf-blob { position: absolute; inset: 14%; width: 72%; height: 72%; overflow: visible; filter: drop-shadow(0 34px 60px rgba(25, 61, 92, 0.35)); }
.vf-blob__shape { animation: vf-morph 18s ease-in-out infinite; }
.vf-blob__shape--shine { mix-blend-mode: soft-light; }
.vf-orbit__ring { position: absolute; border-radius: 50%; pointer-events: none; }
.vf-orbit__ring--1 { inset: 3%; border: 1px dashed rgba(59, 110, 148, 0.35); animation: vf-spin 90s linear infinite; }
.vf-orbit__ring--2 { inset: 9%; border: 1px solid rgba(108, 180, 224, 0.35); }
.vf-orbit__ring--2::after { content: ""; position: absolute; top: -5px; left: 50%; width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; background: var(--sky); box-shadow: 0 0 14px var(--sky); }
.vf-orbit__ring--2 { animation: vf-spin 24s linear infinite reverse; }
.vf-orbit__pulse { position: absolute; left: 26%; top: 41%; width: 48%; height: auto; overflow: visible; }
.vf-orbit__pulse path { fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 0.35 0.65; stroke-dashoffset: 1; filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.8)); animation: vf-ecg 2.8s linear infinite; }
/* Die Therapien drehen sich nur beim Scrollen weiter (vom Nutzer gesteuert, kein Dauerlauf) */
.vf-orbit__items { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; transform: rotate(var(--orbit, 0deg)); animation: vf-orbit-turn 1.8s 0.3s var(--ease) backwards; }
.vf-orbit__item { position: absolute; left: 50%; top: 50%; transform: rotate(var(--a)) translateX(44cqw) rotate(calc(-1 * var(--a))); }
.vf-orbit__item:nth-child(1) { --a: -90deg; }
.vf-orbit__item:nth-child(2) { --a: -30deg; }
.vf-orbit__item:nth-child(3) { --a: 30deg; }
.vf-orbit__item:nth-child(4) { --a: 90deg; }
.vf-orbit__item:nth-child(5) { --a: 150deg; }
.vf-orbit__item:nth-child(6) { --a: 210deg; }
.vf-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.5rem 0.85rem 0.5rem 0.55rem;
	color: var(--v900);
	background: rgba(255, 255, 255, 0.88);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border: 1px solid #fff;
	border-radius: 999px;
	box-shadow: var(--shadow-md);
	font-size: 0.8rem;
	font-weight: 700;
	white-space: nowrap;
	text-decoration: none;
	translate: -50% -50%;
	transform: rotate(calc(-1 * var(--orbit, 0deg)));
	animation: vf-orbit-turn-back 1.8s 0.3s var(--ease) backwards;
	transition: background-color 0.3s, color 0.3s, box-shadow 0.3s, scale 0.4s var(--ease);
}
.vf-chip .vf-icon { width: 1.6rem; height: 1.6rem; padding: 0.3rem; color: #fff; background: var(--v600); border-radius: 50%; }
.vf-chip:hover { color: #fff; background: var(--v700); scale: 1.06; box-shadow: var(--shadow-lg); }
.vf-chip:hover .vf-icon { background: var(--sky); }
@keyframes vf-orbit-turn { from { transform: rotate(calc(var(--orbit, 0deg) - 40deg)); } }
@keyframes vf-orbit-turn-back { from { transform: rotate(calc(-1 * var(--orbit, 0deg) + 40deg)); } }
@media (max-width: 640px) {
	.vf-chip span { display: none; }
	.vf-chip { padding: 0.3rem; }
	.vf-orbit__item { transform: rotate(var(--a)) translateX(43cqw) rotate(calc(-1 * var(--a))); }
}

.vf-scrollcue {
	position: absolute;
	left: 50%;
	bottom: 1.6rem;
	display: none;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	color: var(--muted);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
	translate: -50% 0;
}
.vf-scrollcue__line { position: relative; width: 1px; height: 3rem; overflow: hidden; background: var(--line); }
.vf-scrollcue__line::after { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 40%; background: var(--v500); animation: vf-cue 2.2s var(--ease-in-out) infinite; }
@media (min-width: 1024px) and (min-height: 720px) { .vf-scrollcue { display: flex; } }

/* Linie, die sich beim Scrollen durch die Startseite zieht (Pfad berechnet flow.js) */
.vf-flowline { position: absolute; left: 0; top: 0; z-index: 0; display: none; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.vf-flowline__track { fill: none; stroke: rgba(59, 110, 148, 0.09); stroke-width: 2; }
.vf-flowline__path { fill: none; stroke: var(--v400); stroke-width: 2.5; stroke-linecap: round; }
.vf-flowline__dot { fill: var(--sky); filter: drop-shadow(0 0 8px var(--sky)); }
@media (min-width: 1024px) { .js .vf-flowline.is-ready { display: block; } }
.vf-main--front > :not(.vf-flowline) { position: relative; z-index: 1; }

/* Laufband: bewegt sich nur, wenn gescrollt wird */
.vf-marquee { position: relative; padding: clamp(2rem, 5vw, 3.5rem) 0; overflow: hidden; background: #fff; border-block: 1px solid var(--line); }
.vf-marquee__row { display: flex; width: max-content; white-space: nowrap; font-family: var(--font-head); font-size: clamp(2.2rem, 1.4rem + 3.4vw, 4.8rem); line-height: 1.15; letter-spacing: -0.035em; color: var(--v900); will-change: transform; }
.vf-marquee__row--outline { color: transparent; -webkit-text-stroke: 1.5px var(--v400); }
.vf-marquee__group { display: flex; align-items: center; }
.vf-marquee__group span { padding: 0 0.45em; }
.vf-marquee__group i {
	display: inline-block;
	width: 0.45em;
	height: 0.45em;
	background: var(--grad);
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%200C13%208%2016%2011%2024%2012C16%2013%2013%2016%2012%2024C11%2016%208%2013%200%2012C8%2011%2011%208%2012%200Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%200C13%208%2016%2011%2024%2012C16%2013%2013%2016%2012%2024C11%2016%208%2013%200%2012C8%2011%2011%208%2012%200Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Kennzahlen */
.vf-facts-wrap { padding: clamp(3rem, 7vw, 5rem) 0; }
.vf-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1rem; margin: 0 auto; padding: 0; list-style: none; }
@media (min-width: 900px) { .vf-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.vf-facts li { display: flex; flex-direction: column; gap: 0.4rem; padding-left: 1.2rem; border-left: 1px solid var(--line); }
.vf-facts__num { font-family: var(--font-head); font-size: clamp(3rem, 2rem + 4vw, 5.5rem); line-height: 1; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.vf-facts__label { max-width: 14rem; color: var(--muted); font-size: 0.92rem; line-height: 1.4; }

/* --------------------------------------------------------------------------
   Abschnitte und Köpfe
   -------------------------------------------------------------------------- */
.vf-section { position: relative; padding: clamp(4.5rem, 10vw, 8rem) 0; }
.vf-section--tight { padding: clamp(3rem, 7vw, 5rem) 0; }
.vf-section--soft { background: linear-gradient(180deg, #fff, var(--v50)); border-block: 1px solid var(--line); }
.vf-section--dark { isolation: isolate; overflow: hidden; color: var(--v100); background: radial-gradient(90% 70% at 15% 0%, var(--v700) 0%, var(--v800) 45%, var(--v900) 100%); }
.vf-section--dark h2, .vf-section--dark h3 { color: #fff; }
.vf-section--dark .vf-eyebrow { color: var(--sky); }
.vf-section__grain { z-index: -1; opacity: 0.12; }

.vf-head { max-width: 48rem; margin-bottom: clamp(2.2rem, 5vw, 3.5rem); }
.vf-head--center { margin-inline: auto; text-align: center; }
.vf-head--center .vf-eyebrow { justify-content: center; }
.vf-head__title { margin: 0; font-size: var(--fs-h2); letter-spacing: -0.035em; }
.vf-head__text { margin: 1.1rem 0 0; color: var(--muted); font-size: 1.1rem; }
.vf-section--dark .vf-head__text { color: var(--v200); }
p.vf-center { margin: 2.5rem 0 0; }
p.vf-note.vf-center { margin-top: 1rem; }

/* --------------------------------------------------------------------------
   Leistungen: Bento-Raster, Therapie-Karten, große Angebotskarten
   -------------------------------------------------------------------------- */
.vf-bento { display: grid; gap: 1rem; }
@media (min-width: 700px) { .vf-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1140px) {
	.vf-bento { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.vf-bento .vf-feature--ems { grid-column: 3 / 5; grid-row: 1 / 3; }
	.vf-bento .vf-feature--analyse { grid-column: 3 / 5; grid-row: 3; }
}

.vf-tcard,
.vf-feature,
.vf-card,
.vf-infocard,
.vf-price,
.vf-person,
.vf-contactcard,
.vf-glance__item,
.vf-benefit,
.vf-download,
.vf-formcard { position: relative; isolation: isolate; }

/* Lichtschein an der Mausposition (Position setzt flow.js) */
:is(.vf-tcard, .vf-feature, .vf-card, .vf-infocard, .vf-price, .vf-person, .vf-contactcard, .vf-glance__item, .vf-benefit)::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: inherit;
	background: radial-gradient(24rem circle at var(--mx, 50%) var(--my, 0%), rgba(108, 180, 224, 0.16), transparent 60%);
	opacity: 0;
	transition: opacity 0.4s;
	pointer-events: none;
}
:is(.vf-tcard, .vf-feature, .vf-card, .vf-infocard, .vf-price, .vf-person, .vf-contactcard, .vf-glance__item, .vf-benefit):hover::before { opacity: 1; }

.vf-tcard {
	display: flex;
	flex-direction: column;
	min-height: 17rem;
	padding: 1.6rem;
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
	transition: transform 0.5s var(--ease), box-shadow 0.5s, border-color 0.4s;
}
.vf-tcard:hover { transform: translateY(-6px); border-color: var(--v200); box-shadow: var(--shadow-lg); }
.vf-tcard:focus-within { outline: 3px solid var(--v500); outline-offset: 3px; }
.vf-tcard__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; }
.vf-tcard__num { color: var(--v300); font-family: var(--font-head); font-size: 0.95rem; letter-spacing: 0.04em; }
.vf-tcard__icon {
	display: grid;
	place-items: center;
	width: 3.4rem;
	height: 3.4rem;
	margin-bottom: 1.2rem;
	color: var(--v600);
	background: var(--v50);
	border-radius: 1.1rem;
	transition: background-color 0.4s, color 0.4s, transform 0.6s var(--ease);
}
.vf-tcard__icon .vf-icon { width: 1.7rem; height: 1.7rem; }
.vf-tcard:hover .vf-tcard__icon { color: #fff; background: var(--v600); transform: rotate(-8deg) scale(1.06); }
.vf-tcard__title { margin: 0 0 0.6rem; font-size: var(--fs-h3); }
.vf-tcard__title a { color: inherit; text-decoration: none; }
.vf-tcard__title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.vf-tcard__title a:focus-visible { outline: none; }
.vf-tcard__text { margin: 0 0 1.4rem; color: var(--muted); font-size: 0.94rem; line-height: 1.6; }
.vf-tcard__go {
	display: grid;
	place-items: center;
	width: 2.6rem;
	height: 2.6rem;
	margin-top: auto;
	color: var(--v700);
	border: 1px solid var(--line);
	border-radius: 50%;
	transition: transform 0.5s var(--ease), background-color 0.3s, color 0.3s, border-color 0.3s;
}
.vf-tcard:hover .vf-tcard__go { color: #fff; background: var(--v800); border-color: var(--v800); transform: rotate(45deg); }
.vf-tcard--accent { color: var(--v100); background: var(--grad); border-color: transparent; }
.vf-tcard--accent .vf-tcard__title { color: #fff; }
.vf-tcard--accent .vf-tcard__text { color: var(--v100); }
.vf-tcard--accent .vf-tcard__icon { color: #fff; background: rgba(255, 255, 255, 0.14); }
.vf-tcard--accent .vf-tcard__go { color: #fff; border-color: rgba(255, 255, 255, 0.35); }

.vf-feature {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	min-height: 18rem;
	padding: clamp(1.6rem, 3vw, 2.4rem);
	border-radius: var(--radius);
	transition: transform 0.5s var(--ease), box-shadow 0.5s;
}
.vf-feature:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.vf-feature:focus-within { outline: 3px solid var(--v500); outline-offset: 3px; }
.vf-feature__title { margin: 1rem 0 0.8rem; font-size: clamp(1.8rem, 1.3rem + 2vw, 2.8rem); letter-spacing: -0.035em; }
.vf-feature__title a { color: inherit; text-decoration: none; }
.vf-feature__title a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.vf-feature__title a:focus-visible { outline: none; }
.vf-feature p { max-width: 30rem; }
.vf-feature__go {
	position: absolute;
	top: 1.4rem;
	right: 1.4rem;
	display: grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	transition: transform 0.5s var(--ease);
}
.vf-feature:hover .vf-feature__go { transform: rotate(45deg) scale(1.08); }

.vf-feature--ems { color: var(--v100); background: radial-gradient(80% 70% at 85% 15%, var(--v600) 0%, var(--v800) 55%, var(--v900) 100%); }
.vf-feature--ems .vf-feature__title { color: #fff; }
.vf-feature--ems .vf-feature__go { color: var(--v900); background: #fff; }
.vf-feature--ems::after {
	content: "";
	position: absolute;
	inset: -40%;
	z-index: -1;
	background: conic-gradient(from var(--vf-angle), transparent 0deg, rgba(108, 180, 224, 0.28) 40deg, transparent 90deg, transparent 360deg);
	animation: vf-angle 9s linear infinite;
}
.vf-feature__bolt { position: absolute; right: -2rem; bottom: -3rem; z-index: -1; color: rgba(255, 255, 255, 0.06); }
.vf-feature__bolt .vf-icon { width: 20rem; height: 20rem; stroke-width: 1; }
.vf-feature__big { margin: auto 0 0; padding-top: 1.5rem; color: var(--v200); font-weight: 700; }
.vf-feature__big span { display: block; color: #fff; font-family: var(--font-head); font-size: clamp(3.5rem, 2rem + 5vw, 6rem); line-height: 0.95; letter-spacing: -0.05em; }

.vf-feature--analyse { display: grid; gap: 1rem; align-items: center; background: linear-gradient(135deg, #fff 0%, var(--v50) 60%, var(--v100) 100%); border: 1px solid var(--line); }
@media (min-width: 560px) { .vf-feature--analyse { grid-template-columns: 1.2fr 0.8fr; } }
.vf-feature--analyse .vf-feature__go { color: #fff; background: var(--v800); }
.vf-feature__img { width: 100%; max-width: 16rem; height: auto; margin-inline: auto; border-radius: 1.2rem; box-shadow: var(--shadow-md); transition: transform 0.8s var(--ease); }
.vf-feature--analyse:hover .vf-feature__img { transform: rotate(-3deg) scale(1.04); }

/* --------------------------------------------------------------------------
   Leitsatz, Schritte, Vorteile, Team
   -------------------------------------------------------------------------- */
.vf-statement { padding: clamp(5rem, 12vw, 9rem) 0; text-align: center; }
.vf-statement .vf-eyebrow { justify-content: center; }
.vf-statement__text {
	max-width: 58rem;
	margin: 0 auto;
	color: var(--v900);
	font-family: var(--font-head);
	font-size: clamp(1.8rem, 1rem + 3.4vw, 3.8rem);
	line-height: 1.15;
	letter-spacing: -0.035em;
	text-wrap: balance;
}
.vf-statement__accent { background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }
.vf-statement--small .vf-statement__text { font-size: clamp(1.5rem, 1rem + 2.2vw, 2.6rem); }
.vf-lit .vf-l { opacity: 0.14; transition: opacity 0.45s ease; }
.vf-lit .vf-l.is-lit { opacity: 1; }

.vf-steps { position: relative; padding: clamp(4rem, 9vw, 7rem) 0; }
.vf-steps__grid { display: grid; gap: 2.5rem; }
@media (min-width: 1024px) { .vf-steps__grid { grid-template-columns: 5fr 7fr; gap: 5rem; } }
.vf-steps__sticky { position: sticky; top: calc(var(--hh) + 3rem); }
.vf-steps__title { font-size: var(--fs-h2); letter-spacing: -0.035em; }
.vf-steps__counter { display: none; margin: 1.5rem 0 1rem; font-family: var(--font-head); line-height: 1; letter-spacing: -0.05em; }
.vf-steps__current { display: inline-block; font-size: clamp(4rem, 3rem + 5vw, 8rem); background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; transition: transform 0.5s var(--ease), opacity 0.3s; }
.vf-steps__current.is-changing { transform: translateY(-12px); opacity: 0; }
.vf-steps__total { color: var(--v200); font-size: clamp(1.6rem, 1rem + 2vw, 2.6rem); }
.vf-steps__bar { display: none; height: 4px; overflow: hidden; background: var(--v100); border-radius: 4px; }
.vf-steps__bar span { display: block; height: 100%; background: var(--grad); transform: scaleX(var(--p, 0)); transform-origin: 0 50%; }
@media (min-width: 1024px) { .js .vf-steps__counter { display: block; } .js .vf-steps__bar { display: block; } }
.vf-steps__list { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
.vf-step {
	position: relative;
	padding: clamp(1.8rem, 4vw, 2.8rem);
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
	transition: opacity 0.5s, transform 0.6s var(--ease), box-shadow 0.5s, border-color 0.5s;
}
@media (min-width: 1024px) {
	.vf-steps__list { gap: 30vh; padding-block: 8vh 20vh; }
	.js .vf-step { opacity: 0.35; transform: scale(0.97); }
	.js .vf-step.is-active { opacity: 1; transform: none; border-color: var(--v200); box-shadow: var(--shadow-lg); }
}
.vf-step__num { position: absolute; top: 1.6rem; right: 1.8rem; color: var(--v100); font-family: var(--font-head); font-size: 3.4rem; line-height: 1; }
.vf-step__icon { display: grid; place-items: center; width: 3.6rem; height: 3.6rem; margin-bottom: 1.3rem; color: #fff; background: var(--grad); border-radius: 1.1rem; box-shadow: 0 12px 28px rgba(38, 83, 120, 0.3); }
.vf-step__icon .vf-icon { width: 1.7rem; height: 1.7rem; }
.vf-step__title { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem); }
.vf-step p { margin: 0; color: var(--muted); font-size: 1.05rem; }

.vf-benefits { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
@media (min-width: 860px) { .vf-benefits { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; } }
.vf-benefit {
	padding: clamp(1.8rem, 3vw, 2.4rem);
	background: rgba(255, 255, 255, 0.06);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: var(--radius);
	transition: transform 0.5s var(--ease), background-color 0.4s;
}
.vf-benefit:hover { transform: translateY(-6px); background: rgba(255, 255, 255, 0.1); }
.vf-benefit__icon { display: grid; place-items: center; width: 4rem; height: 4rem; margin-bottom: 1.5rem; color: var(--sky); background: rgba(108, 180, 224, 0.12); border-radius: 1.2rem; }
.vf-benefit__icon .vf-icon { width: 2rem; height: 2rem; }
.vf-benefit h3 { font-size: var(--fs-h3); }
.vf-benefit p { margin: 0; color: var(--v200); }
.vf-benefits--light .vf-benefit { background: #fff; border-color: var(--line); box-shadow: var(--shadow-sm); }
.vf-benefits--light .vf-benefit:hover { background: #fff; box-shadow: var(--shadow-lg); }
.vf-benefits--light .vf-benefit__icon { color: var(--v600); background: var(--v50); }
.vf-benefits--light .vf-benefit p { color: var(--muted); }

.vf-teamteaser { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 960px) { .vf-teamteaser { grid-template-columns: 1fr 1fr; gap: 4rem; } }
.vf-teamteaser__title { font-size: var(--fs-h2); letter-spacing: -0.035em; }
.vf-teamteaser__text p { color: var(--muted); font-size: 1.1rem; }
.vf-people { display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
@media (min-width: 640px) { .vf-people { grid-template-columns: 1fr 1fr; gap: 1.25rem; } }
.vf-person {
	padding: clamp(1.6rem, 3vw, 2.4rem);
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
	transition: transform 0.5s var(--ease), box-shadow 0.5s;
}
.vf-person:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.vf-monogram {
	position: relative;
	display: grid;
	place-items: center;
	width: 5rem;
	height: 5rem;
	margin-bottom: 1.4rem;
	color: #fff;
	background: var(--grad);
	border-radius: 1.4rem;
	font-family: var(--font-head);
	font-size: 1.6rem;
	letter-spacing: 0.02em;
}
.vf-monogram::after {
	content: "";
	position: absolute;
	inset: -6px;
	padding: 2.5px;
	border-radius: 1.75rem;
	background: conic-gradient(from var(--vf-angle), var(--sky), transparent 30%, transparent 70%, var(--v400));
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	animation: vf-angle 6s linear infinite;
}
.vf-monogram--large { width: 7rem; height: 7rem; font-size: 2.3rem; border-radius: 2rem; }
.vf-monogram--large::after { border-radius: 2.35rem; }
.vf-person__name { margin: 0 0 0.3rem; font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); }
.vf-person__role { margin: 0; color: var(--v500); font-weight: 700; }
.vf-person__label { margin: 1.6rem 0 0.8rem; color: var(--muted); font-family: var(--font-body); font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; }

/* --------------------------------------------------------------------------
   Abschluss Kontakt, Info-Karten, Öffnungszeiten
   -------------------------------------------------------------------------- */
.vf-closing { padding: clamp(4.5rem, 10vw, 8rem) 0; background: linear-gradient(180deg, var(--paper), #fff); }
.vf-closing__head { max-width: 60rem; margin-bottom: clamp(2.5rem, 6vw, 4rem); }
.vf-closing__title { font-size: var(--fs-h2); letter-spacing: -0.035em; }
.vf-bigphone {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: clamp(0.8rem, 2vw, 1.4rem);
	margin: 0.5rem 0 1rem;
	color: var(--v900);
	font-family: var(--font-head);
	font-size: clamp(2.2rem, 1rem + 6vw, 6.2rem);
	line-height: 1;
	letter-spacing: -0.045em;
	text-decoration: none;
	transition: translate 0.5s var(--ease);
}
.vf-bigphone__icon { display: grid; place-items: center; flex: none; width: 0.9em; height: 0.9em; color: #fff; background: var(--grad); border-radius: 50%; box-shadow: 0 16px 40px rgba(38, 83, 120, 0.35); }
.vf-bigphone__icon .vf-icon { width: 0.45em; height: 0.45em; stroke-width: 2; }
.vf-bigphone__num { background: linear-gradient(var(--v900), var(--v900)) 0 100% / 0 3px no-repeat; transition: background-size 0.6s var(--ease); }
.vf-bigphone:hover { color: var(--v900); }
.vf-bigphone:hover .vf-bigphone__num { background-size: 100% 3px; }
.vf-bigphone:hover .vf-bigphone__icon .vf-icon { animation: vf-wiggle 0.7s ease; }
.vf-closing__text { color: var(--muted); font-size: 1.1rem; }
.vf-closing__grid { display: grid; gap: 1rem; }
@media (min-width: 900px) { .vf-closing__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; } }
.vf-infocard {
	padding: clamp(1.6rem, 3vw, 2.2rem);
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
}
.vf-infocard__icon { display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: 1.2rem; color: var(--v600); background: var(--v50); border-radius: 1rem; }
.vf-infocard h3 { font-size: 1.2rem; }
.vf-infocard p, .vf-infocard li { color: var(--muted); font-size: 0.95rem; }
.vf-infocard ul { padding-left: 1.2em; }
.vital-address { margin: 0 0 1em; font-style: normal; line-height: 1.6; }
.vf-infocard .vital-address { color: var(--text); }

.vf-hours { display: grid; margin: 0; }
.vf-hours__row { display: flex; justify-content: space-between; gap: 1rem; padding: 0.7rem 0; border-bottom: 1px solid var(--line); }
.vf-hours__row:last-child { border-bottom: 0; }
.vf-hours dt { color: var(--muted); }
.vf-hours dd { margin: 0; color: var(--v900); font-weight: 700; text-align: right; }
@media (min-width: 400px) { .vf-hours dd { white-space: nowrap; } }
.vf-hours .is-closed dt, .vf-hours .is-closed dd { color: var(--muted); font-weight: 400; }
.vf-hours .is-today { margin-inline: -0.6rem; padding-inline: 0.6rem; border-radius: 0.6rem; background: linear-gradient(90deg, rgba(108, 180, 224, 0.16), transparent 85%); }
.vf-hours .is-today dt { color: var(--v900); font-weight: 700; }
.vf-today { display: inline-block; margin-left: 0.5rem; padding: 0.05rem 0.5rem; color: #fff; background: var(--v600); border-radius: 999px; font-size: 0.66rem; font-weight: 700; letter-spacing: 0.08em; line-height: 1.6; text-transform: uppercase; vertical-align: 0.12em; animation: vf-pop 0.5s 0.3s var(--ease) both; }

/* --------------------------------------------------------------------------
   Seitenkopf der Unterseiten
   -------------------------------------------------------------------------- */
.vf-phero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: calc(var(--hh) + clamp(3.5rem, 8vw, 6rem)) 0 clamp(3.5rem, 8vw, 6rem);
	background: radial-gradient(110% 80% at 85% 0%, #fff 0%, var(--paper) 60%, var(--v50) 100%);
	border-bottom: 1px solid var(--line);
}
.vf-phero__grid { display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 960px) { .vf-phero--visual .vf-phero__grid { grid-template-columns: 1.2fr 0.8fr; gap: 4rem; } }
.vf-phero__title { max-width: 16ch; margin-bottom: 1.2rem; font-size: var(--fs-h1); line-height: 1.02; letter-spacing: -0.045em; }
.vf-phero__lead { max-width: 40rem; margin: 0; color: var(--muted); font-size: clamp(1.05rem, 1rem + 0.45vw, 1.3rem); }
.vf-phero__visual { position: relative; width: min(100%, 24rem); aspect-ratio: 1; margin-inline: auto; }
.vf-phero__visual .vf-blob { inset: 0; width: 100%; height: 100%; }
.vf-phero__icon { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; }
.vf-phero__icon .vf-icon { width: 34%; height: 34%; stroke-width: 1.3; filter: drop-shadow(0 6px 18px rgba(9, 27, 46, 0.35)); }
.vf-phero__icon .vf-icon path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: vf-draw 1.8s 0.4s var(--ease) forwards; }
.vf-phero__media { position: relative; width: min(100%, 26rem); margin-inline: auto; }
.vf-phero--dark { color: var(--v100); background: radial-gradient(90% 80% at 85% 0%, var(--v600) 0%, var(--v800) 50%, var(--v900) 100%); border-bottom: 0; }
.vf-phero--dark .vf-phero__title { color: #fff; }
.vf-phero--dark .vf-phero__lead { color: var(--v200); }
.vf-phero--dark .vf-eyebrow { color: var(--sky); }
.vf-phero--dark .vf-crumbs, .vf-phero--dark .vf-crumbs a { color: var(--v200); }
.vf-phero--dark .vf-orb { opacity: 0.18; }
.vf-phero--dark .vf-phero__bg::before { background-image: radial-gradient(rgba(255, 255, 255, 0.12) 1px, transparent 1.3px); }
/* Impulslinien im dunklen Seitenkopf (EMS) */
.vf-phero--dark .vf-phero__bg { background: repeating-linear-gradient(180deg, transparent 0 46px, rgba(108, 180, 224, 0.07) 46px 47px); }
.vf-phero--dark .vf-phero__bg::after {
	opacity: 0.9;
	background: linear-gradient(90deg, transparent 0%, rgba(108, 180, 224, 0.0) 40%, rgba(108, 180, 224, 0.55) 50%, rgba(108, 180, 224, 0) 60%, transparent 100%) -100% 0 / 60% 1px no-repeat,
		linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.45) 50%, rgba(255, 255, 255, 0) 60%, transparent 100%) -100% 0 / 45% 1px no-repeat;
	background-position: -60% 141px, -45% 329px;
	animation: vf-impulse 4.5s var(--ease-in-out) infinite;
}

.vf-crumbs { margin-bottom: 1.6rem; font-size: 0.85rem; }
.vf-crumbs ol { display: flex; flex-wrap: wrap; gap: 0.3rem 0.6rem; margin: 0; padding: 0; list-style: none; }
.vf-crumbs li { display: inline-flex; align-items: center; gap: 0.6rem; color: var(--muted); }
.vf-crumbs li + li::before { content: ""; width: 0.38rem; height: 0.38rem; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); opacity: 0.6; }
.vf-crumbs a { color: var(--v600); font-weight: 700; text-decoration: none; }
.vf-crumbs a:hover { text-decoration: underline; }

/* Produktbild mit schwebenden Begriffen (Körperanalyse) */
.vf-product { position: relative; margin: 0; transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform 0.6s var(--ease); }
.vf-product img { display: block; width: 100%; height: auto; border-radius: 2rem; box-shadow: var(--shadow-lg); }
.vf-product__chip { position: absolute; padding: 0.5rem 0.95rem; color: var(--v900); background: rgba(255, 255, 255, 0.9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid #fff; border-radius: 999px; box-shadow: var(--shadow-md); font-size: 0.82rem; font-weight: 700; animation: vf-float 6s ease-in-out infinite; }
.vf-product__chip::before { content: ""; display: inline-block; width: 0.5rem; height: 0.5rem; margin-right: 0.45rem; border-radius: 50%; background: var(--sky); vertical-align: 0.05em; }
.vf-product__chip--1 { top: 12%; left: -6%; }
.vf-product__chip--2 { top: 46%; right: -8%; animation-delay: -2s; }
.vf-product__chip--3 { bottom: 10%; left: 4%; animation-delay: -4s; }

/* --------------------------------------------------------------------------
   Detailseiten: Auf einen Blick, Abschnitte, Listen
   -------------------------------------------------------------------------- */
.vf-glance { position: relative; display: grid; gap: 1rem; margin: 0; padding: 0; list-style: none; }
@media (min-width: 700px) { .vf-glance { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1140px) { .vf-glance { grid-template-columns: repeat(4, minmax(0, 1fr)); } .vf-glance:has(> :nth-child(5)) { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.vf-glance__item { padding: 1.6rem 1.5rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.vf-glance__item::after {
	content: "";
	position: absolute;
	top: -1px;
	left: 1.5rem;
	right: 1.5rem;
	height: 3px;
	border-radius: 3px;
	background: var(--grad);
	transform-origin: 0 50%;
	transition: transform 1s 0.3s var(--ease);
}
.js .vf-glance__item.vf-reveal:not(.is-in)::after { transform: scaleX(0); }
.vf-glance__num { display: block; margin-bottom: 1rem; color: var(--v300); font-family: var(--font-head); font-size: 2.2rem; line-height: 1; letter-spacing: -0.04em; }
.vf-glance__label { margin: 0 0 0.5rem; color: var(--v500); font-family: var(--font-body); font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; }
.vf-glance__item p { margin: 0; color: var(--text); font-size: 0.97rem; }

.vf-details { padding-bottom: clamp(2rem, 5vw, 3rem); }
.vf-detail { display: grid; gap: 1.2rem; padding: clamp(2.5rem, 6vw, 4rem) 0; border-top: 1px solid var(--line); }
@media (min-width: 960px) { .vf-detail { grid-template-columns: 5fr 7fr; gap: 4rem; } .vf-detail__head { position: sticky; top: calc(var(--hh) + 3rem); align-self: start; } }
.vf-detail__title { margin: 0; font-size: clamp(1.8rem, 1.3rem + 1.8vw, 2.8rem); letter-spacing: -0.035em; }
.vf-prose { font-size: 1.05rem; }
.vf-prose > :last-child { margin-bottom: 0; }
.vf-prose ul { padding-left: 1.2em; }
.vf-prose li { margin-bottom: 0.5em; }
.vf-prose__lead { color: var(--text); font-size: clamp(1.1rem, 1rem + 0.5vw, 1.35rem); line-height: 1.6; }
.vf-checks { margin: 0 0 1.2em; padding: 0 !important; list-style: none; }
.vf-checks li { display: flex; gap: 0.9rem; align-items: flex-start; margin-bottom: 0.9rem; }
.vf-checks__icon { display: grid; place-items: center; flex: none; width: 1.9rem; height: 1.9rem; margin-top: -0.05rem; color: #fff; background: var(--grad); border-radius: 50%; }
.vf-checks__icon .vf-icon { width: 1rem; height: 1rem; stroke-width: 2.4; }

.vf-next { padding: clamp(2rem, 5vw, 3rem) 0 clamp(3.5rem, 8vw, 5rem); }
.vf-next__link {
	position: relative;
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 0.3rem 1.5rem;
	padding-top: 2rem;
	color: var(--v900);
	text-decoration: none;
	border-top: 1px solid var(--line);
}
.vf-next__label { grid-column: 1 / -1; color: var(--muted); font-size: 0.8rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.vf-next__title {
	font-family: var(--font-head);
	font-size: clamp(2.2rem, 1.2rem + 4.5vw, 5.4rem);
	line-height: 1.05;
	letter-spacing: -0.045em;
	background: linear-gradient(90deg, var(--v500), var(--sky)) 0 0 / 0% 100% no-repeat, linear-gradient(var(--v900), var(--v900));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	transition: background-size 0.8s var(--ease);
}
.vf-next__link:hover { color: var(--v900); }
.vf-next__link:hover .vf-next__title { background-size: 100% 100%, auto; }
.vf-next__icon { display: grid; place-items: center; width: clamp(3.5rem, 6vw, 5rem); height: clamp(3.5rem, 6vw, 5rem); color: #fff; background: var(--v800); border-radius: 50%; transition: transform 0.6s var(--ease), background-color 0.3s; }
.vf-next__link:hover .vf-next__icon { background: var(--v600); transform: translateX(8px) rotate(-45deg); }

/* Seitlich scrollbare Kartenreihe */
.vf-rail-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; }
.vf-rail-head .vf-head { margin-bottom: 2rem; }
.vf-rail-nav { display: flex; gap: 0.5rem; margin-bottom: 2rem; }
.vf-rail-btn { display: grid; place-items: center; width: 3.2rem; height: 3.2rem; padding: 0; color: var(--v900); background: #fff; border: 1px solid var(--line); border-radius: 50%; cursor: pointer; transition: background-color 0.3s, color 0.3s, transform 0.3s var(--ease); }
.vf-rail-btn:hover { color: #fff; background: var(--v800); transform: scale(1.06); }
.vf-rail {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: min(20rem, 82vw);
	gap: 1rem;
	padding: 0.5rem 0.25rem 1.5rem;
	margin: 0 -0.25rem;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: thin;
	scroll-behavior: smooth;
}
.vf-rail > * { scroll-snap-align: start; }

/* Übersicht Therapien: Liste mit mitlaufender Vorschau */
.vf-index { position: relative; }
.vf-index__list { margin: 0; padding: 0; list-style: none; counter-reset: none; }
.vf-index__row {
	position: relative;
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 0.4rem 1.5rem;
	align-items: center;
	padding: clamp(1.4rem, 3vw, 2rem) 0;
	border-top: 1px solid var(--line);
	transition: background-color 0.4s;
}
.vf-index__row:last-child { border-bottom: 1px solid var(--line); }
.vf-index__num { color: var(--v300); font-family: var(--font-head); font-size: 1rem; }
.vf-index__title { margin: 0; font-size: clamp(1.6rem, 1.1rem + 2.2vw, 3.2rem); letter-spacing: -0.04em; transition: transform 0.6s var(--ease), color 0.3s; }
.vf-index__title a { color: inherit; text-decoration: none; }
.vf-index__title a::after { content: ""; position: absolute; inset: 0; }
.vf-index__text { grid-column: 2 / 3; max-width: 44rem; margin: 0; color: var(--muted); font-size: 0.95rem; }
.vf-index__go { grid-column: 3; grid-row: 1 / 3; display: grid; place-items: center; width: 3rem; height: 3rem; color: var(--v800); border: 1px solid var(--line); border-radius: 50%; transition: transform 0.5s var(--ease), background-color 0.3s, color 0.3s; }
.vf-index__row:hover .vf-index__title { color: var(--v600); transform: translateX(10px); }
.vf-index__row:hover .vf-index__go { color: #fff; background: var(--v800); transform: rotate(45deg); }
.vf-index__row:focus-within { outline: 3px solid var(--v500); outline-offset: 4px; border-radius: 6px; }
.vf-index__title a:focus-visible { outline: none; }
.vf-index__preview { position: fixed; left: 0; top: 0; z-index: 5; display: none; width: 15rem; height: 15rem; pointer-events: none; opacity: 0; scale: 0.6; transition: opacity 0.35s, scale 0.5s var(--ease); }
.vf-index__preview .vf-blob { inset: 0; width: 100%; height: 100%; }
.vf-index__icon { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; opacity: 0; transform: scale(0.6) rotate(-12deg); transition: opacity 0.3s, transform 0.5s var(--ease); }
.vf-index__icon .vf-icon { width: 34%; height: 34%; stroke-width: 1.4; }
.vf-index__icon.is-active { opacity: 1; transform: none; }
@media (hover: hover) and (pointer: fine) and (min-width: 1024px) {
	.js .vf-index__preview { display: block; }
	.vf-index.is-hovering .vf-index__preview { opacity: 1; scale: 1; }
}

.vf-duo { display: grid; gap: 1rem; }
@media (min-width: 900px) { .vf-duo { grid-template-columns: 1fr 1fr; gap: 1.25rem; } }

.vf-cloud { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; margin: 0; padding: 0; list-style: none; }
.vf-cloud--left { justify-content: flex-start; }
.vf-cloud li {
	padding: 0.6rem 1.15rem;
	color: var(--v800);
	background: #fff;
	border: 1px solid var(--line);
	border-radius: 999px;
	font-size: 0.95rem;
	transition: transform 0.4s var(--ease), border-color 0.3s, box-shadow 0.3s;
}
.vf-cloud li:hover { transform: translateY(-3px); border-color: var(--v300); box-shadow: var(--shadow-md); }
.vf-person .vf-cloud li { padding: 0.4rem 0.85rem; background: var(--v50); border-color: transparent; font-size: 0.88rem; }

/* --------------------------------------------------------------------------
   Preise, Zitat, Beratung, Buchung
   -------------------------------------------------------------------------- */
.vf-prices { display: grid; gap: 1rem; }
@media (min-width: 820px) { .vf-prices { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.25rem; } }
.vf-prices--single { grid-template-columns: minmax(0, 26rem) !important; justify-content: center; }
.vf-price {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: clamp(1.8rem, 3vw, 2.4rem);
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
	transition: transform 0.5s var(--ease), box-shadow 0.5s;
}
.vf-price:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.vf-price__name { margin: 0; color: var(--v500); font-family: var(--font-body); font-size: 0.82rem; letter-spacing: 0.12em; text-transform: uppercase; }
.vf-price__amount { margin: 0.8rem 0 1rem; color: var(--v900); font-family: var(--font-head); font-size: clamp(3.4rem, 2.4rem + 3vw, 5rem); line-height: 1; letter-spacing: -0.05em; font-variant-numeric: tabular-nums; }
.vf-price__text { color: var(--muted); }
.vf-price .vf-btn { margin-top: auto; }
.vf-price--glow::after {
	content: "";
	position: absolute;
	inset: -1px;
	padding: 2px;
	border-radius: inherit;
	background: conic-gradient(from var(--vf-angle), transparent 0deg 220deg, var(--sky) 300deg, var(--v500) 340deg, transparent 360deg);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
	animation: vf-angle 5s linear infinite;
	pointer-events: none;
}

.vf-quote { padding: clamp(5rem, 12vw, 9rem) 0; color: var(--v100); background: radial-gradient(90% 80% at 20% 0%, var(--v700), var(--v900)); }
.vf-quote figure { max-width: 60rem; margin: 0 auto; text-align: center; }
.vf-quote blockquote { margin: 0; }
.vf-quote__text { margin: 0; color: #fff; font-family: var(--font-head); font-size: clamp(1.8rem, 1rem + 3.2vw, 3.6rem); line-height: 1.2; letter-spacing: -0.035em; }
.vf-quote figcaption { margin-top: 1.8rem; color: var(--sky); font-weight: 700; }
.vf-consult__title { font-size: var(--fs-h2); letter-spacing: -0.035em; }
.vf-consult__text { max-width: 36rem; margin: 0 auto; color: var(--muted); font-size: 1.1rem; }
.vf-book { padding: clamp(2rem, 5vw, 3.5rem); text-align: center; background: linear-gradient(135deg, #fff, var(--v50)); border: 1px solid var(--line); border-radius: 2rem; }
.vf-book__title { font-size: clamp(1.8rem, 1.2rem + 2.4vw, 3rem); letter-spacing: -0.035em; }
.vf-book p { max-width: 36rem; margin-inline: auto; color: var(--muted); }

/* --------------------------------------------------------------------------
   Patienteninfos: Karten, Download, Fragen
   -------------------------------------------------------------------------- */
.vf-notice-wrap { padding-top: 2rem; }
.vf-notice {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.8rem 1.2rem;
	padding: 1.2rem 1.5rem;
	color: #1c1206;
	background: linear-gradient(90deg, #f59e0b, #f97316);
	border-radius: 1.2rem;
	box-shadow: var(--shadow-md);
}
.vf-notice::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(110deg, transparent 35%, rgba(255, 255, 255, 0.35) 50%, transparent 65%); transform: translateX(-120%); animation: vf-sheen 7s 1.5s ease-in-out infinite; }
.vf-notice p { flex: 1 1 22rem; margin: 0; }
.vf-notice strong { display: block; }
.vf-notice p span { display: block; margin-top: 0.2rem; font-size: 0.9rem; }
.vf-notice__label { padding: 0.2rem 0.6rem; color: #fbbf24; background: #1c1206; border-radius: 0.4rem; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }

.vf-cards { display: grid; gap: 1rem; }
@media (min-width: 860px) { .vf-cards { grid-template-columns: 1fr 1fr; gap: 1.25rem; } .vf-card--wide { grid-column: 1 / -1; } }
.vf-card { padding: clamp(1.6rem, 3vw, 2.2rem); background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.vf-card h3 { font-size: 1.3rem; }
.vf-card p, .vf-card li { color: var(--muted); }
.vf-card ul { padding-left: 1.2em; margin-bottom: 0; }
.vf-card > :last-child { margin-bottom: 0; }
.vf-card__icon { display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: 1.2rem; color: var(--v600); background: var(--v50); border-radius: 1rem; }
.vf-card--accent { border-left: 4px solid var(--v500); }

.vf-twocol { display: grid; gap: 2.5rem; align-items: start; }
@media (min-width: 960px) { .vf-twocol { grid-template-columns: 7fr 5fr; gap: 4rem; } }
.vf-download { padding: clamp(1.8rem, 3vw, 2.4rem); color: var(--v100); background: var(--grad); border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.vf-download h3 { color: #fff; font-size: 1.5rem; }
.vf-download p { color: var(--v100); }
.vf-download__icon { display: grid; place-items: center; width: 3.4rem; height: 3.4rem; margin-bottom: 1.2rem; color: #fff; background: rgba(255, 255, 255, 0.14); border-radius: 1.1rem; }
.vf-download .vf-btn--primary { background: #fff; color: var(--v900); }
.vf-download .vf-btn--primary .vf-btn__icon { background: var(--v800); color: #fff; }
.vf-download .vf-btn--primary::before { display: none; }

.vf-faq-grid { display: grid; gap: 2rem; }
@media (min-width: 960px) { .vf-faq-grid { grid-template-columns: 5fr 7fr; gap: 4rem; } .vf-faq-grid > .vf-head { position: sticky; top: calc(var(--hh) + 3rem); align-self: start; } }
.vf-faq { display: grid; gap: 0.75rem; }
.vf-faq__item { background: #fff; border: 1px solid var(--line); border-radius: 1.2rem; transition: border-color 0.3s, box-shadow 0.3s; }
.vf-faq__item[open] { border-color: var(--v200); box-shadow: var(--shadow-md); }
.vf-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.4rem; color: var(--v900); font-weight: 700; cursor: pointer; list-style: none; border-radius: 1.2rem; }
.vf-faq__item summary::-webkit-details-marker { display: none; }
.vf-faq__item summary:hover { color: var(--v600); }
.vf-faq__plus { position: relative; flex: none; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: var(--v50); transition: background-color 0.3s, transform 0.5s var(--ease); }
.vf-faq__plus::before, .vf-faq__plus::after { content: ""; position: absolute; left: 50%; top: 50%; width: 0.9rem; height: 2px; margin: -1px 0 0 -0.45rem; border-radius: 2px; background: var(--v700); transition: transform 0.5s var(--ease); }
.vf-faq__plus::after { transform: rotate(90deg); }
.vf-faq__item[open] .vf-faq__plus { background: var(--v800); transform: rotate(180deg); }
.vf-faq__item[open] .vf-faq__plus::before, .vf-faq__item[open] .vf-faq__plus::after { background: #fff; }
.vf-faq__item[open] .vf-faq__plus::after { transform: rotate(0deg); }
.vf-faq__answer { padding: 0 1.4rem 1.3rem; color: var(--muted); }
.vf-faq__answer p { margin: 0; }
@supports selector(::details-content) {
	.vf-faq__item::details-content { block-size: 0; overflow-y: clip; transition: block-size 0.5s var(--ease), content-visibility 0.5s allow-discrete; }
	.vf-faq__item[open]::details-content { block-size: auto; }
}
@supports (interpolate-size: allow-keywords) { :root { interpolate-size: allow-keywords; } }

/* --------------------------------------------------------------------------
   Kontakt: Karten und Formular
   -------------------------------------------------------------------------- */
.vf-contact { display: grid; gap: 2rem; align-items: start; }
@media (min-width: 1024px) { .vf-contact { grid-template-columns: 5fr 7fr; gap: 3rem; } }
.vf-contact__info { display: grid; gap: 1rem; }
.vf-contactcard {
	display: grid;
	gap: 0.15rem;
	padding: 1.5rem 1.6rem;
	color: var(--text);
	background: #fff;
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow-sm);
	text-decoration: none;
	transition: transform 0.5s var(--ease), box-shadow 0.5s;
}
a.vf-contactcard:hover { color: var(--text); transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.vf-contactcard__icon { display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: 0.8rem; color: var(--v600); background: var(--v50); border-radius: 1rem; }
.vf-contactcard--phone { color: #fff; background: var(--grad); border-color: transparent; }
.vf-contactcard--phone .vf-contactcard__icon { color: #fff; background: rgba(255, 255, 255, 0.16); }
.vf-contactcard--phone .vf-contactcard__label, .vf-contactcard--phone .vf-contactcard__hint { color: var(--v100); }
a.vf-contactcard--phone:hover { color: #fff; }
.vf-contactcard__label { color: var(--v500); font-size: 0.76rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.vf-contactcard__value { font-family: var(--font-head); font-size: clamp(1.4rem, 1.1rem + 1.4vw, 2.1rem); line-height: 1.2; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.vf-contactcard__value a { color: inherit; text-decoration: none; }
.vf-contactcard__hint { color: var(--muted); font-size: 0.9rem; }
.vf-contactcard .vf-hours { margin-top: 0.4rem; }
.vf-contact__text { padding: 0.5rem 0.25rem; }
.vf-contact__title { font-size: 1.6rem; }
.vf-contact__text p { color: var(--muted); font-size: 0.98rem; }

.vf-formcard { padding: clamp(1.6rem, 4vw, 2.8rem); background: rgba(255, 255, 255, 0.85); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border: 1px solid #fff; border-radius: 2rem; box-shadow: var(--shadow-lg); }
.vf-formcard__title { font-size: clamp(1.8rem, 1.3rem + 2vw, 2.8rem); letter-spacing: -0.035em; margin-bottom: 0.4rem; }
.vf-formcard__text { color: var(--muted); }
.vital-form-wrap { margin-top: 1.6rem; scroll-margin-top: calc(var(--hh) + 2rem); }
.vital-form { display: grid; gap: 1.1rem; }
.vital-field-row { display: grid; gap: 1.1rem; }
@media (min-width: 640px) { .vital-field-row { grid-template-columns: 1fr 1fr; } }
.vital-field { display: flex; flex-direction: column; gap: 0.4rem; }
.vital-field label { color: var(--v900); font-size: 0.92rem; font-weight: 700; }
.vital-form :is(input[type="text"], input[type="email"], input[type="tel"], select, textarea) {
	width: 100%;
	padding: 0.95rem 1.1rem;
	color: var(--text);
	background: #fff;
	border: 1.5px solid var(--line);
	border-radius: 1rem;
	font: inherit;
	transition: border-color 0.25s, box-shadow 0.25s, background-color 0.25s;
}
.vital-form :is(input, select, textarea):hover { border-color: var(--v200); }
.vital-form :is(input, select, textarea):focus-visible { outline: none; border-color: var(--v500); box-shadow: 0 0 0 5px rgba(59, 110, 148, 0.16); }
.vital-form textarea { min-height: 10rem; resize: vertical; }
.vital-form [aria-invalid="true"], .vital-form .is-invalid { border-color: var(--error); }
.vital-form :is(input, textarea).is-valid { border-color: var(--ok); }
.vital-field--check { display: grid; grid-template-columns: auto 1fr; column-gap: 0.85rem; align-items: start; }
.vital-field--check input { width: 1.35rem; height: 1.35rem; margin-top: 0.2rem; accent-color: var(--v600); }
.vital-field--check label { color: var(--muted); font-size: 0.9rem; font-weight: 400; line-height: 1.55; }
.vital-field--check .vital-field-error { grid-column: 2; }
.vital-form-hint { margin: 0; color: var(--muted); font-size: 0.9rem; }
.vital-form-hint--care { padding: 0.9rem 1.1rem; color: var(--text); background: var(--v50); border-left: 4px solid var(--v400); border-radius: 0 1rem 1rem 0; }
.vital-field-error { margin: 0; color: var(--error); font-size: 0.9rem; font-weight: 700; }
.vital-form-errors, .vital-form-success { margin-bottom: 1.2rem; padding: 1.1rem 1.3rem; border-radius: 1rem; }
.vital-form-errors { color: #5f1410; background: #fdecea; border-left: 5px solid var(--error); }
.vital-form-success { position: relative; padding-left: 4.4rem; background: var(--v50); border-left: 5px solid var(--v500); animation: vf-rise 0.6s var(--ease) both; }
.vital-form-success::before { content: ""; position: absolute; left: 1.2rem; top: 1.15rem; width: 2.3rem; height: 2.3rem; border-radius: 50%; background: var(--grad); animation: vf-pop 0.5s 0.15s var(--ease) both; }
.vital-form-success::after { content: ""; position: absolute; left: 2.05rem; top: 1.6rem; width: 0.55rem; height: 1rem; border-right: 3px solid #fff; border-bottom: 3px solid #fff; transform: rotate(45deg); animation: vf-pop 0.4s 0.45s var(--ease) both; }
.vital-form-errors p, .vital-form-success p { margin: 0.3em 0 0; }
.vital-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.vital-form .vital-button {
	justify-self: start;
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	min-height: 3.4rem;
	padding: 0.8rem 1.8rem;
	color: #fff;
	background: var(--v800);
	border: 0;
	border-radius: 999px;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 12px 30px rgba(15, 41, 66, 0.25);
	transition: background-color 0.3s, transform 0.35s var(--ease);
}
.vital-form .vital-button:hover { background: var(--v600); transform: translateY(-2px); }
.vital-form .vital-button.is-loading::before { content: ""; width: 1rem; height: 1rem; border: 2px solid rgba(255, 255, 255, 0.35); border-top-color: #fff; border-radius: 50%; animation: vf-spin 0.7s linear infinite; }
.vf-counter { margin: 0.1rem 0 0; color: var(--muted); font-size: 0.8rem; text-align: right; font-variant-numeric: tabular-nums; }
.vf-counter.is-near { color: var(--error); font-weight: 700; }

/* --------------------------------------------------------------------------
   Rechtstexte mit Inhaltsverzeichnis
   -------------------------------------------------------------------------- */
.vf-doc { display: grid; gap: 2rem; padding: clamp(3rem, 7vw, 5rem) 0 clamp(4rem, 8vw, 6rem); }
@media (min-width: 1140px) { .vf-doc:has(.vf-toc:not([hidden])) { grid-template-columns: 17rem minmax(0, 1fr); gap: 4rem; } }
.vf-doc__body { max-width: 48rem; }
.vf-doc__body h2 { margin-top: 2.4em; font-size: clamp(1.35rem, 1.15rem + 0.8vw, 1.75rem); scroll-margin-top: calc(var(--hh) + 2rem); }
.vf-doc__body > :first-child { margin-top: 0; }
.vf-doc__body .page-lead { color: var(--text); font-size: 1.25rem; }
.vf-doc__body .vital-legal-highlight { padding: 1.1rem 1.3rem; background: #fff; border-left: 4px solid var(--v500); border-radius: 0 1rem 1rem 0; box-shadow: var(--shadow-sm); }
.vf-toc { position: sticky; top: calc(var(--hh) + 2.5rem); align-self: start; display: none; padding: 1.4rem; background: #fff; border: 1px solid var(--line); border-radius: 1.2rem; }
@media (min-width: 1140px) { .vf-toc:not([hidden]) { display: block; } }
.vf-toc__title { margin: 0 0 0.8rem; color: var(--v500); font-size: 0.76rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.vf-toc__list { margin: 0; padding: 0; list-style: none; font-size: 0.88rem; }
.vf-toc__list a { position: relative; display: block; padding: 0.35rem 0 0.35rem 0.9rem; color: var(--muted); text-decoration: none; border-left: 2px solid var(--line); transition: color 0.25s, border-color 0.25s; }
.vf-toc__list a:hover { color: var(--v700); }
.vf-toc__list a.is-active { color: var(--v900); font-weight: 700; border-left-color: var(--v500); }

/* --------------------------------------------------------------------------
   Termin-Aufruf, Fehlerseite
   -------------------------------------------------------------------------- */
.vf-cta { padding: clamp(3rem, 7vw, 5rem) 0 clamp(4rem, 9vw, 7rem); }
.vf-cta__card {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: clamp(2.4rem, 6vw, 5rem);
	color: var(--v100);
	background: radial-gradient(90% 90% at 10% 0%, var(--v600) 0%, var(--v800) 50%, var(--v900) 100%);
	border-radius: 2.2rem;
	box-shadow: var(--shadow-lg);
}
.vf-cta__glow { position: absolute; left: var(--mx, 70%); top: var(--my, 30%); z-index: -1; width: 36rem; height: 36rem; margin: -18rem 0 0 -18rem; border-radius: 50%; background: radial-gradient(circle, rgba(108, 180, 224, 0.35), transparent 65%); transition: left 0.8s var(--ease), top 0.8s var(--ease); pointer-events: none; }
.vf-cta .vf-eyebrow { color: var(--sky); }
.vf-cta__title { max-width: 18ch; color: #fff; font-size: var(--fs-h2); letter-spacing: -0.04em; }
.vf-cta__card p { max-width: 36rem; color: var(--v200); font-size: 1.1rem; }

.vf-404 { position: relative; isolation: isolate; overflow: hidden; min-height: 80svh; display: grid; align-items: center; padding: calc(var(--hh) + 4rem) 0 4rem; text-align: center; }
.vf-404__code { margin: 0; font-family: var(--font-head); font-size: clamp(7rem, 4rem + 18vw, 18rem); line-height: 0.9; letter-spacing: -0.06em; color: transparent; -webkit-text-stroke: 2px var(--v300); animation: vf-float 6s ease-in-out infinite; }
.vf-404__title { font-size: var(--fs-h2); }
.vf-404__text { color: var(--muted); }

/* --------------------------------------------------------------------------
   Fußbereich und mobile Schnellleiste
   -------------------------------------------------------------------------- */
.vf-footer { position: relative; overflow: hidden; padding: clamp(4rem, 9vw, 6rem) 0 0; color: var(--v200); background: var(--v900); font-size: 0.95rem; }
.vf-footer a:not(.vf-btn) { color: #fff; }
.vf-footer a:not(.vf-btn):hover { color: var(--sky); }
.vf-footer__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; padding-bottom: clamp(2.5rem, 6vw, 4rem); border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.vf-footer__claim { margin: 0; color: #fff; font-family: var(--font-head); font-size: clamp(2rem, 1.2rem + 3.4vw, 4rem); line-height: 1.05; letter-spacing: -0.04em; }
.vf-footer__grid { display: grid; gap: 2.2rem; padding: clamp(2.5rem, 6vw, 4rem) 0; }
@media (min-width: 720px) { .vf-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .vf-footer__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 3rem; } }
.vf-footer__title { margin: 0 0 1rem; color: var(--sky); font-family: var(--font-body); font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; }
.vf-footer .vital-address { color: var(--v100); }
.vf-footer .vital-address strong { color: #fff; }
.vf-footer .vf-hours__row { border-bottom-color: rgba(255, 255, 255, 0.1); }
.vf-footer .vf-hours dt { color: var(--v200); }
.vf-footer .vf-hours dd { color: #fff; }
.vf-footer .vf-hours .is-closed :is(dt, dd) { color: var(--v300); }
.vf-footer .vf-hours .is-today { background: linear-gradient(90deg, rgba(108, 180, 224, 0.18), transparent 85%); }
.vf-footer .vf-hours .is-today dt { color: #fff; }
.vf-footer .vf-today { color: var(--v900); background: var(--sky); }
.vf-footer__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.8rem 2rem; padding: 1.4rem 0; border-top: 1px solid rgba(255, 255, 255, 0.1); font-size: 0.85rem; }
.vf-footer__bar p { margin: 0; }
.vf-footer__bar ul { display: flex; gap: 1.5rem; margin: 0; padding: 0; list-style: none; font-weight: 700; }
@media (min-width: 560px) { .vf-footer__bar { padding-right: 4.5rem; } }
.vf-footer__mark {
	height: 0.72em;
	margin: 0;
	overflow: hidden;
	font-family: var(--font-head);
	font-size: clamp(5rem, 24vw, 22rem);
	line-height: 1;
	letter-spacing: 0.04em;
	text-align: center;
	background: radial-gradient(22rem circle at var(--mx, 50%) var(--my, 120%), rgba(108, 180, 224, 0.6), transparent 70%), linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.02));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	-webkit-user-select: none;
	user-select: none;
}

.vf-quickbar { display: none; }
@media (max-width: 767px) {
	.vf-quickbar {
		position: fixed;
		left: 0.6rem;
		right: 0.6rem;
		bottom: calc(0.6rem + env(safe-area-inset-bottom, 0px));
		z-index: 55;
		display: grid;
		grid-template-columns: 1.3fr 1fr 1fr;
		gap: 0.4rem;
		padding: 0.4rem;
		background: rgba(255, 255, 255, 0.86);
		-webkit-backdrop-filter: blur(16px);
		backdrop-filter: blur(16px);
		border: 1px solid #fff;
		border-radius: 1.4rem;
		box-shadow: 0 16px 40px rgba(15, 41, 66, 0.2);
		animation: vf-slideup 0.7s 0.6s var(--ease) both;
	}
	.vf-quickbar a { display: flex; align-items: center; justify-content: center; gap: 0.4rem; padding: 0.8rem 0.4rem; color: var(--v900); font-size: 0.82rem; font-weight: 700; text-decoration: none; border-radius: 1rem; background: var(--v50); }
	.vf-quickbar a .vf-icon { width: 1.05rem; height: 1.05rem; }
	.vf-quickbar__call { color: #fff !important; background: var(--v800) !important; }
	body { padding-bottom: 5.4rem; }
	.vf-footer__bar { padding-bottom: 2rem; }
}

/* --------------------------------------------------------------------------
   Einblenden, Wortmasken, Zeichnen (Klassen setzt flow.js)
   -------------------------------------------------------------------------- */
.js .vf-reveal { opacity: 0; translate: 0 28px; transition: opacity 0.9s var(--ease), translate 1s var(--ease), scale 1s var(--ease); transition-delay: var(--d, 0ms); }
.js .vf-reveal[data-anim="zoom"] { translate: 0 30px; scale: 0.94; }
.js .vf-reveal[data-anim="left"] { translate: -40px 0; }
.js .vf-reveal[data-anim="right"] { translate: 40px 0; }
.js .vf-reveal[data-anim="clip"] { opacity: 1; translate: 0 0; clip-path: inset(0 0 100% 0 round var(--radius)); transition: clip-path 1.2s var(--ease); }
.js .vf-reveal.is-in { opacity: 1; translate: 0 0; scale: 1; }
.js .vf-reveal[data-anim="clip"].is-in { clip-path: inset(0 0 0 0 round var(--radius)); }

.vf-split .vf-w { display: inline-block; overflow: hidden; vertical-align: top; padding-block: 0.12em 0.16em; margin-block: -0.12em -0.16em; }
.vf-split .vf-w > span { display: inline-block; transform: translateY(115%); transition: transform 1.1s var(--ease); transition-delay: calc(var(--w, 0) * 50ms + 80ms); }
.vf-split.is-in .vf-w > span { transform: none; }

.js .vf-eyebrow:not(.is-in)::before { transform: scaleX(0); }
.js .vf-draw:not(.is-in) .vf-icon path { stroke-dashoffset: 1; }
.js .vf-draw .vf-icon path { stroke-dasharray: 1; transition: stroke-dashoffset 1.4s var(--ease); transition-delay: calc(var(--d, 0ms) + 200ms); }
.js .vf-draw.is-in .vf-icon path { stroke-dashoffset: 0; }

.js .vf-stagger > * { opacity: 0; translate: 0 18px; transition: opacity 0.7s var(--ease), translate 0.8s var(--ease); transition-delay: calc(var(--s, 0) * 60ms + 100ms); }
.js .vf-stagger.is-in > * { opacity: 1; translate: 0 0; }

/* Mauszeiger-Effekt (nur Computer mit Maus, nur wenn eingeschaltet) */
.vf-cursor, .vf-cursor-dot { position: fixed; left: 0; top: 0; z-index: 1150; pointer-events: none; border-radius: 50%; opacity: 0; transition: opacity 0.3s, width 0.35s var(--ease), height 0.35s var(--ease), margin 0.35s var(--ease), background-color 0.3s, border-color 0.3s; }
.vf-cursor { width: 2.4rem; height: 2.4rem; margin: -1.2rem 0 0 -1.2rem; border: 1.5px solid rgba(59, 110, 148, 0.55); }
.vf-cursor-dot { width: 0.4rem; height: 0.4rem; margin: -0.2rem 0 0 -0.2rem; background: var(--v600); }
.vf-cursor.is-visible, .vf-cursor-dot.is-visible { opacity: 1; }
.vf-cursor.is-link { width: 4rem; height: 4rem; margin: -2rem 0 0 -2rem; background: rgba(108, 180, 224, 0.14); border-color: transparent; }
.vf-cursor.is-dark { border-color: rgba(255, 255, 255, 0.6); }
.vf-cursor.is-dark + .vf-cursor-dot, .vf-cursor-dot.is-dark { background: #fff; }

/* Lesefortschritt und „Nach oben“ */
.vf-progress { position: fixed; left: 0; right: 0; top: 0; z-index: 70; height: 3px; background: var(--grad); transform: scaleX(0); transform-origin: 0 50%; pointer-events: none; }
.admin-bar .vf-progress { top: 32px; }
@media (max-width: 782px) { .admin-bar .vf-progress { top: 46px; } }
.vf-totop {
	position: fixed;
	right: max(1rem, env(safe-area-inset-right, 0px));
	bottom: 1.25rem;
	z-index: 55;
	display: grid;
	place-items: center;
	width: 3.4rem;
	height: 3.4rem;
	padding: 0;
	color: var(--v900);
	background: rgba(255, 255, 255, 0.92);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border: 0;
	border-radius: 50%;
	box-shadow: var(--shadow-lg);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(14px) scale(0.85);
	transition: opacity 0.35s var(--ease), transform 0.35s var(--ease), visibility 0s 0.35s;
}
.vf-totop.is-visible { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.vf-totop:focus-visible { border-radius: 50%; }
.vf-totop svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.vf-totop__track { fill: none; stroke: var(--line); stroke-width: 3; }
.vf-totop__ring { fill: none; stroke: var(--v500); stroke-width: 3; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; }
.vf-totop .vf-icon { width: 1.2rem; height: 1.2rem; transform: rotate(-90deg); }
@media (max-width: 767px) { .vf-totop { bottom: calc(6.4rem + env(safe-area-inset-bottom, 0px)); width: 3rem; height: 3rem; } }

/* Seitenübergänge (moderne Browser) */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: 0.25s ease both vf-vt-out; }
::view-transition-new(root) { animation: 0.55s var(--ease) both vf-vt-in; }

/* --------------------------------------------------------------------------
   Animationen
   -------------------------------------------------------------------------- */
@keyframes vf-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes vf-pop { from { opacity: 0; scale: 0.5; } to { opacity: 1; scale: 1; } }
@keyframes vf-spin { to { transform: rotate(360deg); } }
@keyframes vf-angle { to { --vf-angle: 360deg; } }
@keyframes vf-draw { to { stroke-dashoffset: 0; } }
@keyframes vf-ecg { 0% { stroke-dashoffset: 1; } 100% { stroke-dashoffset: -0.35; } }
@keyframes vf-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(59, 110, 148, 0.4); } 50% { box-shadow: 0 0 0 7px rgba(59, 110, 148, 0); } }
@keyframes vf-shine { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes vf-grad { 0%, 100% { background-position: 0% 0; } 50% { background-position: 100% 0; } }
@keyframes vf-sheen { 0% { transform: translateX(-120%); } 22%, 100% { transform: translateX(120%); } }
@keyframes vf-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes vf-wiggle { 0%, 100% { transform: rotate(0); } 20% { transform: rotate(-14deg); } 40% { transform: rotate(12deg); } 60% { transform: rotate(-8deg); } 80% { transform: rotate(4deg); } }
@keyframes vf-bounce { 0%, 100% { transform: translateY(0); } 40% { transform: translateY(3px); } 70% { transform: translateY(-2px); } }
@keyframes vf-cue { 0% { transform: translateY(-110%); } 100% { transform: translateY(260%); } }
@keyframes vf-slideup { from { transform: translateY(140%); } to { transform: none; } }
@keyframes vf-drift1 { to { transform: translate(8rem, 5rem) scale(1.1); } }
@keyframes vf-drift2 { to { transform: translate(-7rem, -5rem) scale(1.12); } }
@keyframes vf-drift3 { to { transform: translate(-6rem, 4rem) scale(0.9); } }
@keyframes vf-impulse { 0% { background-position: -60% 141px, -45% 329px; } 100% { background-position: 260% 141px, 240% 329px; } }
@keyframes vf-morph {
	0%, 100% { d: path("M370.0 200.0C369.4 243.0 340.1 271.7 306.1 306.1C272.1 340.5 243.6 370.9 200.0 372.0C156.4 373.1 121.9 346.1 88.3 311.7C54.7 277.3 30.3 243.0 32.0 200.0C33.7 157.0 63.2 132.0 96.8 96.8C130.4 61.6 157.6 25.1 200.0 24.0C242.4 22.9 274.9 55.9 308.9 91.1C342.9 126.3 370.6 157.0 370.0 200.0Z"); }
	33% { d: path("M356.2 223.6C349.8 271.6 339.0 315.1 303.3 340.0C267.5 365.0 225.6 356.1 177.6 348.3C129.6 340.5 89.1 335.2 63.2 300.9C37.2 266.6 41.3 225.5 47.7 177.0C54.2 128.5 60.7 83.0 95.5 58.3C130.4 33.7 174.2 45.3 222.1 53.7C270.1 62.1 308.4 66.3 335.2 100.3C362.0 134.3 362.6 175.7 356.2 223.6Z"); }
	66% { d: path("M375.1 182.4C377.5 228.8 352.5 262.6 320.8 298.7C289.0 334.9 262.8 355.7 216.4 363.2C169.9 370.7 121.7 365.9 88.6 336.3C55.5 306.6 54.2 263.2 50.7 215.0C47.3 166.7 44.8 129.4 71.5 94.9C98.2 60.5 136.7 48.4 184.2 42.8C231.7 37.2 270.7 38.9 308.9 66.8C347.1 94.8 372.7 136.0 375.1 182.4Z"); }
}
@keyframes vf-splash-out {
	0% { transform: none; }
	100% { transform: translateY(-100%); border-bottom-left-radius: 50% 7rem; border-bottom-right-radius: 50% 7rem; visibility: hidden; }
}
@keyframes vf-splash-logo { from { opacity: 0; transform: scale(0.92); filter: blur(8px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes vf-splash-fill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes vf-vt-out { to { opacity: 0; transform: scale(0.985); } }
@keyframes vf-vt-in { from { opacity: 0; transform: translateY(14px); } }

/* --------------------------------------------------------------------------
   Bewegung reduzieren, Drucken
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.vf-swoosh path, .vf-phero__icon .vf-icon path { stroke-dashoffset: 0; }
	.vf-hero__text { translate: none; opacity: 1; }
	.js .vf-reveal, .js .vf-stagger > * { opacity: 1; translate: 0 0; scale: 1; clip-path: none; }
	::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
@media (prefers-reduced-motion: reduce) {
	@view-transition { navigation: none; }
}
@media print {
	.vf-header, .vf-topnotice, .vf-menu, .vf-quickbar, .vf-progress, .vf-totop, .vf-cursor, .vf-cursor-dot, .vf-splash, .vf-flowline, .vf-marquee, .vf-orbit, .vf-hero__bg, .vf-phero__bg, .vf-footer__mark { display: none !important; }
	body { background: #fff; font-size: 11pt; }
	.js .vf-reveal, .js .vf-stagger > * { opacity: 1 !important; translate: none !important; scale: 1 !important; clip-path: none !important; }
	.vf-split .vf-w > span { transform: none !important; }
	.vf-lit .vf-l { opacity: 1 !important; }
	.vf-section--dark, .vf-quote, .vf-cta__card, .vf-footer { color: #000; background: #fff; }
}

/* --------------------------------------------------------------------------
   Einstiegs-Animationen beim Laden (warten während des Logo-Intros)
   -------------------------------------------------------------------------- */
.vf-hero__text > :not(h1),
.vf-phero__text > :not(h1) { animation: vf-rise 0.9s var(--ease) both; }
.vf-hero__text > :nth-child(1), .vf-phero__text > :nth-child(1) { animation-delay: 0.05s; }
.vf-hero__text > :nth-child(3), .vf-phero__text > :nth-child(3) { animation-delay: 0.45s; }
.vf-hero__text > :nth-child(4), .vf-phero__text > :nth-child(4) { animation-delay: 0.6s; }
.vf-hero__text > :nth-child(5), .vf-phero__text > :nth-child(5) { animation-delay: 0.75s; }
.vf-orbit { animation: vf-orbit-in 1.6s 0.25s var(--ease) both; }
.vf-phero__visual, .vf-phero__media { animation: vf-orbit-in 1.4s 0.2s var(--ease) both; }
.vf-scrollcue { animation: vf-rise 1s 1.2s var(--ease) both; }
@keyframes vf-orbit-in { from { opacity: 0; transform: scale(0.82) rotate(-8deg); } to { opacity: 1; transform: none; } }

/* Überschriften werden von flow.js in Wörter zerlegt; bis dahin unsichtbar.
   Sicherung: Falls das Skript nicht läuft, erscheinen sie nach 1,6 Sekunden. */
.js [data-split]:not(.vf-split) { opacity: 0; animation: vf-unhide 0s 1.6s forwards; }
@keyframes vf-unhide { to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .js [data-split] { opacity: 1 !important; } }

.vf-main--front .vf-closing { background: transparent; }

/* Leitsatz: Farbverlauf des Akzents liegt nach dem Zerlegen auf den einzelnen Wörtern */
.vf-lit .vf-statement__accent { background: none; color: inherit; }
.vf-lit .vf-statement__accent .vf-l > span { background: var(--grad-text); -webkit-background-clip: text; background-clip: text; color: transparent; }