/* IT-Quickaudit — Rechner-Styles.
   Optik nach "Website Martin Höck v2.dc.html" (Claude Design), Abschnitt
   isQuickaudit: Fragen ohne Kartenrahmen mit zweistelliger Mono-Nummer,
   rechteckige Auswahlflaechen, helle Ergebniskarte mit dunkler Schaltflaeche,
   Pruefumfang als Liste. Theme-unabhaengig und praefixiert .itqa. */
.itqa{
  --itqa-navy:#16283c;      /* blue-800, Primaerfarbe der Marke */
  --itqa-accent:#25405a;    /* blue-700, gefuellte Schaltflaeche */
  --itqa-blue600:#37587a;   /* Nummern und Auszeichnungen */
  --itqa-ink:#11161f;
  --itqa-body:#373d48;
  --itqa-muted:#686f7b;
  --itqa-faint:#8b929c;
  --itqa-line:#d7dbe0;
  --itqa-soft:#eef2f6;
  --itqa-surface:#fff;
  --itqa-radius:6px;
  --itqa-radius-lg:8px;
  font-size:1rem;line-height:1.55;color:var(--itqa-body)}
.itqa *{box-sizing:border-box}

.itqa-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:3rem;align-items:start}
@media (max-width:900px){.itqa-grid{grid-template-columns:1fr;gap:2rem}}

.itqa-form{display:grid;gap:1.75rem}

/* --- Fragen: flach, ohne Karte ------------------------------------------ */
.itqa-q{border:0;margin:0;padding:0;display:grid;gap:.6rem}
.itqa-q legend{
  display:flex;gap:.75rem;align-items:baseline;padding:0;
  font-weight:600;font-size:1rem;line-height:1.5;color:var(--itqa-ink)}
.itqa-num{
  font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:.82rem;font-weight:500;color:var(--itqa-blue600);
  flex:0 0 auto}
.itqa-hint{font-size:.82rem;color:var(--itqa-muted);margin:0}
.itqa-sub{display:block;width:100%;font-weight:600;font-size:.9rem;margin:.6rem 0 .1rem;color:var(--itqa-ink)}
.itqa-break{display:block;width:100%}

/* --- Auswahlflaechen: rechteckig statt Pille ---------------------------- */
.itqa-chips{display:flex;flex-wrap:wrap;gap:.5rem}
.itqa-chips select{
  font:inherit;font-size:.9rem;color:var(--itqa-ink);background:var(--itqa-surface);
  border:1px solid var(--itqa-line);border-radius:var(--itqa-radius);
  padding:.625rem .75rem;width:100%;max-width:22.5rem}
.itqa-chips textarea{
  font:inherit;font-size:.9rem;line-height:1.5;color:var(--itqa-ink);background:var(--itqa-surface);
  border:1px solid var(--itqa-line);border-radius:var(--itqa-radius);
  padding:.625rem .75rem;width:100%;resize:vertical;min-height:5.5rem}
.itqa-chips textarea:focus-visible{outline:2px solid var(--itqa-blue600);outline-offset:2px}
.itqa-chips textarea::placeholder{color:var(--itqa-faint)}
.itqa-chips input[type=radio],.itqa-chips input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}
.itqa-chips label{
  display:inline-block;padding:.625rem .875rem;
  border:1px solid var(--itqa-line);border-radius:var(--itqa-radius);
  background:var(--itqa-surface);cursor:pointer;
  font-size:.82rem;font-weight:500;line-height:1;color:var(--itqa-body);
  user-select:none;transition:background 180ms cubic-bezier(.2,0,0,1),border-color 180ms cubic-bezier(.2,0,0,1)}
.itqa-chips label:hover{background:var(--itqa-soft);border-color:var(--itqa-blue600)}
.itqa-chips input:checked+label{background:var(--itqa-navy);border-color:var(--itqa-navy);color:#fff}
.itqa-chips input:focus-visible+label{outline:2px solid var(--itqa-blue600);outline-offset:2px}

/* --- Seitenleiste ------------------------------------------------------- */
.itqa-result{position:sticky;top:6rem;display:grid;gap:1rem}
@media (max-width:900px){.itqa-result{position:static}}

.itqa-karte{
  background:var(--itqa-surface);border:1px solid var(--itqa-line);
  border-radius:var(--itqa-radius-lg);padding:1.5rem;display:grid;gap:.75rem}
.itqa-karte h3,.itqa-karte h4{
  font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  color:var(--itqa-muted);margin:0;line-height:1.45}

.itqa-panel{border-top:2px solid var(--itqa-navy);gap:.875rem;
  box-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06)}
