/* ═══════════════════════════════════════════════════════════════════════════
   vc-fz-startseite.css — Fahrzeuge: ALLES unter der Suchbox in der
   Design-Sprache der Vermittco-STARTSEITE (index.html).

   Betreiber 17.08.: „wenn man runterscrollt sieht alles aus wie mobile und
   farben passen nicht … nimm die Designsprache der Homepage, ohne
   Funktionen oder Daten zu löschen."

   REIN OPTISCH. Kein Element wird ausgeblendet, keine ID/Klasse umbenannt,
   kein Text, kein Knopf, keine Funktion angefasst — nur Farben, Rahmen,
   Radien, Schatten und Typografie.

   Was von der Startseite übernommen wird (1:1 aus index.html):
     • Karten:      background var(--card), 1px solid var(--bord), Radius 12/16 px,
                    Hover: Rand in Blau + weicher Schatten + 3 px anheben  (.card/.duo-card)
     • Überschrift: 800, letter-spacing -.02em, var(--text)                (.sec-h)
     • Knöpfe:      var(--cta) #16457e navy, Hover #0f3463                 (.btn-cta)
     • Links:       var(--blue) #1B56CC                                    (.duo-link)
     • Bänder:      linear-gradient(120deg,#0C1A2E,#10254a) + weißer Knopf (.cta-band)
     • Bild-Kacheln:Foto + dunkler Verlauf von unten + weißer Text         (.catcard/.explore-tile)
     • FAQ:         Rahmen-Karte, offen = blauer Rand, +/– in Blau         (.faq-item)
     • Symbol-Feld: #e3edfb Fläche, Symbol in Blau                         (.duo-ic)

   Was ersetzt wird (mobile.de-Erbe): #1c1d23/#141519 dunkle Kästen im Hellmodus,
   Orange #f0530b/#E5320C, Lila #7c3aed/#5b21b6/#3d3f75, Pfirsich #f7b28c.

   🚨 Diese Datei steht als LETZTER Stylesheet-Layer im <head> und arbeitet mit
   ID-Präfix (#fzHomeSecs …). Damit gewinnt sie sicher gegen die bestehenden
   `html:not([data-theme="dark"]) .mde-sec`-Regeln (0,2,1) im Seiten-<style>.
   Die Suchbox, das Kopfbild und die Trefferliste (body.fz-srp) bleiben
   ABSICHTLICH unberührt — dort ist der mobile.de-Aufbau gewollt.
   Nachtrag 05.09.2026: Die FARBEN der Suchbox (.mde-filterbox) kommen jetzt
   aus vc-suchkarte.css (= Startseite, für alle Kategorien); der Aufbau bleibt.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Farbwerte der Startseite (eine Quelle für alle Regeln hier) ────────── */
#fzHomeSecs,
#fzLinksWrap,
#fzMagModal,
#vcFzReco {
  --vcs-card:   #ffffff;
  --vcs-card2:  #F3F5F9;                       /* zweite Ebene (Kachel in der Karte) */
  --vcs-bord:   #E2E6EE;
  --vcs-text:   #13233a;
  --vcs-tmid:   #42526a;
  --vcs-tmut:   #6B7A90;
  --vcs-blue:   #1B56CC;
  --vcs-cta:    #16457e;
  --vcs-ctah:   #0f3463;
  --vcs-ic:     #e3edfb;                       /* Symbol-Fläche wie .duo-ic */
  --vcs-icfg:   #16457e;
  --vcs-sh:     0 1px 2px rgba(15,23,42,.06);
  --vcs-shh:    0 12px 32px rgba(12,26,46,.12);
  --vcs-band:   linear-gradient(120deg,#0C1A2E,#10254a);
  --vcs-r:      12px;
  --vcs-rl:     16px;
  --vcs-ease:   cubic-bezier(0.32,0.72,0,1);
  /* Ein Hebel für ALLES, was von Skripten mit var(--fzacc) eingefärbt wird
     (vc-fz-links.js u. a.) — damit verschwindet das Orange auch dort, ohne
     dass jede einzelne Regel nachgezogen werden muss. */
  --fzacc:      #1B56CC;
  --fzacch:     #16457e;
}
html[data-theme="dark"] #fzHomeSecs,
html[data-theme="dark"] #fzLinksWrap,
html[data-theme="dark"] #fzMagModal,
html[data-theme="dark"] #vcFzReco {
  --vcs-card:   #17171c;                       /* neutrales Dunkel wie die übrige Seite */
  --vcs-card2:  #141417;
  --vcs-bord:   #28282e;
  --vcs-text:   #E8EDF5;
  --vcs-tmid:   #9FB2CC;
  --vcs-tmut:   #9AA7BD;
  --vcs-blue:   #5B9BF8;
  --vcs-cta:    #16315c;
  --vcs-ctah:   #1f4480;
  --vcs-ic:     rgba(91,155,248,.14);
  --vcs-icfg:   #8fc3ff;
  --vcs-sh:     0 1px 2px rgba(0,0,0,.28);
  --vcs-shh:    0 12px 32px rgba(0,0,0,.42);
  --vcs-band:   linear-gradient(120deg,#101014,#16223a);
  --fzacc:      #5B9BF8;
  --fzacch:     #8fc3ff;
}

/* ── 2. Sektions-Karte ────────────────────────────────────────────────────── */
/* 🚨 `!important` ist hier PFLICHT, nicht Bequemlichkeit: vc-dark.css setzt
   `[data-theme="dark"] section{background:transparent!important}`. Alle diese
   Abschnitte SIND <section>-Elemente — ohne !important blieben sie im
   Dunkelmodus durchsichtig und es gäbe gar keine Karten. */
/* Betreiber 05.09.2026: „diese Box-Umrandung weg — alles soll im gesamten
   Hintergrund liegen, keine extra Umrandung für die Vorschläge." Die Abschnitte
   (Top-Deals, Neu eingetroffen, Preis gesenkt, Stöbern, Kategorien …) sind keine
   Kästen mehr: kein Hintergrund, kein Rahmen, kein Schatten, kein Innenabstand.
   !important, weil das Seiten-<style> (.mde-sec #1c1d23 + Schatten) sonst
   durchscheint. Der CTA-Banner behält seine eigene Fläche. */
