/*
 * verticus editorial - Komponenten der neu gebauten Templates.
 *
 * Gilt fuer Kopfbereich, Startseite und Artikelseite (navbar.php, home.php,
 * page.php). Alles andere - Rechner, Partnersuche, Grounding-Seiten - laeuft
 * weiter ueber style.css und nimmt die neue Farbwelt ueber die Tokens mit.
 *
 * Mobile-first. Drei Breakpoints: 48rem, 64rem, 80rem.
 * Jede Farbe, Groesse, jeder Abstand kommt aus tokens.css.
 */

/* ===================================================================
 * Grundbausteine
 * =================================================================== */

.vtc-ed-skip {
	position: absolute;
	left: -9999px;
	z-index: 100;
	padding: var(--vtc-sp-3) var(--vtc-sp-4);
	border-radius: var(--vtc-radius);
	background: var(--vtc-action);
	color: var(--vtc-action-ink);
	font-size: var(--vtc-fs-sm);
	font-weight: var(--vtc-fw-semi);
}

.vtc-ed-skip:focus {
	left: var(--vtc-sp-4);
	top: var(--vtc-sp-4);
	color: var(--vtc-action-ink);
}

.vtc-ed-wrap {
	width: 100%;
	max-width: var(--vtc-wrap);
	margin-inline: auto;
	padding-inline: var(--vtc-gutter);
}

.vtc-ed-eyebrow {
	display: flex;
	align-items: center;
	gap: var(--vtc-sp-2);
	margin: 0;
	color: var(--vtc-ink-3);
	font-size: var(--vtc-fs-eyebrow);
	font-weight: var(--vtc-fw-semi);
	letter-spacing: var(--vtc-track-eyebrow);
	text-transform: uppercase;
}

.vtc-ed-eyebrow--warm { color: var(--vtc-eyebrow); }
.vtc-ed-eyebrow--action { color: var(--vtc-action); }
.vtc-ed-eyebrow--onDark { color: var(--vtc-on-dark-2); }
.vtc-ed-eyebrow--standalone { margin-bottom: var(--vtc-sp-5); }

.vtc-ed-lead {
	margin: 0;
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-lead);
	line-height: 1.55;
	max-width: 34em;
}

.vtc-ed-textlink {
	display: inline-flex;
	align-items: center;
	gap: var(--vtc-sp-2);
	font-size: var(--vtc-fs-ui);
	font-weight: var(--vtc-fw-semi);
	text-decoration: none;
}

.vtc-ed-textlink:hover { text-decoration: underline; }

.vtc-ed-empty {
	margin: 0;
	color: var(--vtc-ink-2);
}

.vtc-ed-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	border-radius: var(--vtc-radius-pill);
	background: var(--vtc-tint);
	color: var(--vtc-ink-2);
	font-family: var(--vtc-font-display);
	font-size: var(--vtc-fs-sm);
	font-weight: var(--vtc-fw-display);
	letter-spacing: 0;
}

.vtc-ed-stars {
	color: var(--vtc-rating);
	letter-spacing: .06em;
}


/* ===================================================================
 * Aktionen
 * =================================================================== */

.vtc-ed-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--vtc-sp-2);
	min-height: 48px;
	padding: var(--vtc-sp-3) var(--vtc-sp-5);
	border: 1px solid transparent;
	border-radius: var(--vtc-radius);
	font-size: var(--vtc-fs-ui);
	font-weight: var(--vtc-fw-semi);
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.vtc-ed-btn:hover { text-decoration: none; }
.vtc-ed-btn .vtc-icon { font-size: 1.05em; }

.vtc-ed-btn--primary {
	background: var(--vtc-action);
	color: var(--vtc-action-ink);
}

.vtc-ed-btn--primary:hover {
	background: var(--vtc-action-hover);
	box-shadow: var(--vtc-shadow-2);
	color: var(--vtc-action-ink);
}

.vtc-ed-btn--outline {
	border-color: var(--vtc-line-2);
	background: var(--vtc-surface);
	color: var(--vtc-ink);
}

.vtc-ed-btn--outline:hover {
	border-color: var(--vtc-action);
	color: var(--vtc-action);
}

.vtc-ed-btn--onDark {
	background: var(--vtc-surface);
	color: var(--vtc-anchor);
}

.vtc-ed-btn--onDark:hover {
	background: var(--vtc-tint);
	color: var(--vtc-anchor);
}

.vtc-ed-btn--block {
	width: 100%;
}


/* ===================================================================
 * Kopfbereich
 * =================================================================== */

.vtc-ed-header {
	position: sticky;
	top: 0;
	z-index: 1030;
	background: var(--vtc-surface);
	border-bottom: 1px solid var(--vtc-line);

	/* Das Element traegt zusaetzlich .vtc-header, damit theme.js Klicks im
	 * Kopfbereich erkennt. Aus dieser Altregel kommen aber Seitenkanten und
	 * ab 1200px ein "width: calc(100% - 12px)" - hier zurueckgesetzt. */
	width: auto;
	margin: 0;
	border-top: 0;
	border-right: 0;
	border-left: 0;
	border-radius: 0;
}

.vtc-ed-header__inner {
	display: flex;
	align-items: center;
	gap: var(--vtc-sp-4);
	width: 100%;
	max-width: var(--vtc-wrap);
	min-height: 60px;
	margin-inline: auto;
	padding-inline: var(--vtc-gutter);
}

.vtc-ed-brand {
	display: inline-flex;
	align-items: center;
	margin-right: auto;
}

.vtc-ed-brand img {
	width: auto;
	height: 40px;
	max-width: 140px;
	object-fit: contain;
}

.vtc-ed-burger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin-right: calc(var(--vtc-sp-3) * -1);
	padding: 0;
	border: 0;
	background: none;
	color: var(--vtc-ink);
	cursor: pointer;
}

.vtc-ed-burger__bars,
.vtc-ed-burger__bars::before,
.vtc-ed-burger__bars::after {
	display: block;
	width: 22px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
}

.vtc-ed-burger__bars {
	position: relative;
}

.vtc-ed-burger__bars::before,
.vtc-ed-burger__bars::after {
	position: absolute;
	left: 0;
	content: "";
}

.vtc-ed-burger__bars::before { top: -7px; }
.vtc-ed-burger__bars::after { top: 7px; }

.vtc-ed-nav {
	display: none;
}

.vtc-ed-nav.is-open {
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-5);
	max-height: calc(100dvh - 60px);
	overflow-y: auto;
	padding: var(--vtc-sp-5) var(--vtc-gutter) var(--vtc-sp-7);
	border-bottom: 1px solid var(--vtc-line);
	background: var(--vtc-surface);
	box-shadow: var(--vtc-shadow-3);
}

.vtc-ed-nav__list {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-1);
	margin: 0;
	padding: 0;
	list-style: none;
}

.vtc-ed-nav__link {
	display: flex;
	align-items: center;
	gap: var(--vtc-sp-2);
	width: 100%;
	min-height: 48px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--vtc-ink);
	font-family: inherit;
	font-size: var(--vtc-fs-base);
	font-weight: var(--vtc-fw-medium);
	text-align: left;
	text-decoration: none;
	cursor: pointer;
}

.vtc-ed-nav__link:hover,
.vtc-ed-nav__item.is-active > .vtc-ed-nav__link {
	color: var(--vtc-action);
}

.vtc-ed-nav__chevron {
	transition: transform .15s ease;
}

.vtc-ed-nav__link[aria-expanded="true"] .vtc-ed-nav__chevron {
	transform: rotate(180deg);
}

.vtc-ed-dropdown {
	display: flex;
	flex-direction: column;
	margin: 0 0 var(--vtc-sp-3);
	padding: 0 0 0 var(--vtc-sp-4);
	border-left: 1px solid var(--vtc-line-2);
	list-style: none;
}

.vtc-ed-dropdown a {
	display: flex;
	align-items: center;
	min-height: 44px;
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-ui);
	text-decoration: none;
}

.vtc-ed-dropdown a:hover {
	color: var(--vtc-action);
}

