/* =============================================================================
   anfrage-formular.css — Anfrageformular auf allen Leistungsseiten
   Kacheln wie im Sanierungs-Check (.sc-wahl), eine Frage pro Bildschirm.
   Farben wie die Website: Navy #1A2B47, Gruen #6BA84A, Orange #F97316
   ============================================================================= */
.wbf-section{background:#f0fdf4;padding:2.5rem 0 3.5rem;scroll-margin-top:calc(80px + var(--sl-h,0px))}
.wbf-wrap{max-width:60rem;margin:0 auto;padding:0 1rem}
.wbf-card,.wbf-alt{max-width:44rem;margin-left:auto;margin-right:auto}
.wbf-head{text-align:center;margin-bottom:1.25rem}
.wbf-head h2{font-size:1.6rem;line-height:1.25;font-weight:700;color:#1A2B47;margin:0}
.wbf-head p{color:#4b5563;margin:.5rem auto 0;max-width:36rem}
.wbf-card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 10px 30px rgba(26,43,71,.08);padding:1.25rem 1.1rem 1.4rem;scroll-margin-top:calc(84px + var(--sl-h,0px))}
@media(min-width:640px){.wbf-card{padding:1.75rem 2rem 2rem}.wbf-head h2{font-size:1.9rem}}
.wbf-progress{height:8px;background:#e5e7eb;border-radius:99px;overflow:hidden}
.wbf-progress span{display:block;height:100%;width:25%;background:#6BA84A;border-radius:99px;transition:width .3s}
.wbf-stepinfo{font-size:.8rem;color:#6b7280;text-align:center;margin:.5rem 0 1rem;font-weight:600;letter-spacing:.02em}
#contact-form .step-content{display:none}
#contact-form .step-content.active{display:block}
.wbf-title{font-size:1.25rem;font-weight:700;color:#1A2B47;text-align:center;margin:0 0 1.25rem;padding:0;width:100%}
.wbf-hint{text-align:center;color:#6b7280;font-size:.9rem;margin:-.9rem 0 1rem}
.wbf-group{border:0;margin:0 0 1.1rem;padding:0;min-width:0}
.wbf-group legend{font-weight:600;color:#1A2B47;font-size:.95rem;margin-bottom:.5rem;padding:0}
.wbf-group legend small{font-weight:400;color:#6b7280}
.wbf-chips{display:flex;flex-wrap:wrap;gap:.5rem}
.wbf-chip{font:inherit;font-size:.92rem;line-height:1.2;color:#1A2B47;background:#fff;border:1.5px solid #cfd6e0;border-radius:99px;padding:.6rem .95rem;cursor:pointer;text-align:left;transition:background .15s,border-color .15s,color .15s;min-height:44px}
.wbf-chip:hover{border-color:#1A2B47}
.wbf-chip[aria-pressed="true"]{background:#f0fdf4;border-color:#6BA84A;box-shadow:0 0 0 1px #6BA84A;color:#1A2B47}
.wbf-chip[aria-pressed="true"]::before{content:"✓ ";font-weight:700}
.wbf-chip:focus-visible,.wbf-next:focus-visible,.wbf-submit:focus-visible,.wbf-back:focus-visible{outline:3px solid #F97316;outline-offset:2px}
.wbf-nav{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-top:1.25rem}
.wbf-nav.end{justify-content:flex-end}
.wbf-next,.wbf-submit{font:inherit;font-weight:700;font-size:1rem;color:#111827;background:#F97316;border:0;border-radius:10px;padding:.85rem 1.3rem;cursor:pointer;box-shadow:0 4px 12px rgba(249,115,22,.3);transition:background .15s}
.wbf-next:hover,.wbf-submit:hover{background:#EA580C}
/* Weiter zwischen den Fragen gruen wie im Sanierungs-Check, Orange bleibt dem Absenden */
.wbf-next{background:#6BA84A;box-shadow:0 4px 12px rgba(107,168,74,.3)}
.wbf-next:hover{background:#46702f}
.wbf-submit{flex:1;max-width:22rem}
@media(max-width:560px){.wbf-absenden{flex-direction:column;align-items:stretch}.wbf-absenden .wbf-submit{max-width:none;width:100%}.wbf-absenden .wbf-back{align-self:center;order:2}}
.wbf-submit[disabled]{opacity:.7;cursor:wait}
.wbf-back{font:inherit;font-size:.95rem;color:#4b5563;background:none;border:0;padding:.6rem .4rem;cursor:pointer}
.wbf-back:hover{color:#1A2B47;text-decoration:underline}
.wbf-summary{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center;align-items:center;margin:0 0 1rem}
.wbf-summary[hidden]{display:none}
.wbf-pille{font-size:.85rem;font-weight:600;color:#1A2B47;background:#f0fdf4;border-radius:99px;padding:.3rem .75rem;box-shadow:0 0 0 1.5px #6BA84A}
.wbf-summary button{font:inherit;font-size:.85rem;color:#3465A4;background:none;border:0;text-decoration:underline;cursor:pointer;padding:0 0 0 .2rem}
.wbf-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:.85rem}
.wbf-field label,.wbf-label{display:block;font-size:.9rem;font-weight:600;color:#1A2B47;margin-bottom:.3rem}
.wbf-field label small{font-weight:400;color:#6b7280}
.wbf-field input[type=text],.wbf-field input[type=email],.wbf-field input[type=tel],.wbf-field textarea{width:100%;font:inherit;font-size:1rem;color:#1f2937;background:#fff;border:1px solid #cfd6e0;border-radius:8px;padding:.7rem .8rem;box-sizing:border-box}
.wbf-field input:focus,.wbf-field textarea:focus{outline:none;border-color:#46702f;box-shadow:0 0 0 3px rgba(70,112,47,.2)}
.wbf-field textarea{min-height:5rem;resize:vertical}
.wbf-row{display:grid;gap:.85rem}
@media(min-width:640px){.wbf-row{grid-template-columns:1fr 1fr}}
.wbf-oder{font-size:.85rem;color:#6b7280;margin:-.2rem 0 0}
.wbf-check{display:flex;align-items:flex-start;gap:.55rem;font-size:.95rem;color:#1f2937;cursor:pointer}
.wbf-check input{width:1.15rem;height:1.15rem;margin-top:.12rem;accent-color:#46702f}
.wbf-zeit{margin:.5rem 0 0 1.7rem}
.wbf-datei{margin:0}
.wbf-dateiknopf{display:flex;align-items:center;justify-content:center;gap:.5rem;border:2px dashed #cfd6e0;border-radius:10px;padding:.9rem;background:#f9fafb;cursor:pointer;color:#1A2B47;font-weight:700;font-size:.95rem;text-align:center}
.wbf-dateiknopf:hover{border-color:#6BA84A;background:#f0fdf4}
.wbf-dateiknopf svg{width:20px;height:20px;flex:none}
.wbf-dateiknopf small{font-weight:400;color:#6b7280}
.wbf-dateifeld{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
.wbf-dateifeld:focus-visible+.wbf-dateiliste,.wbf-datei:focus-within .wbf-dateiknopf{outline:3px solid #F97316;outline-offset:2px}
.wbf-dateiliste{list-style:none;margin:.5rem 0 0;padding:0;display:grid;gap:.35rem}
.wbf-dateiliste li{display:flex;justify-content:space-between;align-items:center;gap:.5rem;font-size:.88rem;color:#1f2937;background:#f9fafb;border-radius:8px;padding:.4rem .6rem}
.wbf-dateiliste li span{overflow-wrap:anywhere}
.wbf-dateiliste button{font:inherit;font-size:.82rem;color:#b91c1c;background:none;border:0;text-decoration:underline;cursor:pointer;flex:none}
.wbf-nachricht summary{cursor:pointer;font-size:.95rem;font-weight:600;color:#3465A4}
.wbf-nachricht summary small{font-weight:400;color:#6b7280}
.wbf-nachricht[open] summary{margin-bottom:.5rem}
.wbf-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.wbf-small{font-size:.8rem;color:#6b7280;margin:.4rem 0 0;line-height:1.45}
.wbf-error{color:#b91c1c;font-size:.9rem;font-weight:600;background:#fef2f2;border-radius:8px;padding:.6rem .75rem;margin:.9rem 0 0}
.wbf-error a{color:#b91c1c}
.wbf-promise{text-align:center;font-size:.88rem;color:#1A2B47;font-weight:600;margin:1rem 0 0}
.wbf-legal{text-align:center;font-size:.75rem;color:#6b7280;margin:.5rem 0 0;line-height:1.5}
.wbf-legal a{color:inherit;text-decoration:underline}
.wbf-logos{display:flex;justify-content:center;align-items:center;gap:1.25rem;margin-top:1rem;padding-top:1rem;border-top:1px solid #f3f4f6}
.wbf-logos img{max-height:1.8rem;width:auto;opacity:.75}
.wbf-alt{text-align:center;font-size:.92rem;color:#4b5563;margin:1rem auto 0}
.wbf-alt a{color:#1A2B47;font-weight:600;text-decoration:underline;white-space:nowrap}
@media(prefers-reduced-motion:reduce){.wbf-progress span,.wbf-chip{transition:none}}
@media(max-width:480px){
  .wbf-chips{gap:.4rem}
  .wbf-chip{font-size:.88rem;padding:.5rem .8rem;min-height:40px}
  .wbf-group{margin-bottom:.95rem}
  .wbf-title{font-size:1.15rem}
}

/* Fragen: eine pro Bildschirm, Kacheln wie im Sanierungs-Check */
.wbf-frage{border:0;margin:0;padding:0;min-width:0;display:none}
.wbf-frage.aktiv{display:block;animation:wbfAuf .25s ease}
.wbf-frage:focus{outline:none}
@keyframes wbfAuf{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wbf-kacheln{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.wbf-kachel{font:inherit;border:1px solid #d7dde3;border-radius:10px;background:#fff;padding:20px 12px;text-align:center;cursor:pointer;
  transition:box-shadow .15s ease,transform .15s ease,background .15s;user-select:none;color:#1A2B47;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:120px;min-width:0}
.wbf-kachel:hover{box-shadow:0 6px 16px rgba(26,43,71,.10);transform:translateY(-1px)}
.wbf-kachel[aria-pressed="true"]{box-shadow:0 0 0 2px #6BA84A;background:#f0fdf4;border-color:#6BA84A}
.wbf-kachel svg{width:44px;height:44px;margin:0 auto 10px;display:block;color:#1A2B47;opacity:.82;flex:none}
.wbf-kachel .t{font-weight:700;color:#1A2B47;font-size:17px;line-height:1.25;min-width:0;overflow-wrap:break-word;hyphens:auto}
.wbf-kachel .u{font-size:13px;color:#5C6B72;margin-top:2px}
.wbf-kachel.flach{grid-column:1 / -1;flex-direction:row;gap:10px;padding:13px;min-height:0}
.wbf-kachel.flach svg{width:26px;height:26px;margin:0}
.wbf-kachel.flach .t{font-size:15.5px}
.wbf-kachel.flach .u{margin:0 0 0 .25rem}
.wbf-kacheln.flach .wbf-kachel.flach{grid-column:auto;justify-content:flex-start;text-align:left}
.wbf-kacheln.flach .wbf-kachel.flach .u{display:none}
.wbf-kachel:focus-visible,.wbf-skip:focus-visible{outline:3px solid #F97316;outline-offset:2px}
.wbf-skip{font:inherit;font-size:.95rem;color:#4b5563;background:none;border:0;padding:.6rem .4rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.wbf-skip:hover{color:#1A2B47}
@media(max-width:520px){.wbf-kacheln{gap:10px}.wbf-kachel{padding:16px 8px;min-height:108px}.wbf-kachel .t{font-size:15.5px}}
@media(max-width:400px){.wbf-kachel .t{font-size:14px}.wbf-kachel svg{width:38px;height:38px}}
@media(max-width:560px){.wbf-kacheln.flach{grid-template-columns:minmax(0,1fr);gap:8px}.wbf-kacheln.flach .wbf-kachel.flach{padding:11px 13px}}
@media(prefers-reduced-motion:reduce){.wbf-frage.aktiv{animation:none}.wbf-kachel{transition:none}}
.wbf-field input::placeholder,.wbf-field textarea::placeholder{color:#6b7280;opacity:1}
@media(max-width:374px){.wbf-kachel .t{font-size:13px}}
/* Energieausweis: voraussichtlicher Ausweis bei den Kontaktdaten (anfrage-formular.js) */
.wbf-ergebnis { border: 1.5px solid #6BA84A; background: #f0fdf4; border-radius: 12px; padding: .8rem .95rem; margin: 0 0 1rem; display: grid; gap: .25rem; text-align: left; }
.wbf-ergebnis[hidden] { display: none; }
.wbf-ergebnis .k { font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #3a5d27; }
.wbf-ergebnis b { font-size: 1.05rem; color: #1A2B47; }
.wbf-ergebnis .p { font-weight: 700; color: #1A2B47; font-size: .95rem; }
.wbf-ergebnis .w { font-size: .88rem; color: #475569; line-height: 1.5; }