#fzHomeSecs .mde-sec,
#fzHomeSecs .mde-typesec,
#fzLinksWrap .mde-sec {
  background: transparent !important;
  border: 0 none !important;
  border-radius: 0;
  box-shadow: none !important;
  margin-top: 2rem;
  padding: 0 !important;
  color: var(--vcs-text);
}
#fzHomeSecs .fz-cta-banner {
  background: var(--vcs-card) !important;
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-rl);
  box-shadow: var(--vcs-sh);
  margin-top: 1.35rem;
  padding: 1.9rem 1.8rem;
  color: var(--vcs-text);
}
#fzHomeSecs .mde-sec-head { margin-bottom: 1.25rem; }
#fzHomeSecs .mde-sec-head h2,
#fzHomeSecs .mde-typesec h2 {
  color: var(--vcs-text);
  font-size: clamp(1.25rem, 2.1vw, 1.7rem);
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.2;
}
#fzHomeSecs #fzDealsSec .mde-sec-head h2 { font-size: clamp(1.4rem, 2.4vw, 1.9rem); }
/* „Alle anzeigen" wie der Startseiten-Link .duo-link: Blau, fett, ohne Unterstrich */
#fzHomeSecs .mde-sec-all {
  color: var(--vcs-blue);
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
}
#fzHomeSecs .mde-sec-all:hover { color: var(--vcs-cta); text-decoration: underline; }
html[data-theme="dark"] #fzHomeSecs .mde-sec-all:hover { color: #8fc3ff; }

/* ── 3. Angebots-Karten (Top-Deals, Neu, Preis gesenkt, Marken-/Typ-Reihen) ──
      Vorbild: .card auf der Startseite (Bild 4:3 auf Weiß, Trennlinie, Titel
      zweizeilig, Preis unten, Hover hebt an). ──────────────────────────────── */
#fzHomeSecs .deal-card {
  background: var(--vcs-card);
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-r);
  color: var(--vcs-text);
  box-shadow: none;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
#fzHomeSecs .deal-card:hover {
  border-color: rgba(27,86,204,.35);
  box-shadow: var(--vcs-shh);
  transform: translateY(-3px);
}
html[data-theme="dark"] #fzHomeSecs .deal-card:hover { border-color: rgba(91,155,248,.42); }
#fzHomeSecs .deal-img { border-bottom: 1px solid var(--vcs-bord); }
#fzHomeSecs .deal-heart {
  background: rgba(255,255,255,.92);
  border: 1px solid var(--vcs-bord);
  color: var(--vcs-tmut);
}
#fzHomeSecs .deal-heart:hover { color: var(--vcs-blue); border-color: var(--vcs-blue); }
html[data-theme="dark"] #fzHomeSecs .deal-heart { background: rgba(23,23,28,.9); }
#fzHomeSecs .deal-title {
  color: var(--vcs-text);
  font-size: .95rem;
  font-weight: 700;
  line-height: 1.3;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.5em;
}
#fzHomeSecs .deal-price { color: var(--vcs-text); font-size: 1.1rem; font-weight: 800; letter-spacing: -.01em; }
#fzHomeSecs .deal-price .mwst,
#fzHomeSecs .deal-price .old { color: var(--vcs-tmut); }
#fzHomeSecs .deal-lease { color: var(--vcs-tmid); }
#fzHomeSecs .deal-eco,
#fzHomeSecs .deal-loc { color: var(--vcs-tmut); }
#fzHomeSecs .deal-chip {
  background: var(--vcs-card2);
  border: 1px solid var(--vcs-bord);
  color: var(--vcs-tmid);
  border-radius: 6px;
}
#fzHomeSecs .deal-chip svg { color: var(--vcs-tmut); }
/* „DEAL"-Plakette: kein Pfirsich mehr, sondern der Hinweis-Ton der Startseite (.um-note) */
#fzHomeSecs .deal-badge {
  background: rgba(27,86,204,.08);
  border: 1px solid rgba(27,86,204,.2);
  color: var(--vcs-blue);
  font-size: .68rem;
  font-weight: 700;
  border-radius: 6px;
  padding: .18rem .55rem;
}
#fzHomeSecs .deal-badge::before { background: var(--vcs-blue); }
html[data-theme="dark"] #fzHomeSecs .deal-badge {
  background: rgba(91,155,248,.13);
  border-color: rgba(91,155,248,.28);
}
/* Wortmarke „DEALS" in der Überschrift → Vermittco-Blau statt Pfirsich */
#fzHomeSecs .deal-hl { background: var(--vcs-blue); color: #fff; }
#fzHomeSecs .deal-hl::before { background: #fff; }
html[data-theme="dark"] #fzHomeSecs .deal-hl { background: #2E5FB5; color: #fff; }
/* Blätter-Pfeil der Karussells: weiße Scheibe mit feinem Rand wie die Startseite */
#fzHomeSecs .deal-next {
  background: var(--vcs-card);
  border: 1px solid var(--vcs-bord);
  color: var(--vcs-tmid);
  box-shadow: 0 6px 18px rgba(12,26,46,.12);
  transition: border-color .2s, color .2s;
}
#fzHomeSecs .deal-next:hover { border-color: var(--vcs-blue); color: var(--vcs-blue); }
html[data-theme="dark"] #fzHomeSecs .deal-next { box-shadow: 0 6px 18px rgba(0,0,0,.4); }

/* ── 4. Ausgewählte Kategorien ────────────────────────────────────────────── */
#fzHomeSecs .selcat {
  background: var(--vcs-card);
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-r);
  color: var(--vcs-text);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
#fzHomeSecs .selcat:hover {
  border-color: rgba(27,86,204,.35);
  box-shadow: var(--vcs-shh);
  transform: translateY(-3px);
}
/* Die zwei hervorgehobenen Kacheln waren lila (#3d3f75) — jetzt der zarte
   Blauton der Startseite, damit sie sich abheben, ohne fremd zu wirken. */