.vtc-ed-header__actions {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-3);
	padding-top: var(--vtc-sp-4);
	border-top: 1px solid var(--vtc-line);
}

.vtc-ed-contact {
	display: inline-flex;
	align-items: center;
	gap: var(--vtc-sp-2);
	min-height: 44px;
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-sm);
	font-weight: var(--vtc-fw-medium);
	text-decoration: none;
	white-space: nowrap;
}

.vtc-ed-contact:hover { color: var(--vtc-action); }

.vtc-ed-header__cta {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: var(--vtc-sp-1);
}

.vtc-ed-header__note {
	color: var(--vtc-ink-3);
	font-size: var(--vtc-fs-eyebrow);
	text-align: center;
}


/* ===================================================================
 * Hero
 * =================================================================== */

.vtc-ed-hero {
	background: var(--vtc-hero);
	border-bottom: 1px solid var(--vtc-line);
}

.vtc-ed-hero__inner {
	display: grid;
	gap: var(--vtc-sp-7);
	padding-block: var(--vtc-sp-7) var(--vtc-sp-8);
}

.vtc-ed-hero__copy {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-5);
}

.vtc-ed-hero__copy h1 {
	margin: 0;
	font-size: var(--vtc-fs-display);
}

.vtc-ed-hero__trust {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.vtc-ed-hero__trust li {
	display: flex;
	align-items: flex-start;
	gap: var(--vtc-sp-3);
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-ui);
}

.vtc-ed-hero__trust .vtc-icon {
	flex: 0 0 auto;
	margin-top: .18em;
	color: var(--vtc-action);
	font-size: 1.25em;
}

.vtc-ed-hero__trust strong {
	color: var(--vtc-ink);
	font-weight: var(--vtc-fw-semi);
}

.vtc-ed-hero__trust strong::after {
	content: " \2014 ";
	color: var(--vtc-ink-3);
	font-weight: var(--vtc-fw-regular);
}

.vtc-ed-hero__links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vtc-sp-3) var(--vtc-sp-6);
	margin: 0;
}

.vtc-ed-hero__links a {
	display: inline-flex;
	align-items: center;
	gap: var(--vtc-sp-2);
	min-height: 44px;
	font-size: var(--vtc-fs-ui);
	font-weight: var(--vtc-fw-semi);
	text-decoration: none;
}

.vtc-ed-hero__links a:hover { text-decoration: underline; }


/* Einstiegskarte */

.vtc-ed-entry {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-4);
	align-self: start;
	padding: var(--vtc-sp-5);
	border: 1px solid var(--vtc-line);
	border-radius: var(--vtc-radius);
	background: var(--vtc-surface);
	box-shadow: var(--vtc-shadow-2);
}

.vtc-ed-entry__title {
	margin: 0;
	font-size: var(--vtc-fs-h2-sm);
}

.vtc-ed-entry__choices {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-2);
}

.vtc-ed-entry__choices a {
	display: flex;
	align-items: center;
	gap: var(--vtc-sp-3);
	min-height: 52px;
	padding-inline: var(--vtc-sp-4);
	border: 1px solid var(--vtc-line-2);
	border-radius: var(--vtc-radius);
	color: var(--vtc-ink);
	font-size: var(--vtc-fs-ui);
	font-weight: var(--vtc-fw-medium);
	text-decoration: none;
	transition: border-color .15s ease, background-color .15s ease;
}

.vtc-ed-entry__choices a:hover {
	border-color: var(--vtc-action);
	background: var(--vtc-action-soft);
	color: var(--vtc-action);
}

.vtc-ed-entry__choices a > span {
	margin-right: auto;
}

.vtc-ed-entry__choices .vtc-icon:first-child {
	color: var(--vtc-action);
	font-size: 1.2em;
}

.vtc-ed-entry__note {
	margin: 0;
	color: var(--vtc-ink-3);
	font-size: var(--vtc-fs-meta);
	text-align: center;
}


/* ===================================================================
 * Vertrauensband
 * =================================================================== */

.vtc-ed-trustbar {
	background: var(--vtc-surface);
	border-bottom: 1px solid var(--vtc-line);
}

.vtc-ed-trustbar__inner {
	display: grid;
	gap: var(--vtc-sp-5);
	align-items: center;
	padding-block: var(--vtc-sp-5);
}

.vtc-ed-trustbar__item {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.vtc-ed-trustbar__item strong {
	color: var(--vtc-ink);
	font-family: var(--vtc-font-display);
	font-size: var(--vtc-fs-h3);
	font-weight: var(--vtc-fw-display);
	letter-spacing: var(--vtc-track-display);
	line-height: 1.25;
}

.vtc-ed-trustbar__item span {
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-meta);
}

.vtc-ed-trustbar__seal img {
	width: auto;
	height: 56px;
	max-width: 100%;
	object-fit: contain;
	object-position: left center;
}


/* ===================================================================
 * Sektionen
 * =================================================================== */

.vtc-ed-section {
	padding-block: var(--vtc-section);
}

.vtc-ed-section--surface {
	border-block: 1px solid var(--vtc-line);
	background: var(--vtc-surface);
}

.vtc-ed-section__head {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-3);
	margin-bottom: var(--vtc-sp-7);
	max-width: 42em;
}

.vtc-ed-section__head h2 {
	margin: 0;
	font-size: var(--vtc-fs-h1-sm);
}

.vtc-ed-section__intro {
	margin: 0;
	color: var(--vtc-ink-2);
	max-width: 42em;
}

.vtc-ed-section__head--split {
	max-width: none;
}

.vtc-ed-section__head--split > div {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-3);
	max-width: 42em;
}


/* Karten */

.vtc-ed-cards {
	display: grid;
	gap: var(--vtc-sp-4);
}

.vtc-ed-card {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-3);
	padding: var(--vtc-sp-5);
	border: 1px solid var(--vtc-line);
	border-radius: var(--vtc-radius);
	background: var(--vtc-surface);
	color: inherit;
	text-decoration: none;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.vtc-ed-section--surface .vtc-ed-card {
	background: var(--vtc-ground);
}

.vtc-ed-card:hover {
	border-color: var(--vtc-line-2);
	box-shadow: var(--vtc-shadow-2);
	color: inherit;
	text-decoration: none;
}

.vtc-ed-card__icon .vtc-icon {
	color: var(--vtc-action);
	font-size: 26px;
}

.vtc-ed-card h3 {
	margin: 0;
	font-size: var(--vtc-fs-h3);
}

.vtc-ed-card p {
	margin: 0;
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-ui);
}

.vtc-ed-card__question {
	color: var(--vtc-ink) !important;
	font-weight: var(--vtc-fw-medium);
}

.vtc-ed-card__link {
	display: inline-flex;
	align-items: center;
	gap: var(--vtc-sp-2);
	margin-top: auto;
	padding-top: var(--vtc-sp-2);
	color: var(--vtc-action);
	font-size: var(--vtc-fs-ui);
	font-weight: var(--vtc-fw-semi);
}

.vtc-ed-card:hover .vtc-ed-card__link {
	text-decoration: underline;
}


/* ===================================================================
 * Ankersektion
 * =================================================================== */

.vtc-ed-anchor {
	padding-block: var(--vtc-section);
	background: var(--vtc-anchor);
	color: var(--vtc-on-dark);
}

.vtc-ed-anchor__inner {
	display: grid;
	gap: var(--vtc-sp-7);
	align-items: start;
}

.vtc-ed-anchor__copy {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-4);
}

.vtc-ed-anchor__copy h2 {
	margin: 0;
	color: var(--vtc-on-dark);
	font-size: var(--vtc-fs-h1-sm);
}

.vtc-ed-anchor__copy p {
	margin: 0;
	color: var(--vtc-on-dark-2);
	max-width: 40em;
}

.vtc-ed-anchor__copy strong {
	color: var(--vtc-on-dark);
}

.vtc-ed-anchor__figure {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-1);
	margin-top: var(--vtc-sp-3) !important;
	padding-top: var(--vtc-sp-5);
	border-top: 1px solid var(--vtc-line-dark);
	color: var(--vtc-on-dark-2) !important;
	font-size: var(--vtc-fs-ui);
}

