/* --- wpbf-style-child --- */
/*!
Theme Name:    DISTLER Child
Author:        Digitalsauria
Author URI:    https://www.digitalsauria.de
Description:   Child Theme
Version:       1.0.0
License:       GNU General Public License v3 or later
License URI:   https://www.gnu.org/licenses/gpl-3.0.html
Template:      page-builder-framework
Text Domain:   page-builder-framework-child
*/

/* --- distler-global-design --- */
/* ==========================================================================
   DISTLER Immobilien Gruppe: globales Design-System (Relaunch-Vorlage)
   Schriften: Playfair Display (Überschriften, 400) + System-Sans (Fließtext)
   Farben:    Navy / Gold / Off-White + neutrale Text-/Flächen-Töne
   Gilt auf allen Seiten. Geladen nach Theme- und Beaver-Builder-CSS.
   ========================================================================== */

:root {
    --ds-navy:        #2B435D;
    --ds-navy-700:    #223750;
    --ds-navy-800:    #1A2C40;
    --ds-navy-900:    #13212F;
    --ds-navy-tint:   #EAEEF3;
    --ds-navy-tint-2: #DCE3EC;
    --ds-gold:        #B69256;
    --ds-gold-soft:   #CDAE78;
    --ds-gold-dark:   #A07F48;
    --ds-bg-page:     #F6F5F2;
    --ds-bg-card:     #FFFFFF;
    --ds-bg-soft:     #F0F2F5;
    --ds-text:        #25303B;
    --ds-text-body:   #4A5560;
    --ds-text-muted:  #5B636D;
    --ds-line:        rgba(43, 67, 93, 0.12);
    --ds-line-2:      rgba(43, 67, 93, 0.20);
    /* Karten-Optik: bisher nur im Scope .ds-kp definiert, dadurch sahen FAQ-Kaesten
       ausserhalb von /kaufpreis-anfragen/ flach aus. */
    --ds-sh-card:     0 12px 40px -16px rgba(43, 67, 93, 0.20);
    --ds-r-tile:      16px;
    --ds-serif:       "Playfair Display", Georgia, "Times New Roman", serif;
    --ds-sans:        system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --ds-r-pill:      999px;   /* nur Badges/Tags, nicht für Buttons */
    --ds-r-btn:       0;       /* Buttons global eckig (Vorgabe 2026-08-24) */
    --ds-r-input:     10px;
    --ds-ease:        cubic-bezier(0.16, 1, 0.3, 1);
    --ds-dur:         280ms;

    /* Beaver-Builder-Globalvariablen auf die Palette zwingen */
    --fl-global-link-color: var(--ds-navy) !important;
    --fl-global-link-hover-color: var(--ds-gold) !important;
    --fl-global-blau: var(--ds-navy) !important;
}

