/*
 * Referenzsystem für öffentliche WordPress-Templates.
 * Baut ausschließlich auf den eingefrorenen Markenstudien-Tokens auf.
 */
.reference-platform {
	--c-brand: var(--blue);
	--c-brand-strong: var(--blue-dark);
	--c-brand-soft: var(--blue-pale);
	--c-navy: var(--night);
	--c-navy-2: var(--night-2);
	--c-ink: var(--ink);
	--c-ink-2: var(--ink-2);
	--c-ink-3: var(--muted);
	--c-line: var(--line);
	--c-line-strong: #b8c2c8;
	--c-surface: var(--stage);
	--c-surface-2: #e4e8ea;
	--c-white: var(--paper);
	--container: var(--page);
	--section-y: clamp(72px,7.5vw,116px);
	font-family: var(--font);
	color: var(--ink);
	background: var(--paper);
}

.reference-platform main {
	min-width: 0;
	overflow: clip;
}

.reference-platform .container {
	width: min(100%,var(--page));
	max-width: none;
	padding-inline: var(--gutter);
}

.reference-platform .section {
	padding-block: var(--section-y);
}

.reference-platform .section--tight {
	padding-block: clamp(52px,6vw,88px);
}

.reference-platform .section--surface {
	background: var(--stage);
}

.reference-platform .section--navy {
	background: var(--night);
	color: #fff;
}

.reference-platform .section__head {
	align-items: flex-end;
	gap: clamp(24px,4vw,64px);
	margin-bottom: clamp(32px,4vw,60px);
}

.reference-platform .section__head > :first-child {
	max-width: 840px;
}

.reference-platform h1,
.reference-platform h2,
.reference-platform h3,
.reference-platform h4,
.reference-platform .h1,
.reference-platform .h2,
.reference-platform .h3,
.reference-platform .h4 {
	color: var(--ink);
	font-family: var(--font);
	font-weight: 780;
	letter-spacing: -.045em;
	text-wrap: balance;
	overflow-wrap: anywhere;
	-webkit-hyphens: auto;
	hyphens: auto;
}

.reference-platform .h1,
.reference-platform h1 {
	max-width: 18ch;
	font-size: clamp(44px,5.3vw,82px);
	line-height: .98;
}

.reference-platform .h1--article {
	font-size: clamp(42px,4.7vw,72px);
}

.reference-platform .h2,
.reference-platform h2 {
	max-width: 24ch;
	font-size: clamp(34px,3.7vw,58px);
	line-height: 1.02;
}

.reference-platform .h3,
.reference-platform h3 {
	font-size: clamp(24px,2.2vw,34px);
	line-height: 1.08;
}

.reference-platform .h4,
.reference-platform h4 {
	font-size: clamp(19px,1.45vw,25px);
	line-height: 1.12;
	letter-spacing: -.025em;
}

.reference-platform .lead {
	max-width: 68ch;
	color: var(--ink-2);
	font-size: clamp(17px,1.35vw,21px);
	line-height: 1.52;
}

