@charset "UTF-8";

/* Funnel-Layout der Leistungsseiten (FUF, Entwurf 10/2026)
   Wirkt nur auf Seiten mit <body class="lp">, alle anderen Seiten bleiben unberuehrt.
   Farben aus dem Bestand: Hellgruen #9dbd74, Dunkelgruen #405430, Schwarzgruen #2c3d1f,
   Akzent #ABCF8E, Angebots-Gruen #8aed00 (Farbe der Kachel "Jetzt Angebot anfordern"). */

html { scroll-behavior: smooth; }

body.lp #anfrage,
body.lp #telefon { scroll-margin-top: 96px; }

body.lp .lp-ico { width: 1.15em; height: 1.15em; flex: 0 0 auto; }

/* ---------- Buttons ---------- */

body.lp .lp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	box-sizing: border-box;
	min-height: 52px;
	padding: 0 26px;
	border: 0;
	border-radius: 6px;
	font-family: lato-bold, lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	line-height: 1.2;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

body.lp a.lp-btn-primary:link,
body.lp a.lp-btn-primary:visited,
body.lp button.lp-btn-primary {
	background-color: #8aed00;
	color: #1d2c11;
}

body.lp a.lp-btn-primary:hover,
body.lp a.lp-btn-primary:focus,
body.lp button.lp-btn-primary:hover,
body.lp button.lp-btn-primary:focus {
	background-color: #a6ff2e;
	color: #1d2c11;
}

body.lp a.lp-btn-ghost:link,
body.lp a.lp-btn-ghost:visited {
	background-color: transparent;
	color: #FFFFFF;
	box-shadow: inset 0 0 0 1px #ABCF8E;
}

body.lp a.lp-btn-ghost:hover,
body.lp a.lp-btn-ghost:focus {
	background-color: rgba(171,207,142,0.16);
	color: #FFFFFF;
}

body.lp .lp-btn:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 2px; }

/* ---------- Haken-Listen ---------- */

body.lp .lp-facts li {
	padding-left: 26px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.5l3.5 3.5 7.5-8' fill='none' stroke='%238aed00' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 0 0.2em;
	background-size: 16px 16px;
}

/* ---------- Hero (ersetzt die gruene Subline) ---------- */

body.lp .lp-hero {
	position: relative;
	z-index: 3;
	background-color: #405430;
	margin: 0 0 10px 0;
	padding: 26px 4% 30px 4.1%;
	color: #FFFFFF;
}

body.lp .lp-hero h1.seo-h {
	display: block;
	font-family: roboto-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 2.1em;
	line-height: 1.15;
	letter-spacing: 0.03em;
}

body.lp .lp-lead {
	max-width: 46em;
	margin: 16px 0 24px 0;
	font-family: lato-light, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.3em;
	line-height: 1.45;
	letter-spacing: 0.02em;
	color: #FFFFFF;
}

body.lp .lp-cta-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
}

/* ---------- Bild aus dem bisherigen Kopf, jetzt oben im Inhalt (Kopf = Raster in 3D) ---------- */

body.lp .lp-medien {
	position: relative;
	margin: 0 0 24px 0;
	border-radius: 10px;
	overflow: hidden;
	background-color: #1d2c11;
}

body.lp .lp-medien #slider-container,
body.lp .lp-medien .iframevideo {
	margin: 0;
	border-radius: 0;
}

body.lp .lp-medien #slider-container > img { display: block; width: 100%; height: auto; }

/* ---------- Inhalt + Angebotskarte ---------- */

body.lp .lp-main {
	position: relative;
	z-index: 3;
	margin: 3% 3% 0 3%;
}

body.lp .lp-content .textbox-zweidrittel,
body.lp .lp-content .textbox-info {
	margin: 0 0 24px 0;
	padding: 26px 30px;
	-webkit-column-count: 1;
	-moz-column-count: 1;
	column-count: 1;
}

body.lp .lp-content .kachel-container { margin: 0 0 8px 0; }

body.lp .lp-content .subline {
	margin: 0 0 16px 0;
	padding: 10px 20px;
	border-radius: 8px;
}

body.lp .lp-facts {
	margin: 0 0 24px 0;
	padding: 22px 30px;
	background-color: rgba(0,0,0,0.28);
	border-radius: 10px;
	color: #FFFFFF;
}

body.lp .lp-eyebrow {
	margin: 0 0 12px 0;
	font-family: roboto-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.85em;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #ABCF8E;
}

