/* GENERIERT aus HAPERT-Go-Black-Assistant.css. Nicht manuell editieren. */

.gb-assistant {
	width: min(94vw, 1380px);
	height: min(92vh, 900px);
	max-width: none;
	max-height: none;
	margin: auto;
	padding: 0;
	border: 0;
	background: #f4f7f8;
	color: #0b1116;
	font-family: var(--font, Arial, sans-serif);
	box-shadow: 0 30px 90px rgba(0,0,0,.42);
}
.gb-assistant [hidden] { display: none !important; }
.gb-assistant::backdrop { background: rgba(3,8,12,.78); backdrop-filter: blur(5px); }
.gb-assistant[open] { animation: gb-in .22s ease both; }
@keyframes gb-in { from { opacity: 0; transform: translateY(12px) scale(.992); } }
.gb-assistant__shell { display: grid; grid-template-rows: 78px minmax(0,1fr) 74px; height: 100%; }
.gb-assistant__head {
	display: grid;
	grid-template-columns: 260px minmax(0,1fr) 58px;
	align-items: center;
	border-bottom: 1px solid #d7dee2;
	background: #fff;
}
.gb-assistant__brand { padding-left: 28px; }
.gb-assistant__brand span { display: block; color: #778690; font-size: 8px; font-weight: 760; letter-spacing: .14em; text-transform: uppercase; }
.gb-assistant__brand strong { display: block; margin-top: 5px; font-size: 16px; letter-spacing: -.02em; }
.gb-assistant__progress { display: grid; grid-template-columns: repeat(3,1fr); align-self: stretch; }
.gb-assistant__progress span {
	position: relative;
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 0 20px;
	border-left: 1px solid #e1e6e8;
	color: #8a979f;
	font-size: 9px;
	font-weight: 730;
	letter-spacing: .09em;
	text-transform: uppercase;
}
.gb-assistant__progress span::after {
	content: "";
	position: absolute;
	right: 0; bottom: -1px; left: 0;
	height: 3px;
	background: var(--blue);
	transform: scaleX(0);
	transform-origin: left;
}
.gb-assistant__progress span.is-active { color: var(--blue-dark); }
.gb-assistant__progress span.is-active::after { transform: scaleX(1); }
.gb-assistant__progress b { color: #a7b2b9; font-size: 9px; }
.gb-assistant__close {
	align-self: stretch;
	border: 0;
	border-left: 1px solid #e1e6e8;
	background: #fff;
	color: #32434e;
	font-size: 26px;
	cursor: pointer;
}
.gb-assistant__close:hover { background: #eef2f4; }
.gb-assistant__body { display: grid; grid-template-columns: 340px minmax(0,1fr); min-height: 0; }
.gb-summary {
	display: flex;
	flex-direction: column;
	min-height: 0;
	padding: 28px;
	background:
		radial-gradient(circle at 15% 14%, rgba(0,157,223,.13), transparent 30%),
		#071017;
	color: #fff;
}
.gb-summary__eyebrow { color: #74d7ff; font-size: 8px; font-weight: 760; letter-spacing: .13em; text-transform: uppercase; }
.gb-summary__visual {
	position: relative;
	height: 215px;
	margin: 18px -8px 22px;
	background: radial-gradient(ellipse at 50% 72%, rgba(255,255,255,.11), transparent 55%);
}
.gb-summary__visual img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 18px 13px rgba(0,0,0,.48)); }
.gb-summary__visual-label {
	position: absolute;
	right: 4px;
	bottom: 2px;
	padding: 5px 7px;
	border: 1px solid rgba(255,255,255,.16);
	background: rgba(4,10,14,.72);
	color: #9eafb9;
	font-size: 7px;
	font-weight: 720;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.gb-summary__empty { display: grid; place-items: center; height: 100%; color: #82929d; font-size: 11px; text-align: center; }
.gb-summary h3 { margin: 0; color: #fff; font-size: 27px; line-height: 1; letter-spacing: -.04em; }
.gb-summary__meta { margin: 8px 0 0; color: #91a1ab; font-size: 10px; line-height: 1.5; }
.gb-summary__selection { margin: 22px 0 0; padding: 0; border-top: 1px solid rgba(255,255,255,.14); list-style: none; }
.gb-summary__selection li { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.1); color: #b7c3ca; font-size: 9px; }
.gb-summary__selection b { color: #fff; font-weight: 650; text-align: right; }
.gb-summary__price { margin-top: auto; padding-top: 22px; }
.gb-summary__price span { display: block; color: #82939d; font-size: 8px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.gb-summary__price strong { display: block; margin-top: 6px; font-size: 30px; letter-spacing: -.035em; }
.gb-summary__price small { display: block; margin-top: 5px; color: #7f909a; font-size: 8px; line-height: 1.45; }
.gb-content { min-width: 0; min-height: 0; overflow: auto; padding: 32px 36px 38px; }
.gb-panel[hidden] { display: none; }
.gb-panel__head { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 24px; }
.gb-panel__head span { color: var(--blue-dark); font-size: 8px; font-weight: 760; letter-spacing: .13em; text-transform: uppercase; }
.gb-panel__head h2 { margin: 6px 0 0; font-size: 34px; line-height: 1; letter-spacing: -.04em; }
.gb-panel__head p { max-width: 400px; margin: 0; color: #6e7d86; font-size: 11px; line-height: 1.55; }
.gb-pillar-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; padding: 1px; background: #ced7dc; }
.gb-pillar {
	position: relative;
	min-height: 86px;
	padding: 15px;
	border: 0;
	background: #fff;
	color: #53636d;
	text-align: left;
	cursor: pointer;
}
.gb-pillar::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: var(--blue); transform: scaleX(0); transform-origin: left; }
.gb-pillar[aria-pressed="true"] { background: #edf3f5; color: #0b1116; }
.gb-pillar[aria-pressed="true"]::after { transform: scaleX(1); }
.gb-pillar b { display: block; color: #93a1aa; font-size: 8px; }
.gb-pillar strong { display: block; margin-top: 13px; font-size: 12px; line-height: 1.2; }
.gb-series { display: flex; gap: 8px; margin: 22px 0 14px; }
.gb-series button { padding: 8px 12px; border: 1px solid #ced8dd; background: #fff; color: #63747e; font-size: 9px; font-weight: 700; cursor: pointer; }
.gb-series button[aria-pressed="true"] { border-color: #122633; background: #122633; color: #fff; }
.gb-models { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }
.gb-model {
	display: grid;
	grid-template-columns: 94px minmax(0,1fr);
	align-items: center;
	min-height: 104px;
	padding: 10px 12px 10px 8px;
	border: 1px solid #d4dde1;
	background: #fff;
	text-align: left;
	cursor: pointer;
}
.gb-model[aria-pressed="true"] { border-color: var(--blue); box-shadow: inset 0 -3px var(--blue); background: #f1f6f8; }
.gb-model img { width: 92px; height: 72px; object-fit: contain; }
.gb-model span { min-width: 0; }
.gb-model strong { display: block; font-size: 13px; }
.gb-model small { display: block; margin-top: 5px; color: #788892; font-size: 8px; line-height: 1.3; }
.gb-start-context { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 13px; border-left: 3px solid var(--blue); background: #e8f3f7; }
.gb-start-context span { color: #6c7d87; font-size: 8px; font-weight: 720; letter-spacing: .08em; text-transform: uppercase; }
.gb-start-context strong { color: #15303f; font-size: 11px; }
.gb-choice { margin-top: 20px; }
.gb-choice > header { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.gb-choice > header span { color: var(--blue-dark); font-size: 8px; font-weight: 780; letter-spacing: .09em; }
.gb-choice > header h3 { margin: 0; font-size: 14px; letter-spacing: -.02em; }
.gb-qc-series { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; }
.gb-qc-series button {
	position: relative;
	min-height: 64px;
	padding: 12px 13px;
	border: 1px solid #d2dce1;
	background: #fff;
	color: #687983;
	text-align: left;
	cursor: pointer;
}
.gb-qc-series button strong { display: block; color: #192a34; font-size: 12px; }
.gb-qc-series button small { display: block; margin-top: 5px; font-size: 8px; }
.gb-qc-series button[aria-pressed="true"] { border-color: var(--blue); background: #eff7fa; box-shadow: inset 0 -3px var(--blue); }
.gb-qc-axes { display: grid; grid-template-columns: repeat(3, minmax(0,150px)); gap: 8px; }
.gb-qc-axes button { min-height: 58px; padding: 9px 14px; border: 1px solid #d2dce1; background: #fff; color: #6c7d87; cursor: pointer; text-align: left; }
.gb-qc-axes button strong { display: block; color: #172933; font-size: 12px; }
.gb-qc-axes button small { display: block; margin-top: 4px; font-size: 8px; }
.gb-qc-axes button[aria-pressed="true"] { border-color: var(--blue); background: var(--blue); color: rgba(255,255,255,.78); }
.gb-qc-axes button[aria-pressed="true"] strong { color: #fff; }
.gb-basis-line { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 18px; padding: 12px 14px; border: 1px solid #d2dce1; background: #fff; }
.gb-basis-line span { color: #53656f; font-size: 10px; font-weight: 650; }
.gb-basis-line button { padding: 0; border: 0; background: transparent; color: var(--blue-dark); font: 720 9px/1 var(--font); cursor: pointer; }
.gb-basis { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; padding-top: 18px; border-top: 1px solid #d5dde1; }
.gb-field label { display: block; margin-bottom: 7px; color: #62737d; font-size: 8px; font-weight: 730; letter-spacing: .08em; text-transform: uppercase; }
.gb-field input,.gb-field select,.gb-field textarea { box-sizing: border-box; width: 100%; min-height: 46px; padding: 0 12px; border: 1px solid #cbd5da; border-radius: 0; background-color: #fff; color: #0b1116; font: 600 11px/1.3 var(--font); }
.gb-field select {
	height: 46px;
	padding: 0 42px 0 13px;
	-webkit-appearance: none;
	appearance: none;
	-webkit-text-fill-color: #0b1116;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='m3 5 4 4 4-4' fill='none' stroke='%23364750' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	background-size: 14px;
	line-height: normal;
	text-indent: 0;
	color-scheme: light;
}
.gb-field select::-ms-expand { display: none; }
.gb-field select:disabled { background-color: #edf1f3; color: #7c8b94; -webkit-text-fill-color: #7c8b94; }
.gb-field select option { background: #fff; color: #0b1116; font-weight: 500; }
.gb-field textarea { min-height: 78px; padding-block: 11px; resize: vertical; }
.gb-options-layout { display: grid; grid-template-columns: 1.05fr .95fr; gap: 22px; }
.gb-subhead { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.gb-subhead strong { font-size: 13px; }
.gb-subhead small { color: #7d8b94; font-size: 8px; }
.gb-option-list { display: grid; gap: 8px; }
.gb-option {
	position: relative;
	display: grid;
	grid-template-columns: 72px minmax(0,1fr) auto;
	align-items: center;
	gap: 12px;
	min-height: 82px;
	padding: 8px 12px 8px 8px;
	border: 1px solid #d3dce1;
	background: #fff;
	cursor: pointer;
}
.gb-option.is-selected { border-color: var(--blue); background: #f0f7fa; }
.gb-option.is-unavailable { opacity: .48; cursor: not-allowed; }
.gb-option img { width: 70px; height: 62px; object-fit: cover; background: #eef2f4; }
.gb-option__copy strong { display: block; font-size: 11px; }
.gb-option__copy small { display: block; margin-top: 4px; color: #75858f; font-size: 8px; line-height: 1.35; }
.gb-option__price { font-size: 10px; font-weight: 750; white-space: nowrap; }
.gb-option input { position: absolute; opacity: 0; pointer-events: none; }
.gb-extras-search { margin-bottom: 10px; }
.gb-extras { max-height: 325px; overflow: auto; border-top: 1px solid #d6dee2; }
.gb-extra { display: grid; grid-template-columns: 20px minmax(0,1fr) auto; gap: 10px; align-items: center; min-height: 54px; padding: 9px 4px; border-bottom: 1px solid #d6dee2; font-size: 9px; }
.gb-extra input { accent-color: var(--blue); }
.gb-extra small { color: #7c8b94; font-size: 8px; }
.gb-warning { margin-top: 16px; padding: 11px 13px; border-left: 3px solid #d49500; background: #fff7df; color: #5e4b1f; font-size: 9px; line-height: 1.45; }
.gb-warning[hidden] { display: none; }
.gb-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.gb-contact-grid .gb-field--full { grid-column: 1/-1; }
.gb-contact-consent { display: flex; align-items: flex-start; gap: 10px; grid-column: 1/-1; color: #566771; font-size: 9px; line-height: 1.5; }
.gb-contact-consent input { margin-top: 2px; accent-color: var(--blue); }
.gb-contact-channel { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; border: 0; }
.gb-contact-channel legend { width: 100%; margin-bottom: 7px; color: #62737d; font-size: 8px; font-weight: 730; letter-spacing: .08em; text-transform: uppercase; }
.gb-contact-channel label { position: relative; flex: 1 1 190px; }
.gb-contact-channel input { position: absolute; opacity: 0; pointer-events: none; }
.gb-contact-channel span { display: grid; place-items: center; min-height: 43px; padding: 0 12px; border: 1px solid #cbd5da; background: #fff; color: #51636e; font-size: 10px; font-weight: 650; cursor: pointer; text-align: center; }
.gb-contact-channel input:checked + span { border-color: var(--blue); background: #eaf6fb; color: #0a709d; box-shadow: inset 0 -2px var(--blue); }
.gb-contact-channel input:focus-visible + span { outline: 2px solid var(--blue); outline-offset: 2px; }
.gb-contact-privacy {
	grid-column: 1/-1;
	margin: 0;
	padding: 3px 0 2px;
	color: #586a75;
	font-size: 10px;
	line-height: 1.6;
}
.gb-contact-privacy a { color: var(--blue-dark); font-weight: 720; text-decoration: underline; text-underline-offset: 2px; }
.gb-contact-trust { grid-column: 1/-1; padding: 12px 14px; background: #e8f4f8; color: #38505e; font-size: 9px; line-height: 1.5; }
.gb-field-error { margin-top: 5px; color: #a52a2a; font-size: 8px; }
.gb-success { display: grid; place-items: center; min-height: 470px; text-align: center; }
.gb-success__mark { display: grid; place-items: center; width: 58px; height: 58px; margin: 0 auto 20px; border-radius: 50%; background: var(--blue); color: #fff; font-size: 25px; }
.gb-success h2 { margin: 0; font-size: 38px; letter-spacing: -.04em; }
.gb-success p { max-width: 520px; margin: 14px auto 0; color: #677782; font-size: 12px; line-height: 1.6; }
.gb-success__actions { display: flex; justify-content: center; gap: 12px; margin-top: 25px; }
.gb-assistant__foot { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 0 28px; border-top: 1px solid #d3dce1; background: #fff; }
.gb-assistant__foot p { margin: 0; color: #73828c; font-size: 9px; }
.gb-assistant__foot-actions { display: flex; gap: 10px; }
.gb-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 150px; height: 45px; padding: 0 16px; border: 1px solid #cbd5da; background: #fff; color: #1b2d38; font: 720 10px/1 var(--font); cursor: pointer; }
.gb-btn--primary { border-color: var(--blue); background: var(--blue); color: #fff; }
.gb-btn:disabled { opacity: .42; cursor: not-allowed; }
.gb-assistant button:focus-visible,.gb-assistant input:focus-visible,.gb-assistant select:focus-visible,.gb-assistant textarea:focus-visible { outline: 2px solid var(--blue); outline-offset: 2px; }
body:has(.gb-assistant[open]) { overflow: hidden; }

@media (max-width: 1024px) {
	.gb-assistant { width: min(96vw, 980px); height: min(94dvh, 980px); }
	.gb-assistant__head { grid-template-columns: 210px minmax(0,1fr) 54px; }
	.gb-assistant__body { grid-template-columns: 280px minmax(0,1fr); }
	.gb-summary { padding: 22px; }
	.gb-content { padding: 27px 28px 32px; }
	.gb-models { grid-template-columns: 1fr 1fr; }
	.gb-options-layout { grid-template-columns: 1fr; }
	.gb-extras { max-height: 260px; }
}

@media (max-width: 768px) {
	.gb-assistant {
		inset: 0;
		width: 100vw;
		height: 100dvh;
		margin: 0;
		max-width: none;
		max-height: none;
	}
	.gb-assistant::backdrop { background: rgba(3,8,12,.86); backdrop-filter: none; }
	.gb-assistant__shell { grid-template-rows: calc(64px + env(safe-area-inset-top)) minmax(0,1fr) auto; }
	.gb-assistant__head { grid-template-columns: minmax(0,1fr) auto 50px; padding-top: env(safe-area-inset-top); }
	.gb-assistant__brand { padding-left: 16px; }
	.gb-assistant__brand span { font-size: 7px; }
	.gb-assistant__brand strong { font-size: 14px; }
	.gb-assistant__progress { align-self: center; display: flex; height: 100%; }
	.gb-assistant__progress span { width: 42px; padding: 0; justify-content: center; border-left: 0; font-size: 0; }
	.gb-assistant__progress b { font-size: 9px; }
	.gb-assistant__close { width: 50px; }
	.gb-assistant__body { display: block; overflow-y: auto; }
	.gb-summary {
		display: grid;
		grid-template-columns: 96px minmax(0,1fr) auto;
		grid-template-rows: auto auto;
		gap: 4px 12px;
		min-height: 124px;
		padding: 12px 16px;
	}
	.gb-summary__eyebrow { grid-column: 2/-1; }
	.gb-summary__visual { grid-row: 1/3; height: 96px; margin: 0; }
	.gb-summary__visual-label { display: none; }
	.gb-summary h3 { grid-column: 2; font-size: 20px; }
	.gb-summary__meta { grid-column: 2; margin: 0; }
	.gb-summary__selection { display: none; }
	.gb-summary__price { grid-column: 3; grid-row: 1/3; align-self: center; margin: 0; padding: 0; text-align: right; }
	.gb-summary__price strong { font-size: 20px; }
	.gb-summary__price small { display: none; }
	.gb-content { overflow: visible; padding: 24px 16px 110px; }
	.gb-panel__head { align-items: flex-start; margin-bottom: 18px; }
	.gb-panel__head h2 { font-size: 28px; }
	.gb-panel__head p { display: none; }
	.gb-qc-series { grid-template-columns: 1fr 1fr; }
	.gb-qc-axes { grid-template-columns: repeat(3,1fr); }
	.gb-models { grid-template-columns: 1fr; }
	.gb-model { min-height: 90px; }
	.gb-basis { grid-template-columns: 1fr; }
	.gb-options-layout { grid-template-columns: 1fr; }
	.gb-option { grid-template-columns: 62px minmax(0,1fr); }
	.gb-option img { width: 60px; height: 54px; }
	.gb-option__price { grid-column: 2; }
	.gb-contact-grid { grid-template-columns: 1fr; }
	.gb-contact-grid .gb-field--full,.gb-contact-privacy,.gb-contact-trust { grid-column: 1; }
	.gb-success { min-height: 430px; }
	.gb-success__actions { flex-direction: column; }
	.gb-assistant__foot {
		position: fixed;
		z-index: 5;
		right: 0;
		bottom: 0;
		left: 0;
		min-height: calc(72px + env(safe-area-inset-bottom));
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
	}
	.gb-assistant__foot p { display: none; }
	.gb-assistant__foot-actions { width: 100%; }
	.gb-assistant__foot-actions > * { flex: 1; min-width: 0; min-height: 48px; }
}

@media (max-width: 480px) {
	.gb-summary { grid-template-columns: 76px minmax(0,1fr); min-height: 104px; }
	.gb-summary__visual { width: 76px; height: 76px; }
	.gb-summary__price { display: none; }
	.gb-qc-series { grid-template-columns: 1fr; }
	.gb-qc-axes { grid-template-columns: 1fr 1fr 1fr; }
	.gb-qc-axes button { padding: 8px; text-align: center; }
	.gb-basis-line { align-items: flex-start; flex-direction: column; }
	.gb-contact-channel { display: grid; grid-template-columns: 1fr; }
	.gb-btn { font-size: 9px; }
}

@media (prefers-reduced-motion: reduce) {
	.gb-assistant[open] { animation: none; }
}


/* Produktive iOS-Eingabegröße gegen Safari-Autozoom. */
@media (max-width: 768px) {
	.gb-field input:not([type="checkbox"]):not([type="radio"]), .gb-field select, .gb-field textarea { font-size: 16px; }
}