.vtc-ed-anchor__figure span {
	color: var(--vtc-on-dark);
	font-family: var(--vtc-font-display);
	font-size: var(--vtc-fs-h1);
	font-weight: var(--vtc-fw-display);
	letter-spacing: var(--vtc-track-display);
	line-height: 1.1;
}

.vtc-ed-anchor__features {
	display: grid;
	gap: var(--vtc-sp-6);
}

.vtc-ed-anchor__features h3 {
	margin: 0 0 var(--vtc-sp-2);
	color: var(--vtc-on-dark);
	font-size: var(--vtc-fs-h3);
}

.vtc-ed-anchor__features p {
	margin: 0;
	color: var(--vtc-on-dark-2);
	font-size: var(--vtc-fs-ui);
}

.vtc-ed-anchor__cta {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-5);
	margin-top: var(--vtc-sp-7);
	padding-top: var(--vtc-sp-7);
	border-top: 1px solid var(--vtc-line-dark);
}

.vtc-ed-anchor__cta h3 {
	margin: 0 0 var(--vtc-sp-2);
	color: var(--vtc-on-dark);
	font-size: var(--vtc-fs-h3);
}

.vtc-ed-anchor__cta p {
	margin: 0;
	color: var(--vtc-on-dark-2);
	font-size: var(--vtc-fs-ui);
}

.vtc-ed-anchor__ctaAction {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-2);
	align-items: flex-start;
}


/* ===================================================================
 * Ablauf
 * =================================================================== */

.vtc-ed-steps {
	display: grid;
	gap: var(--vtc-sp-6);
	margin: 0;
	padding: var(--vtc-sp-6) 0 0;
	border-top: 1px solid var(--vtc-line-2);
	list-style: none;
	counter-reset: none;
}

.vtc-ed-steps li {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-2);
}

.vtc-ed-steps__no {
	color: var(--vtc-action);
	font-family: var(--vtc-font-display);
	font-size: var(--vtc-fs-ui);
	font-weight: var(--vtc-fw-display);
	letter-spacing: 0;
}

.vtc-ed-steps h3 {
	margin: 0;
	font-size: var(--vtc-fs-h3);
}

.vtc-ed-steps p {
	margin: 0;
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-sm);
}

.vtc-ed-inlineCta {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-4);
	align-items: flex-start;
	margin-top: var(--vtc-sp-7);
	padding-top: var(--vtc-sp-6);
	border-top: 1px solid var(--vtc-line);
}

.vtc-ed-inlineCta p {
	margin: 0;
	color: var(--vtc-ink-2);
	max-width: 34em;
}


/* ===================================================================
 * Experten
 * =================================================================== */

.vtc-ed-experts {
	display: grid;
	gap: var(--vtc-sp-5);
}

.vtc-ed-expert {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-2);
}

.vtc-ed-expert__portrait {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 100%;
	aspect-ratio: 4 / 3;
	margin-bottom: var(--vtc-sp-2);
	overflow: hidden;
	border-radius: var(--vtc-radius);
	background: var(--vtc-tint);
	color: var(--vtc-ink-2);
}

.vtc-ed-expert__portrait img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.vtc-ed-expert__portrait .vtc-icon {
	font-size: 40px;
}

.vtc-ed-expert h3 {
	margin: 0;
	font-size: var(--vtc-fs-h3);
}

.vtc-ed-expert h3 a {
	color: inherit;
	text-decoration: none;
}

.vtc-ed-expert h3 a:hover {
	color: var(--vtc-action);
}

.vtc-ed-expert p {
	margin: 0;
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-meta);
}

.vtc-ed-expert__geo {
	display: flex;
	align-items: center;
	gap: var(--vtc-sp-1);
	color: var(--vtc-ink-3) !important;
}

.vtc-ed-expert__link {
	display: inline-flex;
	align-items: center;
	gap: var(--vtc-sp-2);
	min-height: 44px;
	font-size: var(--vtc-fs-sm);
	font-weight: var(--vtc-fw-semi);
	text-decoration: none;
}

.vtc-ed-expert__link:hover { text-decoration: underline; }


/* ===================================================================
 * Beitragslisten
 * =================================================================== */

.vtc-ed-posts {
	display: grid;
	gap: var(--vtc-sp-6);
}

.vtc-ed-post {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-3);
	padding-top: var(--vtc-sp-4);
	border-top: 2px solid var(--vtc-ink);
}

.vtc-ed-post h3 {
	margin: 0;
	font-size: var(--vtc-fs-h3);
}

.vtc-ed-post h3 a {
	color: inherit;
	text-decoration: none;
}

.vtc-ed-post h3 a:hover {
	color: var(--vtc-action);
	text-decoration: underline;
}

.vtc-ed-post__text {
	margin: 0;
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-ui);
}

.vtc-ed-post__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vtc-sp-1) var(--vtc-sp-4);
	margin: auto 0 0;
	padding-top: var(--vtc-sp-2);
	color: var(--vtc-ink-3);
	font-size: var(--vtc-fs-meta);
}

.vtc-ed-post__author {
	display: flex;
	align-items: center;
	gap: var(--vtc-sp-3);
	margin: 0;
}

.vtc-ed-post__author strong {
	display: block;
	color: var(--vtc-ink);
	font-size: var(--vtc-fs-sm);
	font-weight: var(--vtc-fw-semi);
}

.vtc-ed-post__author small {
	display: block;
	color: var(--vtc-ink-3);
	font-size: var(--vtc-fs-meta);
}


/* ===================================================================
 * Artikelseite
 * =================================================================== */

.vtc-ed-articleHead {
	padding-block: var(--vtc-sp-5) var(--vtc-sp-7);
	border-bottom: 1px solid var(--vtc-line);
	background: var(--vtc-hero);
}

.vtc-ed-articleHead h1 {
	margin: var(--vtc-sp-3) 0 0;
	font-size: var(--vtc-fs-h1);
	max-width: 20em;
}

.vtc-ed-articleHead .vtc-ed-lead {
	margin-top: var(--vtc-sp-4);
	max-width: 42em;
}

.vtc-ed-crumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--vtc-sp-2);
	margin-bottom: var(--vtc-sp-5);
	color: var(--vtc-ink-3);
	font-size: var(--vtc-fs-meta);
}

.vtc-ed-crumbs a {
	display: inline-flex;
	align-items: center;
	gap: var(--vtc-sp-1);
	color: var(--vtc-ink-2);
	text-decoration: none;
}

.vtc-ed-crumbs a:hover { color: var(--vtc-action); }

.vtc-ed-byline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--vtc-sp-3) var(--vtc-sp-5);
	margin-top: var(--vtc-sp-5);
	padding-top: var(--vtc-sp-5);
	border-top: 1px solid var(--vtc-line-2);
}

.vtc-ed-byline__author {
	display: flex;
	align-items: center;
	gap: var(--vtc-sp-3);
	color: var(--vtc-ink);
	font-size: var(--vtc-fs-ui);
	font-weight: var(--vtc-fw-semi);
}

.vtc-ed-byline__meta {
	display: flex;
	align-items: center;
	gap: var(--vtc-sp-2);
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-sm);
}

.vtc-ed-articleLayout {
	display: grid;
	gap: var(--vtc-sp-7);
	align-items: start;
	padding-block: var(--vtc-sp-7) var(--vtc-sp-8);
}

.vtc-ed-article {
	min-width: 0;
}

.vtc-ed-cover {
	margin: 0 0 var(--vtc-sp-6);
}

.vtc-ed-cover img {
	width: 100%;
	max-width: 100%;
	height: auto;
	border-radius: var(--vtc-radius);
}

.vtc-ed-tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vtc-sp-2);
	margin-top: var(--vtc-sp-7);
}

.vtc-ed-tags a {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding-inline: var(--vtc-sp-3);
	border: 1px solid var(--vtc-line);
	border-radius: var(--vtc-radius-pill);
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-meta);
	text-decoration: none;
}

