/* Lehner Projektbau – Stylesheet für Formularseiten
   (Mieterselbstauskunft & Bürgschaftserklärung), aufbauend auf style.css */

.formular-hero{
  background:var(--navy); color:var(--cream);
  padding:56px 0 48px;
}
.formular-hero h1{
  color:var(--cream); font-size:clamp(32px,4vw,48px); line-height:1.12; margin-top:14px;
  text-transform:uppercase; letter-spacing:.02em;
}
.formular-hero p{ margin-top:16px; max-width:640px; color:#cfd6da; font-size:15.5px; line-height:1.65; }
.formular-hero .eyebrow{ color:var(--sage); }
.zurueck-link{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13.5px; color:#a9b1b6; margin-bottom:10px;
}
.zurueck-link:hover{ color:var(--cream); }

.formular-main{ padding:56px 0 90px; }
.formular-grid{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:40px; align-items:start; }
.formular-card{ background:var(--white); border:1px solid var(--line); padding:44px; }

.formular-abschnitt{ margin-bottom:40px; }
.formular-abschnitt:last-child{ margin-bottom:0; }
.abschnitt-titel{
  display:flex; align-items:baseline; gap:12px;
  border-bottom:1px solid var(--line); padding-bottom:12px; margin-bottom:24px;
}
.abschnitt-titel .num{ font-family:'Montserrat', sans-serif; font-size:15px; color:var(--olive-dark); font-weight:600; }
.abschnitt-titel h2{ font-size:24px; }
.abschnitt-hinweis{ font-size:13px; color:var(--ink-soft); margin:-12px 0 20px; line-height:1.55; }

.pflicht-hinweis{ font-size:12.5px; color:var(--ink-soft); margin-bottom:26px; }
.pflicht-hinweis .stern{ color:#a03e3e; font-weight:700; }
label .stern{ color:#a03e3e; }

/* Ja/Nein-Fragen */
.frage{ border:1px solid var(--line); background:var(--cream); padding:16px 18px; margin-bottom:14px; }
.frage-text{ font-size:14px; color:var(--ink); font-weight:500; line-height:1.5; }
.frage-optionen{ display:flex; gap:24px; margin-top:10px; }
.frage-optionen label{
  display:inline-flex; align-items:center; gap:8px; font-size:14px; color:var(--ink);
  cursor:pointer; text-transform:none; letter-spacing:0; font-weight:500;
}
.frage-optionen input[type="radio"]{ width:16px; height:16px; accent-color:var(--navy); }
.frage .field-error{ margin-top:8px; }
.frage.has-error{ border-color:#a03e3e; }
.frage.has-error .field-error{ display:block; }

/* Checkbox-Erklärungen */
.erklaerung{ display:flex; gap:12px; align-items:flex-start; border:1px solid var(--line); background:var(--cream); padding:16px 18px; margin-bottom:14px; }
.erklaerung input[type="checkbox"]{ width:17px; height:17px; margin-top:2px; flex-shrink:0; accent-color:var(--navy); }
.erklaerung label{ font-size:13.5px; color:var(--ink); line-height:1.6; text-transform:none; letter-spacing:0; font-weight:400; cursor:pointer; margin:0; }
.erklaerung.has-error{ border-color:#a03e3e; }
.erklaerung-wrap .field-error{ margin:-8px 0 14px; }
.erklaerung-wrap.has-error .field-error{ display:block; }

/* Rechtstext Bürgschaft */
.rechtstext{
  border:1px solid var(--line); background:var(--cream); padding:20px 22px;
  font-size:13.5px; line-height:1.7; color:var(--ink);
}
.rechtstext p + p{ margin-top:12px; }
.rechtstext strong{ color:var(--navy); }

/* Unterschrift */
.unterschrift-block{ margin-bottom:20px; }
.unterschrift-canvas-wrap{
  position:relative; border:1px dashed var(--olive-dark); background:var(--cream);
}
.unterschrift-canvas-wrap canvas{ display:block; width:100%; height:160px; touch-action:none; cursor:crosshair; }
.unterschrift-canvas-wrap .platzhalter{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:13.5px; color:var(--ink-soft); pointer-events:none; font-style:italic;
}
.unterschrift-canvas-wrap.hat-inhalt .platzhalter{ display:none; }
.unterschrift-tools{ display:flex; justify-content:space-between; align-items:center; margin-top:8px; }
.unterschrift-tools .btn-klein{
  background:none; border:1px solid var(--line); padding:7px 14px; font-size:12.5px;
  cursor:pointer; font-family:'Montserrat', sans-serif; color:var(--ink-soft);
}
.unterschrift-tools .btn-klein:hover{ border-color:var(--navy); color:var(--navy); }
.unterschrift-block.has-error .unterschrift-canvas-wrap{ border-color:#a03e3e; }
.unterschrift-block .field-error{ margin-top:6px; }
.unterschrift-block.has-error .field-error{ display:block; }

/* Seitenleiste */
.formular-seitenleiste{ position:sticky; top:96px; display:flex; flex-direction:column; gap:18px; }
.seiten-box{ background:var(--white); border:1px solid var(--line); padding:26px; }
.seiten-box h3{ font-size:16px; }
.seiten-box p{ margin-top:10px; font-size:13.5px; color:var(--ink-soft); line-height:1.6; }
.seiten-box ol{ margin:12px 0 0; padding-left:18px; font-size:13.5px; color:var(--ink-soft); line-height:1.7; }
.seiten-box .ap{ display:flex; align-items:center; gap:12px; margin-top:14px; }
.seiten-box .ap-avatar{ width:38px; height:38px; font-size:13px; }
.seiten-box a.mail{ color:var(--olive-dark); font-weight:600; font-size:13px; word-break:break-all; }
.seiten-box.datenschutz{ background:var(--cream-2); }

/* Aktionen / Ergebnis */
.formular-aktionen{ margin-top:36px; border-top:1px solid var(--line); padding-top:28px; }
.formular-aktionen .btn{ width:100%; justify-content:center; }
.ergebnis-panel{ margin-top:20px; border:1px solid #b9d2c0; background:#eaf2ec; padding:24px; }
.ergebnis-panel h3{ color:#2f5e3f; font-size:17px; font-family:'Montserrat', sans-serif; }
.ergebnis-panel p{ margin-top:10px; font-size:14px; color:#37503f; line-height:1.6; }
.ergebnis-panel .btn{ margin-top:16px; }
.ergebnis-schritte{ margin:12px 0 0; padding-left:20px; font-size:14px; color:#37503f; line-height:1.8; }

@media (max-width:980px){
  .formular-grid{ grid-template-columns:1fr; }
  .formular-seitenleiste{ position:static; }
  .formular-card{ padding:28px 22px; }
}