/**
 * Spendenseiten (Übersicht + Vorhaben). Farben über --bfs-ctx-primary (Kontext).
 */
.bfs-spenden {
  --sp-accent: var(--bfs-ctx-primary, #7F8800);
  --sp-accent-dk: var(--bfs-ctx-primary-dk, #5f6600);
  --sp-ink: var(--wp--preset--color--neutral-900, #1a1a1a);
  --sp-soft: var(--wp--preset--color--neutral-700, #444);
  --sp-line: #e3e6d8;
  background: var(--bfs-ctx-surface, #f0f2d8);
  color: var(--sp-ink);
  padding-bottom: clamp(2rem, 4vw, 4rem);
}
.bfs-spenden .bfs-btn--primary { background: var(--sp-accent-dk); border-color: var(--sp-accent-dk); color: #fff; }
.bfs-spenden .bfs-btn--primary:hover { background: var(--sp-ink); border-color: var(--sp-ink); }

.bfs-sp-hero { height: clamp(180px, 24vw, 300px); background-size: cover; background-position: center; }
.bfs-sp-wrap { max-width: 1100px; margin: 0 auto; padding: clamp(1.5rem, 3vw, 2.5rem) 1.25rem 0; }
.bfs-sp-kicker { margin: 0 0 .25rem; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--sp-accent-dk); }
.bfs-sp-kicker--section { margin-top: 2.5rem; }
.bfs-sp-title { margin: 0 0 .5rem; font-size: clamp(2rem, 4vw, 3rem); line-height: 1.1; color: var(--sp-ink); }
.bfs-sp-lead { max-width: 40em; margin: 0 0 1.75rem; font-size: 1.15rem; color: var(--sp-soft); }
.bfs-sp-small { margin: .4rem 0 0; font-size: .9rem; color: var(--sp-soft); }
.bfs-sp-note { margin: 2rem 0 0; font-size: .8rem; color: #777; }
.bfs-sp-crumbs { margin: 0 0 1.25rem; font-size: .9rem; color: #666; }

.bfs-sp-cards { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.bfs-sp-card { background: #fff; border: 1px solid var(--sp-line); border-radius: 18px; padding: 1.5rem; display: flex; flex-direction: column; align-items: flex-start; gap: .5rem; }
.bfs-sp-card h2 { margin: 0; font-size: 1.35rem; line-height: 1.2; color: var(--sp-ink); }
.bfs-sp-card p { margin: 0; color: var(--sp-soft); }
.bfs-sp-card .bfs-sp-btn { margin-top: auto; border-radius: 999px; }
.bfs-sp-card > p { margin-bottom: 1.25rem; }
.bfs-sp-btn.is-platzhalter, .bfs-sp-go.is-platzhalter { opacity: .8; cursor: not-allowed; }
.bfs-sp-btn.is-platzhalter:hover, .bfs-sp-go.is-platzhalter:hover { transform: none; }

.bfs-sp-vorhaben { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 1.5rem; margin-top: .5rem; }
.bfs-sp-vorhaben__text { flex: 1 1 280px; }
.bfs-sp-vorhaben__stand { flex: 1 1 260px; }
.bfs-sp-vorhaben .bfs-sp-btn { margin-top: 0; }

.bfs-sp-bar { height: 12px; border-radius: 999px; background: #e4e8e6; overflow: hidden; }
.bfs-sp-bar > span { display: block; height: 100%; background: var(--sp-accent); border-radius: 999px; }
.bfs-sp-badge { display: inline-block; vertical-align: middle; margin: 0 0 .5rem; padding: .15em .7em; border-radius: 999px; background: #fff3cd; color: #7a5b00; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.bfs-sp-vorhaben h2 .bfs-sp-badge { margin: 0 0 0 .5rem; }

.bfs-sp-detail { display: grid; gap: 2rem; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 900px) { .bfs-sp-detail { grid-template-columns: 1.15fr 1fr; } .bfs-sp-box { position: sticky; top: 1.5rem; } }
.bfs-sp-bild { margin: 0 0 1.25rem; background: #fff; border: 1px solid var(--sp-line); border-radius: 18px; padding: 1rem; }
.bfs-sp-bild__img { display: block; width: 100%; height: auto; }
.bfs-sp-bild figcaption { margin-top: .75rem; font-size: .82rem; color: #666; }
.bfs-sp-hinweis { color: var(--sp-soft); }

.bfs-sp-box { background: #fff; border: 1px solid var(--sp-line); border-radius: 18px; padding: 1.5rem; }
.bfs-sp-stand { margin: .9rem 0 0; font-size: 1.9rem; font-weight: 700; line-height: 1.1; }
.bfs-sp-interval { display: flex; gap: .6rem; align-items: center; margin: 1.25rem 0 1rem; color: #888; }
.bfs-sp-interval button { background: none; border: 0; padding: 0; font: inherit; color: var(--sp-soft); cursor: pointer; }
.bfs-sp-interval button.is-active { font-weight: 700; color: var(--sp-ink); }
.bfs-sp-betraege { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 1rem; }
.bfs-sp-betraege button { flex: 1 1 auto; min-width: 3.5rem; padding: .7rem .9rem; border-radius: 12px; border: 2px solid var(--sp-accent); background: #fff; color: var(--sp-accent-dk); font: inherit; font-weight: 700; font-size: 1.05rem; cursor: pointer; }
.bfs-sp-betraege button.is-active { background: var(--sp-accent); color: #fff; }
.bfs-sp-eigener[hidden] { display: none; }
.bfs-sp-eigener { display: block; margin-bottom: 1rem; font-size: .9rem; color: var(--sp-soft); }
.bfs-sp-eigener input { display: block; margin-top: .3rem; width: 100%; padding: .6rem .8rem; border: 2px solid var(--sp-accent); border-radius: 10px; font: inherit; }
.bfs-sp-go { width: 100%; border-radius: 999px; margin-bottom: .75rem; }
.bfs-sp-platzhalter { margin: 0 0 .75rem; padding: .5rem .75rem; border-radius: 10px; background: #fff3cd; color: #7a5b00; font-size: .85rem; }

/* Kurze Seiten: Footer unten halten, damit darunter kein heller Body-Streifen sichtbar wird. */
body .wp-site-blocks { min-height: 100vh; display: flex; flex-direction: column; }
body .wp-site-blocks > main { flex: 1 0 auto; }