.reference-platform .eyebrow {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0 0 20px;
	color: var(--blue-dark);
	font-size: 11px;
	font-weight: 780;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.reference-platform .eyebrow::before {
	width: 42px;
	height: 3px;
	flex: 0 0 auto;
	background: currentColor;
	content: "";
}

.reference-platform .small {
	font-size: 13px;
	line-height: 1.55;
}

.reference-platform .muted {
	color: var(--muted);
}

.reference-platform .link {
	color: var(--blue-dark);
	font-weight: 730;
	text-decoration-thickness: 1px;
	text-underline-offset: 4px;
}

.reference-platform .link:hover {
	color: var(--ink);
	text-decoration: underline;
}

.reference-platform .btn {
	justify-content: space-between;
	gap: 30px;
	min-width: 190px;
	min-height: 54px;
	padding: 0 19px;
	border-width: 1px;
	border-radius: 0;
	font-size: 13px;
	font-weight: 730;
}

.reference-platform a.btn::after,
.reference-platform button.btn::after {
	font-size: 17px;
	font-weight: 400;
	content: "→";
}

.reference-platform .btn--sm {
	min-width: 0;
	min-height: 46px;
	padding-inline: 15px;
}

.reference-platform .btn--primary {
	border-color: var(--blue);
	background: var(--blue);
	color: #fff;
}

.reference-platform .btn--primary:hover {
	border-color: var(--blue-dark);
	background: var(--blue-dark);
}

.reference-platform .btn--outline,
.reference-platform .btn--ghost {
	border-color: var(--line);
	background: transparent;
	color: var(--ink);
}

.reference-platform .btn--outline:hover,
.reference-platform .btn--ghost:hover {
	border-color: var(--night);
	background: var(--night);
	color: #fff;
}

.reference-platform .btn--light {
	border-color: #fff;
	background: #fff;
	color: var(--night);
}

/* Breadcrumb */
.reference-platform .breadcrumb {
	margin-bottom: clamp(32px,4vw,58px);
}

.reference-platform .breadcrumb ol {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 12px;
}

.reference-platform .breadcrumb li {
	color: var(--muted);
	font-size: 12px;
	font-weight: 650;
}

.reference-platform .breadcrumb li:not(:last-child)::after {
	margin-left: 12px;
	color: #aeb8be;
	content: "/";
}

.reference-platform .breadcrumb li:last-child {
	color: var(--ink);
}

/* Hero-Familien */
.reference-platform main > .section:first-child,
.reference-platform .phero {
	position: relative;
	background: var(--paper);
}

.reference-platform main > .section:first-child::after,
.reference-platform .phero::after {
	position: absolute;
	right: var(--gutter);
	bottom: 0;
	left: var(--gutter);
	height: 1px;
	background: var(--line);
	content: "";
}

.reference-platform main > .section:first-child .lead {
	margin-top: clamp(24px,3vw,38px);
}

.reference-platform .phero {
	padding-block: clamp(52px,6vw,88px);
}

.reference-platform .phero__grid {
	display: grid;
	grid-template-columns: minmax(0,5fr) minmax(0,7fr);
	align-items: stretch;
	gap: clamp(36px,6vw,96px);
}

.reference-platform .phero__grid--text {
	grid-template-columns: minmax(0,880px);
}

.reference-platform .phero__grid > .phero__text,
.reference-platform .phero__grid > .phero__media {
	grid-column: auto;
}

.reference-platform .phero__text {
	align-self: center;
	min-width: 0;
}

.reference-platform .phero__media {
	position: relative;
	min-height: clamp(360px,39vw,620px);
	overflow: hidden;
	background: var(--stage);
}

.reference-platform .phero__media picture,
.reference-platform .phero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.reference-platform .phero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: clamp(28px,4vw,44px);
}

.reference-platform .kpis {
	display: grid;
	grid-template-columns: repeat(3,minmax(0,1fr));
	gap: 0 24px;
	margin-top: clamp(34px,4vw,54px);
	border-top: 1px solid var(--line);
}

.reference-platform .kpi {
	min-width: 0;
	padding-top: 16px;
	border-top: 3px solid var(--blue);
	transform: translateY(-1px);
}

.reference-platform .kpi dt {
	color: var(--muted);
	font-size: 10px;
	font-weight: 780;
	letter-spacing: .11em;
	text-transform: uppercase;
}

.reference-platform .kpi dd {
	margin: 7px 0 0;
	color: var(--ink);
	font-size: clamp(16px,1.35vw,22px);
	font-weight: 780;
	line-height: 1.18;
}

/* Kaufen-Übersicht */
.reference-route-kaufen main > .section:first-child {
	padding-bottom: clamp(62px,7vw,104px);
}

.reference-platform .ways {
	display: grid;
	grid-template-columns: repeat(3,minmax(0,1fr));
	gap: 1px;
	overflow: hidden;
	border: 1px solid var(--line);
	background: var(--line);
}

.reference-platform .way {
	display: flex;
	min-height: 350px;
	flex-direction: column;
	align-items: flex-start;
	padding: clamp(28px,3.4vw,48px);
	border: 0;
	background: var(--paper);
}

.reference-platform .way:nth-child(2) {
	background: var(--night);
	color: #fff;
}

.reference-platform .way:nth-child(2) h2,
.reference-platform .way:nth-child(2) h3,
.reference-platform .way:nth-child(2) p {
	color: #fff;
}

.reference-platform .way__num {
	margin-bottom: auto;
	color: var(--blue-dark);
	font-size: 12px;
	font-weight: 780;
	letter-spacing: .13em;
	text-transform: uppercase;
}

