
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,500;0,600;1,500&family=Nunito:wght@400;600;700;800&display=swap');
#sbs-fragebogen{
  --ink:#082B57; --inkDeep:#06203F; --body:#22303F; --muted:#5B6B7B; --accent:#1F4E84;
  --tint:#E9F1FB; --tintB:#9FBEE3; --line:#E3E9F0; --bg:#F4F7FB; --card:#fff;
  --warn:#B23A2E; --warnBg:#FBEDEB; --warnB:#E6B5AE; --good:#1E7A52; --goodBg:#ECF7F1; --goodB:#BFE3CF;
  font-family:Nunito,system-ui,Segoe UI,sans-serif;color:var(--body);line-height:1.5;
  max-width:760px;margin:0 auto;padding:26px 20px 70px;-webkit-font-smoothing:antialiased;
}
#sbs-fragebogen *{box-sizing:border-box}
#sbs-fragebogen h1{font-family:Lora,serif;font-weight:600;color:var(--ink);font-size:33px;line-height:1.15;margin:0 0 14px}
#sbs-fragebogen h2{font-family:Lora,serif;font-weight:600;color:var(--ink);font-size:21px;margin:0 0 16px}
#sbs-fragebogen .i-svg{flex:none;vertical-align:middle}
#sbs-fragebogen .spin{animation:sbsSpin 1s linear infinite}
@keyframes sbsSpin{to{transform:rotate(360deg)}}

/* Fortschritt oben */
#sbs-fragebogen .hprogwrap{height:4px;background:#DCE5EF;border-radius:999px;margin-bottom:20px;overflow:hidden}
#sbs-fragebogen #sbs-hprog{height:100%;width:0;background:var(--ink);transition:width .4s}

/* cards + fields */
#sbs-fragebogen .card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px 26px 24px;margin-bottom:18px}
#sbs-fragebogen .intro{color:var(--muted);font-size:14px;line-height:1.55;margin:0 0 18px}
#sbs-fragebogen .f{display:block;margin-bottom:14px}
#sbs-fragebogen .fl{display:block;font-size:14px;font-weight:700;color:var(--ink);margin-bottom:6px}
#sbs-fragebogen .fi{display:flex;align-items:center;gap:8px}
#sbs-fragebogen .inp{width:100%;padding:11px 13px;font-size:15px;font-family:Nunito,sans-serif;color:var(--body);background:#fff;border:1.5px solid var(--line);border-radius:10px;outline:none;transition:background .35s,border-color .35s}
#sbs-fragebogen .inp:focus{border-color:var(--accent)}
#sbs-fragebogen .inp::placeholder{color:#AAB4C0}
#sbs-fragebogen .ta{resize:vertical;min-height:80px}
#sbs-fragebogen .suf{color:var(--muted);font-size:14px;white-space:nowrap}
#sbs-fragebogen .suf.sm{font-size:13px}
#sbs-fragebogen .ml{display:block;font-size:12.5px;font-weight:700;color:var(--muted);margin-bottom:5px}
#sbs-fragebogen .minp{width:150px;padding:9px 11px;font-size:14px;font-family:Nunito,sans-serif;color:var(--body);border:1.5px solid var(--line);border-radius:9px;outline:none}
#sbs-fragebogen .minp.wide{width:100%;max-width:440px}

/* rows */
#sbs-fragebogen .row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
#sbs-fragebogen .rl{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--body)}
#sbs-fragebogen .rl.strong{font-weight:700;color:var(--ink)}
#sbs-fragebogen .ipanel{background:var(--ink);color:#E8F0F9;font-size:13px;line-height:1.5;border-radius:12px;padding:12px 14px;margin:4px 0 12px}

/* buttons / toggles */
#sbs-fragebogen .yn,#sbs-fragebogen .ch{display:inline-flex;flex-wrap:wrap;gap:8px}
#sbs-fragebogen .ynb{padding:7px 16px;font-size:14px;font-weight:700;font-family:Nunito,sans-serif;border-radius:999px;cursor:pointer;border:1.5px solid var(--line);background:#fff;color:var(--muted)}
#sbs-fragebogen .ynb.on{border-color:var(--ink);background:var(--ink);color:#fff}
#sbs-fragebogen .ynb.onN{background:#EEF2F7;color:var(--body)}
#sbs-fragebogen .chb{padding:8px 16px;font-size:14px;font-weight:700;font-family:Nunito,sans-serif;border-radius:10px;cursor:pointer;border:1.5px solid var(--line);background:#fff;color:var(--body)}
#sbs-fragebogen .chb.on{border-color:var(--ink);background:var(--ink);color:#fff}
#sbs-fragebogen .ib{width:22px;height:22px;border-radius:50%;border:none;cursor:pointer;background:var(--tint);color:var(--ink);font-family:Lora,serif;font-style:italic;font-weight:600;font-size:13px;line-height:1;display:inline-flex;align-items:center;justify-content:center}
#sbs-fragebogen .ib.open{background:var(--ink);color:#fff}
#sbs-fragebogen .tgl{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;border:1.5px solid var(--line);background:#fff;color:var(--muted);font-weight:700;font-size:14px;cursor:pointer;font-family:Nunito,sans-serif}
#sbs-fragebogen .tgl.on{border-color:var(--ink);background:var(--ink);color:#fff}
#sbs-fragebogen .wk{border-bottom:1px solid var(--line);padding:16px 0}
#sbs-fragebogen .wkhead{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
#sbs-fragebogen .wkfields{margin-top:14px;display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end}

