/* ============================================================
   buehne-site.css — Seitenweite „BÜHNE"-Schicht (Redesign 2026-11)
   Via site-chrome.js auf JEDER Seite injiziert, NACH broadsheet.css
   und brand.css. Überträgt die Typo-Grammatik der Startseite
   (buehne.css) auf alle Unterseiten:
     · h1 = große, schmale Versalien (Gewicht 800, condensed)
     · Section-Headlines = gleiche Versal-Sprache, eine Stufe kleiner
   Nur Typografie. Keine neuen Farben, keine Inhalte, kein Layout-
   Umbau der Seiten. Fließtext-Überschriften in Artikeln (prose,
   pod-body, wissen-body) bleiben bewusst in Normalschreibung.
   !important nur auf Schnitt/Versalien/Zeilenhöhe: die Seiten-CSS
   (conversion.css, wissen.css, podcast.css …) und broadsheet.css
   setzen diese Werte mit Spezifität ≥ (0,1,1) — zentral statt
   in jeder Seiten-Datei einzeln.
   ============================================================ */

/* =================================================================
   0 · DISPLAY-SCHRIFT: Roboto Condensed 800, selbst gehostet
   (SIL Open Font License, siehe /assets/fonts/roboto-condensed/OFL.txt).
   Nur für Versal-Überschriften, Tabs, Kachel-Titel und Buttons — der
   Fließtext bleibt im System-Stack. Gleiches Bild auf Apple, Android und
   Windows (vorher Helvetica Neue Condensed nur auf Apple, sonst Arial).
   Keine Verbindung zu Google: Dateien liegen auf dem eigenen Server.
   ================================================================= */
