/* =============================================================
   rechner.css – „Lohnt sich das?“-Rechner (/bau-sanierung/anfrage)
   ============================================================= */
.rechner_component{display:grid;grid-template-columns:1fr 1.15fr;gap:4rem;align-items:start}
.rechner_intro{position:sticky;top:calc(var(--navbar-height) + 2rem)}
.rechner_benefits{color:var(--text-muted)}
.rechner_note{display:flex;flex-wrap:wrap;gap:1.5rem;padding-top:1.5rem;border-top:1px solid var(--line);font-size:.875rem;color:var(--text-muted)}
.rechner_note span{display:inline-flex;align-items:center;gap:.5rem}
.rechner_note span::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--marine)}

.quiz_card{padding:3rem;border-radius:var(--radius-large);background:var(--weiss);border:1px solid var(--line);color:var(--marine)}
.quiz_progress-meta{display:flex;justify-content:space-between;align-items:center;gap:1rem;font-size:.875rem;font-weight:600;;color:var(--marine)}
.quiz_progress{height:.375rem;border-radius:var(--radius-pill);background:var(--himmel);overflow:hidden}
.quiz_progress-fill{width:25%;height:100%;border-radius:var(--radius-pill);background:var(--marine);transition:width .35s ease}
.quiz_step{display:none}
.quiz_step.is-active{display:block;animation:quiz-in .3s ease}
@keyframes quiz-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.quiz_question{font-family:var(--font-display);letter-spacing:-.035em;font-weight:800;font-size:2rem;line-height:1.15}
.quiz_hint{font-size:.9375rem;color:var(--text-muted)}

.quiz_options{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.quiz_option{display:flex;align-items:center;gap:.75rem;width:100%;min-height:3.5rem;padding:.75rem 1rem;border:1.5px solid var(--line);border-radius:var(--radius-medium);background:var(--weiss);color:var(--marine);font:inherit;font-size:.9375rem;font-weight:500;text-align:left;cursor:pointer;transition:border-color .15s ease,background-color .15s ease}
.quiz_option:hover{border-color:var(--line-strong);background:var(--himmel-hell)}
.quiz_option.is-selected{border-color:var(--marine);background:var(--himmel);box-shadow:inset 0 0 0 1px var(--marine)}
.quiz_option.is-wide{grid-column:1/-1;justify-content:center;text-align:center}
.quiz_option-icon{flex:none;display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:.625rem;background:var(--himmel);color:var(--text-muted)}
.quiz_option.is-selected .quiz_option-icon{background:var(--limette);color:var(--marine)}
.quiz_option-icon svg{width:1rem;height:1rem}

.quiz_tabs{display:inline-flex;gap:.25rem;padding:.25rem;border-radius:var(--radius-pill);background:var(--himmel)}
.quiz_tab{padding:.5rem 1rem;border:0;border-radius:var(--radius-pill);background:none;color:var(--text-muted);font:inherit;font-size:.875rem;font-weight:600;cursor:pointer}
.quiz_tab.is-active{background:var(--weiss);color:var(--marine);box-shadow:inset 0 0 0 1px var(--line)}
.quiz_row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
select.form_input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%23182848' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .75rem center;background-size:1rem;padding-right:3rem}
.form_input:disabled{background-color:var(--himmel);color:var(--text-soft)}

.quiz_nav{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-top:1.5rem;border-top:1px solid var(--line)}
.quiz_back{padding:.5rem 0;border:0;background:none;color:var(--text-muted);font:inherit;font-size:.9375rem;font-weight:600;cursor:pointer}
.quiz_back:hover{color:var(--marine)}
.quiz_back[hidden]{display:block;visibility:hidden}
.quiz_nav .button[disabled]:hover{background:var(--btn-bg)}

/* Ergebnis-Vorschau */
.teaser_card{position:relative;overflow:hidden;padding:1.5rem;border:1px solid var(--line);border-radius:var(--radius-large);background:var(--himmel)}
.teaser_meta{display:flex;flex-wrap:wrap;gap:.5rem}
.teaser_meta .tag{max-width:100%;overflow:hidden;text-overflow:ellipsis;background:var(--weiss);border:1px solid var(--line)}
.teaser_grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.teaser_kpi{padding:1rem;border-radius:var(--radius-small);background:var(--weiss)}
.teaser_kpi-label{font-size:.75rem;color:var(--text-muted)}
.teaser_kpi-value{font-family:var(--font-display);font-weight:800;font-size:1.75rem;line-height:1.2;letter-spacing:-.035em}
.teaser_verdict{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem;border-radius:var(--radius-medium);background:var(--marine);color:var(--weiss)}
.teaser_verdict-value{font-family:var(--font-display);letter-spacing:-.035em;font-weight:800;font-size:1.375rem;color:var(--marine);background:var(--limette);padding:0 .3em;border-radius:.3em}
.is-blurred{filter:blur(7px);user-select:none;pointer-events:none}
.teaser_lock{position:absolute;top:1rem;right:1rem;display:inline-flex;align-items:center;gap:.5rem;--lock-icon:var(--limette);padding:.25rem .75rem;border-radius:10rem;background:var(--marine);color:var(--weiss);font-size:.75rem;font-weight:600}
.teaser_lock svg{width:.875rem;height:.875rem;color:var(--limette)}

/* Danke */
.quiz_success-icon{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:var(--radius-medium);background:var(--limette);color:var(--marine)}
.quiz_success-icon svg{width:1.5rem;height:1.5rem}

@media (max-width:991px){
  .rechner_component{grid-template-columns:1fr;gap:3rem}
  .rechner_intro{position:static}
}
@media (max-width:640px){
  .quiz_card{padding:1.5rem}
  .quiz_question{font-size:1.625rem}
  .quiz_options,.quiz_row,.teaser_grid{grid-template-columns:1fr}
  .quiz_nav .button{flex:1}
  .rechner_benefits-wrap{display:none}
}
@media (prefers-reduced-motion:reduce){.quiz_step.is-active{animation:none}.quiz_progress-fill{transition:none}}