@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:opsz,wght@6..12,400;6..12,700;6..12,800;6..12,900&display=swap');

.bsk-wrap {
    --blue:   #1A4D9A;
    --red:    #CC242C;
    --ink:    #1A1A2E;
    --soft:   #5A5870;
    --bg:     #F7F8FC;
    --card:   #fff;
    --border: #D8DCE8;
    --font:   'Nunito Sans', -apple-system, Arial, sans-serif;
    --radius: 12px;
    font-family: var(--font);
    color: var(--ink);
    max-width: 760px;
    margin: 0 auto;
}

/* ── Header ── */
.bsk-header {
    background: #fff !important;
    border-top: 5px solid var(--blue) !important;
    border-bottom: 3px solid var(--red) !important;
    padding: 20px 28px !important;
    margin-bottom: 18px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 24px !important;
    box-sizing: border-box !important;
}
.bsk-header-logos {
    display: flex !important;
    align-items: center !important;
    gap: 18px !important;
    flex: 0 0 auto !important;
    flex-wrap: nowrap !important;
}
.bsk-logo-sl  { height: 60px !important; width: auto !important; max-width: 130px !important; display: block !important; object-fit: contain !important; }
.bsk-logo-sks { height: 60px !important; width: auto !important; max-width: 130px !important; display: block !important; object-fit: contain !important; }
.bsk-header-divider {
    display: none !important;
}
.bsk-header-text { flex: 1 1 auto; }
.bsk-title {
    font-size: 1.3rem;
    font-weight: 900;
    color: var(--blue);
    margin: 0 0 6px;
    line-height: 1.25;
}
.bsk-meta {
    display: flex;
    gap: 16px;
    font-size: 0.85rem;
    color: var(--soft);
    font-weight: 700;
    flex-wrap: wrap;
}