@font-face {
  font-family: "Roboto Condensed";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/assets/fonts/roboto-condensed/roboto-condensed-800-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Roboto Condensed";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/assets/fonts/roboto-condensed/roboto-condensed-800-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
:root {
  --bh-display: "Roboto Condensed", "Helvetica Neue", "Arial Narrow", Arial, sans-serif;
}

/* ---- 1 · Seitentitel (h1) überall ---- */
body h1 {
  font-weight: 800 !important;
  font-family: var(--bh-display) !important; font-stretch: normal;
  text-transform: uppercase !important;
  line-height: .95 !important;
  letter-spacing: -.015em !important;
  text-wrap: balance;
}

/* Business-Seiten (keynote, workshop, consulting, buecher, kontakt,
   presse, profil, testimonials, ueber, ueber-den-podcast): Hero-Titel
   auf Bühnen-Größe. Condensed läuft schmaler → breitere Messlatte. */
body .cv-hero h1 {
  font-size: clamp(2.75rem, 7vw, 6rem);
  max-width: 16ch;
}
/* Weitere Seiten-Heros: eine Stufe größer als bisher, gleiche Sprache */
body .md-hero h1,
body .mu-hero h1,
body .wissen-hub-hero-v2 h1,
body .vergleich-hub-hero h1 {
  font-size: clamp(2.5rem, 6.4vw, 5.5rem);
  max-width: 18ch;
}
/* Lange Titel (Blog-Folgen, Wissens-Artikel, Rechtstexte): nur die
   Sprache, Größe bleibt seitenseitig — sonst brechen sie zu oft. */

/* ---- 2 · Section-Headlines (nicht Fließtext) ---- */
body .cv-head h2,
body .section-head h2,
body .smg-section-head h2,
body .md-about-inner h2,
body .md-host-copy h2,
body .md-cta-inner h2,
body .smg-finalblock h2 {
  font-weight: 800 !important;
  font-family: var(--bh-display) !important; font-stretch: normal;
  text-transform: uppercase !important;
  line-height: .95 !important;
  letter-spacing: -.015em !important;
  text-wrap: balance;
}
body .cv-head h2,
body .section-head h2,
body .smg-section-head h2 {
  font-size: clamp(2.125rem, 5.4vw, 4.5rem);
  max-width: 20ch;
}

/* =================================================================
   3 · STRUKTUR-BAUSTEINE (buehne-ui.js) — weniger untereinander,
   Details auf Nachfrage. Farben nur aus --oa-* / --jr-* Tokens;
   currentColor erbt die Flächenfarbe (dunkel oder Papier).
   ================================================================= */

/* ---- Tabs ---- */
.bh-tablist {
  display: flex;
  gap: clamp(1.25rem, 3vw, 2.5rem);
  margin: 0 0 clamp(1.5rem, 3vw, 2.25rem);
  border-bottom: 1px solid color-mix(in srgb, currentColor 18%, transparent);
  overflow-x: auto;
  scrollbar-width: none;
}
.bh-tablist::-webkit-scrollbar { display: none; }
.bh-tabbtn {
  flex: none;
  appearance: none;
  background: none;
  border: 0;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
  padding: .55rem 0 .7rem;
  font: inherit;
  font-size: clamp(1.05rem, 1.6vw, 1.35rem);
  font-weight: 800;
  font-family: var(--bh-display) !important; font-stretch: normal;
  letter-spacing: -.005em;
  text-transform: uppercase;
  color: inherit;
  opacity: .55;
  cursor: pointer;
  transition: opacity .2s ease, border-color .2s ease;
}
.bh-tabbtn:hover { opacity: .85; }
.bh-tabbtn[aria-selected="true"] { opacity: 1; border-bottom-color: var(--oa-accent, #F0692E); }
.bh-tabbtn:focus-visible { outline: 2px solid var(--oa-accent, #F0692E); outline-offset: 4px; }
.bh-tabs.is-enhanced > .bh-tab[hidden] { display: none !important; }
.bh-tab:focus-visible { outline: 2px dashed var(--oa-accent, #F0692E); outline-offset: 6px; }
/* Ohne JS: Panels mit kleinem Label untereinander */
.bh-tabs:not(.is-enhanced) > .bh-tab + .bh-tab { margin-top: clamp(2.5rem, 5vw, 4rem); }
.bh-tabs.is-enhanced > .bh-tab { animation: bh-fade .35s ease; }
@keyframes bh-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ---- Rail ---- */
.bh-rail-wrap { position: relative; min-width: 0; max-width: 100%; }
.bh-rail {
  display: grid !important;
  grid-auto-flow: column;
  grid-auto-columns: var(--bh-rail-col, minmax(15rem, 22rem));
  grid-template-columns: none !important;
  gap: var(--bh-rail-gap, 1.25rem);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  list-style: none;
  margin: 0;
  padding: 0 0 .25rem;
}
.bh-rail::-webkit-scrollbar { display: none; }
.bh-rail > * { scroll-snap-align: start; min-width: 0; }
.bh-rail-nav { display: none; gap: .5rem; justify-content: flex-end; margin-top: 1rem; }
.bh-rail-wrap.is-overflowing .bh-rail-nav { display: flex; }
.bh-rail-btn {
  width: 2.75rem; height: 2.75rem;
  display: inline-grid; place-items: center;
  background: none;
  border: 1px solid color-mix(in srgb, currentColor 40%, transparent);
  color: inherit;
  font-size: 1.1rem;
  cursor: pointer;
  transition: border-color .2s ease, color .2s ease, opacity .2s ease;
}
.bh-rail-btn:hover:not(:disabled) { border-color: var(--oa-accent, #F0692E); color: var(--oa-accent, #F0692E); }
.bh-rail-btn:disabled { opacity: .3; cursor: default; }
.bh-rail-btn:focus-visible { outline: 2px solid var(--oa-accent, #F0692E); outline-offset: 2px; }

/* ---- Mehr (details) ---- */
.bh-more > summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  cursor: pointer;
  font-weight: 700;
  font-size: .9375rem;
  color: inherit;
  border-bottom: 1px solid var(--oa-accent, #F0692E);
  padding-bottom: .1rem;
}
.bh-more > summary::-webkit-details-marker { display: none; }
.bh-more > summary::after { content: "+"; color: var(--oa-accent, #F0692E); font-weight: 800; }
.bh-more[open] > summary::after { content: "–"; }
.bh-more[open] > summary { margin-bottom: 1rem; }
.bh-more > summary:focus-visible { outline: 2px solid var(--oa-accent, #F0692E); outline-offset: 3px; }

/* ---- Akkordeon-Zeile (details als Liste) ---- */
.bh-acc { border-top: 1px solid color-mix(in srgb, currentColor 18%, transparent); }
.bh-acc > details { border-bottom: 1px solid color-mix(in srgb, currentColor 18%, transparent); }
.bh-acc > details > summary {
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 0;
  cursor: pointer;
  font-weight: 800;
  font-family: var(--bh-display) !important; font-stretch: normal;
  text-transform: uppercase;
  font-size: clamp(1.15rem, 2vw, 1.6rem);
  line-height: 1.05;
}
.bh-acc > details > summary::-webkit-details-marker { display: none; }
.bh-acc > details > summary::after { content: "+"; flex: none; color: var(--oa-accent, #F0692E); font-size: 1.5em; line-height: 1; }
.bh-acc > details[open] > summary::after { content: "–"; }
.bh-acc > details > summary:focus-visible { outline: 2px solid var(--oa-accent, #F0692E); outline-offset: 3px; }
.bh-acc > details > :not(summary) { padding-bottom: 1.25rem; }

@media (prefers-reduced-motion: reduce) {
  .bh-tabs.is-enhanced > .bh-tab { animation: none; }
}

/* =================================================================
   4 · VORLAGEN-STRUKTUR (buehne-templates.js)
   ================================================================= */
.bh-tabs.is-enhanced .bh-sr-when-tabbed,
.bh-tabs.is-enhanced > .cv-wall-group > .cv-wall-title {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}

/* A1 Formate als Tabs: ein Panel, volle Breite */
.cv-panels.bh-tabs.is-enhanced { display: block !important; }
.cv-panels.bh-tabs.is-enhanced > .cv-panel { max-width: 62rem; }
.cv-panels.bh-tabs.is-enhanced > .cv-panel .cv-panel-label { display: none; }
.bh-panel-more { margin-top: 1.25rem; }
/* A3 Städte als Tabs */
.cities-grid.bh-tabs.is-enhanced { display: block !important; }
.cities-grid.bh-tabs.is-enhanced > .city-block { max-width: 62ch; }
/* A2 Logo-Gruppen als Tabs */
.cv-wall.bh-tabs.is-enhanced { display: block !important; }

/* A4 FAQ */
.bh-faq-more { margin-top: 1rem; }
.bh-faq-more > summary { margin-top: .5rem; }

/* A5 Zeilenliste kürzen */
.bh-showall {
  margin-top: 1.25rem;
  appearance: none; background: none; border: 0; padding: 0 0 .1rem;
  border-bottom: 1px solid var(--oa-accent, #F0692E);
  font: inherit; font-weight: 700; font-size: .9375rem; color: inherit; cursor: pointer;
}
.bh-showall::after { content: " +"; color: var(--oa-accent, #F0692E); }
.bh-showall[aria-expanded="true"]::after { content: " –"; }
.bh-showall:focus-visible { outline: 2px solid var(--oa-accent, #F0692E); outline-offset: 3px; }

/* A6 Rails für Stimmen und Karten */
.bh-rail--cv-quotes, .bh-rail--md-test-list, .bh-rail--smg-testimonials-grid { --bh-rail-col: minmax(17rem, 26rem); }
.bh-rail--md-events-grid { --bh-rail-col: minmax(15rem, 20rem); }
.bh-rail--bk-grid { --bh-rail-col: minmax(16rem, 20rem); }

/* A7 Prosa */
.bh-prose-more { margin-top: 1rem; }

/* ---- B · Wissens-Artikel: Kapitel-Navigation + Akkordeon ---- */
.wb-toc { font-size: .9375rem; }
.wb-toc-title { margin: 0 0 .6rem; font-weight: 800; font-family: var(--bh-display) !important; font-stretch: normal; text-transform: uppercase; letter-spacing: .02em; }
.wb-toc ol { list-style: none; margin: 0; padding: 0; border-left: 1px solid color-mix(in srgb, currentColor 18%, transparent); }
.wb-toc li a {
  display: block; padding: .35rem 0 .35rem .9rem; margin-left: -1px;
  border-left: 2px solid transparent; color: inherit; opacity: .7; text-decoration: none; line-height: 1.35;
}
.wb-toc li a:hover { opacity: 1; }
.wb-toc li a.is-current { opacity: 1; border-left-color: var(--oa-accent, #F0692E); font-weight: 600; }
.wb-toc-tools { margin: .9rem 0 0; }
.wb-toc-all { appearance: none; background: none; border: 0; padding: 0; font: inherit; font-weight: 700; color: inherit; border-bottom: 1px solid var(--oa-accent, #F0692E); cursor: pointer; }
@media (min-width: 1100px) {
  .wb-layout { display: grid; grid-template-columns: 15rem minmax(0, 1fr); column-gap: clamp(2rem, 4vw, 4rem); align-items: start; }
  .wb-layout > :not(.wb-toc):not(.wissen-body) { grid-column: 1 / -1; }
  .wb-layout > .wb-toc { position: sticky; top: 88px; grid-column: 1; max-height: calc(100vh - 110px); overflow: auto; }
  .wb-layout > .wissen-body { grid-column: 2; }
}
@media (max-width: 1099px) {
  .wb-toc { margin: 0 0 2rem; padding: 1rem 1.1rem; border: 1px solid color-mix(in srgb, currentColor 18%, transparent); }
}
.wb-acc .wb-sec { border-top: 1px solid color-mix(in srgb, currentColor 18%, transparent); }
.wb-acc .wb-sec:last-child { border-bottom: 1px solid color-mix(in srgb, currentColor 18%, transparent); }
.wb-acc .wb-sec > h2 { margin: 0 !important; }
.wb-sec-toggle {
  display: flex; width: 100%; justify-content: space-between; align-items: center; gap: 1rem;
  appearance: none; background: none; border: 0; padding: 1.1rem 0; margin: 0;
  font: inherit; color: inherit; text-align: left; text-transform: inherit; letter-spacing: inherit; line-height: inherit; cursor: pointer;
}
.wb-sec-toggle::after { content: "+"; flex: none; color: var(--oa-accent, #F0692E); font-size: 1.4em; line-height: 1; }
.wb-sec-toggle[aria-expanded="true"]::after { content: "–"; }
.wb-sec-toggle:focus-visible { outline: 2px solid var(--oa-accent, #F0692E); outline-offset: 3px; }
.wb-acc .wb-sec-body { padding-bottom: 1.5rem; }
.wb-sec { scroll-margin-top: 90px; }

/* ---- C · Blog-Folge: Tabs + Storyline-Akkordeon ---- */
.pod-body > .bh-tabs { margin-top: 1rem; }
.pod-h2-tail { display: none; }
.pod-acc > details > summary { list-style: none; }
.pod-acc > details > summary > h3 { margin: 0 !important; font: inherit; text-transform: inherit; letter-spacing: inherit; }

/* ---- Zweite Runde (Meetups, Profil, Sei mein Gast, Mediadaten) ---- */
.bh-rail--agenda { --bh-rail-col: minmax(14rem, 17rem); }
.bh-rail--agenda > .agenda-item { border: 1px solid color-mix(in srgb, currentColor 18%, transparent); padding: 1.1rem 1.2rem; margin: 0 !important; }
.bh-rail--agenda > .agenda-item::before, .bh-rail--agenda > .agenda-item::after { display: none !important; }
.mu-audience .grid.bh-tabs.is-enhanced, .mu-vision .grid.bh-tabs.is-enhanced { display: block !important; }
.mu-audience .grid.bh-tabs.is-enhanced > .card { max-width: 62ch; }
.mu-audience .grid.bh-tabs.is-enhanced > .card > .num { display: none; }
.bh-titles-more { margin-top: 1.5rem; }
.bh-titles-more > summary > .cv-profil-kicker { margin: 0; display: inline; }
.bh-clamp:not(.is-open) { display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.bh-clamp-btn {
  margin-top: .6rem; appearance: none; background: none; border: 0; padding: 0 0 .1rem;
  border-bottom: 1px solid var(--oa-accent, #F0692E); font: inherit; font-weight: 700; font-size: .875rem; color: inherit; cursor: pointer; align-self: flex-start;
}
.bh-clamp-btn:focus-visible { outline: 2px solid var(--oa-accent, #F0692E); outline-offset: 3px; }
.bh-clip:not(.is-open) > :nth-child(n+4):not(.event-skel) { display: none; }

/* ---- Runde 3: Teaser-Prinzip (Inhalte auf Unterseiten) ---- */
.smg-teaser-cta, .md-teaser-cta { margin-top: 1.75rem; }
.cv-more-link { margin-top: 1.25rem; font-weight: 700; }
.cv-more-link a { color: inherit; border-bottom: 1px solid var(--oa-accent, #F0692E); text-decoration: none; }
/* Meetups: Partner-Teaser kompakt, Städte als Kachel-Rail */
.mu-partner-teaser .frame { align-items: center; }
.mu-city-tiles { --bh-rail-col: minmax(11rem, 14rem); --bh-rail-gap: 2px; margin-top: 2rem !important; }
.mu-city-tile {
  position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: .4rem;
  min-height: 9rem; padding: 1rem 1.1rem; text-decoration: none; color: var(--oa-text, #EBE9DC);
  background: var(--oa-bg-2, #2A2622); transition: background-color .2s ease;
}
.mu-city-tile:hover, .mu-city-tile:focus-visible { background: var(--oa-accent-deep, #E76129); color: var(--oa-ink, #1F1B1A); }
.mu-city-name { font-size: clamp(1.4rem, 2.4vw, 1.9rem); font-weight: 800; font-family: var(--bh-display) !important; font-stretch: normal; text-transform: uppercase; line-height: .95; }
.mu-city-tile .badge { align-self: flex-start; }
.mu-city-arr { position: absolute; top: .8rem; right: 1rem; color: var(--oa-accent, #F0692E); }
.mu-city-tile:hover .mu-city-arr { color: inherit; }
.mu-city-hero h1 { max-width: 14ch; }
.mu-city-hero .lede { max-width: 60ch; }
.mu-city-back { margin-top: 1.5rem; font-weight: 700; }
/* Mediadaten: Meetup-Partner-Listen in Slot-Karten */
.md-meetup-host .md-slot-card ul { margin: .75rem 0 0; padding-left: 1.1rem; }
.md-meetup-host .md-slot-card li + li { margin-top: .35rem; }
.md-meetup-host .md-slot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) { .md-meetup-host .md-slot-grid { grid-template-columns: 1fr; } }
/* Testimonials: Sponsoren-Logo + Volltext */
.ts-logo { display: block; height: 1.6rem; width: auto; max-width: 9rem; object-fit: contain; margin: .6rem 0 .2rem; }
.ts-full { margin-top: .9rem; }
.ts-full blockquote { margin: 0; }
.ts-full-src { margin: .5rem 0 0; font-size: .875rem; }
/* Sei mein Gast: Zusatz-Schritte im Ablauf */
.smg-ablauf-extra .smg-section-head { margin-bottom: 1rem; }

/* =================================================================
   5 · BÜHNEN-LOOK FÜR ALLE UNTERSEITEN (Release 2026-11-13b)
   Gestaltungssystem aus dem Style-Audit gegen stevenbartlett.com:
   dunkle Bühne als Grundfläche, Foto-Hero mit riesigem Titel,
   große Sektionsköpfe, Kacheln statt Listen, eine Button-Form.
   Papier bleibt nur für Lesestrecken (Wissens-Artikel, Blog-Folgen).
   Umsetzung über Token-Umlegung: die Seiten-CSS (conversion.css,
   meetups.css, page.css, styles.css) arbeiten mit --jr-* / --oa-ink-*
   / --bg / --fg — in den dunklen Seiten zeigen diese Tokens auf die
   Bühnen-Werte. Keine neuen Farben: nur Werte aus redesign.css.
   ================================================================= */
main.cv-page,
body.sei-mein-gast,
body:has(.mu-hero) {
  --bg: #1F1B1A;
  --fg: #EBE9DC;
  --fg-muted: #B0A99D;
  --surface: #2A2622;
  --hairline: rgba(235, 233, 220, .16);
  --jr-ink: #EBE9DC;
  --jr-ink-soft: #EBE9DC;
  --jr-muted: #B0A99D;
  --jr-paper: #1F1B1A;
  --jr-cream: #1F1B1A;
  --jr-cream-soft: #2A2622;
  --jr-divider: rgba(235, 233, 220, .16);
  --oa-ink-muted: #B0A99D;
  --oa-ink-line: rgba(235, 233, 220, .16);
  --oa-ink-line-soft: rgba(235, 233, 220, .09);
  --oa-burnt: #F0692E;
  --oa-burnt-text: #F0692E;
  background: #1F1B1A;
  color: #EBE9DC;
}
body:has(main.cv-page), body.sei-mein-gast, body:has(.mu-hero) { background: #1F1B1A; }
/* Rhythmus: jede zweite Sektion eine Stufe heller, Sektionen atmen */
main.cv-page > section.cv-section:nth-of-type(even):not(.cv-final),
body.sei-mein-gast .smg-section--soft,
body:has(.mu-hero) main > section:nth-of-type(even) { background: #2A2622; }
main.cv-page > section.cv-section:not(.cv-hero) { padding-block: clamp(4.5rem, 9vw, 8rem); }
main.cv-page .cv-section + .cv-section { padding-top: clamp(4.5rem, 9vw, 8rem); }
/* Formulare bleiben hell und lesbar (weißes Feld, Ink-Text) */
main.cv-page input, main.cv-page textarea, main.cv-page select,
body.sei-mein-gast input, body.sei-mein-gast textarea, body.sei-mein-gast select { color: #1F1B1A; }

/* ---- Hero: Foto-Bühne mit riesigem Titel ---- */
main.cv-page > .cv-hero,
main.mediadaten-page > .md-hero,
body:has(.mu-hero) .mu-hero,
body.sei-mein-gast .smg-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: min(84svh, 54rem);
  background-color: #1F1B1A;
  background-image:
    linear-gradient(to top, #1F1B1A 0%, rgba(31, 27, 26, .86) 26%, rgba(31, 27, 26, .45) 62%, rgba(31, 27, 26, .3) 100%),
    var(--bh-hero-img, url("/assets/hero-header-1280.webp"));
  background-size: cover;
  background-position: 55% 35%;
  color: #EBE9DC;
}
/* Keynote hat ein eigenes Foto im Markup (.cv-hero--photo) — dort kein Hintergrundbild */
main.cv-page > .cv-hero.cv-hero--photo { background-image: none; }
/* Bild je Seite (nur vorhandene Fotos) */
.workshop-page   { --bh-hero-img: url("/assets/keynote/datenstrategie-hero.jpg"); }
.consulting-page { --bh-hero-img: url("/assets/studio-duesseldorf-1600.webp"); }
.contact-page    { --bh-hero-img: url("/assets/studio-duesseldorf-1600.webp"); }
.buch-page       { --bh-hero-img: url("/assets/jonas-portrait-studio.webp"); }
.presse-page     { --bh-hero-img: url("/assets/presse/jonas-rashedi-buehne.webp"); }
.profil-page, .ueber-page { --bh-hero-img: url("/assets/jonas-portrait-studio.webp"); }
.testimonials-page { --bh-hero-img: url("/assets/keynote/ki-im-mittelstand-hero.jpg"); }
.mediadaten-page { --bh-hero-img: url("/assets/hero-header-1280.webp"); }
body.sei-mein-gast { --bh-hero-img: url("/assets/hero-header-1280.webp"); }
body:has(.mu-hero) { --bh-hero-img: url("/assets/presse/jonas-rashedi-buehne.webp"); }
main.cv-page > .cv-hero .cv-hero-inner { padding-top: clamp(7rem, 16vh, 11rem); }
main.cv-page > .cv-hero h1,
main.mediadaten-page > .md-hero h1,
body:has(.mu-hero) .mu-hero h1,
body.sei-mein-gast .smg-hero h1 {
  font-size: clamp(3rem, 8.5vw, 7.5rem) !important;
  line-height: .9 !important;
  max-width: 13ch !important;
  color: #EBE9DC;
}
/* Lange Titel (buehne-templates.js setzt data-long) eine Stufe kleiner */
main.cv-page > .cv-hero h1[data-long],
main.mediadaten-page > .md-hero h1[data-long],
body:has(.mu-hero) .mu-hero h1[data-long],
body.sei-mein-gast .smg-hero h1[data-long] {
  font-size: clamp(2.5rem, 5.6vw, 5rem) !important;
  max-width: 18ch !important;
}
body:has(.mu-hero) .mu-hero h1 .accent { color: #F0692E; }
/* TL;DR + Kennzahlen als ruhige Belegleiste am Hero-Fuß */
main.cv-page > .cv-hero .cv-tldr { max-width: 70ch; }
main.cv-page > .cv-hero .stats-strip .stat .num,
main.cv-page > .cv-hero .cv-stat-num { color: #F0692E; font-family: var(--bh-display) !important; font-stretch: normal; font-weight: 800; }

/* ---- Sektionsköpfe: groß, eine Aussage ---- */
main.cv-page .cv-head h2,
main.mediadaten-page .section-head h2,
main.mediadaten-page .md-about-inner h2,
main.mediadaten-page .md-host-copy h2,
main.mediadaten-page .md-cta-inner h2,
main.cv-page .cv-final h2,
body.sei-mein-gast .smg-section-head h2,
body.sei-mein-gast .smg-finalblock h2,
body:has(.mu-hero) .section-head h2,
body:has(.mu-hero) main h2 {
  font-size: clamp(2.5rem, 6.6vw, 5.75rem) !important;
  line-height: .92 !important;
  max-width: 15ch;
  font-weight: 800 !important;
  font-family: var(--bh-display) !important; font-stretch: normal;
  text-transform: uppercase !important;
  letter-spacing: -.015em !important;
}
main.cv-page .cv-head p, main.mediadaten-page .section-head p { font-size: 1.125rem; max-width: 52ch; color: #B0A99D; }

/* ---- Kacheln statt Karten mit Rundung/Weiß ---- */
.md-event-card, .md-slot-card, .smg-guest-card, .smg-stream-card, .smg-abnahme-card, .smg-testimonial-card,
.ts-card, .cv-quotes > figure, .md-test-item, .bk-card, .city-block, .mu-audience .card, .event-row,
.cv-panel, .up-shot, .up-fig, .cv-wall-tile {
  border-radius: 0 !important;
}
main.cv-page .ts-card, main.cv-page .cv-quotes > figure, main.cv-page .bk-card, main.cv-page .cv-panel,
main.mediadaten-page .md-event-card, main.mediadaten-page .md-slot-card, main.mediadaten-page .md-test-item,
body.sei-mein-gast .smg-guest-card, body.sei-mein-gast .smg-stream-card, body.sei-mein-gast .smg-abnahme-card, body.sei-mein-gast .smg-testimonial-card,
body:has(.mu-hero) .mu-audience .card {
  background: #2A2622 !important;
  border: 1px solid rgba(235, 233, 220, .14) !important;
  box-shadow: none !important;
  color: #EBE9DC;
}
main.cv-page .cv-wall-tile { background: #2A2622; border-color: rgba(235, 233, 220, .14); color: #EBE9DC; }
main.cv-page .cv-wall-tile--ink { background: #E76129; color: #1F1B1A; }
.md-event-card:hover, .smg-guest-card:hover, .smg-stream-card:hover, .bk-card:hover { border-color: #F0692E !important; }
/* Buchcover bleiben auf hellem Grund (Cover sind weiß) */
.bk-cover img { background: #EBE9DC; }

/* ---- Eine Button-Form ---- */
main.cv-page .cv-btn, main.mediadaten-page .btn, body.sei-mein-gast .btn, body:has(.mu-hero) .btn,
.pod-article .btn, .wissen-pillar .btn, .wissen-cluster .btn {
  border-radius: 0 !important;
  font-weight: 800 !important;
  font-family: var(--bh-display) !important; font-stretch: normal;
  text-transform: uppercase;
  letter-spacing: .02em;
}

/* ---- Abschluss: oranges Band (nur ohne Formular — Formulare bleiben dunkel) ---- */
main.cv-page > .cv-final:not(:has(form)):not(:has(iframe)),
main.mediadaten-page > .md-cta-final:not(:has(form)):not(:has(iframe)) {
  background: #E76129 !important;
  color: #1F1B1A !important;
  --oa-text: #1F1B1A; --oa-muted: #1F1B1A; --jr-ink: #1F1B1A; --oa-accent: #1F1B1A;
}
main.cv-page > .cv-final:not(:has(form)):not(:has(iframe)) .cv-btn--solid { background: #1F1B1A; color: #EBE9DC; }

/* ---- Lesevorlagen: dunkler Kopf über die volle Breite, Papier-Body ---- */
.wissen-hero-split, .wissen-hub-hero-v2, .vergleich-hub-hero, .pod-hero-ep, .blog-hero, .page-vergleich .hero {
  background: #1F1B1A;
  color: #EBE9DC;
  --fg: #EBE9DC; --fg-muted: #B0A99D; --jr-ink: #EBE9DC; --jr-muted: #B0A99D;
  --oa-ink-muted: #B0A99D; --jr-divider: rgba(235, 233, 220, .16);
  box-shadow: 0 0 0 100vmax #1F1B1A;
  clip-path: inset(0 -100vmax);
  padding-block: clamp(3rem, 7vw, 6rem);
}
.wissen-hero-split h1, .wissen-hub-hero-v2 h1, .vergleich-hub-hero h1, .pod-hero-ep h1, .pod-hero-meta h1 { color: #EBE9DC; }
.wissen-hero-split-content h1 { font-size: clamp(2.75rem, 6vw, 5rem) !important; }
.wissen-hub-hero-v2 h1, .vergleich-hub-hero h1 { font-size: clamp(3rem, 8vw, 6.5rem) !important; line-height: .9 !important; }
/* Weiße Formular-Rahmen: Tokens zurück auf Papier-Werte (Labels, Hinweise lesbar) */
.cv-form-frame, .smg-form-frame, .hsf-success, .cv-success, .md-form-frame,
main.cv-page [class*="form-frame"], body.sei-mein-gast [class*="form-frame"] {
  --jr-ink: #1F1B1A; --fg: #1F1B1A; --oa-text: #1F1B1A;
  --oa-ink-muted: #5C5450; --jr-muted: #5C5450; --fg-muted: #5C5450;
  --oa-ink-line: rgba(31, 27, 26, .28); --oa-burnt: #C4511D; --oa-burnt-text: #A8431A;
  color: #1F1B1A;
}
/* Kontrast-Korrekturen nach automatischer Prüfung (fest verdrahtete Ink-/Papierwerte) */
main.cv-page .cv-faq summary, main.mediadaten-page .md-faq-item summary,
body:has(.mu-hero) .faq-item summary, body:has(.mu-hero) .mu-agenda-head,
body.sei-mein-gast .faq-item summary { color: #EBE9DC !important; }
body:has(.mu-hero) .faq-item, body:has(.mu-hero) .faq-item[open] { background: transparent !important; border-color: rgba(235, 233, 220, .16) !important; }
body:has(.mu-hero) .mu-partner-teaser .frame .left,
body:has(.mu-hero) .mu-partner-teaser .frame .left * { color: #1F1B1A !important; }
body:has(.mu-hero) .btn-primary, main.cv-page .btn-primary, body.sei-mein-gast .btn-primary { color: #1F1B1A !important; }
main.cv-page .pr-bio-words, main.cv-page .pr-bio-meta { color: #B0A99D !important; }
main.cv-page .pr-bio-copy { color: #EBE9DC !important; border-color: rgba(235, 233, 220, .4) !important; background: transparent !important; }
main.cv-page .pr-bio-copy-text { color: inherit !important; }
main.cv-page .ts-chip { background: transparent !important; color: #EBE9DC !important; border: 1px solid rgba(235, 233, 220, .35) !important; border-radius: 0 !important; }
main.cv-page .ts-chip.active, main.cv-page .ts-chip[aria-selected="true"] { background: #E76129 !important; color: #1F1B1A !important; border-color: #E76129 !important; }
main.cv-page .ts-chip .count { color: inherit !important; opacity: .8; }
.wissen-hero-split .tldr-label, .pod-hero-ep .tldr-label { color: #F0692E !important; background: rgba(240, 105, 46, .12) !important; }
.wissen-hero-split .tldr a, .pod-hero-ep a:not(.btn) { color: #EBE9DC; text-decoration-color: #F0692E; }
body:has(.mu-hero) .faq-item { transition: none !important; }
/* Primär-Buttons überall gleich: Orange-Fläche, Ink-Text */
main.cv-page .btn-primary, main.mediadaten-page .btn-primary, body.sei-mein-gast .btn-primary, body:has(.mu-hero) .btn-primary,
main.mediadaten-page .btn-orange {
  background: #E76129 !important; color: #1F1B1A !important; border-color: #E76129 !important;
}
main.cv-page .btn-primary:hover, main.mediadaten-page .btn-primary:hover, body.sei-mein-gast .btn-primary:hover, body:has(.mu-hero) .btn-primary:hover,
main.mediadaten-page .btn-orange:hover { background: #F0692E !important; }
body.sei-mein-gast .smg-ablauf-item .step-title { color: #EBE9DC; }
main.presse-page figcaption span, main.presse-page .pr-photo-usage, main.presse-page [class*="pr-photo"] span { color: #B0A99D !important; }
main.cv-page > .cv-final:not(:has(form)):not(:has(iframe)) a:not(.cv-btn),
main.mediadaten-page > .md-cta-final:not(:has(form)):not(:has(iframe)) a:not(.btn) {
  color: #1F1B1A !important; text-decoration: underline; text-decoration-color: #1F1B1A; text-underline-offset: 3px;
}
.wissen-hero-split a:not(.btn), .wissen-hub-hero-v2 a:not(.btn), .pod-hero-ep a:not(.btn), .vergleich-hub-hero a:not(.btn) { color: #EBE9DC !important; text-decoration-color: #F0692E; }
/* Hero-Scrim kräftiger: Text links bleibt auf jedem Foto lesbar */
main.cv-page > .cv-hero:not(.cv-hero--photo),
main.mediadaten-page > .md-hero,
body:has(.mu-hero) .mu-hero,
body.sei-mein-gast .smg-hero {
  background-image:
    linear-gradient(90deg, rgba(31, 27, 26, .94) 0%, rgba(31, 27, 26, .78) 42%, rgba(31, 27, 26, .35) 75%, rgba(31, 27, 26, .2) 100%),
    linear-gradient(to top, #1F1B1A 0%, rgba(31, 27, 26, .6) 30%, rgba(31, 27, 26, 0) 70%),
    var(--bh-hero-img, url("/assets/hero-header-1280.webp"));
}
main.cv-page > .cv-hero h1[data-long], main.mediadaten-page > .md-hero h1[data-long],
body:has(.mu-hero) .mu-hero h1[data-long], body.sei-mein-gast .smg-hero h1[data-long] {
  font-size: clamp(2.25rem, 4.6vw, 4.25rem) !important; max-width: 22ch !important; line-height: .95 !important;
}
/* Sei mein Gast: Hero über die volle Breite, CTA sichtbar */
body.sei-mein-gast .smg-hero.container { max-width: none; width: 100%; padding-inline: max(20px, calc((100vw - 1200px) / 2)); }
body.sei-mein-gast .smg-hero-cta { margin-top: 1.5rem; }
.btn-primary-v2 { color: #1F1B1A !important; border-radius: 0 !important; font-weight: 800 !important; text-transform: uppercase; font-family: var(--bh-display) !important; font-stretch: normal; }
.callout.big-take a { color: #F0692E !important; }
/* Business-Hero etwas niedriger: CTA sicher über der Falz */
main.cv-page > .cv-hero, main.mediadaten-page > .md-hero, body:has(.mu-hero) .mu-hero, body.sei-mein-gast .smg-hero { min-height: min(74svh, 46rem); }
main.cv-page > .cv-hero .cv-hero-inner { padding-top: clamp(5.5rem, 12vh, 8rem); }
/* Städteseiten: Lesetext */
body:has(.mu-hero) .mu-city-text .mu-city-p { max-width: 64ch; font-size: 1.125rem; line-height: 1.65; margin: 0 0 1.1rem; color: #EBE9DC; }
body:has(.mu-hero) .mu-city-text .mu-city-p a { color: #F0692E; }
body:has(.mu-hero) .mu-city-text, body:has(.mu-hero) .mu-city-more { padding-block: clamp(3.5rem, 7vw, 6rem); }

/* =================================================================
   6 · RHYTHMUS & MOBIL (v2, aus fünf Abstands-Audits)
   Eine Abstands-Skala für alle Seitenwelten (styles/redesign/conversion/
   meetups/page/wissen/podcast). Breakpoints: 560 · 768 · 1024 · 1280.
   ================================================================= */
:root {
  --bh-space-2: .5rem;                                   /* 8  */
  --bh-space-3: .75rem;                                  /* 12 */
  --bh-space-4: 1rem;                                    /* 16 */
  --bh-space-5: clamp(1.25rem, 1rem + 1vw, 1.5rem);      /* 20→24 */
  --bh-space-6: clamp(1.5rem, 1.1rem + 1.6vw, 2.5rem);   /* 24→40 */
  --bh-space-7: clamp(2.5rem, 1.8rem + 3vw, 4rem);       /* 40→64 */
  --bh-space-8: clamp(4rem, 2.9rem + 4.7vw, 7rem);       /* 64→112 */
  --bh-gutter: clamp(1.25rem, 4vw, 3rem);                /* 20→48 */
}

/* ---- Sektions-Padding: überall gleich, oben = unten ---- */
main.cv-page > section.cv-section:not(.cv-hero),
main.cv-page .cv-section + .cv-section:not(.cv-hero),
main.mediadaten-page > section:not(.md-hero),
body.sei-mein-gast .smg-section,
body:has(.mu-hero) main > section,
body:has(.mu-hero) main > section + section {
  padding-top: var(--bh-space-8) !important;
  padding-bottom: var(--bh-space-8) !important;
}
/* Letztes Element einer Sektion: kein Extra-Rand, nur das Padding zählt */
main section .container > :last-child, main section .cv-shell > :last-child,
main section > :last-child, .mu-city-text .mu-city-p:last-child,
.smg-teaser-cta:last-child, .md-teaser-cta:last-child { margin-bottom: 0 !important; }

/* ---- Seitenrand: eine Formel (vorher mobil 16/20/24/40 px) ---- */
body:has(.mu-hero) .container,
body.sei-mein-gast .container,
body.sei-mein-gast .smg-hero.container,
main.cv-page .cv-shell,
main.mediadaten-page .container {
  padding-left: var(--bh-gutter) !important;
  padding-right: var(--bh-gutter) !important;
}
@media (max-width: 767px) {
  .wissen-pillar.container, .wissen-cluster.container, .wissen-hub.container, .vergleich-hub.container { padding-left: 20px !important; padding-right: 20px !important; }
  .page-podcast .pod-article { padding-left: 20px !important; padding-right: 20px !important; }
}
/* Blog-Folge: Header ist sticky (im Fluss) → kein 104-px-Vorhang darüber */
.page-podcast .pod-article { padding-top: clamp(1.5rem, 4vw, 3rem) !important; }

/* ---- Hero-Rhythmus: Kicker → H1 → Lede → CTA → Kennzahlen ---- */
main.cv-page > .cv-hero .cv-hero-meta, main.mediadaten-page .md-hero .pill, main.mediadaten-page .md-hero [class*="eyebrow"],
body:has(.mu-hero) .mu-hero .mu-hero-meta, body.sei-mein-gast .smg-hero .eyebrow { margin: 0 0 var(--bh-space-3) !important; }
main.cv-page > .cv-hero h1, main.mediadaten-page > .md-hero h1, body:has(.mu-hero) .mu-hero h1, body.sei-mein-gast .smg-hero h1 { margin: 0 !important; }
main.cv-page > .cv-hero .cv-hero-sub, main.mediadaten-page .md-hero h1 + p, body:has(.mu-hero) .mu-hero .lede, body.sei-mein-gast .smg-hero .lede { margin: var(--bh-space-4) 0 0 !important; }
main.cv-page > .cv-hero .cv-tldr { margin-top: var(--bh-space-4) !important; }
main.cv-page > .cv-hero .cv-cta-row, main.mediadaten-page .md-hero [class*="cta"], body:has(.mu-hero) .mu-hero .hero-ctas, body.sei-mein-gast .smg-hero-cta { margin-top: var(--bh-space-6) !important; }
main.cv-page > .cv-hero .stats-strip, main.cv-page > .cv-hero .cv-stats, main.mediadaten-page .md-kpi-bar, body.sei-mein-gast .smg-kpi-bar { margin-top: var(--bh-space-7) !important; }

/* ---- Hero-Titel: lange Titel wachsen auf Tablet mit ---- */
main.cv-page > .cv-hero h1[data-long], main.mediadaten-page > .md-hero h1[data-long],
body:has(.mu-hero) .mu-hero h1[data-long], body.sei-mein-gast .smg-hero h1[data-long] {
  font-size: clamp(2.25rem, 1.2rem + 4.2vw, 4.25rem) !important;
}

/* ---- Sektionskopf: H2 → Einleitung → Inhalt ---- */
main.cv-page .cv-head, main.mediadaten-page .section-head, body.sei-mein-gast .smg-section-head, body:has(.mu-hero) .section-head { margin-bottom: var(--bh-space-6) !important; }
main.cv-page .cv-head p, main.mediadaten-page .section-head p, body.sei-mein-gast .smg-section-head .lede, body:has(.mu-hero) .section-head p { margin-top: var(--bh-space-3) !important; }

/* ---- Kennzahlen-Leisten: Raster statt Flex-Wrap (keine verwaiste letzte Zahl) ---- */
main.cv-page > .cv-hero .stats-strip, main.cv-page .cv-stats, main.mediadaten-page .md-kpi-bar, body.sei-mein-gast .smg-kpi-bar {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: var(--bh-space-5) var(--bh-space-5) !important;
}
@media (min-width: 768px) {
  main.cv-page > .cv-hero .stats-strip, main.cv-page .cv-stats, main.mediadaten-page .md-kpi-bar, body.sei-mein-gast .smg-kpi-bar { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  main.cv-page .cv-stats:has(> :nth-child(4):last-child), main.mediadaten-page .md-kpi-bar:has(> :nth-child(4):last-child), body.sei-mein-gast .smg-kpi-bar:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
@media (min-width: 1100px) {
  main.cv-page > .cv-hero .stats-strip:has(> :nth-child(6)) { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; }
  main.cv-page > .cv-hero .stats-strip:has(> :nth-child(5):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}

/* ---- Karten: Innenabstand und Abstände (Text klebte am Rahmen) ---- */
main.cv-page .cv-panel, main.cv-page .cv-quotes > figure, main.cv-page .ts-card,
main.mediadaten-page .md-event-card, main.mediadaten-page .md-slot-card, main.mediadaten-page .md-test-item,
body:has(.mu-hero) .mu-audience .card, body.sei-mein-gast .smg-abnahme-card, body.sei-mein-gast .smg-testimonial-card, body.sei-mein-gast .smg-stream-card {
  padding: var(--bh-space-5) var(--bh-space-5) var(--bh-space-6) !important;
}
main.cv-page .cv-panel h3, main.mediadaten-page .md-event-card h3, main.mediadaten-page .md-slot-card h3, body.sei-mein-gast .smg-abnahme-card h3 { margin: var(--bh-space-2) 0 var(--bh-space-3) !important; }
main.cv-page .cv-row h3 + p, main.cv-page .bk-sub, main.cv-page .cv-panel-lede { margin-top: var(--bh-space-2) !important; }

/* ---- Einzelfehler aus dem Audit ---- */
/* Keynote „Was im Gepäck ist": Trenner fehlten (Selektor traf nie) */
.cv-topics { gap: var(--bh-space-3) 0 !important; }
.cv-topics li { display: inline-flex; align-items: center; }
.cv-topics li:not(:last-child)::after { content: "·"; color: var(--oa-burnt); margin-inline: .7rem; font-weight: 700; }
.cv-topics span::after { content: none !important; }
/* Logo-Wand: Gruppentitel klebte an den Kacheln */
main.cv-page .cv-wall-title { margin-bottom: var(--bh-space-3) !important; }
/* Bücher-Rail: Cover und Beschreibung bleiben in EINER Spalte zusammen */
/* Bücher: Karte = <article> (vorher verschachtelte Links, die der Browser
   in Fragmente zerlegt hat). Cover bündig oben, Text mit Innenabstand,
   alles linksbündig, Links am Kartenfuß auf einer Linie. */
.bh-rail--bk-grid { align-items: stretch !important; }
main.cv-page .bk-card { padding: 0 !important; display: flex; flex-direction: column; overflow: hidden; text-align: left; }
main.cv-page .bk-card .bk-cover { display: grid; border-bottom: 1px solid rgba(235, 233, 220, .14); text-decoration: none; }
main.cv-page .bk-card:hover .bk-cover { transform: none; box-shadow: none; }
main.cv-page .bk-meta { padding: var(--bh-space-3, 1.25rem) clamp(1rem, 1.6vw, 1.375rem) clamp(1.25rem, 2vw, 1.5rem) !important; text-align: left !important; flex-grow: 1; }
main.cv-page .bk-meta > * { text-align: left !important; }
main.cv-page .bk-card h3 a { color: inherit; text-decoration: none; display: inline !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; }
main.cv-page .bk-card h3 a:focus-visible { outline: 2px solid #F0692E; outline-offset: 3px; }
main.cv-page .bk-card h3 { -webkit-hyphens: manual !important; hyphens: manual !important; }
main.cv-page .bk-card h3 { display: block !important; }
main.cv-page .bk-card h3 .reihe { display: inline; margin-left: .3em; font-family: inherit; white-space: nowrap; }
main.cv-page .bk-card .bk-cover, main.cv-page .bk-card .bk-cover img { background: #0E1A3A; }
main.cv-page .bk-card .bk-cover img { object-fit: cover; }
/* Sei mein Gast: Studio-Fakten mobil einspaltig */
@media (max-width: 480px) { body.sei-mein-gast .smg-studio-facts li { grid-template-columns: 1fr !important; gap: 4px !important; } }
/* Sei mein Gast: Formular mobil nicht mehr dreifach eingerückt (Felder waren 164 px) */
@media (max-width: 600px) {
  body.sei-mein-gast .smg-finalblock { padding: var(--bh-space-6) var(--bh-space-4) !important; }
  body.sei-mein-gast .smg-form-frame { padding: 0 !important; }
  body.sei-mein-gast .smg-form-frame .hsf-form { padding: 20px 16px !important; }
}
body.sei-mein-gast .smg-ablauf-item .step-title { line-height: 1.35; }
/* Formulare: Feldabstände gleichmäßig (Zeilen-Gap + Margin addierten sich) */
.hsf-row { row-gap: 0 !important; }
/* Wissens-Kapitelsprung: html scroll-padding (88 px) reicht, kein zweiter Abzug */
.wb-sec { scroll-margin-top: 0 !important; }

/* ---- Meetups-Hero auf Tablet zweispaltig statt 1,3 Bildschirme hoch ---- */
@media (min-width: 768px) and (max-width: 960px) {
  body:has(.mu-hero) .mu-hero .hero-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr) !important; gap: var(--bh-space-6) !important; }
}

/* ---- Tipp-Flächen ≥ 44 px ---- */
.bh-more > summary, .bh-showall, .bh-clamp-btn, main .more-link, main .oa-textlink, .jr-kcta-link, .wb-toc-all {
  min-height: 44px; display: inline-flex; align-items: center;
}
.wb-toc li a { padding-top: 9px !important; padding-bottom: 9px !important; }
body .jr-header .jr-cta { min-height: 44px; display: inline-flex; align-items: center; }
body .jr-header .jr-brand { min-height: 44px; display: inline-flex; align-items: center; }
body footer.jr-footer .jr-fcol a { display: inline-block; padding: 10px 0; }
body footer.jr-footer .jr-flegal a { display: inline-block; padding: 12px 4px; }

/* ---- Tabs mobil: bis an den Bildschirmrand, Scroll-Hinweis per Verlauf ---- */
.bh-tablist { margin-bottom: var(--bh-space-6) !important; }
.bh-tabs.is-enhanced > .bh-tab > :first-child { margin-top: 0 !important; }
@media (max-width: 767px) {
  .bh-tablist {
    gap: var(--bh-space-5) !important;
    margin-left: calc(-1 * var(--bh-gutter)); margin-right: calc(-1 * var(--bh-gutter));
    padding-left: var(--bh-gutter); padding-right: var(--bh-gutter);
    scroll-padding-inline: var(--bh-gutter);
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 82%, transparent 100%);
            mask-image: linear-gradient(90deg, #000 0, #000 82%, transparent 100%);
  }
  .bh-tabbtn { font-size: 1rem !important; min-height: 44px; }
}

/* ---- Rails: Anschnitt am Bildschirmrand, nächste Karte deutlich sichtbar ---- */
@media (max-width: 767px) {
  .bh-rail-wrap { margin-left: calc(-1 * var(--bh-gutter)); margin-right: calc(-1 * var(--bh-gutter)); max-width: none; }
  .bh-rail { padding-left: var(--bh-gutter) !important; padding-right: var(--bh-gutter) !important; scroll-padding-inline: var(--bh-gutter); }
  .bh-rail-nav { padding-right: var(--bh-gutter); }
  .oa-reviews-list.bh-rail, .bh-rail--cv-quotes, .bh-rail--md-test-list, .bh-rail--smg-testimonials-grid { --bh-rail-col: 84%; }
  .bh-rail--md-events-grid, .bh-rail--agenda { --bh-rail-col: 78%; }
  .bh-ventures-grid.bh-rail { --bh-rail-col: 70%; }
  .hp-proof-row.bh-rail { --bh-rail-col: 62%; }
  .bh-rail--bk-grid { --bh-rail-col: 72%; }
  .bh-host-books .oa-books-row.bh-rail { --bh-rail-col: 38%; }
  .mu-city-tiles.bh-rail { --bh-rail-col: 42%; }
}
@media (min-width: 768px) {
  .bh-host-books .oa-books-row.bh-rail { --bh-rail-col: calc((100% - 5 * 1.25rem) / 5.4); }
  .mu-city-tiles.bh-rail { --bh-rail-col: calc((100% - 4 * 2px) / 4.4); }
}
/* Aufklapper mit 44-px-Tipp-Fläche: Unterstreichung am Text statt an der Box-Unterkante */
.bh-more > summary, .bh-showall, .wb-toc-all {
  border-bottom: 0 !important; padding-bottom: 0 !important;
  text-decoration: underline; text-decoration-color: var(--oa-accent, #F0692E);
  text-decoration-thickness: 1px; text-underline-offset: 5px;
}
.bh-more[open] > summary { margin-bottom: var(--bh-space-2) !important; }
.oa-work-more { margin-top: 0 !important; }

/* ---- Typografie mobil (Typo-Audit) ---- */
/* Sicherung gegen Überlauf langer Komposita (v. a. ohne Condensed-Schrift,
   Android/Windows): trennen mit Bindestrich statt Seite zu verbreitern */
h1, h2, h3, .bh-tabbtn, .mu-city-name, .bh-tile-label {
  -webkit-hyphens: auto; hyphens: auto;
  -webkit-hyphenate-limit-before: 4; -webkit-hyphenate-limit-after: 4;
  hyphenate-limit-chars: 10 4 4;
  overflow-wrap: break-word;
}
/* Tabs mobil: umbrechen statt hart abschneiden (Beschriftungen bleiben ganz) */
@media (max-width: 599px) {
  .bh-tablist {
    flex-wrap: wrap; overflow: visible !important;
    gap: .25rem 1.25rem !important;
    margin-left: 0 !important; margin-right: 0 !important;
    padding-left: 0 !important; padding-right: 0 !important;
    -webkit-mask-image: none !important; mask-image: none !important;
    border-bottom: 0 !important;
  }
  .bh-tabbtn { border-bottom-width: 3px; padding-bottom: .45rem !important; }
}
/* Überschriften mobil: kleinere Untergrenzen, weniger Zeilen */
@media (max-width: 480px) {
  main.cv-page .cv-head h2, main.mediadaten-page .section-head h2, main.mediadaten-page .md-about-inner h2,
  main.mediadaten-page .md-host-copy h2, main.mediadaten-page .md-cta-inner h2, main.cv-page .cv-final h2,
  body.sei-mein-gast .smg-section-head h2, body.sei-mein-gast .smg-finalblock h2,
  body:has(.mu-hero) .section-head h2, body:has(.mu-hero) main h2 {
    font-size: clamp(2rem, 9vw, 2.5rem) !important;
  }
  main.cv-page > .cv-hero h1:not([data-long]), body:has(.mu-hero) .mu-hero h1:not([data-long]), body.sei-mein-gast .smg-hero h1:not([data-long]) {
    font-size: clamp(2.5rem, 12vw, 3rem) !important;
  }
  main.cv-page > .cv-hero h1[data-long], main.mediadaten-page > .md-hero h1[data-long],
  body:has(.mu-hero) .mu-hero h1[data-long], body.sei-mein-gast .smg-hero h1[data-long] {
    font-size: clamp(1.875rem, 8.6vw, 2.25rem) !important;
  }
  .pod-hero-meta h1, #ep-h1 { font-size: clamp(1.625rem, 7vw, 2rem) !important; }
}
/* Versal-Headline → Text: etwas mehr Luft; Kachel-h3 → Text */
main.cv-page .cv-head h2, main.mediadaten-page .section-head h2, body.sei-mein-gast .smg-section-head h2, body:has(.mu-hero) .section-head h2 { margin-bottom: 0 !important; }
main.cv-page .cv-row h3, main.cv-page .bk-card h3, main.mediadaten-page .md-slot-card h3 { margin-bottom: .4em !important; }
main a.cv-btn, main a.btn, main .hsf-btn { text-wrap: balance; }
/* Restliche Tipp-Flächen unter 44 px (Nachmessung) */
main.cv-page .bk-meta a, main.mediadaten-page .md-host-links a, main.cv-page a.context,
main.cv-page .ts-chip { min-height: 44px; display: inline-flex; align-items: center; }
.wb-toc li a { padding-top: 12px !important; padding-bottom: 12px !important; }
/* Roboto Condensed läuft ~2,5 % breiter als Helvetica Neue Condensed:
   lange Hero-Titel mobil eine Spur kleiner, damit lange Wörter
   („ENTSCHEIDER:INNEN") nicht bis an den Rand laufen */
@media (max-width: 480px) {
  main.cv-page > .cv-hero h1[data-long], main.mediadaten-page > .md-hero h1[data-long],
  body:has(.mu-hero) .mu-hero h1[data-long], body.sei-mein-gast .smg-hero h1[data-long] {
    font-size: clamp(1.75rem, 7.6vw, 2.125rem) !important;
  }
}

/* ---- Fix 2026-11-14: Karten & Akkordeons ---- */
/* Wissens-Akkordeon: zugeklappte Kapitel waren je ~290 px hoch, weil das
   allgemeine Sektions-Padding (96 px) auch jedes Kapitel traf. */
.wb-acc .wb-sec { padding: 0 !important; margin: 0 !important; }
.wb-acc .wb-sec-toggle { padding-block: clamp(1rem, 1.6vw, 1.35rem) !important; }
.wb-acc .wb-sec-body[hidden] { padding: 0 !important; }
.wb-acc .wb-sec-body:not([hidden]) { padding-bottom: var(--bh-space-5, 2rem) !important; }
/* Pillar-Kacheln: Cover-Grafiken sind quadratisch mit Schriftzug unten,
   die Kachel zeigt 16:10 → Ausschnitt nach unten legen statt mittig. */
.pillar-card-v2-cover img { object-position: 50% 100%; }

/* ---- SEO-Vertiefung am Seitenende: Tabs mit Fließtext ----
   Markup:
   <section class="cv-section bh-seo" id="mehr-zum-thema"><div class="cv-shell">
     <div class="cv-head"><h2 class="cv-h2">…</h2></div>
     <div class="bh-tabs" data-bh-tabs>
       <section class="bh-tab" data-bh-label="Kurz-Label" id="…"><h3>…</h3><p>…</p></section>
     </div></div></section>
   Alle Panels bleiben im DOM (SEO-lesbar), sichtbar ist eins. */
.bh-seo .bh-tab { max-width: 68ch; }
.bh-seo .bh-tab h3 { font-size: clamp(1.125rem, 1rem + .5vw, 1.375rem) !important; line-height: 1.25 !important; margin: 0 0 .75rem !important; font-family: inherit !important; text-transform: none !important; letter-spacing: -.01em !important; }
.bh-seo .bh-tab p { font-size: 1rem; line-height: 1.65; margin: 0 0 1em; }
.bh-seo .bh-tab p:last-child { margin-bottom: 0; }
.bh-seo .bh-tab ul { margin: 0 0 1em; padding-left: 1.1em; line-height: 1.6; }
.bh-seo .bh-tab a { color: inherit; text-decoration: underline; text-decoration-color: #F0692E; text-underline-offset: 3px; }

/* ---- Geräte-Check 2026-11-14 ---- */
/* Versteckte Buttons (hidden) wurden von display-Regeln wieder eingeblendet
   (leerer 9-px-Button auf den Städteseiten). */
button[hidden], .bh-showall[hidden] { display: none !important; }

/* Kennzahlen-Leiste: Zahlen auf einer Linie, auch bei zweizeiligem Label */
main.cv-page > .cv-hero .stats-strip, main.cv-page .cv-stats, main.mediadaten-page .md-kpi-bar, body.sei-mein-gast .smg-kpi-bar { align-items: start !important; }

/* Startseite: „On Air · Folge · neu jeden Freitag“ bricht wortweise statt in Spalten */
.oa-onair--foot { display: flex !important; flex-wrap: wrap; white-space: nowrap; row-gap: .3rem; }

/* Wissen-Pillar auf dem Handy: Cover als kleines Signet, Überschrift im ersten Screen */
@media (max-width: 600px) {
  .wissen-hero-split-cover { max-width: 7.5rem !important; }
}

/* Lesbarkeit: nichts unter 12 px */
.up-shot .src { font-size: .75rem !important; }
.page-vergleich th, .page-vergleich .q-src, .tldr-label, .ep-badge, .stats-source, .episode .top-meta, .episode .footer .tag { font-size: .75rem !important; }

/* Tippflächen auf Touch-Geräten ≥ 44 px */
@media (pointer: coarse) {
  .pr-photo-dl, .back-btn, a.back, .guest-linkedin, .cv-link, .smg-testimonial-card__folge,
  .cv-topics a, .mu-breadcrumb a, .events-fallback-note a {
    display: inline-flex; align-items: center; min-height: 44px;
  }
  .page-vergleich .q-play { min-width: 44px; min-height: 44px; }
  .quick-chip, .page-vergleich select { min-height: 44px; }
}

/* Handy quer (niedriger Viewport): Hero-Typo an der Höhe ausrichten,
   damit Kernaussage und Buttons im ersten Screen stehen */
@media (orientation: landscape) and (max-height: 500px) {
  .bh-hero-name { font-size: clamp(3rem, 17vh, 5.5rem) !important; padding-top: .5rem !important; }
  html body .oa-hero h1, html body main.cv-page > .cv-hero h1, html body main.cv-page > .cv-hero h1[data-long],
  html body:has(.mu-hero) .mu-hero h1, html body:has(.mu-hero) .mu-hero h1[data-long],
  html body.sei-mein-gast .smg-hero h1, html body.sei-mein-gast .smg-hero h1[data-long],
  html body main.mediadaten-page > .md-hero h1, html body main.mediadaten-page > .md-hero h1[data-long],
  html body .wissen-hero-split h1, html body .wissen-hub-hero-v2 h1, html body .vergleich-hub-hero h1, html body .pod-hero-ep h1 {
    font-size: clamp(1.6rem, 9vh, 2.5rem) !important; line-height: 1 !important;
  }
  main.cv-page > .cv-hero, .mu-hero, .smg-hero, .md-hero, .wissen-hero-split, .wissen-hub-hero-v2 { padding-top: 1.5rem !important; }
  .wissen-hero-split-cover { max-width: 8rem !important; }
}

/* ---- Geräte-Check 2026-11-14, Runde 2 (Sichtprüfung Fold 344 / iPad 768) ---- */
/* Testimonials: Apple-Hörerstimmen als Rail brauchen eine echte Spaltenbreite */
.ts-apple-grid.bh-rail { --bh-rail-col: minmax(16rem, 20rem); align-items: start; grid-template-columns: none !important; }
@media (max-width: 767px) { .ts-apple-grid.bh-rail { --bh-rail-col: 84%; } }

/* CDP-Vergleich: Zitat-Raster passt sich schmalen Containern an (war min. 260 px) */
.page-vergleich .q-grid { grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr)) !important; }
/* CDP-Vergleich Hero: helle Sekundärtexte auf dunklem Grund (vorher #5C5450 auf #1F1B1A) */
.page-vergleich .hero .lead, .page-vergleich .hero .lbl, .page-vergleich .hero .crumbs a, .page-vergleich .hero nav a { color: #B0A99D !important; }
.page-vergleich .featured-cta { color: #1F1B1A !important; }

/* Sei mein Gast: Autorzeile der Gaststimmen ohne gestreckten dunklen Kasten */
.smg-testimonial-card__author { background: transparent !important; flex: 0 0 auto !important; margin-top: auto; }

/* Gäste-Logos auf dunklem Grund sichtbar machen (Deutsche Post hat eigenes Feld) */
.sei-mein-gast .smg-logo-wall img:not([src*="deutsche-post"]):not([src*="1und1"]):not([src*="tchibo"]), .smg-moved .smg-logo-wall img:not([src*="deutsche-post"]):not([src*="1und1"]):not([src*="tchibo"]) {
  filter: brightness(0) invert(.92); opacity: .8;
}

/* Blog: Tastatur-Hinweis „/“ nur mit echter Tastatur und genug Breite */
@media (max-width: 1100px), (pointer: coarse) { .kbd-hint { display: none !important; } }

/* Wissens-Artikel ohne Akkordeon: globales section-Padding (96 px) traf die
   Kapitel; jetzt normaler Absatzrhythmus, H2 mit Luft zum Text */
.wissen-body.wb-structured:not(.wb-acc) > .wb-sec { padding: 0 !important; margin: var(--bh-space-6, 2.5rem) 0 0 !important; }
.wissen-body.wb-structured:not(.wb-acc) > .wb-sec > h2 { margin-bottom: .6em !important; }

/* Silbentrennung in Überschriften nur auf schmalen Handys nötig */
@media (min-width: 600px) {
  h1, h2, h3, .bh-tabbtn, .mu-city-name, .bh-tile-label { -webkit-hyphens: manual !important; hyphens: manual !important; }
}
/* Blog: Folgen-Badge unten links statt über dem ins Cover gedruckten Titel */
.feat-card .ep, .episode .cover .ep-badge { top: auto !important; bottom: 8px !important; }
/* Blog: Meta-Zeile der Featured-Karten bricht als Ganzes um statt Wort für Wort */
.feat-card .meta { flex-wrap: wrap !important; row-gap: .2rem; }
.feat-card .meta > span, .episode .top-meta > span { white-space: nowrap; }
.ts-apple-grid.bh-rail > .ts-apple-card { width: auto !important; max-width: none !important; justify-self: stretch !important; margin: 0 !important; }
/* Gäste-Logo-Wand: Abstand zum Hinweistext */
.smg-logo-wall { margin-bottom: var(--bh-space-4, 1.5rem) !important; }
/* Tab-Leisten: lieber umbrechen als Tabs rechts verstecken (Blogartikel iPad) */
.bh-tablist { flex-wrap: wrap !important; overflow-x: visible !important; }

/* ---- Design vereinheitlicht 2026-11-14 ---- */
/* 6a · Alle Buttons eckig, Bühnen-Typo (Referenz: .cv-btn auf /keynote) */
.hsf-btn, .jr-kcta-btn, .kn-btn, .pr-bio-copy, .featured-cta,
:is(div, p, aside):has(> .btn-primary-v2) > .btn-ghost {
  border-radius: 0 !important;
  font-family: var(--bh-display) !important; font-stretch: normal;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.hsf-btn, .jr-kcta-btn, .kn-btn { font-size: 1rem !important; line-height: 1.2; }
.jr-kcta-btn { white-space: nowrap; }
/* Wissen-Hub & Co.: Ghost-Button neben dem Primär-Button gleich groß */
:is(div, p, aside):has(> .btn-primary-v2) > .btn-ghost { font-size: 17px; padding: .9rem 1.5rem; line-height: 1.2; display: inline-flex; align-items: center; }
/* Chips, Filter, Abspiel-Knöpfe: keine Pillen/Kreise mehr */
.pr-stages li, .pr-beirat-topics li, .quick-chip, .facet-btn, .q-play,
main :is(button, input[type="submit"], a[class*="btn"], [class*="chip"]):not(.wb-sec-toggle) { border-radius: 0 !important; }

/* 7a · Ein FAQ-Stil (Referenz: .cv-faq auf /keynote) für Meetups- und Hub-FAQs */
.mu-faq .list, .hub-faq-list { border-top: 1px solid color-mix(in srgb, currentColor 28%, transparent) !important; }
.mu-faq .faq-item, .hub-faq-list .faq-item {
  border: 0 !important; border-bottom: 1px solid color-mix(in srgb, currentColor 16%, transparent) !important;
  background: transparent !important; box-shadow: none !important; border-radius: 0 !important;
}
.mu-faq .faq-item summary, .hub-faq-list .faq-item summary {
  display: flex !important; align-items: baseline !important; justify-content: space-between; gap: 1.5rem;
  padding: 1.1rem 0 !important; margin: 0 !important;
  font-family: inherit !important; font-size: clamp(1.0625rem, 1.7vw, 1.25rem) !important;
  font-weight: 600 !important; letter-spacing: -.015em !important; line-height: 1.3 !important;
  text-transform: none !important; color: inherit !important;
}
.mu-faq .faq-item summary:hover, .hub-faq-list .faq-item summary:hover {
  text-decoration: underline; text-decoration-color: #F0692E; text-decoration-thickness: 2px; text-underline-offset: 5px;
}
.mu-faq .faq-item .plus, .hub-faq-list .faq-item .plus,
.mu-faq .faq-item[open] .plus, .hub-faq-list .faq-item[open] .plus {
  display: inline !important; width: auto !important; height: auto !important;
  border: 0 !important; background: none !important; box-shadow: none !important;
  font-size: inherit !important; font-weight: 500 !important; line-height: 1 !important;
  color: #C4511D !important; flex: none; transition: transform .25s ease;
}
.mu-faq .faq-item .plus { color: #F0692E !important; }
.mu-faq .faq-item:not([open]) .plus, .hub-faq-list .faq-item:not([open]) .plus { transform: none !important; }
.mu-faq .faq-item[open] .plus, .hub-faq-list .faq-item[open] .plus { transform: rotate(45deg) !important; }
.mu-faq .faq-item .answer, .hub-faq-list .faq-item .answer {
  padding: 0 0 1.4rem !important; max-width: 68ch !important; font-size: 1rem !important; line-height: 1.6 !important;
}
.mu-faq .faq-item .answer { color: #B0A99D !important; }
.hub-faq-list .faq-item .answer { color: #5C5450 !important; }
/* Meetups: Box „Nicht gedacht für“ auf schmalen Handys untereinander statt Schmalspalte */
@media (max-width: 560px) {
  .mu-audience .not-for, .mu-partner-why .not-for { flex-direction: column; gap: .5rem; padding: 20px 20px; }
  .mu-audience .not-for .lbl, .mu-partner-why .not-for .lbl { padding-top: 0; }
}

/* 9a · Kapitel-Box auf Wissensseiten mit Akkordeon: am Handy/Tablet aus, am Desktop Seitennavigation */
@media (max-width: 959px) { .wb-layout:has(> .wb-acc) > .wb-toc { display: none !important; } }
@media (min-width: 1100px) {
  /* Leiste füllt die Artikel-Zeile, nur der Inhalt klebt → endet mit dem Artikel */
  .wb-layout > .wb-toc:has(> .wb-toc-inner) { position: static; align-self: stretch; max-height: none; overflow: visible; }
  .wb-toc > .wb-toc-inner { position: sticky; top: 88px; max-height: calc(100vh - 110px); overflow: auto; }
}

/* 4a/5a · Vergleich: Anbieter-Kopf im dunklen Bühnen-Stil (wie Hub), Featured-Label sauber */
body.vendor-page .vendor-top {
  background: #1F1B1A; color: #EBE9DC;
  box-shadow: 0 0 0 100vmax #1F1B1A; clip-path: inset(0 -100vmax);
  padding: 24px 0 clamp(2.5rem, 5vw, 3.5rem); margin-bottom: 0;
}
body.vendor-page .vendor-top > .breadcrumb { margin: 0 0 14px; color: #B0A99D; }
body.vendor-page .vendor-top > .breadcrumb a { color: #EBE9DC; }
body.vendor-page .vendor-top > .back-btn { color: #B0A99D; }
body.vendor-page .vendor-top > .vendor-hero { padding: 24px 0 0; border-bottom: 0; margin-bottom: 0; }
body.vendor-page .vendor-hero-content h1 { color: #EBE9DC; }
body.vendor-page .vendor-hero-content .lede, body.vendor-page .vendor-hero .vendor-meta-row,
body.vendor-page .vendor-hero .vendor-meta-row .vendor-cat { color: #B0A99D; }
body.vendor-page .vendor-hero .tag { border-color: rgba(235, 233, 220, .3); color: #EBE9DC; background: transparent; }
body.vendor-page .vendor-hero .tag-feat { background: #E76129; border-color: #E76129; color: #1F1B1A; }
body.vendor-page .vendor-hero .tag-podcast, body.vendor-page .vendor-hero .tag-realcdp { background: rgba(240, 105, 46, .14); border-color: transparent; color: #F0692E; }
body.vendor-page .vendor-hero .vendor-logo { border-color: transparent; }
.page-vergleich .vendor-logo { border-radius: 0; }
@media (max-width: 920px) {
  .page-vergleich .featured::before { position: static; display: block; margin: 0 0 14px; }
}
@media (max-width: 540px) { .page-vergleich .featured { padding: 22px 20px; } }

/* Kleinteile */
.page-vergleich .ep .ep-num, .page-vergleich .ep .ep-date { font-size: 12px; }
.page-vergleich .ep .ep-num { border-radius: 0; }
main.presse-page .pr-bio-label, main.presse-page .pr-bio-words { font-size: .75rem; }
/* Hero ohne Foto (/ueber, /ueber-den-podcast, /presse): Inhalt bündig wie die anderen Seiten
   (auto-Ränder im Flex-Hero ließen den Block auf Inhaltsbreite schrumpfen und mittig sitzen) */
main.cv-page > .cv-hero > .cv-hero-inner { width: 100%; box-sizing: border-box; }
/* Presse: Fotos gleich hoch, Bildunterschriften auf einer Linie, eckig */
main.presse-page .pr-photo picture, main.presse-page .pr-photo img { border-radius: 0; }
@media (min-width: 720px) {
  main.presse-page .pr-photo picture, main.presse-page .pr-photo img { aspect-ratio: 3 / 2; }
  main.presse-page .pr-photo img { height: 100%; object-fit: cover; object-position: 50% 30%; }
}
/* Kennzahlen-Leisten mit genau 4 Werten: auf Tablet und Handy 2 × 2 statt 3 + 1 */
@media (max-width: 959px) {
  .wissen-stat-strip:has(> .wissen-stat:nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
/* Autoren-Box: auf schmalen Handys Bild über Text */
@media (max-width: 480px) {
  .author-bio { grid-template-columns: 1fr; padding: 1.25rem; }
}
.hub-faq-list { margin-top: clamp(1.5rem, 3vw, 2.5rem); }
/* Kontakt-CTA (site-chrome) auf Vergleichsseiten: Seitenlink-Farbe überschrieb den Button-Text */
.jr-kcta a.jr-kcta-btn, .jr-kcta a.jr-kcta-btn:hover { color: #1F1B1A !important; text-decoration: none; }
.jr-kcta a.jr-kcta-link { color: #EBE9DC !important; }
.updated-pill { font-size: max(12px, .75rem) !important; }
main.presse-page .pr-photo-usage { margin-top: 1.5rem; }
/* Formulare im Bühnen-Stil: eckiger Rahmen und eckige Felder */
.cv-form-frame, .smg-form-frame, .md-form-frame, main.cv-page [class*="form-frame"],
.hsf-form input, .hsf-form textarea, .hsf-form select { border-radius: 0 !important; }