/* ---------- Basis ---------- */
body {
    font-family: var(--ds-sans);
    color: var(--ds-text-body);
    background-color: var(--ds-bg-page);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    /* Sicherheitsnetz: In ein Critical-CSS war einmal das WordPress-Fehlerseiten-CSS
       geraten (body{max-width:700px;border:1px solid;margin:2em auto}). Solange keine
       Regel dagegenhielt, war die ganze Seite 700 px schmal. */
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
}
::selection { background: var(--ds-navy); color: #fff; }

/* Fließtext-Schrift überall (ohne Icon-Fonts). :where() = keine Spezifität,
   explizite Modul-Einstellungen (z. B. Playfair auf Überschriften) gewinnen weiter */
:where(p, li, dd, dt, td, th, label, legend, small, blockquote, figcaption, address, time, summary,
       input, select, textarea, button, optgroup, option,
       .fl-rich-text, .fl-button, .pp-button, .wpbf-button, .wpforms-container, .immomakler-container,
       .fl-menu, .wpbf-menu, .wpbf-mobile-menu, .fl-slide-text, .fl-callout-text, .pp-infobox-description,
       .pp-content-post, .pp-testimonial, .pp-accordion-content, .pp-tabs-panel, .fl-accordion-content,
       .fl-post-feed, .fl-post-grid, .fl-callout, .fl-cta, .fl-icon-text, .fl-contact-form, .fl-subscribe-form,
       .rplg, .brb, .wpbf-footer, .wpbf-sidebar, .bx-caption, .owl-carousel):not(i, .fa, .fas, .far, .fab, .fal,
       [class*="fa-"], .material-icons, [class*="material-icons"], .dashicons, .wpbf-icon, .fl-icon, .pp-icon,
       .glyphicon, .bx-prev, .bx-next, .owl-nav *, .owl-prev, .owl-next, .iti__flag, .choices__item) {
    font-family: var(--ds-sans);
}
:where(.fl-builder-content) :where(p, li, span, a, div, td, th, label, input, textarea, select, button):not(
       i, .fa, .fas, .far, .fab, .fal, [class*="fa-"], .material-icons, [class*="material-icons"], .dashicons,
       .wpbf-icon, .fl-icon, .pp-icon, .glyphicon, .bx-prev, .bx-next, .owl-prev, .owl-next, .iti__flag,
       .choices__item, .fl-heading, .fl-heading-text, .fl-slide-title, .pp-heading, .pp-post-title,
       .pp-infobox-title, .pp-content-grid-post-title, .pp-content-carousel-title, .fl-post-title,
       .fl-callout-title, .fl-cta-title, .fl-icon-text h1, .fl-icon-text h2, .fl-icon-text h3) {
    font-family: var(--ds-sans);
}

/* ---------- Überschriften: Playfair Display, Regular ---------- */
h1, h2, h3, h4, h5, h6,
.fl-heading, .fl-heading-text, .fl-slide-title, .fl-post-title, .fl-callout-title, .fl-cta-title,
.pp-heading, .pp-post-title, .pp-infobox-title, .pp-content-grid-post-title, .pp-content-carousel-title,
.pp-accordion-button-label, .fl-accordion-button-label, .pp-tabs-label,
.immomakler-container h1, .immomakler-container h2, .immomakler-container h3, .immomakler-container h4,
.wpbf-page-title, .wpbf-post-title, .wpbf-article-header h1,
.entry-title, .page-title {
    font-family: var(--ds-serif) !important;
    font-weight: 400 !important;
    font-style: normal;
    color: var(--ds-text);
    line-height: 1.16;
    letter-spacing: -0.01em;
    /* Zeilen ausgleichen: kein einzelnes Wort in der letzten Zeile */
    text-wrap: balance;
}
.fl-heading strong, .fl-heading b, h1 strong, h2 strong, h3 strong, h1 b, h2 b, h3 b { font-weight: 400; }
/* Inline-Schriftarten aus dem Editor (z. B. span style="font-family: system-ui") unterlaufen die Serif-Regel: eine Sans in Überschriftengröße ist breiter und bricht mitten im Wort */
h1 span[style*="font-family"], h2 span[style*="font-family"], h3 span[style*="font-family"], h4 span[style*="font-family"],
.fl-heading span[style*="font-family"], .fl-rich-text h1 span, .fl-rich-text h2 span, .fl-rich-text h3 span { font-family: inherit !important; }
strong, b { font-weight: 600; }
/* Überschriften auf dunklen Flächen bleiben hell (Modul-Farbe bleibt erhalten) */
.fl-row-bg-color[class*="fl-node"] .fl-heading[style*="color"] { color: inherit; }

/* ---------- Links ---------- */
a { color: var(--ds-navy); transition: color var(--ds-dur) var(--ds-ease); }
a:hover, a:focus { color: var(--ds-gold); }
.fl-builder-content a:not(.fl-builder-submenu-link):hover { color: var(--ds-gold) !important; }
#menu-hauptmenu .sub-menu li:hover > a, #menu-hauptmenu .sub-menu li a:hover,
.fl-menu .sub-menu li:hover > a, .fl-menu .sub-menu li a:hover {
    background-color: var(--ds-navy-700) !important; color: #fff !important;
}

/* ---------- Buttons: Navy, eckig (Standard) ---------- */
.fl-button-wrap a.fl-button, .fl-button-wrap a.fl-button:visited,
.pp-button-wrap a.pp-button, .pp-button-wrap a.pp-button:visited,
.wpbf-button, .wpbf-button-primary, a.wpbf-button,
.immomakler-container .btn-primary, .immomakler-container .btn-default,
.immomakler-container input[type="submit"], .immomakler-container button[type="submit"],
input[type="submit"], button[type="submit"], .button, .wp-block-button__link,
.cn-button, .or-cf-button, .sticky_button_mobil a {
    font-family: var(--ds-sans) !important;
    font-weight: 600 !important;
    letter-spacing: .01em;
    background-color: var(--ds-navy) !important;
    background-image: none !important;
    color: #fff !important;
    border: 1.5px solid transparent !important;
    border-radius: var(--ds-r-btn) !important;
    box-shadow: 0 4px 16px -8px rgba(43,67,93,0.12) !important;
    text-decoration: none !important;
    transition: background var(--ds-dur) var(--ds-ease), transform var(--ds-dur) var(--ds-ease), box-shadow var(--ds-dur) var(--ds-ease) !important;
}
.fl-button-wrap a.fl-button *, .pp-button-wrap a.pp-button *, .wpbf-button * { color: #fff !important; }
.fl-button-wrap a.fl-button:hover, .fl-button-wrap a.fl-button:focus-visible,
.pp-button-wrap a.pp-button:hover, .pp-button-wrap a.pp-button:focus-visible,
.wpbf-button:hover, a.wpbf-button:hover,
.immomakler-container .btn-primary:hover, .immomakler-container .btn-default:hover,
input[type="submit"]:hover, button[type="submit"]:hover, .button:hover, .wp-block-button__link:hover,
.cn-button:hover, .or-cf-button:hover, .sticky_button_mobil a:hover {
    background-color: var(--ds-navy-700) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 12px 40px -16px rgba(43,67,93,0.20) !important;
}
.fl-button-wrap a.fl-button:hover *, .pp-button-wrap a.pp-button:hover * { color: #fff !important; }
/* Zweite Button-Variante: Gold (Klasse "btn-gold" am Modul vergeben) */
.btn-gold .fl-button, .btn-gold .pp-button, .btn-gold a.fl-button { background-color: var(--ds-gold) !important; }
.btn-gold .fl-button:hover, .btn-gold .pp-button:hover, .btn-gold a.fl-button:hover { background-color: var(--ds-gold-dark) !important; }

/* ---------- Formulare (WPForms, BB-Kontaktformular, ImmoMakler) ---------- */
.wpforms-container, .wpforms-container-full {
    --wpforms-field-border-radius: var(--ds-r-input) !important;
    --wpforms-field-border-color: var(--ds-line-2) !important;
    --wpforms-field-border-color-spare: var(--ds-line-2) !important;
    --wpforms-field-background-color: #fff !important;
    --wpforms-field-text-color: var(--ds-text) !important;
    --wpforms-label-color: var(--ds-text) !important;
    --wpforms-label-sublabel-color: var(--ds-text-muted) !important;
    --wpforms-button-border-radius: var(--ds-r-btn) !important;
    --wpforms-button-background-color: var(--ds-navy) !important;
    --wpforms-button-background-color-alt: var(--ds-navy-700) !important;
    --wpforms-button-text-color: #fff !important;
    --wpforms-button-text-color-alt: #fff !important;
    --wpforms-field-menu-color: var(--ds-text) !important;
    --wpforms-page-break-color: var(--ds-gold) !important;
}
.wpforms-container .wpforms-form button[type="submit"],
.wpforms-container .wpforms-form .wpforms-page-button {
    background-color: var(--ds-navy) !important; color: #fff !important;
    border-radius: var(--ds-r-btn) !important; border-color: transparent !important;
}
.wpforms-container .wpforms-form button[type="submit"]:hover,
.wpforms-container .wpforms-form .wpforms-page-button:hover { background-color: var(--ds-navy-700) !important; }
.wpforms-container .wpforms-form input:focus, .wpforms-container .wpforms-form textarea:focus,
.wpforms-container .wpforms-form select:focus { border-color: var(--ds-gold) !important; box-shadow: 0 0 0 1px var(--ds-gold) !important; }
.wpforms-confirmation-container-full, .wpforms-confirmation-container {
    background: var(--ds-navy-tint) !important; border-color: var(--ds-navy-tint-2) !important; color: var(--ds-text) !important;
}
.fl-form-field input, .fl-form-field textarea, .fl-form-field select,
.immomakler-container .form-control, .immomakler-container .bootstrap-select .btn {
    font-family: var(--ds-sans); border-radius: var(--ds-r-input); border-color: var(--ds-line-2); color: var(--ds-text);
}
.fl-form-field input:focus, .fl-form-field textarea:focus, .immomakler-container .form-control:focus { border-color: var(--ds-gold); }

/* ---------- Theme (Page Builder Framework) ---------- */
.wpbf-menu a, .wpbf-mobile-menu a { font-family: var(--ds-sans); letter-spacing: .02em; }
.wpbf-mobile-menu-container a, .wpbf-mobile-menu a { color: var(--ds-text); }
.wpbf-mobile-menu-container a:hover { color: var(--ds-gold); }
.scrolltop, .scrolltop:hover { background-color: var(--ds-navy) !important; color: #fff !important; border-radius: var(--ds-r-btn) !important; }
.wpbf-footer, .wpbf-inner-footer { font-family: var(--ds-sans); }
.breadcrumbs, .breadcrumbs a { color: var(--ds-text-muted) !important; }
.breadcrumbs a:hover { color: var(--ds-gold) !important; }

/* ---------- Beaver Builder / PowerPack-Module ---------- */
.fl-builder-content .fl-rich-text { color: inherit; }
.fl-accordion-button, .pp-accordion-button { font-family: var(--ds-serif); color: var(--ds-text); }
.pp-accordion-button-icon, .fl-accordion-button-icon, .pp-tabs-label-icon { color: var(--ds-gold); }
.fl-node-content ul.pp-post-filters li:hover, .fl-node-content ul.pp-post-filters li.pp-filter-active { color: var(--ds-gold) !important; }
.pp-content-post .pp-post-image .pp-content-category-list, .pp-content-post .pp-content-post-date,
.pp-content-post.pp-grid-style-6 .pp-post-image .pp-content-post-date { background-color: var(--ds-navy) !important; color: #fff !important; }
.pp-content-post .pp-content-grid-more:hover { background-color: var(--ds-navy-700) !important; color: #fff !important; }
.pp-content-post-carousel .owl-theme .owl-dots .owl-dot.active span,
.pp-content-post-carousel .owl-theme .owl-dots .owl-dot:hover span { background-color: var(--ds-gold) !important; }
.pp-content-grid-post-title, .pp-content-grid-post-title a { color: var(--ds-text) !important; }
.pp-content-grid-post-title a:hover { color: var(--ds-gold) !important; }
.pp-toc-container .pp-toc-header-title, .pp-toc-container .pp-toc-body { color: var(--ds-text) !important; }
.pp-toc-container .pp-toc-separator, .pp-content-grid-separator { background-color: var(--ds-line) !important; }
.fl-form-error-message, .fl-form-field input.fl-form-error { color: var(--ds-gold-dark) !important; border-color: var(--ds-gold) !important; }
.fl-callout-title a, .fl-post-title a { color: var(--ds-text); }
.fl-icon i, .pp-icon i, .fl-icon-text .fl-icon i { color: var(--ds-gold); }

/* ---------- Bewertungs-Widget (Business Reviews Bundle) ---------- */
.rplg-review-name, a.rplg-url, .rplg-container a.rplg-url, .brb .rplg-review-name { color: var(--ds-navy) !important; }
.rplg-stars, .rplg-review-stars svg, .brb .rplg-stars { color: var(--ds-gold); fill: var(--ds-gold); }

/* ---------- ImmoMakler ---------- */
.immomakler-container a { color: var(--ds-navy); }
.immomakler-container a:hover { color: var(--ds-gold); }
.immomakler-container .badge, .immomakler-container .label, .immomakler-container .im-statusbar { background-color: var(--ds-navy) !important; color: #fff; }
.immomakler-container .panel-heading, .immomakler-container .well { background-color: var(--ds-bg-soft); border-color: var(--ds-line); }

/* ---------- Cookie-Hinweise / Sonstiges ---------- */
#cookie-notice { background-color: var(--ds-navy-900) !important; color: #fff; }
.or-cf { background: rgba(43,67,93,0.75) !important; }
.or-cf-text { color: #fff !important; }
.calendly-inline-widget, .simplebar-content-wrapper { color: var(--ds-text) !important; }

/* ---------- Formulare auf dunklem Hintergrund (Klasse per js/forms-on-dark.js) ---------- */
.ds-form-on-dark {
    --wpforms-label-color: #fff !important;
    --wpforms-label-sublabel-color: rgba(255,255,255,0.78) !important;
    --wpforms-label-error-color: var(--ds-gold-soft) !important;
    --wpforms-button-background-color: var(--ds-gold) !important;
    --wpforms-button-background-color-alt: var(--ds-gold-soft) !important;
    --wpforms-button-text-color: var(--ds-navy-900) !important;
    --wpforms-button-text-color-alt: var(--ds-navy-900) !important;
}
.ds-form-on-dark .wpforms-form .wpforms-field-label,
.ds-form-on-dark .wpforms-form legend.wpforms-field-label,
.ds-form-on-dark .wpforms-form .wpforms-required-label,
.ds-form-on-dark .wpforms-form .wpforms-field-description,
.ds-form-on-dark .wpforms-form .wpforms-field-label-inline { color: #fff !important; }
.ds-form-on-dark .wpforms-form .wpforms-field-sublabel { color: rgba(255,255,255,0.78) !important; }
.ds-form-on-dark .wpforms-form .wpforms-field-label-inline a,
.ds-form-on-dark .wpforms-form .wpforms-field-description a { color: var(--ds-gold-soft) !important; text-decoration: underline; text-underline-offset: 3px; }
.ds-form-on-dark .wpforms-form .wpforms-field-label-inline a:hover { color: #fff !important; }
.ds-form-on-dark .wpforms-form .wpforms-error,
.ds-form-on-dark .wpforms-form label.wpforms-error { color: var(--ds-gold-soft) !important; }
.ds-form-on-dark .wpforms-form button[type="submit"],
.ds-form-on-dark .wpforms-form .wpforms-page-button {
    background-color: var(--ds-gold) !important; color: var(--ds-navy-900) !important; font-weight: 600;
}
.ds-form-on-dark .wpforms-form button[type="submit"]:hover,
.ds-form-on-dark .wpforms-form button[type="submit"]:focus-visible,
.ds-form-on-dark .wpforms-form .wpforms-page-button:hover { background-color: var(--ds-gold-soft) !important; color: var(--ds-navy-900) !important; }
.ds-form-on-dark .wpforms-form button[type="submit"]:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
/* Datenschutz-Checkbox */
.wpforms-form .wpforms-field-gdpr-checkbox .wpforms-field-label-inline { font-size: 16px !important; line-height: 1.5; }
.wpforms-form .wpforms-field-gdpr-checkbox input[type="checkbox"] { width: 20px; height: 20px; margin-top: 3px; accent-color: var(--ds-gold); }

/* ---------- Buttons global eckig (Sicherheitsnetz, 2026-08-24) ----------
   Vorgabe: alle Buttons ohne Rundung. Gilt auch für Modul-Buttons aus hero-slider.css,
   partner-cards.css, kaufangebot-row.css, kaufpreis-anfrage.css, footer.css, distler-header.css.
   Neue Button-Klassen hier ergänzen. Badges/Tags (z. B. .distler-ki-pill, .ds-kp-tag) bleiben rund. */
.fl-button-wrap a.fl-button, .pp-button-wrap a.pp-button, .wpbf-button, a.wpbf-button,
.immomakler-container .btn-primary, .immomakler-container .btn-default,
input[type="submit"], button[type="submit"], .button, .wp-block-button__link,
.cn-button, .or-cf-button, .sticky_button_mobil a, .scrolltop,
.wpforms-form button[type="submit"], .wpforms-form .wpforms-page-button,
.ds-btn, .ds-kp-btn, .ds-kp-seg label, .ds-kauf__btn, .dh-cta {
    border-radius: 0 !important;
}

/* ---------- Gold-Buttons: Navy-Text statt Weiß (WCAG AA, 2026-08-24) ----------
   Weiß auf Gold #B69256 = 2,9:1 (Lighthouse-Fail). Navy-900 auf Gold = 5,4:1,
   Hover Gold-Soft #CDAE78 + Navy = 7,4:1. Gilt für alle goldenen Buttons:
   btn-gold-Module, Hero-CTA, Partner-Karten, Landingpage-Buttons/Chips,
   Traumhaus-Templates (pp-smart-button), WPForms auf Dunkel, Sticky-Footer. */
html .btn-gold .fl-button, html .btn-gold .pp-button, html .btn-gold a.fl-button,
html .btn-gold .fl-button *, html .btn-gold .pp-button *, html .btn-gold a.fl-button:hover *,
html .fl-builder-content .fl-node-wj56uic7fth1 .fl-slide .fl-slide-cta-button .fl-button-wrap .fl-button,
html .fl-builder-content .fl-node-wj56uic7fth1 .fl-slide .fl-slide-cta-button .fl-button-wrap .fl-button span.fl-button-text,
html .fl-builder-content .fl-node-wj56uic7fth1 .fl-slide .fl-slide-cta-button .fl-button-wrap .fl-button:hover span.fl-button-text,
html .ds-pcard a.ds-btn, html .fl-builder-content .ds-pcard a.ds-btn,
html .ds-pcard a.ds-btn:hover, html .fl-builder-content .ds-pcard a.ds-btn:hover,
html .ds-kp-btn--gold, html .ds-kp-btn--gold:visited, html .ds-kp-btn--gold:hover, html .ds-kp-btn--gold:focus,
html .ds-kp-seg label:has(input:checked), html .ds-kp-seg label.is-checked,
html .fl-node-yj1xck8plu0a .pp-button, html .fl-node-yj1xck8plu0a .pp-button *,
html .fl-node-61ahbokremji .pp-button, html .fl-node-61ahbokremji .pp-button * {
    color: var(--ds-navy-900) !important;
}
html .btn-gold .fl-button:hover, html .btn-gold .pp-button:hover, html .btn-gold a.fl-button:hover,
html .btn-gold .fl-button:focus-visible, html .btn-gold a.fl-button:focus-visible,
html .btn-gold .fl-button:focus, html .btn-gold a.fl-button:focus, html .btn-gold .pp-button:focus,
html .fl-builder-content .fl-node-wj56uic7fth1 .fl-slide .fl-slide-cta-button .fl-button-wrap .fl-button:focus,
html .fl-node-yj1xck8plu0a .pp-button:focus, html .fl-node-61ahbokremji .pp-button:focus,
html .fl-builder-content .fl-node-wj56uic7fth1 .fl-slide .fl-slide-cta-button .fl-button-wrap .fl-button:hover,
html .fl-builder-content .fl-node-wj56uic7fth1 .fl-slide .fl-slide-cta-button .fl-button-wrap .fl-button:focus-visible,
html .ds-pcard a.ds-btn:hover, html .ds-pcard a.ds-btn:focus-visible,
html .fl-builder-content .ds-pcard a.ds-btn:hover, html .fl-builder-content .ds-pcard a.ds-btn:focus-visible,
html .ds-kp-btn--gold:hover, html .ds-kp-btn--gold:focus,
html .fl-node-yj1xck8plu0a .pp-button:hover, html .fl-node-61ahbokremji .pp-button:hover {
    background: var(--ds-gold-soft) !important;
    background-color: var(--ds-gold-soft) !important;
}

/* ---------- Gold als TEXT auf hellem Grund: dunkles Gold (WCAG AA, 2026-08-24) ----------
   #B69256 auf Weiß/Hellgrau = 2,5–2,9:1. Als Textfarbe auf hellen Flächen daher
   #7D5F2A (≥ 5:1). Auf dunklen Sektionen (Hero/Promise/CTA) bleibt Gold-Soft (eigene Regeln). */
:root { --ds-gold-text: #7D5F2A; }
html .ds-kp-eyebrow, html .ds-kp-step__time { color: var(--ds-gold-text); }

/* ---------- Buttons auf dunklem Hintergrund (2026-08-24) ----------
   forms-on-dark.js setzt .ds-btn-on-dark auf .fl-button-wrap/.pp-button-wrap, wenn der
   Hintergrund dunkel ist (Luminanz < 0.25). Navy-Button auf Navy-Row wäre unsichtbar,
   daher Gold mit Navy-900-Text (5,4:1), Hover Gold-Soft (7,4:1). */
html .ds-btn-on-dark a.fl-button, html .ds-btn-on-dark a.fl-button:visited,
html .ds-btn-on-dark a.pp-button, html .ds-btn-on-dark a.pp-button:visited {
    background-color: var(--ds-gold) !important;
    border-color: var(--ds-gold) !important;
    color: var(--ds-navy-900) !important;
}
html .ds-btn-on-dark a.fl-button *, html .ds-btn-on-dark a.pp-button * { color: var(--ds-navy-900) !important; }
html .ds-btn-on-dark a.fl-button:hover, html .ds-btn-on-dark a.fl-button:focus-visible,
html .ds-btn-on-dark a.pp-button:hover, html .ds-btn-on-dark a.pp-button:focus-visible {
    background-color: var(--ds-gold-soft) !important;
    border-color: var(--ds-gold-soft) !important;
    color: var(--ds-navy-900) !important;
}
html .ds-btn-on-dark a.fl-button:hover *, html .ds-btn-on-dark a.pp-button:hover * { color: var(--ds-navy-900) !important; }
html .ds-btn-on-dark a.fl-button:focus-visible, html .ds-btn-on-dark a.pp-button:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* ---------- Formulare kompakt (2026-08-24, weniger Leerraum in allen WPForms-Formularen) ----------
   WPForms 2.0 (Modern Markup) setzt 15 px Feld-Padding und 15 px Label-Abstand über Variablen im
   Inline-Block #wpforms-<id> (ID-Spezifität), daher !important. Gilt für alle Formulare
   (Kontakt 1956, Insider 664, Tippgeber 920, Funnel 1958, Barrierefreiheit 9713). */
.wpforms-container, .wpforms-container-full {
    --wpforms-field-size-input-spacing: 7px !important;
    --wpforms-field-size-sublabel-spacing: 4px !important;
    --wpforms-button-size-margin-top: 4px !important;
}
.wpforms-container .wpforms-form .wpforms-field { padding: 7px 0 !important; }
.wpforms-container .wpforms-form .wpforms-field-label:not(.wpforms-label-hide) { margin: 0 0 6px !important; }
.wpforms-container .wpforms-form .wpforms-field-sublabel:not(.wpforms-sublabel-hide) { margin: 4px 0 0 !important; }
.wpforms-container .wpforms-form .wpforms-field-row:last-child { margin-bottom: 0 !important; }
.wpforms-container .wpforms-form textarea.wpforms-field-medium { height: 104px !important; min-height: 104px; }
.wpforms-container .wpforms-form .wpforms-field-gdpr-checkbox { padding-top: 10px !important; }
.wpforms-container .wpforms-form .wpforms-submit-container { margin-top: 6px !important; }
/* Pflicht-Stern in langen Choice-Labels (Datenschutz-Checkbox) nicht allein in die nächste Zeile umbrechen:
   Span ohne Breite, Stern ragt sichtbar hinter das letzte Wort. */
.wpforms-container .wpforms-form .wpforms-field-label-inline .wpforms-required-label {
    display: inline-block;
    width: 0;
    overflow: visible;
    white-space: nowrap;
}

/* ---------- Kontrast auf hellem Grund (WCAG AA, 25.08.2026) ----------
   Befund aus dem site-weiten Kontrast-Audit: gedämpftes Grau #7A828C (3,6:1) und Gold-Eyebrows
   #B69256 (2,7:1) auf hellen Flächen. Grau -> --ds-text-muted (5,2:1), Gold -> --ds-gold-text (5,3:1).
   Dunkle Flächen regelt inc/contrast-on-dark.php automatisch. */
html .sauria-reviews--premium .sauria-review-card__role,
html .sauria-review-card time,
html .sauria-reviews-section__note,
html .sauria-reviews-section__subtitle,
html .sauria-reviews-summary__count,
.fl-builder-content .pp-content-grid-post-meta,
.fl-builder-content .pp-content-grid-post-meta a,
.fl-builder-content .pp-content-grid-post-meta-sep { color: var(--ds-text-muted) !important; }
html .sauria-reviews-section__eyebrow,
html .ds-ankauf__eyebrow,
html .ds-partner__eyebrow,
html .ds-author__eyebrow { color: var(--ds-gold-text) !important; }
/* Aktiver Blog-Filter: Gold auf Navy (3,5:1) -> Weiß */
.fl-builder-content .pp-post-filters .pp-post-filter.pp-filter-active { color: #fff !important; }

/* ---------- Überschriften in schmalen Spalten: Schriftgröße so, dass die längsten Wörter passen
   (sonst harte Umbrüche mitten im Wort wie „Eigentumswohn / ung", „Angebotsprüfun / g").
   Oberhalb 1200 px greift keine Silbentrennung (siehe responsive.css). ---------- */
/* 3er-Karten „Eigentumswohnung / Mehrfamilienhaus / Baugrundstücke" (globale Row lj95k37p4un0 auf Startseite, Über uns, Ohne Makler) */
/* Modul 08pswdrlojiq steckt in den Rows lj95k37p4un0 (Start), h16dp5kmq8no (Über uns), 1v9qx8z0nai3 (Ohne Makler) */
.fl-builder-content .fl-node-lj95k37p4un0 .fl-rich-text h2,
.fl-builder-content .fl-node-h16dp5kmq8no .fl-rich-text h2,
.fl-builder-content .fl-node-1v9qx8z0nai3 .fl-rich-text h2 {
    font-size: clamp(1.5rem, 2.15vw, 2.2rem) !important;
    line-height: 1.16;
}
.fl-builder-content .fl-node-lj95k37p4un0 .fl-rich-text h2 span,
.fl-builder-content .fl-node-h16dp5kmq8no .fl-rich-text h2 span,
.fl-builder-content .fl-node-1v9qx8z0nai3 .fl-rich-text h2 span { font-size: inherit !important; }
/* Ablauf-Boxen (PowerPack Infobox, 4 Spalten, Templates 891 / 2319 / 9473) */
.fl-builder-content .pp-infobox-title {
    /* !important: BB-Node-CSS setzt sonst 30px mit höherer Spezifität */
    font-size: clamp(1.3rem, 1.05vw + .6rem, 1.875rem) !important;
}
/* Blog-Grid „weitere Beiträge" (3 Spalten, lange Titel) */
.fl-builder-content .pp-content-grid-post-title {
    font-size: clamp(1.25rem, 1vw + .7rem, 1.6rem);
    line-height: 1.25;
}


/* ---------- Kaufpreis-Funnel: Absende-Knopf ----------
   Die globale Submit-Regel weiter oben faerbt jeden <button type="submit"> navy,
   waehrend die Gold-Regel darunter den Text auf Navy-900 setzt. Ergebnis war
   dunkelblaue Schrift auf dunkelblauem Grund (Kontrast 1,6:1). */
html button.ds-kp-btn--gold,
html button.ds-kp-btn--gold:visited,
html input[type="submit"].ds-kp-btn--gold {
    background-color: var(--ds-gold) !important;
    background-image: none !important;
    color: var(--ds-navy-900) !important;
    border-color: transparent !important;
}
html button.ds-kp-btn--gold:hover,
html button.ds-kp-btn--gold:focus,
html button.ds-kp-btn--gold:focus-visible {
    background-color: var(--ds-gold-soft) !important;
    color: var(--ds-navy-900) !important;
}
/* Waehrend des Sendens aufhellen statt ausbleichen (sonst 2,9:1). */
html button.ds-kp-btn--gold[disabled] {
    opacity: 1 !important;
    background-color: var(--ds-gold-soft) !important;
    color: var(--ds-navy-900) !important;
}


/* ==========================================================================
   Formulare: Kontrast und Fokus (26.08.2026)
   ========================================================================== */

/* Feldrahmen erreichten nur 1,41:1 (rgba(43,67,93,.20) auf Weiss).
   WCAG 1.4.11 verlangt 3:1 fuer die Umrandung von Bedienelementen. */
.wpforms-container, .wpforms-container-full {
    --wpforms-field-border-color: rgba(43, 67, 93, .45) !important;
    --wpforms-field-border-color-spare: rgba(43, 67, 93, .45) !important;
}
/* WPForms setzt die Rahmenfarbe selbst ueber "div.wpforms-container-full input[...]"
   (Spezifitaet 0,2,2). Deshalb hier mit gleicher Struktur plus html davor, sonst
   bleibt der Rahmen bei 1,29:1 wie im Sales-Funnel gemessen. */
html div.wpforms-container input[type="text"], html div.wpforms-container input[type="email"],
html div.wpforms-container input[type="tel"], html div.wpforms-container input[type="url"],
html div.wpforms-container input[type="number"], html div.wpforms-container input[type="date"],
html div.wpforms-container select, html div.wpforms-container textarea,
html div.wpforms-container-full input[type="text"], html div.wpforms-container-full input[type="email"],
html div.wpforms-container-full input[type="tel"], html div.wpforms-container-full input[type="url"],
html div.wpforms-container-full input[type="number"], html div.wpforms-container-full input[type="date"],
html div.wpforms-container-full select, html div.wpforms-container-full textarea,
html .wpforms-form .iti input {
    border-color: rgba(43, 67, 93, .45) !important;
    border-width: 1px !important;
    border-style: solid !important;
}

/* Fokusring war 1px (2,9:1) und am Absende-Knopf gar nicht sichtbar. */
/* Hoehere Spezifitaet als die bestehende Regel ".wpforms-container .wpforms-form
   input:focus" weiter oben, die den Ring auf 1px setzt. */
html .wpforms-container .wpforms-form input:focus,
html .wpforms-container .wpforms-form textarea:focus,
html .wpforms-container .wpforms-form select:focus,
html .wpforms-container-full .wpforms-form input:focus,
html .wpforms-container-full .wpforms-form textarea:focus,
html .wpforms-container-full .wpforms-form select:focus {
    border-color: var(--ds-navy) !important;
    box-shadow: 0 0 0 2px var(--ds-gold) !important;
}
.wpforms-form button[type="submit"]:focus-visible,
.wpforms-form input[type="submit"]:focus-visible {
    outline: 3px solid var(--ds-navy) !important;
    outline-offset: 3px !important;
}
.ds-form-on-dark .wpforms-form button[type="submit"]:focus-visible {
    outline-color: #fff !important;
}
/* Der Datenschutz-Link in der Einwilligungszeile hatte gar keinen Fokus. */
.wpforms-form .wpforms-field-label-inline a:focus-visible,
.wpforms-form .wpforms-field-gdpr-checkbox a:focus-visible {
    outline: 2px solid var(--ds-gold);
    outline-offset: 3px;
    border-radius: 2px;
}

/* Platzhalter lagen bei 2,93:1 (opacity .5). */
.wpforms-form input::placeholder, .wpforms-form textarea::placeholder,
.wpforms-form .iti input::placeholder {
    color: #5b6b7c;
    opacity: 1;
}

/* Fehlermeldungen: 14px und knapp unter 4,5:1. */
.wpforms-form em.wpforms-error, .wpforms-form .wpforms-error {
    font-size: 1rem;
    color: #b3161a;
}

/* Absende-Knopf auf Mobil auf Mindest-Tippflaeche bringen (war 41px). */
.wpforms-form button[type="submit"], .wpforms-form input[type="submit"] {
    min-height: 46px;
}

/* Das versteckte Spamschutz-Feld bleibt im DOM (sonst greift die Bot-Falle nicht),
   wird aber per JS aus dem Tab-Lauf genommen: siehe js/forms-a11y.js. */


/* Felder, die in den WPForms-Einstellungen die CSS-Klasse "hidden" tragen,
   sollen ausgeblendet sein. Die passende Regel kam frueher aus dem alten Theme
   und fehlte seit der Umstellung: im Sales-Funnel standen dadurch die internen
   Gruppen "Eigenschaften" (296 px) und "Heizung" (65 px) offen im Formular.
   Die Felder bleiben im DOM und werden weiterhin mitgesendet. */
.wpforms-form .wpforms-field.hidden,
.wpforms-container .wpforms-field.hidden {
    display: none !important;
}

/* ==========================================================================
   Inline-Links im Fliesstext unterstreichen (Whitelist, 27.08.2026)
   --------------------------------------------------------------------------
   Ausgangslage: das Elternthema setzt global "a { text-decoration: none }".
   Damit war ein Link mitten im Satz nur an der Farbe erkennbar. axe und
   Lighthouse melden das als "link-in-text-block" (WCAG 1.4.1), weil Farbe
   allein kein zulaessiges Unterscheidungsmerkmal ist. Die Linkfarbe #2b435d
   gegen den Fliesstext #4a5560 erreicht die geforderten 3:1 nicht und liesse
   sich auf hellem Grund auch nicht erreichen, ohne die Textlesbarkeit zu
   verschlechtern. Deshalb die Unterstreichung.

   Bewusst eine Whitelist der Prosa-Container statt einer Ausnahmeliste:
   die Website hat dutzende Kontexte, in denen ein <a> kein Fliesstext-Link
   ist (Buttons, Kacheln, Logos, Bildlinks, Menues, Karten, Paginierung).
   Eine Blacklist muesste alle kennen und bei jedem neuen Modul nachgezogen
   werden; ein Fehler waere dort sofort sichtbar. Bei der Whitelist ist der
   Fehlerfall dagegen still: nicht gelistete Prosa bleibt ohne Strich.

   Spezifitaet 0-2-2 (body + .klasse + a + [href]). Das schlaegt ohne
   !important die Flaechenregeln, die sonst gewinnen wuerden, vor allem
   .bbn-light a:not(.bbn-btn) (0-2-1) aus bb-native.css, die nach dieser
   Datei laedt. Die Ausnahmen stehen in :not(:where(...)) und tragen deshalb
   selbst nichts zur Spezifitaet bei. Button-Regeln mit !important (Zeile 135)
   bleiben unerreichbar - genau so ist es gewollt.

   Keine Farbe, keine Schriftgroesse, kein Gewicht: es aendert sich
   ausschliesslich die Unterstreichung.
   ========================================================================== */
body :is(
    .bbn-text, .bbn-html, .bbn-fallback,
    .bbn-list, .bbn-quote, .bbn-slide__text,
    .bbn-infobox__desc, .bbn-infolist__desc,
    .bbn-acc__a, .bbn-iconlist,
    .bbn-table, .bbn-pricing__sub, .bbn-pricing__feats
) a[href]:not(:where(
    /* Der Link ist selbst ein Bedienelement oder enthaelt nur ein Bild/Icon */
    .bbn-btn, .bbn-infobox__btn, .fl-button, .pp-button, .wpbf-button,
    .wp-block-button__link, .button, .btn, .ds-btn, .ds-kp-btn, .dsh-btn,
    .dsh-kauf__btn, .dsh-funnel__opt, .dsh-post__link, .cn-button, .or-cf-button,
    .bbn-grid__link, .bbn-grid__more, .ds-bcard__link, .distler-ki-notice__link,
    [role="button"],
    /* Beliebige Tiefe: der Editor erzeugt <a><figure><img></figure></a> und
       <a><span><img></span></a>, der Kindkombinator haette die nicht erwischt.
       i[class] statt i: <i> ohne Klasse ist Kursivschrift, kein Icon. */
    a:has(img), a:has(picture), a:has(svg),
    a:has(> i[class]), a:has(.bbn-icon)
)):not(:where(
    /* Ueberschriften: im Rich-Text getippte Ueberschriften sind kein .bbn-heading,
       sondern nacktes <h2> mit Link darin (live auf /impressum/). Eine
       unterstrichene Ueberschrift waere eine Designaenderung, kein Lesegewinn. */
    h1, h2, h3, h4, h5, h6,
    /* Kartentitel aus kopiertem PowerPack-/BB-Markup, das der Renderer nicht
       aufraeumt (live auf /ueber-uns/ als p.pp-infobox-title). */
    .pp-infobox-title, .pp-heading, .pp-content-post-title,
    .pp-content-grid-post-title, .fl-callout-title, .fl-post-title,
    /* Fremde Bausteine, die per Shortcode im Rich-Text-Modul landen koennen.
       ImmoMakler heisst im ausgelieferten HTML .immomakler - .immomakler-container
       ist ein toter Selektor und haette die Objekttitel unterstrichen. */
    .bbn-btnwrap, .bbn-share, .bbn-logos, .bbn-photo,
    .bbn-toc, .bbn-filters, .bbn-pagination, .bbn-iconrow,
    .wpforms-container, .rplg, .brb, .sauria-reviews-section,
    .immomakler, .immomakler-archive, .immomakler-shortcode-archive,
    .immomakler-archive-grid, .immomakler-search, .properties, .property-container,
    .ds-ankauf, .ds-bcard, .ds-about, .ds-kp, .ds-st, .ds-author,
    /* Rechtstexte bringen ihre eigene Unterstreichung mit (ki-hinweis.css) */
    .distler-legal, .distler-ki-notice
) *) {
    text-decoration-line: underline;
    /* 1px statt "auto": Playfair und die Sans erzeugen sonst unterschiedlich
       dicke Striche, die Absaetze wirken dadurch unruhig. */
    text-decoration-thickness: 1px;
    /* .18em wie im Blog-Fliesstext (blog-native.css), damit der Strich die
       Unterlaengen von g, j, p nicht beruehrt. */
    text-underline-offset: .18em;
    text-decoration-skip-ink: auto;
}

/* Hover und Tastaturfokus: nur die Strichstaerke. Die Ausnahmen sind
   identisch zur Grundregel, sonst wuerde die Hover-Regel Links verdicken,
   die die Grundregel bewusst ausgeschlossen hat (etwa .bbn-dark a, das in
   bb-native.css ohne Ausnahmen unterstrichen wird). */
body :is(
    .bbn-text, .bbn-html, .bbn-fallback,
    .bbn-list, .bbn-quote, .bbn-slide__text,
    .bbn-infobox__desc, .bbn-infolist__desc,
    .bbn-acc__a, .bbn-iconlist,
    .bbn-table, .bbn-pricing__sub, .bbn-pricing__feats
) a[href]:is(:hover, :focus-visible):not(:where(
    .bbn-btn, .bbn-infobox__btn, .fl-button, .pp-button, .wpbf-button,
    .wp-block-button__link, .button, .btn, .ds-btn, .ds-kp-btn, .dsh-btn,
    .dsh-kauf__btn, .dsh-funnel__opt, .dsh-post__link, .cn-button, .or-cf-button,
    .bbn-grid__link, .bbn-grid__more, .ds-bcard__link, .distler-ki-notice__link,
    [role="button"],
    /* Beliebige Tiefe: der Editor erzeugt <a><figure><img></figure></a> und
       <a><span><img></span></a>, der Kindkombinator haette die nicht erwischt.
       i[class] statt i: <i> ohne Klasse ist Kursivschrift, kein Icon. */
    a:has(img), a:has(picture), a:has(svg),
    a:has(> i[class]), a:has(.bbn-icon)
)):not(:where(
    h1, h2, h3, h4, h5, h6,
    .pp-infobox-title, .pp-heading, .pp-content-post-title,
    .pp-content-grid-post-title, .fl-callout-title, .fl-post-title,
    .bbn-btnwrap, .bbn-share, .bbn-logos, .bbn-photo,
    .bbn-toc, .bbn-filters, .bbn-pagination, .bbn-iconrow,
    .wpforms-container, .rplg, .brb, .sauria-reviews-section,
    .immomakler, .immomakler-archive, .immomakler-shortcode-archive,
    .immomakler-archive-grid, .immomakler-search, .properties, .property-container,
    .ds-ankauf, .ds-bcard, .ds-about, .ds-kp, .ds-st, .ds-author,
    .distler-legal, .distler-ki-notice
) *) {
    text-decoration-thickness: 2px;
}

/* WPForms-Einwilligungssatz: "Ich habe die Datenschutzerklaerung gelesen ..."
   ist ein Link mitten im Satz. Bisher war er nur auf dunklem Grund
   unterstrichen (.ds-form-on-dark, Zeile 249), und diese Klasse setzt
   js/forms-on-dark.js erst zur Laufzeit nach Luminanzmessung. Auf hellem
   Grund fehlte die Unterscheidung deshalb ganz - auf 24 Seiten. */
.wpforms-form .wpforms-field-label-inline a,
.wpforms-form .wpforms-field-description a {
    text-decoration-line: underline;
    text-underline-offset: .18em;
}

/* --- distler-ki-hinweis --- */
/* KI-Transparenz (EU AI Act): Header-Pill, Footer-Block, Seite /eu-ai-act/, siehe inc/ki-hinweis.php */

/* ---- Header-Pill (neben dem Logo, Header-Layout 1235) ---- */
.fl-node-qxsn8m15pzd6 > .fl-col-content,
.fl-node-qvp1n0mltdsr > .fl-col-content { display: flex; flex-direction: row !important; flex-wrap: nowrap; align-items: center; gap: .5rem; }
.fl-node-qxsn8m15pzd6 > .fl-col-content > .fl-module-photo,
.fl-node-qvp1n0mltdsr > .fl-col-content > .fl-module-photo { flex: 0 0 auto; }
.distler-ki-pill {
    display: inline-flex; align-items: center; gap: .35rem; flex: 0 0 auto;
    padding: .3rem; font-size: .74rem; font-weight: 600; line-height: 1; letter-spacing: .02em;
    color: var(--fl-global-blau, #13212f); border: 1px solid rgba(19,33,47,.35); border-radius: 999px;
    text-decoration: none; white-space: nowrap;
    transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.distler-ki-pill span { display: none; }
.distler-ki-pill svg { flex-shrink: 0; opacity: .9; display: block; }
.distler-ki-pill:hover, .distler-ki-pill:focus-visible { color: var(--fl-global-blau, #13212f); background: rgba(19,33,47,.06); border-color: var(--fl-global-blau, #13212f); }
@media (min-width: 1500px) { .distler-ki-pill { padding: .3rem .65rem; } .distler-ki-pill span { display: inline; } }
/* Startseite: transparenter Header über dunklem Hero → helle Variante */
.home .distler-ki-pill { color: rgba(255,255,255,.92); border-color: rgba(255,255,255,.55); }
.home .distler-ki-pill:hover, .home .distler-ki-pill:focus-visible { color: #fff; border-color: #fff; background: rgba(255,255,255,.14); }

/* Kontrast-Fix (2026-08-24): Die BB-Spaltenregel `.fl-builder-content .fl-node-… a { color: var(--fl-global-blau) }`
   überstimmte die helle .home-Variante → navy Text auf dunklem Hero. Die Pill bekommt jetzt einen eigenen
   Hintergrund, damit der Kontrast unabhängig vom Foto dahinter stimmt (Header transparent = dunkle Pille /
   gescrollt, weißer Header = helle Pille). Gilt für alle Seiten, nicht nur .home. */
header.fl-builder-content[data-type="header"] a.distler-ki-pill {
    color: #fff; border-color: rgba(255,255,255,.6); background: rgba(19,33,47,.8);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
header.fl-builder-content[data-type="header"] a.distler-ki-pill:hover,
header.fl-builder-content[data-type="header"] a.distler-ki-pill:focus-visible {
    color: #fff; border-color: #fff; background: rgba(19,33,47,.95);
}
header.fl-builder-content[data-type="header"].fl-theme-builder-header-scrolled a.distler-ki-pill {
    color: #13212f; border-color: rgba(19,33,47,.45); background: rgba(19,33,47,.06);
}
header.fl-builder-content[data-type="header"].fl-theme-builder-header-scrolled a.distler-ki-pill:hover,
header.fl-builder-content[data-type="header"].fl-theme-builder-header-scrolled a.distler-ki-pill:focus-visible {
    color: #13212f; border-color: #13212f; background: rgba(19,33,47,.12);
}

/* ---- Footer-Block ---- */
.distler-ki-notice { background: #f4f5f7; border-top: 1px solid rgba(19,33,47,.08); padding: 1.75rem 1.25rem; scroll-margin-top: 120px; outline: none; }
.distler-ki-notice__inner { max-width: 820px; margin: 0 auto; text-align: center; color: #3a4a5c; font-size: .86rem; line-height: 1.6; }
.distler-ki-notice__title { font-family: inherit; font-size: .76rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; color: var(--fl-global-blau, #13212f); margin: 0 0 .6rem; }
.distler-ki-notice p { margin: 0 0 .5rem; }
.distler-ki-notice p:last-child { margin-bottom: 0; }
.distler-ki-notice__link { color: var(--fl-global-blau, #13212f); text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; font-weight: 600; }
.distler-ki-notice__link:hover, .distler-ki-notice__link:focus-visible { color: #a07f48; }
.distler-ki-notice:target, .distler-ki-notice.is-highlight { box-shadow: inset 0 0 0 2px #CDAE78; transition: box-shadow .3s ease; }

/* ---- Seite /eu-ai-act/ ---- */
.distler-legal { max-width: 900px; margin: 0 auto; padding: 110px 24px 60px; color: #2b435d; }
.distler-legal h1, .distler-legal h2, .distler-legal h3 { color: var(--fl-global-blau, #13212f); }
.distler-legal a { color: var(--fl-global-blau, #13212f); text-decoration: underline; text-underline-offset: 3px; }
.distler-legal a:hover { color: #a07f48; }
.distler-legal .distler-legal__eyebrow { display: block; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; color: #a07f48; margin-bottom: .5rem; }
.distler-legal h1 { margin-top: 0; }
.distler-legal .distler-legal__lede { font-size: 1.25rem; line-height: 1.6; margin-bottom: 2rem; }
.distler-legal h2 { font-size: 1.5rem; margin: 2.25rem 0 .75rem; }
.distler-legal h3 { font-size: 1.1rem; margin: 1.5rem 0 .4rem; }
.distler-legal ul { padding-left: 1.25rem; }
.distler-legal li { margin-bottom: .4rem; }
.distler-legal .distler-legal__stand { margin-top: 2.5rem; font-size: .9rem; color: #5a6675; }
.distler-legal .distler-legal__box { background: #f4f5f7; border-left: 4px solid #CDAE78; padding: 1rem 1.25rem; margin: 1.5rem 0; }
.distler-legal .distler-legal__box p:last-child { margin-bottom: 0; }

/* --- distler-header --- */
/* ============================================================
   DISTLER Relaunch 2026: Header (Glas-Effekt)
   Quelle: distler-relaunch-entwurf.html (Token-System, Header-Block)
   Zustände:
     Standard     dunkles Glas über dem Hero, helle Schrift
     .is-scrolled helles Milchglas (ab data-scroll-offset)
     .is-light    Seite startet ohne dunklen Hero (JS-Erkennung)
     .is-open     Mobil-Panel geöffnet
   ============================================================ */

.dh-header {
	/* Marken-Tokens (Entwurf) */
	--dh-navy: #2B435D;
	--dh-navy-700: #223750;
	--dh-navy-tint: #EAEEF3;
	--dh-gold: #B69256;
	--dh-gold-soft: #CDAE78;
	--dh-text: #25303B;
	--dh-text-body: #4A5560;
	--dh-line: rgba(43, 67, 93, 0.12);
	--dh-ease: cubic-bezier(0.16, 1, 0.3, 1);
	--dh-dur: 280ms;
	--dh-font: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	/* Maße: Container an die aktuellen BB-Rows angelehnt (1490px + 5 % Rand) */
	--dh-h: 84px;
	--dh-container: 1490px;
	--dh-pad: 5%;
	--dh-inset: 14px;

	/* Zustandsfarben: Standard = dunkles Glas */
	--dh-bg: rgba(19, 33, 47, 0.18);
	--dh-border: rgba(255, 255, 255, 0.14);
	--dh-shadow: none;
	--dh-blur: blur(16px) saturate(140%);
	--dh-fg: rgba(255, 255, 255, 0.92);
	--dh-fg-strong: #ffffff;
	--dh-fg-hover: #ffffff;
	--dh-accent: var(--dh-gold-soft);
	--dh-pill-fg: #ffffff;
	--dh-pill-border: rgba(255, 255, 255, 0.55);
	--dh-pill-bg: rgba(19, 33, 47, 0.8);
	--dh-pill-bg-hover: rgba(19, 33, 47, 0.95);

	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	box-sizing: border-box;
	font-family: var(--dh-font);
	overflow-wrap: normal;
	word-wrap: normal;
	word-break: normal;
	hyphens: manual;
	background: var(--dh-bg);
	-webkit-backdrop-filter: var(--dh-blur);
	backdrop-filter: var(--dh-blur);
	border-bottom: 1px solid var(--dh-border);
	box-shadow: var(--dh-shadow);
	transition:
		background var(--dh-dur) var(--dh-ease),
		border-color var(--dh-dur) var(--dh-ease),
		box-shadow var(--dh-dur) var(--dh-ease);
}
.dh-header *,
.dh-header *::before,
.dh-header *::after {
	box-sizing: border-box;
}
/* Schutz vor globalen Theme-/Plugin-Regeln (Listenpunkte, SVG-Füllungen) */
.dh-header ul,
.dh-header li {
	list-style: none;
	margin: 0;
	padding: 0;
}
.dh-header li::before,
.dh-header li::after,
.dh-header li::marker {
	content: none;
	display: none;
}
.dh-header svg,
.dh-header svg path,
.dh-header svg circle,
.dh-header svg line {
	fill: none !important;
}

/* Helles Milchglas */
.dh-header.is-scrolled,
.dh-header.is-light,
.dh-header.is-open,
body.dh-header-light .dh-header {
	--dh-bg: rgba(246, 245, 242, 0.72);
	--dh-border: var(--dh-line);
	--dh-blur: blur(18px) saturate(160%);
	--dh-fg: var(--dh-navy);
	--dh-fg-strong: var(--dh-navy);
	--dh-fg-hover: var(--dh-gold);
	--dh-accent: var(--dh-gold);
	--dh-pill-fg: var(--dh-navy);
	--dh-pill-border: rgba(43, 67, 93, 0.4);
	--dh-pill-bg: rgba(255, 255, 255, 0.75);
	--dh-pill-bg-hover: #ffffff;
}
.dh-header.is-scrolled {
	--dh-shadow: 0 8px 30px -18px rgba(43, 67, 93, 0.28);
}
.dh-header.is-open {
	--dh-bg: rgba(246, 245, 242, 0.96);
}

/* Fallback ohne backdrop-filter (alte Browser) */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.dh-header { --dh-bg: rgba(19, 33, 47, 0.85); }
	.dh-header.is-scrolled,
	.dh-header.is-light,
	.dh-header.is-open,
	body.dh-header-light .dh-header { --dh-bg: rgba(246, 245, 242, 0.97); }
}

/* WordPress-Adminleiste */
body.admin-bar .dh-header { top: 32px; }
@media (max-width: 782px) {
	body.admin-bar .dh-header { top: 46px; }
}

/* ---------- Layout ---------- */
.dh-header__inner {
	padding-inline: var(--dh-pad);
}
.dh-container {
	max-width: var(--dh-container);
	margin-inline: auto;
	padding-inline: var(--dh-inset);
}
.dh-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	height: var(--dh-h);
}

/* ---------- Logo (+ KI-Hinweis-Pill aus inc/ki-hinweis.php) ---------- */
.dh-brand-group {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	flex: 0 0 auto;
}
/* Eigener Hintergrund → Kontrast unabhängig vom Foto dahinter (immer ≥ 4,5:1) */
.dh-header .dh-brand-group .distler-ki-pill {
	color: var(--dh-pill-fg);
	border-color: var(--dh-pill-border);
	background: var(--dh-pill-bg);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	transition: color var(--dh-dur), border-color var(--dh-dur), background var(--dh-dur);
}
.dh-header .dh-brand-group .distler-ki-pill:hover,
.dh-header .dh-brand-group .distler-ki-pill:focus-visible {
	color: var(--dh-pill-fg);
	border-color: var(--dh-pill-fg);
	background: var(--dh-pill-bg-hover);
}
/* Im Header nur als Icon (Platz neben Menü, Telefon und CTA); Volltext steht im Footer-Block */
.dh-header .dh-brand-group .distler-ki-pill { padding: 0.3rem; }
.dh-header .dh-brand-group .distler-ki-pill span { display: none; }
.dh-brand {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
	min-height: 44px; /* Tap-Ziel, Logo bleibt 34–46px hoch */
	line-height: 0;
	text-decoration: none;
}
.dh-brand__logo {
	display: block;
	/* Originalgroesse der Bilddatei: 195 x 61 (Seitenverhaeltnis 3.197) */
	height: 61px;
	width: auto;
	max-width: none;
}
.dh-brand__logo--dark { display: none; }
.dh-header.is-scrolled .dh-brand__logo--light,
.dh-header.is-light .dh-brand__logo--light,
.dh-header.is-open .dh-brand__logo--light,
body.dh-header-light .dh-header .dh-brand__logo--light { display: none; }
.dh-header.is-scrolled .dh-brand__logo--dark,
.dh-header.is-light .dh-brand__logo--dark,
.dh-header.is-open .dh-brand__logo--dark,
body.dh-header-light .dh-header .dh-brand__logo--dark { display: block; }

/* ---------- Hauptnavigation (Desktop) ---------- */
.dh-menu {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	justify-content: center;
}
.dh-menu__list,
.dh-mobile__list,
.dh-sub {
	list-style: none;
	margin: 0;
	padding: 0;
}
.dh-menu__list {
	display: flex;
	align-items: center;
	gap: 1.6rem;
}
.dh-menu__list > li {
	position: relative;
	display: flex;
	align-items: center;
	height: var(--dh-h);
	margin: 0;
}
.dh-menu__list > li > a {
	position: relative;
	display: inline-block;
	padding: 0.3rem 0;
	font-size: 0.95rem;
	font-weight: 500;
	letter-spacing: 0.03em;
	line-height: 1.3;
	color: var(--dh-fg);
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--dh-dur);
}
.dh-menu__list > li > a::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -2px;
	height: 2px;
	background: var(--dh-accent);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--dh-dur) var(--dh-ease);
}
.dh-menu__list > li:hover > a,
.dh-menu__list > li.is-open > a,
.dh-menu__list > li > a:focus-visible {
	color: var(--dh-fg-hover);
}
.dh-menu__list > li:hover > a::after,
.dh-menu__list > li.is-open > a::after,
.dh-menu__list > li > a:focus-visible::after,
.dh-menu__list > li.current-menu-item > a::after,
.dh-menu__list > li.current-menu-ancestor > a::after {
	transform: scaleX(1);
}

/* Toggle-Button (Pfeil): Reset gegen Theme-Button-Styles */
.dh-sub-toggle,
.dh-burger {
	appearance: none;
	-webkit-appearance: none;
	background: none;
	border: 0;
	border-radius: 6px;
	margin: 0;
	padding: 0;
	min-height: 0;
	line-height: 0;
	font: inherit;
	color: inherit;
	box-shadow: none;
	cursor: pointer;
}
.dh-sub-toggle:focus-visible,
.dh-burger:focus-visible,
.dh-header a:focus-visible {
	outline: 2px solid var(--dh-accent);
	outline-offset: 3px;
}
.dh-menu .dh-sub-toggle {
	display: inline-grid;
	place-items: center;
	width: 20px;
	height: 20px;
	margin-left: 0.3rem;
	color: var(--dh-accent);
}
.dh-menu .dh-sub-toggle svg {
	width: 13px;
	height: 13px;
	transition: transform var(--dh-dur) var(--dh-ease);
}
.dh-menu__list > li:hover > .dh-sub-toggle svg,
.dh-menu__list > li.is-open > .dh-sub-toggle svg,
.dh-menu__list > li:focus-within > .dh-sub-toggle svg {
	transform: rotate(180deg);
}

/* Dropdown */
.dh-menu .dh-sub {
	position: absolute;
	top: calc(100% - 6px);
	left: -0.85rem;
	z-index: 5;
	min-width: 252px;
	padding: 0.5rem;
	background: #ffffff;
	border: 1px solid var(--dh-line);
	border-radius: 14px;
	box-shadow:
		0 20px 56px -20px rgba(43, 67, 93, 0.28),
		0 4px 16px -8px rgba(43, 67, 93, 0.12);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition:
		opacity var(--dh-dur) var(--dh-ease),
		transform var(--dh-dur) var(--dh-ease),
		visibility 0s linear var(--dh-dur);
}
/* Hover-Brücke zwischen Menüpunkt und Karte */
.dh-menu .dh-sub::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	height: 14px;
}
.dh-menu__list > li:nth-last-child(-n+2) > .dh-sub {
	left: auto;
	right: -0.85rem;
}
.dh-menu__list > li:hover > .dh-sub,
.dh-menu__list > li.is-open > .dh-sub,
.dh-menu__list > li:focus-within > .dh-sub {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition-delay: 0s;
}
.dh-menu .dh-sub li {
	display: block;
	margin: 0;
}
.dh-menu .dh-sub a {
	display: block;
	padding: 0.6rem 0.9rem;
	border-radius: 9px;
	font-size: 0.93rem;
	font-weight: 500;
	line-height: 1.35;
	color: var(--dh-text);
	text-decoration: none;
	white-space: nowrap;
	transition: background var(--dh-dur), color var(--dh-dur);
}
.dh-menu .dh-sub a:hover,
.dh-menu .dh-sub a:focus-visible,
.dh-menu .dh-sub .current-menu-item > a {
	background: var(--dh-navy-tint);
	color: var(--dh-navy);
}

/* ---------- Megamenü (Desktop) ---------- */
.dh-menu__list > li.menu-item-has-children { position: static; }
.dh-menu .dh-mega {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	z-index: 5;
	padding: 10px var(--dh-pad) 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition:
		opacity var(--dh-dur) var(--dh-ease),
		transform var(--dh-dur) var(--dh-ease),
		visibility 0s linear var(--dh-dur);
}
/* Hover-Brücke zwischen Leiste und Panel */
.dh-menu .dh-mega::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 100%;
	height: 12px;
}
.dh-menu__list > li:hover > .dh-mega,
.dh-menu__list > li.is-open > .dh-mega,
.dh-menu__list > li:focus-within > .dh-mega {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition-delay: 0s;
}
.dh-mega__inner {
	max-width: var(--dh-container);
	margin-inline: auto;
	display: grid;
	grid-template-columns: minmax(240px, 300px) 1fr;
	gap: 1.5rem 2rem;
	padding: 1.5rem;
	background: #ffffff;
	border: 1px solid var(--dh-line);
	border-radius: 18px;
	box-shadow:
		0 30px 72px -28px rgba(43, 67, 93, 0.34),
		0 12px 40px -16px rgba(43, 67, 93, 0.2);
}
.dh-mega__intro {
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
	padding-right: 2rem;
	border-right: 1px solid var(--dh-line);
}
.dh-mega__eyebrow {
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--dh-gold);
}
.dh-mega__heading {
	font-family: "Playfair Display", Georgia, "Times New Roman", serif;
	font-size: 1.45rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: var(--dh-text);
	text-wrap: balance;
}
.dh-mega__text {
	font-size: 0.92rem;
	line-height: 1.55;
	color: var(--dh-text-body);
}
.dh-mega__link {
	margin-top: auto;
	padding-top: 0.75rem;
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--dh-navy);
	text-decoration: none;
	transition: color var(--dh-dur), gap var(--dh-dur);
}
.dh-mega__link:hover,
.dh-mega__link:focus-visible {
	color: var(--dh-gold);
	gap: 0.7em;
}
.dh-mega__grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
	gap: 0.75rem;
	align-content: start;
}
/* Spaltenzahl = Anzahl Unterpunkte (dh-mega--n*), damit nichts umbricht */
.dh-mega--n1 .dh-mega__grid,
.dh-mega--n2 .dh-mega__grid,
.dh-mega--n3 .dh-mega__grid { grid-template-columns: repeat(3, minmax(0, 300px)); }
.dh-mega--n4 .dh-mega__grid { grid-template-columns: repeat(4, minmax(0, 280px)); }
.dh-mega--n5 .dh-mega__grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.dh-mega--n6 .dh-mega__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.dh-mega__grid > li { margin: 0; }
.dh-mega__card {
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
	height: 100%;
	padding: 0.5rem;
	border-radius: 14px;
	color: var(--dh-text);
	text-decoration: none;
	transition: background var(--dh-dur) var(--dh-ease);
}
.dh-mega__card:hover,
.dh-mega__card:focus-visible,
.dh-mega__item.current-menu-item > .dh-mega__card {
	background: var(--dh-navy-tint);
}
.dh-mega__media {
	display: block;
	position: relative;
	aspect-ratio: 16 / 10;
	border-radius: 10px;
	overflow: hidden;
	background: var(--dh-navy-tint);
}
/* Ohne Bild: ruhige Marken-Kachel (Verlauf + Goldpfeil) */
.dh-mega__media--empty {
	background: linear-gradient(135deg, var(--dh-navy) 0%, var(--dh-navy-700) 100%);
}
.dh-mega__media--empty::after {
	content: "→";
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	font-size: 1.6rem;
	color: var(--dh-gold-soft);
}
.dh-mega__media img {
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center 30%;
	transition: transform 600ms var(--dh-ease);
}
.dh-mega__card:hover .dh-mega__media img { transform: scale(1.04); }
.dh-mega__body {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: 0 0.25rem 0.25rem;
}
.dh-mega__title {
	font-size: 0.98rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--dh-text);
	transition: color var(--dh-dur);
}
.dh-mega__card:hover .dh-mega__title { color: var(--dh-navy); }
.dh-mega__desc {
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 0.9rem;
	line-height: 1.45;
	color: var(--dh-text-muted);
}
/* Intro als Kopfzeile, Karten darunter: unter 1500px für alle Panels … */
@media (max-width: 1499px) {
	.dh-mega__inner { grid-template-columns: 1fr; gap: 1rem; }
	.dh-mega__intro {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: baseline;
		gap: 0.35rem 1.25rem;
		padding: 0 0 0.85rem;
		border-right: 0;
		border-bottom: 1px solid var(--dh-line);
	}
	.dh-mega__heading { font-size: 1.2rem; }
	.dh-mega__text { flex: 1 1 260px; }
	.dh-mega__link { margin-top: 0; padding-top: 0; }
}
/* … und für Panels mit 6+ Karten immer (Karten sonst zu schmal für lange Titel) */
.dh-mega--stack .dh-mega__inner { grid-template-columns: 1fr; gap: 1rem; }
.dh-mega--stack .dh-mega__intro {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.35rem 1.25rem;
	padding: 0 0 0.85rem;
	border-right: 0;
	border-bottom: 1px solid var(--dh-line);
	}
.dh-mega--stack .dh-mega__heading { font-size: 1.2rem; }
.dh-mega--stack .dh-mega__text { flex: 1 1 260px; }
.dh-mega--stack .dh-mega__link { margin-top: 0; padding-top: 0; }

/* ---------- Rechte Seite: Telefon, CTA, Burger ---------- */
.dh-right {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex: 0 0 auto;
}
.dh-phone {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--dh-fg-strong);
	text-decoration: none;
	white-space: nowrap;
	transition: color var(--dh-dur);
}
.dh-phone svg {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	color: var(--dh-accent);
}
.dh-phone:hover,
.dh-phone:focus-visible {
	color: var(--dh-accent);
}
.dh-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.85em 1.7em;
	border-radius: 999px;
	border: 1.5px solid transparent;
	background: var(--dh-navy);
	color: #ffffff;
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	line-height: 1.2;
	white-space: nowrap;
	text-decoration: none;
	box-shadow: 0 4px 16px -8px rgba(43, 67, 93, 0.12);
	transition:
		background var(--dh-dur) var(--dh-ease),
		transform var(--dh-dur) var(--dh-ease),
		box-shadow var(--dh-dur) var(--dh-ease);
}
.dh-cta:hover,
.dh-cta:focus-visible {
	background: var(--dh-navy-700);
	color: #ffffff;
	transform: translateY(-2px);
	box-shadow: 0 12px 40px -16px rgba(43, 67, 93, 0.2);
}
.dh-burger {
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	margin-right: -10px;
}
.dh-burger__bar {
	display: block;
	width: 24px;
	height: 2px;
	border-radius: 2px;
	background: var(--dh-fg-strong);
	transition:
		transform var(--dh-dur) var(--dh-ease),
		opacity var(--dh-dur),
		background var(--dh-dur);
}
.dh-header.is-open .dh-burger__bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.dh-header.is-open .dh-burger__bar:nth-child(2) { opacity: 0; }
.dh-header.is-open .dh-burger__bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Mobil-Panel ---------- */
.dh-mobile {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	max-height: calc(100vh - var(--dh-h));
	max-height: calc(100dvh - var(--dh-h));
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	background: #ffffff;
	border-top: 1px solid var(--dh-line);
	box-shadow: 0 24px 48px -24px rgba(43, 67, 93, 0.35);
	padding: 0.25rem var(--dh-pad) 1.5rem;
}
.dh-mobile[hidden] { display: none !important; }
.dh-mobile.is-open {
	display: block;
	animation: dh-panel-in var(--dh-dur) var(--dh-ease);
}
@keyframes dh-panel-in {
	from { opacity: 0; transform: translateY(-8px); }
	to   { opacity: 1; transform: none; }
}
.dh-mobile__list > li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	margin: 0;
	border-bottom: 1px solid var(--dh-line);
}
.dh-mobile__list > li > a {
	flex: 1 1 auto;
	padding: 1rem 0;
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	line-height: 1.3;
	color: var(--dh-navy);
	text-decoration: none;
}
.dh-mobile__list > li.current-menu-item > a,
.dh-mobile__list > li.current-menu-ancestor > a,
.dh-mobile__list > li > a:hover {
	color: var(--dh-gold);
}
.dh-mobile .dh-sub-toggle {
	display: inline-grid;
	place-items: center;
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	margin-right: -12px;
	color: var(--dh-navy);
}
.dh-mobile .dh-sub-toggle svg {
	width: 18px;
	height: 18px;
	transition: transform var(--dh-dur) var(--dh-ease);
}
.dh-mobile li.is-open > .dh-sub-toggle svg { transform: rotate(180deg); }
.dh-mobile .dh-sub {
	flex: 0 0 100%;
	display: none;
	padding: 0 0 0.75rem;
}
.dh-mobile li.is-open > .dh-sub { display: block; }
.dh-mobile .dh-sub li { margin: 0; }
.dh-mobile .dh-sub a {
	display: block;
	padding: 0.7rem 0 0.7rem 1rem; /* ≥44px Tap-Ziel */
	border-left: 2px solid var(--dh-navy-tint);
	font-size: 1rem;
	line-height: 1.4;
	color: var(--dh-text-body);
	text-decoration: none;
	transition: color var(--dh-dur), border-color var(--dh-dur);
}
.dh-mobile .dh-sub a:hover,
.dh-mobile .dh-sub .current-menu-item > a {
	color: var(--dh-navy);
	border-left-color: var(--dh-gold);
}
.dh-mobile__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.85rem 1.5rem;
	padding-top: 1.25rem;
}
.dh-mobile__footer .dh-phone { color: var(--dh-navy); padding: 0.6rem 0; }
.dh-mobile__footer .dh-phone svg { color: var(--dh-gold); }

/* ---------- Responsive ----------
   Messwerte (Großbuchstaben-Labels): Menü ≈ 860px, Logo+Pill ≈ 200px,
   CTA ≈ 195px, Telefon ≈ 115px; Container max. 1490px. */
/* Telefon erst ab 1600px im Header (im Mobil-Panel immer sichtbar) */
@media (max-width: 1599px) {
	.dh-nav .dh-phone { display: none; }
	.dh-menu__list > li > a { font-size: 0.9rem; }
}
/* 1201 bis 1399px: kompaktere Abstände, damit der CTA im Header bleibt.
   Zuvor war er hier ausgeblendet, ohne dass der Burger einsprang: auf iPad quer
   (1366px) und in 1280er-Laptopfenstern gab es dadurch gar keinen Handlungsaufruf
   in der Kopfzeile (Kundenmeldung 31.08.2026). Menü braucht bei 0.9rem 759px,
   frei sind bei 1280px nur 135px; mit 0.85rem und engeren Abständen passt der CTA. */
@media (max-width: 1399px) and (min-width: 1201px) {
	.dh-menu__list { gap: 1rem; }
	.dh-menu__list > li > a { font-size: 0.85rem; }
	.dh-brand__logo { height: 54px; }
	.dh-nav .dh-cta { padding: 0 1.1em; font-size: 0.85rem; min-height: 42px; }
}
/* 1201 bis 1279px ist es am engsten: dort reicht 0.85rem noch nicht ganz
   (bei 1205px lief das letzte Menuewort 1px in den CTA). */
@media (max-width: 1279px) and (min-width: 1201px) {
	.dh-menu__list { gap: 0.85rem; }
	.dh-menu__list > li > a { font-size: 0.82rem; }
	.dh-nav .dh-cta { padding: 0 0.95em; font-size: 0.82rem; }
}
/* Bis 1200px (BB-Large-Breakpoint): Burger + Panel */
@media (max-width: 1200px) {
	.dh-header { --dh-h: 72px; }
	.dh-menu { display: none; }
	.dh-burger { display: flex; }
	.dh-brand__logo { height: 50px; }
	/* Touch: CTA mindestens 44px hoch, KI-Pill als 36px-Tap-Ziel */
	.dh-nav .dh-cta { padding: 0 1.4em; min-height: 44px; font-size: 0.9rem; }
	.dh-header .dh-brand-group .distler-ki-pill { padding: 0.55rem; }
}
/* Bis 560px kompakte Masse. Zuvor lag die Grenze bei 480px: bei 481px sprangen
   --dh-pad von 4% auf 5%, --dh-inset von 0 auf 14px und das Logo von 42 auf 50px,
   zusammen 38px weniger Platz von einem Pixel auf das naechste. Dadurch entstand ein
   zweites Bruchband von 481 bis 504px, in dem der Burger ebenfalls herausfiel
   (gemessen 31.08.2026 ueber jede Breite von 300 bis 1250px). Die grossen Masse
   brauchen rechnerisch 465px und passen erst ab rund 548px Viewportbreite. */
@media (max-width: 560px) {
	.dh-header { --dh-h: 64px; --dh-inset: 0px; --dh-pad: 4%; }
	.dh-brand__logo { height: 42px; }
	.dh-nav .dh-cta { padding: 0 1em; min-height: 40px; font-size: 0.85rem; }
	.dh-nav { gap: 0.75rem; }
	.dh-right { gap: 0.5rem; }
}
@media (max-width: 389px) {
	.dh-nav .dh-cta { display: none; }
}

/* ---------- 6er-Panel auf schmalen Desktops: Titel dürfen nicht überlaufen ---------- */
@media (max-width: 1300px) {
	.dh-mega--stack .dh-mega__inner { padding: 1rem; }
	.dh-mega--stack .dh-mega__grid { gap: 0.5rem; }
	.dh-mega--stack .dh-mega__card { padding: 0.25rem; }
	.dh-mega--stack .dh-mega__title { font-size: 0.95rem; letter-spacing: -0.005em; }
	.dh-mega--stack .dh-mega__desc { font-size: 0.875rem; }
}

/* ---------- Hero unter dem fixierten Header: Startseiten-Foto nach unten versetzen ----------
   BB-Row 2sl7wqfrozev (Post 686) steht auf 30% 30%; auf breiten Monitoren schneidet das die
   Köpfe unter dem Header ab. Ab 1201px vertikal auf 8% (≤1200px behält BB 60% 20% / center). */
@media (min-width: 1201px) {
	.fl-node-2sl7wqfrozev > .fl-row-content-wrap { background-position: 30% 8%; }
}

/* ---------- Bewegung reduzieren / Druck ---------- */
@media (prefers-reduced-motion: reduce) {
	.dh-header,
	.dh-header *,
	.dh-header *::before,
	.dh-header *::after {
		transition: none !important;
		animation: none !important;
	}
}
@media print {
	.dh-header {
		position: static;
		background: #ffffff;
		-webkit-backdrop-filter: none;
		backdrop-filter: none;
	}
	.dh-brand__logo--light { display: none; }
	.dh-brand__logo--dark { display: block; }
	.dh-right,
	.dh-mobile { display: none !important; }
}

/* ============================================================
   Mobile-Korrektur 31.08.2026: Burger war auf den verbreitetsten
   iPhones unsichtbar.

   Gemessen (Startseite, Chromium + WebKit, DPR 3):
     Breite | verfuegbar | benoetigt | fehlt
       390  |    358,8   |   390,3   | 31,5px
       393  |    361,6   |   390,3   | 28,7px
       402  |    369,8   |   390,3   | 20,5px
       414  |    380,9   |   390,3   |  9,4px
   Der Burger lag dadurch bei x=372..417, also rechts ausserhalb des
   Viewports; bei 390 und 393px war er nicht einmal antippbar. Betroffen
   waren alle 67 gemessenen Seiten, also iPhone 12/13/14 (390), 15/16 und
   Pixel 7/8 (393), 16 Pro (402) sowie XR/11/8 Plus (414).

   Ursache: .dh-nav lief ueber, weil .dh-cta erst ab max-width:389px
   ausgeblendet wurde, und der Burger als letztes Kind herausfiel.

   Zwei Massnahmen:
   1. Platz schaffen - die KI-Pill wandert bis 430px aus dem Header in das
      Mobil-Panel (dort mit ausgeschriebenem Text). Logo und CTA bleiben
      unveraendert.
   2. Sicherungsnetz - der Burger bekommt reservierten Platz und kann
      technisch nicht mehr verdraengt werden; der CTA weicht als erstes.
      Damit kommt der Fehler auch bei laengeren CTA-Texten oder groesserer
      Systemschrift nicht zurueck.
   ============================================================ */

/* --- 1. Sicherungsnetz: der Burger ist unantastbar --- */
.dh-nav {
	min-width: 0;
}
.dh-brand-group {
	flex: 0 1 auto;
	min-width: 0;
}
.dh-brand {
	min-width: 0;
}
.dh-brand__logo {
	max-width: 100%;
	object-fit: contain;
	object-position: left center;
}
.dh-right {
	flex: 0 1 auto;
	min-width: 0;
}
/* Der CTA darf schrumpfen, der Burger nie. */
.dh-nav .dh-cta {
	flex: 0 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}
.dh-burger {
	flex: 0 0 44px;
}

/* --- 2. KI-Hinweis: bis 430px nicht im Header, sondern im Menue --- */
.dh-mobile__ki {
	display: none;
	align-items: center;
	gap: 0.5em;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--dh-navy);
	text-decoration: none;
	white-space: nowrap;
	padding: 0.6rem 0;
	min-height: 44px;
	transition: color var(--dh-dur);
}
.dh-mobile__ki svg {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	color: var(--dh-gold);
}
.dh-mobile__ki:hover,
.dh-mobile__ki:focus-visible {
	color: var(--dh-accent);
}
@media (max-width: 430px) {
	.dh-header .dh-brand-group .distler-ki-pill { display: none; }
	.dh-mobile__ki { display: inline-flex; }
}

/* --- distler-webp-only --- */
/* WebP-only: CSS-Loader statt animiertem spinner.gif (PowerPack Content-Grid/Gallery).
   Das GIF (50 Frames, 56 KB) laesst sich nicht sinnvoll nach WebP bringen; der
   Kreis wird deshalb gezeichnet und das <img> ausgeblendet. */
.pp-grid-loader-icon {
	display: inline-block;
	vertical-align: middle;
	line-height: 0;
}
.pp-grid-loader-icon img {
	display: none !important;
}
.pp-grid-loader-icon::before {
	content: "";
	display: inline-block;
	width: 15px;
	height: 15px;
	border: 2px solid currentColor;
	border-top-color: transparent;
	border-radius: 50%;
	animation: ds-spin 0.8s linear infinite;
	vertical-align: middle;
}
@keyframes ds-spin {
	to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
	.pp-grid-loader-icon::before { animation-duration: 2.4s; }
}
/* Login-Form und Content-Grid setzen das GIF teils als Hintergrund. */
.pp-login-form .pp-login-form-submit.pp-loading,
.pp-content-grid .pp-content-grid-loader {
	background-image: none !important;
}

/* --- distler-kaufangebot-row --- */
/* ==========================================================================
   Startseiten-Row „Sie möchten Ihre Immobilie verkaufen?“ (#kaufangebot)
   Row: .fl-node-0fm9cjtgswq5  |  PHP: inc/kaufangebot-row.php
   Ziel: Relaunch-Design (Navy/Gold/Playfair) + WCAG-Kontrast ≥ 4,5:1 für jeden Text.
   ========================================================================== */

#kaufangebot {
    --k-navy:      #2B435D;
    --k-navy-800:  #1A2C40;
    --k-navy-900:  #13212F;
    --k-gold:      #B69256;
    --k-gold-soft: #CDAE78;   /* 4,8:1 auf Navy → Eyebrow/Icons */
    --k-white:     #FFFFFF;
    --k-text:      rgba(255, 255, 255, 0.92);
    --k-line:      rgba(255, 255, 255, 0.16);
    --k-serif:     "Playfair Display", Georgia, "Times New Roman", serif;
    --k-sans:      system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --k-ease:      cubic-bezier(0.16, 1, 0.3, 1);

    font-family: var(--k-sans);
    color: var(--k-text);
    position: relative;
    overflow: hidden;
}

/* ---------- Hintergrund: Navy-Verlauf + dezenter Gold-Schein ---------- */
#kaufangebot > .fl-row-content-wrap {
    background:
        radial-gradient(60% 55% at 50% 0%, rgba(182, 146, 86, 0.18) 0%, rgba(182, 146, 86, 0) 70%),
        linear-gradient(180deg, var(--k-navy) 0%, var(--k-navy-800) 100%) !important;
    padding-top: clamp(4rem, 8vw, 7rem) !important;
    padding-bottom: clamp(3rem, 6vw, 5rem) !important;
}
#kaufangebot .fl-row-content {
    max-width: 1100px;
}
#kaufangebot .fl-col-content > .fl-module {
    margin-left: 0;
    margin-right: 0;
}

/* ---------- Eyebrow (erste H2) ---------- */
#kaufangebot .fl-node-latuqxwj2bg9 .fl-rich-text h2 {
    font-family: var(--k-sans) !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    line-height: 1.4;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--k-gold-soft) !important;
    text-align: center;
    margin: 0 0 1rem;
}

/* ---------- Headline (zweite H2) ---------- */
#kaufangebot .fl-node-8dahln372m0k .fl-rich-text h2 {
    font-family: var(--k-serif) !important;
    font-weight: 400 !important;
    font-size: clamp(2rem, 4.2vw, 3.25rem) !important;
    line-height: 1.15;
    letter-spacing: -0.005em;
    color: var(--k-white) !important;
    text-align: center;
    text-wrap: balance;
    max-width: 28ch;
    margin: 0 auto 1.25rem;
}

/* ---------- Intro-Absatz ---------- */
#kaufangebot .fl-node-x0dntmzswjf9 .fl-rich-text p {
    font-size: 1.125rem;
    line-height: 1.65;
    color: var(--k-text);
    text-align: center;
    max-width: 62ch;
    margin: 0 auto;
}
#kaufangebot .fl-node-x0dntmzswjf9 {
    margin-bottom: clamp(2rem, 4vw, 3rem);
}

/* ---------- USP-Karten (verschachtelte Spaltengruppe) ---------- */
#kaufangebot .fl-node-rfkblaqui4mo {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin: 0 0 clamp(2rem, 4vw, 3rem);
}
#kaufangebot .fl-node-rfkblaqui4mo::before,
#kaufangebot .fl-node-rfkblaqui4mo::after {
    display: none; /* BB-Clearfix aushebeln (Grid) */
}
#kaufangebot .fl-node-rfkblaqui4mo > .fl-col {
    float: none;
    width: 100% !important;
    max-width: none !important;
    min-height: 0;
}
#kaufangebot .fl-node-rfkblaqui4mo .fl-col-content,
#kaufangebot .fl-node-rfkblaqui4mo .fl-module,
#kaufangebot .fl-node-rfkblaqui4mo .fl-module-content {
    height: 100%;
    margin: 0;
}
#kaufangebot .fl-node-rfkblaqui4mo .pp-infolist-wrap,
#kaufangebot .fl-node-rfkblaqui4mo .pp-infolist,
#kaufangebot .fl-node-rfkblaqui4mo .pp-list-items {
    height: 100%;
    margin: 0;
    padding: 0;
}
#kaufangebot .pp-list-item {
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}
#kaufangebot .pp-list-connector {
    display: none;
}
#kaufangebot .pp-list-item-content {
    display: flex !important;
    align-items: center;
    gap: 1rem;
    height: 100%;
    padding: 1.15rem 1.35rem;
    border: 1px solid var(--k-line);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.06);
    transition: background 280ms var(--k-ease), border-color 280ms var(--k-ease), transform 280ms var(--k-ease);
}
#kaufangebot .pp-list-item-content:hover {
    background: rgba(255, 255, 255, 0.10);
    border-color: rgba(205, 174, 120, 0.55);
    transform: translateY(-2px);
}
#kaufangebot .pp-icon-wrapper {
    flex: 0 0 auto;
    margin: 0 !important;
    padding: 0 !important;
}
#kaufangebot .pp-infolist-icon,
#kaufangebot .pp-infolist-icon-inner {
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
}
#kaufangebot .pp-infolist-icon-inner {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: rgba(205, 174, 120, 0.14) !important;
    border: 1px solid rgba(205, 174, 120, 0.45) !important;
}
#kaufangebot .pp-infolist-icon-inner .pp-icon {
    font-size: 26px !important;
    line-height: 1 !important;
    color: var(--k-gold-soft) !important;
}
#kaufangebot .pp-heading-wrapper {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
}
#kaufangebot .pp-infolist-title {
    display: none; /* leer im Builder */
}
#kaufangebot .pp-infolist-description,
#kaufangebot .pp-infolist-description p {
    margin: 0 !important;
    padding: 0 !important;
    font-family: var(--k-sans);
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 1.4;
    color: var(--k-white) !important;
    text-align: left;
}