/* ── Frist-Box ── */
.bsk-frist {
    background: var(--blue);
    color: #fff;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 0.88rem;
    margin-bottom: 24px;
}
.bsk-frist strong { color: #FFE066; }

/* ── Fortschritt ── */
.bsk-progress-wrap { margin-bottom: 24px; }
.bsk-progress-bar  { background: var(--border); border-radius: 99px; height: 6px; overflow: hidden; margin-bottom: 8px; }
.bsk-progress-fill { background: linear-gradient(90deg, var(--blue), var(--red)); height: 100%; transition: width .35s ease; }
.bsk-steps-labels  { display: flex; gap: 2px; }
.bsk-step-label    { flex:1; font-size:0.72rem; font-weight:700; color:var(--soft); text-align:center; padding:3px 2px; border-radius:5px; }
.bsk-step-label.is-active { background: var(--blue); color: #fff; }

/* ── Schritte ── */
.bsk-step          { display: none; }
.bsk-step.is-active{ display: block; animation: bskFade .2s ease; }
@keyframes bskFade { from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:none} }
.bsk-step h3       { font-size:1.15rem; font-weight:900; color:var(--blue); margin:0 0 18px; padding-bottom:7px; border-bottom:2px solid var(--blue); }

/* ── Felder ── */
.bsk-field { margin-bottom: 14px; }
.bsk-field label { display:block; font-weight:800; font-size:0.9rem; margin-bottom:5px; color:var(--ink); }
.bsk-field input[type=text],
.bsk-field input[type=email],
.bsk-field input[type=tel],
.bsk-field textarea {
    width:100%; padding:11px 13px; border:1.5px solid var(--border); border-radius:10px;
    font-size:1rem; font-family:var(--font); color:var(--ink); background:#fff;
    transition:border-color .15s; box-sizing:border-box;
}
.bsk-field input:focus, .bsk-field textarea:focus { outline:none; border-color:var(--blue); }
.bsk-field textarea { resize:vertical; min-height:90px; }

.bsk-row    { display:flex; gap:12px; }
.bsk-col-s  { flex: 0 0 120px; }
.bsk-col-l  { flex: 1 1 auto; }

/* ── Standplatz-Kacheln ── */
.bsk-standplatz-grid {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.bsk-sp-card {
    flex: 1 1 180px;
    border: 2px solid var(--border);
    border-radius: var(--radius);
    padding: 16px 12px;
    text-align: center;
    cursor: pointer;
    transition: border-color .15s, background .15s;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
}
.bsk-sp-card:has(input:checked) {
    border-color: var(--blue);
    background: #EBF0FA;
}
.bsk-sp-card input[type=radio] { display: none; }
.bsk-sp-icon  { font-size: 1.8rem; }
.bsk-sp-label { font-size: 0.82rem; font-weight: 700; color: var(--ink); line-height: 1.35; }

/* ── Möbel-Zeile ── */
.bsk-moebel-row {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--ink);
    margin-top: 16px;
    flex-wrap: wrap;
}
.bsk-moebel-check { display:flex; align-items:center; gap:7px; cursor:pointer; }
.bsk-moebel-check input { accent-color:var(--blue); width:17px; height:17px; }
.bsk-num-input {
    width: 60px !important;
    padding: 8px 10px !important;
    border: 1.5px solid var(--border) !important;
    border-radius: 8px !important;
    font-size: 1rem !important;
    text-align: center;
    font-family: var(--font) !important;
}
.bsk-num-input:focus { border-color: var(--blue) !important; outline: none; }

/* ── Consent ── */
.bsk-consent { display:flex; gap:9px; align-items:flex-start; font-size:0.87rem; color:var(--soft); margin:10px 0; line-height:1.45; cursor:pointer; }
.bsk-consent input { margin-top:3px; flex:0 0 auto; width:18px; height:18px; accent-color:var(--blue); }
.bsk-consent a { color:var(--blue); }

/* ── Hinweis ── */
.bsk-hint { font-size:0.85rem; color:var(--soft); margin:4px 0 12px; line-height:1.5; font-style:italic; }

/* ── Übersicht ── */
.bsk-uebersicht { background:var(--bg); border-radius:var(--radius); padding:18px; font-size:0.9rem; border:1px solid var(--border); }
.bsk-uebersicht h4 { font-size:0.8rem; font-weight:900; color:var(--blue); margin:12px 0 4px; text-transform:uppercase; letter-spacing:.5px; border-bottom:1px solid var(--border); padding-bottom:2px; }
.bsk-ov-row { display:flex; gap:8px; margin-bottom:3px; }
.bsk-ov-label { color:var(--soft); flex:0 0 150px; }

/* ── Alert ── */
.bsk-alert { background:#fdeaea; color:#c0392b; border-left:4px solid #c0392b; border-radius:10px; padding:12px 16px; margin-bottom:16px; font-weight:700; }

/* ── Navigation ── */
.bsk-nav { display:flex; gap:12px; margin-top:22px; padding-top:16px; border-top:1px solid var(--border); }
.bsk-btn { border:0; border-radius:10px; font-family:var(--font); font-weight:800; font-size:1rem; padding:12px 22px; cursor:pointer; transition:background .15s; }
.bsk-btn-back   { background:var(--bg); color:var(--ink); border:1.5px solid var(--border); }
.bsk-btn-back:hover { border-color:var(--blue); color:var(--blue); }
.bsk-btn-next   { background:var(--blue); color:#fff; box-shadow:0 4px 14px rgba(26,77,154,.25); }
.bsk-btn-next:hover { background:#163E7A; }
.bsk-btn-submit { background:var(--red); color:#fff; box-shadow:0 4px 14px rgba(204,36,44,.22); }
.bsk-btn-submit:hover { background:#961018; }

/* ── Erfolg ── */
.bsk-success { text-align:center; padding:48px 24px; }
.bsk-success-icon { width:60px; height:60px; background:var(--blue); color:#fff; border-radius:50%; font-size:2rem; line-height:60px; margin:0 auto 18px; font-weight:900; }
.bsk-success h2 { font-size:1.6rem; font-weight:900; color:var(--blue); margin:0 0 12px; }
.bsk-success p  { font-size:1rem; line-height:1.65; color:var(--soft); }
.bsk-success a  { color:var(--blue); }

/* ── CAPTCHA ── */
.captcha-field { margin-top:14px; }
.captcha-label { display:block; font-weight:800; font-size:0.9rem; margin-bottom:5px; color:var(--ink); }
.captcha-input { width:130px !important; padding:10px 12px; border:1.5px solid var(--border); border-radius:10px; font-size:1rem; font-family:var(--font); }
.captcha-input:focus { outline:none; border-color:var(--blue); }

@media(max-width:540px) {
    .bsk-header { flex-direction:column !important; align-items:flex-start !important; gap:14px !important; }
    .bsk-header-logos { order: 2; }
    .bsk-header-text  { order: 1; }
    .bsk-standplatz-grid { flex-direction:column; }
    .bsk-sp-card { flex-direction:row; text-align:left; }
    .bsk-row { flex-direction:column; }
    .bsk-col-s { flex: 0 0 auto; }
}
