/* ============================================================
   LEISTUNGSSEITE — gewählte Bausteine
   A2 (Seitenkopf: Text auf Papier, Bild als Kachel)
   B2 (Wechselzeilen mit ausführlichem Text)
   Lädt nach style-hell.css + miller-hell.css und nutzt deren
   Tokens und Bausteine. Enthält nur die Layouts dieser Seite.
   ============================================================ */

.lp-crumb{font-size:13px;color:var(--ink-soft);margin-bottom:18px}
.lp-crumb a{color:var(--blue-logo)}

.lp-eyebrow{font-family:"Urbanist",system-ui,sans-serif;font-size:12.5px;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--blue-logo);
  display:block;margin-bottom:16px}

.lp-lead{font-size:16.5px;line-height:1.75;color:var(--ink-soft);max-width:62ch}

/* ---- A2 · Seitenkopf als Bildband ---------------------------
   Volle Breite Foto, darüber ein weißes Panel. Kein Verlauf und
   kein Filter über dem Foto — die Lesbarkeit kommt vom Panel.  */
.lhb{background:var(--paper);padding-bottom:clamp(40px,6vw,72px)}
.lhb-band{height:clamp(300px,44vw,520px);overflow:hidden;background:var(--surface)}
.lhb-band img{width:100%;height:100%;object-fit:cover;object-position:center 60%;filter:none}
.lhb-band::after{content:none}

.lhb-panel{position:relative;background:var(--white);border-radius:var(--r);
  border:1px solid var(--line);box-shadow:0 24px 60px -32px rgba(2,82,166,.38);
  padding:clamp(28px,4vw,52px);margin-top:clamp(-130px,-9vw,-56px);max-width:920px}
.lhb h1{font-size:clamp(30px,4.2vw,52px);line-height:1.18}
.lhb .lp-lead{margin-top:20px}
.lhb-facts{display:flex;flex-wrap:wrap;gap:26px;margin-top:clamp(26px,3vw,34px);
  padding-top:clamp(22px,2.6vw,30px);border-top:1px solid var(--line)}
.lhb-facts div{min-width:110px}
.lhb-facts b{display:block;font-family:"Urbanist",system-ui,sans-serif;font-weight:600;
  font-size:clamp(24px,2.6vw,32px);line-height:1.1;color:var(--navy);
  font-variant-numeric:tabular-nums}
.lhb-facts span{display:block;font-size:13px;color:var(--ink-soft);margin-top:5px}

/* ---- B2 · Die vier Leistungen ------------------------------- */
.lb2{padding-block:clamp(48px,6vw,80px)}
.lb2>.container>h2{font-size:clamp(28px,3.4vw,44px);line-height:1.22;max-width:20ch}
.lb2-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,68px);align-items:center;
  padding-block:clamp(40px,5vw,60px);border-top:1px solid var(--line);scroll-margin-top:96px}
.lb2-row:first-of-type{border-top:0;padding-top:clamp(28px,3.5vw,40px)}
.lb2-row:nth-of-type(even) .lb2-img{order:2}
.lb2-img{border-radius:var(--r);overflow:hidden;aspect-ratio:5/4}
.lb2-img img{width:100%;height:100%;object-fit:cover;
  transition:transform 1.2s var(--ease)}
.lb2-row:hover .lb2-img img{transform:scale(1.03)}
.lb2-no{font-family:"Urbanist",system-ui,sans-serif;font-weight:600;font-size:14px;
  color:var(--blue-logo);font-variant-numeric:tabular-nums;display:block;margin-bottom:12px}
.lb2-body h2{font-size:clamp(23px,2.6vw,30px);line-height:1.24}
.lb2-body p{margin-top:16px;font-size:15.5px;line-height:1.75;color:var(--ink-soft)}
.lb2-list{margin-top:22px;display:grid;grid-template-columns:1fr 1fr;gap:10px 22px}
.lb2-list li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;line-height:1.55}
.lb2-list svg{width:16px;height:16px;flex:none;margin-top:3px;color:var(--blue-logo)}
.lb2-cta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:28px}
.lb2-cta .lb2-link{font-size:14px;font-weight:600;color:var(--blue-logo)}
.lb2-cta .lb2-link:hover{text-decoration:underline;text-underline-offset:3px}

/* ---- Abschlusszeile vor dem Kontaktblock --------------------- */
.lp-outro{background:var(--surface);border-top:1px solid var(--line);
  padding-block:clamp(40px,5vw,60px)}
.lp-outro .inner{display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.lp-outro h2{font-size:clamp(21px,2.4vw,28px);line-height:1.28;max-width:26ch}
.lp-outro p{margin-top:10px;font-size:15px;color:var(--ink-soft);max-width:52ch}

/* ---- Mobil -------------------------------------------------- */
@media(max-width:900px){
  .lhb-band{height:clamp(210px,52vw,300px)}
  .lhb-panel{margin-top:-44px;padding:24px 20px}
  .lhb h1{font-size:clamp(25px,7vw,31px)}
  .lhb .lp-lead{font-size:15px}
  .lhb-facts{gap:18px 26px}
  .lhb-facts b{font-size:22px}
  .lb2>.container>h2{font-size:clamp(23px,6.4vw,28px)}
  .lb2-row{grid-template-columns:1fr;gap:24px;padding-block:34px}
  .lb2-row:nth-of-type(even) .lb2-img{order:0}
  .lb2-img{aspect-ratio:16/10}
  .lb2-list{grid-template-columns:1fr}
  .lb2-body h2{font-size:19px}
  .lp-outro .inner{flex-direction:column;align-items:flex-start}
}