/* ============================================================================
   LP-GERÄTE · Erweiterungs-Pattern für die Geräte-Landingpages
   (/geraete/ + Unterseiten). Setzt assets/css/lp.css voraus (Scope .lp,
   Inter, --lp-*-Tokens). Formsprache: Radien 29–32px, Schwarz/Anthrazit-
   Bänder, Rot #f80202, große Inter-Typo wie auf der abgenommenen ELEVAH-LP.
   ========================================================================== */

/* ── Hero-Variante mit tieferem Verlauf (Headline liegt auf hellen Bildzonen) ── */
.lp-hero--tief::after{height:76%;background:linear-gradient(180deg,rgba(3,3,3,0) 0%,rgba(3,3,3,.34) 45%,rgba(3,3,3,.72) 100%)}

/* Compare-Headlines dieser Seiten sind längere Wörter („Verbrenner“) als auf
   der ELEVAH-LP: kleinerer Floor + Notbruch, sonst weitet sich mobil der Viewport. */
.lp-geraete-compare-fix, /* Platzhalter-Klasse, Regel gilt über Dateiladung nur auf Geräteseiten */
/* Die Vergleichskarte stammt von /elevah/, wo die Schlagworte kurz sind
   (Leiter, Stapler, ELEVAH). Auf den Geräteseiten steht dort „VERBRENNER":
   462 px breit bei 67,5 px Schrift, die Karte bietet aber nur 416 px – mit
   overflow-wrap:anywhere brach das Wort mitten durch. Die Größe richtet sich
   deshalb zusätzlich nach der KARTENBREITE (cqw). min() lässt die schmale
   Karte kleiner werden und die breite ELEVAH-Karte unverändert. */
.lp .lp-compare__card{container-type:inline-size}
.lp .lp-compare__card h3{font-size:clamp(2rem,min(4.69vw,12.8cqw),5.625rem);overflow-wrap:anywhere}

/* ── Zahlenband (Fakten unter dem Hero) ── */
.lp-zahlen{background:var(--lp-flaeche-dunkel);padding:clamp(36px,3.2vw,62px) clamp(20px,3vw,40px)}
.lp-zahlen__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;max-width:1594px;margin:0 auto}
.lp-zahl{text-align:center}
.lp-zahl b{display:block;font-size:clamp(2rem,3.2vw,3.875rem);line-height:1.05;font-weight:900;color:var(--lp-light)}
.lp-zahl b i{font-style:normal;color:var(--lp-akzent)}
.lp-zahl span{display:block;margin-top:13px;font-size:clamp(.875rem,.94vw,1.125rem);line-height:1.3;color:var(--lp-silber)}
@media (max-width:767px){
  .lp-zahlen__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}
}

/* ── Erklär-Block („Was ist …?“, GEO-tauglich) ── */
.lp-erklaer{background:var(--lp-light);padding:clamp(56px,5.2vw,100px) clamp(20px,3vw,40px)}
.lp-erklaer__grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(28px,3vw,58px);align-items:center;max-width:1594px;margin:0 auto}
.lp-erklaer__eyebrow{font-size:clamp(1rem,1.04vw,1.25rem);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lp-akzent)}
.lp-erklaer h2{font-size:clamp(1.75rem,2.6vw,3.125rem);line-height:1.15;font-weight:700;color:var(--lp-anthrazit);margin-top:10px;text-wrap:balance}
.lp-erklaer__text{margin-top:clamp(16px,1.6vw,28px);font-size:clamp(1rem,1.04vw,1.25rem);line-height:1.6;color:var(--lp-anthrazit)}
.lp-erklaer__text p+p{margin-top:14px}
.lp-erklaer__text b{font-weight:900}
.lp-erklaer__bild{border-radius:32px;overflow:hidden}
.lp-erklaer__bild img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5}
/* --quer: für Marken ohne Hochformat-Material (Dulevo, Bulmor). Der 4/5-Kasten
   schnitt aus den 1,66–1,86-Quellen mehr als die halbe Breite (Stolperfalle 11);
   ein 4/3-Rahmen zeigt das Gerät vollständig und bleibt neben dem Text ruhig. */