/* ---------- CTA-Buttons (ersetzt den Link-Absatz, siehe PHP) ---------- */
#kaufangebot .ds-kauf__cta {
    text-align: center;
}
#kaufangebot .ds-kauf__cta-label {
    font-size: 1.125rem;
    line-height: 1.5;
    color: var(--k-text);
    margin: 0 0 1.25rem;
}
#kaufangebot .ds-kauf__btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.85rem;
}
#kaufangebot .fl-node-h2k94qwivsdm a.ds-kauf__btn {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 54px;
    padding: 0.85rem 1.6rem 0.85rem 1.75rem;
    border-radius: 0;
    background: var(--k-white);
    color: var(--k-navy-900) !important;   /* ≥ 15:1 */
    font-family: var(--k-sans);
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;
    border: 1px solid var(--k-white);
    box-shadow: 0 14px 30px -16px rgba(0, 0, 0, 0.55);
    transition: background 280ms var(--k-ease), border-color 280ms var(--k-ease), transform 280ms var(--k-ease), box-shadow 280ms var(--k-ease);
}
#kaufangebot .fl-node-h2k94qwivsdm a.ds-kauf__btn:hover,
#kaufangebot .fl-node-h2k94qwivsdm a.ds-kauf__btn:focus-visible {
    background: var(--k-gold-soft);
    border-color: var(--k-gold-soft);
    color: var(--k-navy-900) !important;   /* 8,6:1 */
    transform: translateY(-2px);
    box-shadow: 0 18px 34px -16px rgba(0, 0, 0, 0.6);
}
#kaufangebot .fl-node-h2k94qwivsdm a.ds-kauf__btn:focus-visible {
    outline: 3px solid var(--k-gold-soft);
    outline-offset: 3px;
}
#kaufangebot .ds-kauf__btn-arrow {
    width: 18px;
    height: 18px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12h14M13 6l6 6-6 6'/></svg>") center / contain no-repeat;
            mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M5 12h14M13 6l6 6-6 6'/></svg>") center / contain no-repeat;
    transition: transform 280ms var(--k-ease);
}
#kaufangebot .fl-node-h2k94qwivsdm a.ds-kauf__btn:hover .ds-kauf__btn-arrow {
    transform: translateX(3px);
}