body.lp .lp-facts ul {
	display: grid;
	gap: 10px;
	list-style: none;
	margin: 0;
	padding: 0;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.08em;
	line-height: 1.4;
}

body.lp .lp-card { display: none; }

@media only screen and (min-width:1024px) {

	/* Zeilenlaenge wie im Lesetext aller Seiten: hoechstens ca. 38em */
	body.lp .lp-content .textbox-zweidrittel,
	body.lp .lp-content .textbox-info { padding-right: max(30px, calc(100% - 38em - 30px)); }

	body.lp .lp-main {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: 0 3%;
		align-items: start;
	}

	body.lp .lp-facts ul {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 18px;
	}

	body.lp .lp-card {
		display: block;
		position: -webkit-sticky;
		position: sticky;
		top: 104px;
		box-sizing: border-box;
		margin: 0 0 24px 0;
		padding: 26px 24px 22px 24px;
		background-color: #2c3d1f;
		border-radius: 10px;
		box-shadow: 0 10px 30px rgba(0,0,0,0.25);
		font-family: lato-light, Verdana, Arial, Helvetica, sans-serif;
		color: #FFFFFF;
	}
}

@media only screen and (min-width:1400px) {
	body.lp .lp-main { grid-template-columns: minmax(0, 1fr) 360px; }
}

body.lp .lp-card-title {
	margin: 0 0 8px 0;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.4em;
	line-height: 1.25;
}

body.lp .lp-card-text {
	margin: 0 0 18px 0;
	font-size: 1em;
	line-height: 1.45;
	color: #DDDDDD;
}

body.lp .lp-card .lp-btn { width: 100%; padding: 0 14px; }

body.lp .lp-card-phones {
	list-style: none;
	margin: 20px 0 0 0;
	padding: 14px 0 0 0;
	border-top: 1px solid rgba(171,207,142,0.25);
	font-size: 0.95em;
}

body.lp .lp-card-phones li {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	margin: 7px 0;
	color: #CCCCCC;
}

body.lp .lp-card-phones a { font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif; }

body.lp .lp-card-badge {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 18px 0 0 0;
	font-size: 0.85em;
	line-height: 1.3;
	color: #CCCCCC;
}

body.lp .lp-card-badge img { width: 28px; height: auto; }

/* ---------- Anfrage-Bereich ---------- */

body.lp .lp-anfrage {
	position: relative;
	z-index: 3;
	margin: 3% 3% 4% 3%;
	padding: 36px 3.5% 34px 3.5%;
	background-color: #2c3d1f;
	border-radius: 10px;
	box-shadow: 0 10px 30px rgba(0,0,0,0.25);
	font-family: lato-light, Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF;
}

body.lp .lp-h2 {
	margin: 0 0 10px 0;
	font-family: roboto-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.9em;
	font-weight: normal;
	line-height: 1.2;
	letter-spacing: 0.02em;
	color: #ABCF8E;
}

body.lp .lp-anfrage-intro {
	margin: 0 0 26px 0;
	font-size: 1.15em;
	line-height: 1.5;
}

body.lp .lp-steps {
	counter-reset: lpstep;
	list-style: none;
	margin: 0 0 26px 0;
	padding: 0;
	font-size: 1.02em;
	line-height: 1.45;
	color: #DDDDDD;
}

body.lp .lp-steps li {
	counter-increment: lpstep;
	position: relative;
	min-height: 40px;
	padding: 0 0 16px 56px;
}

body.lp .lp-steps li::before {
	content: counter(lpstep);
	position: absolute;
	left: 0;
	top: 0;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background-color: #405430;
	box-shadow: inset 0 0 0 1px #8aed00;
	font-family: lato-bold, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.05em;
	line-height: 38px;
	text-align: center;
	color: #8aed00;
}

body.lp .lp-steps strong {
	display: block;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 1.1em;
	color: #FFFFFF;
}

body.lp .lp-phones { padding: 18px 0 0 0; border-top: 1px solid rgba(171,207,142,0.25); }

body.lp a.lp-phone:link,
body.lp a.lp-phone:visited {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin: 0 0 8px 0;
	padding: 12px 16px;
	background-color: rgba(255,255,255,0.05);
	border-radius: 6px;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.05em;
	color: #FFFFFF;
}

