.elementor-163267 .elementor-element.elementor-element-9c269fd{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:10px 10px;--row-gap:10px;--column-gap:10px;border-style:none;--border-style:none;--border-radius:16px 16px 16px 16px;}.elementor-163267 .elementor-element.elementor-element-9c269fd.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-163267 .elementor-element.elementor-element-bcd1e09{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--border-radius:16px 16px 016px 16px;--padding-top:30px;--padding-bottom:30px;--padding-left:0px;--padding-right:0px;}.elementor-163267 .elementor-element.elementor-element-bcd1e09:not(.elementor-motion-effects-element-type-background), .elementor-163267 .elementor-element.elementor-element-bcd1e09 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-8e7732e );}.elementor-163267 .elementor-element.elementor-element-4a0d454{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Arial, sans-serif;font-size:var( --e-global-typography-primary-font-size );font-weight:var( --e-global-typography-primary-font-weight );text-transform:var( --e-global-typography-primary-text-transform );color:var( --e-global-color-primary );}.elementor-163267 .elementor-element.elementor-element-abf5ae2{text-align:start;}.elementor-163267 .elementor-element.elementor-element-abf5ae2 .elementor-heading-title{font-family:var( --e-global-typography-fe7eada-font-family ), Arial, sans-serif;font-size:var( --e-global-typography-fe7eada-font-size );font-weight:var( --e-global-typography-fe7eada-font-weight );text-transform:var( --e-global-typography-fe7eada-text-transform );color:var( --e-global-color-1254bafa );}.elementor-163267 .elementor-element.elementor-element-a66293e{text-align:start;}.elementor-163267 .elementor-element.elementor-element-a66293e .elementor-heading-title{font-family:var( --e-global-typography-96e6ada-font-family ), Arial, sans-serif;font-size:var( --e-global-typography-96e6ada-font-size );font-weight:var( --e-global-typography-96e6ada-font-weight );text-transform:var( --e-global-typography-96e6ada-text-transform );color:var( --e-global-color-primary );}#elementor-popup-modal-163267{background-color:rgba(0,0,0,.8);justify-content:center;align-items:center;pointer-events:all;}#elementor-popup-modal-163267 .dialog-message{width:1000px;height:auto;}#elementor-popup-modal-163267 .dialog-close-button{display:flex;}#elementor-popup-modal-163267 .dialog-widget-content{box-shadow:2px 8px 23px 3px rgba(0,0,0,0.2);}@media(max-width:1024px){.elementor-163267 .elementor-element.elementor-element-9c269fd{--padding-top:30px;--padding-bottom:30px;--padding-left:30px;--padding-right:30px;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-163267 .elementor-element.elementor-element-abf5ae2 .elementor-heading-title{font-size:var( --e-global-typography-fe7eada-font-size );}.elementor-163267 .elementor-element.elementor-element-a66293e .elementor-heading-title{font-size:var( --e-global-typography-96e6ada-font-size );}}@media(max-width:767px){.elementor-163267 .elementor-element.elementor-element-9c269fd{--padding-top:10px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}.elementor-163267 .elementor-element.elementor-element-bcd1e09{--border-radius:5px 5px 5px 5px;--padding-top:10px;--padding-bottom:10px;--padding-left:10px;--padding-right:10px;}.elementor-163267 .elementor-element.elementor-element-4a0d454{--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-heading .elementor-heading-title{font-size:var( --e-global-typography-primary-font-size );}.elementor-163267 .elementor-element.elementor-element-abf5ae2 .elementor-heading-title{font-size:var( --e-global-typography-fe7eada-font-size );}.elementor-163267 .elementor-element.elementor-element-a66293e .elementor-heading-title{font-size:var( --e-global-typography-96e6ada-font-size );}}@media(min-width:768px){.elementor-163267 .elementor-element.elementor-element-9c269fd{--width:110.65%;}}@media(max-width:1024px) and (min-width:768px){.elementor-163267 .elementor-element.elementor-element-4a0d454{--width:95%;}}/* Start custom CSS for html, class: .elementor-element-53c4f6f *//* ============================================================
   Brandschutzhelfer-Kalkulator
   Alle Selektoren mit .bsh- Prefix, damit nichts kollidiert.
   IDs/Names im HTML bleiben unverändert.
   Gestalterische Vorlage: Feuerlöscher-Kalkulator.
   Erweiterung: Schieberegler (Slider) + dunkle Ergebnis-Box.
   Äußere Abstände (padding des Formulars) bleiben unverändert (0px).
   ============================================================ */