.vtc-ed-tags a:hover {
	border-color: var(--vtc-action);
	color: var(--vtc-action);
}

.vtc-ed-prevnext {
	display: grid;
	gap: var(--vtc-sp-4);
	margin-top: var(--vtc-sp-7);
	padding-top: var(--vtc-sp-6);
	border-top: 1px solid var(--vtc-line);
}

.vtc-ed-prevnext a {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-1);
	padding: var(--vtc-sp-4);
	border: 1px solid var(--vtc-line);
	border-radius: var(--vtc-radius);
	background: var(--vtc-surface);
	text-decoration: none;
}

.vtc-ed-prevnext a:hover {
	border-color: var(--vtc-line-2);
	box-shadow: var(--vtc-shadow-1);
}

.vtc-ed-prevnext span {
	color: var(--vtc-ink-3);
	font-size: var(--vtc-fs-eyebrow);
	font-weight: var(--vtc-fw-semi);
	letter-spacing: var(--vtc-track-eyebrow);
	text-transform: uppercase;
}

.vtc-ed-prevnext strong {
	color: var(--vtc-ink);
	font-family: var(--vtc-font-display);
	font-size: var(--vtc-fs-base);
	font-weight: var(--vtc-fw-semi);
	line-height: 1.35;
}

.vtc-ed-prevnext__next {
	text-align: right;
}

.vtc-ed-aside {
	min-width: 0;
}

.vtc-ed-articleFoot {
	display: flex;
	flex-direction: column;
	gap: var(--vtc-sp-6);
	padding-bottom: var(--vtc-sp-8);
}

.vtc-ed-page {
	padding-block: var(--vtc-sp-7) var(--vtc-sp-8);
}


/* ===================================================================
 * Fliesstext im Artikel
 * =================================================================== */

.vtc-ed-article .vtc-content {
	color: var(--vtc-ink-body);
	font-size: var(--vtc-fs-prose);
	line-height: var(--vtc-lh-prose);
}

.vtc-ed-article .vtc-content > * {
	max-width: var(--vtc-measure);
}

.vtc-ed-article .vtc-content > p,
.vtc-ed-article .vtc-content > ul,
.vtc-ed-article .vtc-content > ol {
	margin: 0 0 var(--vtc-sp-5);
}

.vtc-ed-article .vtc-content > h2 {
	margin: var(--vtc-sp-8) 0 var(--vtc-sp-4);
	font-size: var(--vtc-fs-h2);
}

.vtc-ed-article .vtc-content > h3 {
	margin: var(--vtc-sp-7) 0 var(--vtc-sp-3);
	font-size: var(--vtc-fs-h3);
}

.vtc-ed-article .vtc-content > h2:first-child,
.vtc-ed-article .vtc-content > h3:first-child {
	margin-top: 0;
}

.vtc-ed-article .vtc-content > ul,
.vtc-ed-article .vtc-content > ol {
	padding-left: var(--vtc-sp-5);
}

.vtc-ed-article .vtc-content li {
	margin-bottom: var(--vtc-sp-2);
}

.vtc-ed-article .vtc-content a {
	text-decoration: underline;
	text-underline-offset: .15em;
}

.vtc-ed-article .vtc-content blockquote {
	margin: var(--vtc-sp-6) 0;
	padding-left: var(--vtc-sp-5);
	border-left: 2px solid var(--vtc-action);
	color: var(--vtc-ink);
	font-family: var(--vtc-font-display);
	font-size: var(--vtc-fs-h3);
	line-height: 1.45;
}

.vtc-ed-article .vtc-content img {
	max-width: 100%;
	height: auto;
	border-radius: var(--vtc-radius);
}

/* Tabellen duerfen breiter sein als die Zeilenlaenge, scrollen aber selbst */
.vtc-ed-article .vtc-content table {
	display: block;
	width: 100%;
	max-width: 100%;
	overflow-x: auto;
	border-collapse: collapse;
	font-size: var(--vtc-fs-ui);
	line-height: var(--vtc-lh-base);
}

.vtc-ed-article .vtc-content th,
.vtc-ed-article .vtc-content td {
	padding: var(--vtc-sp-3) var(--vtc-sp-4);
	border-bottom: 1px solid var(--vtc-line);
	text-align: left;
	vertical-align: top;
}

.vtc-ed-article .vtc-content th {
	background: var(--vtc-tint);
	color: var(--vtc-ink);
	font-weight: var(--vtc-fw-semi);
}


/* ===================================================================
 * ab 48rem
 * =================================================================== */

