/* =====================================================
   DESIGN-B4-MARKE.CSS — Wortmarke „Aufbruch“ im Design B4 (04.10.2026)
   Gehört zu js/design-b4-marke.js.
   Die Fassungen sind für genau 30 px (Kopf am Desktop), 28 px (Kopf am Handy) und 45 px (Fußzeile)
   gezeichnet: Band und Halt liegen nur bei dieser Höhe auf dem Pixelraster, also nicht skalieren.
   ===================================================== */
html[data-design="d"][data-variante="b4"] .d-marke { display: block; font-size: 0; line-height: 0; letter-spacing: 0; }
html[data-design="d"][data-variante="b4"] .d-marke picture { display: block; }
html[data-design="d"][data-variante="b4"] .site-header .logo .d-marke img { display: block; width: 102px; height: 30px; max-width: none; }
html[data-design="d"][data-variante="b4"] .site-footer .d-marke { margin-bottom: 10px; }
html[data-design="d"][data-variante="b4"] .site-footer .d-marke img { display: block; width: 152px; height: 45px; }
@media (max-width: 768px) {
  html[data-design="d"][data-variante="b4"] .site-header .logo .d-marke img { width: 92px; height: 28px; }
}
/* Ladebildschirm beim Öffnen einer Route (#insp-boot, Stil inline im Kopf von index.html): im
   Testdesign Seitengrund, Wortmarke „Aufbruch“ (kleine Fassung, 16 bis 64 px) und Satzschrift. Vorher
   erschien hier noch Creme, die alte Wortmarke und „ROUTE WIRD GELADEN“ gesperrt (User 11.10.2026). */
html[data-design="d"][data-variante="b4"].boot-insp #insp-boot { background: var(--d-grund); gap: 18px; }
html[data-design="d"][data-variante="b4"] #insp-boot img { display: none; }
html[data-design="d"][data-variante="b4"] #insp-boot::before {
  content: ""; display: block; width: 150px; height: 44px;
  background: url("../CI/marke/routaris-wortmarke-klein.svg") center / contain no-repeat;
  animation: inspPulse 1.6s ease-in-out infinite;
}
html[data-design="d"][data-variante="b4"][data-modus="dunkel"] #insp-boot::before { background-image: url("../CI/marke/routaris-wortmarke-klein-dunkel.svg"); }
html[data-design="d"][data-variante="b4"] #insp-boot span { font: 500 16px/1.3 'Alegreya Sans', system-ui, sans-serif; letter-spacing: 0; text-transform: none; color: var(--b4-grau); }
@media (prefers-reduced-motion: reduce) {
  html[data-design="d"][data-variante="b4"] #insp-boot::before { animation: none; }
}
