/* Webhafen – Seite Bestellsystem (Version 4.7) */
.bs-kopf{padding-bottom:clamp(56px,7vw,96px)}
.bs-kopf-raster{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(40px,5vw,64px)}
.bs-kopf h1{max-width:9ch}
.bs-knoepfe{display:flex;flex-wrap:wrap;align-items:center;gap:18px 30px;margin:34px 0 0}
.bs-hell{color:#fff}
.bs-geraete{position:relative;margin:0;padding:0 0 clamp(40px,6vw,64px);max-width:860px}
.bs-tablet{border-radius:clamp(14px,2vw,26px);padding:clamp(6px,1vw,12px);background:#151a1f;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 40px 80px -30px rgba(0,0,0,.7);width:86%}
.bs-tablet img{display:block;width:100%;height:auto;border-radius:clamp(8px,1.2vw,14px)}
.bs-handy{position:absolute;right:0;bottom:0;width:30%;border-radius:clamp(18px,3vw,34px);padding:clamp(4px,.6vw,8px);background:#151a1f;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 30px 60px -20px rgba(0,0,0,.75)}
.bs-handy img{display:block;width:100%;height:auto;border-radius:clamp(14px,2.4vw,27px)}
.bs-geraete figcaption{position:absolute;left:0;bottom:0;font-size:13px;color:#A9BACF;max-width:60%}
@media (min-width:1000px){
  .bs-kopf-raster{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:center}
  .bs-kopf h1{font-size:clamp(56px,6.4vw,104px)}
}

.bs-schritte{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,56px);align-items:start}
.bs-schritte h3{display:flex;align-items:baseline;gap:14px;margin:28px 0 10px;font-size:clamp(21px,1.9vw,26px);letter-spacing:-.02em;font-stretch:112%}
.bs-schritte h3 span{font-family:var(--serif);font-style:normal;font-weight:400;font-size:1.3em;color:var(--akzent);line-height:1}
.bs-schritte p{margin:0;color:var(--mute);max-width:32em}
.bs-bild{display:flex;align-items:flex-end;justify-content:center;height:clamp(300px,34vw,440px);background:var(--card);border:1px solid var(--line);border-radius:22px;padding:28px 24px 0;overflow:hidden}
.bs-bild img{display:block;height:auto;box-shadow:0 18px 40px -18px rgba(14,14,16,.45)}
.bs-bild--handy img{width:min(62%,240px);border-radius:24px 24px 0 0}
.bs-bild--tablet{align-items:center;padding:24px}
.bs-bild--tablet img{width:100%;border-radius:12px}
@media (max-width:860px){
  .bs-schritte{grid-template-columns:1fr;gap:56px}
  .bs-bild{height:auto;min-height:0;padding-top:24px}
  .bs-bild--handy img{width:min(58%,230px)}
}

/* Rechner */
.bs-rechner{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:0;border:1px solid var(--line);border-radius:28px;overflow:hidden;background:var(--card)}
.bs-regler{padding:clamp(28px,4vw,52px);display:grid;gap:14px;align-content:start}
.bs-feld{display:flex;justify-content:space-between;align-items:baseline;gap:16px;font-weight:600;font-size:16px}
.bs-feld output{font-stretch:112%;font-weight:700;font-size:20px;white-space:nowrap}
.bs-regler input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:36px;background:transparent;margin:0 0 18px;cursor:pointer;--p:20%}
.bs-regler input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(var(--akzent),var(--akzent)) 0/var(--p) 100% no-repeat,var(--line)}
.bs-regler input[type=range]::-moz-range-track{height:6px;border-radius:6px;background:var(--line)}
.bs-regler input[type=range]::-moz-range-progress{height:6px;border-radius:6px;background:var(--akzent)}
.bs-regler input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;margin-top:-11px;border-radius:50%;background:#fff;border:3px solid var(--akzent);box-shadow:0 4px 12px rgba(14,14,16,.25)}
.bs-regler input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--akzent)}
.bs-regler input[type=range]:focus-visible{outline:2px solid var(--akzent);outline-offset:4px;border-radius:8px}
.bs-wahl{border:0;margin:0 0 22px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bs-wahl legend{font-weight:600;font-size:16px;margin-bottom:12px;padding:0}
.bs-wahl label{position:relative;cursor:pointer}
.bs-wahl input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.bs-wahl span{display:block;border:1.5px solid var(--line);border-radius:16px;padding:14px 16px;font-weight:650;line-height:1.3;transition:border-color .25s,background .25s}
.bs-wahl small{display:block;font-weight:450;color:var(--mute);font-size:14px;margin-top:2px}
.bs-wahl input:checked+span{border-color:var(--akzent);background:color-mix(in srgb,var(--akzent) 9%,transparent)}
.bs-wahl input:focus-visible+span{outline:2px solid var(--akzent);outline-offset:3px}
.bs-ergebnis{background:var(--nacht);color:#fff;padding:clamp(28px,4vw,52px);display:flex;flex-direction:column;justify-content:center;position:relative;isolation:isolate}
.bs-ergebnis::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(70% 80% at 85% 10%,rgba(11,74,160,.55),transparent 70%)}
.bs-heute{margin:0 0 6px;color:#A9BACF;font-size:16px}
.bs-heute b{color:#fff}
.bs-gross{margin:0;font-size:clamp(56px,8.4vw,128px);line-height:.95;font-stretch:125%;font-weight:720;letter-spacing:-.045em;color:var(--flieder);white-space:nowrap}
.bs-gross-text{margin:14px 0 0;font-size:clamp(18px,1.6vw,22px);max-width:22em}
.bs-klein{margin:22px 0 0;padding-top:18px;border-top:1px solid rgba(200,224,255,.18);color:#A9BACF;font-size:15px;max-width:34em}
.bs-fuss{margin:20px 0 0;font-size:13.5px;color:var(--mute);max-width:62em}
.bs-fuss a{color:inherit}
@media (max-width:900px){
  .bs-rechner{grid-template-columns:1fr}
}
@media (max-width:420px){
  .bs-wahl{grid-template-columns:1fr}
}

/* Listen und Preise */
.dienst li b{font-weight:650}
.bs-tipp{color:var(--akzent);font-weight:550}
.bs-preis b{float:right;margin-left:12px}
.bs-preis small{display:block;color:var(--mute);font-size:14.5px;margin-top:2px}
.bs-steuer{margin:18px 0 0;font-size:14px;color:var(--mute)}

/* Kontakt-Hinweis im Footer und Leistungen */
.bs-hinweis{display:inline-block;font-size:13px;font-weight:650;color:var(--akzent);margin-left:6px}
.anleger .bs-demo{display:block;width:fit-content;margin:26px auto 0}