/* v18 — Minimal Mobile-Fix für Partner-Trust: erzwingt Umbruch */
@media (max-width: 860px){
  #partner-trust .grid.grid-3{ display: block !important; }
  #partner-trust .grid.grid-3 > *{ width: 100% !important; display:block !important; }
  #partner-trust .grid.grid-3 > * + *{ margin-top: 16px !important; }
}

/* === v20 — Partner-Trust Mobile Layout & Awards-Grid ===
   - Stellt sicher, dass im #partner-trust die 3 Hauptspalten untereinander stehen
   - Richtet alle Headlines bündig links aus
   - Zeigt die zwei Auszeichnungen nebeneinander (2 Spalten) auf Mobile
*/
@media (max-width: 860px){
  /* 3 Spalten: Umbruch */
  #partner-trust .grid.grid-3{
    display: block !important;
  }
  #partner-trust .grid.grid-3 > *{
    width: 100% !important;
    display: block !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  #partner-trust .grid.grid-3 > * + *{ margin-top: 16px !important; }

  /* Awards: immer zwei nebeneinander (wrappen bei wenig Platz) */
  #partner-trust .awards{
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    align-items: stretch;
  }
  #partner-trust .awards > *{
    width: auto !important;
  }
}


/* =======================================================================
   FOOTER & FAB RESPONSIVE FIX — v148 (kompatibel zu theme-wi_v20.css)
   ----------------------------------------------------------------------- */
:root{ --fab-reserve: 168px; }

.footer-brand .footer-bottom, #brand-footer .footer-bottom, footer .footer-bottom{ text-align:center; }
.footer-brand .wordmark, #brand-footer .wordmark{ white-space:nowrap; display:inline-block; }

.footer-brand .wrap, #brand-footer .wrap, footer.sec--brand .wrap, footer.brand .wrap,
footer .wrap.brand-footer, footer .wrap.is-brand,
.footer-brand .container, .brand-footer .container{
  padding-left: clamp(28px, 7vw, 120px) !important;
  padding-right: calc(clamp(28px, 7vw, 120px) + var(--fab-reserve)) !important;
}

.footer-brand .legal-links, .brand-footer .legal-links, footer .legal-links, footer .legal{
  display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:12px;
}

.contact-fab, .fab.contact, .floating-contact{
  position: fixed !important;
  right: clamp(10px, 3.5vw, 18px) !important;
  bottom: 22vh !important;
  z-index: 9999;
}

@supports (-webkit-touch-callout: none){
  .contact-fab, .fab.contact, .floating-contact{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 220px) !important;
  }
}

@media (max-width: 430px){
  .contact-fab, .fab.contact, .floating-contact{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 240px) !important;
  }
  .footer-brand .wordmark, #brand-footer .wordmark{
    font-size: clamp(24px, 12.5vw, 52px) !important; line-height:1 !important;
  }
  .footer-brand .legal-links{ flex-wrap: wrap !important; gap: 10px !important; font-size: clamp(14px, 4.2vw, 18px) !important; }
}

@media (max-width: 360px){
  .contact-fab, .fab.contact, .floating-contact{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 260px) !important;
  }
  .footer-brand .wordmark, #brand-footer .wordmark{ font-size: clamp(22px, 13vw, 46px) !important; }
}
/* ======================================================================= */


/* =======================================================================
   FOOTER & FAB RESPONSIVE FIX — v155
   - Verhindert Überlappung des Floating-Widgets mit Wortmarke/Legal-Links
   - Wirkt auf Desktop & iPhone (Safe-Area)
   ======================================================================= */
