/* ============================================================
   RANDORI-PRO · Fitness-Hub (High End)
   Additiv zu tokens.css + kickboxen.css + kickboxen-v3.css.
   Template C „Lifestyle-Einstieg" + Stimmung 2 „Warm & Kraftvoll"
   (hell-dominant, drei dunkle Anker) — als HUB.

   Diese Datei trägt NUR die hub-spezifischen Ergänzungen:
   · GENAU EIN Signatur-Element: der Ziel-zu-Format-Matcher
     „Finde dein Format" (fh-match).
   · Die Format-Karten (fh-fcard) — Standard-Layout.
   · Die Kickbox-Fitness-Hinweis-Karte (fh-kbf).
   · Das Format-×-Standort-Raster (fh-loc).
   Alle übrigen Sektionen nutzen die bestehenden kb-*/b-*-Klassen.
   Aktiv ausschließlich unter body.bv3.fh.
   ============================================================ */

/* ── Rote Buttons · Schrift konsequent weiß (alle Zustände) ── */
.bv3.fh .b-btn,
.bv3.fh .b-btn:link,
.bv3.fh .b-btn:visited,
.bv3.fh .b-btn:hover,
.bv3.fh .b-btn:focus,
.bv3.fh .b-btn:active,
.bv3.fh .b-nav-cta,
.bv3.fh .b-nav-cta:link,
.bv3.fh .b-nav-cta:visited,
.bv3.fh .b-nav-cta:hover,
.bv3.fh .b-nav-cta:focus,
.bv3.fh .b-header.is-scrolled .b-nav .b-nav-cta,
.bv3.fh .sticky-cta,
.bv3.fh .sticky-cta:link,
.bv3.fh .sticky-cta:visited,
.bv3.fh .sticky-cta:hover,
.bv3.fh .sticky-cta:focus { color: #fff; }
.bv3.fh .kb-hero__bg { object-position: center center; }

/* ============================================================
   3 · UNSERE FITNESS-FORMATE · Intro
   ============================================================ */
.bv3.fh .fh-formats { background: var(--kb-beige); color: var(--kb-ink); padding: clamp(96px, 12vw, 152px) 0; }
.bv3.fh .fh-formats__head { max-width: 880px; margin-bottom: clamp(36px, 4vw, 52px); }
.bv3.fh .fh-formats__h { font-family: var(--font-display); font-weight: 800; font-size: clamp(34px, 4.8vw, 66px); line-height: 1.0; letter-spacing: -0.03em; color: var(--kb-rot-anker); margin: 0 0 22px; max-width: 18ch; text-wrap: balance; }
.bv3.fh .fh-formats__h em { font-family: var(--font-serif); font-style: italic; font-weight: 400; color: var(--kb-rot-akzent); }
.bv3.fh .fh-formats__lede { font-size: 18px; line-height: 1.7; color: var(--kb-ink); margin: 0; max-width: 64ch; }
.bv3.fh .fh-formats__lede strong { color: var(--kb-rot-anker); font-weight: 700; }

/* ============================================================
   SIGNATUR · ZIEL-ZU-FORMAT-MATCHER „FINDE DEIN FORMAT"
   Dunkler Energie-Block im hellen Abschnitt. Links die Ziele
   als wählbare Zeilen, rechts das hervorgehobene Ergebnis, das
   optisch zur passenden Format-Karte führt.
   Ruhezustand (kein JS): erstes Ziel aktiv, Ergebnis sichtbar.
   ============================================================ */
.bv3.fh .fh-match { margin: clamp(8px, 1vw, 16px) 0 clamp(52px, 6vw, 84px); background: var(--kb-dark); color: #fff; border-radius: 28px; padding: clamp(36px, 4.4vw, 64px) clamp(26px, 4.4vw, 64px) clamp(36px, 4.4vw, 56px); position: relative; overflow: hidden; box-shadow: 0 50px 110px -56px rgba(26,20,20,0.6); }
.bv3.fh .fh-match::before { content: ""; position: absolute; inset: 0; pointer-events: none; background:
  radial-gradient(ellipse 56% 90% at 90% -6%, rgba(220,13,29,0.30), transparent 58%),
  radial-gradient(ellipse 62% 80% at 4% 106%, rgba(240,194,77,0.10), transparent 62%); }
.bv3.fh .fh-match__inner { position: relative; z-index: 1; }
.bv3.fh .fh-match__intro { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--kb-rot-akzent); margin: 0 0 14px; display: flex; align-items: center; gap: 14px; }
.bv3.fh .fh-match__intro::before { content: ""; width: 40px; height: 1px; background: var(--kb-rot-akzent); flex-shrink: 0; }
.bv3.fh .fh-match__h { font-family: var(--font-display); font-weight: 800; font-size: clamp(26px, 3.2vw, 46px); line-height: 1.05; letter-spacing: -0.025em; color: #fff; margin: 0 0 14px; max-width: 22ch; text-wrap: balance; }
.bv3.fh .fh-match__h em { font-family: var(--font-serif); font-style: italic; font-weight: 400; color: var(--rp-beige); }
.bv3.fh .fh-match__sub { font-size: 16.5px; line-height: 1.6; color: rgba(255,255,255,0.80); margin: 0 0 clamp(32px, 4vw, 48px); max-width: 60ch; }

.bv3.fh .fh-match__body { display: grid; grid-template-columns: 1fr 0.92fr; gap: clamp(24px, 3vw, 44px); align-items: stretch; }
@media (max-width: 880px){ .bv3.fh .fh-match__body { grid-template-columns: 1fr; gap: 24px; } }

/* Ziel-Liste */
.bv3.fh .fh-match__goals { display: flex; flex-direction: column; gap: 12px; }
.bv3.fh .fh-goal { display: flex; align-items: center; justify-content: space-between; gap: 18px; width: 100%; text-align: left; cursor: pointer; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.13); border-radius: 16px; padding: clamp(18px, 1.8vw, 22px) clamp(20px, 2vw, 26px); transition: border-color 280ms, background 280ms, transform 280ms var(--kb-ease); }
.bv3.fh .fh-goal:hover { border-color: rgba(255,255,255,0.34); background: rgba(255,255,255,0.07); }
.bv3.fh .fh-goal__label { font-family: var(--font-display); font-weight: 700; font-size: clamp(16px, 1.7vw, 20px); line-height: 1.25; letter-spacing: -0.015em; color: rgba(255,255,255,0.85); }
.bv3.fh .fh-goal__dot { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.32); position: relative; transition: border-color 280ms; }
.bv3.fh .fh-goal__dot::after { content: ""; position: absolute; inset: 0; margin: auto; width: 8px; height: 8px; border-radius: 50%; background: var(--kb-rot-akzent); transform: scale(0); transition: transform 280ms var(--kb-ease); }
.bv3.fh .fh-goal[aria-pressed="true"] { border-color: var(--kb-rot-akzent); background: rgba(220,13,29,0.10); }
.bv3.fh .fh-goal[aria-pressed="true"] .fh-goal__label { color: #fff; }
.bv3.fh .fh-goal[aria-pressed="true"] .fh-goal__dot { border-color: var(--kb-rot-akzent); }
.bv3.fh .fh-goal[aria-pressed="true"] .fh-goal__dot::after { transform: scale(1); }

/* Ergebnis-Panel */
.bv3.fh .fh-match__result { display: flex; flex-direction: column; justify-content: center; gap: 0; padding: clamp(28px, 3vw, 40px); background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.14); border-radius: 22px; position: relative; overflow: hidden; }
.bv3.fh .fh-match__result::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse 80% 70% at 100% 0%, rgba(220,13,29,0.20), transparent 60%); }
.bv3.fh .fh-result__num { position: relative; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,0.5); margin: 0 0 6px; }
.bv3.fh .fh-result__tag { position: relative; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--kb-rot-akzent); display: flex; align-items: center; gap: 10px; margin: 0 0 16px; }
.bv3.fh .fh-result__tag::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--kb-rot-akzent); flex-shrink: 0; }
.bv3.fh .fh-result__name { position: relative; font-family: var(--font-display); font-weight: 900; font-size: clamp(28px, 3.4vw, 46px); line-height: 0.98; letter-spacing: -0.03em; color: var(--rp-beige); margin: 0 0 14px; }
.bv3.fh .fh-result__desc { position: relative; font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.84); margin: 0 0 26px; min-height: 3.2em; }
.bv3.fh .fh-result__link { position: relative; align-self: flex-start; display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 700; font-size: 14px; letter-spacing: 0.04em; color: #fff; background: var(--kb-rot-akzent); padding: 14px 24px; border-radius: var(--r-pill); transition: background 200ms, transform 200ms; }
.bv3.fh .fh-result__link:hover { background: #c40b1a; transform: translateY(-2px); }
/* sanfter Wechsel des Ergebnis-Inhalts */
.bv3.fh .fh-result__name, .bv3.fh .fh-result__desc { transition: opacity 240ms var(--ease-standard); }
.bv3.fh .fh-match__result.is-swapping .fh-result__name,
.bv3.fh .fh-match__result.is-swapping .fh-result__desc { opacity: 0; }

/* ============================================================
   FORMAT-KARTEN · Standard-Layout · 2-Spalten
   ============================================================ */
.bv3.fh .fh-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
@media (max-width: 820px){ .bv3.fh .fh-grid { grid-template-columns: 1fr; } }

.bv3.fh .fh-fcard { position: relative; background: #fff; border: 1px solid var(--kb-line); border-radius: 22px; padding: clamp(28px, 3vw, 40px); display: flex; flex-direction: column; scroll-margin-top: 110px; transition: border-color 320ms, transform 520ms var(--kb-ease), box-shadow 520ms; }
.bv3.fh .fh-fcard:hover { border-color: rgba(220,13,29,0.5); transform: translateY(-4px); box-shadow: 0 30px 64px -40px rgba(26,20,20,0.34); }
.bv3.fh .fh-fcard__top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.bv3.fh .fh-fcard__num { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--kb-rot-akzent); }
.bv3.fh .fh-fcard__type { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: #8a7e66; border: 1px solid var(--kb-line); border-radius: 999px; padding: 6px 13px; white-space: nowrap; }
.bv3.fh .fh-fcard__name { font-family: var(--font-display); font-weight: 800; font-size: clamp(24px, 2.6vw, 33px); line-height: 1.08; letter-spacing: -0.02em; color: var(--kb-rot-anker); margin: 0 0 14px; }
.bv3.fh .fh-fcard__p { font-size: 16px; line-height: 1.64; color: var(--kb-body); margin: 0 0 24px; }
.bv3.fh .fh-fcard__p strong { color: var(--kb-rot-anker); font-weight: 700; }
.bv3.fh .fh-fcard__locs { margin-top: auto; padding-top: 22px; border-top: 1px solid var(--kb-line); display: flex; flex-direction: column; gap: 12px; }
.bv3.fh .fh-fcard__locs-l { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: #a89c84; margin: 0; }
.bv3.fh .fh-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.bv3.fh .fh-chip { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.04em; color: var(--kb-rot-anker); background: #faf6ee; border: 1px solid var(--kb-line); border-radius: 999px; padding: 7px 14px; }

/* Match-Hervorhebung (vom Matcher gesetzt) */
.bv3.fh .fh-fcard__badge { position: absolute; top: -11px; left: clamp(28px, 3vw, 40px); display: inline-flex; align-items: center; gap: 7px; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: #fff; background: var(--kb-rot-akzent); padding: 7px 14px; border-radius: 999px; opacity: 0; transform: translateY(6px) scale(0.94); transition: opacity 300ms var(--kb-ease), transform 300ms var(--kb-ease); pointer-events: none; box-shadow: 0 12px 28px -12px rgba(220,13,29,0.6); }
.bv3.fh .fh-fcard.is-matched { border-color: var(--kb-rot-akzent); box-shadow: 0 30px 64px -40px rgba(220,13,29,0.4); }
.bv3.fh .fh-fcard.is-matched .fh-fcard__badge { opacity: 1; transform: translateY(0) scale(1); }

/* ── Kickbox-Fitness-Hinweis · vollbreite Link-Karte ──────── */
.bv3.fh .fh-kbf { margin-top: 20px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: clamp(20px, 3vw, 48px); background: var(--kb-rot-anker); color: #fff; border-radius: 22px; padding: clamp(30px, 3.4vw, 44px) clamp(28px, 3.4vw, 48px); position: relative; overflow: hidden; transition: transform 480ms var(--kb-ease), box-shadow 480ms; }
.bv3.fh .fh-kbf::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse 60% 120% at 96% 0%, rgba(220,13,29,0.34), transparent 58%); }
.bv3.fh .fh-kbf:hover { transform: translateY(-4px); box-shadow: 0 36px 70px -42px rgba(26,20,20,0.5); }
.bv3.fh .fh-kbf__text { position: relative; z-index: 1; }
.bv3.fh .fh-kbf__tag { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--rp-beige); margin: 0 0 12px; }
.bv3.fh .fh-kbf__h { font-family: var(--font-display); font-weight: 800; font-size: clamp(22px, 2.4vw, 32px); line-height: 1.12; letter-spacing: -0.02em; color: #fff; margin: 0 0 10px; }
.bv3.fh .fh-kbf__h em { font-family: var(--font-serif); font-style: italic; font-weight: 400; color: var(--rp-beige); }
.bv3.fh .fh-kbf__p { font-size: 16px; line-height: 1.6; color: rgba(255,255,255,0.86); margin: 0; max-width: 62ch; }
.bv3.fh .fh-kbf__cta { position: relative; z-index: 1; flex-shrink: 0; display: inline-flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 700; font-size: 14px; letter-spacing: 0.04em; color: var(--kb-rot-anker); background: var(--rp-beige); padding: 16px 26px; border-radius: var(--r-pill); white-space: nowrap; transition: background 220ms, transform 220ms; }
.bv3.fh .fh-kbf:hover .fh-kbf__cta { background: #fff; transform: translateX(3px); }
@media (max-width: 720px){ .bv3.fh .fh-kbf { grid-template-columns: 1fr; gap: 22px; } .bv3.fh .fh-kbf__cta { width: 100%; justify-content: center; } }

/* ============================================================
   7 · WO DU TRAINIERST · Format × Standort · 2-Spalten
   ============================================================ */
.bv3.fh .fh-loc { background: var(--kb-beige); color: var(--kb-ink); padding: clamp(96px, 12vw, 152px) 0; }
.bv3.fh .fh-loc__head { max-width: 880px; margin-bottom: clamp(40px, 5vw, 56px); }
.bv3.fh .fh-loc__h { font-family: var(--font-display); font-weight: 800; font-size: clamp(34px, 5vw, 72px); line-height: 0.98; letter-spacing: -0.03em; color: var(--kb-rot-anker); margin: 0 0 24px; max-width: 18ch; text-wrap: balance; }
.bv3.fh .fh-loc__h em { font-family: var(--font-serif); font-style: italic; font-weight: 400; color: var(--kb-rot-akzent); }
.bv3.fh .fh-loc__lede { font-size: 18px; line-height: 1.6; color: var(--kb-ink); margin: 0; max-width: 66ch; }
.bv3.fh .fh-loc__lede strong { color: var(--kb-rot-anker); font-weight: 700; }
.bv3.fh .fh-loc__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
@media (max-width: 820px){ .bv3.fh .fh-loc__grid { grid-template-columns: 1fr; } }

.bv3.fh .fh-scard { background: #fff; border: 1px solid var(--kb-line); border-radius: 22px; padding: clamp(28px, 3vw, 38px); display: flex; flex-direction: column; transition: border-color 320ms, transform 520ms var(--kb-ease), box-shadow 520ms; }
.bv3.fh .fh-scard:hover { border-color: rgba(220,13,29,0.5); transform: translateY(-5px); box-shadow: 0 30px 64px -40px rgba(26,20,20,0.34); }
.bv3.fh .fh-scard--lead { border-color: rgba(220,13,29,0.42); background: linear-gradient(180deg, #fff 0%, #fdf6ec 100%); }
.bv3.fh .fh-scard__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.bv3.fh .fh-scard__name { font-family: var(--font-display); font-weight: 800; font-size: clamp(24px, 2.6vw, 33px); letter-spacing: -0.02em; color: var(--kb-rot-anker); margin: 0 0 6px; }
.bv3.fh .fh-scard__region { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: #8a7e66; margin: 0; }
.bv3.fh .fh-scard__badge { flex-shrink: 0; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: #fff; background: var(--kb-rot-akzent); padding: 7px 13px; border-radius: 999px; }
.bv3.fh .fh-scard__formats { list-style: none; margin: 22px 0 24px; padding: 20px 0 0; border-top: 1px solid var(--kb-line); display: flex; flex-direction: column; gap: 12px; }
.bv3.fh .fh-scard__formats li { display: flex; align-items: baseline; gap: 12px; font-size: 16px; line-height: 1.4; color: var(--kb-ink); }
.bv3.fh .fh-scard__formats li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--kb-rot-akzent); flex-shrink: 0; transform: translateY(-2px); }
.bv3.fh .fh-scard__formats b { font-family: var(--font-display); font-weight: 700; color: var(--kb-rot-anker); }
.bv3.fh .fh-scard__formats span { font-size: 14px; color: var(--kb-body); }
.bv3.fh .fh-scard__link { margin-top: auto; display: inline-flex; align-items: center; gap: 9px; align-self: flex-start; font-family: var(--font-display); font-weight: 700; font-size: 14px; letter-spacing: 0.03em; color: var(--kb-rot-anker); border-bottom: 1px solid transparent; transition: border-color 200ms, gap 220ms; }
.bv3.fh .fh-scard__link:hover { border-color: var(--kb-rot-anker); gap: 13px; }
.bv3.fh .fh-loc__note { margin: clamp(36px, 4vw, 52px) 0 0; padding-top: 26px; border-top: 1px solid var(--kb-line); font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.05em; line-height: 1.75; color: var(--kb-rot-akzent); max-width: 92ch; }

/* ── Stimmen · Hinweiszeile grau ───────────────────────────── */
.bv3.fh .kb-quote__q .s-ph { color: var(--kb-rot-akzent); }

/* ============================================================
   ÜBERARBEITUNG · Hero, Randabstand, Zitatstapel, Standortbilder
   ------------------------------------------------------------
   In css/kickboxen.css stehen dieselben Korrekturen bereits ab
   Z. 405 — dort aber bewusst gescoped als .kb:not(.fh):not(.kbf),
   weil die Datei von DREI Seiten geladen wird. Der Guard bleibt
   unangetastet; die Regeln sind hier unter .bv3.fh gespiegelt,
   damit „Kickboxen Erwachsene" und „Kickbox-Fitness" sich nicht
   verändern.
   ============================================================ */

/* 4 · Seitlicher Randabstand exakt wie „Jiu-Jitsu Budokai Erwachsene".
   Zwei Ursachen:
   a) .kb-hero .b-wrap (kickboxen.css Z. 105) hebt max-width und
      Zentrierung auf — der Hero-Text klebte auf JEDER Breite bei
      40px, während alle übrigen Sektionen ab 1560px mitwandern.
   b) .b-wrap rechnet hier content-box (1480 + 2x40 = 1560 Gesamt-
      breite); JJB lädt site.css mit globalem border-box → 1480.
   width:100% ist nötig, weil .kb-hero ein Flex-Container ist: ohne
   das schrumpft .b-wrap auf Inhaltsbreite und margin:auto würde
   den schmalen Block zentrieren statt den Rand zu setzen.
   Gemessener linker Textabstand nachher = identisch mit JJB:
   1440 → 40 · 1560 → 80 · 1680 → 140 · 1920 → 260 · 2560 → 580. */
.bv3.fh .b-wrap { box-sizing: border-box; }
.bv3.fh .kb-hero .b-wrap { width: 100%; max-width: 1480px; margin-inline: auto; }

/* 3 · Hero kompakter · Abstand oben und unten kleiner.
   Werte identisch zur bereits abgenommenen Schwesterseite
   „Kickboxen Erwachsene". */
.bv3.fh .kb-hero {
  min-height: min(80vh, 720px);
  padding: clamp(118px, 15vh, 165px) 0 clamp(64px, 7vw, 96px);
}
@media (max-width: 940px){
  .bv3.fh .kb-hero { min-height: 70vh; }
}

/* 3b · Hero-Kicker auf Beige statt Akzentrot.
   Akzentrot (#DC0D1D) erreicht auf diesem Foto kein WCAG AA
   (gemessen vorher 3,13:1). Boxen, Krav Maga und Kickboxen lösen
   dieselbe Stelle bereits mit var(--rp-beige). Nur der Hero-Kicker,
   die Kicker der übrigen Sektionen bleiben unverändert. */
.bv3.fh .kb-hero .b-kicker { color: var(--rp-beige); }
.bv3.fh .kb-hero .b-kicker::before { background: var(--rp-beige); }

/* 2 · Micro-Zeile zentriert direkt unter dem Button.
   .kb-hero__micro liegt im Markup innerhalb von .kb-hero__cta;
   der Block schrumpft auf Button-Breite und bleibt als Ganzes
   linksbündig im Hero. */
.bv3.fh .kb-hero__cta {
  display: flex; flex-direction: column; align-items: center;
  gap: 0; width: fit-content;
}
.bv3.fh .kb-hero__micro { text-align: center; }

/* ── 6 · Stimmen · Karten-Stapel ─────────────────────────────
   Portiert aus css/kids-scroll-v3.css (.kv3-stack / .kv3-card)
   über das Muster von css/mma.css — diese Seite bindet KEIN
   kinder-spezifisches Stylesheet ein. Jede Karte klebt mittig im
   Viewport, die nächste schiebt sich darüber, die darunter-
   liegende tritt per JS zurück. Die Textklassen bleiben die
   dieser Seite (kb-quote__q / kb-quote__attr / kb-quote__note).
   box-sizing ist explizit gesetzt, weil die Seite sonst
   content-box rechnet und die Karte um die Innenabstände breiter
   als min(…) wäre. */
.bv3.fh .kb-quote { padding: clamp(100px, 13vw, 160px) 0 0; }
.bv3.fh .kb-quote__mark { display: block; text-align: center; margin-bottom: 4px; }
.bv3.fh .kv3-stack { position: relative; padding-bottom: 9vh; }
.bv3.fh .kv3-stack__wrap { position: sticky; top: 0; height: 100svh; display: flex; align-items: center; justify-content: center; padding: 0 20px; }
.bv3.fh .kv3-card {
  box-sizing: border-box;
  position: relative; width: min(68ch, 94vw); border-radius: 24px;
  padding: clamp(32px, 5vw, 68px); background: var(--rp-white);
  border-top: 4px solid var(--kb-rot-akzent);
  box-shadow: 0 40px 90px -36px rgba(26,20,20,0.45); will-change: transform;
}
.bv3.fh .kv3-card__num { position: absolute; top: 26px; right: 30px; margin: 0; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--rp-grau-muted); }
.bv3.fh .kv3-card--beige { background: var(--rp-beige-deep); }
.bv3.fh .kv3-card--anker { background: var(--kb-rot-anker); border-top-color: var(--rp-beige); }
/* Zitattext in der Karte: ruhiger als das frühere Solo-Zitat */
.bv3.fh .kv3-card .kb-quote__q { font-size: clamp(20px, 2.1vw, 31px); line-height: 1.34; margin: 0 0 30px; text-wrap: pretty; }
.bv3.fh .kv3-card .kb-quote__attr { padding-top: 22px; border-top: 1px solid var(--rp-border-soft); }
.bv3.fh .kv3-card .kb-quote__note { margin: 14px 0 0; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.1em; line-height: 1.7; color: #8a7e66; max-width: 60ch; }
.bv3.fh .kv3-card--anker .kb-quote__q { color: #fff; }
.bv3.fh .kv3-card--anker .kb-quote__attr { color: var(--rp-beige); border-top-color: rgba(255,255,255,0.24); }
.bv3.fh .kv3-card--anker .kb-quote__attr::before { background: var(--rp-beige); }
.bv3.fh .kv3-card--anker .kb-quote__note { color: rgba(255,255,255,0.66); }
.bv3.fh .kv3-card--anker .kv3-card__num { color: rgba(237,228,210,0.72); }
@media (max-width: 940px){
  /* Mobil statisch untereinander, kein Sticky-Stapel */
  .bv3.fh .kv3-stack { padding-bottom: 48px; }
  .bv3.fh .kv3-stack__wrap { position: static; height: auto; padding: 14px 20px; }
  .bv3.fh .kv3-card { padding: 30px 24px 28px; }
  .bv3.fh .kv3-card__num { position: static; display: block; margin: 0 0 16px; }
}
/* Reduzierte Bewegung: keine Sticky-Bühne, alle Karten stehen
   vollständig lesbar untereinander (das JS steigt zusätzlich aus). */
@media (prefers-reduced-motion: reduce){
  .bv3.fh .kv3-stack { padding-bottom: 48px; }
  .bv3.fh .kv3-stack__wrap { position: static; height: auto; padding: 14px 20px; }
}

/* ── 7 · Standortkarten mit Standortfoto ─────────────────────
   Vorlage: css/krav-maga.css Z. 391–395, angepasst an die helle
   Optik der .fh-scard. Das Foto sitzt randlos bis an die Karten-
   kante: das Padding wandert vom Container per negativem Margin
   am Foto wieder heraus, der Text behält seinen Innenabstand. */
.bv3.fh .fh-scard { overflow: hidden; }
.bv3.fh .fh-scard__photo {
  position: relative; display: block; aspect-ratio: 16/10; overflow: hidden;
  flex-shrink: 0; background: #efe8dc;
  margin: calc(-1 * clamp(28px, 3vw, 38px)) calc(-1 * clamp(28px, 3vw, 38px)) clamp(24px, 2.4vw, 30px);
}
.bv3.fh .fh-scard__photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 55%; transition: transform 900ms var(--kb-ease); }
.bv3.fh .fh-scard:hover .fh-scard__photo img { transform: scale(1.06); }
/* Das Badge „Fitness-Zentrum" sitzt im __top-Block unter dem Foto —
   es bleibt damit sichtbar und der Verlauf der Lead-Karte wirkt
   weiterhin unter dem Text. */
.bv3.fh .fh-scard--lead .fh-scard__photo { border-bottom: 1px solid rgba(220,13,29,0.28); }

/* Kettlebell-Karte · das gelieferte Foto ist nur 500 px breit. Statt es
   auf die volle Kartenbreite hochzuziehen (wirkt matschig), steht es
   vollständig und in nahezu Originalgröße mittig; die Seiten füllt eine
   abgedunkelte, weichgezeichnete Fassung desselben Fotos. */
.bv3.fh .fh-fcard__ph.fh-fcard__ph--klein { background: #1a1414; isolation: isolate; }
.bv3.fh .fh-fcard__ph.fh-fcard__ph--klein::before { content: ""; position: absolute; inset: -30px; z-index: 0; background: url("../assets/fotos/kettlebell.webp") 50% 50% / cover no-repeat; filter: blur(16px) brightness(0.5) saturate(1.1); }
.bv3.fh .fh-fcard__ph.fh-fcard__ph--klein img { z-index: 1; object-fit: contain; }

/* Hero · das echte Foto ist im oberen Drittel hell (Gesichter, Fenster).
   Unterhalb 940 px liegt der Kicker darüber — oben eine zusätzliche
   Abdunklung wie auf den Kickbox-Seiten, damit er lesbar bleibt. */
@media (max-width: 940px) {
  .bv3.fh .kb-hero__scrim { background:
    linear-gradient(180deg, rgba(16,10,10,0.74) 0%, rgba(16,10,10,0.48) 24%, rgba(16,10,10,0) 50%),
    linear-gradient(0deg, rgba(16,10,10,0.94) 8%, rgba(16,10,10,0.70) 42%, rgba(16,10,10,0.32) 72%, rgba(16,10,10,0.18) 100%); }
}