#form_anzahl_brandschutzhelfer,
#form_anzahl_brandschutzhelfer * {
  box-sizing: border-box;
}

#form_anzahl_brandschutzhelfer {
  --bsh-gold: #8b6a23;
  --bsh-gold-hover: #a08029;
  --bsh-text: #1a1a1a;
  --bsh-text-soft: #575757;
  --bsh-text-mute: #8a8a8a;
  --bsh-bg: #f4f4f5;
  --bsh-card: #ffffff;
  --bsh-border: #e4e4e7;
  --bsh-border-strong: #d4d4d8;
  --bsh-accent-bg: #f6f4ee;
  --bsh-result-bg: #16232b;
  --bsh-result-gold: #d9b45a;
  --bsh-radius: 12px;
  --bsh-radius-sm: 8px;
  --bsh-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);

  font-family: Helvetica, Arial, "Segoe UI", sans-serif;
  color: var(--bsh-text);
  font-size: 16px;
  line-height: 1.4;
  background: var(--bsh-bg);
  padding: 0px;
  border-radius: var(--bsh-radius);
}

/* ---------- Grid: zwei Spalten, responsive ---------- */
#form_anzahl_brandschutzhelfer .bsh-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  align-items: start;
}

@media (max-width: 900px) {
  #form_anzahl_brandschutzhelfer .bsh-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  #form_anzahl_brandschutzhelfer {
    padding: 0px;
  }
}

/* ---------- Karten ---------- */
#form_anzahl_brandschutzhelfer .bsh-card {
  background: var(--bsh-card);
  border: 1px solid var(--bsh-border);
  border-radius: var(--bsh-radius);
  padding: 28px;
  box-shadow: var(--bsh-shadow);
}

@media (max-width: 600px) {
  #form_anzahl_brandschutzhelfer .bsh-card {
    padding: 20px;
  }
}

#form_anzahl_brandschutzhelfer .bsh-card-title {
  margin: 0 0 20px 0;
  padding: 0 0 16px 0;
  font-size: 18px;
  font-weight: 600;
  color: var(--bsh-text);
  border-bottom: 1px solid var(--bsh-border);
  text-transform: none;
  letter-spacing: 0;
  text-align: left;
  line-height: 1.3;
}

/* ---------- Felder / Inputs ---------- */
#form_anzahl_brandschutzhelfer .bsh-field {
  margin-bottom: 22px;
}

#form_anzahl_brandschutzhelfer .bsh-field-label {
  display: block;
  font-size: 14px;
  color: var(--bsh-text-soft);
  margin: 0 0 8px 0;
  font-weight: 400;
}

#form_anzahl_brandschutzhelfer .bsh-input-wrap {
  position: relative;
  display: block;
}

#form_anzahl_brandschutzhelfer .bsh-input {
  width: 100%;
  border: 1px solid var(--bsh-border-strong);
  border-radius: var(--bsh-radius-sm);
  padding: 10px 56px 10px 14px;
  font-size: 16px;
  color: var(--bsh-text);
  background: #fff;
  font-family: inherit;
  line-height: 1.3;
  appearance: textfield;
  -moz-appearance: textfield;
}

#form_anzahl_brandschutzhelfer .bsh-input:focus {
  outline: none;
  border-color: var(--bsh-gold);
  box-shadow: 0 0 0 3px rgba(139, 106, 35, 0.15);
}

#form_anzahl_brandschutzhelfer .bsh-input-suffix {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--bsh-text-mute);
  font-size: 14px;
  pointer-events: none;
}

#form_anzahl_brandschutzhelfer .bsh-input::-webkit-outer-spin-button,
#form_anzahl_brandschutzhelfer .bsh-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#form_anzahl_brandschutzhelfer .bsh-field-note {
  margin: 8px 2px 0 2px;
  font-size: 12px;
  color: var(--bsh-text-mute);
  line-height: 1.45;
}

/* ---------- Slider + große Live-Anzeige ---------- */
#form_anzahl_brandschutzhelfer .bsh-slider-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

#form_anzahl_brandschutzhelfer .bsh-slider-value {
  font-size: 40px;
  font-weight: 700;
  color: var(--bsh-gold);
  line-height: 1;
}

#form_anzahl_brandschutzhelfer .bsh-slider-head .bsh-input-wrap {
  width: 140px;
  flex-shrink: 0;
}

#form_anzahl_brandschutzhelfer .bsh-slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 6px;
  border-radius: 999px;
  background: var(--bsh-border);
  outline: none;
  margin: 6px 0 0 0;
  cursor: pointer;
}