@media (min-width: 48rem) {

	.vtc-ed-cards--3,
	.vtc-ed-cards--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vtc-ed-experts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vtc-ed-posts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vtc-ed-trustbar__inner {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vtc-ed-anchor__features {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--vtc-sp-6) var(--vtc-sp-7);
	}

	.vtc-ed-anchor__cta {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
	}

	.vtc-ed-steps {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vtc-ed-inlineCta {
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		gap: var(--vtc-sp-6);
	}

	.vtc-ed-prevnext {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.vtc-ed-section__head--split {
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
		gap: var(--vtc-sp-6);
	}
}


/* ===================================================================
 * ab 64rem - ab hier steht die Navigation in einer Zeile
 * =================================================================== */

@media (min-width: 64rem) {

	.vtc-ed-header__inner {
		min-height: 76px;
		gap: var(--vtc-sp-6);
	}

	.vtc-ed-brand {
		margin-right: 0;
	}

	.vtc-ed-brand img {
		height: 48px;
		max-width: 165px;
	}

	.vtc-ed-burger {
		display: none;
	}

	.vtc-ed-nav,
	.vtc-ed-nav.is-open {
		position: static;
		display: flex;
		flex-direction: row;
		align-items: center;
		gap: var(--vtc-sp-6);
		flex: 1 1 auto;
		max-height: none;
		overflow: visible;
		padding: 0;
		border: 0;
		background: none;
		box-shadow: none;
	}

	.vtc-ed-nav__list {
		flex-direction: row;
		align-items: center;
		gap: var(--vtc-sp-5);
	}

	.vtc-ed-nav__item {
		position: relative;
	}

	.vtc-ed-nav__link {
		min-height: 40px;
		font-size: var(--vtc-fs-ui);
		white-space: nowrap;
	}

	.vtc-ed-dropdown {
		position: absolute;
		top: calc(100% + var(--vtc-sp-3));
		left: calc(var(--vtc-sp-4) * -1);
		z-index: 40;
		min-width: 260px;
		margin: 0;
		padding: var(--vtc-sp-2);
		border: 1px solid var(--vtc-line);
		border-radius: var(--vtc-radius);
		background: var(--vtc-surface);
		box-shadow: var(--vtc-shadow-3);
	}

	.vtc-ed-dropdown a {
		min-height: 40px;
		padding-inline: var(--vtc-sp-3);
		border-radius: var(--vtc-radius);
	}

	.vtc-ed-dropdown a:hover {
		background: var(--vtc-action-soft);
	}

	.vtc-ed-header__actions {
		flex-direction: row;
		align-items: center;
		gap: var(--vtc-sp-5);
		margin-left: auto;
		padding-top: 0;
		border-top: 0;
	}

	.vtc-ed-header__cta {
		align-items: center;
	}

	.vtc-ed-btn {
		min-height: 44px;
		padding-block: var(--vtc-sp-2);
	}

	.vtc-ed-hero__inner {
		grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
		gap: var(--vtc-sp-8);
		padding-block: var(--vtc-sp-8) var(--vtc-sp-9);
	}

	.vtc-ed-entry {
		padding: var(--vtc-sp-6);
	}

	.vtc-ed-trustbar__inner {
		grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
		gap: var(--vtc-sp-6);
	}

	.vtc-ed-cards--3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vtc-ed-cards--4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.vtc-ed-experts {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.vtc-ed-posts {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.vtc-ed-posts--author {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.vtc-ed-anchor__inner {
		grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
		gap: var(--vtc-sp-9);
	}

	.vtc-ed-steps {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: var(--vtc-sp-5);
	}

	.vtc-ed-articleHead {
		padding-block: var(--vtc-sp-6) var(--vtc-sp-8);
	}

	.vtc-ed-articleLayout {
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: var(--vtc-sp-8);
	}

	/* Randspalte laeuft mit, bleibt aber immer vollstaendig erreichbar */
	.vtc-ed-aside {
		position: sticky;
		top: calc(76px + var(--vtc-sp-5));
		max-height: calc(100dvh - 76px - var(--vtc-sp-7));
		overflow-y: auto;
		overscroll-behavior: contain;
	}
}


/* ===================================================================
 * ab 80rem
 * =================================================================== */

@media (min-width: 80rem) {

	.vtc-ed-hero__inner {
		gap: var(--vtc-sp-9);
	}

	.vtc-ed-articleLayout {
		gap: var(--vtc-sp-9);
	}
}


/* ===================================================================
 * Seitentypen, die ihr CSS bis zuletzt im PHP-Template trugen.
 *
 * Hierher verschoben, damit sie nicht bei jedem Aufruf neu
 * mitgeliefert werden, sondern einmal im Browser-Cache liegen.
 * Jeder Abschnitt ist auf seine eigene Wurzelklasse begrenzt und
 * wirkt nur auf dem jeweiligen Seitentyp.
 *
 * Die Reihenfolge entspricht der frueheren: diese Regeln standen im
 * Body und damit nach allen Stylesheets - deshalb stehen sie hier am
 * Ende der Datei.
 * =================================================================== */


/* -------------------------------------------------------------------
 * Regionalseiten (Koeln, Duesseldorf)
 * Geltungsbereich: .vtc-pkv-region
 * Zuvor als <style>-Block in php/page-pkv-region.php
 * ------------------------------------------------------------------- */

.vtc-pkv-region {
	--hub-navy: var(--vtc-anchor);
	--hub-blue: var(--vtc-action);
	--hub-ink: var(--vtc-ink);
	--hub-muted: var(--vtc-ink-2);
	--hub-line: var(--vtc-line);
	--hub-soft: var(--vtc-tint);
	color: var(--hub-ink);
	background: #fff;
	overflow: hidden;
}

.vtc-pkv-region * {
	box-sizing: border-box;
}

.vtc-pkv-region a {
	color: inherit;
}

.vtc-pkv-region .vtc-pkv-hub__container {
	width: min(var(--vtc-wrap), calc(100% - 2rem));
	margin: 0 auto;
}

.vtc-pkv-region .vtc-pkv-hub__hero {
	padding: clamp(2.25rem, 5vw, 4.75rem) 0 clamp(2.25rem, 4vw, 3.5rem);
	background: var(--vtc-hero);
	border-bottom: 1px solid var(--hub-line);
}

.vtc-pkv-region .vtc-breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .55rem;
	margin: 0 0 clamp(1.5rem, 3vw, 2.25rem);
	color: var(--vtc-ink-2);
	font-size: var(--vtc-fs-ui);
	font-weight: 600;
}

.vtc-pkv-region .vtc-breadcrumb a,
.vtc-pkv-region .vtc-breadcrumb__current {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	text-decoration: none;
}

.vtc-pkv-region .vtc-breadcrumb a:hover,
.vtc-pkv-region .vtc-breadcrumb a:focus-visible {
	color: var(--hub-blue);
	text-decoration: none;
}

.vtc-pkv-region .vtc-breadcrumb__separator::before {
	content: "/";
	color: var(--vtc-ink-3);
}

.vtc-pkv-region .vtc-icon {
	width: 1em;
	height: 1em;
	flex: 0 0 auto;
}

.vtc-pkv-region .vtc-pkv-hub__hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
	gap: clamp(1.75rem, 4vw, 3.5rem);
	align-items: center;
}

.vtc-pkv-region .vtc-pkv-hub__kicker {
	margin: 0 0 .75rem;
	color: var(--hub-blue);
	font-size: var(--vtc-fs-eyebrow);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: uppercase;
}

.vtc-pkv-region h1,
.vtc-pkv-region h2,
.vtc-pkv-region h3 {
	color: var(--hub-navy);
	letter-spacing: 0;
}

.vtc-pkv-region h1 {
	max-width: 780px;
	margin: 0;
	font-size: var(--vtc-fs-display);
	line-height: 1;
}

.vtc-pkv-region .vtc-pkv-hub__lead {
	max-width: 760px;
	margin: 1.15rem 0 0;
	color: var(--hub-ink);
	font-size: var(--vtc-fs-lead);
	line-height: 1.65;
}

.vtc-pkv-region .vtc-pkv-hub__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
	margin-top: 1.7rem;
}

.vtc-pkv-region a.vtc-pkv-hub__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	max-width: 100%;
	min-height: 48px;
	padding: .9rem 1.25rem;
	border: 1px solid var(--hub-blue);
	border-radius: var(--vtc-radius);
	background: var(--hub-blue);
	color: #fff;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	box-shadow: var(--vtc-shadow-2);
	transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.vtc-pkv-region a.vtc-pkv-hub__button:hover,
.vtc-pkv-region a.vtc-pkv-hub__button:focus-visible {
	background: var(--vtc-action);
	border-color: var(--vtc-action);
	color: #fff;
	text-decoration: none;
	box-shadow: var(--vtc-shadow-3);
	transform: translateY(-1px);
}

.vtc-pkv-region a.vtc-pkv-hub__button--ghost {
	background: #fff;
	color: var(--hub-navy);
	border-color: var(--vtc-line-2);
	box-shadow: none;
}

.vtc-pkv-region a.vtc-pkv-hub__button--ghost:hover,
.vtc-pkv-region a.vtc-pkv-hub__button--ghost:focus-visible {
	background: var(--vtc-tint);
	border-color: var(--hub-blue);
	color: var(--hub-navy);
}

.vtc-pkv-region .vtc-pkv-hub__hero-panel {
	padding: clamp(1.4rem, 3vw, 2rem);
	border: 1px solid var(--hub-line);
	border-radius: var(--vtc-radius);
	background: rgba(255, 255, 255, .9);
	box-shadow: var(--vtc-shadow-3);
}

.vtc-pkv-region .vtc-pkv-hub__hero-panel h2 {
	margin: 0;
	font-size: var(--vtc-fs-h2);
	line-height: 1.12;
}

.vtc-pkv-region .vtc-pkv-hub__hero-panel p {
	margin: .85rem 0 0;
	color: var(--hub-muted);
	line-height: 1.65;
}

.vtc-pkv-region .vtc-pkv-hub__section {
	padding: clamp(2.5rem, 5vw, 4.5rem) 0;
}

.vtc-pkv-region .vtc-pkv-hub__section--soft {
	background: var(--hub-soft);
	border-block: 1px solid var(--hub-line);
}

.vtc-pkv-region .vtc-pkv-hub__section-head {
	max-width: 820px;
	margin: 0 0 clamp(1.35rem, 3vw, 2.25rem);
}

.vtc-pkv-region .vtc-pkv-hub__section-head h2 {
	margin: 0;
	font-size: var(--vtc-fs-h1-sm);
	line-height: 1.12;
}

.vtc-pkv-region .vtc-pkv-hub__section-head p {
	margin: .85rem 0 0;
	color: var(--hub-muted);
	font-size: var(--vtc-fs-base);
	line-height: 1.65;
}

.vtc-pkv-region .partnerlisting-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.vtc-pkv-region .partnerlisting-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 0;
	min-height: 100%;
	padding: 1.45rem;
	border: 1px solid var(--hub-line);
	border-radius: var(--vtc-radius);
	background: #fff;
	box-shadow: var(--vtc-shadow-3);
	text-align: center;
}

.vtc-pkv-region .partnerlisting-card__portrait {
	position: relative;
	display: grid;
	width: 126px;
	height: 126px;
	margin: 0 auto 1rem;
	place-items: center;
	border-radius: 50%;
	background: var(--vtc-tint);
	color: var(--hub-blue);
	overflow: hidden;
	text-decoration: none;
	box-shadow: inset 0 0 0 8px rgba(255, 255, 255, .55);
}

.vtc-pkv-region .partnerlisting-card__portrait img {
	position: relative;
	z-index: 2;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
	color: transparent;
	font-size: 0;;
}

.vtc-pkv-region .partnerlisting-card__initials {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: grid;
	width: 100%;
	height: 100%;
	place-items: center;
	color: var(--hub-blue);
	font-size: var(--vtc-fs-h2);
	font-weight: 600;
	letter-spacing: 0;
}

.vtc-pkv-region .partnerlisting-card h3 {
	margin: 0;
	font-size: var(--vtc-fs-lead);
	line-height: 1.25;
}

.vtc-pkv-region .partnerlisting-card h3 a {
	color: var(--hub-navy);
	text-decoration: none;
}

.vtc-pkv-region .partnerlisting-card h3 a:hover,
.vtc-pkv-region .partnerlisting-card h3 a:focus-visible {
	color: var(--hub-blue);
	text-decoration: none;
}

.vtc-pkv-region .partnerlisting-card__zip,
.vtc-pkv-region .partnerlisting-card__distance {
	margin: .55rem 0 0;
	color: var(--hub-muted);
	line-height: 1.45;
}

.vtc-pkv-region .partnerlisting-card__actions {
	display: grid;
	gap: .55rem;
	width: 100%;
	margin-top: auto;
	padding-top: 1.1rem;
}

.vtc-pkv-region .partnerlisting-card__actions a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	min-height: 42px;
	padding: .75rem .95rem;
	border: 1px solid var(--vtc-line-2);
	border-radius: var(--vtc-radius);
	color: var(--hub-navy);
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
}

