/*!
 * enerGUIDE — Seite "Klimapfad für Kommunen"
 * Gestaltung der Kundenvorlage, alle Selektoren mit .kp / kp- Präfix eingegrenzt.
 * Konzeption, Design & Entwicklung: BTW MARKETING · © 2026
 */
.kp{--ci:#AAC812;--ci-t:#5F7300;--ci-s:#EEF4D2;--mg:#E6007E;--fg:#2B302C;--fg2:#5E655F;--line:#DDE1D8;--bg:#F6F8F3;--card:#fff}
.kp *{box-sizing:border-box}
.kp{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--fg);background:var(--bg);line-height:1.55}
.kp a{color:var(--ci-t)}
.kp .kp-wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.kp .logo{font-size:22px;color:#1E221F;text-decoration:none;letter-spacing:-.3px}
.kp .logo b{font-weight:700}
.kp .top .sp{flex:1}
.kp .top nav a{color:var(--fg2);text-decoration:none;font-size:14px;margin-left:18px}
.kp .kp-btn{display:inline-block;border-radius:8px;padding:11px 20px;font-weight:700;font-size:15px;text-decoration:none;border:2px solid transparent}
.kp .kp-btn.kp-p{background:var(--mg);color:#fff}
.kp .kp-btn.kp-p:hover{filter:brightness(.93)}
.kp .kp-btn.kp-s{border-color:var(--ci);color:#26300A;background:var(--ci-s)}
.kp .kp-btn.kp-s:hover{background:#E3EDB8}
.kp .kp-hero{background:#fff;padding:44px 0 40px}
.kp .kp-hero .kp-wrap{display:grid;grid-template-columns:1fr 1.25fr;gap:40px;align-items:center}
.kp .kp-eye{font-size:12px;letter-spacing:1.6px;color:var(--ci-t);font-weight:700;text-transform:uppercase}
.kp h1{font-size:34px;line-height:1.15;margin:10px 0 14px;color:#1E221F}
.kp h2{font-size:24px;line-height:1.2;margin:0 0 8px;color:#1E221F}
.kp h3{font-size:16px;margin:0 0 4px;color:#1E221F}
.kp .kp-lead{font-size:17px;color:#3F4540;margin:0 0 22px}
.kp .kp-btns{display:flex;gap:10px;flex-wrap:wrap}
.kp .kp-shot{display:block;width:100%;height:auto;border-radius:10px;border:1px solid var(--line);box-shadow:0 8px 30px rgba(40,48,40,.12)}
.kp .kp-frame{background:#EEF1EA;border-radius:12px;padding:8px;border:1px solid var(--line)}
.kp .kp-frame .kp-bar{display:flex;gap:5px;align-items:center;padding:0 2px 7px}
.kp .kp-frame .kp-bar i{width:8px;height:8px;border-radius:50%;background:#CDD2C8}
.kp .kp-frame .kp-bar span{flex:1;margin-left:10px;background:#fff;border-radius:6px;font-size:11px;color:#8A918A;padding:3px 10px}
.kp section{padding:46px 0}
.kp .kp-sub{color:var(--fg2);font-size:16px;margin:0 0 22px;max-width:720px}
.kp .kp-g3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.kp .kp-card{background:var(--card);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s}
.kp a.kp-card:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(40,48,40,.10)}
.kp .kp-card img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-bottom:1px solid var(--line)}
.kp .kp-card .kp-t{padding:14px 16px}
.kp .kp-card p{margin:0;color:var(--fg2);font-size:14.5px}
.kp .kp-band{background:var(--ci-s);border-radius:12px;padding:18px 22px;font-size:17px;color:#26300A;text-align:center}
.kp .kp-g4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kp .kp-who{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px;border-top:4px solid var(--ci)}
.kp .kp-who p{margin:0;color:var(--fg2);font-size:14.5px}
.kp .kp-split{display:grid;grid-template-columns:1.2fr 1fr;gap:36px;align-items:center}
.kp .kp-steps{counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.kp .kp-step{background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px}
.kp .kp-step:before{counter-increment:s;content:counter(s);display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--ci);color:#26300A;font-weight:700;margin-bottom:10px}
.kp .kp-step p{margin:0;color:var(--fg2);font-size:14.5px}
.kp details{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px 18px;margin-bottom:10px}
.kp summary{cursor:pointer;font-weight:700;font-size:16px;color:#1E221F}
.kp details p{margin:8px 0 0;color:var(--fg2);font-size:15px}
.kp .kp-cta{background:#353A36;color:#fff;border-radius:16px;padding:34px 36px;display:grid;grid-template-columns:1.3fr 1fr;gap:28px;align-items:center}
.kp .kp-cta h2{color:#fff}
.kp .kp-cta p{color:#D5DACF;margin:0 0 18px;font-size:16px}
.kp .kp-cta .kp-k{font-size:15px;line-height:1.75;color:#fff}
.kp .kp-cta .kp-k a{color:#C9DA7A}
.kp .kp-more{display:flex;flex-wrap:wrap;gap:10px}
.kp .kp-more a{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px;text-decoration:none;color:var(--fg);font-size:14.5px}
.kp .kp-more a:hover{border-color:var(--ci)}
.kp .kp-disc{font-size:12.5px;color:#8A918A;margin-top:16px}
@media (max-width:900px){
.kp .kp-hero .kp-wrap,
.kp .kp-split,
.kp .kp-cta{grid-template-columns:1fr}
.kp .kp-g3{grid-template-columns:1fr}
.kp .kp-g4,
.kp .kp-steps{grid-template-columns:1fr 1fr}
.kp h1{font-size:28px}
.kp .top nav{display:none}
}
@media (max-width:560px){
.kp .kp-g4,
.kp .kp-steps{grid-template-columns:1fr}
.kp .kp-cta{padding:24px 20px}
}

.kp .kp-claim{font-size:22px;line-height:1.3;font-weight:700;color:#1E221F;margin:0 0 12px}
.kp .kp-card img{height:auto}  /* width/height-Attribute nur für den Platzbedarf, Höhe kommt aus aspect-ratio */
.kp .kp-shot{height:auto}
.kp *,.kp *::before,.kp *::after{box-sizing:border-box}
.kp{overflow-x:clip}