#fzHomeSecs .selcat.hl {
  background: rgba(27,86,204,.05);
  border-color: rgba(27,86,204,.22);
}
html[data-theme="dark"] #fzHomeSecs .selcat.hl {
  background: rgba(91,155,248,.08);
  border-color: rgba(91,155,248,.24);
}
#fzHomeSecs .selcat-img { background-color: var(--vcs-card2); }
/* 🚨 KEINE Kachel hinter dem Symbol. Betreiber-Vorgabe 13.08.2026 („nur das
   Symbol soll da sein") — vc-symbol-schlicht.js nimmt .selcat-ico/.fztrust-ico/
   .fzxcat-ico die Fläche mit !important. Hier wird deshalb NUR die Farbe
   gesetzt; eine Fläche wäre ein Rückschritt und würde ohnehin verlieren. */
#fzHomeSecs .selcat-ico,
#fzHomeSecs .selcat.hl .selcat-ico { color: var(--vcs-icfg); }
#fzHomeSecs .selcat b { color: var(--vcs-text); }
#fzHomeSecs .selcat small,
#fzHomeSecs .selcat-low small { color: var(--vcs-tmut); }

/* ── 5. Beliebte Kategorien (Foto-Kacheln) — Reise-Kachel wie .catcard ────── */
#fzHomeSecs .popcat {
  border-radius: 14px;
  background-color: #0C1A2E;
  transition: transform .5s var(--vcs-ease), box-shadow .5s var(--vcs-ease);
}
#fzHomeSecs .popcat:hover { transform: scale(1.03); box-shadow: 0 18px 42px rgba(12,26,46,.28); }
#fzHomeSecs .popcat::before {
  background: linear-gradient(to top, rgba(8,18,38,.92), rgba(8,18,38,.55) 34%, rgba(8,18,38,.06) 68%);
}
#fzHomeSecs .popcat b { font-size: 1.15rem; font-weight: 800; letter-spacing: -.01em; }
#fzHomeSecs .popcat-pill {
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.28);
  color: #fff;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

/* ── 6. Fahrzeugtypen · Preisklassen · Regionen ───────────────────────────── */
#fzHomeSecs .mde-typetile,
#fzHomeSecs .fzprice-tile {
  background: var(--vcs-card);
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-r);
  color: var(--vcs-text);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
#fzHomeSecs .mde-typetile:hover,
#fzHomeSecs .fzprice-tile:hover {
  border-color: rgba(27,86,204,.35);
  box-shadow: var(--vcs-shh);
  transform: translateY(-3px);
}
#fzHomeSecs .mde-typetile svg { color: var(--vcs-icfg); }
#fzHomeSecs .mde-typetile .tt-name,
#fzHomeSecs .fzprice-tile b { color: var(--vcs-text); }
#fzHomeSecs .mde-typetile .tt-count,
#fzHomeSecs .fzprice-tile span { color: var(--vcs-tmut); }
#fzHomeSecs .fzprice-tile .fzprice-ico { color: var(--vcs-icfg); }
#fzHomeSecs .fzreg-chip {
  background: var(--vcs-card);
  border: 1px solid var(--vcs-bord);
  color: var(--vcs-text);
  transition: border-color .2s, color .2s;
}
#fzHomeSecs .fzreg-chip:hover { border-color: var(--vcs-blue); color: var(--vcs-blue); }
#fzHomeSecs .fzreg-chip small { color: var(--vcs-tmut); }

/* ── 7. Anbieter-Karten (beliebt / empfohlen) ─────────────────────────────── */
#fzHomeSecs .fzsell-card {
  background: var(--vcs-card);
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-r);
  color: var(--vcs-text);
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
#fzHomeSecs .fzsell-card:hover {
  border-color: rgba(27,86,204,.35);
  box-shadow: var(--vcs-shh);
  transform: translateY(-3px);
}
#fzHomeSecs .fzsell-mono { border-color: var(--vcs-bord); color: var(--vcs-tmid); }
#fzHomeSecs .fzsell-logo { background: var(--vcs-card2); border: 1px solid var(--vcs-bord); }
#fzHomeSecs .fzsell-name { color: var(--vcs-text); }
#fzHomeSecs .fzsell-count,
#fzHomeSecs .fzsell-stars small { color: var(--vcs-tmut); }