body.lp a.lp-phone:hover { background-color: rgba(171,207,142,0.16); color: #FFFFFF; }

body.lp a.lp-phone span { font-family: lato-light, Verdana, Arial, Helvetica, sans-serif; color: #CCCCCC; }

/* Formular */

body.lp .lp-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 16px 18px;
	margin: 0;
}

body.lp .lp-form .lp-full { grid-column: 1 / -1; }

body.lp .lp-field label,
body.lp .lp-label,
body.lp .lp-objekt legend {
	display: block;
	margin: 0 0 6px 0;
	padding: 0;
	font-family: roboto-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.78em;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #ABCF8E;
}

body.lp .lp-optional { text-transform: none; letter-spacing: 0; color: #999999; }

body.lp .lp-field input[type="text"],
body.lp .lp-field input[type="email"],
body.lp .lp-field input[type="tel"],
body.lp .lp-field select,
body.lp .lp-field textarea {
	display: block;
	box-sizing: border-box;
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 11px 14px;
	background-color: #1d2c11;
	border: 1px solid #5d7a45;
	border-radius: 6px;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #FFFFFF;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

/* Eigener Auswahlpfeil mit Abstand zum Rand statt des Browser-Pfeils */
body.lp .lp-field select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	padding-right: 48px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 6l4.5 4.5L12.5 6' fill='none' stroke='%23ABCF8E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 18px center;
	background-size: 14px 14px;
	cursor: pointer;
}

body.lp .lp-field select::-ms-expand { display: none; }

body.lp .lp-field textarea { min-height: 110px; resize: vertical; line-height: 1.4; }

body.lp .lp-field input::placeholder,
body.lp .lp-field textarea::placeholder { color: #8a9a7c; }

/* Fokus ruhig: hellere Kante und Flaeche, kein Leuchtrahmen */
body.lp .lp-field input:focus,
body.lp .lp-field select:focus,
body.lp .lp-field textarea:focus {
	outline: none;
	border-color: #ABCF8E;
	background-color: #22341a;
}

body.lp .lp-objekt {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 14px 18px;
	margin: 0;
	padding: 16px 18px 18px 18px;
	border: 1px solid rgba(171,207,142,0.3);
	border-radius: 8px;
}

body.lp .lp-objekt legend { padding: 0 6px; margin: 0; }

body.lp .lp-objekt[hidden],
body.lp .lp-form[hidden],
body.lp .lp-fehler[hidden],
body.lp .lp-danke[hidden] { display: none; }

/* Unsichtbares Feld gegen Spam-Programme: Menschen sehen es nicht, Programme fuellen es aus */
body.lp .lp-hp {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Auswahl-Kacheln: an- und abwaehlbar, kein Kreis, kein Rahmen beim Anklicken */
body.lp .lp-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

body.lp .lp-field .lp-chips label.lp-chip {
	position: relative;
	display: inline-flex;
	margin: 0;
	padding: 0;
	font-size: 1em;
	letter-spacing: 0;
	text-transform: none;
	color: #FFFFFF;
	cursor: pointer;
}

body.lp .lp-chip input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

body.lp .lp-chip span {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 40px;
	box-sizing: border-box;
	padding: 0 14px;
	background-color: #1d2c11;
	border: 1px solid #5d7a45;
	border-radius: 6px;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.98em;
	color: #FFFFFF;
	-webkit-user-select: none;
	user-select: none;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

body.lp .lp-chip:hover span { border-color: #ABCF8E; }

body.lp .lp-chip input:checked + span {
	background-color: #ABCF8E;
	border-color: #ABCF8E;
	color: #1d2c11;
}

body.lp .lp-chip input:checked + span::before {
	content: "";
	width: 13px;
	height: 13px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.5l3.5 3.5 7.5-8' fill='none' stroke='%231d2c11' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center;
	background-size: contain;
}

/* Nur bei Tastaturbedienung sichtbar, nicht beim Klicken */
body.lp .lp-chip input:focus-visible + span { box-shadow: 0 0 0 2px #FFFFFF; }

body.lp .lp-form .lp-btn { width: 100%; min-height: 56px; font-size: 1.05em; }

body.lp .lp-note {
	margin: 12px 0 0 0;
	font-size: 0.88em;
	line-height: 1.45;
	color: #BBBBBB;
}

body.lp .lp-note a:link,
body.lp .lp-note a:visited { color: #ABCF8E; text-decoration: underline; }

body.lp .lp-form button[disabled] { opacity: 0.7; cursor: wait; }

body.lp .lp-fehler {
	margin: 14px 0 0 0;
	padding: 12px 16px;
	background-color: rgba(255,170,120,0.14);
	border-radius: 6px;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.45;
}

body.lp .lp-fehler a:link,
body.lp .lp-fehler a:visited { color: #ABCF8E; text-decoration: underline; }

body.lp .lp-danke {
	padding: 28px 26px;
	background-color: rgba(138,237,0,0.10);
	border-radius: 8px;
	font-size: 1.1em;
	line-height: 1.5;
	outline: none;
}

body.lp .lp-danke p { margin: 0; }

body.lp .lp-danke .lp-danke-titel {
	margin: 0 0 8px 0;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.35em;
	color: #8aed00;
}

/* YouTube-Video: Platzhalter, laedt erst nach Klick */
body.lp .lp-video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 14px;
	box-sizing: border-box;
	padding: 20px;
	background: radial-gradient(ellipse at center, #405430 0%, #1d2c11 75%);
	background-size: cover;
	background-position: center 30%;
	color: #FFFFFF;
	text-align: center;
}

body.lp .lp-video-hinweis {
	max-width: 34em;
	margin: 0;
	font-family: lato-light, Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.95em;
	line-height: 1.45;
	color: #DDDDDD;
}

body.lp .lp-video-hinweis a:link,
body.lp .lp-video-hinweis a:visited { color: #ABCF8E; text-decoration: underline; }

@media only screen and (min-width:1024px) {
	body.lp .lp-anfrage-grid {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
		gap: 0 5%;
		align-items: start;
	}
}

/* Kontakt-Kacheln: Telefonnummern sind jetzt anklickbar */
body.lp .adressbox a[href^="tel:"]:link,
body.lp .adressbox a[href^="tel:"]:visited { color: #FFFFFF; }

/* ---------- Handy: feste Leiste unten, kompakterer Hero ---------- */

body.lp .lp-bar { display: none; }

@media only screen and (max-width:1023px) {

	body.lp { padding-bottom: 76px; }

	body.lp .lp-hero { padding: 20px 5% 26px 5%; }
	body.lp .lp-hero h1.seo-h { font-size: 1.6em; }
	body.lp .lp-lead { font-size: 1.15em; margin: 12px 0 20px 0; }

	body.lp .lp-content .textbox-zweidrittel,
	body.lp .lp-content .textbox-info { padding: 22px 20px; }

	body.lp .lp-facts { padding: 20px 20px; }

	body.lp .lp-anfrage { padding: 28px 5% 26px 5%; }
	body.lp .lp-h2 { font-size: 1.55em; }

	body.lp .lp-bar {
		display: flex;
		gap: 10px;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 9000;
		padding: 10px 12px;
		padding-bottom: calc(10px + env(safe-area-inset-bottom));
		background-color: rgba(29,44,17,0.97);
		border-top: 1px solid rgba(171,207,142,0.35);
		-webkit-transform: translateY(110%);
		transform: translateY(110%);
		transition: transform 0.25s ease;
	}

	body.lp .lp-bar.is-visible { -webkit-transform: none; transform: none; }

	body.lp .lp-bar .lp-btn {
		flex: 1 1 0;
		min-height: 50px;
		padding: 0 10px;
		font-size: 0.92em;
		letter-spacing: 0.04em;
	}
}

@media only screen and (max-width:767px) {
	body.lp .lp-form,
	body.lp .lp-objekt { grid-template-columns: minmax(0, 1fr); }
	body.lp .lp-cta-row .lp-btn { flex: 1 1 100%; }

	/* Kacheln im Inhalt zweispaltig statt einzeln in voller Breite: kuerzerer Weg zur Anfrage */
	body.lp .lp-content .kachel {
		box-sizing: border-box;
		width: 48.5%;
		margin: 0 3% 3% 0;
		padding: 2.5%;
	}
	body.lp .lp-content .kachel:nth-child(2n) { margin-right: 0; }
}

@media only screen and (max-width:539px) {
	body.lp .lp-hero h1.seo-h { font-size: 1.35em; }
}

/* ---------- Abschnitte der Landingpage 213 (Kunde 08.10.: "Abschnitte wie parallelum") ----------
   Aufbau aus landing/abschnitte_213.py: Projektablauf, Projektbeispiele, Laserscanning und Preisbeispiele als
   Kaesten mit Kennzeile und Titel in der Inhaltsspalte, das Schlusswort unter dem Formular. Grund und Schrift
   wie der Lesetext (global-all.css, .textbox-info). */

body.lp .lp-ab {
	position: relative;
	margin: 0 0 24px 0;
	padding: 30px 30px 30px 30px;
	background-color: #2a3a1e;
	border-radius: 10px;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	line-height: 1.65;
	color: #E2E9DA;
	scroll-margin-top: 96px;
}

body.lp .lp-ab .lp-h2 { margin: 0 0 24px 0; }

body.lp .lp-ab p { margin: 0 0 14px 0; font-size: 1.0625em; }

body.lp .lp-h3 {
	margin: 0 0 10px 0;
	font-family: lato-bold, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.15em;
	font-weight: normal;
	line-height: 1.3;
	letter-spacing: 0.01em;
	color: #FFFFFF;
}

body.lp .lp-ab a:link,
body.lp .lp-ab a:visited { color: #C2E09A; }
body.lp .lp-ab a:hover { color: #8aed00; }

body.lp .lp-ab p.lp-ab-verweis { margin: 4px 0 0 0; }
body.lp .lp-ab-verweis a:link,
body.lp .lp-ab-verweis a:visited {
	font-family: lato-bold, Verdana, Arial, Helvetica, sans-serif;
	letter-spacing: 0.02em;
	text-decoration: none;
}

/* Text nur fuer Vorleser und Suchmaschinen (Bildunterschrift je Vorschaubild) */
body.lp .lp-vh {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* Haken-Listen in den Abschnitten (wie "Auf einen Blick") */
body.lp .lp-haken {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 1.0625em;
	line-height: 1.45;
}

body.lp .lp-haken li {
	padding-left: 26px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.5l3.5 3.5 7.5-8' fill='none' stroke='%238aed00' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 0 0.2em;
	background-size: 16px 16px;
}

/* Projektablauf: sechs Schritte auf einer Linie, im Stil des Zeitstrahls der Referenzen (Messpunkt je Schritt) */
body.lp .lp-ablauf {
	list-style: none;
	margin: 4px 0 34px 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

body.lp .lp-ablauf li { position: relative; }

body.lp .lp-ablauf-nr {
	display: block;
	margin: 0 0 10px 0;
	font-family: lato-bold, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.45em;
	line-height: 1.15;
	color: #8aed00;
}

body.lp .lp-ablauf-pkt {
	display: block;
	position: relative;
	height: 13px;
	margin: 0 0 14px 0;
}

body.lp .lp-ablauf-pkt::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 6px;
	height: 1px;
	background-color: rgba(171,207,142,0.7);
}

body.lp .lp-ablauf li:last-child .lp-ablauf-pkt::before { right: auto; width: 7px; }

body.lp .lp-ablauf-pkt::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 13px;
	height: 13px;
	box-sizing: border-box;
	border: 1.5px solid #8aed00;
	border-radius: 50%;
	background: radial-gradient(circle, #8aed00 0 1.5px, #243319 2px);
}

body.lp .lp-ablauf-text {
	display: block;
	padding: 0 16px 0 0;
	font-size: 1em;
	line-height: 1.45;
	color: #E2E9DA;
	text-wrap: balance;
}

body.lp .lp-aufgaben {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px 22px;
	font-size: 1em;
}

/* Projektbeispiele: je Projekt ein grosses Bild, darunter die Schritte als Vorschaubilder zum Durchklicken */
body.lp .lp-galerien {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 26px;
	margin: 0 0 20px 0;
}

body.lp .lp-galerie-bild {
	overflow: hidden;
	border-radius: 8px;
	background-color: #1d2c11;
}

body.lp .lp-galerie-bild img { display: block; width: 100%; height: auto; }

body.lp .lp-ab p.lp-galerie-text {
	margin: 10px 0 12px 0;
	font-size: 0.95em;
	letter-spacing: 0.02em;
	color: #ABCF8E;
}

body.lp .lp-galerie-reihe {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
}

body.lp .lp-galerie-reihe a {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 5px;
	opacity: 0.55;
	transition: opacity 0.15s ease;
}

body.lp .lp-galerie-reihe a:hover,
body.lp .lp-galerie-reihe a:focus-visible,
body.lp .lp-galerie-reihe a[aria-current] { opacity: 1; }

body.lp .lp-galerie-reihe a[aria-current]::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 5px;
	box-shadow: inset 0 0 0 2px #ABCF8E;
}

body.lp .lp-galerie-reihe img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: cover; }

/* Laserscanning */
body.lp .lp-ab-bild {
	overflow: hidden;
	margin: 0 0 26px 0;
	border-radius: 8px;
}

body.lp .lp-ab-bild img { display: block; width: 100%; height: auto; }

body.lp .lp-ab-spalten {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 36px;
	margin: 0 0 18px 0;
}

body.lp .lp-staerken {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px 22px;
	margin: 0 0 26px 0;
}

body.lp .lp-ab-felder {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin: 0 0 22px 0;
}

body.lp .lp-ab-feld {
	padding: 20px 22px 8px 22px;
	background-color: rgba(0,0,0,0.22);
	border-radius: 8px;
}

body.lp .lp-ab-feld p { font-size: 1em; margin-bottom: 12px; }

/* Preisbeispiele */
body.lp .lp-preise {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 0 0 18px 0;
}

body.lp .lp-preis {
	display: flex;
	flex-direction: column;
	padding: 22px 22px 22px 22px;
	background-color: rgba(0,0,0,0.22);
	border-radius: 8px;
}

body.lp .lp-preis .lp-h3 { margin: 0 0 2px 0; }

body.lp .lp-ab p.lp-preis-zusatz { margin: 0; font-size: 0.92em; color: #ABCF8E; }

body.lp .lp-ab p.lp-preis-betrag {
	margin: 12px 0 14px 0;
	font-family: lato-bold, Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.45em;
	line-height: 1.2;
	color: #8aed00;
}

body.lp .lp-preis-mwst {
	display: block;
	margin: 3px 0 0 0;
	font-family: lato-regular, Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.55em;
	letter-spacing: 0.02em;
	color: #C9D6BC;
}

body.lp .lp-preis .lp-haken { flex: 1 1 auto; margin: 0 0 20px 0; font-size: 0.95em; }
body.lp .lp-preis .lp-haken li + li { margin-top: 6px; }

body.lp .lp-ab a.lp-preis-knopf:link,
body.lp .lp-ab a.lp-preis-knopf:visited { min-height: 44px; padding: 0 14px; font-size: 0.85em; color: #FFFFFF; }

body.lp .lp-ab p.lp-preis-hinweis { margin: 0; font-size: 0.95em; color: #C9D6BC; }

/* Schlusswort unter dem Formular */
body.lp .lp-schluss { position: relative; z-index: 3; }
body.lp .lp-schluss .textbox-info { -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; }

@media only screen and (min-width:1024px) {
	body.lp .lp-ab p,
	body.lp .lp-haken { font-size: 1.125em; }
	body.lp .lp-ab .lp-aufgaben,
	body.lp .lp-ab .lp-ab-feld p { font-size: 1em; }
	body.lp .lp-ab .lp-preis .lp-haken { font-size: 0.95em; }
	body.lp .lp-schluss .textbox-info { padding: 26px max(30px, calc(100% - 38em - 30px)) 26px 30px; }
}

@media only screen and (min-width:1024px) and (max-width:1279px) {
	body.lp .lp-preise,
	body.lp .lp-aufgaben,
	body.lp .lp-staerken { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.lp .lp-galerien { grid-template-columns: minmax(0, 1fr); }
	body.lp .lp-galerie { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 18px; }
	body.lp .lp-galerie .lp-h3 { grid-column: 1 / -1; }
}

@media only screen and (max-width:1023px) {
	body.lp .lp-ab { padding: 24px 20px; }
	body.lp .lp-preise { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.lp .lp-aufgaben,
	body.lp .lp-staerken { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.lp .lp-ablauf { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 22px; }
	body.lp .lp-ablauf li:nth-child(3) .lp-ablauf-pkt::before { right: auto; width: 7px; }
}

@media only screen and (max-width:767px) {
	body.lp .lp-preise,
	body.lp .lp-aufgaben,
	body.lp .lp-staerken,
	body.lp .lp-galerien,
	body.lp .lp-ab-spalten,
	body.lp .lp-ab-felder { grid-template-columns: minmax(0, 1fr); }
	body.lp .lp-ab-spalten { gap: 10px; }
	/* Ablauf als Liste: Nummer links, Text rechts, ohne Linie */
	body.lp .lp-ablauf { grid-template-columns: minmax(0, 1fr); row-gap: 10px; }
	body.lp .lp-ablauf li { display: flex; align-items: baseline; gap: 14px; }
	body.lp .lp-ablauf-nr { flex: 0 0 22px; margin: 0; font-size: 1.25em; }
	body.lp .lp-ablauf-pkt { display: none; }
	body.lp .lp-ablauf-text { padding: 0; }
}