.lp-erklaer__bild--quer img{aspect-ratio:4/3}
.lp-erklaer__bild--breit img{aspect-ratio:16/9}   /* Lineup-Motive (≈1,8) fast beschnittfrei */
@media (max-width:1023px){
  .lp-erklaer__grid{grid-template-columns:1fr}
  .lp-erklaer__bild img{aspect-ratio:3/2}
}

/* ── Vorteils-Karten (dunkles Band, nummeriert) ── */
.lp-vorteile{background:var(--lp-black);padding:clamp(56px,5.2vw,100px) clamp(20px,3vw,40px)}
.lp-vorteile__inner{max-width:1594px;margin:0 auto}
.lp-vorteile h2{font-size:clamp(1.75rem,2.34vw,2.8125rem);line-height:normal;font-weight:400;color:var(--lp-light);text-align:center;max-width:1060px;margin:0 auto;text-wrap:balance}
.lp-vorteile__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:clamp(36px,3.4vw,64px)}
.lp-vorteil{background:var(--lp-card);border-radius:29px;padding:clamp(24px,2vw,38px)}
.lp-vorteil b{display:block;font-size:clamp(1.75rem,2.2vw,2.625rem);font-weight:900;color:var(--lp-red)}
.lp-vorteil h3{font-size:clamp(1.125rem,1.25vw,1.5rem);line-height:1.3;font-weight:700;color:var(--lp-light);margin-top:10px}
.lp-vorteil p{font-size:clamp(.9375rem,.94vw,1.125rem);line-height:1.5;color:var(--lp-silber);margin-top:10px}
.lp-vorteile__grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1023px){.lp-vorteile__grid,.lp-vorteile__grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:639px){.lp-vorteile__grid,.lp-vorteile__grid--3{grid-template-columns:1fr}}

/* ── Bild-Band (emotionaler Vollbreiten-Break mit Zeile) ── */
.lp-band{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:flex-end;min-height:clamp(320px,36vw,640px);padding:clamp(28px,3vw,56px) clamp(20px,4.95vw,95px)}
.lp img.lp-band__bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover}
.lp-band::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.72) 100%)}
.lp-band h2{font-size:clamp(1.625rem,2.9vw,3.5rem);line-height:1.1;font-weight:900;color:var(--lp-light);max-width:1100px;text-shadow:0 3px 6px rgba(0,0,0,.3);text-wrap:balance}
.lp-band h2 i{font-style:normal;color:var(--lp-red)}
/* Modifier: helles Band – Text oben (Himmel), schwarz, ohne Abdunklung (Service R3) */
.lp-band--hell{align-items:flex-start}
.lp-band--hell::after{background:none}
.lp .lp-band--hell h2{color:var(--lp-black);text-shadow:none}
.lp .lp-band--hell h2 i{color:var(--lp-red-fill)}