/* Fallback, falls der PHP-Filter nicht greift: Links trotzdem lesbar */
#kaufangebot .fl-node-h2k94qwivsdm .fl-rich-text p {
    text-align: center;
    font-size: 1.125rem;
    color: var(--k-text);
}
#kaufangebot .fl-node-h2k94qwivsdm .fl-rich-text p > a:not(.ds-kauf__btn) {
    color: var(--k-gold-soft) !important;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

/* ---------- Scroll-Chevron ---------- */
#kaufangebot .fl-node-o69hfqwipm4s {
    margin-top: clamp(2rem, 4vw, 3rem);
    margin-bottom: 0;
}
#kaufangebot .fl-node-o69hfqwipm4s .fl-icon-wrap {
    text-align: center;
}
#kaufangebot .fl-node-o69hfqwipm4s .fl-icon a {
    display: inline-grid;
    place-items: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid var(--k-line);
    color: var(--k-white) !important;
    background: rgba(255, 255, 255, 0.04);
    transition: border-color 280ms var(--k-ease), background 280ms var(--k-ease), transform 280ms var(--k-ease);
}
#kaufangebot .fl-node-o69hfqwipm4s .fl-icon a:hover {
    border-color: var(--k-gold-soft);
    background: rgba(205, 174, 120, 0.14);
    transform: translateY(3px);
}
#kaufangebot .fl-node-o69hfqwipm4s .fl-icon i {
    font-size: 18px !important;
    color: var(--k-white) !important;
    animation: ds-kauf-bounce 2.2s var(--k-ease) infinite;
}
@keyframes ds-kauf-bounce {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(3px); }
}
@media (prefers-reduced-motion: reduce) {
    #kaufangebot * { animation: none !important; transition: none !important; }
}

