/* ==========================================================================
   EDM Landingpages (Academy / Service / Originals / Machines MG-R)
   Gemeinsames Stylesheet der page-lp-*.php-Templates.
   Farbwelten je Seite über .lp--academy / .lp--service / .lp--originals /
   .lp--machines (CSS-Variablen), Layout 1:1 nach Figma-Entwurf.
   ========================================================================== */

.lp {
	--lp-accent: #ff0000;
	--lp-accent-text: #cc0000;
	--lp-dark: #2e2e2e;
	--lp-light: #f2f2f2;
	--lp-soft: #eef2f5;
	--lp-ink: #1a1a1a;
	--lp-card-radius: 15px;
	--lp-max: 1200px;
	--lp-narrow: 900px;
	font-size: 16px;
	line-height: 1.6;
	color: var(--lp-ink);
	background: #fff;
	overflow-x: hidden;
}

.lp--academy {
	--lp-accent: #8c0af2;
	--lp-accent-text: #8c0af2;
	--lp-dark: #23033d;
	--lp-light: #e8cefc;
}

.lp--service {
	--lp-accent: #00c25d;
	--lp-accent-text: #007639;
	--lp-dark: #0d2b1a;
	--lp-light: #ccf7e1;
}

.lp--originals {
	--lp-accent: #f3ba00;
	--lp-accent-text: #9b7704;
	--lp-dark: #332c0d;
	--lp-light: #fff8ba;
}

.lp--machines {
	--lp-accent: #ff0000;
	--lp-accent-text: #cc0000;
	--lp-dark: #2e2e2e;
	--lp-light: #f2f2f2;
}

.lp * { box-sizing: border-box; }
.lp img { max-width: 100%; height: auto; display: block; }
.lp h1, .lp h2, .lp h3, .lp h4 { color: var(--lp-ink); }

.lp-container { max-width: var(--lp-max); margin: 0 auto; padding: 0 2rem; }
.lp-container--narrow { max-width: var(--lp-narrow); }

