/* =====================================================
   BISSANTZ-LEXIKON.CSS — Vorlage Lexikon
   Ziel: bissantz.de/lexikon-neu/ (s. PLANUNG/planung_lexikon-bissantz-de.md).

   Seit 2026-10-15 läuft das Lexikon auf dem Design-System Website: Werte aus
   designsystem/website/bissantz-website-tokens.css, Aussehen aller Bausteine aus bissantz-website-components.css (beide vorher
   geladen, s. assembleLexikonHtml in routes.js). Diese Datei enthält nur noch die Platzierung
   der Bausteine auf der Lexikon-Seite und wenige Lexikon-eigene Abweichungen.

   Abweichungen im Aussehen gehören eigentlich als benannte Variante ins Design-System
   (designsystem/website/DESIGN.md). Die unten markierten sind Kandidaten dafür.
====================================================== */

/* Kopf: Brotkrumen über dem Hero (Komponenten bc-breadcrumb in bc-hero) */
.lx-breadcrumb { position: relative; z-index: 1; max-width: var(--layout-page-width); margin: 0 auto; padding: var(--space-16) var(--layout-page-gutter) 0; line-height: var(--line-height-relaxed); }

/* Seitenraster: Inhalt so breit wie die Navigation, Seitenrand aus dem Design-System (Komponente bc-layout --compact) */
.lx-layout { max-width: var(--layout-page-width); margin: 0 auto; padding: 40px var(--layout-page-gutter) var(--space-96); }

/* Webinar-Teaser (bc-power-teaser) mit Abstand zum Abschnitt darüber */
.lx-webinar { margin-top: var(--space-32); }

/* Abstände der Abschnittstitel, 1:1 aus ROS' Referenz: 16 px, Überblick/Beispiele 20 px, FAQ 8 px,
   Seitenspalte 14 px, Inhaltsverzeichnis 12 px. */
.lx-main .bc-section-title, .lx-side .bc-section-title { margin-bottom: var(--space-16); }
#ueberblick .bc-section-title, #beispiele .bc-section-title { margin-bottom: 20px; }
#faq .bc-section-title { margin-bottom: var(--space-8); }
.lx-side .bc-box h3.bc-section-title { margin-bottom: 14px; }
.lx-side .bc-box:has(> .bc-toc) h3.bc-section-title { margin-bottom: var(--space-12); }

/* Lexikon-eigene Abweichungen im Aussehen (Kandidaten für Varianten im Design-System):
   - Abschnittstitel mit natürlicher Zeilenhöhe und Laufweite (ROS' Referenz setzt beides nicht)
   - Seitenspalte: kleinere Titel, weniger Platz unter dem Fähnchen
   - Bissantz-Kasten mit Schatten */
.lx-main .bc-section-title, .lx-side .bc-section-title { line-height: normal; letter-spacing: normal; }
.lx-side h3.bc-section-title { font-size: var(--font-size-lg); }
.lx-side .bc-box--tight:has(> .bc-flag) { padding-top: 46px; }
#bissantz.bc-box--dark { box-shadow: var(--card-shadow); }