/* Pecunia Fondsfinder – ergänzt assets/styles.css, alle Klassen mit ff- */
.ff-wrap{max-width:920px;margin:0 auto}
#fondsfinder{scroll-margin-top:120px}
.ff-karte{background:#fff;border:1px solid var(--border,#e3e9ec);border-radius:var(--radius,14px);box-shadow:var(--shadow,0 4px 24px rgba(14,42,56,.08));padding:28px;margin-bottom:20px}
.ff-karte h3{font-size:1.25rem;margin-bottom:8px}
.ff-karte h4{font-size:1.08rem;margin:6px 0 2px;color:var(--navy,#0e2a38)}
.ff-karte h5{font-size:.85rem;text-transform:uppercase;letter-spacing:.06em;color:var(--petrol,#155b7a);margin-bottom:8px}
.ff-mitte{text-align:center}
.ff-intro h2{margin-bottom:10px}
.ff-check{list-style:none;margin:18px 0}
.ff-check li{padding:6px 0 6px 30px;position:relative}
.ff-check li:before{content:"✓";position:absolute;left:4px;color:var(--gold-dark,#b08f45);font-weight:700}
.ff-klein{font-size:.86rem;color:var(--text-light,#5d6f78);margin-top:8px}
.ff-hilfe{color:var(--text-light,#5d6f78);margin-bottom:18px}
.ff-zwischen{font-weight:600;color:var(--navy,#0e2a38);margin:22px 0 10px}
.ff-hinweis{background:#fbf6ea;border-left:4px solid var(--gold,#c8a45a);padding:12px 16px;border-radius:8px;margin:0 0 16px}
.ff-hinweis-klein{font-size:.86rem;margin-top:10px}
.ff-warnung{border-left:5px solid #b4543c}
.ff-karte.ff-warnung h3{color:#8a3a26}
.ff-datenstand{font-size:.88rem;background:var(--bg,#f6f8f9);border:1px solid var(--border,#e3e9ec);border-radius:10px;padding:12px 16px;margin-bottom:20px}
.ff-abschnitt{margin:26px 0 12px;font-size:1.2rem}

/* Fortschritt */
.ff-fortschritt{margin-bottom:14px}
.ff-fortschritt-text{display:flex;justify-content:space-between;font-size:.85rem;font-weight:600;color:var(--petrol,#155b7a);margin-bottom:6px}
.ff-balken{height:8px;background:var(--border,#e3e9ec);border-radius:8px;overflow:hidden}
.ff-balken div{height:100%;background:linear-gradient(90deg,var(--petrol,#155b7a),var(--gold,#c8a45a));border-radius:8px;transition:width .3s ease}

/* Kacheln */
.ff-kacheln{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ff-kacheln-klein{grid-template-columns:repeat(3,1fr)}
.ff-kachel{display:flex;align-items:center;gap:14px;text-align:left;min-height:64px;padding:14px 18px;border:2px solid var(--border,#e3e9ec);border-radius:12px;background:#fff;font:inherit;font-size:1rem;color:var(--text,#2b3a42);cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s}
.ff-kacheln-klein .ff-kachel{min-height:54px;font-size:.93rem;padding:10px 14px}
.ff-kachel:hover{border-color:var(--petrol,#155b7a);box-shadow:0 2px 10px rgba(21,91,122,.12)}
.ff-kachel:focus-visible{outline:3px solid var(--gold,#c8a45a);outline-offset:2px}
.ff-kachel.ist-aktiv{border-color:var(--petrol,#155b7a);background:#eef5f8;font-weight:600}
.ff-icon{font-size:1.5rem;flex:0 0 auto}
.ff-punkt{flex:0 0 20px;height:20px;border-radius:50%;border:2px solid #9fb3bd;position:relative}
.ff-kachel[role=checkbox] .ff-punkt{border-radius:5px}
.ff-kachel.ist-aktiv .ff-punkt{border-color:var(--petrol,#155b7a);background:var(--petrol,#155b7a);box-shadow:inset 0 0 0 3px #fff}
.ff-navi{display:flex;justify-content:space-between;gap:12px;margin-top:26px;flex-wrap:wrap}
.ff-navi .btn[disabled]{opacity:.45;cursor:not-allowed}
.ff-betraege{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.ff-feld{display:block;font-size:.88rem;font-weight:600;color:var(--navy,#0e2a38)}
.ff-feld span{display:flex;align-items:center;gap:8px;margin-top:6px}
.ff-feld input{width:100%;padding:12px 14px;border:1px solid var(--border,#e3e9ec);border-radius:8px;font:inherit;background:var(--bg,#f6f8f9)}
.ff-feld.ist-aus{opacity:.45}

/* Kursrückgang */
.ff-rueckgang{background:var(--bg,#f6f8f9);border-radius:12px;padding:16px;margin-bottom:18px}
.ff-rg-zeile{display:grid;grid-template-columns:54px 1fr 190px;gap:12px;align-items:center;margin:8px 0}
.ff-rg-label{font-weight:700;color:#8a3a26;white-space:nowrap}
.ff-rg-balken{display:flex;height:16px;border-radius:6px;overflow:hidden;background:#fff}
.ff-rg-rest{background:var(--petrol,#155b7a)}
.ff-rg-minus{background:repeating-linear-gradient(45deg,#d9a08f,#d9a08f 6px,#ecc7bb 6px,#ecc7bb 12px)}
.ff-rg-wert{font-weight:600;font-size:.92rem}
.ff-rg-wert small{color:#8a3a26;font-weight:500}

/* Erklärungen */
.ff-erkl{border-top:1px solid var(--border,#e3e9ec);margin-top:14px;padding-top:10px}
.ff-erkl summary{cursor:pointer;font-weight:600;color:var(--petrol,#155b7a)}
.ff-erkl p,.ff-erkl ul{margin-top:8px;font-size:.92rem}
.ff-erkl ul{padding-left:20px}

/* Profil */
.ff-sri{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:16px 0 4px}
.ff-sri span{text-align:center;padding:10px 0;border-radius:8px;background:#eceff1;color:#9aa8af;font-weight:700}
.ff-sri span.ist-ok{background:#d6e8ef;color:var(--petrol,#155b7a)}
.ff-sri span.ist-ziel{background:var(--petrol,#155b7a);color:#fff}
.ff-sri-legende{display:flex;justify-content:space-between;font-size:.78rem;color:var(--text-light,#5d6f78);margin-bottom:12px}

/* Fondskarte */
.ff-fonds-kopf{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;border-bottom:1px solid var(--border,#e3e9ec);padding-bottom:14px;margin-bottom:16px}
.ff-isin{font-size:.86rem;color:var(--text-light,#5d6f78)}
.ff-badge{display:inline-block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:3px 9px;border-radius:20px;background:#eef2f4;color:var(--navy,#0e2a38);margin-right:6px}
.ff-badge-kern{background:var(--petrol,#155b7a);color:#fff}
.ff-badge-erg{background:#f3e7c9;color:#6d5524}
.ff-badge-warn{background:#f6dcd4;color:#8a3a26}
.ff-sri-mini{flex:0 0 auto;background:var(--navy,#0e2a38);color:#fff;border-radius:10px;padding:8px 12px;font-size:.85rem;text-align:center}
.ff-sri-mini b{font-size:1.3rem}
.ff-spalten{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.ff-liste-ok,.ff-liste-risiko{list-style:none;font-size:.92rem}
.ff-liste-ok li,.ff-liste-risiko li{padding:4px 0 4px 24px;position:relative}
.ff-liste-ok li:before{content:"✓";position:absolute;left:2px;color:var(--petrol,#155b7a);font-weight:700}
.ff-liste-risiko li:before{content:"!";position:absolute;left:6px;color:#8a3a26;font-weight:800}
.ff-kennzahlen,.ff-rendite{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}
.ff-rendite{grid-template-columns:repeat(4,1fr);background:var(--bg,#f6f8f9);border-radius:10px;padding:12px}
.ff-rendite-titel{grid-column:1/-1;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#6d5524}
.ff-kz{display:flex;flex-direction:column;font-size:.8rem;color:var(--text-light,#5d6f78)}
.ff-kz b{font-size:1rem;color:var(--navy,#0e2a38)}
.ff-fehlt{color:#8a3a26;font-weight:600;font-size:.85rem}
.ff-fehlt-gross{color:#8a3a26;font-weight:700;font-size:1.1rem;margin-bottom:6px}
.ff-sterne{color:var(--gold-dark,#b08f45);letter-spacing:1px}
.ff-sterne i{font-style:normal;color:#d6dde1}
.ff-fonds-fuss{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px;border-top:1px solid var(--border,#e3e9ec);padding-top:14px}
.ff-btn-klein{padding:9px 18px;font-size:.88rem}
.ff-vgl{font-size:.88rem;display:flex;gap:8px;align-items:center;cursor:pointer}
.ff-vgl input{width:18px;height:18px;accent-color:var(--petrol,#155b7a)}

/* Vergleich */
.ff-tabelle-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ff-tabelle{border-collapse:collapse;width:100%;min-width:560px;font-size:.88rem}
.ff-tabelle th,.ff-tabelle td{border-bottom:1px solid var(--border,#e3e9ec);padding:9px 10px;text-align:left;vertical-align:top}
.ff-tabelle thead th{background:var(--navy,#0e2a38);color:#fff;font-weight:600;font-size:.8rem;min-width:150px}
.ff-tabelle thead th:first-child{min-width:130px}
.ff-tabelle tbody th{color:var(--navy,#0e2a38);font-weight:600;white-space:nowrap;background:var(--bg,#f6f8f9)}

.ff-uebergabe{border:2px solid var(--gold,#c8a45a)}
.ff-status{margin-top:10px;font-weight:600;color:var(--petrol,#155b7a)}
.ff-rechtlich{background:var(--bg,#f6f8f9);box-shadow:none;font-size:.9rem}

/* Einstiegskachel für vermoegensaufbau.html (ganze Karte klickbar) */
.ff-teaser{display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center;text-decoration:none;color:inherit;background:#fff;border:1px solid var(--border,#e3e9ec);border-radius:var(--radius,14px);box-shadow:var(--shadow,0 4px 24px rgba(14,42,56,.08));padding:26px 28px;transition:transform .2s,box-shadow .2s,border-color .2s}
.ff-teaser:hover,.ff-teaser:focus-visible{transform:translateY(-2px);box-shadow:var(--shadow-lg,0 12px 40px rgba(14,42,56,.14));border-color:var(--gold,#c8a45a)}
.ff-teaser-icon{width:58px;height:58px;border-radius:14px;background:linear-gradient(135deg,var(--navy,#0e2a38),var(--petrol,#155b7a));display:flex;align-items:center;justify-content:center;font-size:1.7rem}
.ff-teaser h3{margin-bottom:4px}
.ff-teaser p{color:var(--text-light,#5d6f78)}
.ff-teaser-pfeil{font-size:1.6rem;color:var(--gold-dark,#b08f45)}

/* Übernahme im Terminformular */
.ff-termin-box{background:#eef5f8;border-left:4px solid var(--petrol,#155b7a);border-radius:8px;padding:12px 14px;margin:0 0 14px;font-size:.88rem}
.ff-termin-box button{background:none;border:none;color:var(--petrol,#155b7a);text-decoration:underline;cursor:pointer;font:inherit;padding:0}

@media (max-width:760px){
  .ff-karte{padding:20px 16px}
  .ff-kacheln,.ff-kacheln-klein,.ff-betraege,.ff-spalten{grid-template-columns:1fr}
  .ff-kennzahlen{grid-template-columns:1fr 1fr}
  .ff-rendite{grid-template-columns:1fr 1fr}
  .ff-rg-zeile{grid-template-columns:58px 1fr;row-gap:2px}
  .ff-rg-wert{grid-column:2}
  .ff-navi .btn{flex:1}
  .ff-fonds-kopf{flex-direction:column}
  .ff-teaser{grid-template-columns:1fr;text-align:left}
  .ff-teaser-pfeil{display:none}
}
@media print{
  header,footer,.topbar,.float-wa,.cookie-bar,.ff-uebergabe .btn-row,.ff-vgl,.page-hero img{display:none!important}
  .ff-karte{box-shadow:none;break-inside:avoid}
  .ff-tabelle-wrap{overflow:visible}
}