.reference-platform .way:nth-child(2) .way__num {
	color: #73d7ff;
}

.reference-platform .way > p:not(.way__num) {
	color: var(--ink-2);
	font-size: 15px;
	line-height: 1.55;
}

.reference-platform .way .btn {
	width: 100%;
	margin-top: 24px;
}

/* Produkt- und Linkkarten */
.reference-platform .cards {
	display: grid;
	grid-template-columns: repeat(4,minmax(0,1fr));
	gap: 1px;
	border: 1px solid var(--line);
	background: var(--line);
}

.reference-platform .card {
	display: flex;
	min-width: 0;
	flex-direction: column;
	border: 0;
	border-radius: 0;
	background: var(--paper);
	box-shadow: none;
}

.reference-platform .card__media {
	position: relative;
	display: grid;
	min-height: 250px;
	place-items: center;
	overflow: hidden;
	background: var(--stage);
}

.reference-platform .card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: transform .35s ease;
}

.reference-platform .card:hover .card__media img {
	transform: scale(1.025);
}

.reference-platform .badge {
	position: absolute;
	top: 16px;
	left: 16px;
	padding: 8px 11px;
	border-radius: 0;
	background: var(--blue);
	color: #fff;
	font-size: 10px;
	font-weight: 780;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.reference-platform .card__body {
	padding: clamp(22px,2.2vw,32px);
}

.reference-platform .card__series {
	margin-bottom: 10px;
	color: var(--blue-dark);
	font-size: 10px;
	font-weight: 780;
	letter-spacing: .11em;
	text-transform: uppercase;
}

.reference-platform .card__title {
	font-size: clamp(22px,1.8vw,28px);
}

.reference-platform .card__variant {
	color: var(--ink-2);
}

.reference-platform .card__specs {
	display: grid;
	gap: 8px;
	margin-top: 20px;
	padding-top: 18px;
	border-top: 1px solid var(--line);
	color: var(--muted);
	font-size: 12px;
}

.reference-platform .card__specs li::before {
	margin-right: 8px;
	color: var(--blue);
	content: "—";
}

.reference-platform .card__foot {
	display: grid;
	gap: 18px;
	margin-top: auto;
	padding: 0 clamp(22px,2.2vw,32px) clamp(24px,2.4vw,34px);
	border-top: 0;
}

.reference-platform .card__price {
	color: var(--ink);
	font-size: clamp(23px,2vw,30px);
	font-weight: 780;
	letter-spacing: -.035em;
}

.reference-platform .card__price-sub {
	display: block;
	margin-top: 2px;
	color: var(--muted);
	font-size: 10px;
	font-weight: 650;
	letter-spacing: .05em;
	text-transform: uppercase;
}

.reference-platform .card__actions {
	display: flex;
	align-items: center;
	gap: 18px;
}

.reference-platform .tiles {
	display: grid;
	gap: 1px;
	border: 1px solid var(--line);
	background: var(--line);
}

.reference-platform .tiles--3 {
	grid-template-columns: repeat(3,minmax(0,1fr));
}

.reference-platform .tiles--4 {
	grid-template-columns: repeat(4,minmax(0,1fr));
}

.reference-platform .tiles--5 {
	grid-template-columns: repeat(4,minmax(0,1fr));
}

.reference-platform .tile {
	min-width: 0;
	border: 0;
	border-radius: 0;
	background: var(--paper);
	box-shadow: none;
}

.reference-platform .tile > a {
	display: flex;
	min-height: 250px;
	flex-direction: column;
}

.reference-platform .tile__body {
	display: flex;
	height: 100%;
	flex-direction: column;
	padding: clamp(24px,2.8vw,38px);
}

.reference-platform .tile__name {
	max-width: none;
	font-size: clamp(22px,1.8vw,28px);
}

.reference-platform .tile__type {
	color: var(--ink-2);
}

.reference-platform .tile__price {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: auto;
	padding-top: 26px;
	color: var(--blue-dark);
	font-size: 12px;
	font-weight: 730;
}

.reference-platform .tile__arrow {
	font-size: 19px;
}

/* Editoriale Seiten und Pflichtinhalte */
.reference-platform .article__grid {
	display: grid;
	grid-template-columns: minmax(0,1fr) minmax(250px,340px);
	gap: clamp(44px,7vw,112px);
}

.reference-platform .article__grid--toc {
	grid-template-columns: minmax(170px,220px) minmax(0,760px) minmax(250px,330px);
}

.reference-platform .article__grid--legal {
	grid-template-columns: minmax(0,900px);
}

.reference-platform .article__grid--legal-toc {
	grid-template-columns: minmax(170px,220px) minmax(0,820px);
}

.reference-platform .article__grid > .prose,
.reference-platform .article__grid > .article__aside,
.reference-platform .article__grid--toc > .toc-box,
.reference-platform .article__grid--toc > .prose,
.reference-platform .article__grid--toc > .article__aside {
	grid-column: auto;
	min-width: 0;
}

.reference-platform .prose {
	max-width: 800px;
	color: var(--ink-2);
	font-size: 16px;
	line-height: 1.72;
}

.reference-platform .prose h2 {
	max-width: none;
	margin: clamp(44px,6vw,72px) 0 20px;
	font-size: clamp(27px,2.7vw,40px);
}

.reference-platform .prose h2:first-child {
	margin-top: 0;
}

.reference-platform .prose h3 {
	max-width: none;
	margin: 38px 0 16px;
	font-size: clamp(21px,2vw,29px);
}

.reference-platform .prose p,
.reference-platform .prose ul,
.reference-platform .prose ol {
	margin-bottom: 22px;
}

.reference-platform .prose ul,
.reference-platform .prose ol {
	display: grid;
	gap: 10px;
	padding-left: 1.25em;
}

.reference-platform .prose ul {
	list-style: square;
}

.reference-platform .prose ol {
	list-style: decimal;
}

.reference-platform .prose a {
	color: var(--blue-dark);
	font-weight: 680;
	text-decoration: underline;
	text-underline-offset: 4px;
}

.reference-platform .asidebox,
.reference-platform .toc-box,
.reference-platform .kontextbox {
	padding: 26px;
	border: 1px solid var(--line);
	border-radius: 0;
	background: var(--paper);
	box-shadow: none;
}

.reference-platform .asidebox + .asidebox {
	margin-top: 14px;
}

.reference-platform .asidebox--cta {
	border-color: var(--night);
	background: var(--night);
	color: #fff;
}

.reference-platform .asidebox--cta .eyebrow {
	color: #73d7ff;
}

.reference-platform .asidebox--cta .btn {
	width: 100%;
	margin-top: 14px;
}

.reference-platform .toc-box {
	align-self: start;
	position: sticky;
	top: calc(var(--shell-height,68px) + 28px);
}

.reference-platform .toc-box ol,
.reference-platform .asidebox__list {
	display: grid;
	gap: 0;
}

.reference-platform .toc-box li,
.reference-platform .asidebox__list li {
	border-top: 1px solid var(--line);
}

.reference-platform .toc-box a,
.reference-platform .asidebox__list a {
	display: block;
	padding: 12px 0;
	font-size: 13px;
}

/* Formulare */
.reference-platform .form-grid {
	display: grid;
	grid-template-columns: minmax(0,5fr) minmax(0,6fr);
	gap: clamp(48px,8vw,126px);
}

.reference-platform .form-grid > .form-intro,
.reference-platform .form-grid > .form {
	grid-column: auto;
}

.reference-platform .form-intro {
	align-self: start;
}

.reference-platform .form {
	display: grid;
	gap: 34px;
	padding: clamp(26px,4vw,52px);
	border: 1px solid var(--line);
	border-radius: 0;
	background: var(--stage);
	box-shadow: none;
}

.reference-platform .form fieldset {
	display: grid;
	gap: 20px;
}

.reference-platform .form fieldset + fieldset {
	padding-top: 30px;
	border-top: 1px solid var(--line);
}

.reference-platform .form__step {
	display: block;
	margin-bottom: 2px;
	color: var(--ink);
	font-size: 13px;
	font-weight: 780;
	letter-spacing: .09em;
	text-transform: uppercase;
}

.reference-platform .form__row {
	display: grid;
	grid-template-columns: repeat(2,minmax(0,1fr));
	gap: 16px;
}

.reference-platform .field {
	display: grid;
	gap: 8px;
	min-width: 0;
}

.reference-platform .field label {
	color: var(--ink);
	font-size: 12px;
	font-weight: 730;
}

.reference-platform .field input,
.reference-platform .field select,
.reference-platform .field textarea,
.reference-platform .dealer__form input {
	width: 100%;
	min-height: 54px;
	padding: 14px 16px;
	border: 1px solid #bfc9cf;
	border-radius: 0;
	background-color: #fff;
	color: var(--ink);
	box-shadow: none;
}

.reference-platform .field textarea {
	min-height: 112px;
	resize: vertical;
}

.reference-platform .field input:focus,
.reference-platform .field select:focus,
.reference-platform .field textarea:focus,
.reference-platform .dealer__form input:focus {
	border-color: var(--blue);
	outline: 2px solid var(--blue);
	outline-offset: 0;
}

.reference-platform .field small {
	color: var(--muted);
	font-size: 11px;
	line-height: 1.45;
}

.reference-platform .field--error input,
.reference-platform .field--error select,
.reference-platform .field--error textarea {
	border-color: #b62b2b;
}

.reference-platform .field__error,
.reference-platform .form__error {
	color: #8f1d1d;
}

.reference-platform .form__error {
	padding: 16px 18px;
	border-left: 4px solid #b62b2b;
	background: #fff0f0;
}

.reference-platform .check {
	display: grid;
	grid-template-columns: 22px minmax(0,1fr);
	align-items: start;
	gap: 12px;
	color: var(--ink-2);
	font-size: 13px;
	line-height: 1.5;
}

.reference-platform .check input {
	width: 20px;
	height: 20px;
	margin: 1px 0 0;
	accent-color: var(--blue);
}

.reference-platform .form__privacy {
	margin: 0;
	padding: 16px 0 0;
	border-top: 1px solid var(--line);
	color: var(--muted);
	font-size: 12px;
	line-height: 1.55;
}

.reference-platform .dealer__form {
	display: grid;
	grid-template-columns: minmax(0,1fr) auto;
	align-items: end;
	gap: 10px;
	max-width: 900px;
	margin-top: 34px;
	padding: 18px;
	border: 1px solid var(--line);
	border-radius: 0;
	background: var(--stage);
}

/* Suche, Fehler und Listen */
.reference-platform .list--articles {
	display: grid;
	gap: 1px;
	border: 1px solid var(--line);
	background: var(--line);
}

.reference-platform .list__item {
	background: var(--paper);
}

.reference-platform .list__item > a {
	display: grid;
	grid-template-columns: minmax(100px,150px) minmax(180px,1fr) minmax(260px,1.5fr);
	align-items: baseline;
	gap: 24px;
	padding: 24px clamp(20px,3vw,38px);
}

.reference-platform .list__meta {
	display: block;
	text-align: left;
	white-space: normal;
	color: var(--blue-dark);
	font-size: 10px;
	font-weight: 780;
	letter-spacing: .11em;
	text-transform: uppercase;
}

.reference-platform .list__title {
	color: var(--ink);
	font-size: 18px;
	font-weight: 760;
}

.reference-platform .list__teaser {
	color: var(--muted);
	font-size: 13px;
	line-height: 1.5;
}

.reference-platform .chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.reference-platform .chip {
	display: inline-flex;
	align-items: center;
	min-height: 46px;
	padding: 0 16px;
	border: 1px solid var(--line);
	border-radius: 0;
	background: var(--paper);
	color: var(--ink);
	font-size: 12px;
	font-weight: 700;
}

.reference-platform .chip > span {
	display: inline;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	font: inherit;
}

.reference-platform .chip:hover {
	border-color: var(--blue);
	color: var(--blue-dark);
}

/* HTML-Sitemap */
.reference-platform .sitemap-grid {
	display: grid;
	grid-template-columns: repeat(2,minmax(0,1fr));
	gap: 1px;
	border: 1px solid var(--line);
	background: var(--line);
}

.reference-platform .sitemap-group {
	min-width: 0;
	padding: clamp(28px,4vw,54px);
	background: var(--paper);
}

.reference-platform .sitemap-group:nth-child(2) {
	background: var(--night);
	color: #fff;
}

.reference-platform .sitemap-group:nth-child(2) h2,
.reference-platform .sitemap-group:nth-child(2) h3 {
	color: #fff;
}

.reference-platform .sitemap-group:nth-child(2) .eyebrow {
	color: #73d7ff;
}

.reference-platform .sitemap-group > p:not(.eyebrow) {
	max-width: 62ch;
	color: var(--muted);
}

.reference-platform .sitemap-group:nth-child(2) > p:not(.eyebrow) {
	color: #aab9c4;
}

.reference-platform .sitemap-group__overview {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	min-height: 54px;
	margin-top: 26px;
	padding: 0 17px;
	background: var(--blue);
	color: #fff;
	font-size: 13px;
	font-weight: 730;
}

.reference-platform .sitemap-group__links {
	display: grid;
	grid-template-columns: repeat(2,minmax(0,1fr));
	gap: 30px;
	margin-top: 34px;
}

.reference-platform .sitemap-group__links h3 {
	margin-bottom: 12px;
	color: var(--muted);
	font-size: 10px;
	font-weight: 780;
	letter-spacing: .11em;
	text-transform: uppercase;
}

.reference-platform .sitemap-group__links li {
	border-top: 1px solid var(--line);
}

.reference-platform .sitemap-group:nth-child(2) .sitemap-group__links li {
	border-color: rgba(255,255,255,.16);
}

.reference-platform .sitemap-group__links a {
	display: block;
	padding: 10px 0;
	font-size: 13px;
	font-weight: 650;
}

.reference-platform .sitemap-legal {
	display: grid;
	grid-template-columns: repeat(5,minmax(0,1fr));
	gap: 1px;
	border: 1px solid var(--line);
	background: var(--line);
}

.reference-platform .sitemap-legal a {
	display: flex;
	min-height: 100px;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 20px;
	background: var(--paper);
	font-size: 13px;
	font-weight: 730;
}

/* Preislisten und Daten */
.reference-platform .toc {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 34px;
}

.reference-platform .pl-title {
	max-width: none;
	margin: clamp(38px,5vw,62px) 0 16px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--line);
}