#form_anzahl_brandschutzhelfer .bsh-slider::-moz-range-track {
  height: 6px;
  border-radius: 999px;
  background: var(--bsh-border);
}

#form_anzahl_brandschutzhelfer .bsh-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--bsh-gold);
  border: 3px solid #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  cursor: pointer;
  margin-top: -8px;
  transition: transform 0.05s ease;
}

#form_anzahl_brandschutzhelfer .bsh-slider::-webkit-slider-thumb:active {
  transform: scale(1.1);
}

#form_anzahl_brandschutzhelfer .bsh-slider::-moz-range-thumb {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--bsh-gold);
  border: 3px solid #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  cursor: pointer;
}

#form_anzahl_brandschutzhelfer .bsh-slider:focus-visible::-webkit-slider-thumb {
  box-shadow: 0 0 0 4px rgba(139, 106, 35, 0.25);
}

#form_anzahl_brandschutzhelfer .bsh-slider:focus-visible::-moz-range-thumb {
  box-shadow: 0 0 0 4px rgba(139, 106, 35, 0.25);
}

#form_anzahl_brandschutzhelfer .bsh-slider-scale {
  display: flex;
  justify-content: space-between;
  margin: 8px 2px 0 2px;
  font-size: 12px;
  color: var(--bsh-text-mute);
}

/* ---------- Abschnittsüberschrift ---------- */
#form_anzahl_brandschutzhelfer .bsh-section-title {
  margin: 24px 0 12px 0;
  font-size: 14px;
  color: var(--bsh-text-soft);
  font-weight: 400;
}

/* ---------- Radio-Optionen (Brandgefährdung) ---------- */
#form_anzahl_brandschutzhelfer .bsh-radio-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#form_anzahl_brandschutzhelfer .bsh-radio {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--bsh-border);
  border-radius: var(--bsh-radius-sm);
  cursor: pointer;
  background: #fff;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

#form_anzahl_brandschutzhelfer .bsh-radio:hover {
  border-color: var(--bsh-border-strong);
}

#form_anzahl_brandschutzhelfer .bsh-radio-input {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  margin: 1px 0 0 0;
  border: 1.5px solid var(--bsh-border-strong);
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  flex-shrink: 0;
  position: relative;
  transition: border-color 0.15s ease;
}

#form_anzahl_brandschutzhelfer .bsh-radio-input:hover {
  border-color: var(--bsh-gold);
}

#form_anzahl_brandschutzhelfer .bsh-radio-input:checked {
  border-color: var(--bsh-gold);
}

#form_anzahl_brandschutzhelfer .bsh-radio-input:checked::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--bsh-gold);
  transform: translate(-50%, -50%);
}

#form_anzahl_brandschutzhelfer .bsh-radio-input:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(139, 106, 35, 0.15);
}

/* Aktive Auswahl hervorheben */
#form_anzahl_brandschutzhelfer .bsh-radio:has(.bsh-radio-input:checked) {
  border-color: var(--bsh-gold);
  background: var(--bsh-accent-bg);
}

#form_anzahl_brandschutzhelfer .bsh-radio-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

#form_anzahl_brandschutzhelfer .bsh-radio-title {
  font-size: 15px;
  color: var(--bsh-text);
  font-weight: 500;
  line-height: 1.35;
}

#form_anzahl_brandschutzhelfer .bsh-radio-sub {
  font-size: 13px;
  color: var(--bsh-text-mute);
  line-height: 1.35;
}

/* ---------- Rechtsgrundlage-Hinweis ---------- */
#form_anzahl_brandschutzhelfer .bsh-legalref {
  margin: 22px 0 0 0;
  padding: 12px 14px;
  font-size: 12px;
  color: var(--bsh-text-soft);
  background: #fafafa;
  border-radius: var(--bsh-radius-sm);
  line-height: 1.5;
}

/* ---------- Ergebnis (dunkle Box, Screen2-Stil) ----------
   Selektoren mit zusätzlichem .bsh-card qualifiziert (höhere
   Spezifität), damit sie eine evtl. noch vorhandene ältere
   Kalkulator-CSS zuverlässig überschreiben (Ladereihenfolge egal).
   ---------------------------------------------------------------- */
#form_anzahl_brandschutzhelfer .bsh-card .bsh-result-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin-bottom: 16px;
  background: var(--bsh-result-bg);
  border: 1px solid var(--bsh-result-bg);
  border-radius: var(--bsh-radius);
  padding: 8px;
}