:root{ --fab-reserve: 168px; }
.footer-brand .footer-bottom, #brand-footer .footer-bottom, footer .footer-bottom{ text-align:center; }
.footer-brand .wordmark, #brand-footer .wordmark{ white-space:nowrap; display:inline-block; }
/* Reserve rechts im Footer-Wrapper */
.footer-brand .wrap, #brand-footer .wrap, footer.sec--brand .wrap, footer.brand .wrap,
footer .wrap.brand-footer, footer .wrap.is-brand,
.footer-brand .container, .brand-footer .container{
  padding-left: clamp(28px, 7vw, 120px) !important;
  padding-right: calc(clamp(28px, 7vw, 120px) + var(--fab-reserve)) !important;
}
/* Legal-Links mittig & umbrechbar */
.footer-brand .legal-links, .brand-footer .legal-links, footer .legal-links, footer .legal{
  display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;
}
/* FAB Position */
.contact-fab, .fab.contact, .floating-contact{
  position: fixed !important;
  right: clamp(10px,3.5vw,18px) !important;
  bottom: 22vh !important;
  z-index: 9999;
}
@supports (-webkit-touch-callout: none){
  .contact-fab, .fab.contact, .floating-contact{
    bottom: calc(env(safe-area-inset-bottom,0px) + 240px) !important;
  }
}
@media (max-width: 430px){
  .contact-fab, .fab.contact, .floating-contact{
    bottom: calc(env(safe-area-inset-bottom,0px) + 260px) !important;
  }
  .footer-brand .wordmark, #brand-footer .wordmark{
    font-size: clamp(24px, 12.5vw, 52px) !important; line-height:1 !important;
  }
}

/* =======================================================================
   MW GLOBAL PATCH — v30 (colors + typography + mwbox)
   - Non-destructive: overrides only; rest deiner v20 bleibt erhalten.
   ======================================================================= */
:root{
  /* Brand (Wüstenrot) */
  --brand: #d52b1e;
  --brand-dark: color-mix(in srgb, var(--brand) 85%, black 15%);
  --brand-light: color-mix(in srgb, var(--brand) 88%, white 12%);

  /* Typography scale */
  --text:#111; --heading:#111; --subheading:var(--brand);
  --h1:clamp(32px,6vw,72px);
  --h2:clamp(24px,4.4vw,48px);
  --h3:clamp(20px,2.6vw,30px);
  --lead:clamp(18px,2vw,22px);
  --p:clamp(15px,1.5vw,18px);
  --lh-tight:1.15; --lh-head:1.2; --lh:1.55; --max-line:70ch;
}