.vtc-pkv-region .partnerlisting-card__actions .partnerlisting-card__primary {
	border-color: var(--hub-blue);
	background: var(--hub-blue);
	color: #fff;
}

.vtc-pkv-region .partnerlisting-card__actions a:hover,
.vtc-pkv-region .partnerlisting-card__actions a:focus-visible {
	border-color: var(--hub-blue);
	background: var(--vtc-tint);
	color: var(--hub-navy);
	text-decoration: none;
}

.vtc-pkv-region .partnerlisting-card__actions .partnerlisting-card__primary:hover,
.vtc-pkv-region .partnerlisting-card__actions .partnerlisting-card__primary:focus-visible {
	background: var(--vtc-action);
	color: #fff;
}

.vtc-pkv-region .vtc-icon {
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.vtc-pkv-region .vtc-icon * {
	fill: none;
	stroke: currentColor;
}

.vtc-pkv-region .partnerlisting-card__actions .vtc-icon {
	width: 1rem;
	height: 1rem;
	flex: 0 0 auto;
}

.vtc-pkv-region .vtc-pkv-hub__more-link {
	margin: 1.4rem 0 0;
	font-weight: 600;
}

.vtc-pkv-region .vtc-pkv-hub__more-link a {
	color: var(--hub-blue);
	text-decoration: none;
}

.vtc-pkv-region .vtc-pkv-hub__more-link a:hover,
.vtc-pkv-region .vtc-pkv-hub__more-link a:focus-visible {
	text-decoration: underline;
}

.vtc-pkv-region .vtc-pkv-hub__path,
.vtc-pkv-region .vtc-pkv-hub__topics {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}

.vtc-pkv-region .vtc-pkv-hub__step,
.vtc-pkv-region .vtc-pkv-hub__topic {
	min-width: 0;
	padding: 1.35rem;
	border: 1px solid var(--hub-line);
	border-radius: var(--vtc-radius);
	background: #fff;
	box-shadow: var(--vtc-shadow-3);
}

.vtc-pkv-region .vtc-pkv-hub__path {
	counter-reset: pkvRegionPath;
}

.vtc-pkv-region .vtc-pkv-hub__step::before {
	counter-increment: pkvRegionPath;
	content: counter(pkvRegionPath);
	display: grid;
	width: 34px;
	height: 34px;
	margin-bottom: 1rem;
	place-items: center;
	border-radius: 50%;
	background: var(--hub-navy);
	color: #fff;
	font-weight: 600;
}

.vtc-pkv-region .vtc-pkv-hub__step h3,
.vtc-pkv-region .vtc-pkv-hub__topic h3 {
	margin: 0;
	font-size: var(--vtc-fs-prose);
	line-height: 1.25;
}

.vtc-pkv-region .vtc-pkv-hub__step p,
.vtc-pkv-region .vtc-pkv-hub__topic p {
	margin: .65rem 0 0;
	color: var(--hub-muted);
	line-height: 1.58;
}

.vtc-pkv-region .vtc-faq {
	display: grid;
	gap: .85rem;
	max-width: 900px;
}

.vtc-pkv-region .vtc-faq details {
	padding: 1rem 1.15rem;
	border: 1px solid var(--hub-line);
	border-radius: var(--vtc-radius);
	background: #fff;
}

.vtc-pkv-region .vtc-faq summary {
	cursor: pointer;
	color: var(--hub-navy);
	font-weight: 600;
}

.vtc-pkv-region .vtc-faq p {
	margin: .75rem 0 0;
	color: var(--hub-muted);
	line-height: 1.6;
}

.vtc-pkv-region .vtc-pkv-hub__cta {
	padding: clamp(2rem, 4vw, 3rem);
	border-radius: var(--vtc-radius);
	background: var(--hub-navy);
	color: #fff;
}

.vtc-pkv-region .vtc-pkv-hub__cta-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 1.5rem;
	align-items: center;
}

.vtc-pkv-region .vtc-pkv-hub__cta h2 {
	margin: 0;
	color: #fff;
	font-size: var(--vtc-fs-h1-sm);
}

.vtc-pkv-region .vtc-pkv-hub__cta p {
	max-width: 760px;
	margin: .75rem 0 0;
	color: var(--vtc-line);
	line-height: 1.65;
}

@media (max-width: 991.98px) {
	.vtc-pkv-region .vtc-pkv-hub__hero-grid,
	.vtc-pkv-region .vtc-pkv-hub__cta-grid {
		grid-template-columns: 1fr;
	}

	.vtc-pkv-region .vtc-pkv-hub__path,
	.vtc-pkv-region .vtc-pkv-hub__topics,
	.vtc-pkv-region .partnerlisting-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 639.98px) {
	.vtc-pkv-region .vtc-pkv-hub__container {
		width: min(100% - 1.25rem, var(--vtc-wrap));
	}

	.vtc-pkv-region .vtc-pkv-hub__actions {
		display: grid;
	}

	.vtc-pkv-region a.vtc-pkv-hub__button {
		width: 100%;
	}

	.vtc-pkv-region .vtc-pkv-hub__path,
	.vtc-pkv-region .vtc-pkv-hub__topics,
	.vtc-pkv-region .partnerlisting-grid {
		grid-template-columns: 1fr;
	}
}


/* -------------------------------------------------------------------
 * PKV-Hubseite
 * Geltungsbereich: .vtc-pkv-hub
 * Zuvor als <style>-Block in php/page-private-krankenversicherung.php
 * ------------------------------------------------------------------- */