/* ---------- Responsive ---------- */
@media (max-width: 992px) {
    #kaufangebot .fl-node-rfkblaqui4mo {
        grid-template-columns: 1fr;
        max-width: 560px;
        margin-left: auto;
        margin-right: auto;
    }
}
@media (max-width: 640px) {
    #kaufangebot .ds-kauf__btns {
        flex-direction: column;
        align-items: stretch;
    }
    #kaufangebot .fl-node-h2k94qwivsdm a.ds-kauf__btn {
        justify-content: center;
    }
    #kaufangebot .pp-list-item-content {
        padding: 1rem 1.1rem;
    }
}

/* --- distler-kontakt-row --- */
/* ==========================================================================
   DISTLER Immobilien Gruppe: globale BB-Row „Kontakt“ (#kontakt, „Jetzt Kontakt aufnehmen“)
   Template 903 (Template-ID 9ynli372seq5), liegt auf 17 Seiten. Kompaktes Layout:
   weniger Leerraum zwischen Überschrift, Kontaktzeilen, Formular und Infoboxen.
   Inhalte bleiben in Beaver Builder; hier wird nur das Rendering angepasst.
   Die kompakten WPForms-Feldabstände selbst stehen global in global-design.css.

   Kind-Nodes (Template-IDs, auf allen Seiten identisch):
     6lr1t7pbgvs8 linke Spalte | xpwd30t7k1z8 Überschrift | jcmh4upa8zt6 Linie
     as5d3f1pulxy Unterzeile   | azt1qch9nlb6 E-Mail      | ye9ln02kmiuw Telefon
     g8h5sjn7utk4 Formular (Rich-Text mit [wpforms id="1956"])
     38egjfrlypha rechte Spalte | j38s5pibad1x / yl1qe7mdc6xk / 62p3v948dui1 Infoboxen
   Das leere PP-WPForms-Modul (clk91a2bp30m) und der &nbsp;-Spacer (gpt6dv7e04xa) wurden am
   25.08.2026 aus dem Template geloescht (Backup wp-content/uploads/backup/2026-08-25-kontakt-row/),
   deshalb braucht es dafuer keine Ausblende-Regeln mehr.
   ========================================================================== */