/* ── Produkt-Karten (3er-Reihe, Portal-Links) ── */
.lp-produkte{background:#fff;padding:clamp(56px,5.2vw,100px) clamp(20px,3vw,40px)}
.lp-produkte__inner{max-width:1594px;margin:0 auto}
.lp-produkte h2{font-size:clamp(1.75rem,2.34vw,2.8125rem);line-height:normal;font-weight:400;color:var(--lp-grau);text-align:center;text-wrap:balance}
.lp-produkte__sub{font-size:clamp(1rem,1.04vw,1.25rem);line-height:1.5;color:var(--lp-anthrazit);text-align:center;max-width:820px;margin:12px auto 0}
.lp-produkte__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,1.6vw,30px);margin-top:clamp(36px,3.2vw,58px)}
.lp-produkt{display:flex;flex-direction:column;background:var(--lp-light);border-radius:29px;overflow:hidden}
.lp-produkt__bild{background:#fff;display:flex;align-items:center;justify-content:center;padding:clamp(18px,1.6vw,30px);min-height:clamp(200px,17vw,320px)}
.lp-produkt__bild img{max-width:100%;max-height:clamp(180px,16vw,300px);width:auto;height:auto;object-fit:contain}
.lp-produkt__inhalt{display:flex;flex-direction:column;flex:1;padding:clamp(20px,1.8vw,32px)}
.lp-produkt h3{font-size:clamp(1.25rem,1.35vw,1.625rem);font-weight:900;color:var(--lp-anthrazit)}
.lp-produkt__typ{font-size:clamp(.875rem,.83vw,1rem);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--lp-akzent);margin-top:2px}
.lp-produkt ul{list-style:none;margin:14px 0 0;padding:0}
.lp-produkt li{font-size:clamp(.9375rem,.94vw,1.125rem);line-height:1.55;color:var(--lp-anthrazit);padding-left:18px;position:relative}
.lp-produkt li::before{content:"";position:absolute;left:0;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--lp-red)}
.lp-produkt .lp-btn{margin-top:auto;align-self:flex-start;width:auto;padding-inline:26px;margin-top:20px}
.lp-produkte__hinweis{font-size:clamp(.875rem,.83vw,1rem);color:var(--lp-grau);text-align:center;margin-top:clamp(20px,2vw,34px)}
@media (max-width:1023px){.lp-produkte__grid{grid-template-columns:1fr;max-width:640px;margin-left:auto;margin-right:auto}}

/* ── Kategorie-Kacheln (Hub-Seite) ── */
.lp-kacheln{background:#fff;padding:clamp(56px,5.2vw,100px) clamp(16px,1.35vw,26px)}
.lp-kacheln__kopf{text-align:center;max-width:1060px;margin:0 auto;padding:0 20px}
.lp-kacheln__kopf h2{font-size:clamp(1.75rem,2.34vw,2.8125rem);line-height:normal;font-weight:400;color:var(--lp-grau);text-wrap:balance}
.lp-kacheln__kopf p{font-size:clamp(1rem,1.04vw,1.25rem);line-height:1.5;color:var(--lp-anthrazit);margin-top:12px}
.lp-kacheln__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px 14px;max-width:1868px;margin:clamp(36px,3.2vw,56px) auto 0}
.lp-kachel{position:relative;display:flex;flex-direction:column;border-radius:29px;overflow:hidden;background:var(--lp-card);text-decoration:none}
.lp-kachel__bild{aspect-ratio:4/3;overflow:hidden}
.lp-kachel__bild img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.lp-kachel:hover .lp-kachel__bild img{transform:scale(1.04)}}
/* Textfläche der Kachel war --lp-silber #aca8a8: weißer Text darauf nur
   2,35:1. Dunkle Kartenfläche bringt 14,3:1 und passt zur LP-Formsprache. */
