/*
Theme Name: FIN Clean
Theme URI: https://immobilie-finanzieren.at/
Author: MAWOGE
Description: Schlankes, Divi-freies Theme fuer immobilie-finanzieren.at. Gibt das gemeinsame .kp-Design (design-system.css) ueber natives WordPress aus. Header via MegaMenu, Footer-Menues, kein Page-Builder. Abgeleitet von vkp-clean.
Version: 0.1.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: fin-clean
*/

/* ============ Reset / Basis ============ */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--ds-font-text,'Inter',system-ui,sans-serif);color:var(--ds-ink,#33474f);background:#fff;-webkit-font-smoothing:antialiased;line-height:1.65}
img{max-width:100%;height:auto;display:block}
a{color:var(--ds-brand-600,#0b8fab);text-decoration:none}
main{display:block}

/* ============ Header (dunkle Marken-Leiste, passend zum weissen Logo) ============ */
.site-header{position:sticky;top:0;z-index:9999;
  background:linear-gradient(180deg,#073442,#062a36);
  box-shadow:0 1px 0 rgba(255,255,255,.04),0 14px 34px -22px rgba(0,0,0,.6)}
.site-header .bar{max-width:1280px;margin:0 auto;padding:0 24px;min-height:104px;
  display:flex;align-items:center;gap:1rem}
.site-header .logo img{height:84px;width:auto}
@media(max-width:980px){.site-header .bar{min-height:80px}.site-header .logo img{height:60px}}
.bh-nav{margin-left:auto;display:flex;align-items:center;gap:.1rem}
.bh-item{position:relative}
.bh-item.has-mega{position:static}
.bh-item>a{display:flex;align-items:center;gap:.34rem;padding:.6rem .72rem;border-radius:10px;
  color:#dcebef;font-weight:600;font-size:14.5px;line-height:1;white-space:nowrap;cursor:pointer;transition:.15s}
.bh-item>a:hover,.bh-item:hover>a{background:rgba(255,255,255,.10);color:#fff}
.bh-item>a .car{width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translateY(-2px);opacity:.55;display:inline-block}
.bh-search{font-size:1.15rem;line-height:1}

/* ============ Header-Fuzzy-Suche ============ */
.fin-search{position:relative;margin-left:.45rem;flex:0 0 auto}
.fin-search-ic{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);width:16px;height:16px;
  pointer-events:none;opacity:.7;background-repeat:no-repeat;background-position:center;background-size:contain;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dcebef' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.5' y2='16.5'/%3E%3C/svg%3E")}
.fin-search-input{width:152px;padding:.52rem .8rem .52rem 2.1rem;border-radius:999px;
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.10);color:#fff;
  font-size:14px;line-height:1;outline:none;transition:width .18s,background .18s,border-color .18s;-webkit-appearance:none}
.fin-search-input::placeholder{color:#a9c4cd}
.fin-search-input::-webkit-search-cancel-button{-webkit-appearance:none}
.fin-search-input:focus{width:208px;background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.4)}
.fin-search-res{position:absolute;top:calc(100% + 6px);right:0;min-width:260px;max-width:340px;background:#fff;
  border:1px solid var(--ds-line,#e4ebee);border-radius:14px;box-shadow:0 26px 60px -22px rgba(10,61,77,.45);
  padding:8px;display:none;z-index:70;max-height:60vh;overflow-y:auto}
.fin-search.open .fin-search-res{display:block}
.fin-search-res a{display:block;padding:.55rem .8rem;border-radius:9px;font-weight:500;font-size:14px;
  color:var(--ds-ink,#33474f);white-space:normal;line-height:1.35}
.fin-search-res a:hover,.fin-search-res a.on{background:var(--ds-brand-50,#ecfafd);color:var(--ds-brand-600,#0b8fab)}
@media(max-width:980px){
  .fin-search{margin:.6rem 0 0;width:100%}
  .fin-search-input,.fin-search-input:focus{width:100%}
  .fin-search-res{position:static;min-width:0;max-width:none;margin-top:.4rem;box-shadow:none;max-height:none}
}

/* Dropdown */
.bh-drop{position:absolute;top:calc(100% + 2px);left:0;min-width:240px;background:#fff;
  border:1px solid var(--ds-line,#e4ebee);border-radius:14px;box-shadow:0 26px 60px -22px rgba(10,61,77,.45);
  padding:8px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.18s;z-index:60}
.bh-item:hover .bh-drop{opacity:1;visibility:visible;transform:translateY(0)}
.bh-drop a{display:block;padding:.58rem .8rem;border-radius:9px;font-weight:500;font-size:14.5px;
  color:var(--ds-ink,#33474f);white-space:nowrap}
.bh-drop a:hover{background:var(--ds-brand-50,#ecfafd);color:var(--ds-brand-600,#0b8fab)}

/* Mega */
.bh-mega{position:absolute;top:100%;left:0;right:0;background:#fff;border-top:1px solid #eef4f6;
  box-shadow:0 30px 60px -26px rgba(10,61,77,.45);opacity:0;visibility:hidden;transform:translateY(8px);
  transition:.2s;z-index:60}
.bh-item.has-mega:hover .bh-mega{opacity:1;visibility:visible;transform:translateY(0)}
.bh-mega .mwrap{max-width:1280px;margin:0 auto;padding:26px 24px 30px;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1.3rem 1.6rem;align-items:start}
.bh-col .bh-dh{font-family:var(--ds-font-text,'Inter',sans-serif);font-weight:700;font-size:12px;
  letter-spacing:.07em;text-transform:uppercase;color:var(--ds-brand-600,#0b8fab);margin-bottom:.5rem}
.bh-col .bh-dh a{color:inherit;padding:0;margin:0;font:inherit;font-size:inherit;font-weight:inherit;
  letter-spacing:inherit;text-transform:inherit;display:inline;text-decoration:none}
.bh-col a{display:block;padding:.5rem .6rem;border-radius:9px;font-weight:500;font-size:14px;color:var(--ds-ink,#33474f)}
.bh-col a:hover{background:var(--ds-brand-50,#ecfafd);color:var(--ds-brand-600,#0b8fab)}

.cta{flex:0 0 auto;background:var(--ds-accent,#16c79a);color:#04241c;font-weight:700;
  padding:.74rem 1.35rem;border-radius:999px;font-size:14.5px;line-height:1;margin-left:.5rem;
  box-shadow:0 9px 22px -8px rgba(22,199,154,.6);transition:.18s;white-space:nowrap}
.cta:hover{background:var(--ds-accent-dark,#0fa982);transform:translateY(-2px)}
.menu-toggle{display:none;margin-left:auto;background:none;border:0;font-size:1.6rem;cursor:pointer;color:#fff}

@media(max-width:980px){
  .menu-toggle{display:block}
  .bh-nav{display:none;position:absolute;top:100%;left:0;right:0;background:#062a36;flex-direction:column;
    align-items:stretch;gap:0;padding:.5rem 16px 1rem;box-shadow:0 20px 40px -20px rgba(0,0,0,.5);
    max-height:82vh;overflow-y:auto}
  .bh-nav.open{display:flex}
  .bh-item{position:static}
  .bh-item>a{justify-content:space-between;font-size:1rem;padding:.7rem .4rem}
  /* Dropdowns/Mega auf Mobile statisch ausgeklappt */
  .bh-drop,.bh-mega{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    border:0;border-top:0;padding:0 0 .4rem 1rem;min-width:0;background:transparent}
  .bh-mega .mwrap{display:block;padding:0}
  .bh-col{margin:.4rem 0}
  .cta{margin:.7rem 0 0;text-align:center}
}

/* ============ Footer ============ */
.site-footer{background:var(--ds-brand-900,#062a36);color:#9fc0ca;padding:4.5rem 0 1.5rem;
  font-family:var(--ds-font-text,'Inter',sans-serif);font-size:.93rem}
.site-footer .inner{max-width:1180px;margin:0 auto;padding:0 24px}
.site-footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2rem;
  padding-bottom:2rem;border-bottom:1px solid rgba(255,255,255,.1)}
.site-footer h4{color:#fff;font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;margin:0 0 1rem}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer a{color:#9fc0ca;display:block;padding:.28rem 0}
.site-footer a:hover{color:#fff}
.site-footer .brand img{height:88px;width:auto;margin-bottom:1.1rem}
.site-footer .brand p{max-width:300px}
.site-footer .bottom{display:flex;justify-content:space-between;align-items:flex-start;padding-top:1.4rem;flex-wrap:wrap;gap:1rem 1.6rem;color:#7e9ca6}
.site-footer .bottom .hint{font-size:.76rem;line-height:1.5;max-width:300px;opacity:.85}
.site-footer .bottom .hint strong{color:#bcd9e1;display:block;margin-bottom:.15rem}
@media(max-width:780px){.site-footer .cols{grid-template-columns:1fr 1fr}}

/* ============ Helfer: 4er-Kartenreihe (Home-Services) ============ */
.kp-feats.cols4{grid-template-columns:repeat(4,1fr)}
@media(max-width:1024px){.kp-feats.cols4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.kp-feats.cols4{grid-template-columns:1fr}}

/* Genau 4 Elemente in 3-spaltigen Rastern -> 2x2 statt 3+1 (kein einsames Element).
   cols4 (z.B. Home-Services) ist bewusst 4-in-Reihe und ausgenommen. */
.kp-tcards:has(> :last-child:nth-child(4)),
.kp-feats:not(.cols4):has(> :last-child:nth-child(4)),
.kp-grid:has(> :last-child:nth-child(4)){grid-template-columns:repeat(2,1fr)}

/* ============ Bewertungen (Site Reviews) ============ */
.vkp-rating-top{padding-top:1.3rem;padding-bottom:0}
.vkp-rating-top .kp-inner{display:flex;justify-content:center;text-align:center}
.vkp-rating-top .glsr{--glsr-star-empty-color:#d9e2e6;--glsr-star-full-color:#e9b949;font-family:var(--ds-font-text,'Inter',sans-serif)}
.vkp-rating-form{padding-top:2.6rem}
.vkp-rating-form .glsr{--glsr-star-empty-color:#d9e2e6;--glsr-star-full-color:#e9b949}
.vkp-rating-form .glsr-button,.vkp-rating-form button[type=submit]{background:var(--ds-accent,#16c79a)!important;
  color:#04241c!important;border:0!important;border-radius:999px!important;font-weight:700!important;padding:.8em 1.7em!important;cursor:pointer}
.vkp-rating-form input,.vkp-rating-form textarea,.vkp-rating-form select{border:1px solid var(--ds-line,#e4ebee)!important;border-radius:10px!important}

/* ============ Newsfeed / Ratgeber-Uebersicht ============ */
.newsfeed-cats{margin-bottom:2.6rem}
.newsfeed-cats a.active{background:var(--ds-brand-500,#0bb9d9);color:#fff;border-color:var(--ds-brand-500,#0bb9d9)}
.newsfeed-cats a.active b{color:#fff}
.nf-cat{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ds-brand-600,#0b8fab);background:var(--ds-brand-50,#ecfafd);padding:.25rem .65rem;
  border-radius:999px;margin-bottom:.6rem}
.newsfeed-grid .kp-feat .b{display:flex;flex-direction:column;align-items:flex-start}
/* Pagination */
.pagination{margin-top:2.6rem;display:flex;justify-content:center}
.pagination .nav-links{display:flex;gap:.5rem;flex-wrap:wrap}
.pagination .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;
  padding:0 .6rem;border:1px solid var(--ds-line,#e4ebee);border-radius:10px;font-weight:600;
  color:var(--ds-brand-700,#0e5468);text-decoration:none;transition:.15s}
.pagination .page-numbers:hover{border-color:var(--ds-brand-400,#3fcce6);background:var(--ds-brand-50,#ecfafd)}
.pagination .page-numbers.current{background:var(--ds-brand-500,#0bb9d9);color:#fff;border-color:var(--ds-brand-500,#0bb9d9)}

/* ============ Artikel-Bild (Banner im Fliesstext) ============ */
.kp-figure{display:block;width:100%;max-height:440px;object-fit:cover;border-radius:18px;
  box-shadow:0 24px 60px -28px rgba(10,61,77,.45);margin:1.6rem 0 .6rem}

/* Bild in einer kp-split2-Spalte (Querformat, natuerlich – NICHT als Hochkant-Portrait) */
.kp-splitimg{align-self:start}
.kp-splitimg img{display:block;width:100%;height:auto;border-radius:16px;
  box-shadow:0 18px 44px -24px rgba(10,61,77,.4)}

/* Defensiv: einfacher kp-hero, falls Innen-Container/Lead vom Standard abweichen (Lesbarkeit) */
.kp-hero .kp-inner{position:relative;z-index:2;max-width:880px;margin:0 auto;text-align:center;color:#fff}
.kp-hero .kp-inner h1{color:#fff!important}
.kp-hero .kp-inner .kp-lead,.kp-hero .kp-sub{color:#dcedf2}

/* Defensiv: vereinzelte Helfer-Klassen aus dem Content sinnvoll abfangen */
.kp-formcard{background:#fff;border:1px solid var(--ds-line,#e4ebee);border-radius:16px;
  padding:1.6rem 1.8rem;box-shadow:0 14px 40px -24px rgba(10,61,77,.3)}
/* Tabellen im Content einheitlich gestalten */
.kp-wrap table{width:100%;border-collapse:collapse;margin:1.4rem 0;font-size:.97rem;
  border:1px solid var(--ds-line,#e4ebee);border-radius:12px;overflow:hidden}
.kp-wrap thead th{background:var(--ds-brand-50,#ecfafd);color:var(--ds-brand-900,#062a36);
  text-align:left;padding:.7rem .9rem;font-weight:700}
.kp-wrap td,.kp-wrap th{padding:.7rem .9rem;border-top:1px solid var(--ds-line,#e4ebee);vertical-align:top}
.kp-wrap tbody tr:hover td{background:var(--ds-surface-2,#f5f9fb)}

/* ============ Verwandte Beitraege (Artikel-Footer) ============ */
a.kp-feat{text-decoration:none;color:inherit;transition:transform .2s ease,box-shadow .2s ease}
a.kp-feat:hover{transform:translateY(-4px);box-shadow:0 22px 48px -24px rgba(10,61,77,.45)}
a.kp-feat .b h4{color:var(--ds-brand-900,#062a36)}
.article-back{display:inline-block;font-weight:700;color:var(--ds-brand-600,#0b8fab);
  border-bottom:2px solid var(--ds-brand-400,#3fcce6);padding-bottom:2px;transition:.15s}
.article-back:hover{color:var(--ds-brand-500,#0bb9d9);border-color:var(--ds-brand-500,#0bb9d9)}

/* ============ Autoren-Box ============ */
.author-box{display:flex;gap:1.6rem;align-items:center;background:#fff;border:1px solid var(--ds-line,#e4ebee);
  border-radius:18px;padding:1.6rem 1.8rem;box-shadow:0 14px 40px -24px rgba(10,61,77,.3)}
.author-photo{flex:0 0 auto}
.author-photo img{width:104px;height:104px;border-radius:50%;object-fit:cover;object-position:center top;
  border:3px solid var(--ds-brand-50,#ecfafd)}
.author-kicker{font-family:var(--ds-font-text,'Inter',sans-serif);font-weight:700;font-size:.72rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--ds-brand-600,#0b8fab)}
.author-main h3{font-family:var(--ds-font-display,'Sen',sans-serif);font-weight:800;font-size:1.3rem;
  margin:.15rem 0 .5rem;color:var(--ds-brand-900,#062a36)}
.author-bio{color:var(--ds-ink-soft,#5d717a);font-size:.97rem;line-height:1.6;margin:0 0 .7rem}
.author-more{margin-top:1.6rem}
.author-more h4{font-family:var(--ds-font-display,'Sen',sans-serif);font-weight:800;font-size:1.05rem;
  color:var(--ds-brand-900,#062a36);margin:0 0 1rem}
.author-more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.author-more-item{display:flex;gap:.8rem;align-items:center;background:#fff;border:1px solid var(--ds-line,#e4ebee);
  border-radius:12px;padding:.7rem .8rem;text-decoration:none;transition:.18s}
.author-more-item:hover{border-color:var(--ds-brand-400,#3fcce6);transform:translateY(-2px);
  box-shadow:0 14px 30px -20px rgba(10,61,77,.4)}
.author-more-item img{width:52px;height:52px;border-radius:8px;object-fit:cover;flex:0 0 auto}
.author-more-item span{font-weight:600;font-size:.9rem;line-height:1.3;color:var(--ds-brand-900,#062a36)}
@media(max-width:760px){.author-box{flex-direction:column;text-align:center}
  .author-more-grid{grid-template-columns:1fr}.author-more-item{text-align:left}}

/* =========================================================
   ROBUSTHEIT (2026-06-03): Raster mit auto-fit statt fixer Spalten
   + 860px-Cliff entfernt (Layout haelt auch bei ~800-900px / Browser-Zoom).
   Laedt zuletzt -> ueberschreibt design-system.css inkl. dessen Umbruchpunkte.
   ========================================================= */
/* Grid mit :has() = exakte, VOLLE Spalten (fuellt immer die Breite, kein Links-Pack/Leerraum):
   3->3, 4->2x2, 2->2, 1->zentriert. 5/7 (kein sauberer Teiler) -> zentrierter Flex (letzte Reihe mittig). */
.kp-tcards,.kp-feats,.kp-steps{display:grid;gap:1.4rem;grid-template-columns:repeat(3,1fr);align-items:stretch}
.kp-steps{gap:1.5rem}
.kp-tcards:has(> :nth-child(1):last-child),.kp-feats:has(> :nth-child(1):last-child),.kp-steps:has(> :nth-child(1):last-child){grid-template-columns:minmax(0,540px);justify-content:center}
.kp-tcards:has(> :nth-child(2):last-child),.kp-feats:has(> :nth-child(2):last-child),.kp-steps:has(> :nth-child(2):last-child),
.kp-tcards:has(> :nth-child(4):last-child),.kp-feats:has(> :nth-child(4):last-child),.kp-steps:has(> :nth-child(4):last-child){grid-template-columns:repeat(2,1fr)}
.kp-tcards:has(> :nth-child(5):last-child),.kp-feats:has(> :nth-child(5):last-child),
.kp-tcards:has(> :nth-child(7):last-child),.kp-feats:has(> :nth-child(7):last-child){display:flex;flex-wrap:wrap;justify-content:center}
.kp-tcards:has(> :nth-child(5):last-child) > *,.kp-feats:has(> :nth-child(5):last-child) > *,
.kp-tcards:has(> :nth-child(7):last-child) > *,.kp-feats:has(> :nth-child(7):last-child) > *{flex:1 1 280px;max-width:346px;margin:0}
.kp-points{display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:1.3rem}
.kp-points > *{flex:1 1 300px;max-width:480px;margin:0}
.kp-points:has(> :nth-child(1):last-child) > *{flex-basis:100%}
/* genau 4 kp-points -> 2x2 (statt 3+1 mit einsamer Karte). Behebt mehrere „Jetzt passenden Kredit finden"-/Vorteile-Raster. */
.kp-points:has(> :nth-child(4):last-child) > *{flex:1 1 calc(50% - 0.7rem);max-width:none}
.kp-usps{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}
.kp-usps > *{flex:1 1 160px;max-width:250px;margin:0}
.kp-cols2{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;align-items:stretch}
/* Feature-Karten-Bilder groesser; Diagramm-Variante .kp-feat.diagram zeigt die Grafik VOLLSTAENDIG (contain, kein Crop) */
.kp-feat>img{height:210px}
.kp-feat.diagram>img{height:auto;max-height:320px;object-fit:contain;background:#eef4f6;padding:.9rem}
/* Text-Bild-Split: 2 Spalten 50/50; Bild fuellt die Breite und zeigt sich VOLLSTAENDIG
   (natuerliche Hoehe, KEIN object-fit:cover-Crop -> Grafiken/Diagramme werden nicht abgeschnitten). */
.kp-imgsplit{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,4vw,3rem);align-items:center}
.kp-imgsplit .kp-prose{min-width:0;align-self:center;max-width:none;margin:0}
.kp-imgsplit .kp-media{border-radius:16px;overflow:hidden}
.kp-imgsplit .kp-media img{width:100%;height:auto;max-height:480px;display:block;object-fit:contain;aspect-ratio:auto;min-height:0}
.kp-imgsplit.rev .kp-media{order:-1}
/* Tablet: 3-spaltige Raster erst spaet auf 2 Spalten (haelt bei ~820px noch 3-spaltig) */
@media(max-width:780px){
  .kp-tcards,.kp-feats,.kp-steps{grid-template-columns:repeat(2,1fr)}
  .kp-tcards:has(> :nth-child(1):last-child),.kp-feats:has(> :nth-child(1):last-child),.kp-steps:has(> :nth-child(1):last-child){grid-template-columns:1fr}
}
@media(max-width:700px){
  .kp-imgsplit{grid-template-columns:1fr}
  .kp-imgsplit .kp-media img{height:auto;min-height:0;aspect-ratio:16/10}
}
@media(max-width:600px){
  .kp-cols2,
  .kp-tcards,.kp-feats,.kp-steps,
  .kp-tcards:has(> :nth-child(2):last-child),.kp-feats:has(> :nth-child(2):last-child),.kp-steps:has(> :nth-child(2):last-child),
  .kp-tcards:has(> :nth-child(4):last-child),.kp-feats:has(> :nth-child(4):last-child),.kp-steps:has(> :nth-child(4):last-child){grid-template-columns:1fr}
  .kp-points > *,.kp-usps > *{flex-basis:100%;max-width:none}
}

/* Bild-Banner: NICHT mehr hart auf 440px croppen (Diagramme wurden mittig abgeschnitten) */
.kp-figure{display:block;max-height:none;overflow:hidden;border-radius:16px;margin:1.9rem 0;
  box-shadow:0 22px 52px -30px rgba(10,61,77,.5);border:1px solid var(--ds-line,#e4ebee)}
img.kp-figure{width:100%;height:auto;object-fit:initial}
figure.kp-figure img{display:block;width:100%;height:auto}
figure.kp-figure figcaption{padding:.7rem 1.1rem;font-size:.88rem;color:var(--ds-ink-soft,#5d717a);background:#fff;text-align:center}

/* =========================================================
   ICON-SYSTEM (Karten/Schritte): Badge + SVG-Datei-URI (utf8mb3-sicher, keine Emojis)
   Markup im Content: <span class="kp-ic kp-ic-percent"></span>
   ========================================================= */
.kp-ic{display:inline-flex;width:48px;height:48px;border-radius:14px;align-items:center;justify-content:center;
  background:var(--ds-brand-50,#ecfafd);margin:0 0 .95rem;flex:0 0 auto}
.kp-ic::before{content:"";width:26px;height:26px;background-position:center;background-repeat:no-repeat;background-size:contain}
.kp-ic-percent::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='19' y1='5' x2='5' y2='19'/%3E%3Ccircle cx='6.5' cy='6.5' r='2.5'/%3E%3Ccircle cx='17.5' cy='17.5' r='2.5'/%3E%3C/svg%3E")}
.kp-ic-doc::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 3H7a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 3 14 8 19 8'/%3E%3Cline x1='9' y1='13' x2='15' y2='13'/%3E%3Cline x1='9' y1='16' x2='15' y2='16'/%3E%3C/svg%3E")}
.kp-ic-clock::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolyline points='12 7 12 12 15 14'/%3E%3C/svg%3E")}
.kp-ic-shield::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 3v6c0 4.5-3 7-7 9-4-2-7-4.5-7-9V6z'/%3E%3Cpolyline points='9 12 11.5 14.5 16 9.5'/%3E%3C/svg%3E")}
.kp-ic-search::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.5' y2='16.5'/%3E%3C/svg%3E")}
.kp-ic-home::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11l9-7 9 7'/%3E%3Cpath d='M5 10v10h14V10'/%3E%3Cpath d='M10 20v-6h4v6'/%3E%3C/svg%3E")}
.kp-ic-coins::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M15.5 9a4 4 0 1 0 0 6'/%3E%3Cline x1='7.5' y1='11' x2='13' y2='11'/%3E%3Cline x1='7.5' y1='13.5' x2='12.5' y2='13.5'/%3E%3C/svg%3E")}
.kp-ic-key::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='15' r='4'/%3E%3Cline x1='10.8' y1='12.2' x2='20' y2='3'/%3E%3Cline x1='16' y1='7' x2='19' y2='10'/%3E%3C/svg%3E")}
.kp-ic-scale::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='4' x2='12' y2='20'/%3E%3Cline x1='5' y1='7' x2='19' y2='7'/%3E%3Cpath d='M5 7l-2.5 5a2.5 2.5 0 0 0 5 0z'/%3E%3Cpath d='M19 7l2.5 5a2.5 2.5 0 0 1-5 0z'/%3E%3Cline x1='8' y1='20' x2='16' y2='20'/%3E%3C/svg%3E")}
.kp-ic-trend::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='3 16 9 10 13 14 21 6'/%3E%3Cpolyline points='15 6 21 6 21 12'/%3E%3C/svg%3E")}
.kp-ic-users::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3.2'/%3E%3Cpath d='M3.5 20a5.5 5.5 0 0 1 11 0'/%3E%3Cpath d='M16 5a3.2 3.2 0 0 1 0 6.4'/%3E%3Cpath d='M17.5 20a5.5 5.5 0 0 0-3-4.9'/%3E%3C/svg%3E")}
.kp-ic-check::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 12 10 18 20 6'/%3E%3C/svg%3E")}
.kp-ic-build::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.1-3.1a6 6 0 0 1-7.9 7.9l-6.3 6.3a2.1 2.1 0 0 1-3-3l6.3-6.3a6 6 0 0 1 7.9-7.9z'/%3E%3C/svg%3E")}
.kp-ic-doc2::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cline x1='3' y1='9' x2='21' y2='9'/%3E%3C/svg%3E")}
.kp-ic-x::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3C/svg%3E")}
.kp-ic-bank::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b8fab' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M4 10h16'/%3E%3Cpath d='M5 10v8M9 10v8M15 10v8M19 10v8'/%3E%3Cpath d='M12 3l8 4.5H4z'/%3E%3C/svg%3E")}
/* kp-point mit Icon-Badge: Badge + Label sauber ausrichten */
.kp-point .kp-ic{margin:0}
.kp-point h4{margin:0}


/* =========================================================
   UEBERSCHRIFTEN-HIERARCHIE (2026-06-04): Karten-Titel sind jetzt <h3> statt <h4>
   (keine h2->h4-Spruenge, SEO-konform). h3 in Karten/Sidecards = bisherige h4-Optik.
   ========================================================= */
.kp-tcard h3,.kp-feat .b h3,.kp-costcard h3,.kp-sidecard h3,.kp-person .b h3,.kp-point h3{
  font-family:var(--ds-font-display);font-weight:800;color:var(--ds-brand-900);letter-spacing:-.005em}
.kp-tcard h3{font-size:1.12rem;line-height:1.28;margin:0 0 .7rem}
.kp-feat .b h3{font-size:1.18rem;line-height:1.25;margin:0 0 .6rem}
.kp-costcard h3{font-size:1.18rem;margin:0 0 .8rem;display:flex;align-items:center;gap:.5ch}
.kp-sidecard h3{font-size:1.15rem;margin:0 0 .9rem}
.kp-person .b h3{font-size:1.08rem;margin:0 0 .2rem}
.kp-point h3{font-size:1.06rem;line-height:1.3;margin:0}
/* Fliesstext-Unterueberschrift (kp-prose h3) — klar kleiner als h2, groesser als Karten */
.kp-prose h3{font-family:var(--ds-font-display);font-weight:800;font-size:1.32rem;line-height:1.3;
  letter-spacing:-.01em;color:var(--ds-brand-900);margin:1.6rem 0 .6rem}

/* Harmloser Sektions-Wrapper, den Agenten gelegentlich um ein kp-band setzen (gueltig machen statt Fehler) */
.kp-band-wrap{display:block}

/* =========================================================
   BILD-/HERO-KORREKTUREN (2026-06-04)
   ========================================================= */
/* kp-figure: Bild zentriert + gedeckelt -> verhindert riesige quadratische/runde Grafiken (Prozent-Kreise) */
figure.kp-figure{display:block;width:-moz-fit-content;width:fit-content;max-width:100%;margin:1.9rem auto;overflow:hidden}
figure.kp-figure img{display:block;width:auto;max-width:100%;max-height:360px;height:auto;object-fit:contain}
/* Hero-Hintergrund leicht nach oben -> Personen-Koepfe werden nicht abgeschnitten */
/* Hero-Bilder immer oben/mitte ausrichten (Manuel 2026-06-05) */
.kp-hero{background-position:center top}
.kp-hero2::before{background-position:center top!important}
.kp-hero img,.kp-hero2 img{object-position:center top}

/* === KARTEN-BILDER + BANNER-ABSTAND + USP-HAEKCHEN (2026-06-04) === */
/* Bilder IN einer kp-card (z.B. Bundesland-Wappen) immer klein/konsistent, auch wenn faelschlich in <figure class="kp-figure"> gewickelt */
.kp-card .kp-figure{margin:0;width:auto;max-width:none;overflow:visible;box-shadow:none;border:0;border-radius:0;flex:0 0 auto}
.kp-card .kp-figure img,.kp-card>img{width:52px;height:52px;max-height:52px;object-fit:contain;border-radius:0}
/* Karten MIT Beschreibung (Bundesland-/Themen-Uebersicht: figure+h3+p): NICHT horizontal quetschen,
 * sondern vertikale Karte (Bild oben, Titel, Beschreibung darunter, voll umbrechend). Behebt rechts abgeschnittenen Text. */
.kp-card:has(> h3){flex-direction:column;align-items:center;text-align:center;justify-content:flex-start;gap:.55rem;padding:1.5rem 1.4rem}
.kp-card:has(> h3) > .kp-figure{order:-1}
.kp-card:has(> h3) > .kp-figure img,.kp-card:has(> h3) > img{width:60px;height:60px;max-height:60px}
.kp-card:has(> h3) > h3{font-family:var(--ds-font-display);font-weight:800;font-size:1.1rem;line-height:1.2;margin:.15rem 0 0;color:var(--ds-brand-700,#0a3d4d)}
.kp-card:has(> h3) > p{margin:0;font-size:.92rem;line-height:1.5;color:var(--ds-ink-soft,#4a5b62);max-width:100%;min-width:0;overflow-wrap:break-word;word-break:normal;hyphens:auto}
/* Banner: Button bekommt Abstand zu USPs/Text darueber (lag teils direkt an) */
.kp-band .kp-usps{margin-bottom:1.8rem}
.kp-band .kp-btn,.kp-band .kp-cta{margin-top:1.4rem}
/* Banner-Block (kp-band) braucht Abstand zum Inhalt DARUEBER, wenn er in derselben kp-inner folgt
   (z.B. Karten-Reihe „groesste Banken" sass sonst direkt auf dem Banner). Nicht als erstes Element -> Abstand. */
.kp-band:not(:first-child){margin-top:2.8rem}
/* Generell: zwei aufeinanderfolgende Inhalts-Bloecke in derselben kp-inner brauchen vertikalen Abstand
   (z.B. Karten-Reihe direkt vor Text-Bild-Split/Icon-Box, bankgarantie „Verhandeln zahlt sich aus"). Margins kollabieren mit den bestehenden. */
:is(.kp-tcards,.kp-feats,.kp-points,.kp-steps,.kp-cols2,.kp-split2,.kp-imgsplit,.kp-band,.kp-note,.kp-grid,.kp-usps) +
:is(.kp-tcards,.kp-feats,.kp-points,.kp-steps,.kp-cols2,.kp-split2,.kp-imgsplit,.kp-band,.kp-note,.kp-grid){margin-top:2.6rem}
/* Doppeltes Haekchen vermeiden: kp-usp setzt automatisch ein ✓ ueber ::before; falls Text auch eins hat, ::before unterdruecken */
.kp-usp:not(:empty)::before{content:"✓"}

/* Nicht-klickbare Menue-Labels (Punkte ohne Ziel-URL, statt toter href="#") */
.bh-toggle{cursor:pointer}
.bh-mega .bh-label,.bh-drop .bh-label{display:block;padding:.45rem .6rem;font-weight:700;font-size:12px;
  letter-spacing:.04em;text-transform:uppercase;color:var(--ds-brand-600,#0b8fab);cursor:default}

/* === ICON-PANEL (Redesign 2026-06-05): grosser weisser Icon in kraeftigem Marken-Kreis,
   damit es als bewusstes Design-Element wirkt und NICHT als leere Platzhalter-Box (Review-Feedback). === */
.kp-media.kp-iconpanel{display:flex;align-items:center;justify-content:center;min-height:210px;
  background:linear-gradient(140deg,#eef7f9,#dbecf1);border:1px solid var(--ds-line);border-radius:16px;box-shadow:none;overflow:hidden;padding:1.6rem;
  position:relative}
.kp-media.kp-iconpanel img{display:none}
.kp-media.kp-iconpanel .kp-ic{width:min(58%,172px);height:auto;aspect-ratio:1;border-radius:50%;
  background:linear-gradient(140deg,#0bb9d9,#0a3d4d);box-shadow:0 22px 50px -20px rgba(10,61,77,.55)}
.kp-media.kp-iconpanel .kp-ic::before{width:44%;height:44%;filter:brightness(0) invert(1)}
/* Icon-Header fuer kp-feat-Karten (Ersatz fuer schlecht beschnittene Foto-Freisteller) */
.kp-feat .kp-feat-ic{height:120px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,#eef7f9,#dbecf1);border-bottom:1px solid var(--ds-line)}
.kp-feat .kp-feat-ic .kp-ic{width:84px;height:84px;border-radius:22px;background:#fff;box-shadow:0 14px 30px -18px rgba(10,61,77,.4)}
.kp-feat .kp-feat-ic .kp-ic::before{width:44px;height:44px}
/* Marken-/Bank-Logos und Tool-Screenshots in Karten/Figuren nie uebergross: in saubere weisse Kachel, fest gedeckelt */
.kp-figure img[src*="parkasse"],.kp-figure img[src*="aiffeisen"],.kp-figure img[src*="ank-Austria"],
.kp-card img[src*="parkasse"],.kp-card img[src*="aiffeisen"]{max-height:120px;width:auto;object-fit:contain;margin:0 auto}
.kp-imgsplit .kp-media:has(img[src*="reditrechner"]),
.kp-imgsplit .kp-media:has(img[src*="Bank-Burgenland"]){background:#fff;display:flex;align-items:center;justify-content:center;
  min-height:0;border:1px solid var(--ds-line);border-radius:14px;box-shadow:none;overflow:hidden}
.kp-imgsplit .kp-media img[src*="reditrechner"],
.kp-imgsplit .kp-media img[src*="Bank-Burgenland"]{max-height:84px !important;width:auto !important;
  aspect-ratio:auto !important;object-fit:contain !important;margin:0 auto;padding:1.4rem 1.6rem}
/* Kreditrechner-Logo-Splits: Logo-Spalte SCHMAL (fuellt sich mit dem Logo), Text breit -> keine halbe leere Box mehr */
.kp-imgsplit:not(.rev):has(> .kp-media:has(img[src*="reditrechner"])),
.kp-imgsplit:not(.rev):has(> .kp-media:has(img[src*="Bank-Burgenland"])){grid-template-columns:minmax(0,1fr) 190px}
.kp-imgsplit.rev:has(> .kp-media:has(img[src*="reditrechner"])),
.kp-imgsplit.rev:has(> .kp-media:has(img[src*="Bank-Burgenland"])){grid-template-columns:190px minmax(0,1fr)}
@media(max-width:700px){.kp-imgsplit:has(> .kp-media:has(img[src*="reditrechner"])),
  .kp-imgsplit:has(> .kp-media:has(img[src*="Bank-Burgenland"])){grid-template-columns:1fr}}

/* === MINOR-REVIEW-FIXES (2026-06-04) === */
/* (a) Kleines Partner-Logo (FL-de-Icon) sass als fast leere, umrandete Riesen-Box am Seitenende ("leerer weisser Kasten") -> kompakte, saubere Logo-Kachel */
.kp-imgsplit .kp-media:has(img[src*="FL-de-Icon"]){display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid var(--ds-line);box-shadow:none;border-radius:16px;min-height:0;padding:2rem}
.kp-imgsplit .kp-media img[src*="FL-de-Icon"]{max-width:150px !important;max-height:150px;width:auto !important;height:auto;margin:0 auto;aspect-ratio:auto !important}
/* (b) Bundesland-Wappen in Text-Bild-Splits: kleines zentriertes Emblem in heller Box statt vollflaechigem Riesen-Wappen */
.kp-imgsplit .kp-media:has(img[src$="/Burgenland.png"]),.kp-imgsplit .kp-media:has(img[src$="/Kaernten.png"]),
.kp-imgsplit .kp-media:has(img[src$="/Niederoesterreich.png"]),.kp-imgsplit .kp-media:has(img[src$="/Oberoesterreich.png"]),
.kp-imgsplit .kp-media:has(img[src$="/Salzburg.png"]),.kp-imgsplit .kp-media:has(img[src$="/Steiermark.png"]),
.kp-imgsplit .kp-media:has(img[src$="/Tirol.png"]),.kp-imgsplit .kp-media:has(img[src$="/Vorarlberg.png"]),
.kp-imgsplit .kp-media:has(img[src$="/Wien.png"]){display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,#eef7f9,#dbecf1);border:1px solid var(--ds-line);box-shadow:none;border-radius:16px;min-height:240px}
.kp-imgsplit .kp-media img[src$="/Burgenland.png"],.kp-imgsplit .kp-media img[src$="/Kaernten.png"],
.kp-imgsplit .kp-media img[src$="/Niederoesterreich.png"],.kp-imgsplit .kp-media img[src$="/Oberoesterreich.png"],
.kp-imgsplit .kp-media img[src$="/Salzburg.png"],.kp-imgsplit .kp-media img[src$="/Steiermark.png"],
.kp-imgsplit .kp-media img[src$="/Tirol.png"],.kp-imgsplit .kp-media img[src$="/Vorarlberg.png"],
.kp-imgsplit .kp-media img[src$="/Wien.png"]{max-height:180px !important;width:auto !important;object-fit:contain !important;
  aspect-ratio:auto !important;margin:0 auto;padding:1.5rem}
/* (c) 5er-/7er-Raster: letzte Reihe FUELLT die Breite (kein leeres Drittel mehr); Karten der letzten Reihe wachsen */
.kp-tcards:has(> :nth-child(5):last-child) > *,.kp-feats:has(> :nth-child(5):last-child) > *,
.kp-tcards:has(> :nth-child(7):last-child) > *,.kp-feats:has(> :nth-child(7):last-child) > *{flex:1 1 300px;max-width:none}
/* (d) Wappen-/Foerderungs-Linkkarten (kp-grid mit img+b+span): saubere Karte, Name klebt nicht mehr an Wappen/Text (57620) */
.kp-grid a:has(> b){display:flex;flex-direction:column;align-items:center;text-align:center;gap:.4rem;
  background:#fff;border:1px solid var(--ds-line);border-radius:14px;padding:1.3rem 1.1rem;text-decoration:none;color:var(--ds-brand-900);transition:transform .2s,box-shadow .2s}
.kp-grid a:has(> b):hover{transform:translateY(-3px);box-shadow:0 18px 40px -22px rgba(10,61,77,.42)}
.kp-grid a:has(> b) img{width:54px;height:54px;object-fit:contain;margin:0 0 .25rem}
.kp-grid a:has(> b) b{font-family:var(--ds-font-display,'Sen',sans-serif);font-size:1.05rem;color:var(--ds-brand-900,#062a36)}
.kp-grid a:has(> b) span{font-size:.88rem;color:var(--ds-ink-soft,#4a5b62);line-height:1.42}
/* (e) Laender-Flaggen-Kreise (kp-feat.diagram, Versicherungs-Laenderbilder) kleiner, nicht kartenfuellend (62178) */
.kp-feat.diagram img[src*="-versichern"]{max-width:96px !important;max-height:96px !important;width:auto;height:auto;margin:1.2rem auto .2rem;border-radius:50%}
/* (f) kp-costcard-Listen (Vorteile/Nachteile, Links): geerbtes ✓-::before ohne Padding ueberlappte den Text (65376/55760). Trennlinien sind die Struktur -> ✓ raus. */
.kp-costcard ul li::before{content:none !important}
.kp-costcard ul li{padding-left:0}

/* Voll-breites Prozess-/Ablauf-Bild (Querformat-Infografik, ueber die ganze Spaltenbreite) */
.kp-figure-wide{margin:1.8rem 0 0;width:100%}
.kp-figure-wide img{width:100%;height:auto;display:block;border-radius:12px;border:1px solid var(--ds-line)}

/* === BILD-ABSTAND-FIX (2026-06-05): Bild-Kachel OBEN BUENDIG (nicht auf Textspaltenhoehe gestreckt),
   Kachel umschliesst das Bild knapp, klarer Abstand zum folgenden Block. Behebt: Rahmen der Bildzelle
   stiess vorher (durch align-items:stretch) auf den Rahmen der Karten-Reihe darunter. === */
.kp-imgsplit{align-items:start;margin-bottom:2.6rem}
.kp-imgsplit:last-child{margin-bottom:0}
.kp-imgsplit .kp-media:not(.kp-iconpanel){display:block;background:#fff;border:1px solid var(--ds-line);
  border-radius:14px;box-shadow:0 16px 40px -28px rgba(10,61,77,.4);min-height:0;padding:0;overflow:hidden;align-self:start}
/* Foto-Kacheln: Bild in NATUERLICHER Proportion (kein Crop, KEIN weisser Rand) - die Kachel passt
   sich ans Bild an, statt das Bild in ein festes Format zu zwingen. width:100% fuellt die Spaltenbreite,
   height:auto = Originalverhaeltnis. Logos/Wappen/Diagramme behalten ihre !important-Sonderregeln (s.u.). */
.kp-imgsplit .kp-media:not(.kp-iconpanel) img{width:100%;height:auto;max-height:none;aspect-ratio:auto;
  object-fit:fill;display:block;margin:0;border-radius:0}
/* GLEICHE Logik fuer die anderen 2-Spalten-Bild-Layouts (kp-split, kp-split2): Bild oben buendig, Abstand unten */
.kp-split{align-items:start}
.kp-split2{align-items:start}
.kp-split2 .kp-splitimg,.kp-split .kp-media,.kp-split2 .kp-media{align-self:start}
/* Bank-Logos in „groesste Banken"-Karten: ganzes Logo zentriert in heller Kachel mit Trennlinie
   (vorher weiss-auf-weiss „aufgesetzt", keine Trennung zum Text) */
.kp-feat > img[src*="/2022/10/Kredit-"],.kp-feat > img[src*="/2022/12/Kredit-"]{
  object-fit:contain !important;background:#f5fafb;padding:1.5rem 1.6rem;height:140px;
  border-bottom:1px solid var(--ds-line)}

/* === Zentrales repraesentatives Rechenbeispiel ([if_rechenbeispiel]) === */
.kp-rechenbeispiel{background:#fff;border:1px solid var(--ds-line);border-left:4px solid var(--ds-brand-600,#0b8fab);
  border-radius:14px;padding:1.6rem 1.8rem;margin:1.9rem 0;box-shadow:0 18px 40px -28px rgba(10,61,77,.4)}
.kp-rechenbeispiel .kp-eyebrow2{margin-bottom:.2rem}
.kp-rechenbeispiel h3{font-family:var(--ds-font-display,'Sen',sans-serif);font-weight:800;font-size:1.2rem;
  margin:.2rem 0 1rem;color:var(--ds-brand-900,#062a36)}
.kp-rechenbeispiel dl{display:grid;grid-template-columns:1fr 1fr;gap:0 1.8rem;margin:0}
.kp-rechenbeispiel dl > div{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;
  padding:.6rem 0;border-bottom:1px solid var(--ds-line)}
.kp-rechenbeispiel dt{color:var(--ds-ink-soft,#4a5b62);font-size:.95rem}
.kp-rechenbeispiel dd{margin:0;font-weight:700;color:var(--ds-brand-900,#062a36);text-align:right;white-space:nowrap}
.kp-rechenbeispiel .kp-rb-foot{margin:1rem 0 0;font-size:.82rem;color:var(--ds-ink-soft,#4a5b62);line-height:1.5}
@media(max-width:640px){.kp-rechenbeispiel dl{grid-template-columns:1fr}}

/* === Aufklappbare Toggles (aus Divi-Akkordeons konvertiert, z.B. partner-werden) === */
.kp-prose .kp-toggle{border:1px solid var(--ds-line);border-radius:12px;margin:.7rem 0;background:#fff;
  box-shadow:0 10px 26px -22px rgba(10,61,77,.4)}
.kp-prose .kp-toggle>summary{cursor:pointer;padding:1rem 2.6rem 1rem 1.2rem;font-weight:600;list-style:none;
  position:relative;color:var(--ds-brand-900,#062a36)}
.kp-prose .kp-toggle>summary::-webkit-details-marker{display:none}
.kp-prose .kp-toggle>summary::after{content:"+";position:absolute;right:1.1rem;top:50%;transform:translateY(-50%);
  font-size:1.3rem;font-weight:700;color:var(--ds-brand-600,#0b8fab);line-height:1}
.kp-prose .kp-toggle[open]>summary::after{content:"\2212"}
.kp-prose .kp-toggle>summary+*{margin-top:0}
.kp-prose .kp-toggle>*:not(summary){padding:0 1.2rem;margin:.2rem 0}
.kp-prose .kp-toggle>*:not(summary):last-child{padding-bottom:1rem}