/* ── 8. Bänder: Verkaufen · Benachrichtigen · App · B2B ───────────────────── */
#fzHomeSecs .mde-sellbanner,
#fzHomeSecs .fz-nl-banner {
  background: var(--vcs-band) !important;   /* siehe oben: <section> + vc-dark.css */
  border: none;
  border-radius: var(--vcs-rl);
  box-shadow: var(--vcs-sh);
  margin-top: 1.35rem;
}
#fzHomeSecs .mde-sellbanner h2,
#fzHomeSecs .fz-nl-banner h2 { color: #fff; font-weight: 800; letter-spacing: -.02em; }
#fzHomeSecs .mde-sellbanner p,
#fzHomeSecs .fz-nl-banner p { color: rgba(255,255,255,.78); }
/* Knopf im dunklen Band = weiß mit navy Schrift (.btn-white2 der Startseite) */
#fzHomeSecs .mde-sellbanner .sb-btn,
#fzHomeSecs .fz-nl-banner .fz-nl-btn {
  background: #fff;
  color: var(--vcs-cta);
  border-radius: 10px;
  font-weight: 700;
  transition: background .2s, transform .15s;
}
#fzHomeSecs .mde-sellbanner .sb-btn:hover,
#fzHomeSecs .fz-nl-banner .fz-nl-btn:hover { background: #eef3ff; transform: translateY(-1px); }
html[data-theme="dark"] #fzHomeSecs .mde-sellbanner .sb-btn,
html[data-theme="dark"] #fzHomeSecs .fz-nl-banner .fz-nl-btn { color: #10254a; }
#fzHomeSecs .fz-nl-hint { color: rgba(255,255,255,.8); }
#fzHomeSecs .fz-nl-hint a { color: #8fc3ff; }
#fzHomeSecs .sb-img { background-color: #10254a; }
/* App-/B2B-Banner sind helle Karten → Knopf navy mit weißer Schrift (.btn-cta) */
#fzHomeSecs .fz-cta-banner h2 { color: var(--vcs-text); font-weight: 800; letter-spacing: -.02em; }
#fzHomeSecs .fz-cta-banner p { color: var(--vcs-tmid); }
#fzHomeSecs .fz-cta-banner .fz-nl-btn,
#fzHomeSecs .fzfin-btn,
#fzHomeSecs .fz-guide-btn {
  background: var(--vcs-cta);
  color: #fff;
  border-radius: 10px;
  font-weight: 700;
  transition: background .2s, box-shadow .2s, transform .15s;
}
#fzHomeSecs .fz-cta-banner .fz-nl-btn:hover,
#fzHomeSecs .fzfin-btn:hover,
#fzHomeSecs .fz-guide-btn:hover {
  background: var(--vcs-ctah);
  box-shadow: 0 8px 24px rgba(22,69,126,.32);
  transform: translateY(-1px);
}
#fzHomeSecs .fzfin-btn.ghost {
  background: transparent;
  border: 1.5px solid var(--vcs-cta);
  color: var(--vcs-cta);
  box-shadow: none;
}
#fzHomeSecs .fzfin-btn.ghost:hover { background: rgba(22,69,126,.08); box-shadow: none; }
html[data-theme="dark"] #fzHomeSecs .fzfin-btn.ghost { border-color: #5B9BF8; color: #8fc3ff; }

/* ── 9. Guide-Box ─────────────────────────────────────────────────────────── */
#fzHomeSecs .fz-guide-mark b { color: var(--vcs-text); }
#fzHomeSecs .fz-guide-mark .fzg-spark { color: var(--vcs-blue); }
#fzHomeSecs .fz-guide-beta {
  background: var(--vcs-card2);
  border: 1px solid var(--vcs-bord);
  color: var(--vcs-tmut);
}
#fzHomeSecs .fz-guide-txt { color: var(--vcs-tmid); }

/* ── 10. Finanzieren · Bewertungen · Zahlen · Vertrauen · Andere Kategorien ─ */
#fzHomeSecs .fzfin-card,
#fzHomeSecs .fzrev-card,
#fzHomeSecs .fzstat,
#fzHomeSecs .fztrust-tile,
#fzHomeSecs .fzxcat-tile {
  background: var(--vcs-card);
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-rl);
  color: var(--vcs-text);
  transition: border-color .2s, box-shadow .2s;
}
#fzHomeSecs a.fztrust-tile:hover,
#fzHomeSecs .fzxcat-tile:hover {
  border-color: rgba(27,86,204,.35);
  box-shadow: var(--vcs-shh);
}
/* Die Karten stehen selbst schon in einer Karte → zweite Ebene leicht getönt,
   damit die Schachtelung nicht als „Rahmen im Rahmen" wirkt (Startseiten-Muster). */
#fzHomeSecs .fzfin-card,
#fzHomeSecs .fzrev-card,
#fzHomeSecs .fzstat,
#fzHomeSecs .fztrust-tile { background: var(--vcs-card2); }
#fzHomeSecs .fzfin-card h3,
#fzHomeSecs .fztrust-tile b,
#fzHomeSecs .fzxcat-tile b { color: var(--vcs-text); font-weight: 800; }
#fzHomeSecs .fzfin-card p,
#fzHomeSecs .fztrust-tile p,
#fzHomeSecs .fzrev-card p { color: var(--vcs-tmid); }
#fzHomeSecs .fzxcat-tile small,
#fzHomeSecs .fzrev-meta { color: var(--vcs-tmut); }
#fzHomeSecs .fzrev-meta b { color: var(--vcs-tmid); }
#fzHomeSecs .fztrust-ico,
#fzHomeSecs .fzxcat-ico { color: var(--vcs-icfg); }   /* Fläche: siehe Hinweis oben */
#fzHomeSecs .fzstat b { color: var(--vcs-cta); font-weight: 800; letter-spacing: -.02em; }
html[data-theme="dark"] #fzHomeSecs .fzstat b { color: #8fc3ff; }
#fzHomeSecs .fzstat span { color: var(--vcs-tmut); }
/* (Der Kfz-Beitragsrechner-Abschnitt #fzVersSec ist am 17.08.2026 entfallen —
   seine Regeln standen hier und sind mit ihm gegangen.) */

/* ── 11. Magazin ──────────────────────────────────────────────────────────── */
#fzHomeSecs .mag-hero,
#fzHomeSecs .mag-item { color: var(--vcs-text); }
#fzHomeSecs .mag-hero-img,
#fzHomeSecs .mag-thumb { border-radius: var(--vcs-r); background-color: var(--vcs-card2); }
#fzHomeSecs .mag-kick {
  color: var(--vcs-blue);
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
#fzHomeSecs .mag-hero h3 { color: var(--vcs-text); font-weight: 800; letter-spacing: -.02em; }
#fzHomeSecs .mag-hero .mag-teaser { color: var(--vcs-tmid); }
#fzHomeSecs .mag-item b { color: var(--vcs-text); }
#fzHomeSecs .mag-date { color: var(--vcs-tmut); }
#fzMagModal { background: rgba(12,26,46,.62); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
#fzMagModal .mag-modal-box {
  background: var(--vcs-card);
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-rl);
  color: var(--vcs-tmid);
  box-shadow: 0 26px 64px rgba(6,18,40,.34);
}
#fzMagModal .mag-modal-box h3 { color: var(--vcs-text); font-weight: 800; letter-spacing: -.02em; }
#fzMagModal .mag-kick { color: var(--vcs-blue); font-size: .72rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
#fzMagModal .mag-date { color: var(--vcs-tmut); }
#fzMagModal .mag-modal-x {
  background: var(--vcs-card2);
  border: 1px solid var(--vcs-bord);
  color: var(--vcs-tmid);
}
#fzMagModal .mag-modal-x:hover { background: var(--vcs-ic); color: var(--vcs-cta); }

