/* Fallstudie (Demo): eigenes Stylesheet im Capital-Flow-Look. Alle Klassen mit fsd- Präfix, nichts anderes wird verändert. */
.fsd-page { background: #fff; }
.fsd-page .text-muted { color: var(--color-muted); }

/* Hero */
.fsd-hero { padding: 64px 0 70px; background: linear-gradient(#fff, #fafaf9); border-bottom: 1px solid var(--color-border); text-align: center; }
.fsd-hero-inner { max-width: 860px; margin: 0 auto; }
.fsd-back { display: flex; width: max-content; margin-left: auto; margin-right: auto; align-items: center; gap: 8px; margin-bottom: 26px; font-size: 14px; color: var(--color-muted); text-decoration: none; }
.fsd-back:hover { color: var(--color-dark); }
.fsd-hero h1 { font-size: 48px; line-height: 1.1; letter-spacing: -.025em; color: var(--color-dark); margin: 0 0 20px; }
.fsd-hero-inner > p { max-width: 640px; margin: 0 auto 32px; font-size: 17px; line-height: 1.65; color: var(--color-muted); }
.fsd-cover { margin-top: 48px; border-radius: 28px; overflow: hidden; border: 1px solid var(--color-border); aspect-ratio: 16 / 8; background: #f1f0ee; }

/* Kennzahlen */
.fsd-stats { padding: 0; background: #fafaf9; }
.fsd-stats-grid { display: grid; grid-template-columns: repeat(var(--n, 4), 1fr); padding-top: 56px; padding-bottom: 56px; }
.fsd-stat { padding: 0 24px; text-align: center; border-left: 1px solid var(--color-border); }
.fsd-stat:first-child { border-left: 0; }
.fsd-stat b { display: block; font-size: 44px; line-height: 1.1; letter-spacing: -.03em; color: var(--color-accent); margin-bottom: 8px; }
.fsd-stat span { font-size: 15px; color: var(--color-muted); }

/* Sektionen */
.fsd-sec { padding: 90px 0; background: #fff; }
.fsd-sec:nth-of-type(even) { background: #fafaf9; }
.fsd-head { max-width: 640px; margin: 0 auto 44px; text-align: center; }
.fsd-head .faq-eyebrow { margin-bottom: 10px; }
.fsd-head h2 { margin: 6px 0 14px; font-size: 36px; line-height: 1.15; letter-spacing: -.02em; color: var(--color-dark); }
.fsd-head p { margin: 0 auto; font-size: 16px; line-height: 1.65; color: var(--color-muted); }
.fsd-head--left { margin: 0; text-align: left; }
.fsd-head--left p { margin: 0; }

/* Ausgangslage */
.fsd-split { display: grid; grid-template-columns: 1fr 1.1fr; gap: 64px; align-items: center; }
.fsd-pain { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.fsd-pain li { display: flex; gap: 18px; padding: 22px 24px; border: 1px solid var(--color-border); border-radius: 20px; background: #fff; }
.fsd-pain li > span { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; background: #f1f0ee; color: var(--color-dark); }
.fsd-pain h3 { margin: 2px 0 6px; font-size: 18px; color: var(--color-dark); }
.fsd-pain p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--color-muted); }

/* Lösung */

/* Ergebnisse */
.fsd-res-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.fsd-res { grid-column: span 1; display: flex; flex-direction: column; gap: 6px; padding: 30px; border: 1px solid var(--color-border); border-radius: 24px; background: #fff; transition: transform .2s ease, box-shadow .2s ease; }
.fsd-res:hover { transform: translateY(-3px); box-shadow: 0 20px 40px rgba(20,20,20,.07); }
.fsd-res--wide { grid-column: span 2; }
.fsd-res-n { display: block; margin-bottom: 14px; font-size: 52px; line-height: 1; letter-spacing: -.03em; color: var(--color-accent); }
.fsd-res h3 { margin: 0; font-size: 20px; color: var(--color-dark); }
.fsd-res p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--color-muted); }
.fsd-res--dark { background: linear-gradient(160deg, #0f2429, #0b0b0b); border-color: transparent; }
.fsd-res--dark h3, .fsd-res--dark .fsd-res-n { color: #fff; }
.fsd-res--dark p { color: rgba(255,255,255,.68); }
.fsd-res--accent { background: linear-gradient(160deg, #5A605E, #252928 55%, #161918); border-color: transparent; }
.fsd-res--accent h3, .fsd-res--accent .fsd-res-n { color: #fff; }
.fsd-res--accent p { color: rgba(255,255,255,.88); }

/* Vorher / Nachher */
.fsd-cmp-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 980px; margin: 0 auto; }
.fsd-cmp { padding: 34px; border-radius: 24px; border: 1px solid var(--color-border); background: #fff; }
.fsd-cmp-tag { display: inline-block; margin-bottom: 18px; padding: 5px 12px; border-radius: 999px; background: #f1f0ee; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--color-muted); }
.fsd-cmp ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.fsd-cmp li { display: flex; gap: 10px; align-items: flex-start; font-size: 15.5px; line-height: 1.5; color: var(--color-dark); }
.fsd-cmp--old li { color: var(--color-muted); }
.fsd-cmp--new { background: #0b0b0b; border-color: #0b0b0b; }
.fsd-cmp--new .fsd-cmp-tag { background: var(--color-accent); color: #fff; }
.fsd-cmp--new li { color: #fff; }
.fsd-cmp--new li svg { flex: 0 0 auto; margin-top: 3px; padding: 2px; width: 18px; height: 18px; border-radius: 50%; background: var(--color-accent); color: #fff; }

/* Zitat */
.fsd-quote-sec { background: #fff; }
.fsd-quote { max-width: 820px; margin: 0 auto; padding: 48px; text-align: center; border: 1px solid var(--color-border); border-radius: 28px; background: #fafaf9; }
.fsd-quote blockquote { margin: 0 0 26px; font-size: 26px; line-height: 1.4; letter-spacing: -.01em; color: var(--color-dark); }
.fsd-quote figcaption { display: inline-flex; align-items: center; gap: 14px; text-align: left; }
.fsd-quote figcaption b { display: block; font-size: 15px; color: var(--color-dark); }
.fsd-quote figcaption small { font-size: 13px; color: var(--color-muted); }

/* CTA */

@media (max-width: 900px) {
  .fsd-hero { padding: 40px 0 48px; }
  .fsd-hero h1 { font-size: 32px; }
  .fsd-cover { margin-top: 32px; border-radius: 20px; }
  .fsd-stats-grid { grid-template-columns: 1fr 1fr; row-gap: 32px; padding-top: 40px; padding-bottom: 40px; }
  .fsd-stat:nth-child(odd) { border-left: 0; }
  .fsd-stat b { font-size: 34px; }
  .fsd-sec { padding: 56px 0; }
  .fsd-head h2 { font-size: 28px; }
  .fsd-head { margin-bottom: 32px; }
  .fsd-split { grid-template-columns: 1fr; gap: 28px; }
  .fsd-res-grid { grid-template-columns: 1fr 1fr; }
  .fsd-res--wide { grid-column: span 2; }
  .fsd-cmp-grid { grid-template-columns: 1fr; }
  .fsd-quote { padding: 32px 22px; }
  .fsd-quote blockquote { font-size: 20px; }
}
@media (max-width: 520px) { .fsd-res-grid { grid-template-columns: 1fr; } .fsd-res--wide { grid-column: auto; } }
.fsd-cover > img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 900px) {
  .fsd-stats-grid[style] { grid-template-columns: repeat(3, 1fr); row-gap: 0; padding-top: 28px; padding-bottom: 28px; }
  .fsd-stats-grid[style] .fsd-stat { padding: 0 8px; border-left: 1px solid var(--color-border); }
  .fsd-stats-grid[style] .fsd-stat:first-child { border-left: 0; }
  .fsd-stats-grid[style] .fsd-stat b { font-size: 26px; margin-bottom: 6px; }
  .fsd-stats-grid[style] .fsd-stat span { display: block; font-size: 12.5px; line-height: 1.35; }
}

/* Nächste Fallstudie */
.fsd-next-card { display: grid; grid-template-columns: 1fr 1fr; max-width: 980px; margin: 0 auto; overflow: hidden; border: 1px solid var(--color-border); border-radius: 28px; background: #fff; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
.fsd-next-card:hover { transform: translateY(-3px); box-shadow: 0 24px 48px rgba(20,20,20,.08); }
.fsd-next-media { display: block; min-height: 280px; background: #f1f0ee; }
.fsd-next-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fsd-next-body { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; padding: 36px; }
.fsd-next-tag { padding: 5px 12px; border-radius: 999px; background: #f1f0ee; font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--color-muted); }
.fsd-next-body h3 { margin: 4px 0 0; font-size: 26px; color: var(--color-dark); }
.fsd-next-body p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--color-muted); }
.fsd-next-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; font-weight: 600; color: var(--color-accent-dark); }
.fsd-next-card:hover .fsd-next-link svg { transform: translateX(3px); }
.fsd-next-link svg { transition: transform .2s ease; }
@media (max-width: 800px) { .fsd-next-card { grid-template-columns: 1fr; } .fsd-next-media { min-height: 200px; } .fsd-next-body { padding: 26px 22px; } }

/* ---------- Feinschliff: Cards und Gesamteindruck ---------- */
.fsd-page { --fsd-shadow: 0 1px 2px rgba(20,20,20,.04), 0 12px 32px rgba(20,20,20,.05); --fsd-shadow-hover: 0 2px 4px rgba(20,20,20,.05), 0 24px 48px rgba(20,20,20,.1); }
.fsd-head h2 { font-size: 38px; }
.fsd-head p { max-width: 560px; }

/* Kennzahlen als Karte */
.fsd-stats { background: #fafaf9; padding: 40px 0 0; }
.fsd-stats-grid { padding: 36px 24px; border: 1px solid var(--color-border); border-radius: 28px; background: #fff; box-shadow: var(--fsd-shadow); position: relative; top: 0; margin-bottom: -56px; z-index: 2; }
.fsd-stats + .fsd-sec { padding-top: 146px; }
.fsd-stat b { background: linear-gradient(160deg, #5A605E, #252928); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }

/* Schritt-Karten */

/* Ausgangslage */
.fsd-pain li { position: relative; box-shadow: var(--fsd-shadow); transition: transform .25s ease, box-shadow .25s ease; }
.fsd-pain li:hover { transform: translateX(4px); box-shadow: var(--fsd-shadow-hover); }
.fsd-pain li > span { background: rgba(37,41,40,.12); color: var(--color-accent-dark); }

/* Ergebnisse */
.fsd-res { box-shadow: var(--fsd-shadow); padding: 32px; justify-content: flex-end; min-height: 240px; }
.fsd-res:hover { box-shadow: var(--fsd-shadow-hover); }
.fsd-res-n { font-size: 58px; margin-bottom: 18px; }
.fsd-res--dark { background: radial-gradient(60% 90% at 100% 0%, rgba(37,41,40,.38), transparent 70%), linear-gradient(160deg, #0f2429, #0b0b0b); }
.fsd-res--accent { background: radial-gradient(70% 90% at 0% 100%, rgba(255,255,255,.22), transparent 70%), linear-gradient(160deg, #5A605E, #252928 55%, #161918); }
.fsd-res-n { text-wrap: balance; }

/* Vorher/Nachher */
.fsd-cmp { padding: 38px; box-shadow: var(--fsd-shadow); }
.fsd-cmp--new { background: radial-gradient(70% 70% at 100% 0%, rgba(37,41,40,.32), transparent 70%), linear-gradient(160deg, #0f2429, #0b0b0b); box-shadow: 0 24px 48px rgba(6,36,44,.25); }
.fsd-cmp li { padding-bottom: 14px; border-bottom: 1px solid var(--color-border); }
.fsd-cmp li:last-child { padding-bottom: 0; border-bottom: 0; }
.fsd-cmp--new li { border-color: rgba(255,255,255,.12); }

/* Zitat */
.fsd-quote { position: relative; padding: 60px 56px; border-radius: 32px; background: #fff; box-shadow: var(--fsd-shadow); }
.fsd-quote-sec { background: #fafaf9; padding-top: 120px; }
.fsd-quote blockquote { font-size: 30px; letter-spacing: -.015em; text-wrap: balance; }

/* Nächste Fallstudie / CTA */
.fsd-next-card { box-shadow: var(--fsd-shadow); }

@media (max-width: 900px) {
  .fsd-head h2 { font-size: 28px; }
  .fsd-stats { padding-top: 24px; }
  .fsd-stats-grid { padding: 24px 12px; border-radius: 22px; margin-bottom: -36px; }
  .fsd-stats + .fsd-sec { padding-top: 92px; }
  .fsd-res { min-height: 0; padding: 26px; }
  .fsd-res-n { font-size: 44px; }
  .fsd-cmp { padding: 28px 24px; }
  .fsd-quote { padding: 48px 22px 32px; }
  .fsd-quote-sec { padding-top: 96px; }
  .fsd-quote blockquote { font-size: 21px; }
}
.fsd-res--accent.fsd-res--wide { grid-column: 1 / -1; }
@media (max-width: 900px) { .fsd-res--accent.fsd-res--wide { grid-column: 1 / -1; } }
@media (max-width: 520px) { .fsd-res--accent.fsd-res--wide { grid-column: auto; } }

/* ---------- Lösung als Bento-Raster (angelehnt an "Deine Vorteile") ---------- */

.fsd-t-ico { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; margin-bottom: 16px; border-radius: 12px; background: #f1f0ee; color: var(--color-dark); }

/* ---------- Zitat im Stil der Abschluss-Karten ---------- */
.fsd-quote-sec { padding: 90px 0; background: #fff; }
.fsd-quote { display: grid; grid-template-columns: 1.15fr .85fr; max-width: none; margin: 0; padding: 0; overflow: hidden; border: 0; border-radius: 32px; text-align: left; background: radial-gradient(70% 90% at 0% 0%, rgba(37,41,40,.38), transparent 65%), linear-gradient(160deg, #262a24, #0b0b0b); box-shadow: 0 30px 60px rgba(10,28,32,.22); }
.fsd-quote-txt { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 64px 56px; }
.fsd-q-mark { display: block; margin-bottom: -6px; font-family: Georgia, 'Times New Roman', serif; font-size: 120px; line-height: .8; color: var(--color-accent); }
.fsd-quote blockquote { margin: 0 0 34px; font-size: 34px; line-height: 1.25; letter-spacing: -.02em; font-weight: 500; color: #fff; text-wrap: balance; }
.fsd-quote figcaption { display: flex; align-items: center; gap: 16px; }
.fsd-quote figcaption b { display: block; font-size: 16px; color: #fff; }
.fsd-quote figcaption small { font-size: 14px; color: rgba(255,255,255,.62); }
.fsd-quote-media { position: relative; min-height: 380px; }
.fsd-quote-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fsd-quote-media::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, #131712 0%, rgba(19,23,18,.55) 25%, rgba(19,23,18,0) 60%); }

@media (max-width: 900px) {
  .fsd-quote-sec { padding: 56px 0; }
  .fsd-quote { grid-template-columns: 1fr; }
  .fsd-quote-media { order: -1; min-height: 240px; }
  .fsd-quote-media::before { background: linear-gradient(180deg, rgba(19,23,18,0) 40%, #131712 100%); }
  .fsd-quote-txt { padding: 8px 26px 36px; }
  .fsd-q-mark { font-size: 84px; }
  .fsd-quote blockquote { font-size: 24px; }
}

/* Zitat: Bild blendet per Maske in den Kartenhintergrund aus (kein sichtbarer Übergang) */
.fsd-quote-media::before { display: none; }
.fsd-quote-media img { -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 22%, #000 55%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.55) 22%, #000 55%); }
@media (max-width: 900px) { .fsd-quote-media img { -webkit-mask-image: linear-gradient(180deg, #000 45%, transparent 100%); mask-image: linear-gradient(180deg, #000 45%, transparent 100%); } }
@media (min-width: 901px) {
  .fsd-quote { display: block; position: relative; min-height: 400px; }
  .fsd-quote-txt { position: relative; z-index: 1; max-width: 56%; min-height: 400px; }
  .fsd-quote-media { position: absolute; top: 0; right: 0; bottom: 0; width: 62%; min-height: 0; }
  .fsd-quote-media img { -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.25) 22%, rgba(0,0,0,.7) 45%, #000 75%); mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.25) 22%, rgba(0,0,0,.7) 45%, #000 75%); }
}

/* Vorher bewusst etwas niedriger als Nachher */
.fsd-cmp-grid { align-items: start; }
.fsd-cmp--old { padding-top: 32px; padding-bottom: 32px; }

/* ---------- Animationen der Lösung-Kacheln (Endlosschleifen wie bei Capital Flow, responsiv) ---------- */

/* Projekt-Cockpit: Balken füllen sich nacheinander */


/* Automatische Abläufe: Station leuchtet nacheinander auf, Punkt wandert über die Linien */


/* Kundenportal: Fortschritt läuft durch die Phasen */


/* Dashboards: Kurve zeichnet sich, Fläche und Punkt folgen, füllt die Kachel responsiv */


/* Mitarbeiterportal: Punkte erscheinen nacheinander und werden abgehakt */


/* ---------- Passendere Visuals: Benachrichtigungen (Abläufe) und Mini-Dashboard ---------- */


/* Kacheln: Text oben, Visual füllt den Rest (keine großen Lücken mehr) */

/* Video-Cover, Zusammenarbeit-Karte, Capital-Flow-Logo */
.fsd-cover--video { position: relative; cursor: pointer; }
.fsd-play { position: absolute; left: 24px; bottom: 24px; display: inline-flex; align-items: center; gap: 12px; padding: 8px 20px 8px 8px; border: 0; border-radius: 999px; background: #fff; color: var(--color-dark); font: inherit; font-weight: 600; font-size: 15px; cursor: pointer; box-shadow: 0 10px 30px rgba(0,0,0,.28); transition: transform .2s ease; }
.fsd-cover--video:hover .fsd-play { transform: scale(1.04); }
.fsd-play-ico { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: var(--color-accent); color: #fff; padding-left: 3px; }
.fsd-cover { position: relative; }
.fsd-soon { position: absolute; left: 24px; bottom: 24px; padding: 9px 18px; border-radius: 999px; background: rgba(255,255,255,.94); font-size: 13px; font-weight: 600; color: var(--color-dark); box-shadow: 0 8px 22px rgba(0,0,0,.2); }
@media (max-width: 520px) { .fsd-play { left: 14px; bottom: 14px; padding-right: 16px; font-size: 14px; } .fsd-soon { left: 14px; bottom: 14px; } }
.fsd-quote blockquote.is-long { font-size: 27px; line-height: 1.35; }
@media (max-width: 900px) { .fsd-quote blockquote.is-long { font-size: 20px; } }

/* CTA wie auf den anderen Detailseiten (kb-cta), nahtlos nach der Nächste-Fallstudie-Sektion */

.fsd-next{ background: #fff; }

/* ---------- Aufbau wie die normalen Fallstudien: 1 Problem, 2 Ziel, 3 Lösung, 4 Ergebnis ---------- */
.fsd-step { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 6px; font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--color-muted); }
.fsd-step i { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--color-dark); color: #fff; font-style: normal; font-size: 13px; letter-spacing: 0; }
.fsd-step--problem i { background: #e0574a; }
.fsd-step--goal i, .fsd-step--solution i { background: var(--color-accent); }
.fsd-pain--problem li > span { background: rgba(224,87,74,.1); color: #c4463a; }
.fsd-goal .fsd-split { grid-template-columns: 1.1fr 1fr; }
.fsd-goal .fsd-head { order: 2; }
.fsd-pain--goal { grid-template-columns: 1fr 1fr; }
.fsd-pain--goal li { flex-direction: column; gap: 14px; }
@media (max-width: 900px) { .fsd-goal .fsd-split { grid-template-columns: 1fr; } .fsd-goal .fsd-head { order: 0; } }
@media (max-width: 600px) { .fsd-pain--goal { grid-template-columns: 1fr; } .fsd-pain--goal li { flex-direction: row; } }

/* Lösung: alle umgesetzten Punkte als statische Cards (keine Animation) */
.fsd-feats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.fsd-feat { padding: 26px 24px 28px; border: 1px solid var(--color-border); border-radius: 22px; background: #fff; box-shadow: var(--fsd-shadow); transition: transform .25s ease, box-shadow .25s ease; }
.fsd-feat:hover { transform: translateY(-3px); box-shadow: var(--fsd-shadow-hover); }
.fsd-feat .fsd-t-ico { background: rgba(37,41,40,.12); color: var(--color-accent-dark); }
.fsd-feat h3 { margin: 0 0 8px; font-size: 18px; line-height: 1.3; color: var(--color-dark); }
.fsd-feat p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--color-muted); }
.fsd-feat--dark { border-color: #0b0b0b; background: radial-gradient(circle at 100% 0%, rgba(37,41,40,.34), rgba(37,41,40,0) 55%), linear-gradient(160deg, #262a24, #0b0b0b); }
.fsd-feat--dark h3 { color: #fff; }
.fsd-feat--dark p { color: rgba(255,255,255,.68); }
.fsd-feat--dark .fsd-t-ico { background: var(--color-accent); color: #fff; }
.fsd-feat--accent { background: linear-gradient(160deg, rgba(37,41,40,.16), rgba(37,41,40,.05)); border-color: rgba(37,41,40,.38); }
.fsd-feat--accent .fsd-t-ico { background: #fff; }
@media (max-width: 1100px) { .fsd-feats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) { .fsd-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fsd-feat { padding: 22px 20px; } }
@media (max-width: 520px) { .fsd-feats { grid-template-columns: 1fr; } }

/* ---------- Psychologischer Aufbau: Hero-CTA und Überblick ---------- */
.fsd-hero-cta { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 32px; }
.fsd-hero-cta > span { font-size: 13px; color: var(--color-muted); }

.fsd-glance { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.fsd-gl { display: flex; flex-direction: column; gap: 14px; padding: 28px; border: 1px solid var(--color-border); border-radius: 24px; background: #fff; box-shadow: var(--fsd-shadow); text-decoration: none; transition: transform .25s ease, box-shadow .25s ease; }
.fsd-gl:hover { transform: translateY(-3px); box-shadow: var(--fsd-shadow-hover); }
.fsd-gl .fsd-step { margin: 0; }
.fsd-gl p { margin: 0; font-size: 16px; line-height: 1.6; color: var(--color-dark); }
.fsd-gl--dark { border-color: #0b0b0b; background: radial-gradient(circle at 100% 0%, rgba(37,41,40,.34), rgba(37,41,40,0) 55%), linear-gradient(160deg, #262a24, #0b0b0b); }
.fsd-gl--dark p, .fsd-gl--dark .fsd-step { color: #fff; }
.fsd-gl--dark .fsd-step i { background: var(--color-accent); }
.fsd-glance-sec + .fsd-sec { padding-top: 90px; }

@media (max-width: 900px) {
  .fsd-glance { grid-template-columns: 1fr; }
  .fsd-glance-sec + .fsd-sec { padding-top: 56px; }
}

/* Zitat v2: kein Strich, Anführungszeichen dicht am Text, Schrift skaliert mit Breite und Zitatlänge */
.fsd-quote--v2 { box-shadow: 0 30px 60px rgba(10,28,32,.22), inset 0 0 0 1px rgba(255,255,255,.06); }
.fsd-quote--v2 .fsd-quote-txt { container-type: inline-size; justify-content: center; padding: 64px 56px; }
.fsd-quote--v2 .fsd-q-mark { margin: 0 0 6px -4px; height: .5em; font-size: 104px; line-height: 1; background: linear-gradient(160deg, #AAB0AE, #252928); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.fsd-quote--v2 blockquote { margin: 0 0 28px; font-size: clamp(17px, calc((14px + 3.4cqi) * var(--q-scale, 1)), 36px); line-height: 1.28; text-wrap: pretty; }
.fsd-quote--v2 figcaption { gap: 0; }
.fsd-quote--v2 figcaption b { font-size: 17px; letter-spacing: -.01em; }
.fsd-quote--v2 figcaption small { display: block; margin-top: 3px; font-size: 14px; }
@media (max-width: 900px) {
  .fsd-quote--v2 .fsd-quote-txt { padding: 4px 26px 34px; }
  .fsd-quote--v2 .fsd-q-mark { font-size: 80px; }
  .fsd-quote--v2 blockquote { margin-bottom: 22px; }
}
.fsd-quote-sec:has(.fsd-quote--v2) + .fsd-next { padding-top: 0; }

/* Punkte ohne Unterzeile (nur ein Satz) */
.fsd-pain li > div:has(> p:only-child) { align-self: center; }
.fsd-pain li > div > p:only-child { font-size: 16px; line-height: 1.5; color: var(--color-dark); }
.fsd-res:not(:has(p)) { justify-content: flex-end; }
.fsd-pain--goal > li:last-child:nth-child(odd) { grid-column: 1 / -1; flex-direction: row; align-items: center; }
@media (max-width: 600px) { .fsd-pain--goal > li:last-child:nth-child(odd) { grid-column: auto; } }


/* Hintergründe: feste Reihenfolge, auf allen Fallstudien gleich */
.fsd-page .fsd-hero { background: #fff; border-bottom: 0; }
.fsd-page .fsd-stats, .fsd-page .fsd-glance-sec { background: #fff; }
.fsd-page .fsd-problem, .fsd-page .fsd-solution, .fsd-page .fsd-compare { background: #fafaf9; }
.fsd-page .fsd-goal, .fsd-page .fsd-results, .fsd-page .fsd-quote-sec, .fsd-page .fsd-next { background: #fff; }

/* Nächste Fallstudie: feste Kartenhöhe, unabhängig vom Bild */
.fsd-next-card { height: 320px; }
.fsd-next-media { position: relative; height: 100%; min-height: 0; }
.fsd-next-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fsd-next-body { overflow: hidden; }
@media (max-width: 800px) {
  .fsd-next-card { height: auto; }
  .fsd-next-media { height: 220px; }
}

/* ---------- Capital Flow: bleibt im eigenen Grün (#68b152) ---------- */
.brand-cf .fsd-res--dark { background: linear-gradient(160deg, #1f2a1f, #0b0b0b); }
.brand-cf .fsd-res--accent { background: linear-gradient(160deg, #7cc166, #68b152 55%, #58a043); }
.brand-cf .fsd-stat b { background: linear-gradient(160deg, #7cc166, #4f9a3c); }
.brand-cf .fsd-pain li > span { background: rgba(104,177,82,.12); }
.brand-cf .fsd-res--dark { background: radial-gradient(60% 90% at 100% 0%, rgba(104,177,82,.38), transparent 70%), linear-gradient(160deg, #1d261d, #0b0b0b); }
.brand-cf .fsd-res--accent { background: radial-gradient(70% 90% at 0% 100%, rgba(255,255,255,.22), transparent 70%), linear-gradient(160deg, #7cc166, #68b152 55%, #58a043); }
.brand-cf .fsd-cmp--new { background: radial-gradient(70% 70% at 100% 0%, rgba(104,177,82,.32), transparent 70%), linear-gradient(160deg, #1d261d, #0b0b0b); box-shadow: 0 24px 48px rgba(20,40,16,.25); }
.brand-cf .fsd-quote { background: radial-gradient(70% 90% at 0% 0%, rgba(104,177,82,.38), transparent 65%), linear-gradient(160deg, #262a24, #0b0b0b); box-shadow: 0 30px 60px rgba(20,30,16,.22); }
.brand-cf .fsd-feat .fsd-t-ico { background: rgba(104,177,82,.12); }
.brand-cf .fsd-feat--dark { background: radial-gradient(circle at 100% 0%, rgba(104,177,82,.34), rgba(104,177,82,0) 55%), linear-gradient(160deg, #262a24, #0b0b0b); }
.brand-cf .fsd-feat--accent { background: linear-gradient(160deg, rgba(104,177,82,.16), rgba(104,177,82,.05)); border-color: rgba(104,177,82,.38); }
.brand-cf .fsd-gl--dark { background: radial-gradient(circle at 100% 0%, rgba(104,177,82,.34), rgba(104,177,82,0) 55%), linear-gradient(160deg, #262a24, #0b0b0b); }
.brand-cf .fsd-quote--v2 { box-shadow: 0 30px 60px rgba(20,30,16,.22), inset 0 0 0 1px rgba(255,255,255,.06); }
.brand-cf .fsd-quote--v2 .fsd-q-mark { background: linear-gradient(160deg, #8fd178, #4f9a3c); }