/* ---------- Linke Spalte: Module untereinander, Kontaktzeilen nebeneinander ---------- */
.fl-builder-content .fl-node-6lr1t7pbgvs8 > .fl-col-content {
    flex-direction: row !important;
    flex-wrap: wrap;
    justify-content: flex-start !important;
    align-content: flex-start;
    align-items: flex-start;
    padding-top: 0;
}
.fl-builder-content .fl-node-6lr1t7pbgvs8 > .fl-col-content > .fl-module {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

/* Überschrift, Linie, Unterzeile */
.fl-builder-content .fl-node-xpwd30t7k1z8 > .fl-module-content { margin-top: 0; margin-bottom: 0; }
.fl-builder-content .fl-node-xpwd30t7k1z8 .fl-heading { margin: 0; line-height: 1.15; }
.fl-builder-content .fl-node-jcmh4upa8zt6 > .fl-module-content { margin-top: 14px; margin-bottom: 16px; }
.fl-builder-content .fl-node-as5d3f1pulxy > .fl-module-content { margin-top: 0; margin-bottom: 20px; }
.fl-builder-content .fl-node-as5d3f1pulxy .fl-rich-text p { margin: 0; line-height: 1.3; }

/* Kontaktzeilen E-Mail + Telefon: eine Zeile (umbricht auf schmalen Viewports) */
.fl-builder-content .fl-node-6lr1t7pbgvs8 > .fl-col-content > .fl-node-azt1qch9nlb6,
.fl-builder-content .fl-node-6lr1t7pbgvs8 > .fl-col-content > .fl-node-ye9ln02kmiuw {
    flex: 0 0 auto;
    width: auto;
}
.fl-builder-content .fl-node-azt1qch9nlb6 > .fl-module-content { margin: 0 36px 14px 0; }
.fl-builder-content .fl-node-ye9ln02kmiuw > .fl-module-content { margin: 0 0 28px 0; }
.fl-builder-content .fl-node-azt1qch9nlb6 .fl-icon-wrap,
.fl-builder-content .fl-node-ye9ln02kmiuw .fl-icon-wrap {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}
.fl-builder-content .fl-node-azt1qch9nlb6 .fl-icon,
.fl-builder-content .fl-node-ye9ln02kmiuw .fl-icon { display: inline-flex; align-items: center; line-height: 1; }
.fl-builder-content .fl-node-azt1qch9nlb6 .fl-icon i,
.fl-builder-content .fl-node-ye9ln02kmiuw .fl-icon i { float: none; }
/* BB setzt .fl-icon-text auf height = Icongröße × 1,75 (53 px) für die alte Table-Cell-Zentrierung; hier auf Inhaltshöhe */
.fl-builder-content .fl-node-azt1qch9nlb6 .fl-icon-text,
.fl-builder-content .fl-node-ye9ln02kmiuw .fl-icon-text {
    display: flex;
    align-items: center;
    height: auto !important;
    min-height: 0;
    padding: 0;
    margin: 0;
    line-height: 1.4;
}
/* Sicherheitsnetz, falls im Builder wieder ein <p> um den Text entsteht */
.fl-builder-content .fl-node-azt1qch9nlb6 .fl-icon-text p,
.fl-builder-content .fl-node-ye9ln02kmiuw .fl-icon-text p { margin: 0 !important; padding: 0 !important; }

/* ---------- Formular (WPForms 1956 per Shortcode im Rich-Text-Modul, Shortcode steht in einem <p>) ---------- */
.fl-builder-content .fl-node-g8h5sjn7utk4 > .fl-module-content { margin-top: 0; margin-bottom: 0; }
.fl-builder-content .fl-node-g8h5sjn7utk4 .fl-rich-text > p { margin: 0 !important; padding: 0; }
.fl-builder-content .fl-node-g8h5sjn7utk4 .wpforms-container { margin: 0 !important; }

/* ---------- Rechte Spalte: Infoboxen ohne Innenabstände ---------- */
.fl-builder-content .fl-node-38egjfrlypha > .fl-col-content { padding-top: 0; }
.fl-builder-content .fl-node-j38s5pibad1x > .fl-module-content,
.fl-builder-content .fl-node-yl1qe7mdc6xk > .fl-module-content,
.fl-builder-content .fl-node-62p3v948dui1 > .fl-module-content { margin-top: 0; margin-bottom: 28px; }
.fl-builder-content .fl-node-62p3v948dui1 > .fl-module-content { margin-bottom: 0; }
.fl-builder-content .fl-node-38egjfrlypha .pp-infobox { padding: 0 !important; }
.fl-builder-content .fl-node-38egjfrlypha .pp-infobox-icon { line-height: 1; }
.fl-builder-content .fl-node-38egjfrlypha .pp-infobox-title { margin: 8px 0 4px !important; line-height: 1.25; }
.fl-builder-content .fl-node-38egjfrlypha .pp-infobox-description p { margin: 0; line-height: 1.45; }
/* Beschreibungstexte: BB-Modulfarbe ist Schwarz (unlesbar auf Navy). Helles Grau der Palette,
   Kontrast zu #2B435D ca. 9:1 (25.08.2026, Martins Vorgabe: guter Kontrast) */
.fl-builder-content .fl-node-38egjfrlypha .pp-infobox-description,
.fl-builder-content .fl-node-38egjfrlypha .pp-infobox-description p { color: #EAEEF3 !important; }

/* ---------- Mobil ---------- */
@media (max-width: 768px) { /* BB stapelt die Spalten ab 768px (inkl. iPad hochkant) */
    .fl-builder-content .fl-node-38egjfrlypha > .fl-col-content { padding-top: 28px; } /* Abstand Formular → Infoboxen */
    .fl-builder-content .fl-node-azt1qch9nlb6 > .fl-module-content { margin: 0 0 12px 0; }
    .fl-builder-content .fl-node-ye9ln02kmiuw > .fl-module-content { margin: 0 0 24px 0; }
    .fl-builder-content .fl-node-j38s5pibad1x > .fl-module-content,
    .fl-builder-content .fl-node-yl1qe7mdc6xk > .fl-module-content { margin-bottom: 22px; }
}

/* --- distler-standorte --- */
/* ==========================================================================
   Standorte (Satellitenseiten) für den Immobilien-Ankauf
   Übersicht mit Karte (/standorte/) und Detailseiten (/standorte/<ort>/)

   Nutzt die globalen Design-Tokens aus assets/global-design.css.
   Vorgaben: Buttons eckig, goldene Buttons mit Navy-Text, Fließtext ab 18px,
   keine dekorativen Striche vor Labels.
   ========================================================================== */

.ds-st {
    --st-max:      1240px;
    --st-gap:      clamp(1.5rem, 3vw, 2.75rem);
    --st-pad-y:    clamp(3rem, 6vw, 5.5rem);
    --st-radius:   14px;
    --st-header-h: 73px;   /* Höhe des fixierten Theme-Headers, siehe Umbrüche unten */
    --st-navy:     var(--ds-navy, #2B435D);
    --st-navy-800: var(--ds-navy-800, #1A2C40);
    --st-navy-900: var(--ds-navy-900, #13212F);
    --st-gold:     var(--ds-gold, #B69256);
    --st-gold-soft: var(--ds-gold-soft, #CDAE78);
    --st-text:     var(--ds-text, #25303B);
    --st-body:     var(--ds-text-body, #4A5560);
    --st-muted:    var(--ds-text-muted, #5B636D);
    --st-soft:     var(--ds-bg-soft, #F0F2F5);
    --st-line:     rgba(43, 67, 93, .14);

    color: var(--st-body);
    font-size: 1.125rem;
    line-height: 1.62;
}

.ds-st * { box-sizing: border-box; }

.ds-st-container {
    width: 100%;
    max-width: var(--st-max);
    margin-inline: auto;
    padding-inline: clamp(1.1rem, 4vw, 2.25rem);
}

.ds-st-narrow { max-width: 900px; }

.ds-st :is(h1, h2, h3) {
    font-family: var(--ds-serif, "Playfair Display", Georgia, serif);
    font-weight: 400;
    color: var(--st-text);
    line-height: 1.15;
    letter-spacing: -.01em;
    margin: 0 0 .6em;
}
.ds-st h2 { font-size: clamp(1.75rem, 3.2vw, 2.6rem); }
.ds-st h3 { font-size: clamp(1.25rem, 2vw, 1.55rem); }
.ds-st p  { margin: 0 0 1.1em; }
.ds-st p:last-child { margin-bottom: 0; }

.ds-st-eyebrow {
    font-family: var(--ds-sans, system-ui, sans-serif);
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    /* Eyebrows stehen auf dunklen Flächen: helles Gold für 4,5:1 gegen Navy */
    color: var(--st-gold-soft);
    margin: 0 0 .9rem;
}
/* Falls ein Eyebrow einmal auf heller Fläche steht: dunkleres Gold */
.ds-st-section:not(.ds-st-section--dark) > .ds-st-container .ds-st-eyebrow { color: #7d5f2a; }

.ds-st-section { padding-block: var(--st-pad-y); }
.ds-st-section--soft { background: var(--st-soft); }
.ds-st-section--karte { padding-top: clamp(2.5rem, 5vw, 4rem); }

/* Kopfbereich nutzt die volle Boxed-Breite, nur der Lede-Absatz bleibt auf Lesebreite (kein Einzelwort-Umbruch in Überschriften) */
.ds-st-head { margin-bottom: clamp(1.8rem, 3.5vw, 3rem); }
.ds-st-head__lede { font-size: 1.15rem; color: var(--st-muted); margin: 0; max-width: 760px; }
.ds-st-h3 { margin-top: 2.2rem; }

.ds-st-prose > :first-child { margin-top: 0; }
.ds-st-prose--light, .ds-st-prose--light p { color: rgba(255, 255, 255, .88); }

/* ---------- Brotkrumen ---------- */
.ds-st-crumb {
    font-size: .95rem;
    letter-spacing: .02em;
    color: rgba(255, 255, 255, .68);
    margin-bottom: clamp(1.4rem, 3vw, 2.4rem);
}
.ds-st-crumb a { color: rgba(255, 255, 255, .78); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.28); }
.ds-st-crumb a:hover { color: #fff; border-bottom-color: var(--st-gold-soft); }
.ds-st-crumb span[aria-hidden] { margin-inline: .5rem; opacity: .6; }
.ds-st-crumb [aria-current] { color: #fff; }

/* ---------- Hero ---------- */
.ds-st-hero {
    position: relative;
    background: linear-gradient(160deg, var(--st-navy) 0%, var(--st-navy-800) 52%, var(--st-navy-900) 100%);
    color: #fff;
    padding-block: calc(var(--st-header-h) + clamp(1.6rem, 3vw, 2.6rem)) clamp(3rem, 6vw, 5rem);
}
.ds-st-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: start;
}
.ds-st-hero__grid--hub { grid-template-columns: minmax(0, 1fr); max-width: 940px; }
.ds-st .ds-st-hero__title,
.ds-st-hero .ds-st-hero__title {
    color: #fff;
    font-size: clamp(2.1rem, 4.6vw, 3.4rem);
    margin-bottom: .5em;
}
.ds-st-lead, .ds-st-lead p {
    font-size: clamp(1.15rem, 1.6vw, 1.3rem);
    line-height: 1.55;
    color: rgba(255, 255, 255, .9);
}
.ds-st-lead { margin-bottom: 1.8rem; }

.ds-st-usps { list-style: none; margin: 0 0 2rem; padding: 0; display: grid; gap: .6rem; }
.ds-st-usps li {
    display: flex; align-items: flex-start; gap: .65rem;
    font-size: 1.125rem; color: rgba(255, 255, 255, .9);
}
.ds-st-usps svg { width: 20px; height: 20px; flex: 0 0 20px; margin-top: .22em; color: var(--st-gold-soft); stroke-width: 2.4; }
.ds-st li::before, .ds-st li::marker { content: none; }

.ds-st-trust {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1.4rem 2rem;
    margin-top: 2.4rem;
    padding-top: 1.8rem;
    border-top: 1px solid rgba(255, 255, 255, .16);
}
.ds-st-trust strong {
    display: block;
    font-family: var(--ds-serif, Georgia, serif);
    font-weight: 400;
    font-size: clamp(1.7rem, 3vw, 2.3rem);
    color: var(--st-gold-soft);
    line-height: 1.1;
}
.ds-st-trust span { display: block; font-size: .98rem; color: rgba(255, 255, 255, .72); margin-top: .3rem; }

/* ---------- Buttons ---------- */
.ds-st-actions { display: flex; flex-wrap: wrap; gap: .85rem; }
.ds-st-btn {
    display: inline-flex; align-items: center; gap: .6rem;
    padding: .95rem 1.6rem;
    font-family: var(--ds-sans, system-ui, sans-serif);
    font-size: 1.125rem; font-weight: 600; line-height: 1.2;
    text-decoration: none;
    border: 1.5px solid transparent;
    border-radius: 0;
    transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .25s ease;
}
.ds-st-btn svg { width: 19px; height: 19px; flex: 0 0 19px; }
.ds-st-btn--gold { background: var(--st-gold); color: var(--st-navy-900); }
.ds-st-btn--gold:hover, .ds-st-btn--gold:focus-visible { background: var(--st-gold-soft); color: var(--st-navy-900); transform: translateY(-2px); }
.ds-st-btn--ghost { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .45); }
.ds-st-btn--ghost:hover, .ds-st-btn--ghost:focus-visible { border-color: #fff; background: rgba(255, 255, 255, .1); color: #fff; }
.ds-st-btn--ghost-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .45); }
.ds-st-btn--ghost-light:hover, .ds-st-btn--ghost-light:focus-visible { background: rgba(255, 255, 255, .12); color: #fff; border-color: #fff; }

/* ---------- Karte ---------- */
.ds-st-map { margin: 0; }
.ds-st-map__svg { display: block; width: 100%; height: auto; }
.ds-st-map__nachbar { fill: rgba(43, 67, 93, .04); stroke: rgba(43, 67, 93, .22); stroke-width: 1.1; }
.ds-st-map__haupt   { fill: rgba(43, 67, 93, .10); stroke: rgba(43, 67, 93, .44); stroke-width: 1.6; stroke-linejoin: round; }

.ds-st-map--hub { position: relative; background: #fff; border: 1px solid var(--st-line); padding: clamp(.8rem, 2vw, 1.4rem); }
.ds-st-map--hub .ds-st-map__svg { max-height: min(74vh, 720px); }

.ds-st-map__pin { cursor: pointer; }
.ds-st-map__halo { fill: transparent; }
.ds-st-map__dot {
    fill: var(--st-navy);
    stroke: #fff;
    stroke-width: 1.6;
    transition: fill .2s ease, r .2s ease;
}
.ds-st-map__dot.is-gross { fill: var(--st-gold); stroke-width: 2; }
.ds-st-map__pin:hover .ds-st-map__dot,
.ds-st-map__pin:focus-visible .ds-st-map__dot { fill: var(--st-gold); r: 8; }
.ds-st-map__pin:focus-visible { outline: none; }
.ds-st-map__pin:focus-visible .ds-st-map__halo { fill: rgba(182, 146, 86, .28); }
.ds-st-map__pin.is-dim { opacity: .18; }
.ds-st-map__pin.is-treffer .ds-st-map__dot { fill: var(--st-gold); }

/* Mini-Karte in der Kopfzeile der Detailseite */
.ds-st-map--mini {
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .16);
    padding: 1rem 1rem .4rem;
}
.ds-st-map--mini .ds-st-map__nachbar { fill: rgba(255, 255, 255, .05); stroke: rgba(255, 255, 255, .18); }
.ds-st-map--mini .ds-st-map__haupt { fill: rgba(255, 255, 255, .12); stroke: rgba(255, 255, 255, .42); }
.ds-st-map--mini .ds-st-map__dot--klein { fill: rgba(255, 255, 255, .5); stroke: none; }
.ds-st-map--mini .ds-st-map__aktiv { fill: var(--st-gold); stroke: #fff; stroke-width: 2; }
.ds-st-map--mini .ds-st-map__aktiv-halo { fill: rgba(182, 146, 86, .3); }
.ds-st-map--mini figcaption {
    font-size: .95rem;
    color: rgba(255, 255, 255, .72);
    text-align: center;
    padding: .5rem 0 .6rem;
}

/* Filter, Suche, Liste */
.ds-st-karte__filter { display: flex; flex-wrap: wrap; gap: .55rem; margin-bottom: 1.6rem; }
.ds-st-chip {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .6rem 1.05rem;
    font-family: var(--ds-sans, system-ui, sans-serif);
    font-size: 1.0625rem; font-weight: 600;
    color: var(--st-navy);
    background: #fff;
    border: 1.5px solid var(--st-line);
    border-radius: 0;
    cursor: pointer;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
.ds-st-chip:hover { border-color: var(--st-navy); }
.ds-st-chip.is-active { background: var(--st-navy); border-color: var(--st-navy); color: #fff; }
.ds-st-chip__n { font-size: .95rem; font-weight: 600; color: var(--st-muted); }
.ds-st-chip.is-active .ds-st-chip__n { color: rgba(255, 255, 255, .82); }

.ds-st-karte__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr);
    gap: clamp(1.5rem, 3vw, 2.5rem);
    align-items: start;
}
.ds-st-karte__liste { background: #fff; border: 1px solid var(--st-line); padding: clamp(1.1rem, 2.4vw, 1.6rem); }
.ds-st-suche { display: block; margin-bottom: .9rem; }
.ds-st-suche span {
    display: block; font-size: .95rem; font-weight: 600; letter-spacing: .1em;
    text-transform: uppercase; color: var(--st-muted); margin-bottom: .5rem;
}
.ds-st-suche input {
    width: 100%;
    padding: .8rem 1rem;
    font-size: 1.125rem;
    color: var(--st-text);
    background: #fff;
    border: 1.5px solid var(--st-line);
    border-radius: 0;
}
.ds-st-suche input:focus-visible { outline: 2px solid var(--st-gold); outline-offset: 1px; border-color: var(--st-navy); }
.ds-st-karte__count { font-size: .98rem; color: var(--st-muted); margin: 0 0 .6rem; }
.ds-st-karte__ul {
    list-style: none; margin: 0; padding: 0;
    max-height: 520px; overflow-y: auto;
    border-top: 1px solid var(--st-line);
}
.ds-st-karte__ul li { border-bottom: 1px solid var(--st-line); }
.ds-st-karte__ul a {
    display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
    padding: .72rem .3rem;
    text-decoration: none; color: var(--st-text);
}
.ds-st-karte__ul a:hover, .ds-st-karte__ul a:focus-visible { color: var(--st-navy); background: var(--st-soft); }
.ds-st-karte__ort { font-weight: 600; font-size: 1.125rem; }
.ds-st-karte__kreis { font-size: .95rem; color: var(--st-muted); text-align: right; }
.ds-st-karte__ul li.is-hidden { display: none; }
.ds-st-karte__leer { margin-top: 1rem; color: var(--st-muted); font-size: 1.125rem; }

/* ---------- Regionen und Ortslisten ---------- */
.ds-st-region + .ds-st-region { margin-top: clamp(2rem, 4vw, 3rem); }
.ds-st-region__title {
    display: flex; align-items: baseline; gap: .9rem; flex-wrap: wrap;
    padding-bottom: .7rem;
    border-bottom: 1px solid var(--st-line);
    margin-bottom: 1.2rem;
}
.ds-st-region__n {
    font-family: var(--ds-sans, system-ui, sans-serif);
    font-size: .95rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase;
    color: var(--st-muted);
}
.ds-st-orte, .ds-st-nachbarn {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: .5rem;
}
.ds-st-orte a, .ds-st-nachbarn a {
    display: flex; align-items: center; gap: .55rem;
    padding: .7rem .85rem;
    background: #fff;
    border: 1px solid var(--st-line);
    color: var(--st-text);
    text-decoration: none;
    font-size: 1.125rem;
    transition: border-color .2s ease, color .2s ease, transform .2s ease;
}
.ds-st-orte a:hover, .ds-st-nachbarn a:hover,
.ds-st-orte a:focus-visible, .ds-st-nachbarn a:focus-visible {
    border-color: var(--st-navy); color: var(--st-navy); transform: translateY(-1px);
}
.ds-st-orte svg, .ds-st-nachbarn svg { width: 18px; height: 18px; flex: 0 0 18px; color: var(--st-gold); }
.ds-st-mehr { margin-top: 1.4rem; }
.ds-st-mehr a { display: inline-flex; align-items: center; gap: .5rem; color: var(--st-navy); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--st-line); }
.ds-st-mehr a:hover { color: var(--st-gold); }
.ds-st-mehr svg { width: 18px; height: 18px; }

/* ---------- Zwei Spalten mit Datenkarte ---------- */
.ds-st-split {
    display: grid;
    grid-template-columns: minmax(0, 1.55fr) minmax(260px, .45fr);
    gap: clamp(1.8rem, 4vw, 3.2rem);
    align-items: start;
}
.ds-st-split--wide { grid-template-columns: minmax(0, 1.4fr) minmax(260px, .6fr); }

.ds-st-datacard { background: #fff; border: 1px solid var(--st-line); padding: clamp(1.2rem, 2.5vw, 1.7rem); }
.ds-st-datacard h3 { font-size: 1.2rem; margin-bottom: .9rem; }
.ds-st-datacard dl { margin: 0; }
.ds-st-datacard dl > div { display: flex; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-bottom: 1px solid var(--st-line); }
.ds-st-datacard dl > div:last-child { border-bottom: 0; }
.ds-st-datacard dt { font-size: 1.125rem; color: var(--st-muted); }
.ds-st-datacard dd { margin: 0; font-size: 1.125rem; font-weight: 600; color: var(--st-text); text-align: right; }
.ds-st-datacard dd small { display: block; font-size: .95rem; font-weight: 400; color: var(--st-muted); }
.ds-st-quelle { margin-top: 1rem; font-size: .95rem; color: var(--st-muted); }
.ds-st-quelle a { color: var(--st-muted); }

/* Fakten im Hero */
.ds-st-facts { margin: 1.2rem 0 0; display: grid; gap: 0; }
.ds-st-facts > div {
    display: flex; justify-content: space-between; gap: 1rem;
    padding: .6rem 0;
    border-bottom: 1px solid rgba(255, 255, 255, .14);
}
.ds-st-facts > div:last-child { border-bottom: 0; }
.ds-st-facts dt { font-size: 1.125rem; color: rgba(255, 255, 255, .74); }
.ds-st-facts dd { margin: 0; font-size: 1.125rem; font-weight: 600; color: #fff; text-align: right; }

/* ---------- Dunkler Ankaufs-Abschnitt ---------- */
.ds-st-section--dark {
    background: linear-gradient(150deg, var(--st-navy-800) 0%, var(--st-navy-900) 100%);
    color: rgba(255, 255, 255, .88);
}
.ds-st .ds-st-section--dark h2, .ds-st .ds-st-section--dark h3 { color: #fff; }
.ds-st-checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.ds-st-checklist li {
    display: flex; align-items: flex-start; gap: .7rem;
    font-size: 1.125rem; color: rgba(255, 255, 255, .9);
    padding-bottom: .7rem;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.ds-st-checklist li:last-child { border-bottom: 0; padding-bottom: 0; }
.ds-st-checklist svg { width: 20px; height: 20px; flex: 0 0 20px; margin-top: .2em; color: var(--st-gold-soft); stroke-width: 2.4; }

/* ---------- Ortsteile ---------- */
.ds-st-tags { list-style: none; margin: 1rem 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem; }
.ds-st-tags li {
    padding: .45rem .95rem;
    background: #fff;
    border: 1px solid var(--st-line);
    font-size: 1.125rem;
    color: var(--st-text);
}

/* ---------- Leistungs-Kacheln ---------- */
.ds-st-cards {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: clamp(1rem, 2vw, 1.5rem);
}
.ds-st-card__link {
    display: flex; flex-direction: column; height: 100%;
    padding: clamp(1.4rem, 2.6vw, 1.9rem);
    background: #fff;
    border: 1px solid var(--st-line);
    text-decoration: none;
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.ds-st-card__link:hover, .ds-st-card__link:focus-visible {
    transform: translateY(-3px);
    border-color: rgba(43, 67, 93, .3);
    box-shadow: 0 18px 44px -28px rgba(19, 33, 47, .55);
}
.ds-st-card__icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 46px; height: 46px; margin-bottom: 1rem;
    background: var(--st-soft); color: var(--st-navy);
}
.ds-st-card__icon svg { width: 24px; height: 24px; }
.ds-st-card__title {
    font-family: var(--ds-serif, Georgia, serif);
    font-size: 1.3rem; font-weight: 400; color: var(--st-text);
    margin-bottom: .5rem;
}
.ds-st-card__text { font-size: 1.125rem; color: var(--st-muted); line-height: 1.55; }
.ds-st-card__more {
    display: inline-flex; align-items: center; gap: .45rem;
    margin-top: auto; padding-top: 1.1rem;
    font-size: 1.125rem; font-weight: 600; color: var(--st-navy);
}
.ds-st-card__more svg { width: 18px; height: 18px; transition: transform .25s ease; }
.ds-st-card__link:hover .ds-st-card__more svg { transform: translateX(4px); }
.ds-st-card--cta .ds-st-card__link { background: var(--st-navy); border-color: var(--st-navy); color: #fff; }
.ds-st .ds-st-card--cta .ds-st-card__title { color: #fff; }
.ds-st-card--cta .ds-st-card__text { color: rgba(255, 255, 255, .82); }
.ds-st-card--cta .ds-st-card__more { color: var(--st-gold-soft); }
.ds-st-card--cta .ds-st-card__icon { background: rgba(255, 255, 255, .12); color: var(--st-gold-soft); }

/* ---------- Ablauf ---------- */
.ds-st-steps {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: clamp(1rem, 2vw, 1.6rem);
    counter-reset: step;
}
.ds-st-steps li {
    display: flex; flex-direction: column; gap: .45rem;
    padding: clamp(1.2rem, 2.4vw, 1.6rem);
    background: #fff;
    border: 1px solid var(--st-line);
    font-size: 1.125rem; color: var(--st-muted); line-height: 1.55;
}
.ds-st-steps__num {
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; margin-bottom: .5rem;
    background: var(--st-navy); color: #fff;
    font-family: var(--ds-serif, Georgia, serif); font-size: 1.2rem;
}
.ds-st-steps strong { font-size: 1.1rem; color: var(--st-text); font-weight: 600; }

/* ---------- FAQ ----------
   Gleiche Karten-Optik wie auf allen uebrigen Seiten (Vorbild
   /kaufpreis-anfragen/, siehe assets/bb-native.css). Vorher waren es hier
   nur Trennlinien ohne Karten. */
.ds-st-faq { display: grid; gap: .7rem; border-top: 0; }
.ds-st-faq__item {
    background: var(--ds-bg-card, #fff);
    border: 1px solid var(--ds-line, rgba(43,67,93,.12));
    border-radius: var(--ds-r-tile, 16px);
    overflow: hidden;
    transition: box-shadow var(--ds-dur, .28s) var(--ds-ease, ease);
}
.ds-st-faq__item[open] { box-shadow: var(--ds-sh-card, 0 12px 40px -16px rgba(43,67,93,.2)); border-color: transparent; }
.ds-st-faq__item summary {
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    padding: 1.2rem 1.5rem;
    font-family: var(--ds-serif, Georgia, serif);
    font-weight: 700;
    font-size: 1.2rem;
    line-height: 1.3;
    color: var(--st-text);
    cursor: pointer;
    list-style: none;
}
.ds-st-faq__item summary::-webkit-details-marker { display: none; }
.ds-st-faq__item summary::after {
    content: "+";
    flex: 0 0 auto; margin: 0; border: 0;
    font-family: var(--ds-sans); font-weight: 400; font-size: 1.7rem; line-height: 1;
    color: var(--st-gold, var(--ds-gold));
    transform: none;
    transition: transform var(--ds-dur, .28s) var(--ds-ease, ease);
}
.ds-st-faq__item[open] summary::after { transform: rotate(45deg); }
.ds-st-faq__item summary:focus-visible { outline: 2px solid var(--st-gold); outline-offset: 3px; }
.ds-st-faq__a { padding: 0 1.5rem 1.3rem; max-width: 74ch; }
.ds-st-faq__a p { font-size: var(--ds-fs-body, 1.125rem); line-height: 1.6; color: var(--st-body); margin: 0 0 .8em; }
.ds-st-faq__a p:last-child { margin: 0; }

/* ---------- Abschluss-CTA ---------- */
.ds-st-cta {
    background: linear-gradient(140deg, var(--st-navy) 0%, var(--st-navy-900) 100%);
    color: #fff;
    padding-block: clamp(2.6rem, 5vw, 4rem);
}
.ds-st-cta__inner {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
    gap: clamp(1.4rem, 3vw, 2.6rem);
}
.ds-st .ds-st-cta h2 { color: #fff; margin-bottom: .4em; }
.ds-st-cta p { color: rgba(255, 255, 255, .84); max-width: 56ch; margin: 0; }

.ds-st-stand {
    max-width: var(--st-max);
    margin: 0 auto;
    padding: 1.6rem clamp(1.1rem, 4vw, 2.25rem) 2.4rem;
    font-size: .95rem;
    color: var(--st-muted);
}

/* ---------- Umbrüche ---------- */
@media (max-width: 1279px) {
    .ds-st { --st-header-h: 73px; }
}
@media (max-width: 767px) {
    .ds-st { --st-header-h: 65px; }
}
@media (min-width: 1280px) {
    .ds-st { --st-header-h: 85px; }
}

@media (max-width: 1080px) {
    .ds-st-karte__grid { grid-template-columns: minmax(0, 1fr); }
    .ds-st-karte__ul { max-height: 380px; }
}
@media (max-width: 900px) {
    .ds-st-hero__grid, .ds-st-split, .ds-st-split--wide { grid-template-columns: minmax(0, 1fr); }
    .ds-st-hero__side { order: 2; }
    .ds-st-map--mini .ds-st-map__svg { max-height: 300px; }
}
@media (max-width: 600px) {
    /* Fließtext bleibt bei 18px (Vorgabe), nur Abstände werden enger */
    .ds-st { --st-gap: 1.2rem; }
    .ds-st-actions .ds-st-btn { width: 100%; justify-content: center; }
    .ds-st-orte, .ds-st-nachbarn { grid-template-columns: minmax(0, 1fr); }
    .ds-st-karte__ul a { flex-direction: column; gap: .15rem; }
    .ds-st-karte__kreis { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
    .ds-st *, .ds-st *::before, .ds-st *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}

/* Fliesstext-Links auf den Standortseiten unterstreichen (27.08.2026).
   .ds-st-prose sind die drei redaktionell gepflegten Textbloecke je Standort
   (post_content, _ds_wohnen, _ds_ankauf), .ds-st-quelle die Quellenangabe
   "Quelle der Eckdaten: Wikipedia und Wikidata" - ein Link mitten im Satz auf
   allen 65 Seiten, bisher nur ueber ein gedaempftes Grau erkennbar.
   Nicht ueber die Whitelist in global-design.css: dort ist .ds-st als
   Widget-Wurzel ausgenommen, damit Kacheln und Kartenpins strichfrei bleiben. */
.ds-st-prose a[href]:not(.ds-btn):not([role="button"]),
.ds-st-quelle a[href] {
    text-decoration-line: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: .18em;
}

/* --- distler-standorte-row --- */
/* ==========================================================================
   Standortkarte in der globalen Row „Verkaufen Sie Ihre Immobilie an DISTLER"
   (BB-Template 892, rechte Spalte). Ersetzt die frühere statische Grafik.
   Heller Strich auf dunklem Grund, Punkte verlinken auf die Standortseiten.
   ========================================================================== */

.ds-demap {
    --dm-line:  rgba(255, 255, 255, .62);
    --dm-dot:   #ffffff;
    --dm-gold:  var(--ds-gold-soft, #CDAE78);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .9rem;
    width: 100%;
}

.ds-demap__svg {
    display: block;
    width: 100%;
    max-width: 460px;
    height: auto;
    max-height: min(66vh, 600px);
    overflow: visible;
}

/* Umrisse der Bundesländer: dünne, helle Linie ohne Füllung */
.ds-demap__land path {
    fill: none;
    stroke: var(--dm-line);
    stroke-width: 2.2;
    stroke-linejoin: round;
    stroke-linecap: round;
    vector-effect: non-scaling-stroke;
}

/* Ankaufsorte */
.ds-demap__pin { cursor: pointer; }
.ds-demap__hit { fill: transparent; }
.ds-demap__dot {
    fill: var(--dm-dot);
    stroke: var(--ds-navy, #2B435D);
    stroke-width: 3;
    transition: fill .2s ease;
}
.ds-demap__pin:hover .ds-demap__dot,
.ds-demap__pin:focus-visible .ds-demap__dot { fill: var(--dm-gold); }
.ds-demap__pin:focus-visible { outline: none; }
.ds-demap__pin:focus-visible .ds-demap__hit { fill: rgba(205, 174, 120, .3); }

/* Hinweiszeile unter der Karte */
.ds-demap__hinweis { margin: 0; text-align: center; }
/* Die globale Linkfarbe (Navy) muss hier weichen, sonst steht Navy auf Navy. */
html .ds-demap__hinweis a,
html .fl-builder-content .ds-demap__hinweis a {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    width: auto;
    max-width: 100%;
    font-size: 1.125rem;
    font-weight: 600;
    color: #fff !important;
    text-decoration: none;
    border-bottom: 1px solid rgba(255, 255, 255, .4);
    padding-bottom: 2px;
    transition: color .2s ease, border-color .2s ease;
}
html .ds-demap__hinweis a:hover,
html .ds-demap__hinweis a:focus-visible,
html .fl-builder-content .ds-demap__hinweis a:hover,
html .fl-builder-content .ds-demap__hinweis a:focus-visible {
    color: var(--dm-gold) !important;
    border-bottom-color: var(--dm-gold);
}
.ds-demap__hinweis svg { width: 17px; height: 17px; }

/* Die Karte ersetzt ein Foto-Modul: dessen Reste dürfen keinen Rahmen erzeugen */
.fl-node-5qy1vc2g6el9 .fl-module-content { margin: 0; }
.fl-node-5qy1vc2g6el9 .fl-photo,
.fl-node-5qy1vc2g6el9 .fl-photo-content { display: block; width: 100%; }

@media (max-width: 992px) {
    .ds-demap__svg { max-width: 340px; }
}
@media (max-width: 768px) {
    .ds-demap { margin-top: 1.6rem; }
    .ds-demap__svg { max-width: 290px; }
}

@media (prefers-reduced-motion: reduce) {
    .ds-demap * { transition-duration: .01ms !important; }
}

/* --- distler-typography --- */
/* ==========================================================================
   Site-weite Typografie: Fließtext nie kleiner als 18px (Vorgabe 2026-08-24).
   Referenz: USP-Box-Beschreibung (17,6px). Überschriften & Hauptmenü bleiben.
   ========================================================================== */

:root {
    --ds-fs-body:  1.125rem;  /* 18px, Untergrenze Fließtext */
    --ds-fs-label: 0.95rem;   /* ~15px, Eyebrows/Labels (Uppercase, Letterspacing) */
}

body { font-size: var(--ds-fs-body); }

/* Fließtext, Listen, Labels */
.fl-builder-content p,
.fl-builder-content li,
.fl-rich-text,
.fl-rich-text p,
.fl-rich-text li,
.pp-infobox-description,
.entry-content p,
.entry-content li,
label,
legend,
.wpforms-field-label,
.wpforms-field-sublabel,
.wpforms-form input:not([type="checkbox"]):not([type="radio"]),
.wpforms-form select,
.wpforms-form textarea,
.wpforms-required-label {
    font-size: var(--ds-fs-body);
}

/* Meta-/Kleintexte, die bisher 14px hatten */
.pp-content-grid-date,
.pp-post-date,
.rplg-review-text,
.rplg-review-name,
.rplg-url,
.wpforms-field-sublabel.after {
    font-size: var(--ds-fs-body) !important;
}

/* Buttons */
.fl-button-text,
.fl-button,
.wpforms-submit,
.ds-btn {
    font-size: var(--ds-fs-body);
}

/* Hero-Slider USP-Zeile */
.fl-node-wj56uic7fth1 .fl-slide-content li,
.fl-node-wj56uic7fth1 .ds-usps li {
    font-size: 1.0625rem; /* 17px */
}

/* Eyebrows / Labels (Uppercase) */
.ds-eyebrow,
.ds-ankauf__eyebrow,
.ds-partner__eyebrow {
    font-size: var(--ds-fs-label);
}
.ds-pcard__tag { font-size: var(--ds-fs-body); }

/* ---- Spezifische Überschreibungen (fremde Stylesheets/Inline-Styles) ---- */
.fl-node-wj56uic7fth1 .ds-eyebrow,
.fl-builder-content .ds-partner__eyebrow { font-size: var(--ds-fs-label) !important; }

.fl-builder-content .ds-btn,
.fl-builder-content .fl-button-text,
.fl-builder-content .fl-button { font-size: var(--ds-fs-body) !important; }

body .wpforms-form .wpforms-field-label,
body .wpforms-form legend.wpforms-field-label,
body .wpforms-form .wpforms-required-label,
body .wpforms-form .wpforms-field-sublabel,
body .wpforms-form input:not([type="checkbox"]):not([type="radio"]),
body .wpforms-form select,
body .wpforms-form textarea,
body .wpforms-form button.wpforms-submit { font-size: var(--ds-fs-body) !important; }

/* Google-Review-Widget (rplg) setzt Inline-Styles */
.rplg .rplg-review-text,
.rplg .rplg-review-name,
.rplg .rplg-url,
.rplg-review-text,
.rplg-review-name { font-size: var(--ds-fs-body) !important; line-height: 1.55 !important; }

.distler-ki-notice__title { font-size: var(--ds-fs-label); }

/* --- distler-responsive --- */
/* ==========================================================================
   Responsive-Feinschliff Smartphone/Tablet (Audit 2026-08-25)
   Wird nach allen anderen Child-Theme-Styles geladen (functions.php, Prio 40).
   Breakpoints: 1200 (BB „Large“/Burger-Menü), 992 (BB „Medium“), 768 (BB „Responsive“,
   iPad hochkant), 620/480 (Phones). Regeln, die fremde Stylesheets überschreiben,
   die NACH dieser Datei geladen werden (ImmoMakler, SauriaCore-Reviews), sind mit
   „html“ vorangestellt, damit die Spezifität und nicht die Reihenfolge entscheidet.
   ========================================================================== */

/* ---------- 1. Sicherheitsnetz gegen horizontalen Überlauf ----------
   Einzelne Module (PowerPack-Infolist mit langen Titeln, Logo-Karussell) haben den
   Layout-Viewport auf Phones verbreitert (360px → 380px, Suche 390px → 469px).
   overflow-x: clip erzeugt keinen Scroll-Container (sticky/fixed bleiben intakt). */
@media (max-width: 1200px) {
    html,
    body { overflow-x: clip; }
    .fl-builder-content img,
    .entry-content img { max-width: 100%; height: auto; }
}

/* Lange Wörter in Überschriften: Silbentrennung (lang="de") statt harter Umbrüche
   wie „Kaufentscheidunge / n“ oder „Immobilienang / ebot“. Nur Wörter ab 10 Zeichen,
   mindestens 4 Zeichen vor/nach dem Trennstrich. Header-Menü bleibt ohne Trennung. */
@media (max-width: 1200px) {
    h1, h2, h3, h4,
    .fl-heading-text, .pp-heading-text, .pp-infobox-title, .pp-infolist-title-text,
    .fl-callout-title, .pp-content-grid-post-title, .fl-post-title, .property-title, .entry-title,
    .ds-bcard__title, .ds-pcard h3, .ds-about__title, .ds-kp h2, .ds-kp h3 {
        -webkit-hyphens: auto;
        hyphens: auto;
        -webkit-hyphenate-limit-chars: 10 4 4;
        hyphenate-limit-chars: 10 4 4;
        /* Safari/WebKit kennt hyphenate-limit-chars nicht (geprueft 31.08.2026:
           CSS.supports meldet false) und trennte deshalb ungebremst, etwa
           "Immobilienmak-ler" und "se-rioesen" in der H1 von /maklerkooperation/.
           Diese drei Eigenschaften versteht WebKit und haelt damit dieselben
           Grenzen ein wie Chromium. */
        -webkit-hyphenate-limit-before: 4;
        -webkit-hyphenate-limit-after: 4;
        -webkit-hyphenate-limit-lines: 2;
    }
    .dh-header * { -webkit-hyphens: manual; hyphens: manual; }
}

/* PowerPack-Infolist (7-Schritte-Plan auf Immobilienankauf/Suche): Inhalt darf die
   Seite nicht verbreitern; Titel notfalls an beliebiger Stelle umbrechen. */
html .pp-infolist .pp-list-item-content,
html .pp-infolist .pp-heading-wrapper,
html .pp-infolist .pp-infolist-title,
html .pp-infolist .pp-infolist-description { min-width: 0; max-width: 100%; }
html .pp-infolist .pp-infolist-title-text,
html .pp-infolist .pp-infolist-description { overflow-wrap: anywhere; }

/* ---------- 2. Hintergrund-Video-Rows ----------
   Beaver Builder schaltet Row-Videos mit „Auf Mobilgeräten deaktivieren“ per User-Agent
   ab und hängt ein <video src=""> ein; die Row blieb als leere 320px-Fläche mit
   Play-Icon stehen (Startseite, Row p84eih5wxskb ohne Module). */
.fl-row-bg-video:has(> .fl-row-content-wrap > .fl-bg-video > video[src=""]):not(:has(.fl-module)) { display: none; }
.fl-bg-video:has(> video[src=""]) .fl-bg-video-play-pause { display: none; }

/* ---------- 3. Tablet quer (993 bis 1200px) ----------
   BB liefert hier noch das Desktop-Layout: 4er-USP-Raster (Maklerkooperation) und der
   7-spaltige „7-Schritte-Plan“ (Mehrfamilienhäuser) zerreißen Wörter. */
@media (min-width: 993px) and (max-width: 1200px) {
    /* USP-Raster „Schnelle und verbindliche Kaufentscheidungen“ (Startseite + Maklerkooperation): 2 × 2 */
    .fl-builder-content .fl-node-73xbwfkgcym2,
    .fl-builder-content .fl-node-moxkyr3ub0h4 { display: flex; flex-wrap: wrap; }
    .fl-builder-content .fl-node-73xbwfkgcym2 > .fl-col,
    .fl-builder-content .fl-node-moxkyr3ub0h4 > .fl-col { width: 50% !important; }
    /* 7-Schritte-Plan: Mobilvariante der Seite statt 7 schmaler Spalten */
    .fl-builder-content .fl-row[id="ablauf-groß"] { display: none !important; }
    .fl-builder-content .fl-row[id="ablauf-mobil"] { display: block !important; }
}

/* ---------- 4. Tap-Ziele (Touch-Geräte, ≤1200px): mindestens 44px ---------- */
@media (max-width: 1200px) {
    /* Hero-Pager (bxSlider): der Punkt wird per ::after gezeichnet, die Klickfläche wächst auf 34px */
    .fl-builder-content .fl-node-wj56uic7fth1 .bx-wrapper .bx-pager { padding-left: 0; }
    .fl-builder-content .fl-node-wj56uic7fth1 .bx-wrapper .bx-pager.bx-default-pager a.bx-pager-link {
        width: 34px !important;
        height: 34px !important;
        margin: 0 !important;
    }
    /* Owl-Carousel-Punkte (Blog-Karussell) */
    .pp-content-post-carousel .owl-theme .owl-dots .owl-dot { padding: 12px 3px; min-width: 30px; min-height: 44px; } /* 10 Punkte müssen in 328px passen */
    /* Ankaufsprofil-Karten: Linkzeile */
    .ds-bcard__link { min-height: 44px; padding: .35rem 0; }
    /* Blog-Grid: Kategorie-Links und Weiterlesen-Pfeil */
    .pp-content-grid-post-meta a { display: inline-block; padding: .3rem 0; }
    .pp-content-grid-post-more-link a { display: inline-flex; align-items: center; min-height: 44px; }
    /* Footer-Links (Themer-Footer 252) */
    footer.fl-builder-content[data-type="footer"] .ds-footer__list a,
    footer.fl-builder-content[data-type="footer"] .fl-node-m4anj0d6pfvu p > a,
    footer.fl-builder-content[data-type="footer"] .fl-node-pdylgbit9rnh p > a,
    footer.fl-builder-content[data-type="footer"] .fl-node-5rilgt8adfe7 p > a,
    footer.fl-builder-content[data-type="footer"] .fl-node-4q60wtl3o97d p > a,
    footer.fl-builder-content[data-type="footer"] .fl-node-qdzwlf9k7goe p > a { padding: .45rem 0; }
    footer.fl-builder-content[data-type="footer"] .ds-footer__cta { display: inline-flex; align-items: center; min-height: 44px; }
    footer.fl-builder-content[data-type="footer"] .ds-footer__legal a { display: inline-block; padding: .5rem 0; }
    /* Bewertungen (SauriaCore, CSS lädt im Footer → „html“-Präfix) */
    html .sauria-reviews .sauria-review-card__expand,
    html .sauria-reviews--premium .sauria-review-card__expand { min-height: 44px !important; padding: .6rem 0 !important; margin: 0 !important; }
    html .sauria-reviews-section__cta-link { min-height: 44px; padding: .5rem 0; }
}

/* ---------- 5. Schriftgrößen: keine Kleintexte auf Phones ----------
   Vorgabe: Fließtext ≥18px, Labels/Eyebrows ~15px (typography.css). */
/* Google-Bewertungen (SauriaCore Premium-Design) */
html .sauria-reviews--premium .sauria-review-card__text { font-size: var(--ds-fs-body, 1.125rem); }
html .sauria-reviews--premium .sauria-review-card__name { font-size: 1rem; }
html .sauria-reviews--premium .sauria-review-card__role { font-size: .9375rem; }
html .sauria-reviews--premium .sauria-review-card__avatar { font-size: 1rem; }
html .sauria-reviews .sauria-review-card__expand,
html .sauria-reviews--premium .sauria-review-card__expand { font-size: 1rem !important; }
html .sauria-reviews-section__eyebrow { font-size: var(--ds-fs-label, .95rem); }
html .sauria-reviews-section--premium .sauria-reviews-summary__count { font-size: 1rem; }
html .sauria-reviews-section__cta-link { font-size: 1rem; }
html .sauria-reviews__more { font-size: 1rem !important; }
html .sauria-reviews-section__note { font-size: .95rem; }
/* Autorzeile: das Plugin setzt white-space:nowrap; mit 15/16px Meta-Schrift wurde die
   Mindestbreite der Karte (316px) größer als die Spalte (Phone 360px, iPad 768px) und schob
   das Grid über den Viewport. Karte darf schrumpfen, Name/Rolle umbrechen. */
html .sauria-reviews--premium .sauria-review-card { min-width: 0; }
html .sauria-reviews--premium .sauria-review-card__author { white-space: normal; overflow: visible; text-overflow: clip; }
html .sauria-reviews--premium .sauria-review-card__meta { flex: 1 1 0; min-width: 0; }
html .sauria-reviews--premium .sauria-review-card__name,
html .sauria-reviews--premium .sauria-review-card__role { white-space: normal; overflow-wrap: anywhere; }
/* Blog-Grid-Meta (Datum, Kategorien); BB-Node-Regeln (.fl-node-… .pp-content-grid-post-meta) setzen 12px */
html .fl-builder-content .pp-content-grid-post-meta,
html .fl-builder-content .pp-content-grid-post-meta a { font-size: .95rem !important; }
/* KI-Transparenzhinweis (Footer-Block): wie der benachbarte Bewertungs-Hinweis 18px */
.distler-ki-notice__inner,
footer.fl-builder-content[data-type="footer"] .distler-ki-notice__inner { font-size: var(--ds-fs-body, 1.125rem); }

/* ---------- 6. ImmoMakler (Objektseiten, Listen, Suche; Bootstrap 3) ----------
   Buttons: Navy-Text auf Navy war unlesbar („Direktanfrage“, „zum Kontaktformular“,
   Telefon-Vorwahl weiß auf weiß). Aktionsleiste lag als Float über der Galerie.
   Felder: 34px/14px → 44px/16px (16px verhindert den iOS-Zoom beim Fokussieren). */
html .immomakler .btn,
html .immomakler-search .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35em;
    min-height: 44px;
    padding: .5rem 1rem;
    border-radius: 0 !important;
    font-family: var(--ds-sans, system-ui, sans-serif);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: normal;
    text-decoration: none !important;
}
html .immomakler .btn-primary,
html .immomakler a.btn-primary,
html .immomakler .btn-primary:visited,
html .immomakler-search .btn-primary {
    background-color: var(--ds-navy, #2B435D) !important;
    border-color: var(--ds-navy, #2B435D) !important;
    color: #fff !important;
}
html .immomakler .btn-primary:hover,
html .immomakler .btn-primary:focus,
html .immomakler-search .btn-primary:hover { background-color: var(--ds-navy-700, #223750) !important; border-color: var(--ds-navy-700, #223750) !important; color: #fff !important; }
html .immomakler .btn-default,
html .immomakler a.btn-default,
html .immomakler-search .btn-default {
    background-color: #fff !important;
    border-color: var(--ds-line-2, rgba(43, 67, 93, .2)) !important;
    color: var(--ds-navy, #2B435D) !important;
}
html .immomakler .btn-default:hover,
html .immomakler .btn-default:focus,
html .immomakler-search .btn-default:hover { background-color: var(--ds-navy-tint, #EAEEF3) !important; color: var(--ds-navy, #2B435D) !important; }
html .immomakler .btn-block { display: flex; width: 100%; }
html .immomakler .property-actions.btn-group {
    float: none;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 0 0 1rem;
}
html .immomakler .property-actions.btn-group > .btn,
html .immomakler .property-actions.btn-group > .btn + .btn { margin: 0 !important; border-radius: 0 !important; }
html .immomakler .form-control,
html .immomakler input.form-control,
html .immomakler select.form-control,
html .immomakler textarea.form-control,
html .immomakler .bootstrap-select > .btn,
html .immomakler-search .form-control,
html .immomakler-search .bootstrap-select > .btn {
    height: auto;
    min-height: 44px;
    font-size: 1rem;
    border-radius: var(--ds-r-input, 10px);
}
html .immomakler textarea.form-control { min-height: 120px; }
html .immomakler .input-group .form-control { border-radius: var(--ds-r-input, 10px) 0 0 var(--ds-r-input, 10px); }
html .immomakler .input-group-btn .btn { min-height: 44px; border-radius: 0 var(--ds-r-input, 10px) var(--ds-r-input, 10px) 0 !important; }
/* Vorwahl-Button neben dem Telefonfeld */
html .immomakler .btn.form-control { min-height: 44px; color: var(--ds-navy, #2B435D) !important; background-color: #fff !important; }
/* Tabellen/Kleintexte */
html .immomakler .immomakler-project-units th,
html .immomakler .immomakler-project-units td,
html .immomakler .immomakler-project-units-th-label-end,
html .immomakler .mandatory,
html .immomakler .send-over-https { font-size: .95rem; }
@media (max-width: 767px) {
    html .immomakler .property-actions.btn-group > .btn { flex: 1 1 calc(50% - .25rem); }
}

/* ---------- 7. Themer-Layouts ---------- */
/* Objektseite (Layout 7258): Titelzeile „Immobilienangebot“ (Rich-Text, 46px) brach als
   „Immobilienang / ebot“; auf Phones kleiner und mit Silbentrennung. */
.fl-builder-content-7258 .fl-node-jykxzildqrph p { -webkit-hyphens: auto; hyphens: auto; }
@media (max-width: 480px) {
    .fl-builder-content-7258 .fl-node-jykxzildqrph p { font-size: clamp(1.9rem, 8.5vw, 2.88rem) !important; line-height: 1.1; }
}
/* Suche/404/Blogkategorie: schräg beschnittene Beitragskarten (clip-path) schneiden auf
   schmalen Viewports Text ab → unter 992px normale Karten. */
@media (max-width: 992px) {
    .fl-builder-content .pp-content-post.pp-grid-custom { clip-path: none !important; }
}

/* ==========================================================================
   Kontrast- und Touch-Nachträge (Audit auf dem Coolify-Server, 2026-08-25)
   Gemessen mit contrast.js (Textfarbe gegen den tatsächlich gerenderten
   Hintergrund, WCAG 2.1: 4,5:1 Fließtext / 3:1 große Schrift).
   ========================================================================== */

/* ---------- 1. Suchergebnisseite (Beaver-Themer-Layout 429) ----------
   Die Row `e41chpnk5doj` wurde beim Palette-Wechsel auf Navy umgefärbt, die
   Textfarben blieben dunkel: Überschriften #25303B auf #2B435D = 1,3:1,
   Fließtext #4A5560 = 1,3:1 (praktisch unlesbar). Gilt für jede Suchanfrage. */
html .fl-node-e41chpnk5doj .fl-heading,
html .fl-node-e41chpnk5doj .fl-heading-text,
html .fl-node-e41chpnk5doj .pp-infolist-title-text,
html .fl-node-e41chpnk5doj h1,
html .fl-node-e41chpnk5doj h2,
html .fl-node-e41chpnk5doj h3,
html .fl-node-e41chpnk5doj h4 {
    color: #ffffff !important;
}
html .fl-node-e41chpnk5doj p,
html .fl-node-e41chpnk5doj li,
html .fl-node-e41chpnk5doj .fl-rich-text,
html .fl-node-e41chpnk5doj .fl-rich-text p,
html .fl-node-e41chpnk5doj .pp-infolist-description,
html .fl-node-e41chpnk5doj .pp-infolist-description p {
    color: rgba(255, 255, 255, 0.88) !important;
}
html .fl-node-e41chpnk5doj .pp-infolist-icon i,
html .fl-node-e41chpnk5doj .fl-icon i,
html .fl-node-e41chpnk5doj .pp-icon i {
    color: var(--ds-gold-soft, #CDAE78) !important;
}
/* Links in dieser Row: Gold-Soft (4,8:1 auf Navy) statt Navy auf Navy */
html .fl-node-e41chpnk5doj a:not(.fl-button):not(.pp-button):not(.ds-btn) {
    color: var(--ds-gold-soft, #CDAE78) !important;
}

/* ---------- 2. Rich-Text-Links auf dunklen Flächen ----------
   Das Customizer-CSS setzt `.fl-module-rich-text a { color:#09426c !important }`
   (Markenblau von vor dem Relaunch). Auf Navy-Flächen ergibt das 1,03:1.
   Beaver Builder nimmt Links von seiner Weißtext-Regel aus (`:not(a)`), deshalb
   fällt es nur bei Links auf. Betroffene Module hier ergänzen (gefunden per
   contrast.js: /eigentumswohnungen/ → Modul uc3k4nq95exs). */
/* Generisch: Hero-Rows (Foto + Overlay) haben weißen Text, Links dort Gold-Soft.
   Zusätzlich /hauser/ Hero-Textmodul b3zi8rymvohl (25.08.2026). */
html .fl-row-bg-photo.fl-row-bg-overlay .fl-rich-text a,
html .fl-node-b3zi8rymvohl .fl-rich-text a,
html .fl-node-uc3k4nq95exs .fl-rich-text a,
html .fl-node-uc3k4nq95exs a {
    color: var(--ds-gold-soft, #CDAE78) !important;
    text-decoration-color: rgba(205, 174, 120, 0.6);
}
html .fl-row-bg-photo.fl-row-bg-overlay .fl-rich-text a:hover,
html .fl-row-bg-photo.fl-row-bg-overlay .fl-rich-text a:focus-visible,
html .fl-node-b3zi8rymvohl .fl-rich-text a:hover,
html .fl-node-b3zi8rymvohl .fl-rich-text a:focus-visible,
html .fl-node-uc3k4nq95exs a:hover,
html .fl-node-uc3k4nq95exs a:focus-visible {
    color: #ffffff !important;
}

/* ---------- 3. Rechtsseiten: Eyebrow „Rechtliches" ----------
   #A07F48 auf #F6F5F2 = 3,42:1 bei 12,5px (zu blass und unter der 15px-Vorgabe). */
html .distler-legal .distler-legal__eyebrow {
    color: var(--ds-gold-text, #7D5F2A);
    font-size: var(--ds-fs-label, .95rem);
}

/* ---------- 4. PowerPack-Vergleichstabellen (Blog-Ratgeber) ----------
   Spaltenköpfe waren #888888 bei 11,7px = 3,25:1 → 15px und Palette-Farben.
   Achtung: Dieselbe Klasse tritt in ZWEI Kontexten auf — im `<thead>` sitzen die
   Zellen auf Navy (dort muss der Text weiß sein), in der gestapelten Zeilenansicht
   (`.pp-table-row`, ab ~740px Umbruch) auf Weiß bzw. #F6F5F2. Eine pauschale
   Farbregel macht daher einen der beiden Fälle unlesbar. */
html .pp-table-header-text,
html .pp-table-header-inner,
html .pp-table-cell-label {
    font-size: .95rem !important;
}
/* Kopfzeile auf Navy → Weiß (10,2:1) */
html .pp-table-content thead th .pp-table-header-text,
html .pp-table-content thead th .pp-table-header-inner,
html .pp-table-content thead th {
    color: #ffffff !important;
}
/* Zeilen-Labels auf heller Fläche → Textfarbe (6,9 bis 7,4:1) */
html .pp-table-content .pp-table-row .pp-table-header-text,
html .pp-table-content .pp-table-row .pp-table-header-inner,
html .pp-table-content .pp-table-row .pp-table-cell-label {
    color: var(--ds-text-body, #4A5560) !important;
}

/* ---------- 5. Datenschutz-Checkbox: Touch-Ziel ----------
   WPForms rendert 16×16px (Variable `--wpforms-field-size-checkbox-size`, im
   Inline-Block je Formular gesetzt). Das zugehörige Label ist zwar mit `for`
   verknüpft und damit ein großes Ziel, die Box selbst blieb aber unter den
   24px aus WCAG 2.2 (2.5.8). Die Variable ist der einzige Hebel, der auch die
   Breite trifft — eine eigene `width`-Regel überschreibt WPForms nicht. */
html .wpforms-container,
html .wpforms-container-full,
html .wpforms-form {
    --wpforms-field-size-checkbox-size: 24px;
}
html .wpforms-form .wpforms-field-gdpr-checkbox input[type="checkbox"],
html .wpforms-form .wpforms-field-checkbox input[type="checkbox"] {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    margin-top: 1px;
}

/* ---------- 6. Kontakt-Row: E-Mail-/Telefonzeile als Tap-Ziel ---------- */
@media (max-width: 1200px) {
    html .fl-builder-content #fl-icon-text-azt1qch9nlb6 > a,
    html .fl-builder-content #fl-icon-text-ye9ln02kmiuw > a {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
    }
}

/* Mobile-Korrektur 31.08.2026: Die Einheiten-Tabelle des ImmoMakler-Plugins ist
   bis zu 411px breit und wurde auf allen Breiten bis 430px abgeschnitten
   (3 Objektseiten). Sie wird jetzt horizontal scrollbar. */
.immomakler-project-units-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ============================================================
   Mobile-Korrektur 31.08.2026: Seitliche Row-Polsterung auf Handys deckeln.

   Beaver Builder liefert die Abstaende in em; inc/bb-native.php reicht sie als
   Inline-Variablen an die Row weiter, assets/bb-native.css gibt sie im
   768er-Breakpoint unveraendert durch. Vier Rows stehen auf 5em, das sind bei
   18px Row-Schrift genau 90px je Seite:
     #ablauf-mobil     auf /mehrfamilienhauser/ und /haus-verkaufen/
     #kaufpreisangebot auf /maklerkooperation/
     #kaufangebot-2    auf /ohne-makler-verkaufen/
   Bei 320px blieben davon 127px Textbreite uebrig, die Ueberschriften zerfielen
   in Buchstabengruppen ("Absc / hlus / s").

   Gemessene Wirkung (Chromium und WebKit identisch):
     /mehrfamilienhauser/ 320px: Text 127 -> 269px, Row-Hoehe 3795 -> 2352px
     /mehrfamilienhauser/ 390px: Text 194 -> 328px, Row-Hoehe 3185 -> 2137px
     /maklerkooperation/  320px: Text 140 -> 282px

   min() laesst kleinere, gewollte Abstaende unveraendert, es deckelt nur nach oben.
   ============================================================ */
@media (max-width: 768px) {
    html .bbn-row {
        padding-left:  min(var(--p-left-s,  var(--p-left-m,  var(--p-left-l,  var(--p-left,  0)))), 6vw);
        padding-right: min(var(--p-right-s, var(--p-right-m, var(--p-right-l, var(--p-right, 0)))), 6vw);
    }
}

/* --- distler-footer-native --- */
/* Nativer Footer (template-parts/footer-native.php), Design wie footer.css (Themer-Variante). */
.dsf { --dsf-fg: rgba(255,255,255,.76); --dsf-muted: rgba(255,255,255,.58); --dsf-line: rgba(255,255,255,.12); --dsf-pad: clamp(1rem, 3vw, 2rem);
    background: var(--ds-navy-800, #1A2C40); color: var(--dsf-fg); font-family: var(--ds-sans); font-size: var(--ds-fs-body, 1.125rem); line-height: 1.55; -webkit-font-smoothing: antialiased; }
.dsf *, .dsf *::before, .dsf *::after { box-sizing: border-box; }
.dsf__wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding-left: var(--dsf-pad); padding-right: var(--dsf-pad); }
.dsf a { color: var(--dsf-fg); text-decoration: none; transition: color var(--ds-dur, .28s) var(--ds-ease, ease); }
.dsf a:hover, .dsf a:focus-visible { color: var(--ds-gold-soft, #CDAE78); }
.dsf a:focus-visible { outline: 2px solid var(--ds-gold-soft); outline-offset: 3px; border-radius: 3px; }
.dsf p { margin: 0 0 1em; color: var(--dsf-fg); }
.dsf p:last-child { margin-bottom: 0; }
.dsf__top { display: grid; grid-template-columns: 1fr; gap: 2.5rem; padding-top: clamp(4rem, 7vw, 6.5rem); padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.dsf__top::after { content: ""; grid-column: 1 / -1; height: 1px; background: var(--dsf-line); }
.dsf__logo { display: inline-block; line-height: 0; margin-bottom: 1.6rem; }
.dsf__logo img { display: block; height: 46px; width: auto; max-width: 100%; }
.dsf__contact { font-style: normal; margin: 0; }
.dsf__item { display: flex; align-items: flex-start; gap: .8rem; margin: 0 0 .9rem; }
.dsf__item svg { flex: 0 0 20px; margin-top: .3em; color: var(--ds-gold-soft); }
.dsf__cta { display: inline-flex; align-items: center; gap: .5em; margin-top: 1.4rem; color: var(--ds-gold-soft) !important; font-weight: 600; }
.dsf__cta::after { content: ""; width: 1em; height: 1em; background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='12 5 19 12 12 19'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='12 5 19 12 12 19'/%3E%3C/svg%3E") center / contain no-repeat; transition: transform .28s ease; }
.dsf__cta:hover { color: #fff !important; } .dsf__cta:hover::after { transform: translateX(4px); }
.dsf__title, .dsf .distler-ki-notice__title { hyphens: none; font-family: var(--ds-sans) !important; font-size: var(--ds-fs-label, .95rem) !important; font-weight: 700 !important; letter-spacing: .06em; text-transform: uppercase; color: #fff !important; line-height: 1.3; margin: 0 0 1.1rem; }
.dsf-list { list-style: none; margin: 0; padding: 0; }
.dsf-list li { margin: 0; padding: 0; break-inside: avoid; }
.dsf-list a { display: inline-block; padding: .28rem 0; }
.dsf__col--links .dsf-list { columns: 2; column-gap: 1.75rem; }
.dsf__col--two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: start; }
.dsf__ki, .dsf .distler-ki-notice { padding: 2rem var(--dsf-pad) 0 !important; background: transparent !important; border: 0 !important; box-shadow: none; }
.dsf .distler-ki-notice__inner { max-width: none; }
.dsf__ki p, .dsf .distler-ki-notice p { color: var(--dsf-muted) !important; max-width: none; margin: 0 0 .6rem;
    text-align: left; font-size: 1rem; line-height: 1.55; }
.dsf__ki .distler-ki-notice__link { color: var(--ds-gold-soft); }
.dsf__ki:target, .dsf .distler-ki-notice.is-highlight { box-shadow: inset 0 0 0 2px var(--ds-gold-soft); }
.dsf__reviews { padding: 1.6rem var(--dsf-pad) 2.2rem; }
.dsf__reviews p { color: var(--dsf-muted); max-width: none; font-size: 1rem; line-height: 1.55; }
.dsf__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: .8rem 2rem; padding-top: 1.6rem; padding-bottom: 1.6rem; position: relative; }
.dsf__copy, .dsf__legal { font-size: .95rem; }
.dsf__copy { margin: 0; }
/* Ab Tablet quer bleiben Copyright und Rechtslinks auf einer Zeile. */
@media (min-width: 992px) {
    .dsf__bottom { flex-wrap: nowrap; gap: 1.5rem 2.5rem; }
    .dsf__copy { flex: 0 1 auto; }
    .dsf__legal { flex: 0 0 auto; flex-wrap: nowrap; white-space: nowrap; }
}
.dsf__bottom::before { content: ""; position: absolute; left: var(--dsf-pad); right: var(--dsf-pad); top: 0; height: 1px; background: var(--dsf-line); }
.dsf__legal { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .3rem 1.6rem; }
@media (max-width: 768px) { .dsf__legal { justify-content: flex-start; } }
.dsf__legal a { padding: .2rem 0; }
.dsf__sticky { display: none; }
@media (max-width: 768px) {
    /* Platz fuer den fixierten Kontakt-Button, damit er am Seitenende
       keinen Inhalt dauerhaft verdeckt. */
    .dsf__bottom { padding-bottom: calc(5rem + env(safe-area-inset-bottom, 0px)); }
    .dsf__sticky { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; padding: 0 1rem calc(1rem + env(safe-area-inset-bottom, 0px)); text-align: center; pointer-events: none;
        transition: opacity .28s ease, transform .28s ease; }
    .dsf__sticky.is-hidden { opacity: 0; transform: translateY(115%); }
    .dsf__sticky-btn { display: inline-flex; align-items: center; justify-content: center; gap: .55em; width: 100%; max-width: 420px; padding: 1em 1.8em; background: var(--ds-gold, #B69256); color: var(--ds-navy-800, #1A2C40) !important; font-weight: 600; line-height: 1.2; box-shadow: 0 12px 32px -10px rgba(0,0,0,.55); pointer-events: auto; }
    .dsf__sticky-btn::after { content: ""; width: 1.05em; height: 1.05em; background: currentColor;
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='12 5 19 12 12 19'/%3E%3C/svg%3E") center / contain no-repeat;
                mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='12 5 19 12 12 19'/%3E%3C/svg%3E") center / contain no-repeat; }
}
@media (min-width: 769px) { .dsf__top { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dsf__col--two { grid-column: 1 / -1; } }
@media (min-width: 1025px) { .dsf__top { grid-template-columns: minmax(0, 1.25fr) minmax(0, 2.35fr) minmax(0, 2.3fr); gap: 2.5rem; } .dsf__col--two { grid-column: auto; gap: 2rem; } .dsf__title { white-space: nowrap; } }

/* ============================================================
   Mobile-Korrektur 31.08.2026: Footer-Spalten liefen aus dem Bild.

   Gemessen auf 62 von 67 Seiten: die drei Spalten .dsf__col--brand,
   --links und --two waren bei 320px und bei 360px Viewportbreite jeweils
   346,2px breit und ragten damit um 42,2px bzw. 2,2px nach rechts heraus.
   Sie schrumpften nicht mit, weil Grid-Spuren standardmaessig
   min-width:auto haben und die zweispaltige Linkliste eine
   min-content-Breite von 346,2px erzwingt (2 x 178,1px fuer den
   laengsten Eintrag "Eigentumswohnungen" plus 1,75rem Spaltenabstand).

   Nur min-width:0 zu setzen reicht nicht: dann quetscht die Liste ihre
   Eintraege und schneidet bei 320px drei davon ab (gemessen).
   Deshalb bekommt die Liste eine Mindestspaltenbreite; unterhalb davon
   bricht sie von selbst auf eine Spalte um. Ab 430px bleibt alles
   unveraendert zweispaltig.
   ============================================================ */
.dsf__col { min-width: 0; }
.dsf__col--links .dsf-list { columns: 178px 2; }
.dsf-list li { min-width: 0; }

/* Nachbesserung 31.08.2026 zum Fix darueber.

   Nachdem die Spalten korrekt schrumpfen (vorher waren sie 346px breit und ragten
   aus dem Bild), passte "Immobilienankauf" nicht mehr in eine Zeile. Da .dsf__title
   auf hyphens:none und overflow-wrap:break-word stand, brach das Wort ohne
   Trennstrich mitten durch: "Immobilienankau / f" bei 390px, "Immobilienanka / uf"
   bei 360px. Statt eines harten Bruchs jetzt eine ordentliche Silbentrennung, mit
   den WebKit-Eigenschaften, damit Safari dieselben Grenzen einhaelt.

   Ausserdem: die zweispaltige Rubrikspalte liess bei 320px "Eigentumswohnungen"
   (178px breit) in die Nachbarspalte (144px) ragen, wodurch der Link "Wohnungen"
   um 22 x 37px verdeckt und nicht antippbar war. Unter 430px daher einspaltig. */
.dsf__title {
	overflow-wrap: normal;
	word-break: normal;
	-webkit-hyphens: auto;
	hyphens: auto;
	-webkit-hyphenate-limit-before: 4;
	-webkit-hyphenate-limit-after: 4;
	hyphenate-limit-chars: 8 4 4;
}
@media (max-width: 429px) {
	.dsf__col--two { grid-template-columns: minmax(0, 1fr); }
}

/* --- distler-material-icons --- */
/* Material Icons, auf die 47 tatsaechlich verwendeten Symbole reduziert (25.08.2026).
   Original: 4 Stylesheets (17,9 KB) + 3 Fonts (455 KB) fuer 2235 Icons.
   Die Ligatur-Schreibweise (content:"check") ist durch den Codepoint ersetzt,
   dadurch braucht der Font keine Buchstaben-Glyphen und keine GSUB-Tabellen mehr.
   Neu erzeugen mit tools/material-icons-subset (siehe MU-Plugin distler-seo-perf.php). */
@font-face{font-family:'Material Icons';font-style:normal;font-weight:400;font-display:swap;src:url(/wp-content/uploads/distler-fonts/material-regular-subset.woff2) format("woff2")}
.material-icons{font-family:'Material Icons' !important;display:inline-block;font-weight:normal;font-style:normal;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}
@font-face{font-family:'Material Icons Outlined';font-style:normal;font-weight:400;font-display:swap;src:url(/wp-content/uploads/distler-fonts/material-outline-subset.woff2) format("woff2")}
.material-icons-outlined{font-family:'Material Icons Outlined' !important;display:inline-block;font-weight:normal;font-style:normal;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}
@font-face{font-family:'Material Icons Round';font-style:normal;font-weight:400;font-display:swap;src:url(/wp-content/uploads/distler-fonts/material-round-subset.woff2) format("woff2")}
.material-icons-round{font-family:'Material Icons Round' !important;display:inline-block;font-weight:normal;font-style:normal;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}
.md-access_time:before{content:"\e192"}
.md-account_circle:before{content:"\e853"}
.md-add:before{content:"\e145"}
.md-add_moderator:before{content:"\e97d"}
.md-arrow_circle_up:before{content:"\f182"}
.md-arrow_forward_ios:before{content:"\e5e1"}
.md-bed:before{content:"\efdf"}
.md-calendar_month:before{content:"\ebcc"}
.md-chat_bubble_outline:before{content:"\e0cb"}
.md-check:before{content:"\e5ca"}
.md-check_circle_outline:before{content:"\e92d"}
.md-class:before{content:"\e86e"}
.md-construction:before{content:"\ea3c"}
.md-content_copy:before{content:"\e14d"}
.md-cottage:before{content:"\e587"}
.md-directions_bus:before{content:"\e530"}
.md-edit_document:before{content:"\f88c"}
.md-emoji_nature:before{content:"\ea1c"}
.md-emoji_objects:before{content:"\ea24"}
.md-euro:before{content:"\ea15"}
.md-feed:before{content:"\f009"}
.md-filter_1:before{content:"\e3d0"}
.md-filter_2:before{content:"\e3d1"}
.md-filter_3:before{content:"\e3d2"}
.md-filter_4:before{content:"\e3d4"}
.md-filter_5:before{content:"\e3d5"}
.md-filter_6:before{content:"\e3d6"}
.md-filter_7:before{content:"\e3d7"}
.md-gpp_good:before{content:"\f013"}
.md-home_work:before{content:"\ea09"}
.md-horizontal_rule:before{content:"\f108"}
.md-key:before{content:"\e73c"}
.md-keyboard_arrow_down:before{content:"\e313"}
.md-lightbulb_outline:before{content:"\e90f"}
.md-local_parking:before{content:"\e54f"}
.md-location_pin:before{content:"\f1db"}
.md-monetization_on:before{content:"\e263"}
.md-other_houses:before{content:"\e58c"}
.md-people:before{content:"\e7fb"}
.md-people_alt:before{content:"\ea21"}
.md-person:before{content:"\e7fd"}
.md-person_add_disabled:before{content:"\e9cb"}
.md-task:before{content:"\f075"}
.md-text_snippet:before{content:"\f1c6"}
.md-thumb_down_alt:before{content:"\e816"}
.md-thumb_up_alt:before{content:"\e817"}
.md-trending_down:before{content:"\e8e3"}

/* --- distler-fa-lite --- */
/* FontAwesome 5 Free (Solid), reduziert auf die 7 site-weit verwendeten Symbole (25.08.2026).
   Ersetzt all.min.css (12,9 KB) + fa-solid-900.woff2 (78 KB) durch dieses CSS und ein
   0,7-KB-Subset. Struktur- und Utility-Klassen sind unveraendert aus all.min.css uebernommen,
   nur die @font-face-Quellen und die Icon-Liste sind ersetzt. Neu erzeugen: genutzte
   fa-Klassen einsammeln, Codepoints aus all.min.css lesen, pyftsubset --unicodes. */
@font-face{font-family:"Font Awesome 5 Free";font-style:normal;font-weight:900;font-display:swap;src:url(/wp-content/uploads/distler-fonts/fa-solid-900-subset.woff2) format("woff2")}
fontawesome - https://fontawesome.com
 * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
 */
.fa,.fab,.fad,.fal,.far,.fas{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}
.fa-lg{font-size:1.33333em;line-height:.75em;vertical-align:-.0667em}
.fa-xs{font-size:.75em}
.fa-sm{font-size:.875em}
.fa-1x{font-size:1em}
.fa-2x{font-size:2em}
.fa-3x{font-size:3em}
.fa-4x{font-size:4em}
.fa-5x{font-size:5em}
.fa-6x{font-size:6em}
.fa-7x{font-size:7em}
.fa-8x{font-size:8em}
.fa-9x{font-size:9em}
.fa-10x{font-size:10em}
.fa-fw{text-align:center;width:1.25em}
.fa-ul{list-style-type:none;margin-left:2.5em;padding-left:0}
.fa-ul>li{position:relative}
.fa-li{left:-2em;position:absolute;text-align:center;width:2em;line-height:inherit}
.fa-border{border:.08em solid #eee;border-radius:.1em;padding:.2em .25em .15em}
.fa-pull-left{float:left}
.fa-pull-right{float:right}
.fa.fa-pull-left,.fab.fa-pull-left,.fal.fa-pull-left,.far.fa-pull-left,.fas.fa-pull-left{margin-right:.3em}
.fa.fa-pull-right,.fab.fa-pull-right,.fal.fa-pull-right,.far.fa-pull-right,.fas.fa-pull-right{margin-left:.3em}
.fa-spin{-webkit-animation:fa-spin 2s linear infinite;animation:fa-spin 2s linear infinite}
.fa-pulse{-webkit-animation:fa-spin 1s steps(8) infinite;animation:fa-spin 1s steps(8) infinite}
0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}
to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}
0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}
to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}
.fa-rotate-90{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";-webkit-transform:rotate(90deg);transform:rotate(90deg)}
.fa-rotate-180{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";-webkit-transform:rotate(180deg);transform:rotate(180deg)}
.fa-rotate-270{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";-webkit-transform:rotate(270deg);transform:rotate(270deg)}
.fa-flip-horizontal{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";-webkit-transform:scaleX(-1);transform:scaleX(-1)}
.fa-flip-vertical{-webkit-transform:scaleY(-1);transform:scaleY(-1)}
.fa-flip-both,.fa-flip-horizontal.fa-flip-vertical,.fa-flip-vertical{-ms-filter:"progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)"}
.fa-flip-both,.fa-flip-horizontal.fa-flip-vertical{-webkit-transform:scale(-1);transform:scale(-1)}
:root .fa-flip-both,:root .fa-flip-horizontal,:root .fa-flip-vertical,:root .fa-rotate-90,:root .fa-rotate-180,:root .fa-rotate-270{-webkit-filter:none;filter:none}
.fa-stack{display:inline-block;height:2em;line-height:2em;position:relative;vertical-align:middle;width:2.5em}
.fa-stack-1x,.fa-stack-2x{left:0;position:absolute;text-align:center;width:100%}
.fa-stack-1x{line-height:inherit}
.fa-stack-2x{font-size:2em}
.fa-inverse{color:#fff}
.sr-only{border:0;clip:rect(0,0,0,0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}
.sr-only-focusable:active,.sr-only-focusable:focus{clip:auto;height:auto;margin:0;overflow:visible;position:static;width:auto}
.fab,.far{font-weight:400}
.fa,.far,.fas{font-family:"Font Awesome 5 Free" !important}
.fa,.fas{font-weight:900}
.fa-check:before{content:"\f00c"}
.fa-chevron-down:before{content:"\f078"}
.fa-chevron-up:before{content:"\f077"}
.fa-minus:before{content:"\f068"}
.fa-phone:before{content:"\f095"}
.fa-play:before{content:"\f04b"}
.fa-plus:before{content:"\f067"}