/* Eigenes Bewertungstool (Preis-Kompass → Details → Kontakt) als Baustein für die Startseite.
   Regeln aus /bewertung-wuppertal/ übernommen und unter .vbkp gekapselt, damit Theme/Elementor
   nicht hineinfunken. Ablauf: /vb/kompass.js. */
.vbkp{--p:#007E91;--pd:#004f5c;--o:#E8A020;--od:#c9860f;--t:#17252b;--m:#5b6870;--h:#f2f6f7;--l:#e3eaec;--r:18px;font-family:Raleway,system-ui,sans-serif;color:var(--t);line-height:1.5;
  display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,56px);align-items:center;max-width:1080px;margin:8px auto 0;text-align:left;align-items:start}
.vbkp-text{padding-top:6px}
.vbkp *,.vbkp *::before,.vbkp *::after{box-sizing:border-box}
.vbkp-text h3{font-size:clamp(1.5rem,2.6vw,2.1rem);line-height:1.2;margin:0 0 14px;color:var(--t);font-weight:700}
.vbkp-text h3 mark{background:none;color:var(--p)}
.vbkp-text>p{color:var(--m);font-size:1.05rem;margin:0 0 22px}
.vbkp-team{display:flex;align-items:center;gap:12px;margin-top:4px}
.vbkp-team .bilder{display:flex}
.vbkp .vbkp-team img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:3px solid #fff;margin-left:-10px;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.vbkp .vbkp-team img:first-child{margin-left:0}
.vbkp-team span{font-size:.9rem;color:var(--m);line-height:1.35}
.vbkp-team b{color:var(--t)}
/* Theme-Stile für Knöpfe/Felder neutralisieren */
.vbkp button,.vbkp input,.vbkp select{font-family:inherit;text-transform:none;letter-spacing:normal;box-shadow:none;min-height:0;line-height:1.3}
.vbkp .vv-seg button,.vbkp .zurueck{background:transparent;color:var(--t);border:0}
.vbkp .vv-seg button.on{background:var(--p);color:#fff}
.vbkp .zurueck{color:var(--m);padding:8px 0}
.vbkp .btn,.vbkp a.btn{background:var(--o);color:#17252b;border:0;border-radius:999px;padding:15px 26px;font-weight:700;font-size:1rem;line-height:1.2;text-decoration:none}
.vbkp .btn--g,.vbkp a.btn--g{background:transparent;color:var(--p);border:2px solid var(--p)}
.vbkp .btn--g:hover{background:var(--p);color:#fff}
.vbkp label{font-weight:inherit;margin:0}
.vbkp .vv-feld select,.vbkp .feld input{height:auto;margin:0;box-shadow:none}
.vbkp .vv-feld input[type=range]{border:0;padding:0;box-shadow:none}
.vbkp .ok input{width:18px;height:18px;padding:0}
.vbkp ol.schritte{margin:0 0 20px;padding:0}
.vbkp .schritte li{margin:0;list-style:none}
.vbkp p{margin-top:0}
/* Theme (Astra/Elementor) setzt Rahmen/Abstände der Felder zurück – hier fest */
.vbkp .feld input,.vbkp .vv-feld select{border:1.5px solid #d6e3e6 !important;border-radius:12px !important;padding:12px 14px !important;background:#fff !important;color:var(--t) !important;font-size:1rem !important;width:100%}
.vbkp .feld input:focus{border-color:var(--p) !important;box-shadow:0 0 0 3px rgba(0,126,145,.15) !important;outline:none}
.vbkp .feld input.falsch{border-color:#c0392b !important}
.vbkp .feld input::placeholder{color:#9aa7ab}
.vbkp .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-weight:700;padding:15px 26px;border-radius:999px;background:var(--o);color:#17252b;text-decoration:none;border:0;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;white-space:nowrap}
.vbkp .btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(232,160,32,.35)}
.vbkp .btn--g{background:transparent;color:var(--p);border:2px solid var(--p)}
.vbkp .btn--g:hover{background:var(--p);color:#fff;box-shadow:none}
.vbkp .btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.vbkp .haken{list-style:none;padding:0;margin:0 0 30px;display:grid;gap:11px}
.vbkp .haken li{display:flex;gap:12px;align-items:center;font-weight:600}
.vbkp .haken li::before{content:"";flex:0 0 26px;height:26px;border-radius:50%;background:var(--o) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2317252b' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/14px no-repeat}
.vbkp .kompass{background:#fff;color:var(--t);border-radius:24px;padding:28px 30px 24px;box-shadow:0 24px 60px rgba(0,60,70,.16);text-align:left}
.vbkp .kompass__kopf{margin-bottom:18px}
.vbkp .kompass__tag{display:inline-block;font-size:.7rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--od);margin-bottom:4px}
.vbkp .kompass__kopf b{display:block;font-size:1.25rem;line-height:1.25}
.vbkp .vv-feld{margin-bottom:18px}
.vbkp .vv-feld>label,.vbkp .vv-feld>span{display:block;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--m);margin-bottom:8px}
.vbkp .vv-feld select{width:100%;font:inherit;font-size:1rem;padding:12px 14px;border-radius:12px;border:1px solid #d6e3e6;background:#fff;color:var(--t)}
.vbkp .vv-seg{display:inline-flex;background:var(--h);border-radius:999px;padding:4px;gap:4px}
.vbkp .vv-seg button{font:inherit;font-weight:700;border:0;background:transparent;color:var(--t);padding:9px 22px;border-radius:999px;cursor:pointer;transition:background .15s,color .15s}
.vbkp .vv-seg button.on{background:var(--p);color:#fff}
.vbkp .vv-flaeche{font-weight:800;color:var(--p)}
.vbkp .vv-feld input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;cursor:pointer;--f:30%}
.vbkp .vv-feld input[type=range]::-webkit-slider-runnable-track{height:10px;border-radius:999px;background:linear-gradient(90deg,var(--p) var(--f),#e4e8ea var(--f))}
.vbkp .vv-feld input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:-9px;border-radius:50%;background:#fff;border:1px solid #d6e3e6;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.vbkp .vv-feld input[type=range]::-moz-range-track{height:10px;border-radius:999px;background:#e4e8ea}
.vbkp .vv-feld input[type=range]::-moz-range-progress{height:10px;border-radius:999px;background:var(--p)}
.vbkp .vv-feld input[type=range]::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:#fff;border:1px solid #d6e3e6;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.vbkp .vv-ergebnis{margin-top:6px;padding:20px 22px;border-radius:18px;background:linear-gradient(135deg,#007E91,#005f6e);color:#fff}
.vbkp .vv-ergebnis small{display:block;opacity:.85;font-size:.84rem;margin-bottom:4px}
.vbkp .vv-ergebnis strong{display:block;font-size:clamp(1.45rem,2.4vw,1.95rem);line-height:1.2}
.vbkp .vv-ergebnis span{display:block;margin-top:6px;font-size:.9rem;opacity:.92}
.vbkp .kompass__cta{width:100%;margin-top:14px}
.vbkp .vv-hinweis{font-size:.74rem;color:var(--m);margin:12px 0 0;line-height:1.5}
.vbkp .schritte{list-style:none;display:flex;gap:6px;margin:0 0 20px;padding:0;counter-reset:st}
.vbkp .schritte li{flex:1;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--m);padding-top:10px;border-top:4px solid var(--l);counter-increment:st;transition:color .2s,border-color .2s}
.vbkp .schritte li::before{content:counter(st) ". "}
.vbkp .schritte li.an{color:var(--p);border-color:var(--p)}
.vbkp .schritte li.fertig{color:var(--p);border-color:var(--o)}
.vbkp .stufe[hidden]{display:none}
.vbkp .stufe.an{animation:vbkpRein .35s ease}
@keyframes vbkpRein{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
.vbkp .chips{display:flex;flex-wrap:wrap;gap:8px}
.vbkp .chip input,.vbkp .wahl input{position:absolute;opacity:0;pointer-events:none}
.vbkp .chip span{display:inline-block;padding:9px 15px;border-radius:999px;border:1.5px solid #d6e3e6;font-weight:600;font-size:.92rem;cursor:pointer;transition:all .15s}
.vbkp .chip:hover span{border-color:var(--p)}
.vbkp .chip input:checked+span{background:var(--p);border-color:var(--p);color:#fff}
.vbkp .chip input:focus-visible+span,.vbkp .wahl input:focus-visible+span{outline:3px solid rgba(0,126,145,.35);outline-offset:2px}
.vbkp .knopfzeile{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px}
.vbkp .zurueck{font:inherit;font-weight:700;color:var(--m);background:none;border:0;cursor:pointer;padding:8px 0}
.vbkp .zurueck:hover{color:var(--p)}
.vbkp .wunsch{display:grid;gap:8px;margin-bottom:18px}
.vbkp .wahl{position:relative;display:block;cursor:pointer}
.vbkp .wahl span{display:block;padding:12px 16px 12px 46px;border-radius:14px;border:1.5px solid #d6e3e6;transition:all .15s;position:relative}
.vbkp .wahl span::before{content:"";position:absolute;left:16px;top:50%;width:18px;height:18px;margin-top:-9px;border-radius:50%;border:2px solid #b9c8cc;background:#fff;transition:all .15s}
.vbkp .wahl b{display:block;font-size:.98rem}
.vbkp .wahl small{color:var(--m);font-size:.82rem}
.vbkp .wahl input:checked+span{border-color:var(--p);background:#f0f8f9}
.vbkp .wahl input:checked+span::before{border-color:var(--p);box-shadow:inset 0 0 0 4px #fff;background:var(--p)}
.vbkp .felder{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.vbkp .feld{display:block}
.vbkp .feld--voll{grid-column:1 / -1}
.vbkp .adr{display:grid;grid-template-columns:1fr 96px;gap:12px}
.vbkp .feld span{display:block;font-size:.76rem;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--m);margin-bottom:6px}
.vbkp .feld span small{text-transform:none;font-weight:500;letter-spacing:0}
.vbkp .feld input{width:100%;font:inherit;font-size:1rem;padding:12px 14px;border-radius:12px;border:1.5px solid #d6e3e6;background:#fff;color:var(--t);transition:border-color .15s}
.vbkp .feld input:focus{outline:none;border-color:var(--p);box-shadow:0 0 0 3px rgba(0,126,145,.15)}
.vbkp .feld input.falsch{border-color:#c0392b}
.vbkp .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.vbkp .ok{display:flex;gap:10px;align-items:flex-start;margin-top:16px;font-size:.8rem;color:var(--m);line-height:1.5;cursor:pointer}
.vbkp .ok input{margin-top:3px;width:18px;height:18px;accent-color:var(--p);flex-shrink:0}
.vbkp .fehler{margin:12px 0 0;padding:10px 14px;border-radius:10px;background:#fdecea;color:#a12a1e;font-size:.88rem;font-weight:600}
.vbkp .danke{text-align:center;padding:16px 4px 6px}
.vbkp .danke img{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:top;margin:0 auto 14px;box-shadow:0 0 0 3px var(--o)}
.vbkp .danke__h{display:block;font-size:1.5rem;margin-bottom:10px}
.vbkp .danke p{color:var(--m);margin:0 0 14px}
.vbkp .danke__nr{font-size:.8rem}
.vbkp .btn[disabled]{opacity:.6;cursor:wait;transform:none}
.vbkp .vgl .btn{margin-top:24px}
@media (max-width:900px){
  .vbkp{grid-template-columns:1fr;gap:18px}
  .vbkp .kompass{padding:22px 18px 20px}
  .vbkp .felder{grid-template-columns:1fr}
  .vbkp .haken{display:none}
  .vbkp-text{text-align:center}
  .vbkp-team{justify-content:center}
}
@media (prefers-reduced-motion:reduce){.vbkp .btn{transition:none}.vbkp .stufe.an{animation:none}}