.itqa-price{font-size:2rem;font-weight:500;line-height:1.2;letter-spacing:-.02em;color:var(--itqa-ink)}
.itqa-indiv{font-size:1.25rem;font-weight:600;line-height:1.3;display:inline-block}
.itqa-note{font-size:.75rem;line-height:1.55;color:var(--itqa-muted);margin:0}
.itqa-cta{
  display:block;width:100%;font:600 .875rem/1 inherit;
  background:var(--itqa-accent);color:#fff;border:0;
  border-radius:var(--itqa-radius);padding:.875rem 1.125rem;cursor:pointer;
  transition:background 180ms cubic-bezier(.2,0,0,1)}
.itqa-cta:hover{background:var(--itqa-navy)}
.itqa-trust{font-size:.75rem;color:var(--itqa-faint);margin:0;text-align:center}

/* --- Anfrageformular in der Ergebniskarte ------------------------------- */
.itqa-lead{margin-top:.25rem;background:var(--itqa-soft);border:1px solid var(--itqa-line);
  border-radius:var(--itqa-radius);padding:.9rem}
.itqa-lead label{display:block;font-size:.8rem;margin-bottom:.55rem;color:var(--itqa-body)}
.itqa-lead input[type=text],.itqa-lead input[type=email],.itqa-lead input[type=tel]{display:block;width:100%;
  font:inherit;font-size:.875rem;border:1px solid var(--itqa-line);border-radius:var(--itqa-radius);
  padding:.45rem .6rem;margin-top:.15rem;background:#fff;color:var(--itqa-ink)}
.itqa-check{display:flex;gap:.5rem;align-items:flex-start;font-size:.76rem}
.itqa-check input{margin-top:.2rem}
.itqa-hp{position:absolute;left:-9999px;height:1px;width:1px;opacity:0}
.itqa-meldung{font-size:.8rem;margin-top:.5rem;min-height:1.2em}
.itqa-ok{font-size:.9rem;margin:0}

/* --- Pruefumfang: Liste mit Trennlinie je Zeile ------------------------- */
.itqa-cluster{gap:.75rem}
.itqa-ctags{display:grid;gap:.5rem;margin:0;padding:0;list-style:none}
.itqa-tag{
  font-size:.875rem;line-height:1.5;color:var(--itqa-body);
  padding-bottom:.5rem;border-bottom:1px solid var(--itqa-line)}
.itqa-ctags .itqa-tag:last-child{border-bottom:0;padding-bottom:0}
/* Module, die erst durch die Antworten hinzukommen — im Entwurf Teil
   derselben Liste, hier zusaetzlich am Akzentton erkennbar. */
.itqa-mod{color:var(--itqa-navy);font-weight:500}

/* --- Zubuchbare Optionen ------------------------------------------------ */
.itqa-opt{display:grid;grid-template-columns:1fr auto;gap:.75rem;align-items:baseline}
.itqa-opt-t{display:grid;gap:.125rem}
.itqa-opt-t strong{font-size:.875rem;font-weight:600;color:var(--itqa-ink)}
.itqa-opt-t span{font-size:.8rem;color:var(--itqa-muted)}
.itqa-opt-p{font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  font-size:.8rem;font-weight:500;color:var(--itqa-body);white-space:nowrap}
.itqa-fuss{font-size:.75rem;color:var(--itqa-faint);margin:0}

/* --- Hinweiskasten ------------------------------------------------------ */
.itqa-wissen{background:var(--itqa-soft);padding:1.25rem 1.5rem;gap:.5rem}
.itqa-wissen h4{color:var(--itqa-blue600)}
.itqa-wissen p{font-size:.82rem;line-height:1.6;color:var(--itqa-body);margin:0}