/* Seite /fuer-anbieter/ : nutzt die Tokens aus style.css (:root), mit Fallbacks */
.bp { padding: var(--s7, 48px) 0 var(--s8, 72px); }
.bp .bp-wrap { max-width: 760px; margin: 0 auto; padding: 0 var(--s5, 24px); }
.bp h1 { font-size: var(--fs-h1-page, 2.5rem); line-height: 1.05; letter-spacing: -0.03em; margin: var(--s2, 8px) 0 var(--s4, 16px); }
.bp .bp-lead { font-size: var(--fs-lead, 1.1875rem); color: var(--ink-2, #5E5E63); margin: 0 0 var(--s6, 32px); }
.bp .bp-eyebrow { font-weight: 800; font-size: var(--fs-small, .9375rem); color: var(--ink-2, #5E5E63); margin: 0; }
.bp h2 { font-size: 1.25rem; letter-spacing: -0.01em; margin: 0 0 var(--s3, 12px); }
.bp-step { background: var(--card, #fff); border: 1px solid var(--line, #ECE7DF); border-radius: var(--r-card, 24px); padding: var(--s5, 24px); margin: 0 0 var(--s4, 16px); box-shadow: var(--shadow, none); }
.bp-num { display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 999px; background: var(--lead, #FFD23F); color: var(--ink, #1D1D1F); font-weight: 900; font-size: .95rem; margin-right: var(--s2, 8px); vertical-align: 2px; }
.bp-field { display: block; width: 100%; box-sizing: border-box; font: inherit; font-size: 1rem; color: var(--ink, #1D1D1F); background: var(--bg, #FCFAF6); border: 1px solid var(--line, #ECE7DF); border-radius: var(--r-field, 12px); padding: 12px 14px; min-height: 48px; }
.bp-field:focus { outline: 2px solid var(--ink, #1D1D1F); outline-offset: 1px; }
.bp-field + .bp-field { margin-top: var(--s2, 8px); }
.bp-variants { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s3, 12px); }
.bp-variant { position: relative; display: grid; gap: var(--s2, 8px); justify-items: start; border: 2px solid var(--line, #ECE7DF); border-radius: var(--r-field, 12px); padding: var(--s3, 12px); cursor: pointer; background: var(--bg, #FCFAF6); }
.bp-variant input { position: absolute; opacity: 0; pointer-events: none; }
.bp-variant img { width: 100%; max-width: 220px; height: auto; display: block; }
.bp-variant span { font-weight: 700; font-size: var(--fs-small, .9375rem); }
.bp-variant:has(input:checked) { border-color: var(--ink, #1D1D1F); }
.bp-variant:has(input:focus-visible) { outline: 2px solid var(--ink, #1D1D1F); outline-offset: 2px; }
.bp-code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .8125rem; line-height: 1.5; min-height: 110px; resize: vertical; white-space: pre-wrap; word-break: break-all; }
.bp-row { display: flex; flex-wrap: wrap; gap: var(--s3, 12px); align-items: center; margin-top: var(--s3, 12px); }
.bp-btn { font: inherit; font-weight: 800; font-size: 1rem; border: 0; border-radius: 999px; padding: 12px 20px; min-height: 48px; background: var(--ink, #1D1D1F); color: var(--bg, #FCFAF6); cursor: pointer; }
.bp-btn:hover { opacity: .9; }
.bp-btn.is-done { background: var(--lead, #FFD23F); color: var(--ink, #1D1D1F); }
.bp-hint { color: var(--ink-2, #5E5E63); font-size: var(--fs-small, .9375rem); margin: var(--s2, 8px) 0 0; }
.bp-warn { display: block; }
.bp-has-entry .bp-warn { display: none; }
.bp-preview { margin-top: var(--s4, 16px); padding: var(--s4, 16px); border: 1px dashed var(--line, #ECE7DF); border-radius: var(--r-field, 12px); background: repeating-linear-gradient(45deg, transparent 0 10px, rgba(29,29,31,.025) 10px 20px); }
.bp-preview-label { font-size: .8125rem; font-weight: 700; color: var(--ink-2, #5E5E63); margin: 0 0 var(--s2, 8px); }
.bp-list { margin: 0; padding-left: 1.2em; }
.bp-list li { margin: 0 0 var(--s2, 8px); }
.bp-dl a { font-weight: 700; color: var(--ink, #1D1D1F); }
@media (max-width: 640px) {
  .bp .bp-wrap { padding: 0 16px; }
  .bp-step { padding: var(--s4, 16px); border-radius: 18px; }
  .bp-variants { grid-template-columns: minmax(0, 1fr); }
  .bp-btn { width: 100%; }
}