.lp-section { padding: 5rem 0; }
.lp-section--gray { background: #f5f5f5; }
.lp-section--tight { padding: 3rem 0; }

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

.lp-btn {
	display: inline-block;
	padding: 0.85rem 2rem;
	border-radius: 999px;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	text-align: center;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.lp-btn--primary { background: #ff0000; color: #fff !important; border: 2px solid #ff0000; }
.lp-btn--primary:hover { background: #cc0000; border-color: #cc0000; }

.lp-btn--ghost { background: #fff; color: var(--lp-ink) !important; border: 2px solid #d5d5d5; }
.lp-btn--ghost:hover { border-color: var(--lp-ink); }

.lp-btn--ghost-dark { background: transparent; color: #fff !important; border: 2px solid rgba(255, 255, 255, 0.7); }
.lp-btn--ghost-dark:hover { border-color: #fff; background: rgba(255, 255, 255, 0.12); }

.lp-btn--white { background: #fff; color: var(--lp-ink) !important; border: 2px solid #fff; }
.lp-btn--white:hover { background: #f0f0f0; }

.lp-btnrow { display: flex; flex-wrap: wrap; gap: 1rem; }
.lp-btnrow--center { justify-content: center; }

/* --------------------------------------------------------------------------
   Sektionskopf mit Balken-Divider + Badge
   -------------------------------------------------------------------------- */

.lp-sechead { text-align: center; max-width: 820px; margin: 0 auto 3rem; position: relative; }
.lp-sechead__eyebrow { font-size: 1rem; font-weight: 400; margin: 0 0 0.5rem; color: var(--lp-ink); }
.lp-sechead__headline { font-size: 2.6rem; font-weight: 700; line-height: 1.2; margin: 0; }
.lp-sechead__text { margin-top: 1.5rem; font-size: 1.05rem; }
.lp-sechead__text p { margin: 0 0 0.8rem; }
.lp-sechead__text p:last-child { margin-bottom: 0; }

.lp-divider { display: flex; justify-content: center; gap: 3px; margin-top: 1.2rem; }
.lp-divider i { height: 5px; }
.lp-divider i:nth-child(1) { width: 44px; background: #ff0000; }
.lp-divider i:nth-child(2) { width: 26px; background: #666; }
.lp-divider i:nth-child(3) { width: 26px; background: #b3b3b3; }

.lp-badge {
	position: absolute;
	top: -1.5rem;
	right: 0;
	width: 150px;
	height: 150px;
	border-radius: 50%;
	background: var(--lp-accent);
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	transform: rotate(8deg);
	padding: 1rem;
	z-index: 2;
}
.lp-badge__value { font-size: 2rem; font-weight: 700; line-height: 1; }
.lp-badge__label { font-size: 0.85rem; font-weight: 700; margin-top: 0.25rem; }
.lp-badge__note { font-size: 0.6rem; margin-top: 0.35rem; line-height: 1.3; }

/* --------------------------------------------------------------------------
   Hero mit Chevron-Unterkante
   -------------------------------------------------------------------------- */

.lp-hero {
	position: relative;
	color: #fff;
	padding: 8rem 0 14rem;
	/* Höhe wie im Entwurf: ~900px bei 1920px Breite, skaliert mit dem Viewport */
	min-height: clamp(560px, 46vw, 920px);
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
	background-position: center top;
	/* Chevron zeigt nach oben: weiße Fläche schiebt sich mittig in den Hero */
	clip-path: polygon(0 0, 100% 0, 100% 100%, 50% calc(100% - 110px), 0 100%);
}
.lp-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--lp-hero-overlay, linear-gradient(180deg, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.55)));
}
/* Die gelieferten Hero-Bilder enthalten die Farbverlaufs-Behandlung bereits —
   kein zusätzliches CSS-Overlay. Der Mechanismus bleibt für spätere Bilder
   ohne eingebaute Tönung erhalten (--lp-hero-overlay einfach wieder setzen). */
.lp--academy .lp-hero { --lp-hero-overlay: none; }
.lp--service .lp-hero { --lp-hero-overlay: none; }
.lp--originals .lp-hero { --lp-hero-overlay: none; }
.lp--machines .lp-hero {
	--lp-hero-overlay: none;
	/* Chevron und Höhe wie die übrigen Heroes; Bild an der Oberkante verankert */
	background-position: center top;
}

.lp-hero__inner { position: relative; z-index: 1; text-align: center; max-width: 860px; margin: 0 auto; padding: 0 2rem; }
.lp--machines .lp-hero__inner { text-align: left; margin: 0 auto; max-width: var(--lp-max); width: 100%; }
.lp--machines .lp-hero__eyebrow,
.lp--machines .lp-hero__headline,
.lp--machines .lp-hero__text { max-width: 560px; }
.lp-hero__eyebrow { font-size: 1.15rem; font-weight: 700; margin: 0 0 1rem; color: #fff; }
.lp-hero__headline { font-size: 3.2rem; font-weight: 700; line-height: 1.15; margin: 0 0 1.5rem; color: #fff !important; }
.lp-hero__text { font-size: 1.1rem; margin: 0 0 2rem; color: #fff; }
.lp-hero .lp-btnrow { justify-content: center; }
.lp--machines .lp-hero .lp-btnrow { justify-content: flex-start; }

/* --------------------------------------------------------------------------
   Intro / Sub-Brand-Sektion
   -------------------------------------------------------------------------- */

.lp-intro { text-align: center; }
.lp-intro__logo { margin: 0 auto 2rem; max-width: 300px; }
.lp-intro__logo img { margin: 0 auto; }
.lp-intro__text { max-width: 760px; margin: 0 auto; font-size: 1.05rem; }
.lp-intro__text p { margin: 0 0 1rem; }
.lp-intro__usps { display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem 2.5rem; margin-top: 2rem; padding: 0; list-style: none; }
.lp-intro__usps li { display: flex; align-items: center; gap: 0.6rem; font-weight: 700; }
.lp-intro__usps li::before { content: ""; width: 22px; height: 22px; flex-shrink: 0; background: var(--lp-check-icon) center / contain no-repeat; }

/* --------------------------------------------------------------------------
   Checklisten
   -------------------------------------------------------------------------- */

.lp-checklist { list-style: none; margin: 0; padding: 0; }
.lp-checklist li { position: relative; padding-left: 2rem; margin-bottom: 0.7rem; }
.lp-checklist li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.15rem;
	width: 20px;
	height: 20px;
	background: var(--lp-check-icon) center / contain no-repeat;
}

/* --------------------------------------------------------------------------
   Link-/Angebotslisten (Academy-Angebote, Originals-Shopbereiche)
   -------------------------------------------------------------------------- */

.lp-linklist { display: flex; flex-direction: column; gap: 1rem; max-width: var(--lp-narrow); margin: 0 auto; }
.lp-linklist__item {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	background: var(--lp-soft);
	border-radius: 12px;
	padding: 1rem 1.5rem;
	text-decoration: none;
	color: inherit;
	transition: background 0.2s ease;
}
.lp-linklist__item:hover { background: #e3eaef; }
.lp-linklist__thumb { width: 140px; flex-shrink: 0; border-radius: 8px; overflow: hidden; }
.lp-linklist__body { flex: 1; }
.lp-linklist__title { font-size: 1.1rem; font-weight: 700; margin: 0 0 0.25rem; color: var(--lp-accent-text); }
.lp-linklist__text { margin: 0; font-size: 0.98rem; }
.lp-linklist__arrow { font-size: 1.5rem; color: var(--lp-accent-text); flex-shrink: 0; transform: rotate(90deg); }
.lp-linklist__cta { flex-shrink: 0; }

/* --------------------------------------------------------------------------
   Vollbild-Medien / Video-Teaser
   -------------------------------------------------------------------------- */

.lp-media { position: relative; }
.lp-media--full img, .lp-media--full video { width: 100%; }
.lp-media__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border: 0;
	background: transparent;
	padding: 0;
	width: 100%;
}
.lp-media__play::before {
	content: "";
	width: 110px;
	height: 110px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.85) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5v14l11-7z' fill='%231a1a1a'/%3E%3C/svg%3E") center / 44px no-repeat;
	transition: transform 0.2s ease;
}
.lp-media__play:hover::before { transform: scale(1.06); }

/* --------------------------------------------------------------------------
   Akkordeons
   -------------------------------------------------------------------------- */

.lp-accordions { display: flex; flex-direction: column; gap: 1rem; max-width: var(--lp-narrow); margin: 0 auto; }
.lp-acc { background: #fff; border-radius: 12px; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.07); overflow: hidden; }
.lp-acc__head {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.35rem 1.75rem;
	background: transparent;
	border: 0;
	cursor: pointer;
	text-align: left;
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--lp-ink);
}
.lp-acc__head::after {
	content: "";
	width: 12px;
	height: 12px;
	flex-shrink: 0;
	border-right: 2px solid var(--lp-ink);
	border-bottom: 2px solid var(--lp-ink);
	transform: rotate(45deg);
	transition: transform 0.2s ease;
	margin-top: -4px;
}
.lp-acc.is-open .lp-acc__head::after { transform: rotate(225deg); margin-top: 6px; }
.lp-acc__body { display: none; padding: 0 1.75rem 1.5rem; }
.lp-acc.is-open .lp-acc__body { display: block; }
.lp-acc__body > *:first-child { margin-top: 0; border-top: 1px solid #e6e6e6; padding-top: 1.25rem; }
.lp-acc__body h4 { margin: 1.25rem 0 0.4rem; font-size: 1rem; }
.lp-acc__body p { margin: 0 0 0.8rem; }
.lp-acc__body ul { margin: 0; padding-left: 1.25rem; }
.lp-acc__body ul li { margin-bottom: 0.5rem; }
.lp-acc__q { font-weight: 700; color: var(--lp-accent-text); margin: 1.25rem 0 0.3rem; }
.lp-acc__q:first-of-type { margin-top: 0; }
.lp-acc__example { font-size: 0.95rem; }

/* --------------------------------------------------------------------------
   Karten-Layouts
   -------------------------------------------------------------------------- */

.lp-cards { display: grid; gap: 1.25rem; }
.lp-cards--1 { grid-template-columns: 1fr; }
.lp-cards--2 { grid-template-columns: repeat(2, 1fr); }
.lp-cards--3 { grid-template-columns: repeat(3, 1fr); }
.lp-cards--4 { grid-template-columns: repeat(4, 1fr); }

.lp-card { background: #fff; border-radius: var(--lp-card-radius); overflow: hidden; display: flex; flex-direction: column; }
.lp-card--soft { box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06); }
.lp-card--tinted { background: var(--lp-soft); box-shadow: none; }
.lp-card__header { padding: 0.9rem 1.4rem; font-size: 1.05rem; font-weight: 700; color: #fff; background: var(--lp-header-bg, var(--lp-dark)); }
.lp--service .lp-card__header { --lp-header-bg: #007639; }
.lp-card__img { width: 100%; }
.lp-card__body { padding: 1.4rem; flex: 1; display: flex; flex-direction: column; gap: 0.6rem; }
.lp-card__title { font-size: 1.05rem; font-weight: 700; margin: 0; display: flex; align-items: center; gap: 0.6rem; }
.lp-card__title--check::before { content: ""; width: 22px; height: 22px; flex-shrink: 0; background: var(--lp-check-icon) center / contain no-repeat; }
.lp-card__text { margin: 0; font-size: 0.98rem; }
.lp-card__note { background: var(--lp-soft); border-radius: 10px; padding: 0.9rem 1.1rem; font-size: 0.95rem; margin-top: auto; }

/* Vergleichskarten (Schulungsangebote) */
.lp-compare { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.lp-compare__col { border-radius: var(--lp-card-radius); overflow: hidden; background: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06); }
.lp-compare__header { padding: 1rem 1.4rem; color: #fff; font-weight: 700; font-size: 1.1rem; }
.lp-compare__col:nth-child(1) .lp-compare__header { background: #6d8991; }
.lp-compare__col:nth-child(2) .lp-compare__header { background: #4c6066; }
.lp-compare__col:nth-child(3) .lp-compare__header { background: #1e2628; }
.lp-compare__row { padding: 1.1rem 1.4rem; }
.lp-compare__row:nth-child(odd) { background: #f0f4f6; }
.lp-compare__label { font-weight: 700; margin: 0 0 0.2rem; }
.lp-compare__value { margin: 0; font-size: 0.98rem; }

/* --------------------------------------------------------------------------
   CTA-Banner (hell/dunkel) mit Graphic Element
   -------------------------------------------------------------------------- */

.lp-cta {
	display: flex;
	align-items: center;
	gap: 2rem;
	border-radius: var(--lp-card-radius);
	padding: 2.25rem 2.5rem;
	max-width: var(--lp-narrow);
	margin: 0 auto;
}
.lp-cta--light { background: var(--lp-light); color: var(--lp-ink); }
.lp-cta--dark { background: var(--lp-dark); color: #fff; }
.lp-cta--dark .lp-cta__headline, .lp-cta--dark .lp-cta__text { color: #fff !important; }
.lp-cta__graphic { width: 170px; flex-shrink: 0; }
.lp-cta__body { flex: 1; }
.lp-cta__headline { font-size: 1.5rem; font-weight: 700; margin: 0 0 0.5rem; }
.lp-cta__text { margin: 0 0 1.25rem; }
.lp-cta__body .lp-btnrow { margin: 0; }

.lp-cta-secondary { display: flex; align-items: center; justify-content: center; gap: 1.25rem; margin: 1.5rem auto 0; max-width: var(--lp-narrow); flex-wrap: wrap; }
.lp-cta-secondary p { margin: 0; }

/* CTA-Duo (zwei Banner-Karten nebeneinander) */
.lp-ctaduo { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.lp-ctaduo .lp-cta { max-width: none; padding: 2rem; height: 100%; }
.lp-ctaduo .lp-cta__graphic { width: 130px; }

/* --------------------------------------------------------------------------
   Tabs (Originals)
   -------------------------------------------------------------------------- */

.lp-tabs__nav { display: flex; justify-content: center; gap: 0.75rem; flex-wrap: wrap; margin-bottom: 2.5rem; }
.lp-tabs__tab {
	padding: 0.7rem 1.6rem;
	border-radius: 999px;
	border: 2px solid #d5d5d5;
	background: #fff;
	font-size: 1rem;
	font-weight: 700;
	cursor: pointer;
	color: var(--lp-ink);
	transition: border-color 0.2s ease, background 0.2s ease;
}
.lp-tabs__tab.is-active { border-color: var(--lp-accent); background: var(--lp-light); }
.lp-tabs__panel { display: none; }
.lp-tabs__panel.is-active { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: center; }
.lp-tabs__content h3 { font-size: 1.4rem; margin: 0 0 1rem; }
.lp-tabs__content p { margin: 0 0 1rem; }
.lp-tabs__content .lp-checklist { margin-bottom: 1.5rem; }
.lp-tabs__image { border-radius: var(--lp-card-radius); overflow: hidden; }

/* --------------------------------------------------------------------------
   Zitat (Service)
   -------------------------------------------------------------------------- */

.lp-quote { display: flex; align-items: center; gap: 2rem; max-width: var(--lp-narrow); margin: 0 auto; background: var(--lp-soft); border-radius: var(--lp-card-radius); overflow: hidden; }
.lp-quote__img { width: 260px; flex-shrink: 0; align-self: stretch; }
.lp-quote__img img { width: 100%; height: 100%; object-fit: cover; }
.lp-quote__body { padding: 2rem 2.5rem 2rem 0.5rem; }
.lp-quote__text { font-size: 1.3rem; font-weight: 700; line-height: 1.4; margin: 0 0 0.75rem; }
.lp-quote__text::before { content: "\201E"; }
.lp-quote__text::after { content: "\201C"; }
.lp-quote__author { margin: 0; font-size: 0.95rem; color: #4d4d4d; }

/* --------------------------------------------------------------------------
   Stat-Kacheln + Branchen-Chips
   -------------------------------------------------------------------------- */

.lp-stats { display: flex; justify-content: center; gap: 1.25rem; flex-wrap: wrap; }
.lp-stat { background: var(--lp-soft); border-radius: var(--lp-card-radius); padding: 1.75rem 2.5rem; text-align: center; min-width: 220px; max-width: 340px; }
.lp-stat__value { font-size: 1.9rem; font-weight: 700; line-height: 1.2; }
.lp-stat__label { font-size: 0.95rem; margin-top: 0.4rem; }
.lp-stats__note { text-align: center; font-size: 0.85rem; color: #666; margin-top: 1rem; }

.lp-chips { display: flex; justify-content: center; gap: 0.75rem; flex-wrap: wrap; margin-top: 1.25rem; }
.lp-chips__title { text-align: center; font-weight: 700; margin: 2.5rem 0 0; }
.lp-chip { display: flex; align-items: center; gap: 0.6rem; background: var(--lp-soft); border-radius: 999px; padding: 0.55rem 1.25rem; font-size: 0.95rem; font-weight: 500; }
.lp-chip img { width: 26px; height: 26px; }

/* --------------------------------------------------------------------------
   Kontakt-Karte
   -------------------------------------------------------------------------- */

.lp-contact { display: flex; gap: 0; max-width: var(--lp-narrow); margin: 0 auto; background: var(--lp-soft); border-radius: var(--lp-card-radius); overflow: hidden; }
.lp-contact__img { width: 300px; flex-shrink: 0; }
.lp-contact__img img { width: 100%; height: 100%; object-fit: cover; }
.lp-contact__body { padding: 2rem 2.5rem; }
.lp-contact__headline { font-size: 1.15rem; font-weight: 700; margin: 0 0 1rem; }
.lp-contact__rows { margin: 0 0 1.25rem; }
.lp-contact__rows p { margin: 0 0 0.35rem; }
.lp-contact__rows a { color: inherit; }

/* --------------------------------------------------------------------------
   Claim-/Abschluss-Banner
   -------------------------------------------------------------------------- */

.lp-claim { background: var(--lp-dark); color: #fff; padding: 4.5rem 0; }
.lp-claim__inner { display: flex; align-items: center; gap: 3rem; max-width: var(--lp-max); margin: 0 auto; padding: 0 2rem; }
.lp-claim__graphic { width: 260px; flex-shrink: 0; }
.lp-claim__eyebrow { font-size: 1.15rem; margin: 0 0 0.75rem; color: rgba(255, 255, 255, 0.6); font-weight: 700; letter-spacing: 0.08em; }
.lp-claim__headline { font-size: 2.4rem; font-weight: 700; line-height: 1.2; margin: 0 0 0.75rem; color: #fff !important; }
.lp-claim__subline { font-size: 1.05rem; margin: 0 0 1.5rem; color: #fff; }
.lp-claim .lp-btnrow { margin: 0; }
.lp--machines .lp-claim__graphic img { filter: grayscale(1) brightness(1.6); }

/* --------------------------------------------------------------------------
   MG-R: Produkt-Duo, Kachel-Grids, Datentabelle, Galerie, Cross-Selling
   -------------------------------------------------------------------------- */

.lp-products { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
.lp-product { border: 1px solid #e6e6e6; border-radius: var(--lp-card-radius); overflow: hidden; display: flex; flex-direction: column; background: #fff; }
.lp-product__img { background: #f5f5f5; }
.lp-product__body { padding: 1.5rem; display: flex; flex-direction: column; gap: 1rem; flex: 1; }
.lp-product__title { font-size: 1.3rem; font-weight: 700; margin: 0; }
.lp-product__note { background: var(--lp-soft); border-radius: 10px; padding: 1rem 1.2rem; font-size: 0.95rem; margin-top: auto; }

.lp-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.lp-tile { background: #fff; border-radius: var(--lp-card-radius); overflow: hidden; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06); display: flex; flex-direction: column; }
.lp-tile__img { aspect-ratio: 16 / 10; overflow: hidden; }
.lp-tile__img img { width: 100%; height: 100%; object-fit: cover; }
.lp-tile__body { padding: 1.25rem 1.4rem; }
.lp-tile__title { font-size: 1.02rem; font-weight: 700; margin: 0 0 0.4rem; display: flex; align-items: center; gap: 0.55rem; }
.lp-tile__title::before { content: ""; width: 20px; height: 20px; flex-shrink: 0; background: var(--lp-check-icon) center / contain no-repeat; }
.lp-tile__text { margin: 0; font-size: 0.95rem; }

.lp-spec { max-width: var(--lp-narrow); margin: 0 auto; overflow-x: auto; }
.lp-spec table { width: 100%; border-collapse: collapse; font-size: 0.95rem; min-width: 640px; }
.lp-spec th { background: #6f6f6f; color: #fff; padding: 0; text-align: center; vertical-align: bottom; }
.lp-spec th .lp-spec__model { padding: 1rem; font-size: 1.05rem; font-weight: 700; }
.lp-spec th img { margin: 0 auto; max-height: 130px; width: auto; padding-top: 1rem; }
.lp-spec th:first-child { background: transparent; }
.lp-spec td { padding: 0.7rem 1rem; border-bottom: 1px solid #e6e6e6; }
.lp-spec td:first-child { font-weight: 500; }
.lp-spec td:not(:first-child) { text-align: center; font-weight: 700; }
.lp-spec tbody tr:nth-child(odd) td { background: var(--lp-soft); }
.lp-spec__cta { text-align: center; margin-top: 2rem; }

.lp-gallery { position: relative; }
.lp-gallery__track { display: flex; gap: 1.25rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 0.5rem; }
.lp-gallery__track::-webkit-scrollbar { display: none; }
.lp-gallery__item { flex: 0 0 280px; scroll-snap-align: start; border-radius: 12px; overflow: hidden; background: #f5f5f5; }
.lp-gallery__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 0;
	background: #fff;
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	font-size: 1.3rem;
	line-height: 1;
	color: var(--lp-ink);
	z-index: 2;
}
.lp-gallery__nav--prev { left: -0.5rem; }
.lp-gallery__nav--next { right: -0.5rem; }

.lp-cross { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.lp-crosscard { border-radius: var(--lp-card-radius); padding: 2rem; color: #fff; display: flex; flex-direction: column; gap: 1rem; position: relative; overflow: hidden; }
.lp-crosscard--service { background: #0d2b1a; }
.lp-crosscard--originals { background: #332c0d; }
.lp-crosscard--academy { background: #23033d; }
.lp-crosscard__graphic { position: absolute; right: -30px; bottom: -30px; width: 170px; opacity: 0.5; }
.lp-crosscard__logo { max-width: 200px; position: relative; }
.lp-crosscard__logo img { filter: brightness(0) invert(1); }
.lp-crosscard__claim { font-size: 1.15rem; font-weight: 700; margin: 0; position: relative; color: #fff; }
.lp-crosscard__text { margin: 0; font-size: 0.95rem; position: relative; flex: 1; }
.lp-crosscard .lp-btnrow { position: relative; }

/* Kurs-Slider (Academy) */
.lp-slider__slide { display: none; }
.lp-slider__slide.is-active { display: block; }
.lp-slider__nav { display: flex; justify-content: center; gap: 0.5rem; margin-bottom: 2rem; }
.lp-slider__nav button { width: 40px; height: 40px; border-radius: 8px; border: 0; background: #2e2e2e; color: #fff; font-size: 1.1rem; cursor: pointer; }
.lp-slider__nav button:hover { background: #4d4d4d; }

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
	.lp-cards--4 { grid-template-columns: repeat(2, 1fr); }
	.lp-tiles { grid-template-columns: repeat(2, 1fr); }
	.lp-cross { grid-template-columns: 1fr; }
	.lp-hero__headline { font-size: 2.6rem; }
	.lp-badge { width: 120px; height: 120px; top: -1rem; }
	.lp-badge__value { font-size: 1.5rem; }
}

@media (max-width: 768px) {
	.lp-section { padding: 3.5rem 0; }
	.lp-cards--2, .lp-cards--3, .lp-cards--4 { grid-template-columns: 1fr; }
	.lp-compare { grid-template-columns: 1fr; }
	.lp-ctaduo { grid-template-columns: 1fr; }
	.lp-products { grid-template-columns: 1fr; }
	.lp-tiles { grid-template-columns: 1fr; }
	.lp-tabs__panel.is-active { grid-template-columns: 1fr; }
	.lp-sechead__headline { font-size: 2rem; }
	.lp-hero { padding: 5rem 0 9rem; min-height: 480px; clip-path: polygon(0 0, 100% 0, 100% 100%, 50% calc(100% - 55px), 0 100%); }
	.lp-hero__headline { font-size: 2.1rem; }
	.lp-cta { flex-direction: column; text-align: center; align-items: center; }
	.lp-cta .lp-btnrow { justify-content: center; }
	.lp-claim__inner { flex-direction: column; text-align: center; }
	.lp-claim__graphic { width: 180px; }
	.lp-claim .lp-btnrow { justify-content: center; }
	.lp-contact { flex-direction: column; }
	.lp-contact__img { width: 100%; }
	.lp-quote { flex-direction: column; }
	.lp-quote__img { width: 100%; }
	.lp-quote__body { padding: 0 2rem 2rem; }
	.lp-linklist__item { flex-wrap: wrap; }
	.lp-linklist__thumb { width: 100%; }
	.lp-badge { position: static; transform: none; margin: 0 auto 1.5rem; }
	.lp-media__play::before { width: 72px; height: 72px; background-size: 30px; }
}