/* Page layout badge_legend. Source: docs/design/referenz/10-so-arbeiten-wir.html. */
.bdg-head { font-size: 18px; font-weight: 800; margin-bottom: 12px; }
.bdg { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.bdg li { display: grid; grid-template-columns: 108px minmax(0, 1fr); gap: 12px; align-items: baseline; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 12px 14px; }
.bdg li .badge-s { justify-self: start; }
.bdg p { font-size: 14px; line-height: 1.45; color: var(--ink-2); }
.bdg-note { font-size: 14px; line-height: 1.5; color: var(--ink-2); margin-top: 12px; }

@container page (min-width: 900px) {
  .bdg { grid-template-columns: 1fr 1fr; }
  .bdg li { grid-template-columns: 1fr; gap: 8px; }
}