/* Mehrwert-Bausteine ohne Skript (Plan Mehrwert-Bausteine, freigegeben 13.11.2026, gebaut 14.11.2026).
   Nur auf Seiten geladen, die einen Baustein nutzen: <link rel="stylesheet" href="/mehrwert.css?v=1"> im Artikel.
   Inhalt steht immer als normale Liste im HTML, das CSS gestaltet ihn nur. Rueckweg: Zeile im Artikel loeschen.
   A. Kennzahlen: <div class="hv-kz"><div><b>10 Jahre</b><span>Erklaerung</span></div>…</div>
   B. Zeitstrahl:  <ol class="hv-zs"><li><b>Schritt</b><span>Erklaerung</span></li>…</ol>
      (Handy senkrecht, ab 760 px quer; bei mehr als 5 Schritten bleibt er senkrecht: Klasse hv-zs-lang) */

/* A. Kennzahlen */
.field-name-body .hv-kz{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:10px 0 14px}
.field-name-body .hv-kz > div{background:#eef4f7;border-radius:8px;padding:12px 14px}
.field-name-body .hv-kz b{display:block;font-size:26px;color:#266a83;line-height:1.15;margin-bottom:2px}
.field-name-body .hv-kz span{font-size:15px;color:#3b4650;line-height:1.4}

/* B. Zeitstrahl */
.field-name-body ol.hv-zs{list-style:none;counter-reset:hvzs;margin:12px 0 6px;padding:0 0 0 4px;position:relative}
.field-name-body ol.hv-zs::before{content:"";position:absolute;left:15px;top:8px;bottom:8px;width:3px;background:#cfdde4;border-radius:2px}
.field-name-body ol.hv-zs > li{counter-increment:hvzs;position:relative;margin:0;padding:0 0 16px 42px;border:0;background:none}
.field-name-body ol.hv-zs > li:last-child{padding-bottom:4px}
.field-name-body ol.hv-zs > li::before{content:counter(hvzs);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:#266a83;color:#fff;font-size:14px;font-weight:700;text-align:center;line-height:26px;box-shadow:0 0 0 4px #fff}
.field-name-body .rahmen ol.hv-zs > li::before{box-shadow:0 0 0 4px #f2f2f2}
.field-name-body ol.hv-zs > li b{display:block;color:#1d3b47;font-size:17px;line-height:1.3}
.field-name-body ol.hv-zs > li span{display:block;font-size:15px;color:#4a5560;line-height:1.45;margin-top:2px}
.field-name-body .hv-zs-quelle{font-size:14px;color:#5d6873;margin:8px 0 0}
@media (min-width:760px){
  .field-name-body ol.hv-zs:not(.hv-zs-lang){display:flex;padding:0}
  .field-name-body ol.hv-zs:not(.hv-zs-lang)::before{left:13px;right:13px;top:12px;bottom:auto;width:auto;height:3px}
  .field-name-body ol.hv-zs:not(.hv-zs-lang) > li{flex:1 1 0;padding:38px 12px 0 0}
}
@media print{
  .field-name-body ol.hv-zs > li::before{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}