/* ===== Grundlayout ===== */
.ibm {
  /* font-family entfernt, damit Astra-Font greift */
  max-width: 960px;
  margin: 40px auto;
  padding: 0 20px;
  text-align: center;
}

/* Kopfbereich: mittig zentriert */
.ibm-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-bottom: 28px;
  text-align: center;
}
.ibm-pin { /* optional – wenn nicht genutzt, bleibt unsichtbar */
  display: none;
}
.ibm-head > div { min-width: 0; }
.ibm-eyebrow { color:#5e5e5e; font-size:14px; }
.ibm-title { font-weight:800; font-size:22px; color:#000; line-height:1.25; }
.ibm-sub   { color:#5e5e5e; }

@media (max-width: 480px){
  .ibm-title { font-size:20px; }
}

/* Überschriften & Steps */
.ibm-steps h2 {
  font-size:22px;
  margin: 20px 0 12px;
  font-weight:800;
  color:#111827;
  text-align: center;
}
.ibm-step { display:none; }
.ibm-step.active { display:block; }

/* ===== Karten (Fahrzeug/Leistung) – ohne SVGs ===== */
.ibm-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
  margin: 18px auto 10px;
  text-align: left;
}
.ibm-card-radio {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  width: 100%;
  padding: 18px;
  background: #ffffff;
  color: #0f172a;
  border: 2px solid #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 6px 14px rgba(0,0,0,.06);
  cursor: pointer;
  transition: transform .08s ease, border-color .12s ease, box-shadow .12s ease, background .12s ease;
}
.ibm-card-radio:hover {
  border-color: #2563eb;
  background: transparent;
  box-shadow: none;
}
.ibm-card-radio .ibm-card-title { color: #111827; font-weight: 800; font-size: 18px; line-height: 1.2; }
.ibm-card-radio .ibm-card-desc  { color: #475569; font-size: 14px; }
.ibm-card-icon { display:none !important; }

.ibm-card-radio.selected,
.ibm-card-radio[aria-checked="true"] {
  background: #ffffff !important;
  border-color: #2563eb;
  box-shadow: 0 0 0 4px rgba(37,99,235,.15), 0 6px 14px rgba(0,0,0,.06);
}
.ibm-card-radio.selected::after,
.ibm-card-radio[aria-checked="true"]::after {
  content: "✓";
  position: absolute;
  top: 10px;
  right: 10px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #16a34a;
  color: #fff;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
}

/* ===== Felder (alte Klasse – kompatibel) ===== */
.ibm-fields { display:grid; gap:12px; margin:16px auto; max-width: 960px; }
.ibm-fields.two { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px){ .ibm-fields.two { grid-template-columns: 1fr; } }
.ibm-fields label { display:grid; gap:6px; font-weight:600; text-align:left; }
.ibm-fields input {
  padding:12px 14px;
  border-radius:12px;
  border:1px solid #d1d5db;
  font-size:16px;
  width:100%;
  background:#fff;
}
.ibm-fields input:focus {
  border-color:#3b82f6;
  box-shadow: 0 0 0 3px rgba(59,130,246,.15);
}

/* ===== Box-Feld Styles für aktuelles Template ===== */
.ibm-fieldgrid--contact {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: 0 auto;
}
@media (max-width: 900px){
  .ibm-fieldgrid--contact { grid-template-columns: 1fr; }
}
.ibm-field--boxed input,
.ibm-field--boxed textarea {
  width: 100%;
  padding: 14px 16px;
  border: 1px solid #d1d5db;
  border-radius: 12px;
  background: #fff;
  font-size: 16px;
  outline: none;
}
.ibm-field--boxed input:focus,
.ibm-field--boxed textarea:focus {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59,130,246,.15);
}
.ibm-label {
  display: block;
  font-size: 14px;
  margin-bottom: 6px;
  color:#111827;
  opacity: .9;
}

/* ===== Gruppenabstände ===== */
.ibm-group { margin-top: 8px; }
.ibm-group--spaced { margin-top: 26px; }

/* ===== Hinweise, Zusammenfassung ===== */
.ibm-note { font-size:14px; color:#374151; margin: 10px auto 0; max-width: 760px; }
.ibm-summary { margin-top:12px; padding:12px; background:#f9fafb; border:1px solid #e5e7eb; border-radius:10px; display:none; text-align:left; }
.ibm-summary-box { margin-top: 16px; padding: 14px; border: 1px dashed rgba(0,0,0,.2); border-radius: 12px; background: rgba(255,255,255,.6); }
.ibm-summary-box h3 { margin: 0 0 8px 0; }

/* ===== Navigation ===== */
.ibm-nav { display:flex; gap:12px; justify-content:center; margin: 18px 0 6px; }
.ibm-prev, .ibm-next, .ibm-submit, .ibm-btn {
  appearance:none;
  border:0;
  padding:12px 18px;
  border-radius:10px;
  font-weight:700;
  cursor:pointer;
}
.ibm-prev { background:#e5e7eb; color:#111827; }
.ibm-next { background:#2563eb; color:#fff; }
.ibm-next[disabled] { opacity:.5; cursor:not-allowed; }
.ibm-submit { background:#10b981; color:#fff; }
.ibm-btn { background:#e5e7eb; color:#111827; text-decoration:none; display:inline-flex; align-items:center; }
.ibm-btn.ibm-primary { background:#2563eb; color:#fff; }

/* ===== DSGVO / Fehlertexte ===== */
.ibm-req { color:#dc2626; font-weight:700; }
.ibm-error { color:#dc2626; font-size:13px; margin-top:6px; display:none; }
.ibm-input-error { border-color:#ef4444 !important; box-shadow: 0 0 0 1px rgba(239,68,68,.25); }
.ibm-consent-wrap { margin: 10px 0 6px; text-align: left; }
.ibm-consent-error { margin-top: 6px; font-size: 14px; color: #dc2626; display:none; }
.ibm-consent-error.visible { display:block; }

/* ===== Erfolgsmeldung ===== */
.ibm-success {
  display: grid;
  gap: 10px;
  justify-items: center;
  padding: 24px;
  border: 1px solid #d1fae5;
  background: #ecfdf5;
  border-radius: 14px;
}
.ibm-success h2 {
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  color: #065f46;
}
.ibm-success p {
  margin: 0;
  color: #065f46;
  font-size: 16px;
}
.ibm-success .ibm-success-icon {
  width: 46px; height: 46px; border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  background: #10b981; color:#fff; font-weight:800; font-size:22px;
}
