/* ============================================================
   AvB Anfragestrecke (Kontaktseite)
   Vier Fragen, je eine pro Bildschirm, danach ein kurzes
   Formular. Alle Klassen tragen das Präfix "anf-", damit nichts
   mit den bestehenden Klassen (.steps, .step, .feat …) kollidiert.
   Bewegung: nur opacity und transform, Reaktion ab Pointer-Down,
   ohne Bewegung bei "Bewegung reduzieren".
   ============================================================ */

.anf{background:var(--white); border:1px solid var(--border); border-radius:var(--r-lg);
  box-shadow:var(--shadow); overflow:hidden; max-width:780px;}
.anf-head{display:flex; align-items:center; gap:14px; min-height:58px; padding:12px 26px;
  border-bottom:1px solid var(--border);}
.anf-back{appearance:none; background:none; border:0; padding:6px 2px; cursor:pointer;
  font-family:var(--sans); font-size:14px; color:var(--slate);
  transition:color .15s ease, transform .1s ease-out;}
.anf-back:hover{color:var(--navy);}
.anf-back:active{transform:scale(.97);}
.anf-back[hidden]{display:none;}
.anf-count{font-family:var(--mono); font-size:12px; color:var(--slate); font-variant-numeric:tabular-nums;}
.anf-dots{display:flex; gap:7px; margin-left:auto;}
.anf-dots i{width:7px; height:7px; border-radius:50%; background:var(--border-strong);
  transition:background .2s ease, transform .2s ease;}
.anf-dots i.on{background:var(--gold); transform:scale(1.25);}

.anf-panel{padding:30px 26px 32px; transition:opacity .16s ease;}
.anf-panel.anf-swap{opacity:0;}
.anf-q{font-family:var(--serif); font-weight:500; font-size:clamp(21px,2.4vw,26px); line-height:1.2;
  color:var(--ink); margin:0 0 6px; text-wrap:balance; outline:none;}
.anf-sub{color:var(--slate); font-size:15px; margin:0 0 22px;}

/* Auswahl */
.anf-opts{display:grid; gap:10px;}
.anf-opts.anf-two{grid-template-columns:1fr 1fr;}
.anf-opt{appearance:none; width:100%; text-align:left; cursor:pointer; font:inherit;
  display:flex; gap:14px; align-items:flex-start; min-width:0;
  background:var(--white); border:1px solid var(--border-strong); border-radius:var(--r);
  padding:16px 18px; color:var(--ink);
  transition:border-color .18s ease, background .18s ease, transform .1s ease-out;}
.anf-opt:hover{border-color:var(--gold);}
.anf-opt:active{transform:scale(.985);}
.anf-opt[aria-pressed="true"]{border-color:var(--gold); background:#fdfbf6;}
.anf-opt .anf-dia{color:var(--gold); font-size:11px; line-height:1.9; flex:0 0 auto;}
.anf-opt b{display:block; font-weight:600; font-size:15.5px; color:var(--navy);}
.anf-opt span.anf-d{display:block; margin-top:3px; font-size:14px; color:var(--slate); line-height:1.5;}

/* Formular */
.anf-pre{display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; margin:0 0 20px;
  padding:11px 14px; background:#fdfbf6; border:1px solid var(--border); border-radius:8px;
  font-family:var(--mono); font-size:12px; color:var(--slate);}
.anf-pre b{color:var(--navy); font-weight:500;}
.anf-fields{display:grid; gap:16px;}
.anf-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.anf label.anf-l{display:block; font-size:13px; font-weight:600; color:var(--navy); margin-bottom:6px;}
.anf label.anf-l small{font-weight:400; color:var(--mute); font-size:12.5px;}
.anf input[type="text"],.anf input[type="email"],.anf input[type="tel"],.anf select,.anf textarea{
  width:100%; min-width:0; font:inherit; font-size:15.5px; color:var(--ink); background:var(--white);
  border:1px solid var(--border-strong); border-radius:8px; padding:11px 13px;
  transition:border-color .15s ease, box-shadow .15s ease;}
.anf textarea{min-height:92px; resize:vertical;}
.anf input:focus,.anf select:focus,.anf textarea:focus{outline:none; border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(160,138,91,.16);}
.anf [aria-invalid="true"]{border-color:#9b3b3b;}
.anf-check{display:flex; gap:11px; align-items:flex-start; font-size:14px; color:var(--slate); line-height:1.55;
  cursor:pointer;}
.anf-check input{flex:0 0 auto; width:18px; height:18px; margin-top:2px; accent-color:var(--navy);}
.anf-check a{color:var(--navy); text-decoration:underline; text-underline-offset:2px;}
.anf-err{color:#9b3b3b; font-size:14px; margin:0;}
.anf-err[hidden]{display:none;}
.anf-actions{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:24px;}
.anf-actions .btn:active{transform:scale(.975);}
.anf-note{margin-top:14px; font-size:13px; color:var(--slate); line-height:1.6;}

/* Ergebnis */
.anf-tag{display:inline-flex; align-items:center; gap:7px; margin-bottom:14px;
  font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;
  color:#2f6b4f; background:rgba(47,107,79,.07); border:1px solid rgba(47,107,79,.3);
  border-radius:999px; padding:5px 12px;}
.anf-next{list-style:none; margin:20px 0 0; padding:0; border-top:1px solid var(--border);}
.anf-next li{display:grid; grid-template-columns:28px 1fr; gap:12px; padding:14px 0; border-bottom:1px solid var(--border);}
.anf-next .anf-n{font-family:var(--mono); font-size:12px; color:var(--gold); padding-top:3px;}
.anf-next b{display:block; color:var(--ink); font-weight:600; font-size:15px;}
.anf-next span.anf-t{display:block; color:var(--slate); font-size:14px;}
.anf-mail{margin-top:22px; background:var(--navy); color:var(--on-navy); border-radius:var(--r);
  padding:18px 20px;}
.anf-mail h5{margin:0 0 12px; font-family:var(--sans); font-size:11px; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--gold-soft);}
.anf-mail pre{margin:0; white-space:pre-wrap; overflow-wrap:anywhere; font-family:var(--mono); font-size:12.5px;
  line-height:1.65; color:var(--on-navy);}

@media (max-width:680px){
  .anf-head{padding:12px 18px;}
  .anf-panel{padding:24px 18px 26px;}
  .anf-opts.anf-two,.anf-row{grid-template-columns:1fr;}
  .anf-count{display:none;}
}
@media (prefers-reduced-motion: reduce){
  .anf *,.anf-panel{transition:none !important;}
  .anf-opt:active,.anf-back:active,.anf-actions .btn:active{transform:none;}
}
@media (prefers-contrast: more){
  .anf-opt,.anf input,.anf select,.anf textarea{border-color:var(--slate);}
  .anf-sub,.anf-check,.anf-note{color:var(--ink);}
}