.reference-platform .table-scroll,
.reference-platform .table-wrap {
	max-width: 100%;
	overflow-x: auto;
	border: 1px solid var(--line);
	background: var(--paper);
	-webkit-overflow-scrolling: touch;
}

.reference-platform .table {
	width: 100%;
	min-width: 680px;
	border-collapse: collapse;
}

.reference-platform .table th,
.reference-platform .table td {
	padding: 14px 16px;
	border: 0;
	border-bottom: 1px solid var(--line);
	font-size: 13px;
}

.reference-platform .table thead th {
	position: sticky;
	top: 0;
	background: var(--night);
	color: #fff;
	font-size: 10px;
	font-weight: 780;
	letter-spacing: .09em;
	text-transform: uppercase;
}

.reference-platform .table tbody tr:hover {
	background: var(--blue-pale);
}

/* Schritte, Argumente und Bestätigung */
.reference-platform .argumente,
.reference-platform .schritte {
	display: grid;
	grid-template-columns: repeat(4,minmax(0,1fr));
	gap: 1px;
	border: 1px solid var(--line);
	background: var(--line);
	counter-reset: steps;
}

.reference-route-danke .schritte {
	grid-template-columns: repeat(3,minmax(0,1fr));
}

.reference-platform .argumente li,
.reference-platform .schritte li {
	position: relative;
	min-width: 0;
	padding: 68px clamp(22px,2.6vw,36px) 30px;
	background: var(--paper);
	counter-increment: steps;
}

