/* ==========================================================================
   antares – Verblisterungsbereich (/verblisterung/)
   Ergänzende Komponenten. Alle Regeln sind über das Präfix .vb- bzw.
   body.is-verblisterung gekapselt und verändern bestehende Seiten nicht.
   Farben/Typografie folgen den Webflow-Variablen aus antares-apo-de-copy.css.
   ========================================================================== */

:root {
  --vb-blue: var(--blue, #357793);
  --vb-blue-dark: #1a5e7a;
  --vb-orange: var(--orange, #f5a201);
  --vb-purple: var(--purple, #bb2568);
  --vb-text: var(--text-dark, #424242);
  --vb-muted: #646363;
  --vb-light-blue: var(--light-blue, #e7f1f5);
  --vb-beige: #faf3e6;
  --vb-mint: var(--keycolor-03, #e7f5ee);
  --vb-line: #dfe3e8;
  --vb-card: #ffffff;
  --vb-radius: 10px;
}

/* Navigation: neuer Eintrag im Dropdown „Für Einrichtungen“ ---------------- */
.body.is-einrichtungen.is-verblisterung .uui-navbar08_dropdown-link.is-verblisterung,
.uui-navbar08_dropdown-link.is-verblisterung.w--current { color: #F5A201; }

/* Grundgerüst ------------------------------------------------------------- */
body.is-verblisterung { text-rendering: optimizeLegibility; }
.vb-section { padding-top: 64px; padding-bottom: 72px; }
.vb-section.is-tight { padding-top: 40px; padding-bottom: 48px; }
.vb-section.is-white { background-color: #fff; }
.vb-section.is-blue { background-color: var(--vb-light-blue); }
.vb-section + .vb-section.is-continued { padding-top: 0; }
.vb-headline { max-width: 820px; }
.vb-headline .headline-h2 { font-size: 2rem; }
.vb-headline .paragraph.big { line-height: 1.45; color: var(--vb-text); }
.vb-headline.is-center { margin-left: auto; margin-right: auto; text-align: center; }
.vb-mt-24 { margin-top: 24px; } .vb-mt-40 { margin-top: 40px; } .vb-mt-56 { margin-top: 56px; }
.vb-hidden { display: none !important; }
.vb-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* Hero-Ergänzungen --------------------------------------------------------- */
.vb-hero-meta { color: #fff; opacity: .92; font-size: .95rem; line-height: 1.5; margin-top: 18px; display: flex; flex-wrap: wrap; gap: 6px 18px; }
.vb-hero-meta span { display: inline-flex; align-items: center; gap: 6px; }
.vb-hero-meta svg { width: 16px; height: 16px; }
.is-verblisterung .title-subline-text { font-size: 1.15rem; }
.is-verblisterung .sub-sub-title-image { object-position: center 35%; }

/* Direktantwort ------------------------------------------------------------ */
.vb-answer { background: #fff; border: 1px solid var(--vb-line); border-left: 5px solid var(--vb-orange); border-radius: var(--vb-radius); padding: 24px 28px; max-width: 860px; }
.vb-answer-label { font-size: .8rem; letter-spacing: 1px; text-transform: uppercase; color: var(--vb-blue); font-weight: 500; margin-bottom: 8px; }
.vb-answer p { font-size: 1.15rem; line-height: 1.55; color: var(--vb-text); margin: 0; }
.vb-answer p + p { margin-top: 10px; }

/* Fließtext ---------------------------------------------------------------- */
.vb-prose { color: var(--vb-text); font-size: 1.0625rem; line-height: 1.65; max-width: 800px; }
.vb-prose > *:first-child { margin-top: 0; }
.vb-prose h2 { font-size: 1.75rem; font-weight: 500; line-height: 1.25; margin: 56px 0 16px; color: var(--vb-text); scroll-margin-top: 110px; }
.vb-prose h3 { font-size: 1.3rem; font-weight: 500; line-height: 1.3; margin: 32px 0 10px; color: var(--vb-blue); scroll-margin-top: 110px; }
.vb-prose h4 { font-size: 1.075rem; font-weight: 500; margin: 22px 0 6px; color: var(--vb-text); }
.vb-prose p { margin: 0 0 16px; }
.vb-prose a { color: var(--vb-blue); text-decoration: underline; text-underline-offset: 2px; }
.vb-prose a:hover { color: var(--vb-blue-dark); }
.vb-prose ul:not([class]), .vb-prose ol:not([class]) { margin: 0 0 18px; padding-left: 0; }
.vb-prose ul:not([class]) > li { list-style: none; position: relative; padding-left: 26px; margin-bottom: 8px; }
.vb-prose ul:not([class]) > li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 8px; height: 8px; border-radius: 50%; background: var(--vb-orange); }
.vb-prose ol:not([class]) { counter-reset: vbol; }
.vb-prose ol:not([class]) > li { list-style: none; position: relative; padding-left: 36px; margin-bottom: 10px; counter-increment: vbol; }
.vb-prose ol:not([class]) > li::before { content: counter(vbol); position: absolute; left: 0; top: .05em; width: 24px; height: 24px; border-radius: 50%; background: var(--vb-light-blue); color: var(--vb-blue); font-size: .85rem; font-weight: 500; display: flex; align-items: center; justify-content: center; }
.vb-prose strong { font-weight: 500; color: #2d2d2d; }
.vb-prose blockquote { margin: 24px 0; padding: 4px 0 4px 22px; border-left: 4px solid var(--vb-purple); font-size: 1.15rem; color: #333; }
.vb-prose .vb-answer, .vb-prose .vb-note, .vb-prose .vb-table-wrap, .vb-prose .vb-figure, .vb-prose .vb-flow, .vb-prose .vb-steps, .vb-prose .vb-checklist, .vb-prose .vb-card-grid, .vb-prose .vb-benefit-grid { margin: 24px 0 28px; }
.vb-prose.is-wide { max-width: none; }
.vb-lead { font-size: 1.25rem; line-height: 1.5; color: var(--vb-text); max-width: 820px; }

/* Artikel-Layout mit Inhaltsverzeichnis ------------------------------------ */
.vb-article { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 64px; align-items: start; }
.vb-article-aside { position: sticky; top: 96px; display: flex; flex-direction: column; gap: 20px; }
.vb-toc { background: #fff; border: 1px solid var(--vb-line); border-radius: var(--vb-radius); padding: 20px 22px; }
.vb-toc-title { font-size: .8rem; letter-spacing: 1px; text-transform: uppercase; color: var(--vb-muted); margin-bottom: 10px; }
.vb-toc ol { list-style: none; margin: 0; padding: 0; }
.vb-toc li { margin: 0; }
.vb-toc a { display: block; padding: 7px 0 7px 12px; border-left: 2px solid var(--vb-line); color: var(--vb-text); text-decoration: none; font-size: .95rem; line-height: 1.35; }
.vb-toc a:hover { color: var(--vb-blue); }
.vb-toc a.is-active { border-left-color: var(--vb-orange); color: var(--vb-blue); font-weight: 500; }
.vb-toc-mobile { display: none; background: #fff; border: 1px solid var(--vb-line); border-radius: var(--vb-radius); margin-bottom: 28px; }
.vb-toc-mobile > summary { cursor: pointer; padding: 16px 18px; font-weight: 500; color: var(--vb-blue); list-style: none; display: flex; justify-content: space-between; align-items: center; }
.vb-toc-mobile > summary::-webkit-details-marker { display: none; }
.vb-toc-mobile > summary::after { content: "+"; font-size: 1.4rem; line-height: 1; }
.vb-toc-mobile[open] > summary::after { content: "–"; }
.vb-toc-mobile ol { margin: 0; padding: 0 18px 14px; list-style: none; }
.vb-toc-mobile a { display: block; padding: 8px 0; color: var(--vb-text); text-decoration: none; border-top: 1px solid #eef0f3; }

/* Seitenkarte Ansprechpartner (Aside) */
.vb-person-card { background: #fff; border: 1px solid var(--vb-line); border-radius: var(--vb-radius); padding: 22px; text-align: left; }
.vb-person-head { display: flex; gap: 14px; align-items: center; margin-bottom: 14px; }
.vb-person-img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex: none; background: var(--vb-light-blue); }
.vb-person-name { font-size: 1.15rem; font-weight: 500; color: var(--vb-blue); line-height: 1.2; }
.vb-person-role { font-size: .88rem; color: var(--vb-muted); line-height: 1.35; margin-top: 3px; }
.vb-person-links { display: flex; flex-direction: column; gap: 8px; margin: 6px 0 14px; }
.vb-person-links a { display: inline-flex; align-items: center; gap: 8px; color: var(--vb-text); text-decoration: none; font-size: .95rem; word-break: break-word; }
.vb-person-links a:hover { color: var(--vb-blue); }
.vb-person-links svg { width: 18px; height: 18px; color: var(--vb-orange); flex: none; }
.vb-person-card .button-std { min-height: 48px; padding: 12px 16px; font-size: 1rem; }

/* Buttons ------------------------------------------------------------------ */
.vb-btn-row { display: flex; flex-wrap: wrap; gap: 12px; }
.vb-btn-row .button-std { width: auto; min-height: 52px; padding: 14px 24px; font-size: 1.05rem; }
.button-std.vb-btn-blue { background-color: var(--vb-blue); }
.button-std.vb-btn-ghost { background-color: transparent; color: var(--vb-blue); box-shadow: inset 0 0 0 2px var(--vb-blue); }
.button-std.vb-btn-ghost:hover { box-shadow: inset 0 0 0 2px var(--vb-blue-dark); color: var(--vb-blue-dark); }
.button-std.vb-btn-white { background-color: #fff; color: var(--vb-blue); }
.vb-textlink { color: var(--vb-blue); font-weight: 500; text-decoration: none; display: inline-flex; align-items: center; gap: 8px; }
.vb-textlink svg { width: 20px; height: 20px; transition: transform .2s; }
.vb-textlink:hover svg { transform: translateX(3px); }

/* Karten ------------------------------------------------------------------- */
.vb-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.vb-card-grid.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vb-card-grid.is-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.vb-card { background: var(--vb-card); border: 1px solid #eaecf0; border-radius: var(--vb-radius); overflow: hidden; display: flex; flex-direction: column; color: var(--vb-text); text-decoration: none; transition: transform .2s ease, box-shadow .2s ease; }
a.vb-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(16, 24, 40, .08); }
.vb-card-img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; display: block; background: var(--vb-light-blue); }
.vb-card-body { padding: 22px 22px 24px; display: flex; flex-direction: column; flex: 1; }
.vb-card-kicker { font-size: .78rem; letter-spacing: 1px; text-transform: uppercase; color: var(--vb-muted); margin-bottom: 8px; }
.vb-card-title { font-size: 1.25rem; font-weight: 500; line-height: 1.25; color: var(--vb-blue); margin: 0 0 10px; }
.vb-card-text { font-size: .98rem; line-height: 1.5; margin: 0 0 16px; color: var(--vb-text); }
.vb-card-list { list-style: none; padding: 0; margin: 0 0 16px; font-size: .95rem; line-height: 1.45; }
.vb-card-list li { padding-left: 20px; position: relative; margin-bottom: 6px; }
.vb-card-list li::before { content: ""; position: absolute; left: 2px; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: var(--vb-orange); }
.vb-card-link { margin-top: auto; color: var(--vb-blue); font-weight: 500; display: inline-flex; align-items: center; gap: 8px; }
.vb-card-link svg { width: 20px; height: 20px; transition: transform .2s; }
a.vb-card:hover .vb-card-link svg { transform: translateX(3px); }
.vb-card.is-target { border-top: 4px solid var(--vb-purple); }
.vb-card.is-service .vb-card-title { display: flex; gap: 12px; align-items: flex-start; }
.vb-card-icon { width: 44px; height: 44px; border-radius: 50%; background: var(--vb-light-blue); color: var(--vb-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; margin-bottom: 14px; }
.vb-card-icon svg { width: 22px; height: 22px; }

/* Nutzenmodule ------------------------------------------------------------- */
.vb-benefit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.vb-benefit-grid.is-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vb-benefit { background: #fff; border-radius: var(--vb-radius); padding: 26px; border: 1px solid #eaecf0; }
.vb-benefit h3 { font-size: 1.2rem; font-weight: 500; color: var(--vb-text); margin: 0 0 8px; line-height: 1.3; }
.vb-benefit p { margin: 0; font-size: .98rem; line-height: 1.55; color: var(--vb-text); }
.vb-benefit p + p { margin-top: 8px; }
.vb-benefit .vb-benefit-limit { font-size: .9rem; color: var(--vb-muted); border-top: 1px dashed var(--vb-line); padding-top: 10px; margin-top: 12px; }

/* Prozesskette ------------------------------------------------------------- */
.vb-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; counter-reset: vbflow; }
.vb-flow.is-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.vb-flow.is-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.vb-flow > li { counter-increment: vbflow; position: relative; background: #fff; border: 1px solid var(--vb-line); border-radius: var(--vb-radius); padding: 16px 14px 14px; display: flex; flex-direction: column; gap: 8px; min-height: 100%; }
.vb-flow > li::before { content: counter(vbflow, decimal-leading-zero); font-size: .8rem; color: var(--vb-muted); letter-spacing: .5px; }
.vb-flow > li:not(:last-child)::after { content: ""; position: absolute; right: -9px; top: 50%; width: 8px; height: 8px; border-top: 2px solid var(--vb-orange); border-right: 2px solid var(--vb-orange); transform: translateY(-50%) rotate(45deg); z-index: 2; }
.vb-flow-label { font-weight: 500; font-size: 1rem; line-height: 1.25; color: var(--vb-text); }
.vb-flow-text { font-size: .88rem; line-height: 1.4; color: var(--vb-muted); }
.vb-role { display: inline-block; align-self: flex-start; font-size: .75rem; line-height: 1; padding: 6px 8px; border-radius: 20px; font-weight: 500; letter-spacing: .2px; margin-top: auto; }
.vb-role.is-arzt { background: #e3eef3; color: var(--vb-blue-dark); }
.vb-role.is-apotheke { background: #fdeccc; color: #8a5a00; }
.vb-role.is-pflege { background: #f7e1eb; color: #8e1b4f; }
.vb-role.is-gemeinsam { background: var(--vb-mint); color: #1f6b4a; }
.vb-legend { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 16px; font-size: .9rem; color: var(--vb-muted); align-items: center; }

/* Nummerierte Schritte ---------------------------------------------------- */
.vb-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; counter-reset: vbstep; }
.vb-steps.is-list { grid-template-columns: 1fr; gap: 0; }
.vb-steps > li { counter-increment: vbstep; background: #fff; border: 1px solid #eaecf0; border-radius: var(--vb-radius); padding: 24px; position: relative; }
.vb-steps > li::before { content: counter(vbstep, decimal-leading-zero) "."; display: block; font-size: 2rem; font-weight: 300; color: var(--vb-orange); line-height: 1; margin-bottom: 12px; }
.vb-steps h3 { font-size: 1.2rem; font-weight: 500; margin: 0 0 8px; color: var(--vb-blue); line-height: 1.3; }
.vb-steps p { margin: 0; font-size: .98rem; line-height: 1.55; }
.vb-steps p + p { margin-top: 8px; }
.vb-steps.is-list > li { border-radius: 0; border-width: 0 0 1px 0; background: transparent; padding: 22px 0 22px 64px; }
.vb-steps.is-list > li::before { position: absolute; left: 0; top: 22px; font-size: 1.6rem; }

/* Tabellen / Vergleiche ---------------------------------------------------- */
.vb-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--vb-radius); border: 1px solid var(--vb-line); background: #fff; }
.vb-table { width: 100%; border-collapse: collapse; font-size: .97rem; line-height: 1.45; min-width: 560px; }
.vb-table caption { text-align: left; padding: 14px 18px; font-weight: 500; color: var(--vb-text); caption-side: top; }
.vb-table th, .vb-table td { padding: 14px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid #eef0f3; }
.vb-table thead th { background: var(--vb-blue); color: #fff; font-weight: 500; }
.vb-table tbody th { font-weight: 500; color: var(--vb-text); background: #f7f9fb; width: 26%; }
.vb-table tbody tr:last-child th, .vb-table tbody tr:last-child td { border-bottom: 0; }
.vb-table td.is-yes { color: #1f6b4a; } .vb-table td.is-limit { color: #8a5a00; }
.vb-table-note { font-size: .88rem; color: var(--vb-muted); margin-top: 10px; }

/* Hinweisboxen ------------------------------------------------------------- */
.vb-note { background: var(--vb-beige); border-radius: var(--vb-radius); padding: 22px 24px; border-left: 5px solid var(--vb-orange); color: var(--vb-text); }
.vb-note.is-info { background: var(--vb-light-blue); border-left-color: var(--vb-blue); }
.vb-note.is-legal { background: #f3f0f7; border-left-color: #6b5b95; }
.vb-note-title { font-weight: 500; margin-bottom: 6px; font-size: 1.05rem; }
.vb-note p { margin: 0; line-height: 1.55; }
.vb-note p + p, .vb-note ul { margin-top: 8px; }
.vb-note ul { margin-bottom: 0; }

/* Zweispalter Text + Bild -------------------------------------------------- */
.vb-split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.vb-split.is-reverse > :first-child { order: 2; }
.vb-split-img { width: 100%; height: auto; border-radius: var(--vb-radius); aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.vb-figure { margin: 0; }
.vb-figure img { width: 100%; height: auto; border-radius: var(--vb-radius); display: block; }
.vb-figure .vb-split-img { object-position: center 40%; }
.vb-figure figcaption { font-size: .88rem; color: var(--vb-muted); margin-top: 8px; line-height: 1.45; }

/* Zitat -------------------------------------------------------------------- */
.vb-quote { background: #fff; border-radius: var(--vb-radius); padding: 28px 32px; border-left: 5px solid var(--vb-purple); }
.vb-quote p { font-size: 1.25rem; line-height: 1.5; margin: 0 0 12px; color: #333; }
.vb-quote cite { font-style: normal; font-size: .95rem; color: var(--vb-muted); }

/* FAQ ---------------------------------------------------------------------- */
.vb-faq { max-width: 900px; }
.vb-faq-group-title { font-size: 1.3rem; font-weight: 500; color: var(--vb-blue); margin: 40px 0 6px; scroll-margin-top: 110px; }
.vb-faq-item { border-bottom: 1px solid #e3e6ea; }
.vb-faq-item > summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; padding: 20px 4px 20px 0; }
.vb-faq-item > summary::-webkit-details-marker { display: none; }
.vb-faq-item > summary h3, .vb-faq-q { font-size: 1.15rem; font-weight: 500; color: var(--vb-text); margin: 0; line-height: 1.35; }
.vb-faq-item > summary::after { content: ""; flex: none; width: 28px; height: 28px; border-radius: 50%; background: var(--vb-light-blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23357793' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / 16px no-repeat; transition: transform .2s; margin-top: -2px; }
.vb-faq-item[open] > summary::after { transform: rotate(45deg); }
.vb-faq-item > summary:hover h3 { color: var(--vb-blue); }
.vb-faq-item > summary:focus-visible { outline: 2px solid var(--vb-orange); outline-offset: 4px; }
.vb-faq-a { padding: 0 48px 22px 0; color: var(--vb-text); font-size: 1.02rem; line-height: 1.6; }
.vb-faq-a p { margin: 0 0 10px; } .vb-faq-a p:last-child { margin-bottom: 0; }
.vb-faq-a ul { margin: 6px 0 10px; padding-left: 20px; }
.vb-faq-a a { color: var(--vb-blue); }
.vb-faq-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 12px; }
.vb-chip { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 30px; background: #fff; border: 1px solid var(--vb-line); color: var(--vb-blue); text-decoration: none; font-size: .92rem; }
.vb-chip:hover { border-color: var(--vb-blue); }
.vb-faq-search { width: 100%; max-width: 520px; height: 52px; border-radius: 7px; border: 1px solid #c9d1d9; padding: 0 16px; font-size: 1rem; font-family: inherit; margin-bottom: 10px; }

/* Ansprechpartner-Banner (ergänzt die bestehende ap-box) ------------------- */
.vb-contact { background: var(--vb-blue); border-radius: var(--vb-radius); color: #fff; display: grid; grid-template-columns: 180px 1fr auto; gap: 32px; align-items: center; padding: 30px 34px; }
.vb-contact-img { width: 180px; height: 180px; border-radius: 50%; object-fit: cover; background: #fff; }
.vb-contact-kicker { font-size: .8rem; letter-spacing: 1px; text-transform: uppercase; opacity: .85; }
.vb-contact-name { font-size: 1.6rem; font-weight: 500; margin: 6px 0 4px; }
.vb-contact-role { opacity: .92; line-height: 1.4; }
.vb-contact-text { margin-top: 12px; line-height: 1.5; max-width: 560px; opacity: .95; }
.vb-contact-links { display: flex; flex-direction: column; gap: 10px; margin-top: 14px; }
.vb-contact-links a { color: #fff; text-decoration: none; display: inline-flex; gap: 10px; align-items: center; font-size: 1.02rem; }
.vb-contact-links a:hover { text-decoration: underline; }
.vb-contact-links svg { width: 20px; height: 20px; }
.vb-contact-actions { display: flex; flex-direction: column; gap: 12px; min-width: 250px; }
.vb-contact-actions .button-std { min-height: 52px; padding: 14px 20px; font-size: 1.02rem; }

/* Abschluss-CTA ------------------------------------------------------------ */
.vb-cta-final { background-image: linear-gradient(114deg, var(--vb-blue), var(--vb-blue-dark)); color: #fff; padding: 72px 5%; }
.vb-cta-final .headline-h2 { color: #fff; font-size: 2.1rem; max-width: 820px; }
.vb-cta-final p { color: #fff; font-size: 1.2rem; line-height: 1.5; max-width: 760px; margin: 16px 0 28px; opacity: .95; }

/* Drei Einstiegsangebote --------------------------------------------------- */
.vb-offer-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.vb-offer { background: #fff; border-radius: var(--vb-radius); border: 1px solid #eaecf0; padding: 28px; display: flex; flex-direction: column; }
.vb-offer-tag { font-size: .78rem; letter-spacing: 1px; text-transform: uppercase; color: var(--vb-purple); margin-bottom: 10px; font-weight: 500; }
.vb-offer h3 { font-size: 1.35rem; font-weight: 500; color: var(--vb-blue); margin: 0 0 10px; line-height: 1.25; }
.vb-offer p { margin: 0 0 18px; line-height: 1.55; }
.vb-offer .button-std { margin-top: auto; min-height: 52px; padding: 14px 18px; font-size: 1rem; }

/* Formular ----------------------------------------------------------------- */
.vb-form { background: #fff; border-radius: var(--vb-radius); border: 1px solid #eaecf0; padding: 32px; }
.vb-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 20px; }
.vb-field { display: flex; flex-direction: column; gap: 6px; }
.vb-field.is-full { grid-column: 1 / -1; }
.vb-field label, .vb-fieldset legend { font-weight: 500; font-size: .98rem; color: var(--vb-text); }
.vb-field .vb-hint { font-size: .86rem; color: var(--vb-muted); line-height: 1.4; }
.vb-field input, .vb-field select, .vb-field textarea { font-family: inherit; font-size: 1rem; color: var(--vb-text); border: 1px solid #c9d1d9; border-radius: 7px; padding: 13px 14px; background: #fff; min-height: 50px; width: 100%; box-sizing: border-box; }
.vb-field textarea { min-height: 130px; resize: vertical; line-height: 1.5; }
.vb-field input:focus, .vb-field select:focus, .vb-field textarea:focus { outline: none; border-color: var(--vb-blue); box-shadow: 0 0 0 3px rgba(53, 119, 147, .18); }
.vb-field.has-error input, .vb-field.has-error select, .vb-field.has-error textarea { border-color: #b42318; }
.vb-error { color: #b42318; font-size: .88rem; display: none; }
.vb-field.has-error .vb-error { display: block; }
.vb-fieldset { border: 0; padding: 0; margin: 0; grid-column: 1 / -1; }
.vb-options { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
.vb-option { position: relative; }
.vb-option input { position: absolute; opacity: 0; pointer-events: none; }
.vb-option span { display: inline-flex; align-items: center; min-height: 46px; padding: 10px 16px; border: 1px solid #c9d1d9; border-radius: 30px; cursor: pointer; font-size: .98rem; background: #fff; transition: all .15s; }
.vb-option input:checked + span { background: var(--vb-blue); border-color: var(--vb-blue); color: #fff; }
.vb-option input:focus-visible + span { outline: 2px solid var(--vb-orange); outline-offset: 2px; }
.vb-consent { display: flex; gap: 12px; align-items: flex-start; font-size: .92rem; line-height: 1.5; grid-column: 1 / -1; }
.vb-consent input { width: 20px; height: 20px; margin-top: 2px; flex: none; accent-color: var(--vb-blue); }
.vb-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.vb-form-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin-top: 6px; }
.vb-form-actions .button-std { width: auto; min-height: 54px; padding: 14px 28px; border: 0; cursor: pointer; font-family: inherit; }
.vb-form-status { grid-column: 1 / -1; border-radius: 8px; padding: 16px 18px; display: none; line-height: 1.5; }
.vb-form-status.is-success { display: block; background: var(--vb-mint); color: #1f5c40; }
.vb-form-status.is-info { display: block; background: var(--vb-light-blue); color: var(--vb-ink); }
.vb-form-status.is-error { display: block; background: #fdecea; color: #8a1c13; }
.vb-form-privacy { font-size: .86rem; color: var(--vb-muted); line-height: 1.5; grid-column: 1 / -1; }
.vb-form-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }
.vb-form-tabs button { font-family: inherit; font-size: .98rem; border: 1px solid #c9d1d9; background: #fff; color: var(--vb-blue); border-radius: 30px; padding: 11px 18px; cursor: pointer; }
.vb-form-tabs button[aria-pressed="true"] { background: var(--vb-blue); color: #fff; border-color: var(--vb-blue); }

/* Eignungscheck ------------------------------------------------------------ */
.vb-tool { background: #fff; border-radius: var(--vb-radius); border: 1px solid #eaecf0; padding: 32px; }
.vb-tool-progress { height: 6px; background: #eef0f3; border-radius: 6px; overflow: hidden; margin-bottom: 26px; }
.vb-tool-progress > span { display: block; height: 100%; width: 0; background: var(--vb-orange); transition: width .3s ease; }
.vb-q { display: none; }
.vb-q.is-active { display: block; }
.vb-q-count { font-size: .85rem; color: var(--vb-muted); margin-bottom: 6px; }
.vb-q h3 { font-size: 1.4rem; font-weight: 500; color: var(--vb-text); margin: 0 0 6px; line-height: 1.3; }
.vb-q-help { color: var(--vb-muted); margin: 0 0 18px; line-height: 1.5; }
.vb-q-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.vb-q-options label { position: relative; display: block; cursor: pointer; }
.vb-q-options input { position: absolute; opacity: 0; }
.vb-q-options span { display: block; border: 1px solid #c9d1d9; border-radius: 8px; padding: 16px 18px; line-height: 1.4; background: #fff; transition: all .15s; min-height: 100%; box-sizing: border-box; }
.vb-q-options input:checked + span { border-color: var(--vb-blue); background: var(--vb-light-blue); box-shadow: inset 0 0 0 1px var(--vb-blue); }
.vb-q-options input:focus-visible + span { outline: 2px solid var(--vb-orange); outline-offset: 2px; }
.vb-q-nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 24px; }
.vb-q-nav button { font-family: inherit; font-size: 1rem; border-radius: 7px; padding: 14px 22px; cursor: pointer; border: 0; }
.vb-q-prev { background: transparent; color: var(--vb-blue); box-shadow: inset 0 0 0 2px var(--vb-blue); }
.vb-q-next { background: var(--vb-orange); color: #fff; }
.vb-q-next[disabled] { opacity: .45; cursor: not-allowed; }
.vb-result { display: none; }
.vb-result.is-active { display: block; }
.vb-result-badge { display: inline-block; font-size: .85rem; letter-spacing: .6px; text-transform: uppercase; padding: 7px 12px; border-radius: 20px; background: var(--vb-light-blue); color: var(--vb-blue); margin-bottom: 12px; font-weight: 500; }
.vb-result-badge.is-high { background: var(--vb-mint); color: #1f6b4a; }
.vb-result-badge.is-mid { background: #fdeccc; color: #8a5a00; }
.vb-result h3 { font-size: 1.6rem; font-weight: 500; margin: 0 0 10px; color: var(--vb-text); }
.vb-result ul { margin: 10px 0 18px; padding-left: 20px; line-height: 1.55; }

/* Aufwandsrechner ---------------------------------------------------------- */
.vb-calc { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 32px; align-items: start; }
.vb-calc-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }
.vb-calc-out { background: var(--vb-light-blue); border-radius: var(--vb-radius); padding: 26px; position: sticky; top: 96px; }
.vb-calc-out h3 { margin: 0 0 14px; font-size: 1.25rem; font-weight: 500; color: var(--vb-blue); }
.vb-calc-row { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid rgba(53, 119, 147, .18); font-size: .98rem; }
.vb-calc-row strong { font-weight: 500; white-space: nowrap; }
.vb-calc-row.is-total { font-size: 1.15rem; border-bottom: 0; padding-top: 14px; }
.vb-calc-row.is-total strong { color: var(--vb-blue-dark); font-size: 1.35rem; }
.vb-calc-assume { font-size: .86rem; color: var(--vb-muted); margin-top: 14px; line-height: 1.5; }

/* Checkliste (druckbar) ---------------------------------------------------- */
.vb-checklist { list-style: none; margin: 0; padding: 0; counter-reset: vbcheck; }
.vb-checklist > li { counter-increment: vbcheck; position: relative; padding: 18px 0 18px 58px; border-bottom: 1px solid #e3e6ea; }
.vb-checklist > li::before { content: counter(vbcheck); position: absolute; left: 0; top: 16px; width: 36px; height: 36px; border-radius: 8px; border: 2px solid var(--vb-blue); color: var(--vb-blue); display: flex; align-items: center; justify-content: center; font-weight: 500; }
.vb-checklist h3 { font-size: 1.15rem; font-weight: 500; color: var(--vb-text); margin: 0 0 6px; }
.vb-checklist p { margin: 0; line-height: 1.55; }
.vb-print { display: inline-flex; gap: 8px; align-items: center; background: transparent; border: 1px solid var(--vb-blue); color: var(--vb-blue); border-radius: 7px; padding: 10px 16px; cursor: pointer; font-family: inherit; font-size: .95rem; }
.vb-print svg { width: 18px; height: 18px; }

/* Meta-Zeile, Quellen ------------------------------------------------------ */
.vb-meta { display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: .9rem; color: var(--vb-muted); padding: 14px 0; border-top: 1px solid #e3e6ea; border-bottom: 1px solid #e3e6ea; margin-bottom: 28px; }
.vb-meta span { display: inline-flex; gap: 6px; align-items: center; }
.vb-meta svg { width: 16px; height: 16px; color: var(--vb-blue); }
.vb-sources { font-size: .9rem; color: var(--vb-muted); line-height: 1.55; }
.vb-sources ol { padding-left: 20px; margin: 8px 0 0; }
.vb-sources li { margin-bottom: 6px; }
.vb-sources a { color: var(--vb-blue); word-break: break-word; }

/* Regionen ----------------------------------------------------------------- */
.vb-region-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.vb-region { background: #fff; border: 1px solid #eaecf0; border-radius: var(--vb-radius); padding: 20px; }
.vb-region h3 { margin: 0 0 6px; font-size: 1.1rem; font-weight: 500; color: var(--vb-blue); }
.vb-region p { margin: 0; font-size: .95rem; line-height: 1.5; }

/* Startseiten-Teaser (index.html) ----------------------------------------- */
.vb-home-teaser { margin-top: 20px; }
.vb-home-teaser .vb-home-badge { display: inline-block; font-size: .75rem; letter-spacing: 1px; text-transform: uppercase; background: var(--purple, #bb2568); color: #fff; padding: 6px 10px; border-radius: 4px; margin-bottom: 14px; }
.vb-crosslink { background: #fff; border: 1px solid #eaecf0; border-left: 5px solid var(--purple, #bb2568); border-radius: 10px; padding: 26px 28px; display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; }
.vb-crosslink h3 { margin: 0 0 8px; font-size: 1.35rem; font-weight: 500; color: var(--blue, #357793); line-height: 1.3; }
.vb-crosslink p { margin: 0; line-height: 1.5; color: var(--text-dark, #424242); }
.vb-crosslink ul { list-style: none; padding: 0; margin: 12px 0 0; display: flex; flex-wrap: wrap; gap: 8px 18px; }
.vb-crosslink ul a { color: var(--blue, #357793); text-decoration: none; font-weight: 500; }
.vb-crosslink ul a:hover { text-decoration: underline; }
.vb-crosslink .button-std { width: auto; min-height: 52px; padding: 14px 22px; font-size: 1rem; white-space: nowrap; }

/* Mobile Kontaktleiste ----------------------------------------------------- */
.vb-mobile-bar { display: none; }

/* Responsiv ---------------------------------------------------------------- */
@media screen and (max-width: 991px) {
  .vb-article { grid-template-columns: 1fr; gap: 32px; }
  .vb-article-aside { position: static; }
  .vb-article-aside .vb-toc { display: none; }
  .vb-toc-mobile { display: block; }
  .vb-card-grid, .vb-card-grid.is-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vb-benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vb-flow, .vb-flow.is-6, .vb-flow.is-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .vb-flow > li::after { display: none; }
  .vb-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .vb-steps.is-list { grid-template-columns: 1fr; }
  .vb-split { grid-template-columns: 1fr; gap: 28px; }
  .vb-split.is-reverse > :first-child { order: 0; }
  .vb-contact { grid-template-columns: 120px 1fr; }
  .vb-contact-img { width: 120px; height: 120px; }
  .vb-contact-actions { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; min-width: 0; }
  .vb-contact-actions .button-std { width: auto; flex: 1 1 220px; }
  .vb-offer-grid { grid-template-columns: 1fr; }
  .vb-calc { grid-template-columns: 1fr; }
  .vb-calc-out { position: static; }
  .vb-region-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (max-width: 767px) {
  .vb-section { padding-top: 44px; padding-bottom: 52px; }
  .vb-headline .headline-h2 { font-size: 1.6rem; }
  .vb-card-grid, .vb-card-grid.is-2, .vb-card-grid.is-4, .vb-benefit-grid, .vb-benefit-grid.is-2, .vb-steps, .vb-region-grid { grid-template-columns: 1fr; }
  .vb-flow, .vb-flow.is-6, .vb-flow.is-5 { grid-template-columns: 1fr; }
  .vb-flow > li { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
  .vb-flow > li .vb-flow-text { flex-basis: 100%; }
  .vb-flow > li .vb-role { margin-top: 0; }
  .vb-prose { font-size: 1.02rem; }
  .vb-prose h2 { font-size: 1.5rem; margin-top: 44px; }
  .vb-answer { padding: 20px; }
  .vb-answer p { font-size: 1.05rem; }
  .vb-form, .vb-tool { padding: 22px 18px; }
  .vb-form-grid, .vb-calc-inputs, .vb-q-options { grid-template-columns: 1fr; }
  .vb-contact { grid-template-columns: 1fr; text-align: left; padding: 24px 20px; gap: 18px; }
  .vb-contact-img { width: 110px; height: 110px; }
  .vb-cta-final .headline-h2 { font-size: 1.6rem; }
  .vb-btn-row .button-std { width: 100%; }
  .vb-crosslink { grid-template-columns: 1fr; }
  .vb-crosslink .button-std { width: 100%; }
  .vb-steps.is-list > li { padding-left: 52px; }
  .vb-faq-a { padding-right: 0; }
  .vb-table { min-width: 0; }
  .vb-table.is-stack thead { display: none; }
  .vb-table.is-stack, .vb-table.is-stack tbody, .vb-table.is-stack tr, .vb-table.is-stack th, .vb-table.is-stack td { display: block; width: auto; }
  .vb-table.is-stack tr { border-bottom: 1px solid var(--vb-line); padding: 6px 0; }
  .vb-table.is-stack tbody th { background: #f7f9fb; }
  .vb-table.is-stack td { border-bottom: 0; padding: 8px 18px; }
  .vb-table.is-stack td::before { content: attr(data-label); display: block; font-size: .8rem; letter-spacing: .5px; text-transform: uppercase; color: var(--vb-muted); margin-bottom: 2px; }
  body.is-verblisterung { padding-bottom: 72px; }
  .vb-mobile-bar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; background: #fff; box-shadow: 0 -4px 18px rgba(16, 24, 40, .12); padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); gap: 10px; transform: translateY(110%); transition: transform .25s ease; }
  .vb-mobile-bar.is-visible { transform: translateY(0); }
  .vb-mobile-bar a { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 50px; border-radius: 7px; text-decoration: none; font-weight: 500; font-size: 1rem; }
  .vb-mobile-bar a svg { width: 20px; height: 20px; }
  .vb-mobile-bar .is-call { background: var(--vb-light-blue); color: var(--vb-blue); }
  .vb-mobile-bar .is-request { background: var(--vb-orange); color: #fff; }
}
@media (prefers-reduced-motion: reduce) {
  .vb-card, .vb-mobile-bar, .vb-tool-progress > span, .vb-faq-item > summary::after { transition: none; }
}

/* Druck (Checklisten, Leitfäden) ------------------------------------------ */
@media print {
  body.is-verblisterung .uui-navbar08_component, body.is-verblisterung .footer, body.is-verblisterung .is-certified,
  body.is-verblisterung .vb-mobile-bar, body.is-verblisterung .vb-article-aside, body.is-verblisterung .vb-toc-mobile,
  body.is-verblisterung .vb-cta-final, body.is-verblisterung .vb-print, body.is-verblisterung .sub-sub-page-image-wrapper,
  body.is-verblisterung .button-row, body.is-verblisterung .vb-noprint, body.is-verblisterung .modal-wrapper, body.is-verblisterung .termin-modal { display: none !important; }
  body.is-verblisterung .new-title-section { background: none !important; color: #000; padding: 0 !important; }
  body.is-verblisterung .title-h1, body.is-verblisterung .title-subline-text, body.is-verblisterung .breadcrumb-link { color: #000 !important; }
  body.is-verblisterung .vb-article { display: block; }
  body.is-verblisterung .udesly-section { background: #fff !important; padding: 12px 0 !important; }
  body.is-verblisterung .vb-faq-item:not([open]) .vb-faq-a { display: block; }
  body.is-verblisterung a { color: #000; }
  .vb-checklist > li { break-inside: avoid; }
}

/* Linkfarbe in Hinweisboxen und Karten an die Bereichstypografie angleichen */
.vb-note a, .vb-answer a, .vb-benefit a, .vb-region a, .vb-offer a:not(.button-std), .vb-table a { color: var(--vb-blue); text-decoration: underline; text-underline-offset: 2px; }

/* hidden-Attribut immer respektieren (z. B. Rechnerzeilen, Formularfelder, FAQ-Filter) */
body.is-verblisterung [hidden] { display: none !important; }
.vb-prose .vb-steps h3, .vb-prose .vb-checklist h3 { margin-top: 0; }
.vb-prose .vb-flow > li, .vb-prose .vb-steps > li, .vb-prose .vb-checklist > li { margin-bottom: 0; }
.vb-faq-empty { background: #fff; border: 1px dashed var(--vb-line); border-radius: var(--vb-radius); padding: 18px 20px; margin: 16px 0; }
.vb-prose .vb-toc-mobile ol > li { padding-left: 0; margin: 0; }
.vb-prose .vb-toc-mobile ol > li::before { display: none; }
.vb-prose .vb-sources ol > li { padding-left: 30px; }

.vb-q legend { padding: 0; margin: 0 0 6px; border: 0; width: 100%; }
.vb-q legend h3 { margin: 0; }
.vb-form .vb-fieldset legend { margin-bottom: 4px; }
.vb-prose .vb-form p { margin: 0; }
/* Webflow setzt label {font-weight:bold} – im Bereich gezielt zurücksetzen */
.vb-q-options label, .vb-option, .vb-consent, .vb-tool label, .vb-form label.vb-consent { font-weight: 400; margin-bottom: 0; }
.vb-field > label { font-weight: 500; margin-bottom: 0; }
.vb-q-options strong { font-weight: 500; }
.vb-q-count { display: block; }
.vb-toc ol { max-height: calc(100vh - 380px); overflow-y: auto; overscroll-behavior: contain; }

/* ==========================================================================
   Gestaltung Stufe 2 (Oktober 2026)
   Leitmotiv: der Beutelstrang – Prozesse erscheinen als Folge versiegelter
   Beutel mit Perforation; Etiketten-Optik für Kurzantworten und Fakten.
   Farbcode der Seitentypen (Karten, Hero-Kennung):
   Leistung blau · Zielgruppe Beere · Praxisthema Orange · Region Petrol ·
   Wissen Tiefblau · Werkzeug/Kontakt Grün
   ========================================================================== */
:root {
  --vb-teal: #2f8f8a;
  --vb-ink: #2b3a42;
  --vb-paper: #f6f8fa;
  --vb-perf: radial-gradient(circle at 50% 50%, #fff 0 3px, transparent 3.5px);
  --g-leistungen: var(--vb-blue);
  --g-zielgruppen: var(--vb-purple);
  --g-themen: #d98a00;
  --g-region: var(--vb-teal);
  --g-wissen: var(--vb-blue-dark);
  --g-werkzeuge: #2e7d57;
  --g-kontakt: #2e7d57;
  --g-hub: var(--vb-blue);
}

/* Typografie: ruhigere, größere Überschriften mit Gewichtskontrast */
.is-verblisterung .vb-headline .headline-h2 { font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.45rem); font-weight: 300; line-height: 1.18; letter-spacing: -.01em; color: var(--vb-ink); }
.is-verblisterung .vb-prose h2 { font-size: clamp(1.55rem, 1.2rem + 1vw, 1.95rem); font-weight: 400; letter-spacing: -.005em; color: var(--vb-ink); }
.is-verblisterung .vb-prose h2::before { content: ""; display: block; width: 36px; height: 4px; border-radius: 2px; background: var(--vb-orange); margin-bottom: 14px; }
.is-verblisterung .vb-prose p, .is-verblisterung .vb-prose li { max-width: 72ch; }

/* Hero-Kennung des Seitentyps */
.vb-hero-type { display: inline-flex; align-items: center; gap: 10px; font-size: .95rem; font-weight: 500; color: #fff; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.35); border-radius: 30px; padding: 6px 14px 6px 10px; margin-bottom: 16px; backdrop-filter: blur(2px); }
.vb-hero-type::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--vb-orange); box-shadow: 0 0 0 3px rgba(255,255,255,.35); }
.vb-hero-type-sep { width: 1px; height: 14px; background: rgba(255,255,255,.5); }

/* Lesefortschritt (nur Artikel) */
.vb-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 9999; pointer-events: none; }
.vb-progress > span { display: block; height: 100%; width: 100%; background: var(--vb-orange); transform-origin: 0 50%; transform: scaleX(0); }

/* Kurzantwort im Etikett-Stil (wie das Etikett eines Blisterbeutels) */
.vb-answer { position: relative; border: 0; border-left: 0; border-radius: 14px; padding: 0; box-shadow: 0 1px 0 rgba(16,24,40,.04), 0 0 0 1px var(--vb-line); overflow: hidden; }
.vb-answer-label { margin: 0; padding: 12px 28px 12px 34px; background: var(--vb-blue); color: #fff; text-transform: none; letter-spacing: 0; font-size: .95rem; font-weight: 500; }
.vb-answer > p { padding: 0 28px 0 34px; }
.vb-answer > p:first-of-type { padding-top: 20px; }
.vb-answer > p:last-child { padding-bottom: 22px; }
.vb-answer::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 14px; background: linear-gradient(var(--vb-orange), var(--vb-orange)) right / 4px 100% no-repeat; }
.vb-answer::after { content: ""; position: absolute; left: 3px; top: 50px; bottom: 8px; width: 6px; background-image: radial-gradient(circle, #dfe3e8 0 2px, transparent 2.5px); background-size: 6px 12px; background-repeat: repeat-y; }

/* Prozess als Beutelstrang */
.vb-flow { gap: 0; padding: 18px 0 6px; position: relative; }
.vb-flow::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: repeating-linear-gradient(90deg, #c9d6de 0 8px, transparent 8px 14px); z-index: 0; }
.vb-flow > li { border: 1.5px solid #cfdbe2; border-radius: 16px 16px 12px 12px; background: #fff; padding: 0 14px 16px; margin: 0 6px; overflow: hidden; z-index: 1; box-shadow: 0 8px 18px -12px rgba(26,94,122,.35); }
.vb-flow > li::before { content: counter(vbflow); display: flex; align-items: center; justify-content: space-between; margin: 0 -14px 6px; padding: 7px 14px; font-size: .78rem; font-weight: 500; color: var(--vb-blue-dark); letter-spacing: .3px;
  background: repeating-linear-gradient(90deg, #eaf2f6 0 3px, #f6fafc 3px 6px); border-bottom: 1.5px dashed #cfdbe2; }
.vb-flow > li:not(:last-child)::after { right: -11px; width: 10px; height: 10px; border: 0; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px var(--vb-orange); transform: translateY(-50%); }
.vb-flow > li:has(.vb-role.is-apotheke) { border-color: #f1cf86; }
.vb-flow > li:has(.vb-role.is-apotheke)::before { background: repeating-linear-gradient(90deg, #fdf1d8 0 3px, #fff8ea 3px 6px); border-bottom-color: #f1cf86; color: #8a5a00; }
.vb-flow > li:has(.vb-role.is-pflege) { border-color: #e6b4ca; }
.vb-flow > li:has(.vb-role.is-pflege)::before { background: repeating-linear-gradient(90deg, #f9e6ee 0 3px, #fdf3f7 3px 6px); border-bottom-color: #e6b4ca; color: #8e1b4f; }
.vb-flow-label { font-size: 1.02rem; color: var(--vb-ink); margin-top: 4px; }
@media (prefers-reduced-motion: no-preference) {
  .vb-flow.vb-anim > li { opacity: 0; transform: translateY(14px) scale(.98); transition: opacity .45s ease, transform .45s ease; }
  .vb-flow.vb-anim.is-in > li { opacity: 1; transform: none; }
  .vb-flow.vb-anim.is-in > li:nth-child(2) { transition-delay: .08s; } .vb-flow.vb-anim.is-in > li:nth-child(3) { transition-delay: .16s; }
  .vb-flow.vb-anim.is-in > li:nth-child(4) { transition-delay: .24s; } .vb-flow.vb-anim.is-in > li:nth-child(5) { transition-delay: .32s; }
  .vb-flow.vb-anim.is-in > li:nth-child(6) { transition-delay: .40s; } .vb-flow.vb-anim.is-in > li:nth-child(7) { transition-delay: .48s; }
}

/* Schritte als Zeitleiste (vertikale Liste) */
.vb-steps.is-list { position: relative; }
.vb-steps.is-list::before { content: ""; position: absolute; left: 21px; top: 30px; bottom: 30px; width: 2px; background: repeating-linear-gradient(180deg, #cfdbe2 0 6px, transparent 6px 11px); }
.vb-steps.is-list > li { border: 0; padding: 18px 0 18px 70px; }
.vb-steps.is-list > li::before { content: counter(vbstep); left: 0; top: 16px; width: 44px; height: 44px; border-radius: 12px; background: #fff; border: 2px solid var(--vb-orange); color: var(--vb-ink); font-size: 1.15rem; font-weight: 500; display: flex; align-items: center; justify-content: center; margin: 0; }
.vb-steps:not(.is-list) > li { border-top: 4px solid var(--vb-orange); }

/* Karten: Farbcode nach Seitentyp, ruhige Interaktion */
.vb-card { border-color: #e4e8ec; }
a.vb-card:hover { transform: none; box-shadow: none; border-color: var(--g, var(--vb-blue)); }
a.vb-card:hover .vb-card-title { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.vb-card.is-g-leistungen { --g: var(--g-leistungen); } .vb-card.is-g-zielgruppen { --g: var(--g-zielgruppen); }
.vb-card.is-g-themen { --g: var(--g-themen); } .vb-card.is-g-region { --g: var(--g-region); }
.vb-card.is-g-wissen { --g: var(--g-wissen); } .vb-card.is-g-werkzeuge, .vb-card.is-g-kontakt { --g: var(--g-werkzeuge); }
.vb-card[class*="is-g-"] { box-shadow: inset 0 4px 0 var(--g); }
.vb-card.is-target { border-top: 1px solid #e4e8ec; }
.vb-card-kicker { text-transform: none; letter-spacing: 0; font-size: .86rem; font-weight: 500; color: var(--g, var(--vb-muted)); display: inline-flex; align-items: center; gap: 7px; }
.vb-card-kicker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--g, var(--vb-orange)); }
.vb-card-title { color: var(--vb-ink); }
.vb-card.is-noimg .vb-card-body { padding-top: 26px; }
.vb-card-icon { background: color-mix(in srgb, var(--g, var(--vb-blue)) 12%, #fff); color: var(--g, var(--vb-blue)); border-radius: 12px; }
.vb-card-img { transition: transform .5s ease; }
a.vb-card:hover .vb-card-img { transform: scale(1.03); }

/* Nutzenkacheln */
.vb-benefit { border-color: #e4e8ec; position: relative; }
.vb-benefit .vb-card-icon { border-radius: 12px; }
.vb-benefit .vb-benefit-limit { border-top-style: dashed; }

/* Tabellen: Faktentabellen im Etikett-Stil */
.vb-table-wrap { border-radius: 14px; border-color: #dbe3e9; }
.vb-table caption { background: var(--vb-paper); border-bottom: 1px dashed #cfdbe2; font-size: 1rem; color: var(--vb-ink); padding: 14px 18px 14px 44px; position: relative; }
.vb-table caption::before { content: ""; position: absolute; left: 18px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-radius: 4px; background: var(--vb-orange); box-shadow: 4px 4px 0 -1px #fff, 4px 4px 0 0 var(--vb-blue); }
.vb-table thead th { background: var(--vb-ink); font-size: .92rem; }
.vb-table tbody tr:nth-child(even) td { background: #fbfcfd; }
.vb-table tbody th { background: #f4f7f9; color: var(--vb-ink); }

/* Hinweisboxen */
.vb-note { border-left-width: 0; box-shadow: inset 4px 0 0 var(--vb-orange); border-radius: 12px; }
.vb-note.is-info { box-shadow: inset 4px 0 0 var(--vb-blue); }
.vb-note.is-legal { box-shadow: inset 4px 0 0 #6b5b95; }
.vb-note-title { color: var(--vb-ink); }

/* Checkliste: Häkchen-Kästchen statt Zahlen-Kästchen */
.vb-checklist > li::before { border-radius: 10px; border-color: var(--vb-teal); color: var(--vb-teal); background: #fff; }

/* Zitat */
.vb-quote { border-left: 0; position: relative; padding-left: 64px; box-shadow: 0 0 0 1px #e4e8ec; }
.vb-quote::before { content: "„"; position: absolute; left: 22px; top: 6px; font-size: 4.2rem; line-height: 1; color: var(--vb-purple); font-weight: 300; }

/* Kontaktbanner und Abschluss */
.vb-contact { border-radius: 18px; background: linear-gradient(120deg, var(--vb-blue) 0%, var(--vb-blue-dark) 100%); position: relative; overflow: hidden; }
.vb-contact::after { content: ""; position: absolute; right: -60px; top: -60px; width: 260px; height: 260px; border-radius: 50%; border: 22px solid rgba(255,255,255,.06); }
.vb-contact-kicker { text-transform: none; letter-spacing: 0; font-size: .95rem; }
.vb-contact-img { box-shadow: 0 0 0 6px rgba(255,255,255,.18); }
.vb-cta-final { position: relative; overflow: hidden; }
.vb-cta-final::after { content: ""; position: absolute; right: 4%; bottom: -40px; width: 340px; height: 120px; opacity: .14;
  background: repeating-linear-gradient(90deg, #fff 0 54px, transparent 54px 66px); border-radius: 14px; -webkit-mask: linear-gradient(#000 0 0); }

/* Inhaltsverzeichnis, Meta */
.vb-toc { border-radius: 14px; }
.vb-toc-title { text-transform: none; letter-spacing: 0; font-size: .95rem; font-weight: 500; color: var(--vb-ink); }
.vb-meta { border-style: dashed; }

/* FAQ */
.vb-faq-item > summary h3 { color: var(--vb-ink); }
.vb-faq-item[open] { background: linear-gradient(90deg, rgba(231,241,245,.55), transparent 70%); border-radius: 10px; }
.vb-faq-item[open] > summary { padding-left: 14px; }
.vb-faq-item[open] > .vb-faq-a { padding-left: 14px; }

/* Schematische Karte des Versorgungsgebiets */
.vb-map { margin: 0; background: #fff; border-radius: 18px; box-shadow: 0 0 0 1px #e1e7ec; padding: 18px 18px 14px; }
.vb-map-svg { display: block; width: 100%; height: auto; font-family: inherit; }
.vb-map-r polygon { stroke: #fff; stroke-width: 6; stroke-linejoin: round; transition: fill .2s ease; }
.vb-map-r text { font-size: 15px; font-weight: 500; fill: var(--vb-ink); pointer-events: none; }
.vb-map-r.is-nachbar polygon { fill: #d7ebe9; }
.vb-map-r.is-nachbar:hover polygon, .vb-map-r.is-nachbar:focus polygon { fill: #b6dbd7; }
.vb-map-r.is-kein polygon { fill: url(#vbmap-hatch); }
.vb-map-r.is-kein text { fill: #6b7378; }
.vb-map-r.is-hamburg polygon { fill: var(--vb-blue); }
.vb-map-r.is-hamburg:hover polygon { fill: var(--vb-blue-dark); }
.vb-map-r.is-hamburg text { fill: #fff; font-size: 20px; }
.vb-map-r.is-current polygon { fill: var(--vb-orange) !important; }
.vb-map-r.is-current text { fill: #3b2a00; }
.vb-map-r:focus { outline: none; }
.vb-map-r:focus-visible polygon { stroke: var(--vb-orange); stroke-width: 4; }
.vb-map-elbe { fill: none; stroke: #8fc1d6; stroke-width: 9; stroke-linecap: round; opacity: .85; pointer-events: none; }
.vb-map-elbe-label { font-size: 13px; font-style: italic; fill: #4e8aa3; }
.vb-map-pin circle:last-child { fill: var(--vb-orange); stroke: #fff; stroke-width: 3; }
.vb-map-pulse { fill: rgba(245,162,1,.35); }
.vb-map-pin-label { font-size: 13px; font-weight: 500; fill: #fff; }
@media (prefers-reduced-motion: no-preference) {
  .vb-map-pulse { transform-origin: 448px 262px; animation: vbpulse 2.4s ease-out infinite; }
  @keyframes vbpulse { 0% { transform: scale(.6); opacity: 1; } 100% { transform: scale(2.2); opacity: 0; } }
}
.vb-map-legend { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: .9rem; color: var(--vb-text); margin-top: 10px; padding-top: 12px; border-top: 1px dashed #dbe3e9; }
.vb-map-legend span { display: inline-flex; align-items: center; gap: 8px; }
.vb-map-legend i { width: 16px; height: 16px; border-radius: 4px; display: inline-block; }
.vb-map-legend i.is-hh { background: var(--vb-blue); } .vb-map-legend i.is-nb { background: #d7ebe9; box-shadow: inset 0 0 0 1px #9fcfca; }
.vb-map-legend i.is-kein { background: repeating-linear-gradient(45deg, #f1f2f4 0 3px, #d5d9de 3px 5px); }
.vb-map-note { color: var(--vb-muted); flex-basis: 100%; font-size: .84rem; }
.vb-map-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 48px; align-items: center; }

/* Bildmosaik aus dem Verblisterungsraum */
.vb-gallery { display: grid; grid-template-columns: 1.4fr 1fr 1fr; grid-auto-rows: 210px; gap: 14px; }
.vb-gallery-item { margin: 0; position: relative; overflow: hidden; border-radius: 14px; background: var(--vb-light-blue); }
.vb-gallery-item.is-lead { grid-row: span 2; }
.vb-gallery-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vb-gallery-item figcaption { position: absolute; left: 10px; right: 10px; bottom: 10px; background: rgba(43,58,66,.82); color: #fff; font-size: .86rem; line-height: 1.35; padding: 8px 11px; border-radius: 9px; }

/* Kennzahlen (nur belegte Werte mit Quelle) */
.vb-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0; margin: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 0 0 1px #dbe3e9; background: #fff; }
.vb-stat { padding: 22px 24px; display: flex; flex-direction: column-reverse; gap: 6px; border-right: 1px dashed #dbe3e9; }
.vb-stat:last-child { border-right: 0; }
.vb-stat dt { font-size: .98rem; line-height: 1.4; color: var(--vb-text); }
.vb-stat dd { margin: 0; display: flex; flex-direction: column; gap: 4px; }
.vb-stat-value { font-size: 2.6rem; font-weight: 300; line-height: 1; color: var(--vb-blue-dark); letter-spacing: -.02em; }
.vb-stat-src { font-size: .8rem; color: var(--vb-muted); order: 2; }

@media screen and (max-width: 991px) {
  .vb-flow::before { display: none; }
  .vb-flow > li { margin: 0 0 12px; }
  .vb-map-split { grid-template-columns: 1fr; gap: 28px; }
  .vb-gallery { grid-template-columns: 1fr 1fr; grid-auto-rows: 180px; }
}
@media screen and (max-width: 767px) {
  .vb-answer-label, .vb-answer > p { padding-left: 26px; padding-right: 18px; }
  .vb-gallery { grid-template-columns: 1fr; grid-auto-rows: 220px; }
  .vb-gallery-item.is-lead { grid-row: span 1; }
  .vb-stat { border-right: 0; border-bottom: 1px dashed #dbe3e9; }
  .vb-map { padding: 10px 8px; }
  .vb-map-r text { font-size: 17px; }
  .vb-hero-type { font-size: .88rem; }
}
@media print { .vb-progress, .vb-map-pulse { display: none; } }
.vb-map-wrap { max-width: 920px; }
.vb-map-section { padding-top: 0; }
.vb-map a, .vb-map-r, .vb-map-r:hover { text-decoration: none; }
.vb-map-r text { text-decoration: none; }
.vb-meta { border-left: 0; border-right: 0; }
@media screen and (max-width: 767px) {
  .vb-flow > li { flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 6px; margin: 0 0 10px; }
  .vb-flow > li::before { flex-basis: auto; width: auto; }
  .vb-flow > li .vb-role { align-self: flex-start; margin-top: 4px; }
  .vb-flow > li:not(:last-child)::after { display: block; right: auto; left: 50%; top: auto; bottom: -16px; transform: translateX(-50%); }
  .vb-flow > li { overflow: visible; }
  .vb-flow > li::before { border-radius: 14px 14px 0 0; }
}
@media screen and (max-width: 991px) { .vb-flow { row-gap: 16px; grid-template-columns: 1fr !important; } .vb-flow > li { margin: 0 !important; } }
.vb-stat { flex-direction: column; }
.vb-stat dd { display: contents; }
.vb-stat-value { order: 1; } .vb-stat dt { order: 2; } .vb-stat-src { order: 3; margin-top: 2px; }

/* Kurzantwort – ruhige Fassung (ersetzt Perforation und Seitenbalken) */
.vb-answer::before, .vb-answer::after { content: none; display: none; }
.vb-answer { border-radius: 14px; box-shadow: 0 0 0 1px #dbe3e9, 0 10px 24px -18px rgba(26,94,122,.35); background: #fff; }
.vb-answer-label { display: flex; align-items: center; gap: 10px; padding: 13px 26px; border-bottom: 3px solid var(--vb-orange); }
.vb-answer-label::before { content: ""; flex: none; width: 18px; height: 18px; border-radius: 50%; background: rgba(255,255,255,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L19 8'/%3E%3C/svg%3E") center / 12px no-repeat; }
.vb-answer > p { padding-left: 26px; padding-right: 26px; }
@media screen and (max-width: 767px) { .vb-answer-label, .vb-answer > p { padding-left: 18px; padding-right: 18px; } }

/* ==========================================================================
   Stufe 6: Unterscheidungsmerkmale, Vorteilsblöcke, Kundengruppen-Wähler
   ========================================================================== */
/* USP-Band: Merkmale als nummerierte Etiketten mit Nachweis */
.vb-usps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 0 0 1px #dbe3e9; background: #fff; counter-reset: vbusp; }
.vb-usp { counter-increment: vbusp; position: relative; padding: 28px 30px 26px 92px; border-bottom: 1px dashed #dbe3e9; display: flex; flex-direction: column; }
.vb-usp:nth-child(odd) { border-right: 1px dashed #dbe3e9; }
.vb-usps:not(.is-compact) .vb-usp:nth-last-child(-n+2) { border-bottom: 0; }
.vb-usp-icon { position: absolute; left: 28px; top: 28px; width: 44px; height: 44px; border-radius: 12px; background: var(--vb-light-blue); color: var(--vb-blue); display: flex; align-items: center; justify-content: center; }
.vb-usp-icon::after { content: counter(vbusp); position: absolute; right: -8px; bottom: -8px; min-width: 22px; height: 22px; border-radius: 11px; background: var(--vb-orange); color: #fff; font-size: .78rem; font-weight: 500; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 0 3px #fff; }
.vb-usp-icon svg { width: 22px; height: 22px; }
.vb-usp-title { font-size: 1.2rem; font-weight: 500; line-height: 1.3; color: var(--vb-ink); margin: 0 0 8px; }
.vb-usp-text { font-size: 1rem; line-height: 1.55; color: var(--vb-text); margin: 0 0 12px; }
.vb-usp-proof { margin: auto 0 10px; font-size: .86rem; line-height: 1.4; color: var(--vb-muted); display: flex; gap: 8px; align-items: baseline; }
.vb-usp-proof span { flex: none; font-size: .76rem; font-weight: 500; color: var(--vb-teal); background: #e6f3f2; border-radius: 10px; padding: 2px 8px; }
.vb-usp-link { color: var(--vb-blue); font-weight: 500; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; font-size: .95rem; }
.vb-usp-link svg { width: 18px; height: 18px; transition: transform .2s; }
.vb-usp-link:hover svg { transform: translateX(3px); }
.vb-usps.is-compact .vb-usp:nth-last-child(-n+2) { border-bottom: 0; }

/* Vorteilsblock auf Zielgruppenseiten */
.vb-adv { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 48px; align-items: start; }
.vb-adv-list { list-style: none; margin: 0; padding: 0; counter-reset: vbadv; }
.vb-adv-list > li { counter-increment: vbadv; position: relative; padding: 20px 0 20px 64px; border-bottom: 1px dashed #dbe3e9; }
.vb-adv-list > li:first-child { padding-top: 4px; }
.vb-adv-list > li:last-child { border-bottom: 0; }
.vb-adv-list > li::before { content: ""; position: absolute; left: 0; top: 18px; width: 40px; height: 40px; border-radius: 50%; background: var(--vb-orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L19 8'/%3E%3C/svg%3E") center / 20px no-repeat; }
.vb-adv-list > li:first-child::before { top: 2px; }
.vb-adv-list h3 { font-size: 1.25rem; font-weight: 500; line-height: 1.3; color: var(--vb-ink); margin: 0 0 6px; }
.vb-adv-list p { margin: 0; font-size: 1.02rem; line-height: 1.6; color: var(--vb-text); max-width: 64ch; }
.vb-adv-list p + p { margin-top: 8px; }
.vb-adv-list a { color: var(--vb-blue); }
.vb-adv-aside { background: var(--vb-paper); border-radius: 18px; padding: 24px; position: sticky; top: 96px; box-shadow: 0 0 0 1px #e1e7ec; display: flex; flex-direction: column; gap: 16px; }
.vb-adv-aside-title { font-weight: 500; color: var(--vb-ink); font-size: 1rem; }
.vb-adv-limit { margin: 0; font-size: .92rem; line-height: 1.5; color: var(--vb-text); padding: 12px 14px; background: #fff; border-radius: 10px; box-shadow: inset 3px 0 0 #6b5b95; }
.vb-adv-limit strong { font-weight: 500; }
.vb-adv-aside .button-std { width: 100%; min-height: 52px; padding: 14px 18px; font-size: 1rem; }
.vb-uspchips { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.vb-uspchip { display: flex; gap: 12px; align-items: flex-start; background: #fff; border-radius: 12px; padding: 12px 14px; text-decoration: none; color: var(--vb-text); box-shadow: 0 0 0 1px #e1e7ec; transition: box-shadow .15s; }
.vb-uspchip:hover { box-shadow: 0 0 0 2px var(--vb-blue); }
.vb-uspchip-icon { flex: none; width: 32px; height: 32px; border-radius: 9px; background: var(--vb-light-blue); color: var(--vb-blue); display: flex; align-items: center; justify-content: center; }
.vb-uspchip-icon svg { width: 18px; height: 18px; }
.vb-uspchip-body { display: flex; flex-direction: column; gap: 2px; }
.vb-uspchip-body strong { font-weight: 500; font-size: .95rem; line-height: 1.3; color: var(--vb-ink); }
.vb-uspchip-body small { font-size: .8rem; line-height: 1.35; color: var(--vb-muted); }

/* Kundengruppen-Wähler (Hub) */
.vb-picker { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 0; border-radius: 20px; overflow: hidden; box-shadow: 0 0 0 1px #dbe3e9, 0 24px 48px -36px rgba(26,94,122,.5); background: #fff; }
.vb-picker-tabs { background: var(--vb-ink); padding: 14px; display: flex; flex-direction: column; gap: 4px; }
.vb-picker-tab { appearance: none; border: 0; background: transparent; color: rgba(255,255,255,.82); text-align: left; font-family: inherit; font-size: 1.02rem; line-height: 1.3; padding: 14px 16px; border-radius: 12px; cursor: pointer; display: flex; gap: 12px; align-items: center; transition: background .15s, color .15s; }
.vb-picker-tab svg { width: 20px; height: 20px; flex: none; opacity: .8; }
.vb-picker-tab:hover { background: rgba(255,255,255,.08); color: #fff; }
.vb-picker-tab[aria-selected="true"] { background: #fff; color: var(--vb-ink); font-weight: 500; }
.vb-picker-tab[aria-selected="true"] svg { color: var(--vb-orange); opacity: 1; }
.vb-picker-tab:focus-visible { outline: 2px solid var(--vb-orange); outline-offset: 2px; }
.vb-picker-panel { padding: 34px 38px; display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 36px; }
.vb-picker-panel[hidden] { display: none !important; }
.vb-picker-panel h3 { font-size: clamp(1.4rem, 1.1rem + .8vw, 1.8rem); font-weight: 300; line-height: 1.2; color: var(--vb-ink); margin: 0 0 18px; }
.vb-picker-panel .vb-adv-list > li { padding: 14px 0 14px 54px; }
.vb-picker-panel .vb-adv-list > li::before { width: 32px; height: 32px; top: 14px; background-size: 16px; }
.vb-picker-panel .vb-adv-list > li:first-child::before { top: 2px; }
.vb-picker-panel .vb-adv-list h4 { font-size: 1.08rem; font-weight: 500; color: var(--vb-ink); margin: 0 0 4px; line-height: 1.3; }
.vb-picker-panel .vb-adv-list p { font-size: .98rem; }
.vb-picker-side { display: flex; flex-direction: column; gap: 14px; }
.vb-picker-side .vb-textlink { font-size: .98rem; }
.vb-picker-side .button-std { width: 100%; min-height: 52px; padding: 14px 18px; font-size: 1rem; }

@media screen and (max-width: 991px) {
  .vb-usps { grid-template-columns: 1fr; }
  .vb-usp:nth-child(odd) { border-right: 0; }
  .vb-usps:not(.is-compact) .vb-usp:nth-last-child(2), .vb-usps.is-compact .vb-usp:nth-last-child(2) { border-bottom: 1px dashed #dbe3e9; }
  .vb-adv { grid-template-columns: 1fr; gap: 28px; }
  .vb-adv-aside { position: static; }
  .vb-picker { grid-template-columns: 1fr; }
  .vb-picker-tabs { flex-direction: row; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .vb-picker-tab { flex: none; white-space: nowrap; padding: 11px 14px; }
  .vb-picker-panel { grid-template-columns: 1fr; padding: 26px 22px; gap: 24px; }
}
@media screen and (max-width: 767px) {
  .vb-usp { padding: 24px 20px 22px 80px; }
  .vb-usp-icon { left: 20px; top: 24px; }
}
.vb-usp-icon::after { content: none; display: none; }
@media screen and (max-width: 767px) {
  .vb-table.is-stack caption { display: block; width: auto; text-align: left; }
  .vb-table.is-stack { min-width: 0; }
  .vb-table.is-stack td::before { text-transform: none; letter-spacing: 0; font-weight: 500; }
}

/* Glossar */
.vb-glossary { margin: 0; }
.vb-glossary dt { font-size: 1.15rem; font-weight: 500; color: var(--vb-ink); margin: 22px 0 4px; scroll-margin-top: 110px; }
.vb-glossary dd { margin: 0 0 6px; padding: 0 0 16px; border-bottom: 1px dashed #dbe3e9; line-height: 1.6; color: var(--vb-text); max-width: 72ch; }
.vb-glossary dd a { color: var(--vb-blue); }
.vb-glossary dt:target { color: var(--vb-blue-dark); }
.vb-glossary dt:target + dd { background: linear-gradient(90deg, rgba(245,162,1,.12), transparent 80%); }
/* Leichte Sprache: größere Schrift, mehr Zeilenabstand */
.vb-page-leichte-sprache .vb-prose, .vb-page-leichte-sprache .vb-steps p, .vb-page-leichte-sprache .vb-note p { font-size: 1.25rem; line-height: 1.75; }
.vb-page-leichte-sprache .vb-steps h3 { font-size: 1.35rem; }
.vb-page-leichte-sprache .vb-prose p { margin-bottom: 20px; }
.vb-answer-langs { font-size: .95rem !important; color: var(--vb-muted); padding-top: 4px; } .vb-answer-langs a { color: var(--vb-blue); }

/* ------------------------------------------------------------------
 * Info-Boxen klar von klickbaren Karten unterscheiden (Stufe 8)
 * Reine Information: keine Kartenfläche, Akzentlinie oben, kein Hover.
 * Mit Vertiefungsseite: ganze Box klickbar, „Mehr dazu“ mit Pfeil.
 * ------------------------------------------------------------------ */
.vb-benefit { background: transparent; border: 0; border-top: 3px solid var(--vb-light-blue, #e6eef5); border-radius: 0; padding: 20px 4px 4px; }
.vb-benefit .vb-card-icon { width: 40px; height: 40px; margin-bottom: 12px; background: var(--vb-light-blue); }
.vb-benefit h3 { color: var(--vb-text); }
.vb-benefit.is-link { background: #fff; border: 1px solid #e4e8ec; border-top: 3px solid var(--vb-blue); border-radius: var(--vb-radius); padding: 24px 24px 22px; display: flex; flex-direction: column; cursor: pointer; transition: border-color .2s ease, box-shadow .2s ease; }
.vb-benefit.is-link h3 { color: var(--vb-blue); }
.vb-benefit-more { margin-top: auto; padding-top: 14px; color: var(--vb-blue); font-weight: 500; display: inline-flex; align-items: center; gap: 8px; text-decoration: none !important; }
.vb-benefit-more::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.vb-benefit-more svg { width: 20px; height: 20px; flex: none; transition: transform .2s; }
.vb-benefit.is-link:hover { box-shadow: 0 8px 22px rgba(16, 24, 40, .07); }
.vb-benefit.is-link:hover h3 { text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.vb-benefit.is-link:hover .vb-benefit-more svg { transform: translateX(3px); }
.vb-benefit.is-link:focus-within { outline: 2px solid var(--vb-blue); outline-offset: 2px; }
.vb-benefit.is-link a:not(.vb-benefit-more) { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) { .vb-benefit.is-link, .vb-benefit-more svg { transition: none; } }
@media print { .vb-benefit-more::after { display: none; } }

/* ------------------------------------------------------------------
 * Stufe 8: Situationen (Verständnis), Tagesablauf, Selbsttest
 * ------------------------------------------------------------------ */
.vb-insight-list { display: grid; gap: 28px; }
.vb-insight { background: #fff; border: 1px solid #e4e8ec; border-radius: var(--vb-radius); padding: 28px 30px; scroll-margin-top: 110px; }
.vb-insight-kicker { font-size: .78rem; letter-spacing: 1px; text-transform: uppercase; color: var(--vb-muted); margin-bottom: 8px; }
.vb-insight h3 { font-size: 1.35rem; font-weight: 500; line-height: 1.3; color: var(--vb-text); margin: 0 0 10px; }
.vb-insight-scene { font-size: 1.05rem; line-height: 1.6; color: var(--vb-text); margin: 0 0 22px; max-width: 820px; }
.vb-insight-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--vb-line); }
.vb-insight-cols > div { padding: 18px 20px 4px 0; }
.vb-insight-cols > div + div { padding-left: 20px; border-left: 1px solid var(--vb-line); }
.vb-insight-cols p, .vb-insight-cols ul { margin: 0 0 10px; font-size: .98rem; line-height: 1.55; color: var(--vb-text); }
.vb-insight-cols ul { padding-left: 18px; }
.vb-insight-cols a { color: var(--vb-blue); text-decoration: underline; text-underline-offset: 2px; }
.vb-insight-label { font-size: .8rem; font-weight: 500; letter-spacing: .6px; text-transform: uppercase; margin-bottom: 8px; color: var(--vb-muted); display: flex; align-items: center; gap: 8px; }
.vb-insight-label::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--vb-line); flex: none; }
.vb-insight-label.is-antares { color: var(--vb-blue); }
.vb-insight-label.is-antares::before { background: var(--vb-blue); }
.vb-insight-label.is-you { color: #8a5a00; }
.vb-insight-label.is-you::before { background: var(--vb-orange); }

.vb-day { list-style: none; margin: 0; padding: 0; position: relative; }
.vb-day::before { content: ""; position: absolute; left: 92px; top: 6px; bottom: 6px; width: 2px; background: var(--vb-line); }
.vb-day > li { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 28px; padding: 0 0 34px; position: relative; scroll-margin-top: 110px; }
.vb-day > li::before { content: ""; position: absolute; left: 86px; top: 6px; width: 14px; height: 14px; border-radius: 50%; background: #fff; border: 3px solid var(--vb-blue); }
.vb-day-time { font-weight: 500; color: var(--vb-blue); font-size: 1.05rem; text-align: right; padding-top: 2px; font-variant-numeric: tabular-nums; }
.vb-day-body h3 { font-size: 1.25rem; font-weight: 500; margin: 0 0 8px; color: var(--vb-text); line-height: 1.3; }
.vb-day-body > p { margin: 0 0 14px; line-height: 1.6; color: var(--vb-text); max-width: 820px; }
.vb-day-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.vb-day-compare > div { border-radius: 8px; padding: 14px 16px; font-size: .98rem; line-height: 1.55; }
.vb-day-compare > div > span { display: block; font-size: .78rem; font-weight: 500; letter-spacing: .6px; text-transform: uppercase; margin-bottom: 6px; }
.vb-day-compare p { margin: 0; color: var(--vb-text); }
.vb-day-compare .is-before { background: #f3f4f6; }
.vb-day-compare .is-before > span { color: var(--vb-muted); }
.vb-day-compare .is-after { background: var(--vb-light-blue); }
.vb-day-compare .is-after > span { color: var(--vb-blue); }
.vb-day-same { margin-top: 10px; font-size: .92rem; color: var(--vb-muted); border-left: 3px solid var(--vb-orange); padding-left: 10px; }

.vb-signals { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: vbsig; }
.vb-signals-group { font-size: .8rem; letter-spacing: 1px; text-transform: uppercase; color: var(--vb-muted); margin: 18px 0 2px; }
.vb-signals li label { font-weight: 400; display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 12px; align-items: start; background: #fff; border: 1px solid #e4e8ec; border-radius: 8px; padding: 14px 16px; cursor: pointer; transition: border-color .15s, background-color .15s; }
.vb-signals li label:hover { border-color: var(--vb-blue); }
.vb-signals input[type="checkbox"] { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--vb-blue); cursor: pointer; }
.vb-signals strong { display: block; font-weight: 500; color: var(--vb-text); font-size: 1.02rem; line-height: 1.4; }
.vb-signals .vb-signal-hint { display: block; font-size: .93rem; color: var(--vb-muted); line-height: 1.5; margin-top: 4px; }
.vb-signals li label:has(input:checked) { border-color: var(--vb-orange); background: #fffaf0; }
.vb-signals-result { position: sticky; bottom: 12px; margin-top: 22px; background: #fff; border: 1px solid var(--vb-line); border-left: 5px solid var(--vb-blue); border-radius: var(--vb-radius); padding: 18px 22px; box-shadow: 0 8px 22px rgba(16, 24, 40, .06); }
.vb-signals-result[data-level="mid"] { border-left-color: var(--vb-orange); }
.vb-signals-result[data-level="high"] { border-left-color: var(--vb-purple); }
.vb-signals-count { font-size: 1.1rem; font-weight: 500; color: var(--vb-text); margin: 0 0 6px; }
.vb-signals-text { margin: 0; line-height: 1.55; color: var(--vb-text); }
.vb-signals-result .vb-btn-row { margin-top: 12px; }

@media (max-width: 991px) {
  .vb-insight-cols { grid-template-columns: 1fr; }
  .vb-insight-cols > div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--vb-line); }
}
@media (max-width: 767px) {
  .vb-insight { padding: 22px 18px; }
  .vb-day::before { left: 7px; }
  .vb-day > li { grid-template-columns: minmax(0, 1fr); gap: 6px; padding-left: 30px; }
  .vb-day > li::before { left: 1px; }
  .vb-day-time { text-align: left; }
  .vb-day-compare { grid-template-columns: 1fr; }
  .vb-signals-result { position: static; }
}
@media print {
  .vb-signals li label { break-inside: avoid; }
  .vb-insight, .vb-day > li { break-inside: avoid; }
  .vb-signals-result { position: static; box-shadow: none; }
}
.vb-prose .vb-evidence, .vb-evidence { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .9rem; line-height: 1.4; margin: 0 0 12px; padding: 5px 12px 5px 6px; border-radius: 999px; background: var(--vb-light-blue); color: var(--vb-blue-dark); font-weight: 500; }
.vb-evidence > span { font-size: .72rem; letter-spacing: .6px; text-transform: uppercase; background: #fff; border-radius: 999px; padding: 2px 8px; color: var(--vb-muted); }
.vb-evidence.is-plausibel { background: var(--vb-beige); color: #7a5200; }
.vb-evidence.is-offen { background: #f3f4f6; color: var(--vb-muted); }

/* Rechner (Stufe 9) */
.vb-tool { background: #fff; border: 1px solid #e4e8ec; border-radius: var(--vb-radius); padding: 26px; scroll-margin-top: 110px; }
.vb-tool-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 26px; }
.vb-tool-field label { display: block; font-weight: 500; color: var(--vb-text); font-size: .98rem; margin-bottom: 6px; }
.vb-tool-ctrl { display: flex; align-items: center; gap: 8px; }
.vb-tool-ctrl input, .vb-tool-ctrl select { flex: 1; min-width: 0; font: inherit; font-size: 1rem; padding: 10px 12px; border: 1px solid var(--vb-line); border-radius: 8px; background: #fff; color: var(--vb-text); }
.vb-tool-ctrl input:focus, .vb-tool-ctrl select:focus { outline: 2px solid var(--vb-blue); outline-offset: 1px; border-color: var(--vb-blue); }
.vb-tool-unit { color: var(--vb-muted); font-size: .92rem; white-space: nowrap; min-width: 64px; }
.vb-tool-hint { display: block; color: var(--vb-muted); font-size: .86rem; margin-top: 4px; line-height: 1.4; }
.vb-tool-out { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--vb-line); }
.vb-tool-kpi { background: var(--vb-light-blue); border-radius: 8px; padding: 14px 16px; }
.vb-tool-kpi.is-wide { grid-column: span 4; background: #fffaf0; }
.vb-tool-kpi span { display: block; font-size: 1.6rem; font-weight: 500; color: var(--vb-blue-dark); line-height: 1.2; font-variant-numeric: tabular-nums; }
.vb-tool-kpi small { display: block; color: var(--vb-text); font-size: .88rem; margin-top: 4px; line-height: 1.35; }
.vb-tool-note { margin: 16px 0 0; color: var(--vb-muted); font-size: .93rem; line-height: 1.5; }
.vb-tool-table { margin-top: 22px; }
@media (max-width: 767px) {
  .vb-tool { padding: 18px; }
  .vb-tool-grid { grid-template-columns: 1fr; }
  .vb-tool-out { grid-template-columns: 1fr 1fr; }
  .vb-tool-kpi.is-wide { grid-column: span 2; }
}
@media print { .vb-tool { border: 0; padding: 0; } .vb-tool-grid { display: none; } }

/* Lange Komposita (z. B. „Krankenhausversorgungsvertrag“) auf schmalen Bildschirmen trennen */
@media (max-width: 767px) {
  .is-verblisterung .title-h1, .is-verblisterung .headline-h2, .vb-prose h2, .vb-prose h3, .vb-card-title, .vb-insight h3 { -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }
}

/* Weitere Kontaktwege im Anfrageformular (Stufe 11) */
.vb-form-tabs.is-secondary { margin-top: -6px; align-items: center; }
.vb-form-tabs.is-secondary button { font-size: .9rem; padding: 7px 12px; }
.vb-form-tabs-label { font-size: .88rem; color: var(--vb-muted); margin-right: 4px; }


/* Ausfüllbare Tabellen in Vorlagen (Stufe 12) */
.vb-tool .vb-table textarea, .vb-tool .vb-table input[type="text"] { width: 100%; min-width: 110px; box-sizing: border-box; font: inherit; font-size: .95rem; color: var(--vb-ink); background: #fff; border: 1px solid #cfd8de; border-radius: 6px; padding: 6px 8px; resize: vertical; }
.vb-tool .vb-table th input[type="text"] { font-weight: 500; }
.vb-bag-figure svg { width: 100%; height: auto; display: block; max-width: 640px; }
/* Startbereitschafts-Check und Angebotsvergleich (Stufe 12) */
.vb-ready-open { margin: 10px 0 0; padding-left: 20px; font-size: .95rem; }
.vb-ready-open li { margin-bottom: 4px; }
.vb-ready-open a { color: var(--vb-blue); }
.vb-compare select { font: inherit; font-size: .95rem; padding: 4px 6px; border: 1px solid #cfd8de; border-radius: 6px; background: #fff; max-width: 100%; }
.vb-compare input[type="text"] { font: inherit; width: 100%; box-sizing: border-box; padding: 6px 8px; border: 1px solid #cfd8de; border-radius: 6px; }
.vb-compare-result { margin-top: 18px; background: #fff; border: 1px solid var(--vb-line); border-left: 5px solid var(--vb-blue); border-radius: var(--vb-radius); padding: 16px 20px; }
.vb-compare-result p { margin: 0 0 6px; }
.vb-compare-result [data-zero] { color: var(--vb-muted); font-size: .92rem; }
@media print { .vb-compare select { border: 0; appearance: none; -webkit-appearance: none; } }