/* Brand usage */
.sec.sec--brand .brand-panel::before{ background: var(--brand) !important; }
.btn.primary,.btn--primary,.btn-primary{ background:var(--brand)!important;border-color:var(--brand)!important;color:#fff!important; }
.btn.primary:hover,.btn--primary:hover,.btn-primary:hover{ background:var(--brand-dark)!important;border-color:var(--brand-dark)!important; }
.h1.accent,.accent,.text-brand{ color:var(--brand)!important; }
.wizard-steps .dot[aria-current="step"]{ background:var(--brand)!important;border-color:var(--brand)!important;color:#fff!important; }
.contact-fab .fab-btn,.fab .btn{ background:var(--brand)!important;border-color:var(--brand)!important;color:#fff!important; }
.badge.brand,.badge--brand{ background:var(--brand)!important;color:#fff!important; }

/* Sitewide typography */
h1,h2,h3,h4,h5,h6{ color:var(--heading); line-height:var(--lh-head); letter-spacing:-.02em; margin:0 0 .6em; }
h1{font-size:var(--h1)} h2{font-size:var(--h2)} h3{font-size:var(--h3)}
p,li{ color:var(--text); font-size:var(--p); line-height:var(--lh); }
p{ margin:0 0 1em; max-width:var(--max-line) } .t-center{text-align:center!important}

/* Header über der Maklerbox */
.mw-head{text-align:center}
.mw-head h1,.mw-head h2{color:var(--heading)!important}
.mw-head .subheadline{color:var(--subheading)!important;font-weight:700;font-size:clamp(16px,1.6vw,22px);max-width:var(--max-line);margin:0 auto .55em;text-align:center;display:block}
.mw-head .lead{color:var(--text)!important;margin:0 auto;max-width:var(--max-line)}
.mw-head h1,.mw-head h2,.mw-head p{-webkit-text-fill-color:currentColor!important;background:none!important;background-image:none!important;mix-blend-mode:normal!important}

/* Maklerbox: weiße Schrift */
.mwbox{ --hero-darken:.40; --seals-scale:1.2; --box-min-h:320px; }
.mwbox .about,.mwbox [class*="about"],.mwbox h1,.mwbox h2,.mwbox h3,.mwbox h4,.mwbox h5,.mwbox h6,.mwbox p,.mwbox li,.mwbox a,.mwbox .tip{
  color:#fff!important; -webkit-text-fill-color:#fff!important; text-shadow:0 1px 2px rgba(0,0,0,.35);
}

@media (max-width:760px){ :root{--max-line:80ch} .mw-head{padding-inline:8px} }

/* =======================================================================
   MW FOOTER PATCH — v30 (zentriert + Zeilen-Variablen + Safe-Area)
   ======================================================================= */
/* Typo-Variablen je Footer-Zeile */
:root{
  --mw-footer-brand-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  --mw-footer-brand-weight: 800;
  --mw-footer-brand-size: clamp(28px, 5.5vw, 56px);
  --mw-footer-brand-line: 1.04;
  --mw-footer-brand-color: #ffffff;

  --mw-footer-links-font: var(--mw-footer-brand-font);
  --mw-footer-links-weight: 600;
  --mw-footer-links-size: clamp(18px, 2.5vw, 26px);
  --mw-footer-links-line: 1.2;
  --mw-footer-links-color: #ffffff;

  --mw-footer-version-font: var(--mw-footer-brand-font);
  --mw-footer-version-weight: 500;
  --mw-footer-version-size: clamp(13px, 1.8vw, 18px);
  --mw-footer-version-line: 1.2;
  --mw-footer-version-color: rgba(255,255,255,.92);
}

/* Zentrierter Container */
body #brand-footer .wrap,
body footer.brand .wrap,
body footer.sec--brand .wrap,
body .footer-brand .wrap,
body .brand-footer .wrap,
body .footer-brand .container,
body .brand-footer .container{
  display: grid !important;
  justify-items: center !important;
  align-content: center !important;
  row-gap: clamp(10px, 2.5vw, 20px) !important;
  box-sizing: border-box !important;
  max-width: 1200px !important;
  width: min(1200px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: clamp(24px, 6vw, 96px) !important;
  padding-right: clamp(24px, 6vw, 96px) !important;
  text-align: center !important;
}

/* Zeile 1: Wortmarke */
body #brand-footer .wordmark,
body .footer-brand .wordmark,
body .brand-footer .wordmark{
  margin: 0 auto !important;
  white-space: nowrap !important;
  font-family: var(--mw-footer-brand-font) !important;
  font-weight: var(--mw-footer-brand-weight) !important;
  font-size: var(--mw-footer-brand-size) !important;
  line-height: var(--mw-footer-brand-line) !important;
  color: var(--mw-footer-brand-color) !important;
}

/* Zeile 2: Legal-Links */
body #brand-footer .legal-links,
body #brand-footer .links,
body footer .legal-links,
body footer .links,
body footer .legal{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(12px, 2vw, 28px) !important;
  font-family: var(--mw-footer-links-font) !important;
  font-weight: var(--mw-footer-links-weight) !important;
  font-size: var(--mw-footer-links-size) !important;
  line-height: var(--mw-footer-links-line) !important;
  color: var(--mw-footer-links-color) !important;
}
@media (min-width: 680px){
  body #brand-footer .legal-links,
  body #brand-footer .links,
  body footer .legal-links,
  body footer .links,
  body footer .legal{
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
  }
  body #brand-footer .legal-links > *,
  body #brand-footer .links > *,
  body footer .legal-links > *,
  body footer .links > *,
  body footer .legal > *{
    display: inline-block !important;
    white-space: inherit !important;
    min-width: 0 !important;
  }
}
@media (max-width: 679.98px){
  body #brand-footer .legal-links,
  body #brand-footer .links,
  body footer .legal-links,
  body footer .links,
  body footer .legal{
    flex-wrap: wrap !important;
    white-space: normal !important;
  }
}

/* Zeile 3: Version */
body #brand-footer .version,
body footer .version,
body .footer-brand .version,
body .brand-footer .version,
body footer .footer-version{
  font-family: var(--mw-footer-version-font) !important;
  font-weight: var(--mw-footer-version-weight) !important;
  font-size: var(--mw-footer-version-size) !important;
  line-height: var(--mw-footer-version-line) !important;
  color: var(--mw-footer-version-color) !important;
}

/* FAB: iPhone Safe-Area (optional, überschneidet Footer nicht) */
@supports (-webkit-touch-callout: none){
  .contact-fab, .fab.contact, .floating-contact{
    bottom: calc(env(safe-area-inset-bottom, 0px) + 240px) !important;
  }
}

/* Nur mobil: Reserve rechts, falls FAB überlappt */
:root{ --mw-fab-reserve: 0px !important; }
@media (max-width: 860px){
  :root{ --mw-fab-reserve: 168px !important; }
  body #brand-footer .wrap,
  body footer.brand .wrap,
  body footer.sec--brand .wrap,
  body .footer-brand .wrap,
  body .brand-footer .wrap,
  body .footer-brand .container,
  body .brand-footer .container{
    padding-right: calc(clamp(24px, 6vw, 96px) + var(--mw-fab-reserve)) !important;
  }
}


/* =======================================================================
   FOOTER — Mobile Wordmark Fit — v32
   - iPhone: Anfangs-/Endbuchstabe werden abgeschnitten
   - Lösung: kleinere, leicht engere Wortmarke + geringere Side-Paddings
   - Wirkt NUR unter 430px, überschreibt ältere Werte
   ======================================================================= */
@media (max-width: 430px){
  body #brand-footer .wrap,
  body footer.brand .wrap,
  body footer.sec--brand .wrap,
  body .footer-brand .wrap,
  body .brand-footer .wrap,
  body .footer-brand .container,
  body .brand-footer .container{
    padding-left: clamp(12px, 4vw, 24px) !important;
    padding-right: clamp(12px, 4vw, 24px) !important;
  }
  body #brand-footer .wordmark,
  body .footer-brand .wordmark,
  body .brand-footer .wordmark{
    font-size: clamp(22px, 10.8vw, 46px) !important; /* vorher 12.5vw */
    letter-spacing: -0.01em !important;              /* minimal rücken */
  }
}

/* Für sehr kleine Geräte zusätzlich sanft reduzieren */
@media (max-width: 360px){
  body #brand-footer .wordmark,
  body .footer-brand .wordmark,
  body .brand-footer .wordmark{
    font-size: clamp(20px, 10.2vw, 44px) !important;
  }
}


/* =======================================================================
   FOOTER — Mobile Centering Fix — v33
   - Neutralisiert die rechte "FAB-Reserve" unter 430px
   - Erzwingt symmetrische Innenabstände (links = rechts)
   - Behält kleinere Wortmarke aus v32 bei
   ======================================================================= */
@media (max-width: 430px){
  :root{ --mw-fab-reserve: 0px !important; } /* keine Zusatz-Reserve rechts */
  body #brand-footer .wrap,
  body footer.brand .wrap,
  body footer.sec--brand .wrap,
  body .footer-brand .wrap,
  body .brand-footer .wrap,
  body .footer-brand .container,
  body .brand-footer .container{
    padding-left: clamp(12px, 4vw, 24px) !important;
    padding-right: clamp(12px, 4vw, 24px) !important; /* symmetrisch */
  }
}


/* =======================================================================
   FOOTER — iPhone Overlap & Fit — v34
   Ziel: Wortmarke bleibt zentriert, wird NICHT vom FAB überdeckt,
   keine Linksdrift. Lösung: max-width für Wortmarke + optionaler Umbruch.
   ======================================================================= */
@media (max-width: 430px){
  body #brand-footer .wrap,
  body footer.brand .wrap,
  body footer.sec--brand .wrap,
  body .footer-brand .wrap,
  body .brand-footer .wrap,
  body .footer-brand .container,
  body .brand-footer .container{
    position: relative !important;
    text-align: center !important;
  }
  /* Wortmarke darf innerhalb des verfügbaren Raums umbrechen/balancieren
     und bleibt mittig. Max. Breite zieht ~FAB-Bereich rechts ab. */
  body #brand-footer .wordmark,
  body .footer-brand .wordmark,
  body .brand-footer .wordmark{
    display: inline-block !important;
    max-width: calc(100% - 128px) !important; /* ~Breite des FAB-Blocks */
    white-space: normal !important;
    text-wrap: balance !important;
    font-size: clamp(22px, 10.4vw, 46px) !important; /* leicht kleiner als v32 */
    letter-spacing: -0.01em !important;
    margin-inline: auto !important;
  }
}


/* =======================================================================
   FOOTER — v35 (Nur Zeile 1 / Wortmarke kleiner auf iPhone)
   - Keine Änderung an Zeile 2/3 und am Padding
   - Entfernt v34 max-width/text-wrap und setzt nur eine kleinere Größe
   ======================================================================= */
@media (max-width: 430px){
  body #brand-footer .wordmark,
  body .footer-brand .wordmark,
  body .brand-footer .wordmark{
    max-width: none !important;
    white-space: nowrap !important;
    text-wrap: normal !important;
    font-size: clamp(22px, 8.9vw, 46px) !important; /* nur Zeile 1 kleiner */
    letter-spacing: -0.01em !important;
  }
}
@media (max-width: 390px){
  body #brand-footer .wordmark,
  body .footer-brand .wordmark,
  body .brand-footer .wordmark{
    font-size: clamp(20px, 8.4vw, 44px) !important;
  }
}
@media (max-width: 360px){
  body #brand-footer .wordmark,
  body .footer-brand .wordmark,
  body .brand-footer .wordmark{
    font-size: clamp(19px, 7.9vw, 42px) !important;
  }
}


/* =======================================================================
   FOOTER — v36 (klare, nur-Footer Skalierung)
   - Beeinflusst ausschließlich #brand-footer (3 Zeilen)
   - Zentriert, symmetrische Paddings, keine FAB-Reserve
   - Skaliert **nur** Zeile 1 (Wortmarke) aggressiver auf Mobile
   ======================================================================= */
#brand-footer .wrap, footer.brand .wrap{
  display: grid !important;
  justify-items: center !important;
  text-align: center !important;
  padding-left: clamp(20px, 6vw, 96px) !important;
  padding-right: clamp(20px, 6vw, 96px) !important;
  margin-left: auto !important; margin-right: auto !important;
}
:root{ --mw-fab-reserve: 0px !important; }

/* Basisgrößen (Desktop) */
#brand-footer .wordmark{ font-size: clamp(44px, 5.2vw, 72px) !important; letter-spacing: -0.005em; }
#brand-footer .legal-links{ font-size: clamp(18px, 2vw, 26px) !important; }
#brand-footer .version{ font-size: clamp(13px, 1.4vw, 18px) !important; }

/* Tablet */
@media (max-width: 1024px){
  #brand-footer .wordmark{ font-size: clamp(36px, 5.2vw, 60px) !important; }
}

/* Breakpoint: 680px – Links bleiben in einer Zeile, darunter Wrap */
@media (min-width: 680px){
  #brand-footer .legal-links{ white-space: nowrap !important; }
}
@media (max-width: 679.98px){
  #brand-footer .legal-links{ white-space: normal !important; flex-wrap: wrap !important; }
}

/* iPhone/kleine Breiten — **nur Zeile 1** stärker verkleinern */
@media (max-width: 430px){
  #brand-footer .wrap{ padding-left: clamp(14px, 4.8vw, 24px) !important; padding-right: clamp(14px, 4.8vw, 24px) !important; }
  #brand-footer .wordmark{ font-size: clamp(22px, 8.6vw, 46px) !important; letter-spacing: -0.01em !important; white-space: nowrap !important; }
  #brand-footer .legal-links{ font-size: clamp(17px, 3.8vw, 22px) !important; }
  #brand-footer .version{ font-size: clamp(12px, 3vw, 16px) !important; }
}

/* Extra-small */
@media (max-width: 360px){
  #brand-footer .wordmark{ font-size: clamp(20px, 8.2vw, 44px) !important; }
}

/* =======================================================================
   SECTION-INTRO CENTERING PATCH — v37
   Ursache: globales p{max-width:var(--max-line)} begrenzt <p> auf 70ch und
   lässt es links beginnen. Für .section-intro Subheads/Descs soll die Box
   wieder volle Breite bzw. zentriert sein.
   ======================================================================= */
.section-intro .subhead,
.section-intro .desc{
  max-width: none !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}