#sbs-fragebogen .check{display:flex;gap:11px;align-items:flex-start;cursor:pointer;padding:14px 16px;border-radius:12px;border:1.5px solid var(--line);background:#fff}
#sbs-fragebogen .check.on{border-color:var(--ink);background:var(--tint)}
#sbs-fragebogen .check input{width:22px;height:22px;margin-top:1px;accent-color:var(--ink)}
#sbs-fragebogen .check.sm input{width:20px;height:20px}
#sbs-fragebogen .check span{font-size:15px;color:var(--body);line-height:1.5}
#sbs-fragebogen .check a{color:var(--accent)}

#sbs-fragebogen .warn{padding:13px 15px;background:var(--warnBg);border:1.5px solid var(--warnB);border-radius:12px;display:flex;gap:10px;align-items:flex-start;color:var(--warn);font-size:14px;line-height:1.5}
#sbs-fragebogen .okmsg{padding:22px;background:var(--goodBg);border:1.5px solid var(--goodB);border-radius:16px;color:var(--good)}
#sbs-fragebogen .okmsg h2{color:var(--good);margin-bottom:8px}
#sbs-fragebogen .okmsg p{font-size:15px;line-height:1.6;color:var(--body);margin:0}
#sbs-fragebogen .sendmsg{margin-top:14px;padding:12px 14px;border-radius:12px;font-size:14px;line-height:1.5;display:flex;gap:9px;align-items:flex-start;background:var(--warnBg);border:1.5px solid var(--warnB);color:var(--warn)}

/* intro-Karte (statt KI-Upload) */
#sbs-fragebogen .introcard{background:linear-gradient(135deg,var(--ink) 0%,var(--accent) 100%);border-radius:18px;padding:26px 26px 24px;color:#fff}
#sbs-fragebogen .ueyebrow{display:flex;align-items:center;gap:9px;margin-bottom:8px}
#sbs-fragebogen .ueyebrow span{text-transform:uppercase;letter-spacing:.12em;font-size:11.5px;font-weight:800;color:#BFD3EA}
#sbs-fragebogen .introcard h2{color:#fff;font-size:22px;margin:0 0 8px}
#sbs-fragebogen .introcard p{font-size:14.5px;line-height:1.55;color:#CBDAEC;margin:0;max-width:600px}
#sbs-fragebogen .introcard ul{margin:12px 0 0;padding-left:20px;font-size:14.5px;line-height:1.7;color:#E8F0F9}

/* eyebrow + hero */
#sbs-fragebogen .eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:12px;font-weight:800;color:var(--accent);margin:0 0 10px}
#sbs-fragebogen .lead{font-size:16px;line-height:1.6;color:var(--body);margin:0;max-width:640px}
#sbs-fragebogen .note{font-size:13.5px;color:var(--muted);line-height:1.6}

/* step indicator */
#sbs-fragebogen .ind{margin-bottom:18px}
#sbs-fragebogen .indtop{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
#sbs-fragebogen .indtitle{font-size:12.5px;font-weight:700;color:var(--muted)}
#sbs-fragebogen .dots{display:flex;gap:5px}
#sbs-fragebogen .dot{flex:1;height:5px;border-radius:999px;background:#DCE5EF;transition:background .3s}
#sbs-fragebogen .dot.on{background:var(--ink)}

/* nav */
#sbs-fragebogen .navbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px}
#sbs-fragebogen .navend{display:flex;gap:10px;flex-wrap:wrap}
#sbs-fragebogen .btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:12px;font-weight:800;font-size:15px;cursor:pointer;font-family:Nunito,sans-serif;border:none;text-decoration:none}
#sbs-fragebogen .btn.primary{background:var(--ink);color:#fff;padding:12px 24px}
#sbs-fragebogen .btn.primary[disabled]{opacity:.6;cursor:default}
#sbs-fragebogen .btn.ghost{background:#fff;color:var(--body);border:1.5px solid var(--line);font-weight:700}

/* recap */
#sbs-fragebogen .rgroup{margin-bottom:18px}
#sbs-fragebogen .rtitle{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent);margin:0 0 8px}
#sbs-fragebogen .rtable{border:1px solid var(--line);border-radius:12px;overflow:hidden}
#sbs-fragebogen .rrow{display:flex;gap:14px;padding:9px 13px;font-size:14px;border-bottom:1px solid var(--line)}
#sbs-fragebogen .rrow:last-child{border-bottom:none}
#sbs-fragebogen .rrow:nth-child(odd){background:#FAFCFE}
#sbs-fragebogen .rk{color:var(--muted);flex:0 0 42%;line-height:1.4}
#sbs-fragebogen .rv{color:var(--body);font-weight:600;line-height:1.4}

@media print{
  #sbs-fragebogen .no-print{display:none!important}
  #masthead,#colophon,.site-header,.site-footer,.elementor-location-header,.elementor-location-footer,header.entry-header{display:none!important}
}