.lp-kachel__text{background:var(--lp-card);padding:clamp(16px,1.5vw,28px) clamp(18px,1.8vw,32px) clamp(20px,1.8vw,32px);flex:1;display:flex;flex-direction:column}
.lp-kachel h3{font-size:clamp(1.375rem,1.67vw,2rem);line-height:normal;font-weight:700;color:#fff}
.lp-kachel p{font-size:clamp(.9375rem,1.04vw,1.25rem);line-height:1.45;color:#fff;margin-top:6px}
.lp-kachel__mehr{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:clamp(.9375rem,.94vw,1.125rem);font-weight:700;color:#fff}
.lp-kachel__mehr::after{content:"";width:10px;height:10px;border-right:3px solid var(--lp-red);border-top:3px solid var(--lp-red);transform:rotate(45deg);transition:transform .25s}
@media (hover:hover){.lp-kachel:hover .lp-kachel__mehr::after{transform:rotate(45deg) translate(3px,-3px)}}
@media (max-width:1023px){.lp-kacheln__grid{grid-template-columns:1fr}.lp-kachel__bild{aspect-ratio:16/9}}

/* ── Weiter-Zeile (interne Querverweise als Ghost-Buttons) ── */
.lp-weiter{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 18px;margin-top:clamp(28px,2.6vw,48px)}

/* Parallax-Überstand der Erklär- und Lösungsbilder (nur Desktop; die
   Amplitude leitet lp-motion.js aus diesem Überstand ab). */
@media (min-width: 1024px) {
  .js .lp .lp-erklaer__bild { position: relative; }
  .js .lp .lp-erklaer__bild img[data-parallax] { height: 112%; margin-top: -6%; }
  .js .lp .lp-loesung__bild img[data-parallax] { height: 112%; margin-top: -6%; }
}

/* ════════════════════════════════════════════════════════════════════════════
   PRODUKTKATALOG · Karten für Gebrauchtgeräte und Beispielprodukte
   (Portal-Daten; Gebraucht-Karten erzeugt tools/portal_gebraucht.py).
   Bilder sind Studio-/Freisteller-Fotos → object-fit:contain auf Weiß.
   ══════════════════════════════════════════════════════════════════════════ */
.lp-katalog{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,1.3vw,22px);margin-top:clamp(34px,3.2vw,58px)}
.lp-pkarte{display:flex;flex-direction:column;background:#fff;border-radius:22px;overflow:hidden;border:1px solid rgba(0,0,0,.07);transition:transform .3s var(--ease-out),box-shadow .3s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.lp-pkarte:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.12)}}
.lp-pkarte__bild{background:#fff;padding:clamp(10px,1vw,18px);border-bottom:1px solid rgba(0,0,0,.06)}
.lp-pkarte__bild img{width:100%;height:clamp(150px,13vw,205px);object-fit:contain}
/* --foto = echte Studioaufnahme (Gebrauchtgeräte, 4:3): randlos, ohne weißen
   Rahmen. Rahmenformat = Bildformat, deshalb schneidet cover nichts ab.
   Die Freisteller der Beispielprodukte bleiben bei contain + Polster. */
.lp-pkarte__bild--foto{padding:0}
.lp-pkarte__bild--foto img{display:block;height:auto;aspect-ratio:4/3;object-fit:cover}
.lp-pkarte__inhalt{display:flex;flex-direction:column;flex:1;padding:clamp(14px,1.3vw,22px)}
.lp-pkarte__typ{font-size:clamp(.6875rem,.73vw,.875rem);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lp-akzent)}
.lp-pkarte h3{margin-top:6px;font-size:clamp(1rem,1.1vw,1.3125rem);line-height:1.25;font-weight:900;color:var(--lp-anthrazit)}
.lp-pkarte__daten{margin:16px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
.lp-pkarte__daten div{min-width:0}
.lp-pkarte__daten dt{font-size:clamp(.6875rem,.7vw,.8125rem);letter-spacing:.04em;text-transform:uppercase;color:var(--lp-grau)}
.lp-pkarte__daten dd{margin:1px 0 0;font-size:clamp(.875rem,.9vw,1.0625rem);font-weight:700;color:var(--lp-anthrazit);overflow-wrap:anywhere}
.lp-pkarte__aktion{margin-top:auto;padding-top:clamp(12px,1.2vw,18px)}
.lp-pkarte__cta{width:100%}
.lp-pkarte__tel{display:block;margin-top:8px;font-size:clamp(.75rem,.78vw,.9375rem);color:var(--lp-grau);text-align:center}
.lp-katalog__fuss{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 22px;margin-top:clamp(26px,2.4vw,42px)}
.lp-katalog__hinweis{width:100%;text-align:center;font-size:clamp(.8125rem,.83vw,1rem);color:var(--lp-grau)}
@media (max-width:1200px){.lp-katalog{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.lp-katalog{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:540px){.lp-katalog{grid-template-columns:1fr}}

/* ── Marken-Blöcke (Geräte-Hub: Logo + Kategorie + Infos) ── */
.lp-marken{display:grid;gap:clamp(18px,1.8vw,30px);margin-top:clamp(32px,3vw,56px)}
.lp-marke{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);background:#fff;border-radius:29px;overflow:hidden;border:1px solid rgba(0,0,0,.07)}
.lp-marke__logo{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:clamp(24px,2.4vw,44px);border-right:1px solid rgba(0,0,0,.06);text-decoration:none;background:#fff;transition:background .25s}
.lp-marke__logo img{max-width:min(78%,300px);height:auto}
.lp-marke__logo span{font-size:clamp(.8125rem,.85vw,1rem);font-weight:700;color:var(--lp-akzent)}
@media (hover:hover){.lp-marke__logo:hover{background:var(--lp-light)}}
.lp-marke__inhalt{padding:clamp(22px,2.2vw,40px)}
.lp-marke__inhalt .lp-kopf__eyebrow{font-size:clamp(.8125rem,.85vw,1rem)}
.lp-marke__inhalt h3{margin-top:12px;font-size:clamp(1.375rem,1.8vw,2.125rem);line-height:1.15;font-weight:900;color:var(--lp-anthrazit)}
.lp-marke__inhalt h3 a{color:inherit;text-decoration:none}
.lp-marke__inhalt h3 a:hover{color:var(--lp-akzent)}
.lp-marke__text{margin-top:14px;font-size:clamp(.9375rem,1vw,1.1875rem);line-height:1.6;color:var(--lp-anthrazit)}
.lp-marke__chips{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.lp-marke__chips li{font-size:clamp(.75rem,.78vw,.9375rem);font-weight:700;color:var(--lp-anthrazit);background:var(--lp-light);border-radius:999px;padding:5px 13px}
.lp-marke__aktionen{display:flex;flex-wrap:wrap;gap:10px 14px;margin-top:clamp(16px,1.6vw,26px)}
.lp-marke__aktionen .lp-btn{width:auto;padding-inline:24px}
@media (max-width:900px){
  .lp-marke{grid-template-columns:1fr}
  .lp-marke__logo{border-right:0;border-bottom:1px solid rgba(0,0,0,.06);padding:22px}
  .lp-marke__logo img{max-width:min(60%,240px)}
}

/* ── Unterkategorie-Kacheln (Kategorie-Seiten; Klick → Modelle im Portal) ── */
.lp-ukat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.2vw,20px);margin-top:clamp(34px,3.2vw,58px)}
.lp-ukat a{display:flex;flex-direction:column;background:#fff;border-radius:18px;overflow:hidden;border:1px solid rgba(0,0,0,.07);text-decoration:none;transition:transform .28s var(--ease-out),box-shadow .28s var(--ease-out)}
@media (hover:hover) and (pointer:fine){.lp-ukat a:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.12)}}
.lp-ukat__bild{background:#fff;padding:12px}
.lp-ukat__bild img{width:100%;height:clamp(110px,9.5vw,150px);object-fit:contain}
.lp-ukat__text{padding:15px 16px 17px;border-top:1px solid rgba(0,0,0,.06);flex:1;display:flex;flex-direction:column}
.lp-ukat__text b{font-size:clamp(.9375rem,.95vw,1.125rem);line-height:1.3;font-weight:700;color:var(--lp-anthrazit)}
.lp-ukat__text span{margin-top:auto;padding-top:14px;font-size:clamp(.75rem,.78vw,.9375rem);font-weight:700;color:var(--lp-akzent)}
.lp-ukat__text span::after{content:" ↗"}
@media (max-width:1100px){.lp-ukat{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.lp-ukat{grid-template-columns:repeat(2,minmax(0,1fr))}}