@media (max-width: 380px) {
  #form_anzahl_brandschutzhelfer .bsh-card .bsh-result-grid {
    grid-template-columns: 1fr;
  }
}

#form_anzahl_brandschutzhelfer .bsh-card .bsh-result {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 18px 16px;
  border: 0;
  border-radius: var(--bsh-radius-sm);
  background: transparent;
  text-align: center;
}

/* Akzent-Kachel (Empfehlung) dezent abheben */
#form_anzahl_brandschutzhelfer .bsh-card .bsh-result--accent {
  background: rgba(217, 180, 90, 0.10);
  border: 1px solid rgba(217, 180, 90, 0.35);
}

#form_anzahl_brandschutzhelfer .bsh-card .bsh-result-label {
  font-size: 13px;
  color: #cdd6d2;
  line-height: 1.35;
  font-weight: 600;
}

#form_anzahl_brandschutzhelfer .bsh-card .bsh-result-label small {
  font-size: 11px;
  color: #9fb0ab;
  font-weight: 400;
}

#form_anzahl_brandschutzhelfer .bsh-card .bsh-result-value {
  font-size: 48px;
  font-weight: 800;
  line-height: 1;
  color: #ffffff;
}

#form_anzahl_brandschutzhelfer .bsh-card .bsh-result--accent .bsh-result-value {
  color: var(--bsh-result-gold);
}

#form_anzahl_brandschutzhelfer .bsh-card .bsh-result-note {
  margin: 0 0 16px 0;
  font-size: 13px;
  color: var(--bsh-text-soft);
  line-height: 1.5;
}

/* ---------- Disclaimer ---------- */
#form_anzahl_brandschutzhelfer .bsh-disclaimer {
  margin: 0 0 18px 0;
  font-size: 12px;
  color: var(--bsh-text-mute);
  line-height: 1.5;
}

/* ---------- Buttons ---------- */
#form_anzahl_brandschutzhelfer .bsh-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

#form_anzahl_brandschutzhelfer .bsh-btn {
  display: block;
  width: 100%;
  padding: 14px 20px;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
  text-decoration: none;
  border-radius: var(--bsh-radius-sm);
  border: 1px solid transparent;
  cursor: pointer;
  font-family: inherit;
  line-height: 1.2;
  transition: background 0.15s ease, transform 0.05s ease, box-shadow 0.15s ease, border-color 0.15s ease;
  margin: 0;
}

/* Primär = dominanter, goldener Button */
#form_anzahl_brandschutzhelfer .bsh-btn--primary {
  background: var(--bsh-gold);
  color: #fff;
  border-color: var(--bsh-gold);
  box-shadow: 0 6px 16px rgba(139, 106, 35, 0.25);
}

#form_anzahl_brandschutzhelfer .bsh-btn--primary:hover {
  background: var(--bsh-gold-hover);
  border-color: var(--bsh-gold-hover);
  color: #fff;
}

/* Outline = sekundärer Buchungs-Button */
#form_anzahl_brandschutzhelfer .bsh-btn--outline {
  background: #fff;
  color: var(--bsh-gold);
  border-color: var(--bsh-gold);
  box-shadow: none;
}

#form_anzahl_brandschutzhelfer .bsh-btn--outline:hover {
  background: var(--bsh-accent-bg);
}

/* Ghost = dezenter Angebots-Button (am wenigsten dominant) */
#form_anzahl_brandschutzhelfer .bsh-btn--ghost {
  background: transparent;
  color: var(--bsh-text-soft);
  border-color: var(--bsh-border-strong);
  font-weight: 500;
}

#form_anzahl_brandschutzhelfer .bsh-btn--ghost:hover {
  background: #fafafa;
  color: var(--bsh-text);
}

#form_anzahl_brandschutzhelfer .bsh-btn:active {
  transform: translateY(1px);
}

/* ODER-Trenner */
#form_anzahl_brandschutzhelfer .bsh-or {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 18px 0;
  color: var(--bsh-text-mute);
  font-size: 12px;
  letter-spacing: 1px;
}

#form_anzahl_brandschutzhelfer .bsh-or::before,
#form_anzahl_brandschutzhelfer .bsh-or::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--bsh-border);
}

#form_anzahl_brandschutzhelfer .bsh-fineprint {
  margin: 10px 0 0 0;
  font-size: 12px;
  color: var(--bsh-text-mute);
  text-align: center;
  line-height: 1.5;
}/* End custom CSS */