/* Live-Block im Magazin (vc-fz-echt.js) — Zahlen aus dem echten Bestand */
#fzMagModal .mag-live,
#fzHomeSecs .mag-live {
  display: block;
  background: var(--vcs-card2);
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-r);
  padding: 1rem 1.1rem;
  margin: 0 0 1.2rem;
}
#fzMagModal .mag-live-h {
  display: block;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--vcs-tmut);
  margin-bottom: .55rem;
}
#fzMagModal .mag-live-row { display: flex; flex-wrap: wrap; gap: 1.6rem; margin-bottom: .9rem; }
#fzMagModal .mag-live-f { display: flex; flex-direction: column; gap: .1rem; }
#fzMagModal .mag-live-f b { font-size: 1.25rem; font-weight: 800; color: var(--vcs-text); letter-spacing: -.02em; line-height: 1.2; }
#fzMagModal .mag-live-f i { font-style: normal; font-size: .78rem; color: var(--vcs-tmut); }
#fzMagModal .mag-live-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: var(--vcs-cta);
  color: #fff;
  border: none;
  border-radius: 10px;
  padding: .7rem 1.3rem;
  font-family: inherit;
  font-size: .88rem;
  font-weight: 700;
  cursor: pointer;
}
#fzMagModal .mag-live-btn:hover { background: var(--vcs-ctah); }
#fzMagModal .mag-live-none { font-size: .88rem; color: var(--vcs-tmid); margin: 0; }
/* Live-Zahl auf der Magazin-Karte */
#fzHomeSecs .mag-cnt {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  background: rgba(27,86,204,.08);
  border: 1px solid rgba(27,86,204,.2);
  color: var(--vcs-blue);
  border-radius: 999px;
  padding: .12rem .6rem;
  font-size: .72rem;
  font-weight: 700;
  margin-left: .5rem;
  vertical-align: 1px;
}
html[data-theme="dark"] #fzHomeSecs .mag-cnt { background: rgba(91,155,248,.13); border-color: rgba(91,155,248,.28); }

/* ── 12. FAQ + Fahrzeug-Lexikon — Akkordeon der Startseite (.faq-item) ────── */
#fzHomeSecs .fz-faq details {
  background: var(--vcs-card2);
  border: 1px solid var(--vcs-bord);
  border-radius: var(--vcs-r);
  transition: border-color .2s, box-shadow .2s;
}
#fzHomeSecs .fz-faq details[open] {
  border-color: rgba(27,86,204,.32);
  box-shadow: 0 8px 24px rgba(12,26,46,.07);
}
html[data-theme="dark"] #fzHomeSecs .fz-faq details[open] {
  border-color: rgba(91,155,248,.34);
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
}
#fzHomeSecs .fz-faq summary { color: var(--vcs-text); font-size: 1rem; font-weight: 700; }
#fzHomeSecs .fz-faq details[open] summary { color: var(--vcs-blue); }
#fzHomeSecs .fz-faq summary::after {
  content: '+';
  font-size: 1.45rem;
  font-weight: 400;
  line-height: 1;
  color: var(--vcs-blue);
}
#fzHomeSecs .fz-faq details[open] summary::after { content: '\2013'; }
#fzHomeSecs .fz-faq details > div { color: var(--vcs-tmid); font-size: .93rem; line-height: 1.7; }

/* ── 13. Beliebte Automarken ──────────────────────────────────────────────── */
#fzHomeSecs .brand-grid { border: 1px solid var(--vcs-bord); border-radius: var(--vcs-r); overflow: hidden; }
#fzHomeSecs .brand-cell {
  color: var(--vcs-text);
  border-right-color: var(--vcs-bord);
  border-bottom-color: var(--vcs-bord);
  transition: background .2s;
}
#fzHomeSecs .brand-cell:hover { background: var(--vcs-card2); }
#fzHomeSecs .brand-grid .brand-cell:nth-last-child(-n+6) { border-bottom: none; }
#fzHomeSecs .brand-name { color: var(--vcs-text); }
#fzHomeSecs .brand-count { color: var(--vcs-tmut); }
#fzHomeSecs .brand-ico { border-color: var(--vcs-bord); color: var(--vcs-tmid); }
@media (max-width: 900px) {
  #fzHomeSecs .brand-grid .brand-cell:nth-last-child(-n+6) { border-bottom: 1px solid var(--vcs-bord); }
  #fzHomeSecs .brand-grid .brand-cell:nth-last-child(-n+3) { border-bottom: none; }
}

/* ── 14. „Beliebte Suchen" (vc-fz-links.js) ───────────────────────────────── */
#fzLinksWrap .fzl-col h3 { color: var(--vcs-text); }
#fzLinksWrap .fzl-link { color: var(--vcs-tmid); }
#fzLinksWrap .fzl-link:hover { color: var(--vcs-blue); }
#fzLinksWrap .fzl-editbtn { border-color: var(--vcs-bord); color: var(--vcs-tmid); }
#fzLinksWrap .fzl-editbtn:hover { border-color: var(--vcs-blue); color: var(--vcs-blue); }

/* ── 15. Für Sie empfohlen (Personalisierung, vc-homereco.js Kategorie-Modus)
      Die Regale bringen ihr eigenes CSS mit (vhr-*) und rechnen mit den
      Startseiten-Variablen — die fehlen auf fahrzeuge.html und werden hier
      gesetzt. Der Rahmen ist dieselbe Karte wie jede andere Sektion.

      🚨 vc-homereco.js hängt sein eigenes <style> ans ENDE des <head> — also
      nach dieser Datei. Bei gleicher Spezifität gewänne es. Darum tragen die
      Regeln hier zusätzlich #fzHomeSecs (zwei Bezeichner statt einem). ───── */