.reference-platform .argumente li::before,
.reference-platform .schritte li::before {
	position: absolute;
	top: 25px;
	left: clamp(22px,2.6vw,36px);
	color: var(--blue-dark);
	font-size: 11px;
	font-weight: 780;
	letter-spacing: .12em;
	content: "0" counter(steps);
}

.reference-platform .argumente strong,
.reference-platform .schritte strong {
	display: block;
	margin-bottom: 9px;
	color: var(--ink);
}

/* CTA */
.reference-platform .cta-band {
	padding-block: clamp(62px,7vw,104px);
	background: var(--night);
	color: #fff;
}

.reference-platform .cta-band__row {
	display: grid;
	grid-template-columns: minmax(0,1fr) auto;
	align-items: end;
	gap: clamp(32px,7vw,110px);
}

.reference-platform .cta-band h2 {
	max-width: 18ch;
	color: #fff;
	font-size: clamp(36px,4.4vw,68px);
}

.reference-platform .cta-band p {
	max-width: 64ch;
	margin: 18px 0 0;
	color: #b4c2cc;
	font-size: 16px;
}

.reference-platform .cta-band__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 9px;
}

.reference-platform .cta-band .btn--primary {
	border-color: var(--blue);
	background: var(--blue);
}

/* FAQ */
.reference-platform .faq {
	border-top: 1px solid var(--line);
}