.vtc-pkv-hub {
	--hub-navy: var(--vtc-anchor);
	--hub-blue: var(--vtc-action);
	--hub-ink: var(--vtc-ink);
	--hub-muted: var(--vtc-ink-2);
	--hub-line: var(--vtc-line);
	--hub-soft: var(--vtc-tint);
	color: var(--hub-ink);
	background: #fff;
}
.vtc-pkv-hub * { box-sizing: border-box; }
.vtc-pkv-hub a { color: inherit; }
.vtc-pkv-hub__container {
	width: min(var(--vtc-wrap), calc(100% - 2rem));
	margin: 0 auto;
}
.vtc-pkv-hub__hero {
	padding: clamp(2.5rem, 6vw, 5rem) 0 clamp(2rem, 4vw, 3.5rem);
	background: var(--vtc-hero);
	border-bottom: 1px solid var(--hub-line);
}
.vtc-pkv-hub__hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: center;
}
.vtc-pkv-hub__eyebrow,
.vtc-pkv-hub__kicker {
	margin: 0 0 .75rem;
	color: var(--hub-blue);
	font-size: var(--vtc-fs-eyebrow);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: uppercase;
}
.vtc-pkv-hub h1,
.vtc-pkv-hub h2,
.vtc-pkv-hub h3 {
	color: var(--hub-navy);
	letter-spacing: 0;
}
.vtc-pkv-hub h1 {
	max-width: 760px;
	margin: 0;
	font-size: var(--vtc-fs-display);
	line-height: .98;
}
.vtc-pkv-hub__lead {
	max-width: 720px;
	margin: 1.2rem 0 0;
	color: var(--hub-ink);
	font-size: var(--vtc-fs-lead);
	line-height: 1.65;
}
.vtc-pkv-hub__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .85rem;
	margin-top: 1.7rem;
}
.vtc-pkv-hub a.vtc-pkv-hub__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .6rem;
	max-width: 100%;
	min-height: 48px;
	padding: .9rem 1.25rem;
	border: 1px solid var(--vtc-action);
	border-radius: var(--vtc-radius);
	background: var(--vtc-action);
	color: #fff;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	box-shadow: var(--vtc-shadow-2);
	transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.vtc-pkv-hub a.vtc-pkv-hub__button:hover,
.vtc-pkv-hub a.vtc-pkv-hub__button:focus-visible {
	background: var(--vtc-action);
	border-color: var(--vtc-action);
	color: #fff;
	text-decoration: none;
	box-shadow: var(--vtc-shadow-3);
	transform: translateY(-1px);
}
.vtc-pkv-hub a.vtc-pkv-hub__button--secondary {
	background: #fff;
	color: var(--hub-navy);
	border-color: var(--vtc-line-2);
	box-shadow: none;
}
.vtc-pkv-hub a.vtc-pkv-hub__button--secondary:hover,
.vtc-pkv-hub a.vtc-pkv-hub__button--secondary:focus-visible {
	background: var(--vtc-tint);
	border-color: var(--hub-blue);
	color: var(--hub-navy);
	box-shadow: var(--vtc-shadow-2);
}
.vtc-pkv-hub__button .vtc-icon {
	width: 1rem;
	height: 1rem;
	flex: 0 0 auto;
	color: currentColor;
	stroke: currentColor;
}
.vtc-pkv-hub__button .vtc-icon * {
	stroke: currentColor;
}
.vtc-pkv-hub__button span {
	color: currentColor;
	min-width: 0;
}
.vtc-pkv-hub__panel {
	border: 1px solid var(--hub-line);
	border-radius: var(--vtc-radius);
	background: rgba(255, 255, 255, .86);
	box-shadow: var(--vtc-shadow-3);
	overflow: hidden;
}
.vtc-pkv-hub__panel-head {
	padding: 1.35rem 1.45rem;
	background: var(--hub-navy);
	color: #fff;
}
.vtc-pkv-hub__panel-head strong {
	display: block;
	font-size: var(--vtc-fs-base);
}
.vtc-pkv-hub__panel-head span {
	display: block;
	margin-top: .3rem;
	color: var(--vtc-line);
	line-height: 1.45;
}
.vtc-pkv-hub__checklist {
	display: grid;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}