#fzHomeSecs #vcFzReco {
  --card: var(--vcs-card);
  --bord: var(--vcs-bord);
  --off:  var(--vcs-card2);
  --text: var(--vcs-text);
  --tmid: var(--vcs-tmid);
  --tmut: var(--vcs-tmut);
  --blue: var(--vcs-blue);
  --cta:  var(--vcs-cta);
  --ctah: var(--vcs-ctah);
  display: block;
  background: transparent !important;       /* Betreiber 05.09.2026: keine Box um die Vorschläge */
  border: 0 none !important;
  border-radius: 0;
  box-shadow: none !important;
  margin-top: 2rem;
  padding: 0 !important;
  color: var(--vcs-text);
}
#fzHomeSecs #vcFzReco:empty { display: none; }
#fzHomeSecs #vcFzReco .vhr-head {
  color: var(--vcs-text);
  font-size: clamp(1.25rem, 2.1vw, 1.7rem);
  font-weight: 800;
  letter-spacing: -.02em;
  line-height: 1.2;
  margin: 0;
  text-align: left;
}
#fzHomeSecs #vcFzReco .vhr-sub { color: var(--vcs-tmut); font-size: .88rem; margin: .35rem 0 1.4rem; text-align: left; }
/* Erstes Regal braucht keinen doppelten Abstand zur Unterzeile */
#fzHomeSecs #vcFzReco .vhr-body > .vhr-sh:first-child { margin-top: 0; }
/* Das „grid"-Layout der Regale gibt es auf der Startseite global; hier gehört
   es in den Empfehlungs-Block, sonst stünden die Karten untereinander. */