.reference-platform .faq details {
	border-bottom: 1px solid var(--line);
}

.reference-platform .faq summary {
	min-height: 64px;
	padding: 20px 44px 20px 0;
	font-weight: 730;
}

.reference-platform .faq details > div,
.reference-platform .faq details > p {
	max-width: 780px;
	padding: 0 44px 24px 0;
	color: var(--ink-2);
}

/* Responsive */
@media (max-width: 1180px) {
	.reference-platform .cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.reference-platform .tiles--4,
	.reference-platform .tiles--5 { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.reference-platform .sitemap-legal { grid-template-columns: repeat(3,minmax(0,1fr)); }
	.reference-platform .article__grid--toc { grid-template-columns: minmax(0,1fr) minmax(250px,320px); }
	.reference-platform .article__grid--legal,
	.reference-platform .article__grid--legal-toc { grid-template-columns: minmax(0,900px); }
	.reference-platform .article__grid--toc .toc-box { position: static; grid-column: 1 / -1; }
	.reference-platform .toc-box ol { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 900px) {
	.reference-platform .phero__grid,
	.reference-platform .form-grid,
	.reference-platform .article__grid,
	.reference-platform .article__grid--toc {
		grid-template-columns: minmax(0,1fr);
	}
	.reference-platform .form-grid > .form-intro { order: 0; }
	.reference-platform .form-grid > .form { order: 1; }
	.reference-platform .phero__media { min-height: clamp(320px,70vw,560px); }
	.reference-platform .ways { grid-template-columns: minmax(0,1fr); }
	.reference-platform .way { min-height: 280px; }
	.reference-platform .argumente,
	.reference-platform .schritte,
	.reference-route-danke .schritte { grid-template-columns: repeat(2,minmax(0,1fr)); }
	.reference-platform .cta-band__row { grid-template-columns: minmax(0,1fr); }
}

@media (max-width: 640px) {
	.reference-platform {
		--section-y: 64px;
	}
	.reference-platform .h1,
	.reference-platform h1,
	.reference-platform .h1--article {
		font-size: clamp(38px,12vw,54px);
		overflow-wrap: anywhere;
		-webkit-hyphens: auto;
		hyphens: auto;
	}
	.reference-platform .h2,
	.reference-platform h2 { font-size: clamp(30px,9vw,42px); }
	.reference-platform .breadcrumb { margin-bottom: 28px; }
	.reference-platform .phero { padding-block: 46px 64px; }
	.reference-platform .phero__grid { gap: 34px; }
	.reference-platform .phero__media { min-height: 280px; }
	.reference-platform .phero__actions,
	.reference-platform .card__actions,
	.reference-platform .cta-band__actions { display: grid; grid-template-columns: minmax(0,1fr); width: 100%; }
	.reference-platform .btn { width: 100%; }
	.reference-platform .kpis { grid-template-columns: minmax(0,1fr); gap: 18px; }
	.reference-platform .cards,
	.reference-platform .tiles--4,
	.reference-platform .tiles--5,
	.reference-platform .sitemap-grid,
	.reference-platform .sitemap-legal { grid-template-columns: minmax(0,1fr); }
	.reference-platform .sitemap-group__links { grid-template-columns: minmax(0,1fr); }
	.reference-platform .card__media { min-height: 240px; }
	.reference-platform .form { padding: 22px 16px; }
	.reference-platform .form__row { grid-template-columns: minmax(0,1fr); }
	.reference-platform .dealer__form { grid-template-columns: minmax(0,1fr); }
	.reference-platform .list__item > a { grid-template-columns: minmax(0,1fr); gap: 8px; }
	.reference-platform .argumente,
	.reference-platform .schritte,
	.reference-route-danke .schritte { grid-template-columns: minmax(0,1fr); }
	.reference-platform .toc-box ol { grid-template-columns: minmax(0,1fr); }
}