.vtc-pkv-hub__checklist li {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: .75rem;
	padding: 1rem 1.45rem;
	border-top: 1px solid var(--hub-line);
	line-height: 1.5;
}
.vtc-pkv-hub__checklist .vtc-icon {
	width: 1.05rem;
	height: 1.05rem;
	margin-top: .2rem;
	color: var(--hub-blue);
}
.vtc-pkv-hub__section {
	padding: clamp(2.5rem, 5vw, 4.5rem) 0;
}
.vtc-pkv-hub__editor-content {
	max-width: 860px;
	margin: 0;
	color: var(--hub-ink);
	font-size: var(--vtc-fs-base);
	line-height: 1.72;
}
.vtc-pkv-hub__editor-content h2,
.vtc-pkv-hub__editor-content h3 {
	margin-top: 1.65rem;
}
.vtc-pkv-hub__editor-content p,
.vtc-pkv-hub__editor-content ul,
.vtc-pkv-hub__editor-content ol {
	margin: 0 0 1rem;
}
.vtc-pkv-hub__editor-content a {
	color: var(--hub-blue);
	font-weight: 600;
}
.vtc-pkv-hub__section--soft {
	background: var(--hub-soft);
	border-block: 1px solid var(--hub-line);
}
.vtc-pkv-hub__section-head {
	max-width: 780px;
	margin-bottom: clamp(1.4rem, 3vw, 2.3rem);
}
.vtc-pkv-hub__section-head h2 {
	margin: 0;
	font-size: var(--vtc-fs-h1-sm);
	line-height: 1.12;
}
.vtc-pkv-hub__section-head p {
	margin: .85rem 0 0;
	color: var(--hub-muted);
	font-size: var(--vtc-fs-base);
	line-height: 1.65;
}
.vtc-pkv-hub__audiences,
.vtc-pkv-hub__topics {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
}
.vtc-pkv-hub__topics {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}
.vtc-pkv-hub__card,
.vtc-pkv-hub__topic {
	display: flex;
	flex-direction: column;
	min-width: 0;
	min-height: 100%;
	padding: 1.35rem;
	border: 1px solid var(--hub-line);
	border-radius: var(--vtc-radius);
	background: #fff;
	text-decoration: none;
	box-shadow: var(--vtc-shadow-3);
}
.vtc-pkv-hub__card:hover,
.vtc-pkv-hub__card:focus-visible,
.vtc-pkv-hub__topic:hover,
.vtc-pkv-hub__topic:focus-visible {
	border-color: var(--vtc-line-2);
	box-shadow: var(--vtc-shadow-3);
	text-decoration: none;
}
.vtc-pkv-hub__icon {
	display: grid;
	width: 44px;
	height: 44px;
	margin-bottom: 1rem;
	place-items: center;
	border-radius: var(--vtc-radius);
	background: var(--vtc-tint);
	color: var(--hub-blue);
}
.vtc-pkv-hub__icon .vtc-icon {
	width: 1.25rem;
	height: 1.25rem;
}
.vtc-pkv-hub__card h3,
.vtc-pkv-hub__topic h3 {
	margin: 0;
	font-size: var(--vtc-fs-lead);
	line-height: 1.22;
}
.vtc-pkv-hub__card p,
.vtc-pkv-hub__topic p {
	margin: .7rem 0 1rem;
	color: var(--hub-muted);
	line-height: 1.58;
}
.vtc-pkv-hub__more {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .45rem;
	margin-top: auto;
	color: var(--hub-blue);
	font-weight: 600;
	line-height: 1.35;
}
.vtc-pkv-hub__more .vtc-icon {
	width: .95rem;
	height: .95rem;
	flex: 0 0 auto;
}
.vtc-pkv-hub__path {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
	counter-reset: pkvPath;
}
.vtc-pkv-hub__step {
	position: relative;
	padding: 1.35rem;
	border: 1px solid var(--hub-line);
	border-radius: var(--vtc-radius);
	background: #fff;
}
.vtc-pkv-hub__step::before {
	counter-increment: pkvPath;
	content: counter(pkvPath);
	display: grid;
	width: 34px;
	height: 34px;
	margin-bottom: 1rem;
	place-items: center;
	border-radius: 50%;
	background: var(--hub-navy);
	color: #fff;
	font-weight: 600;
}
.vtc-pkv-hub__step h3 {
	margin: 0;
	font-size: var(--vtc-fs-prose);
}
.vtc-pkv-hub__step p {
	margin: .65rem 0 0;
	color: var(--hub-muted);
	line-height: 1.58;
}
.vtc-pkv-hub__cta {
	padding: clamp(2rem, 4vw, 3rem);
	border-radius: var(--vtc-radius);
	background: var(--hub-navy);
	color: #fff;
}
.vtc-pkv-hub__cta-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 1.5rem;
	align-items: center;
}
.vtc-pkv-hub__cta-grid > .vtc-pkv-hub__button {
	justify-self: end;
	white-space: nowrap;
}
.vtc-pkv-hub__cta h2 {
	margin: 0;
	color: #fff;
	font-size: var(--vtc-fs-h1-sm);
}
.vtc-pkv-hub__cta p {
	max-width: 760px;
	margin: .75rem 0 0;
	color: var(--vtc-line);
	line-height: 1.65;
}
@media (max-width: 991.98px) {
	.vtc-pkv-hub__hero-grid,
	.vtc-pkv-hub__cta-grid {
		grid-template-columns: 1fr;
	}
	.vtc-pkv-hub__cta-grid > .vtc-pkv-hub__button {
		justify-self: start;
	}
	.vtc-pkv-hub__audiences,
	.vtc-pkv-hub__topics,
	.vtc-pkv-hub__path {
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 639.98px) {
	.vtc-pkv-hub__container {
		width: min(100% - 1.25rem, var(--vtc-wrap));
	}
	.vtc-pkv-hub__audiences,
	.vtc-pkv-hub__topics,
	.vtc-pkv-hub__path {
		grid-template-columns: 1fr;
	}
	.vtc-pkv-hub__actions {
		display: grid;
	}
	.vtc-pkv-hub__button {
		width: 100%;
	}
}


/* -------------------------------------------------------------------
 * Kampagnen-Landingpages
 * Geltungsbereich: .vtc-campaign-*
 * Zuvor als <style>-Block in php/campaign-landing.php
 * ------------------------------------------------------------------- */

.vtc-campaign-author-wrap {
max-width: 1180px;
margin: 0 auto;
padding: 0 20px 44px;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box {
margin: 2rem 0 1.5rem;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card {
grid-template-columns: 230px minmax(0, 1fr);
gap: 1.6rem;
padding: 1.45rem;
border-radius: var(--vtc-radius);
box-shadow: var(--vtc-shadow-3);
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__media {
padding-right: 1.4rem;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__portrait {
width: 150px;
margin-bottom: .75rem;
background: #fff;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__portrait img {
width: 100%;
height: 100%;
object-fit: cover;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__portrait--logo img {
width: 76% !important;
height: 76% !important;
object-fit: contain !important;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__advisor {
font-size: var(--vtc-fs-base);
line-height: 1.15;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__role {
font-size: var(--vtc-fs-meta);
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__note {
font-size: var(--vtc-fs-ui);
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__signature {
font-size: var(--vtc-fs-h2-sm);;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__eyebrow {
margin-bottom: .4rem;
font-size: var(--vtc-fs-eyebrow);;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card h3 {
max-width: 100%;
margin: 0 0 .75rem;
color: var(--vtc-navy);
font-size: var(--vtc-fs-h3);;
line-height: 1.18;
hyphens: none;
overflow-wrap: normal;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card__contact {
gap: .55rem;
margin-bottom: 1.1rem;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-actions {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
gap: .65rem;
width: 100%;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-actions a {
width: 100%;
min-height: 54px;
padding: .65rem .75rem;
}
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-trust {
margin-top: 1rem;
padding-top: .9rem;
}
.vtc-campaign-thanks {
display: grid;
gap: .2rem;
margin: 0 0 1.2rem;
padding: 1rem 1.1rem;
border: 1px solid var(--vtc-line);
border-left: 4px solid var(--vtc-action);
background: var(--vtc-tint);
color: var(--vtc-ink);
}
.vtc-campaign-thanks strong {
color: var(--vtc-anchor);
font-size: var(--vtc-fs-base);
}
.vtc-campaign-thanks span {
font-size: var(--vtc-fs-sm);
}
@media (max-width: 767px) {
.vtc-page-wrap.vtc-campaign-author-wrap > .vtc-article-author-box .vtc-article-author-card h3 {
	font-size: var(--vtc-fs-h3);;
}
}


/* -------------------------------------------------------------------
 * Schwebende Kontaktflaeche im Footer
 * Geltungsbereich: .vtc-floating-*
 * Zuvor als <style>-Block in php/footer.php
 * ------------------------------------------------------------------- */

.vtc-floating-actions{position:fixed;right:1.25rem;bottom:1.25rem;z-index:1040;display:grid;gap:.7rem;justify-items:end;pointer-events:none}.vtc-floating-actions>*{pointer-events:auto}.vtc-floating-button{display:grid;width:54px;height:54px;place-items:center;border:0;border-radius:999px;color:#fff;box-shadow: var(--vtc-shadow-3);cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.vtc-floating-button:hover,.vtc-floating-button:focus-visible{transform:translateY(-2px);box-shadow: var(--vtc-shadow-3);outline:0}.vtc-floating-button .vtc-icon{width:1.35rem;height:1.35rem}.vtc-floating-button--top{background:var(--vtc-action)}.vtc-floating-button--contact{background:var(--vtc-ok)}.vtc-floating-button--contact:hover,.vtc-floating-button--contact:focus-visible{background:var(--vtc-ok)}.vtc-floating-contact{position:relative}.vtc-floating-contact__panel{position:absolute;right:0;bottom:calc(100% + .75rem);width:min(320px,calc(100vw - 2rem));padding:1rem;background:#fff;border:1px solid var(--vtc-line);border-radius: var(--vtc-radius);box-shadow: var(--vtc-shadow-3);color:var(--vtc-anchor)}.vtc-floating-contact__panel[hidden]{display:none!important}.vtc-floating-contact__headline{margin:0 0 .25rem;color:var(--vtc-anchor);font-size: var(--vtc-fs-base);font-weight: 600}.vtc-floating-contact__subline{margin:0 0 .85rem;color:var(--vtc-ink-2);font-size:var(--vtc-fs-meta);;line-height:1.45}.vtc-floating-contact__links{display:grid;gap:.55rem}.vtc-floating-contact__links a{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.7rem;min-height:52px;padding:.65rem .7rem;border:1px solid var(--vtc-line);border-radius: var(--vtc-radius);background:#fff;color:var(--vtc-anchor);text-decoration:none}.vtc-floating-contact__links a:hover,.vtc-floating-contact__links a:focus-visible{border-color:var(--vtc-line-2);background:var(--vtc-tint);color:var(--vtc-action);outline:0}.vtc-floating-contact__links span{display:grid;width:36px;height:36px;place-items:center;border-radius:50%;background:var(--vtc-tint);color:var(--vtc-action)}.vtc-floating-contact__links .vtc-icon{width:1rem;height:1rem}.vtc-floating-contact__links strong{display:block;font-size: var(--vtc-fs-sm);line-height:1.1}.vtc-floating-contact__links small{display:block;color:var(--vtc-ink-2);font-size:var(--vtc-fs-eyebrow);;line-height:1.2}.vtc-floating-contact__arrow{color:var(--vtc-action);font-weight: 600}.vtc-legal-modal__close svg,.vtc-contact-modal__close svg{display:block;width:1rem;height:1rem;fill:currentColor}@media (max-width:575.98px){.vtc-floating-actions{right:.85rem;bottom:.85rem}.vtc-floating-button{width:50px;height:50px}.vtc-floating-contact__panel{right:0;width:calc(100vw - 1.7rem)}}


/* -------------------------------------------------------------------
 * Hausportraet: das verticus-Maennchen
 *
 * Steht das Hauskonto (member_id 999999) als Autor, gibt es kein
 * Personenfoto. Dann tritt die Bildmarke an seine Stelle. Sie wird
 * eingepasst statt beschnitten - die Regeln dafuer stehen in style.css
 * als .vtc-article-author-card__portrait--logo bzw.
 * .vtc-sidebar-author-card__portrait--logo.
 *
 * Die Bildmarke ist bereits quadratisch zugeschnitten (img/verticus-
 * maennchen.png, 420px), deshalb reicht hier eine leichte Korrektur des
 * Massstabs gegenueber der frueheren, breiten Wortmarke.
 * ------------------------------------------------------------------- */

.vtc-article-author-card__portrait--logo img,
.vtc-sidebar-author-card__portrait--logo img {
	width: 82% !important;
	height: 82% !important;
	object-fit: contain !important;
}