#fzHomeSecs #vcFzReco .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.1rem; }
@media (max-width: 520px) { #fzHomeSecs #vcFzReco .grid { grid-template-columns: repeat(2, 1fr); gap: .7rem; } }

/* ── 15b. Bestseller-Regal ohne Rangnummern (Betreiber 05.09.2026: „diese
   Umrandung und Zahlen wegmachen") — die blauen Kreise mit 1…5 kommen aus
   vc-homereco.js (.vhr-ranknum). Nur hier auf der Fahrzeuge-Seite; die
   Startseite bleibt unberührt. ─────────────────────────────────────────────── */
#fzHomeSecs #vcFzReco .vhr-ranknum { display: none !important; }

/* ── 16. Abstände unter der Suchbox ───────────────────────────────────────── */
@media (max-width: 760px) {
  #fzHomeSecs .fz-cta-banner { padding: 1.25rem 1.1rem; border-radius: 14px; }
  #fzHomeSecs .mde-sec,
  #fzHomeSecs .mde-typesec,
  #fzLinksWrap .mde-sec,
  #vcFzReco { padding: 0 !important; border-radius: 0; }
}

/* ── 9. Alle Inserate UNTER den Abschnitten (Betreiber 05.09.2026) ──────────
   „Fahrzeuge hat das nicht — mach das mit den Inseraten danach." Die Treffer-
   liste (.browse-wrap.mde-results) war in der Startansicht komplett versteckt
   (fahrzeuge.html: body:not(.fz-srp) .browse-wrap.mde-results{display:none}).
   Jetzt steht sie nach „Beliebte Suchen" — ohne die Such-Ansicht-Teile
   (Brotkrumen, Filter-Seitenleiste, Freitextzeile), die nur in body.fz-srp
   Sinn ergeben. Breite wie die Abschnitte (.mde-wrap: 1400 px, 2 rem Rand).
   vc-suche.js blättert in Seiten; ab Seite 2 (body.vcsu-seite2) sind die
   Abschnitte weg und man ist oben — nur Seite 1 trägt die Startseite. */
body:not(.fz-srp) .browse-wrap.mde-results {
  display: block;
  max-width: 1400px !important;
  margin: 0 auto 4rem !important;
  padding: 0 2rem !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}
body:not(.fz-srp) .browse-wrap.mde-results::before {
  content: "Alle Fahrzeuge";
  display: block;
  font-size: clamp(1.25rem, 2.1vw, 1.7rem);
  font-weight: 800;
  letter-spacing: -.02em;
  color: #13233a;
  margin: 2.4rem 0 1rem;
  padding-top: 1.6rem;
  border-top: 1px solid #E2E6EE;
}
html[data-theme="dark"] body:not(.fz-srp) .browse-wrap.mde-results::before { color: #E8EDF5; border-top-color: #28282e; }
body.vcsu-seite2:not(.fz-srp) .browse-wrap.mde-results::before,
body.vcsu-zusatz:not(.fz-srp) .browse-wrap.mde-results::before { margin-top: 1rem; border-top: 0; padding-top: 0; }
body:not(.fz-srp) .mde-results .bc-row,
body:not(.fz-srp) .mde-results #filterSidebar,
body:not(.fz-srp) .mde-results .srp-free { display: none !important; }
body:not(.fz-srp) .mde-results .browse-layout { grid-template-columns: 1fr !important; }
@media (max-width: 900px) {
  body:not(.fz-srp) .browse-wrap.mde-results { padding: 0 1rem !important; }
}
/* Seite 2+ / Zusatzfilter: nur die Liste, die Startseite ist weg */
body.vcsu-seite2 #fzHomeSecs, body.vcsu-seite2 #fzLinksWrap,
body.vcsu-zusatz #fzHomeSecs, body.vcsu-zusatz #fzLinksWrap { display: none !important; }
/* Listenkopf in der Startansicht wie auf den anderen Kategorieseiten (Betreiber 05.09.:
   „warum ist bei Fahrzeuge die Box um die Suchleiste nicht im normalen Schwarz wie bei
   jeder anderen Kategorie"): kein mobile.de-Kasten (#1c1d23 + Schatten), sondern
   durchsichtig — Zahl links, Sortierung rechts, eine Zeile. Die Such-Ansicht (body.fz-srp)
   regelt vc-suchkopf.js bereits genauso. */
body:not(.fz-srp) .mde-results .results-head {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 0 1.1rem !important;
}
body:not(.fz-srp) .mde-results .results-head h1 { font-size: 1.3rem; font-weight: 800; margin: 0; color: #13233a; }
html[data-theme="dark"] body:not(.fz-srp) .mde-results .results-head h1 { color: #E8EDF5; }
body:not(.fz-srp) .mde-results .srp-row2 { display: flex; align-items: center; gap: .8rem; }
body:not(.fz-srp) .mde-results .srp-sort-label,
body:not(.fz-srp) .mde-results .srp-save { display: none !important; }
body:not(.fz-srp) .mde-results .results-head .rs-sort {
  background: #fff; border: 1px solid #E2E6EE; border-radius: 9px; padding: .5rem .7rem;
  font-size: .84rem; color: #13233a; font-family: inherit; min-width: 0;
}
html[data-theme="dark"] body:not(.fz-srp) .mde-results .results-head .rs-sort {
  background: rgba(255,255,255,.055); border-color: rgba(255,255,255,.12); color: #E8EDF5;
}
/* Angebots-Karten der Empfehlungen (.vhr-dl): Titel nicht abschneiden — gleiche Regel wie in
   vc-kat-startseite.css (Betreiber-Bild 05.09.2026: zweite Titelzeile halb abgeschnitten). */
#fzHomeSecs #vcFzReco .vhr-dl { height: auto; min-height: 378px; }
#fzHomeSecs #vcFzReco .vhr-dlm { flex: 0 0 189px; height: 189px; }
#fzHomeSecs #vcFzReco .vhr-dltop { flex-shrink: 0; }

/* ══════════════════════════════════════════════════════════════════════════
   BETREIBER-AUFTRAG 10.09.2026 (fehler.pdf, Seite 1, Bild „Top DEALS für dich")
   Wortgleiche Umsetzung wie in vc-kat-startseite.css — die Fahrzeug-Startseite
   ist die Vorlage aller Kategorie-Startseiten und muss dasselbe zeigen.
   „links der leere Bereich soll auch mit einem Angebot sein … rutsche die
    Übersicht bis zur Kante des Bildschirms."
   Gemessen bei 1920 px: 257 px blieben links leer, weil das Polster von
   vc-regale.js die erste Karte auf der 1400-px-Spalte hielt.
   ⚠️ vc-regale.js bleibt unangetastet (läuft auch auf der tabuen Startseite).
   ⚠️ Rückfall `100%`, damit ohne --vcrg-vw kein waagrechtes Rollen entsteht.
   NUR Optik. */
#fzHomeSecs { --fzrand: clamp(16px, 2.2vw, 40px); }
#fzHomeSecs > #fzDealsSec,
#fzHomeSecs > #fzNewSec,
#fzHomeSecs > #fzDropSec,
#fzHomeSecs > #fzSelCats,
#fzHomeSecs > #fzSellSec,
#fzHomeSecs > #fzSeenSec,
#fzHomeSecs > #fzRecoSec,
#fzHomeSecs > #vcFzReco,
#fzHomeSecs > #fzMkRows > .mde-sec,
#fzHomeSecs > #fzCondRows > .mde-sec,
#fzHomeSecs > #fzCatRows > .mde-sec,
#fzHomeSecs > #fzTypRows > .mde-sec,
#fzHomeSecs > #fzDriveRows > .mde-sec,
#fzHomeSecs .mde-sec:has(> .deal-row-wrap) {
  margin-left: calc(50% - var(--vcrg-vw, 100%) / 2);
  margin-right: calc(50% - var(--vcrg-vw, 100%) / 2);
  max-width: none;
  padding-left: var(--fzrand, 24px) !important;
  padding-right: var(--fzrand, 24px) !important;
}
#fzHomeSecs > #fzMkRows,
#fzHomeSecs > #fzCondRows,
#fzHomeSecs > #fzCatRows,
#fzHomeSecs > #fzTypRows,
#fzHomeSecs > #fzDriveRows { --fzrand: clamp(16px, 2.2vw, 40px); }

/* ── „Vermittco als App": Laden-Zeichen rechts (Auftrag Seite 21) ────────── */
#fzHomeSecs #fzAppSec { align-items: center; }

/* ── Lexikon/FAQ im Folder-Design (Auftrag Seite 21) ───────────────────────
   Werte 1:1 aus dem „faq-pro"-Look von faq.html (04.09.2026). NUR Optik. */
#fzHomeSecs .fz-faq { --fp-muted: #f5f7fa; --fp-muted-fg: #6d7480; --fp-fg: #111; }
html[data-theme="dark"] #fzHomeSecs .fz-faq { --fp-muted: #17171c; --fp-muted-fg: #98a6bd; --fp-fg: #E8EDF5; }
#fzHomeSecs .fz-faq details,
html[data-theme="dark"] #fzHomeSecs .fz-faq details {
  border: 0 none;
  border-radius: 16px;
  background: var(--fp-muted);
  margin-bottom: 10px;
  overflow: hidden;
}
#fzHomeSecs .fz-faq summary,
html[data-theme="dark"] #fzHomeSecs .fz-faq summary {
  display: block;
  position: relative;
  padding: 16px 52px 16px 20px;
  font-size: 15px;
  font-weight: 500;
  line-height: 24px;
  letter-spacing: -.02em;
  color: var(--fp-fg);
  background: transparent;
}
#fzHomeSecs .fz-faq summary::-webkit-details-marker { display: none; }
#fzHomeSecs .fz-faq summary::after,
#fzHomeSecs .fz-faq details[open] summary::after {
  content: "";
  position: absolute;
  right: 20px;
  top: 20px;
  width: 16px;
  height: 16px;
  margin: 0;
  font-size: 0;
  color: var(--fp-muted-fg);
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") center/16px 16px no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") center/16px 16px no-repeat;
  transition: transform .3s cubic-bezier(.16,1,.3,1);
}
#fzHomeSecs .fz-faq details[open] summary::after { transform: rotate(180deg); }
#fzHomeSecs .fz-faq details > div,
html[data-theme="dark"] #fzHomeSecs .fz-faq details > div {
  padding: 0 20px 20px;
  font-size: 14px;
  line-height: 24px;
  color: var(--fp-muted-fg);
}
@media (prefers-reduced-motion: reduce) {
  #fzHomeSecs .fz-faq summary::after,
  #fzHomeSecs .fz-faq details[open] summary::after { transition: none; }
}

