/**
 * Webkoo X-Connect — Designs der Objektdarstellung (v4.9.0)
 *
 * Wird nur geladen, wenn in den Einstellungen ein anderes Design als „Standard“ gewählt ist.
 * Die Klasse wpx-design-… sitzt am <body> und zusätzlich an Raster, Slider, Liste und Detailseite.
 * Die Farben der Detailseite (--wpx-…) setzt PHP (WPX_Design::detail_farben), hier stehen Form und Schrift.
 * Schriften: nur Systemschriften — es wird nichts von außen geladen.
 */

/* ═══════════════════════════════════════════════════════════════════════════
   ELEGANT — Serifen, Champagner-Gold, zentriert, feine Linien
   ═══════════════════════════════════════════════════════════════════════════ */
.wpx-design-elegant {
    --propstack-primary: #a8834a;
    --propstack-primary-hover: #8c6a36;
    --propstack-radius: 0px;
    --propstack-shadow: none;
    --propstack-shadow-hover: 0 18px 40px -26px rgba(33, 29, 24, 0.45);
    --propstack-dark: #211d18;
    --propstack-text-light: #6f665a;
    --propstack-border: #e4d9c6;
}
.wpx-design-elegant .propstack-property-card,
.wpx-design-elegant .propstack-list-item { background: #fffdf9; border: 1px solid #e4d9c6; }
.wpx-design-elegant .propstack-card-image { margin: 10px 10px 0; }
.wpx-design-elegant .propstack-badge.propstack-badge-buy,
.wpx-design-elegant .propstack-badge.propstack-badge-rent {
    background: rgba(20, 18, 15, 0.55) !important;
    color: #f6efe2 !important;
    border: 1px solid rgba(246, 239, 226, 0.6);
    border-radius: 0;
    font-weight: 500;
    letter-spacing: 0.2em;
}
.wpx-design-elegant .propstack-card-price { display: none; }
.wpx-design-elegant .propstack-card-price-text {
    display: block;
    margin: 0 0 14px;
    font-size: 22px;
    font-weight: 500;
    line-height: 1.2;
    color: #8c6a36;
}
.wpx-design-elegant .propstack-card-price-text::before {
    content: "";
    display: block;
    width: 36px;
    height: 1px;
    margin: 0 auto 12px;
    background: #a8834a;
}
.wpx-design-elegant .propstack-card-content { padding: 20px 22px; text-align: center; }
.wpx-design-elegant .propstack-card-title,
.wpx-design-elegant .propstack-list-title { font-size: 20px; font-weight: 500; line-height: 1.25; hyphens: auto; }
.wpx-design-elegant .propstack-card-address { justify-content: center; min-height: 0; }
.wpx-design-elegant .propstack-card-address svg { display: none; }
.wpx-design-elegant .propstack-card-details { justify-content: center; letter-spacing: 0.03em; }
.wpx-design-elegant .propstack-list-image { border-radius: 0; }
.wpx-design-elegant .propstack-list-price { font-weight: 500; color: #8c6a36; }
.wpx-design-elegant .propstack-slider-nav { border-radius: 0 !important; border-color: #e4d9c6 !important; background: #fffdf9 !important; color: #211d18 !important; }
.wpx-design-elegant .propstack-slider-nav:hover { background: #211d18 !important; border-color: #211d18 !important; color: #f6efe2 !important; }
.wpx-design-elegant .propstack-btn { border-radius: 0; }
.wpx-design-elegant .propstack-btn-primary,
.wpx-design-elegant .wpx-btn-primary {
    background: #211d18;
    color: #f6efe2;
    border-radius: 0;
    font-size: 13px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.wpx-design-elegant .propstack-btn-primary:hover { background: #3a332b; }
.wpx-design-elegant .propstack-form-group input,
.wpx-design-elegant .propstack-form-group select,
.wpx-design-elegant .propstack-form-group textarea { border-radius: 0; }
/* Detailseite */
.wpx-design-elegant .wpx-detail-hero-header { text-align: center; }
.wpx-design-elegant .wpx-detail-hero-header .wpx-detail-title { font-size: 42px; font-weight: 500; text-wrap: balance; }
.wpx-design-elegant .wpx-detail-hero-header .wpx-detail-address { justify-content: center; }
.wpx-design-elegant .wpx-gallery-main,
.wpx-design-elegant .wpx-gallery-placeholder,
.wpx-design-elegant .wpx-thumb,
.wpx-design-elegant .wpx-badge,
.wpx-design-elegant .wpx-table-grid,
.wpx-design-elegant .wpx-sidebar-box,
.wpx-design-elegant .wpx-document-item,
.wpx-design-elegant .wpx-floorplan-item,
.wpx-design-elegant .wpx-share-btn,
.wpx-design-elegant .wpx-similar-card { border-radius: 0; }
.wpx-design-elegant .wpx-badge-buy,
.wpx-design-elegant .wpx-badge-rent { background: rgba(20, 18, 15, 0.55); border: 1px solid rgba(246, 239, 226, 0.6); letter-spacing: 0.2em; font-weight: 500; }
.wpx-design-elegant .wpx-highlight { background: transparent; border: 1px solid var(--wpx-border); border-radius: 0; }
.wpx-design-elegant .wpx-highlight-icon { flex-basis: 28px; width: 28px; background: transparent; box-shadow: none; border-radius: 0; }
.wpx-design-elegant .wpx-highlight-value { font-size: 21px; font-weight: 500; }
@media (max-width: 768px) {
    .wpx-design-elegant .wpx-highlight-value { font-size: 17px; }
}
.wpx-design-elegant .wpx-section-title { font-size: 22px; font-weight: 500; border-bottom: 1px solid var(--wpx-accent); }
.wpx-design-elegant .wpx-section-title svg { display: none; }
.wpx-design-elegant .wpx-feature-item { background: transparent; border: 1px solid var(--wpx-border); border-radius: 0; }
.wpx-design-elegant .wpx-feature-item svg { color: var(--wpx-accent); }
.wpx-design-elegant .wpx-sidebar-price { font-size: 34px; font-weight: 500; color: #8c6a36; }
.wpx-design-elegant .wpx-sidebar-box h3,
.wpx-design-elegant .wpx-similar-title,
.wpx-design-elegant .wpx-similar-card-title { font-weight: 500; }
@media (max-width: 768px) {
    .wpx-design-elegant .wpx-detail-hero-header .wpx-detail-title { font-size: 28px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   KREATIV — runde Formen, kräftiges Rot-Orange, schräges Preisschild
   ═══════════════════════════════════════════════════════════════════════════ */
.wpx-design-kreativ {
    --propstack-primary: #d43f1f;
    --propstack-primary-hover: #b83418;
    --propstack-radius: 24px;
    --propstack-shadow: 0 18px 40px -22px rgba(29, 42, 68, 0.35);
    --propstack-shadow-hover: 0 24px 46px -20px rgba(29, 42, 68, 0.45);
    --propstack-dark: #1d2a44;
    --propstack-text-light: #5e6b82;
    --propstack-border: #f1e3d8;
}
.wpx-design-kreativ .propstack-property-card { overflow: visible; }
.wpx-design-kreativ .propstack-property-card:hover { transform: translateY(-4px) rotate(-0.4deg); }
.wpx-design-kreativ .propstack-card-image { margin: 10px 10px 0; border-radius: 18px; overflow: visible; background: transparent; }
.wpx-design-kreativ .propstack-card-image img,
.wpx-design-kreativ .propstack-no-image,
.wpx-design-kreativ .propstack-property-unavailable .propstack-card-image::before { border-radius: 18px; }
.wpx-design-kreativ .propstack-property-card:hover .propstack-card-image img { transform: none; }
.wpx-design-kreativ .propstack-badge { padding: 7px 13px; border-radius: 30px; }
.wpx-design-kreativ .propstack-badge.propstack-badge-buy,
.wpx-design-kreativ .propstack-badge.propstack-badge-rent { background: #1d2a44 !important; color: #fff !important; }
.wpx-design-kreativ .propstack-card-price {
    left: auto;
    right: 14px;
    bottom: -16px;
    z-index: 5;
    padding: 10px 16px;
    border-radius: 30px;
    background: #d43f1f;
    font-size: 17px;
    transform: rotate(-3deg);
    box-shadow: 0 8px 18px -6px rgba(212, 63, 31, 0.6);
}
.wpx-design-kreativ .propstack-card-content { padding: 28px 18px 18px; }
.wpx-design-kreativ .propstack-card-title,
.wpx-design-kreativ .propstack-list-title { font-size: 18px; font-weight: 800; letter-spacing: -0.01em; }
.wpx-design-kreativ .propstack-card-details { border-top: 0; padding-top: 0; gap: 6px; }
.wpx-design-kreativ .propstack-detail { padding: 6px 10px; border-radius: 20px; background: #fff1e9; color: #9c3115; font-weight: 600; }
.wpx-design-kreativ .propstack-detail svg { color: #9c3115; }
.wpx-design-kreativ .propstack-list-image { border-radius: 18px; }
.wpx-design-kreativ .propstack-slider-nav { border-radius: 50% !important; border-color: #d43f1f !important; background: #d43f1f !important; color: #fff !important; }
.wpx-design-kreativ .propstack-slider-nav:hover { background: #1d2a44 !important; border-color: #1d2a44 !important; }
.wpx-design-kreativ .propstack-btn,
.wpx-design-kreativ .wpx-btn-primary { border-radius: 30px; }
.wpx-design-kreativ .propstack-form-group input,
.wpx-design-kreativ .propstack-form-group select,
.wpx-design-kreativ .propstack-form-group textarea { border-radius: 14px; }
/* Detailseite */
.wpx-design-kreativ .wpx-detail-hero-header .wpx-detail-title { font-size: 40px; font-weight: 800; letter-spacing: -0.02em; text-wrap: balance; }
.wpx-design-kreativ .wpx-gallery-main,
.wpx-design-kreativ .wpx-gallery-placeholder { border-radius: 24px; }
.wpx-design-kreativ .wpx-thumb { border-radius: 12px; }
.wpx-design-kreativ .wpx-badge { border-radius: 30px; }
.wpx-design-kreativ .wpx-badge-buy,
.wpx-design-kreativ .wpx-badge-rent { background: #1d2a44; }
.wpx-design-kreativ .wpx-highlight { background: #1d2a44; border-radius: 20px; }
.wpx-design-kreativ .wpx-highlight:nth-child(2) { background: #d43f1f; }
.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight,
.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight-value { color: #fff !important; }
.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight-label { color: rgba(255, 255, 255, 0.82) !important; }
.wpx-design-kreativ .wpx-highlight-icon { background: rgba(255, 255, 255, 0.14); color: #fff; box-shadow: none; border-radius: 14px; }
.wpx-design-kreativ .wpx-section-title { border-bottom: 0; padding-bottom: 0; font-size: 21px; font-weight: 800; }
.wpx-design-kreativ .wpx-feature-item { border-radius: 30px; background: #fff1e9; color: #9c3115; font-weight: 600; }
.wpx-design-kreativ .wpx-feature-item svg { color: #9c3115; }
.wpx-design-kreativ .wpx-table-grid { border-radius: 20px; }
.wpx-design-kreativ .wpx-sidebar-box { border: 0; border-radius: 24px; box-shadow: var(--wpx-shadow); }
.wpx-design-kreativ .wpx-sidebar-price { font-weight: 800; }
.wpx-design-kreativ .wpx-document-item { border-radius: 30px; }
.wpx-design-kreativ .wpx-similar-card { border-radius: 24px; }
@media (max-width: 768px) {
    .wpx-design-kreativ .wpx-detail-hero-header .wpx-detail-title { font-size: 27px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   MAGAZIN — Hochformat-Fotos, Titel und Preis liegen auf dem Bild
   ═══════════════════════════════════════════════════════════════════════════ */
.wpx-design-magazin {
    --propstack-primary: #16181b;
    --propstack-primary-hover: #33373d;
    --propstack-radius: 4px;
    --propstack-shadow: 0 14px 30px -20px rgba(0, 0, 0, 0.5);
    --propstack-shadow-hover: 0 20px 36px -18px rgba(0, 0, 0, 0.6);
    --propstack-dark: #16181b;
    --propstack-text-light: #5d6168;
    --propstack-border: #dcd7cd;
}
.wpx-design-magazin .propstack-property-card { background: #16181b; container-type: inline-size; }
.wpx-design-magazin .propstack-card-link { position: relative; }
.wpx-design-magazin .propstack-card-image { aspect-ratio: 4 / 5; min-height: 340px; }
/* Schmale Karten (viele Spalten): kleinerer Titel, Adresse weg — damit nichts an das Schild stößt */
@container (max-width: 250px) {
    .wpx-design-magazin .propstack-card-content { padding: 60px 14px 14px; }
    .wpx-design-magazin .propstack-card-title { font-size: 16px; -webkit-line-clamp: 2; }
    .wpx-design-magazin .propstack-card-address { display: none; }
    .wpx-design-magazin .propstack-card-price-text { font-size: 15px; margin-bottom: 8px; }
    .wpx-design-magazin .propstack-card-details { gap: 4px 10px; }
}
.wpx-design-magazin .propstack-badge { border-radius: 2px; }
.wpx-design-magazin .propstack-badge.propstack-badge-buy,
.wpx-design-magazin .propstack-badge.propstack-badge-rent { background: #fff !important; color: #16181b !important; }
.wpx-design-magazin .propstack-card-price { display: none; }
.wpx-design-magazin .propstack-card-content {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3;
    padding: 84px 20px 18px;
    background: linear-gradient(to bottom, rgba(10, 11, 13, 0), rgba(10, 11, 13, 0.9) 58%);
}
.wpx-design-magazin .propstack-card-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    margin-bottom: 6px;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.015em;
    hyphens: auto;
    color: #fff;
}
.wpx-design-magazin .propstack-card-address { min-height: 0; margin-bottom: 6px; font-size: 13px; color: rgba(255, 255, 255, 0.82); }
.wpx-design-magazin .propstack-card-address svg,
.wpx-design-magazin .propstack-detail svg { color: #e9d9b8; }
.wpx-design-magazin .propstack-card-price-text { display: block; margin: 0 0 10px; font-size: 17px; font-weight: 700; color: #fff; }
.wpx-design-magazin .propstack-card-details { border-top-color: rgba(255, 255, 255, 0.24); padding-top: 10px; }
.wpx-design-magazin .propstack-detail { color: rgba(255, 255, 255, 0.88); }
.wpx-design-magazin .propstack-stamp-wrap { align-items: flex-start; padding-top: 22%; }
.wpx-design-magazin .propstack-list-title { font-weight: 700; letter-spacing: -0.015em; }
.wpx-design-magazin .propstack-slider-nav { border-radius: 2px !important; border-color: #16181b !important; }
.wpx-design-magazin .propstack-btn,
.wpx-design-magazin .wpx-btn-primary { border-radius: 2px; }
/* Detailseite: erst das große Bild, dann die Schlagzeile */
.wpx-property-detail.wpx-design-magazin { display: flex; flex-direction: column; }
.wpx-property-detail.wpx-design-magazin > .wpx-detail-gallery { order: 1; margin-bottom: 26px; }
.wpx-property-detail.wpx-design-magazin > .wpx-detail-hero-header { order: 2; margin-bottom: 30px; }
.wpx-property-detail.wpx-design-magazin > .wpx-detail-content { order: 3; }
.wpx-property-detail.wpx-design-magazin > .wpx-similar-properties { order: 4; }
.wpx-design-magazin .wpx-detail-hero-header .wpx-detail-title { font-size: 48px; font-weight: 700; line-height: 1.05; letter-spacing: -0.025em; text-wrap: balance; }
.wpx-design-magazin .wpx-gallery-main,
.wpx-design-magazin .wpx-gallery-placeholder,
.wpx-design-magazin .wpx-table-grid,
.wpx-design-magazin .wpx-sidebar-box,
.wpx-design-magazin .wpx-similar-card { border-radius: 4px; }
.wpx-design-magazin .wpx-thumb,
.wpx-design-magazin .wpx-badge,
.wpx-design-magazin .wpx-feature-item,
.wpx-design-magazin .wpx-document-item { border-radius: 2px; }
.wpx-design-magazin .wpx-badge-buy,
.wpx-design-magazin .wpx-badge-rent { background: #fff; color: #16181b; }
.wpx-design-magazin .wpx-highlight { background: transparent; border-left: 2px solid var(--wpx-text); border-radius: 0; padding: 4px 16px; }
.wpx-design-magazin .wpx-highlight-icon { display: none; }
.wpx-design-magazin .wpx-section-title { font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; border-bottom: 2px solid var(--wpx-text); }
.wpx-design-magazin .wpx-section-title svg { display: none; }
.wpx-design-magazin .wpx-description-text::first-letter { float: left; margin: 6px 8px 0 0; font-size: 46px; font-weight: 700; line-height: 0.85; }
.wpx-design-magazin .wpx-feature-item svg { color: var(--wpx-text); }
@media (max-width: 768px) {
    .wpx-design-magazin .wpx-detail-hero-header .wpx-detail-title { font-size: 30px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   NACHT — dunkle Karten, goldene Preise. Empfohlen nur für dunkle Websites.
   ═══════════════════════════════════════════════════════════════════════════ */
.wpx-design-nacht {
    --propstack-primary: #d6b47c;
    --propstack-primary-hover: #e4c796;
    --propstack-radius: 6px;
    --propstack-shadow: 0 20px 40px -24px rgba(0, 0, 0, 0.9);
    --propstack-shadow-hover: 0 26px 46px -22px rgba(0, 0, 0, 1);
}
/* Helle Textfarben nur IN den dunklen Karten — andere Bausteine (Suche, Filter) behalten ihre Farben. */
.wpx-design-nacht .propstack-property-card,
.wpx-design-nacht .propstack-list-item {
    --propstack-dark: #eee8dc;
    --propstack-text-light: #a39d92;
    --propstack-border: #2c3036;
    --propstack-light: #23272c;
    background: #1b1e22;
    border: 1px solid #2c3036;
    color: #eee8dc;
}
.wpx-design-nacht .propstack-badge.propstack-badge-buy,
.wpx-design-nacht .propstack-badge.propstack-badge-rent {
    background: rgba(18, 20, 22, 0.72) !important;
    color: #d6b47c !important;
    border: 1px solid rgba(214, 180, 124, 0.55);
    font-weight: 500;
    letter-spacing: 0.18em;
}
.wpx-design-nacht .propstack-card-price {
    left: 0;
    right: 0;
    bottom: 0;
    padding: 40px 16px 14px;
    border-radius: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.78));
    font-size: 22px;
    font-weight: 400;
    color: #d6b47c;
}
.wpx-design-nacht .propstack-card-title,
.wpx-design-nacht .propstack-list-title { font-size: 19px; font-weight: 400; color: #eee8dc; }
.wpx-design-nacht .propstack-list-address,
.wpx-design-nacht .propstack-list-details { color: #a39d92; }
.wpx-design-nacht .propstack-slider-nav { background: #1b1e22 !important; border-color: #2c3036 !important; color: #d6b47c !important; }
.wpx-design-nacht .propstack-slider-nav:hover { background: #d6b47c !important; border-color: #d6b47c !important; color: #121416 !important; }
.wpx-design-nacht .propstack-slider-counter { color: #a39d92 !important; }
.wpx-design-nacht .propstack-slider-dot { background: #2c3036 !important; }
.wpx-design-nacht .propstack-slider-dot.active { background: #d6b47c !important; }
.wpx-design-nacht .propstack-btn-primary,
.wpx-design-nacht .wpx-btn-primary { color: #121416; }
/* Detailseite: auf heller Website bekommt sie einen eigenen dunklen Grund */
.wpx-property-detail.wpx-design-nacht:not(.wpx-dark-mode) { background: #121416; padding: 28px !important; border-radius: 8px; }
.wpx-design-nacht .wpx-detail-hero-header .wpx-detail-title { font-size: 38px; font-weight: 400; text-wrap: balance; }
.wpx-design-nacht .wpx-gallery-main { border-radius: 6px; }
.wpx-design-nacht .wpx-badge-buy,
.wpx-design-nacht .wpx-badge-rent { background: rgba(18, 20, 22, 0.72); color: #d6b47c; border: 1px solid rgba(214, 180, 124, 0.55); letter-spacing: 0.18em; font-weight: 500; }
.wpx-design-nacht .wpx-highlight,
.wpx-design-nacht .wpx-sidebar-box,
.wpx-design-nacht .wpx-table-grid { border-radius: 6px; }
.wpx-design-nacht .wpx-highlight { border: 1px solid var(--wpx-border); }
.wpx-design-nacht .wpx-highlight-icon { background: #121416; box-shadow: none; }
.wpx-design-nacht .wpx-detail-highlights .wpx-highlight-value { color: #d6b47c !important; font-weight: 400; }
.wpx-design-nacht .wpx-section-title { font-size: 21px; font-weight: 400; }
/* Überschriften erben sonst die (dunkle) Farbe des Themes und wären auf dem dunklen Grund unlesbar */
.wpx-design-nacht .wpx-section-title,
.wpx-design-nacht .wpx-similar-title,
.wpx-design-nacht .wpx-map-overlay h3 { color: var(--wpx-text, #eee8dc); }
.wpx-design-nacht .wpx-similar-subtitle { color: var(--wpx-muted, #a39d92); }
.wpx-design-nacht .wpx-sidebar-price { font-weight: 400; }
.wpx-design-nacht .wpx-feature-item svg { color: #d6b47c; }
.wpx-design-nacht .wpx-share-whatsapp { background: #16261d; }
.wpx-design-nacht.wpx-property-detail input,
.wpx-design-nacht.wpx-property-detail select,
.wpx-design-nacht.wpx-property-detail textarea,
.wpx-design-nacht .wpx-property-detail input,
.wpx-design-nacht .wpx-property-detail select,
.wpx-design-nacht .wpx-property-detail textarea {
    background: #121416 !important;
    border-color: #2c3036 !important;
    color: #eee8dc !important;
}
.wpx-design-nacht .wpx-property-detail label,
.wpx-design-nacht.wpx-property-detail label { color: #cfc8ba !important; }
/* Anfrageformular in der Seitenleiste: kein weißer Kasten im dunklen Kasten */
.wpx-design-nacht .wpx-inquiry-box .propstack-inquiry-form-wrapper { background: transparent; border: 0; box-shadow: none; padding: 0; color: #eee8dc; }
.wpx-design-nacht .wpx-inquiry-box .propstack-inquiry-form-wrapper h3 { display: none; }
.wpx-design-nacht .wpx-inquiry-box .propstack-privacy-text,
.wpx-design-nacht .wpx-inquiry-box .propstack-privacy-text a { color: #cfc8ba; }
.wpx-design-nacht .wpx-similar-card { background: #1b1e22; border: 1px solid #2c3036; border-radius: 6px; }
.wpx-design-nacht .wpx-similar-card-title { color: #eee8dc; font-weight: 400; }
.wpx-design-nacht .wpx-similar-address,
.wpx-design-nacht .wpx-meta-item { color: #a39d92; }
@media (max-width: 768px) {
    .wpx-design-nacht .wpx-detail-hero-header .wpx-detail-title { font-size: 27px; }
    .wpx-property-detail.wpx-design-nacht:not(.wpx-dark-mode) { padding: 16px !important; }
}

@media (prefers-reduced-motion: reduce) {
    .wpx-design-kreativ .propstack-property-card:hover { transform: none; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   v4.9.1 — Grundfarben je Design als Variablen
   (Die Regeln weiter unten nutzen sie; „Farben der Website“ tauscht nur diese Werte.)
   ═══════════════════════════════════════════════════════════════════════════ */
.wpx-design-elegant { --d-akz: #a8834a; --d-akz-text: #8c6a36; --d-akz-auf: #fff; --d-knopf: #211d18; --d-knopf-auf: #f6efe2; --d-karte: #fffdf9; --d-linie: #e4d9c6; --d-schild: rgba(20, 18, 15, 0.55); --d-schild-auf: #f6efe2; }
.wpx-design-kreativ { --d-akz: #d43f1f; --d-akz-auf: #fff; --d-akz-text: #9c3115; --d-zweit: #1d2a44; --d-zweit-auf: #fff; --d-ton: #fff1e9; }
.wpx-design-magazin { --d-akz: #16181b; --d-akz-auf: #fff; }
.wpx-design-nacht { --d-akz: #d6b47c; --d-akz-auf: #121416; }

/* ═══════════════════════════════════════════════════════════════════════════
   „Weitere Objekte“ auf der Detailseite — gleiche Handschrift wie die Objektkarten
   ═══════════════════════════════════════════════════════════════════════════ */
/* Elegant */
.wpx-design-elegant .wpx-similar-card { background: var(--d-karte); border: 1px solid var(--d-linie); box-shadow: none; }
.wpx-design-elegant .wpx-similar-card:hover { box-shadow: 0 18px 40px -26px rgba(33, 29, 24, 0.45); }
.wpx-design-elegant .wpx-similar-image { margin: 8px 8px 0; }
.wpx-design-elegant .wpx-similar-content { padding: 16px 18px 18px; text-align: center; }
.wpx-design-elegant .wpx-similar-card-title { font-size: 17px; line-height: 1.3; }
.wpx-design-elegant .wpx-similar-address,
.wpx-design-elegant .wpx-similar-meta { justify-content: center; }
.wpx-design-elegant .wpx-similar-address svg { display: none; }
.wpx-design-elegant .wpx-similar-meta { border-bottom: 0; padding-bottom: 0; margin-bottom: 12px; }
.wpx-design-elegant .wpx-similar-price { font-size: 20px; font-weight: 500; color: var(--d-akz-text); }
.wpx-design-elegant .wpx-similar-price::before { content: ""; display: block; width: 32px; height: 1px; margin: 0 auto 10px; background: var(--d-akz); }
.wpx-design-elegant .wpx-match-badge { left: 10px; right: auto; top: 10px; border-radius: 0; background: var(--d-schild); color: var(--d-schild-auf); border: 1px solid rgba(246, 239, 226, 0.6); box-shadow: none; font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; }
.wpx-design-elegant .wpx-match-badge svg { display: none; }
.wpx-design-elegant .wpx-similar-title svg { color: var(--d-akz); }
.wpx-design-elegant .wpx-slider-prev,
.wpx-design-elegant .wpx-slider-next { border-radius: 0; border: 1px solid var(--d-linie); box-shadow: none; background: var(--d-karte); color: #211d18; }
.wpx-design-elegant .wpx-slider-prev:hover,
.wpx-design-elegant .wpx-slider-next:hover { background: var(--d-knopf); color: var(--d-knopf-auf); box-shadow: none; }
/* Kreativ */
.wpx-design-kreativ .wpx-similar-card { box-shadow: 0 18px 40px -22px rgba(29, 42, 68, 0.35); }
.wpx-design-kreativ .wpx-similar-image { margin: 8px 8px 0; border-radius: 16px; }
.wpx-design-kreativ .wpx-similar-card:hover .wpx-similar-image img { transform: none; }
.wpx-design-kreativ .wpx-similar-card-title { font-size: 16px; font-weight: 800; letter-spacing: -0.01em; }
.wpx-design-kreativ .wpx-similar-meta { border-bottom: 0; padding-bottom: 0; gap: 6px; }
.wpx-design-kreativ .wpx-meta-item { padding: 5px 10px; border-radius: 20px; background: var(--d-ton); color: var(--d-akz-text); font-weight: 600; }
.wpx-design-kreativ .wpx-meta-item svg { color: var(--d-akz-text); }
.wpx-design-kreativ .wpx-similar-price { display: inline-block; padding: 8px 14px; border-radius: 30px; background: var(--d-akz); color: var(--d-akz-auf); font-size: 16px; transform: rotate(-2deg); }
.wpx-design-kreativ .wpx-match-badge { background: var(--d-zweit); color: var(--d-zweit-auf); box-shadow: none; }
.wpx-design-kreativ .wpx-slider-prev,
.wpx-design-kreativ .wpx-slider-next { background: var(--d-akz); color: var(--d-akz-auf); }
.wpx-design-kreativ .wpx-slider-prev:hover,
.wpx-design-kreativ .wpx-slider-next:hover { background: var(--d-zweit); color: var(--d-zweit-auf); box-shadow: none; }
/* Magazin */
.wpx-design-magazin .wpx-similar-card { position: relative; background: #16181b; }
.wpx-design-magazin .wpx-similar-image { aspect-ratio: 4 / 5; min-height: 320px; background: #16181b; }
.wpx-design-magazin .wpx-similar-content { position: absolute; left: 0; right: 0; bottom: 0; padding: 70px 16px 16px; background: linear-gradient(to bottom, rgba(10, 11, 13, 0), rgba(10, 11, 13, 0.9) 58%); }
.wpx-design-magazin .wpx-similar-card-title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; font-size: 17px; font-weight: 700; line-height: 1.2; letter-spacing: -0.015em; color: #fff; }
.wpx-design-magazin .wpx-similar-address { color: rgba(255, 255, 255, 0.82); }
.wpx-design-magazin .wpx-similar-address svg,
.wpx-design-magazin .wpx-meta-item svg { color: #e9d9b8; }
.wpx-design-magazin .wpx-meta-item { color: rgba(255, 255, 255, 0.88); }
.wpx-design-magazin .wpx-similar-meta { border-bottom-color: rgba(255, 255, 255, 0.24); }
.wpx-design-magazin .wpx-similar-price { color: #fff; }
.wpx-design-magazin .wpx-match-badge { left: 12px; right: auto; border-radius: 2px; background: #fff; color: #16181b; box-shadow: none; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.wpx-design-magazin .wpx-slider-prev,
.wpx-design-magazin .wpx-slider-next { border-radius: 2px; }
.wpx-design-magazin .wpx-slider-prev:hover,
.wpx-design-magazin .wpx-slider-next:hover { background: var(--d-akz); color: var(--d-akz-auf); box-shadow: none; }
/* Nacht */
.wpx-design-nacht .wpx-similar-image { background: #23272c; }
.wpx-design-nacht .wpx-similar-card-title { font-size: 16px; }
.wpx-design-nacht .wpx-similar-meta { border-bottom-color: #2c3036; }
.wpx-design-nacht .wpx-similar-price { font-size: 19px; font-weight: 400; color: var(--d-akz); }
.wpx-design-nacht .wpx-match-badge { background: rgba(18, 20, 22, 0.72); color: var(--d-akz); border: 1px solid color-mix(in srgb, var(--d-akz) 55%, transparent); box-shadow: none; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; font-size: 11px; }
.wpx-design-nacht .wpx-similar-title svg { color: var(--d-akz); }
.wpx-design-nacht .wpx-slider-prev,
.wpx-design-nacht .wpx-slider-next { background: #1b1e22; border: 1px solid #2c3036; color: var(--d-akz); }
.wpx-design-nacht .wpx-slider-prev:hover,
.wpx-design-nacht .wpx-slider-next:hover { background: var(--d-akz); color: var(--d-akz-auf); box-shadow: none; }

/* ═══════════════════════════════════════════════════════════════════════════
   FARBEN DER WEBSITE (Einstellung „Farben meiner Website“)
   PHP setzt an .wpx-farben-website:  --wpx-ci (Hauptfarbe), --wpx-ci-auf (Schrift darauf),
   --wpx-ci-text (als Schrift auf Weiß lesbar), --wpx-ci-hell (auf Dunkel lesbar), --wpx-ci-hell-auf
   und optional --wpx-ci2 / --wpx-ci2-auf (Zweitfarbe). Form und Schrift des Designs bleiben.
   ═══════════════════════════════════════════════════════════════════════════ */
[class*="wpx-design-"].wpx-farben-website {
    --propstack-primary: var(--wpx-ci);
    --propstack-primary-hover: color-mix(in srgb, var(--wpx-ci) 84%, #000);
}
.wpx-farben-website .propstack-btn-primary,
.wpx-farben-website .wpx-btn-primary { background: var(--wpx-ci); color: var(--wpx-ci-auf); }
.wpx-farben-website .wpx-btn-primary:hover { box-shadow: 0 4px 12px color-mix(in srgb, var(--wpx-ci) 35%, transparent); }
.wpx-farben-website .wpx-similar-price { color: var(--wpx-ci-text); }
.wpx-farben-website .wpx-slider-prev:hover,
.wpx-farben-website .wpx-slider-next:hover { background: var(--wpx-ci); color: var(--wpx-ci-auf); box-shadow: none; }
.wpx-farben-website .propstack-slider-nav:hover { background: var(--wpx-ci) !important; border-color: var(--wpx-ci) !important; color: var(--wpx-ci-auf) !important; }
.wpx-farben-website .propstack-list-price { color: var(--wpx-ci-text); }

/* Standard + Elegant + Kreativ: „Kaufen“ in der Zweitfarbe (falls gesetzt), „Mieten“ in der Hauptfarbe */
.wpx-farben-website.wpx-design-standard .propstack-badge.propstack-badge-buy,
.wpx-farben-website.wpx-design-elegant .propstack-badge.propstack-badge-buy {
    background: var(--wpx-ci2, var(--wpx-ci)) !important;
    color: var(--wpx-ci2-auf, var(--wpx-ci-auf)) !important;
    border-color: transparent;
}
.wpx-farben-website.wpx-design-standard .propstack-badge.propstack-badge-rent,
.wpx-farben-website.wpx-design-elegant .propstack-badge.propstack-badge-rent {
    background: var(--wpx-ci) !important;
    color: var(--wpx-ci-auf) !important;
    border-color: transparent;
}
.wpx-farben-website.wpx-design-standard .wpx-badge-buy,
.wpx-farben-website.wpx-design-elegant .wpx-badge-buy { background: var(--wpx-ci2, var(--wpx-ci)); color: var(--wpx-ci2-auf, var(--wpx-ci-auf)); border-color: transparent; }
.wpx-farben-website.wpx-design-standard .wpx-badge-rent,
.wpx-farben-website.wpx-design-elegant .wpx-badge-rent { background: var(--wpx-ci); color: var(--wpx-ci-auf); border-color: transparent; }
.wpx-farben-website.wpx-design-standard .wpx-match-badge { background: var(--wpx-ci2, var(--wpx-ci)); color: var(--wpx-ci2-auf, var(--wpx-ci-auf)); box-shadow: none; }

/* Elegant: Beige und Gold raus — neutrales Weiß, Linien in Grau, Akzent in der Hauptfarbe */
.wpx-farben-website.wpx-design-elegant {
    --d-akz: var(--wpx-ci); --d-akz-text: var(--wpx-ci-text); --d-akz-auf: var(--wpx-ci-auf);
    --d-knopf: var(--wpx-ci); --d-knopf-auf: var(--wpx-ci-auf);
    --d-karte: #fff; --d-linie: #e3e5e8;
    --d-schild: var(--wpx-ci2, var(--wpx-ci)); --d-schild-auf: var(--wpx-ci2-auf, var(--wpx-ci-auf));
    --propstack-border: #e3e5e8; --propstack-dark: #1f2328; --propstack-text-light: #5f6670;
}
.wpx-farben-website.wpx-design-elegant .propstack-property-card,
.wpx-farben-website.wpx-design-elegant .propstack-list-item { background: #fff; border-color: #e3e5e8; }
.wpx-farben-website.wpx-design-elegant .propstack-card-price-text,
.wpx-farben-website.wpx-design-elegant .propstack-list-price,
.wpx-farben-website.wpx-design-elegant .wpx-sidebar-price { color: var(--wpx-ci-text); }
.wpx-farben-website.wpx-design-elegant .propstack-card-price-text::before { background: var(--wpx-ci); }
.wpx-farben-website.wpx-design-elegant .propstack-slider-nav { background: #fff !important; border-color: #e3e5e8 !important; color: #1f2328 !important; }
.wpx-farben-website.wpx-design-elegant .propstack-btn-primary:hover { background: color-mix(in srgb, var(--wpx-ci) 84%, #000); }
.wpx-farben-website.wpx-design-elegant .wpx-match-badge { border-color: transparent; }
.wpx-farben-website.wpx-design-elegant .wpx-slider-prev,
.wpx-farben-website.wpx-design-elegant .wpx-slider-next { color: #1f2328; }

/* Kreativ: Preisschild und Knöpfe in der Hauptfarbe, dunkle Flächen in der Zweitfarbe */
.wpx-farben-website.wpx-design-kreativ {
    --d-akz: var(--wpx-ci); --d-akz-auf: var(--wpx-ci-auf); --d-akz-text: var(--wpx-ci-text);
    --d-zweit: var(--wpx-ci2, #1d2a44); --d-zweit-auf: var(--wpx-ci2-auf, #fff);
    --d-ton: color-mix(in srgb, var(--wpx-ci) 10%, #fff);
    --propstack-border: #e9ebee;
}
.wpx-farben-website.wpx-design-kreativ .propstack-badge.propstack-badge-buy,
.wpx-farben-website.wpx-design-kreativ .propstack-badge.propstack-badge-rent { background: var(--d-zweit) !important; color: var(--d-zweit-auf) !important; }
.wpx-farben-website.wpx-design-kreativ .wpx-badge-buy,
.wpx-farben-website.wpx-design-kreativ .wpx-badge-rent { background: var(--d-zweit); color: var(--d-zweit-auf); }
.wpx-farben-website.wpx-design-kreativ .propstack-card-price { background: var(--wpx-ci); color: var(--wpx-ci-auf); box-shadow: 0 8px 18px -6px color-mix(in srgb, var(--wpx-ci) 60%, transparent); }
.wpx-farben-website.wpx-design-kreativ .propstack-detail,
.wpx-farben-website.wpx-design-kreativ .wpx-feature-item { background: var(--d-ton); color: var(--wpx-ci-text); }
.wpx-farben-website.wpx-design-kreativ .propstack-detail svg,
.wpx-farben-website.wpx-design-kreativ .wpx-feature-item svg { color: var(--wpx-ci-text); }
.wpx-farben-website.wpx-design-kreativ .propstack-slider-nav { background: var(--wpx-ci) !important; border-color: var(--wpx-ci) !important; color: var(--wpx-ci-auf) !important; }
.wpx-farben-website.wpx-design-kreativ .propstack-slider-nav:hover { background: var(--d-zweit) !important; border-color: var(--d-zweit) !important; color: var(--d-zweit-auf) !important; }
.wpx-farben-website.wpx-design-kreativ .wpx-highlight { background: var(--d-zweit); }
.wpx-farben-website.wpx-design-kreativ .wpx-highlight:nth-child(2) { background: var(--wpx-ci); }
.wpx-farben-website.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight,
.wpx-farben-website.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight .wpx-highlight-value,
.wpx-farben-website.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight .wpx-highlight-label,
.wpx-farben-website.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight .wpx-highlight-icon { color: var(--d-zweit-auf) !important; }
.wpx-farben-website.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight:nth-child(2),
.wpx-farben-website.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight:nth-child(2) .wpx-highlight-value,
.wpx-farben-website.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight:nth-child(2) .wpx-highlight-label,
.wpx-farben-website.wpx-design-kreativ .wpx-detail-highlights .wpx-highlight:nth-child(2) .wpx-highlight-icon { color: var(--wpx-ci-auf) !important; }
.wpx-farben-website.wpx-design-kreativ .wpx-similar-price { color: var(--wpx-ci-auf); }

/* Magazin: Schwarz-Weiß bleibt, Knöpfe und Akzente in der Hauptfarbe */
.wpx-farben-website.wpx-design-magazin { --d-akz: var(--wpx-ci); --d-akz-auf: var(--wpx-ci-auf); }
.wpx-farben-website.wpx-design-magazin .propstack-slider-nav { border-color: var(--wpx-ci) !important; }
.wpx-farben-website.wpx-design-magazin .wpx-similar-price { color: #fff; }

/* Nacht: Hauptfarbe so aufgehellt, dass sie auf Dunkel lesbar ist */
.wpx-farben-website.wpx-design-nacht {
    --d-akz: var(--wpx-ci-hell); --d-akz-auf: var(--wpx-ci-hell-auf);
    --propstack-primary: var(--wpx-ci-hell);
    --propstack-primary-hover: color-mix(in srgb, var(--wpx-ci-hell) 84%, #fff);
}
.wpx-farben-website.wpx-design-nacht .propstack-badge.propstack-badge-buy,
.wpx-farben-website.wpx-design-nacht .propstack-badge.propstack-badge-rent { color: var(--wpx-ci-hell) !important; border-color: color-mix(in srgb, var(--wpx-ci-hell) 55%, transparent); }
.wpx-farben-website.wpx-design-nacht .wpx-badge-buy,
.wpx-farben-website.wpx-design-nacht .wpx-badge-rent { color: var(--wpx-ci-hell); border-color: color-mix(in srgb, var(--wpx-ci-hell) 55%, transparent); }
.wpx-farben-website.wpx-design-nacht .propstack-card-price,
.wpx-farben-website.wpx-design-nacht .wpx-similar-price { color: var(--wpx-ci-hell); }
.wpx-farben-website.wpx-design-nacht .propstack-btn-primary,
.wpx-farben-website.wpx-design-nacht .wpx-btn-primary { background: var(--wpx-ci-hell); color: var(--wpx-ci-hell-auf); }
.wpx-farben-website.wpx-design-nacht .propstack-slider-nav { color: var(--wpx-ci-hell) !important; }
.wpx-farben-website.wpx-design-nacht .propstack-slider-nav:hover { background: var(--wpx-ci-hell) !important; border-color: var(--wpx-ci-hell) !important; color: var(--wpx-ci-hell-auf) !important; }
.wpx-farben-website.wpx-design-nacht .propstack-slider-dot.active { background: var(--wpx-ci-hell) !important; }
.wpx-farben-website.wpx-design-nacht .wpx-detail-highlights .wpx-highlight-value { color: var(--wpx-ci-hell) !important; }
.wpx-farben-website.wpx-design-nacht .wpx-feature-item svg { color: var(--wpx-ci-hell); }