/* ── Angebote nicht schon im ersten Blick (Auftrag 10.09.2026, Seite 1) ─────
   „Mach das bei Fahrzeuge, die Angebote ganz oben — das erste was man sieht
    ist die Suchleiste; die Angebote darunter sollen wie alle anderen
    Kategorien so weit unten sein, dass es komplett verdeckt ist. Mach es
    einfach 1 zu 1 genau so wie die anderen Kategorien."
   GEMESSEN (1600×1000, Hero 100vh = 1000 px):
     Kategorie-Startseiten (maschinen.html …): erstes Regal bei 872 px,
       also 128 px über der Hero-Unterkante (.browse-wrap margin-top:-160px).
     Fahrzeuge bisher:                          erstes Regal bei 779 px,
       also 221 px über der Hero-Unterkante — 93 px zu früh.
   Darum genau diese 93 px Abstand, damit beide Seiten dieselbe Geometrie
   haben. Nur Abstand — kein Markup, keine Funktion, keine Daten. */
#fzHomeSecs { margin-top: 93px; }

/* ── Die ganze Seite darf sich NICHT waagrecht verschieben lassen ──────────
   BETREIBER-AUFTRAG 10.09.2026 (fehler.pdf, Seite 17):
   „Man kann es nach links und rechts bewegen — bei der Webseite die komplette.
    Es soll alles auf einen Punkt bleiben; nur die Angebote kannst du scrollen,
    nicht die komplette Webseite, um die Angebote zu sehen."
   Ein einziger Baustein, der ein paar Pixel zu breit ist (gemessen: 383 statt
   375 px auf dem Handy), macht die GANZE Seite schiebbar. `clip` statt
   `hidden`: es entsteht KEIN neuer Rollbehälter — klebende Kopfzeilen
   (position:sticky) und die Regale bleiben, wie sie sind. Nur der Überstand
   wird abgeschnitten.
   Die Regale rollen weiter: sie haben ihren eigenen overflow-x. */
html { overflow-x: clip; }
body { overflow-x: clip; }

/* ══ 16.09.2026 (Betreiber-Bild 2): der „vermi"-Guide-Kasten („Dein persönlicher Guide …",
   „Wie kann ich dir helfen?") entfällt auch auf Fahrzeuge (wie auf allen anderen Kategorien). Der Abschnitt wird weiter gebaut (fahrzeuge.html #fzGuideBox),
   nur nicht mehr gezeigt; der Chat bleibt über den schwebenden Knopf erreichbar. ══ */
#fzGuideBox{display:none!important}

/* ══ 18.09.2026 (Betreiber-Bild 2): „mach das mit der Schrift, dass es nicht bei der Kante so abschneidet"
   Gemessen (kopfloses Chrome, 1000–1680 px Fensterbreite): geometrisch wird NICHTS angeschnitten —
   die Kachel-Titel werden von `-webkit-line-clamp` mit „…" gekürzt, z. B.
   „Refurbished 14\" MacBook Pro mit Ap…" (.vhr-btt) oder „Beats USB‑A auf USB‑C Gewebtes Kab…" (.vhr-swt).
   Darum bekommt jede Beschriftung im Empfehlungs-Bereich der Fahrzeuge-Seite EINE ZEILE MEHR.
   Die Beschriftung liegt immer unten auf dem Bild (flex-end bzw. position:bottom) und wächst nach OBEN
   in den dunklen Verlauf — es wird also nichts überdeckt und nichts abgeschnitten.
   🚨 Zwei Bezeichner nötig (#fzHomeSecs #vcFzReco): vc-homereco.js hängt sein <style> ans ENDE des
   <head> und nennt sich dort selbst #vcFzReco — mit nur einem Bezeichner gewinnt es.
   Startseite (index.html) bleibt unberührt: sie heißt #vcHomeReco. ══ */
/* Produktnamen: bis zu VIER Zeilen (vorher zwei) — reicht für alle Titel im Bestand außer den längsten */
#fzHomeSecs #vcFzReco .vhr-tct,  #fzHomeSecs #vcFzReco .vhr-btt,  #fzHomeSecs #vcFzReco .vhr-sttl,
#fzHomeSecs #vcFzReco .vhr-dlt,  #fzHomeSecs #vcFzReco .vhr-oit2, #fzHomeSecs #vcFzReco .vhr-rct,
#fzHomeSecs #vcFzReco .vhr-rcot, #fzHomeSecs #vcFzReco .vhr-ralt, #fzHomeSecs #vcFzReco .vhr-pntitle,
#fzHomeSecs #vcFzReco .vhr-qt,   #fzHomeSecs #vcFzReco .vhr-wt,   #fzHomeSecs #vcFzReco .vhr-ht,
#fzHomeSecs #vcFzReco .vhr-aut2, #fzHomeSecs .vcrg-tct { -webkit-line-clamp: 4 !important; }
/* Kleine Kacheln: DREI Zeilen (vorher eine) */
#fzHomeSecs #vcFzReco .vhr-mtt,  #fzHomeSecs #vcFzReco .vhr-swt { -webkit-line-clamp: 3 !important; }
/* Zweite Zeile (Marke · Bereich · Ort): ZWEI Zeilen (vorher eine) */
#fzHomeSecs #vcFzReco .vhr-tcs,  #fzHomeSecs #vcFzReco .vhr-ois,  #fzHomeSecs #vcFzReco .vhr-sws,
#fzHomeSecs #vcFzReco .vhr-rals, #fzHomeSecs .vcrg-tcs { -webkit-line-clamp: 2 !important; }
/* „Entdecken"-Karten: Titel stand in EINER Zeile mit „…" — darf jetzt umbrechen (zwei Zeilen) */
#fzHomeSecs #vcFzReco .vhr-ext { white-space: normal !important; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2 !important; text-overflow: clip; }
