/**
 * Exposé-Landing-Pages — Design-Schicht (LP-Ausbau 10/2026)
 *
 * Wird NACH landing-expose.css geladen (öffentliche LP und Token-LP) und ersetzt
 * die früheren Inline-<style>-Blöcke beider Seiten. Alle Regeln hängen an
 * `body.lp`, damit sie ältere Regeln mit gleicher Klasse sicher überschreiben.
 *
 * Kontraste (WCAG 2.1 AA, gegen Weiß): Text #111418 18,5:1 · Sekundär #5b6470
 * 6,0:1 · Grün-Text #00704f 6,1:1 · Schwarz auf Mint #00E8A2 13:1.
 * Markengrün (#00E8A2) NUR als Fläche mit dunkler Schrift, nie als Textfarbe.
 */

/* =============================================================
   Tokens
   ============================================================= */
body.lp {
    --lp-ink: #111418;
    --lp-text: #1f2328;
    --lp-muted: #5b6470;
    --lp-line: #e6e8eb;
    --lp-bg: #f4f5f7;
    --lp-surface: #ffffff;
    --lp-mint: #00e8a2;
    --lp-mint-hover: #00d493;
    --lp-green: #00704f;
    --lp-green-soft: #e8f8f1;
    --lp-green-line: #c6ecdb;
    --lp-radius: 14px;
    --lp-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 1px 0 rgba(16, 24, 40, 0.02);
    --lp-focus: 0 0 0 3px rgba(0, 112, 79, 0.35);
    --lp-gap: 24px;

    background: var(--lp-bg);
    color: var(--lp-text);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.lp :focus-visible {
    outline: none;
    box-shadow: var(--lp-focus);
    border-radius: 6px;
}

.lp .lp-skip {
    position: absolute;
    left: 12px;
    top: -60px;
    z-index: 10000;
    background: var(--lp-ink);
    color: #fff;
    padding: 10px 14px;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
}
.lp .lp-skip:focus { top: 12px; color: #fff; }

/* =============================================================
   Kopfzeile mit Logo
   ============================================================= */
.lp .landing-logo-header {
    background: rgba(255, 255, 255, 0.96);
    padding: 16px 0;
    backdrop-filter: saturate(1.4) blur(6px);
}
.lp .landing-logo { width: 170px; height: auto; display: block; }

/* =============================================================
   Galerie: Desktop-Raster + mobiles Karussell
   ============================================================= */
.lp .image-grid-container.lp-gallery {
    display: block;
    position: relative;
    height: auto;
    max-width: 1440px;
    margin: 0 auto;
    padding: 12px 12px 0;
    overflow: visible;
}

.lp .lp-grid {
    display: grid;
    height: min(520px, 56vw);
    gap: 4px;
    border-radius: var(--lp-radius);
    overflow: hidden;
}
.lp .lp-grid.grid-4 { grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 1fr 1fr; }
.lp .lp-grid.grid-4 .grid-item:nth-child(1) { grid-row: 1 / 3; }
.lp .lp-grid.grid-4 .grid-item:nth-child(2) { grid-row: 1 / 3; }
.lp .lp-grid.grid-3 { grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; }
.lp .lp-grid.grid-3 .grid-item:nth-child(1) { grid-row: 1 / 3; }
.lp .lp-grid.grid-2 { grid-template-columns: 1fr 1fr; }
.lp .lp-grid.grid-1 { grid-template-columns: 1fr; max-width: 1100px; margin: 0 auto; }
.lp .lp-grid .grid-item { border-radius: 0; }
.lp .lp-grid.grid-1 .grid-item img { object-fit: cover; }

.lp .lp-gallery-actions {
    position: absolute;
    right: 28px;
    bottom: 16px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
    z-index: 4;
}
.lp .lp-gallery-btn {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 8px 16px;
    border-radius: 999px;
    border: 1px solid rgba(17, 20, 24, 0.12);
    background: rgba(255, 255, 255, 0.95);
    color: var(--lp-ink);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
}
.lp .lp-gallery-btn:hover { background: #fff; }
.lp .lp-gallery-btn-strong,
.lp .lp-gallery-btn-strong:hover { background: var(--lp-ink); color: #fff; border-color: var(--lp-ink); }

/* Dezenter Zoom beim Überfahren (nur Geräte mit Maus, nicht bei reduzierter Bewegung).
   overflow:hidden der Kachel hält das Bild im Rahmen. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .lp .lp-grid .grid-item img {
        transition: opacity 0.3s ease, transform 0.6s cubic-bezier(0.2, 0.7, 0.2, 1), filter 0.3s ease;
        will-change: transform;
    }
    .lp .lp-grid .grid-item:hover img.loaded {
        transform: scale(1.045);
        filter: brightness(0.96);
    }
}

.lp .lp-carousel { display: none; }

@media (max-width: 768px) {
    .lp .image-grid-container.lp-gallery { padding: 0; }
    .lp .lp-grid { display: none; }
    .lp .lp-carousel { display: block; position: relative; }
    .lp .lp-carousel-track {
        display: flex;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .lp .lp-carousel-track::-webkit-scrollbar { display: none; }
    .lp .lp-carousel-slide {
        position: relative;
        flex: 0 0 100%;
        scroll-snap-align: start;
        aspect-ratio: 4 / 3;
        max-height: 68vh;
        background: #e9ebee;
    }
    .lp .lp-carousel-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }
    .lp .lp-carousel-counter {
        position: absolute;
        left: 12px;
        bottom: 12px;
        background: rgba(17, 20, 24, 0.78);
        color: #fff;
        font-size: 13px;
        font-weight: 600;
        padding: 4px 10px;
        border-radius: 999px;
        pointer-events: none;
    }
    .lp .lp-carousel .ai-image-badge { bottom: 44px; }
    .lp .lp-gallery-actions { right: 12px; bottom: 12px; }
    .lp .lp-gallery-btn { min-height: 36px; padding: 6px 12px; font-size: 13px; }
    /* „Alle Fotos" ist mobil durch das Wischen + Zähler überflüssig */
    .lp .lp-gallery-actions .lp-gallery-btn:first-child { display: none; }
}

/* =============================================================
   Seitengerüst
   ============================================================= */
.lp .landing-container { max-width: 1200px; padding: 28px 20px 40px; }
.lp .landing-layout { gap: 28px; }
.lp .landing-layout.no-aside .landing-main { width: 100%; }
.lp .landing-aside { top: 84px; }

.lp .landing-header,
.lp .landing-section,
.lp .quick-facts,
.lp .contact-box,
.lp .lp-mcontact {
    background: var(--lp-surface);
    border: 1px solid var(--lp-line);
    border-radius: var(--lp-radius);
    box-shadow: var(--lp-shadow);
}

.lp .landing-header,
.lp .landing-section {
    padding: 32px;
    margin-bottom: var(--lp-gap);
}

.lp .landing-section .section-title {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--lp-ink);
    margin: 0 0 20px;
    padding: 0;
    border: 0;
    line-height: 1.3;
}

.lp .lp-section-intro { color: var(--lp-muted); margin: -8px 0 16px; }
.lp .lp-muted { color: var(--lp-muted); font-weight: 400; font-size: 14px; }
.lp .lp-subline { display: block; margin-top: 2px; }

/* =============================================================
   Kopf: Typ, Titel, Preis, Beispielrate, Adresse
   ============================================================= */
.lp .landing-header .landing-objekttyp {
    font-size: 12px;
    letter-spacing: 0.06em;
    color: var(--lp-muted);
    background: #eef0f3;
    border-radius: 6px;
    padding: 5px 10px;
    margin-bottom: 14px;
}
.lp .landing-header .landing-title {
    font-size: 28px;
    line-height: 1.25;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--lp-ink);
    margin: 0 0 18px;
    text-wrap: balance;
}
.lp .lp-price-block { margin-bottom: 18px; }
.lp .landing-header .landing-price {
    font-size: 30px;
    font-weight: 600; /* bewusst nicht fett: Preis ruhig, Titel bleibt das stärkste Element */
    letter-spacing: -0.01em;
    color: var(--lp-ink);
    margin: 0;
    line-height: 1.15;
}
.lp .lp-price-gebot {
    display: inline-block;
    margin-top: 8px;
    padding: 3px 10px;
    border-radius: 6px;
    background: #fff4e0;
    border: 1px solid #f3d29a;
    color: #7a4b00;
    font-size: 14px;
    font-weight: 600;
}
.lp .lp-price-unit { font-size: 18px; font-weight: 500; color: var(--lp-muted); }
.lp .landing-header .landing-price-provision {
    display: block;
    margin: 6px 0 0;
    font-size: 15px;
    color: var(--lp-muted);
}
.lp .lp-rate-teaser {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 10px;
    margin-top: 14px;
    padding: 10px 14px;
    border: 1px solid var(--lp-green-line);
    background: var(--lp-green-soft);
    color: var(--lp-ink);
    border-radius: 10px;
    font-size: 15px;
    cursor: pointer;
    text-align: left;
}
.lp .lp-rate-teaser strong { font-weight: 700; }
.lp .lp-rate-teaser-more { color: var(--lp-green); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.lp .lp-rate-teaser:hover { border-color: var(--lp-green); }
.lp .lp-rate-footnote { font-size: 12px; color: var(--lp-muted); margin-top: 6px; max-width: 60ch; line-height: 1.5; }

.lp .landing-header .landing-location {
    font-size: 16px;
    color: var(--lp-text);
    margin: 0 0 10px;
    align-items: flex-start;
}
.lp .landing-location svg { flex-shrink: 0; margin-top: 3px; color: var(--lp-muted); }
.lp .lp-badges { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 10px; }
.lp .landing-header .landing-badge {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    color: #0b5a40;
    background: var(--lp-green-soft);
    border: 1px solid var(--lp-green-line);
    padding: 4px 12px;
}
.lp .landing-header .landing-objekt-id { font-size: 13px; color: var(--lp-muted); font-weight: 500; }

.lp .usp-chips { list-style: none; padding: 0; margin: 18px 0 0; }
.lp .usp-chip {
    font-size: 14px;
    font-weight: 600;
    color: #0b5a40;
    background: var(--lp-green-soft);
    border: 1px solid var(--lp-green-line);
    padding: 5px 12px;
}

/* Signal-Leiste: Desktop umbrechen (nie abgeschnitten), mobil eine wischbare Zeile */
.lp .signal-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 14px;
    padding: 2px;
}
@media (max-width: 899px) {
    .lp .signal-bar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
}
/* Ansprechpartner-Box beginnt bündig mit der Kopf-Karte, nicht mit der Signal-Leiste.
   Der Abstand wird per JS gesetzt (nur wenn es Signale gibt), siehe landing-render.js. */
.lp .landing-aside { margin-top: var(--lp-signal-offset, 0px); }
.lp .signal-bar::-webkit-scrollbar { display: none; }
.lp .signal-badge { flex: 0 0 auto; font-size: 13px; padding: 5px 14px 5px 5px; gap: 8px; }
.lp .signal-badge-icon { width: 26px; height: 26px; }
.lp .signal-badge-icon svg { width: 14px; height: 14px; }

/* =============================================================
   Kennzahlen
   ============================================================= */
.lp .quick-facts {
    grid-template-columns: repeat(auto-fit, minmax(104px, 1fr));
    padding: 18px 10px;
    margin-bottom: var(--lp-gap);
}
.lp .quick-fact-icon { color: var(--lp-green); }
.lp .quick-fact-value { font-size: 18px; color: var(--lp-ink); }
.lp .quick-fact-label { font-size: 13px; color: var(--lp-muted); }
.lp .quick-fact + .quick-fact::before { border-left-color: var(--lp-line); }

/* =============================================================
   Kompakter Ansprechpartner (nur mobil)
   ============================================================= */
.lp .lp-mcontact { display: none; }
.lp .lp-avatar {
    width: 96px;
    height: 96px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    border: 3px solid #fff;
    box-shadow: 0 0 0 1px var(--lp-line);
}
.lp .lp-avatar-ph {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e9ebee;
    color: var(--lp-muted);
    font-weight: 700;
    font-size: 22px;
}
.lp .lp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    border: 1px solid transparent;
    cursor: pointer;
}
.lp .lp-btn-dark,
.lp .lp-btn-dark:hover,
.lp .lp-btn-dark:focus { background: var(--lp-ink); color: #fff; }
.lp .lp-btn-mint,
.lp .lp-btn-mint:hover,
.lp .lp-btn-mint:focus { background: var(--lp-mint); color: var(--lp-ink); }
.lp .lp-btn-light,
.lp .lp-btn-light:hover,
.lp .lp-btn-light:focus { background: #fff; color: var(--lp-ink); border-color: var(--lp-line); }

@media (max-width: 899px) {
    .lp .lp-mcontact {
        display: block;
        padding: 16px;
        margin-bottom: var(--lp-gap);
    }
    .lp .lp-mcontact-head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
    .lp .lp-mcontact .lp-avatar { width: 52px; height: 52px; border-width: 2px; }
    .lp .lp-mcontact .lp-avatar-ph { font-size: 17px; }
    .lp .lp-mcontact-name { font-weight: 700; color: var(--lp-ink); font-size: 16px; line-height: 1.3; }
    .lp .lp-mcontact-pos { font-size: 14px; color: var(--lp-muted); }
    .lp .lp-mcontact-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
    .lp .lp-mcontact-actions .lp-btn { padding: 10px 6px; font-size: 14px; }
}

/* =============================================================
   Daten-Raster (Objektdaten, Kosten, Energie …)
   ============================================================= */
.lp .details-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 18px 24px;
    margin: 0;
}
.lp .detail-item { gap: 2px; }
.lp .detail-item .detail-label { font-size: 14px; color: var(--lp-muted); font-weight: 500; }
.lp .detail-item .detail-value { font-size: 17px; font-weight: 650; color: var(--lp-ink); line-height: 1.4; }

/* =============================================================
   Fließtexte + „Weiterlesen"
   ============================================================= */
.lp .landing-section .description-text {
    font-size: 17px;
    line-height: 1.7;
    color: var(--lp-text);
    max-width: 72ch;
}
.lp .description-text--html { white-space: normal; }
/* Importierte Texte bringen p/span/li mit eigener Größe mit (guideline.css setzt
   z. B. p auf 14 px) → alles im Textblock erbt die Größe des Blocks. */
.lp .description-text :is(p, li, span, div, strong, b, em, i, u, h4, h5, h6) {
    font-size: inherit;
    line-height: inherit;
}
.lp .description-text :is(h4, h5, h6) { font-weight: 700; margin: 16px 0 6px; }
.lp .description-text p { margin: 0 0 12px; }
.lp .description-text a { color: var(--lp-green); text-decoration: underline; }
.lp .description-text ul,
.lp .description-text ol { padding-left: 24px; margin: 8px 0 12px; list-style-position: outside; }
.lp .description-text ul { list-style-type: disc; }
.lp .description-text ol { list-style-type: decimal; }
.lp .description-text li { display: list-item; margin: 0 0 4px; padding-left: 2px; }

.lp .lp-collapsible { position: relative; }
.lp .lp-collapsible.is-collapsed {
    max-height: var(--lp-collapse-h, 420px);
    overflow: hidden;
}
.lp .lp-collapsible.is-collapsed::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 96px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 85%);
    pointer-events: none;
}
.lp .lp-readmore {
    margin-top: 10px;
    min-height: 44px;
    padding: 8px 18px;
    border-radius: 999px;
    border: 1px solid var(--lp-line);
    background: #fff;
    color: var(--lp-ink);
    font-weight: 600;
    font-size: 15px;
    cursor: pointer;
}
.lp .lp-readmore:hover { border-color: var(--lp-ink); }

/* =============================================================
   Rundgang / Video
   ============================================================= */
.lp .lp-embed {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border-radius: 12px;
    overflow: hidden;
    background: #e9ebee;
    margin-bottom: 12px;
}
.lp .lp-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.lp .virtual-tours-container,
.lp .videos-container { display: block; }
.lp .tour-link-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 16px;
    border-radius: 10px;
    border: 1px solid var(--lp-line);
    background: #fff;
    color: var(--lp-ink);
    font-weight: 600;
    text-decoration: none;
    margin: 0 8px 8px 0;
}
.lp .tour-link-btn:hover { border-color: var(--lp-ink); color: var(--lp-ink); }
@media (max-width: 768px) {
    .lp .lp-embed-tour { aspect-ratio: 4 / 3; }
}

/* =============================================================
   Grundrisse
   ============================================================= */
.lp .lp-grundriss-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 16px;
}
.lp .lp-grundriss-grid .grundriss-wrapper {
    display: block;
    padding: 12px;
    min-height: 0;
    background: #fff;
    border: 1px solid var(--lp-line);
    border-radius: 12px;
    cursor: zoom-in;
}
.lp .lp-grundriss-grid .grundriss-wrapper img {
    width: 100%;
    height: auto;
    border: 0;
    opacity: 1;
    display: block;
}

/* =============================================================
   Ausstattung (Häkchen-Raster + Details + Text)
   ============================================================= */
.lp .ausstattung-list {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    border: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 8px;
}
.lp .ausstattung-item {
    background: #f6f7f9;
    border-radius: 8px;
    padding: 9px 12px;
    font-size: 15px;
    color: var(--lp-ink);
}
.lp .ausstattung-item::before { color: var(--lp-green); }
.lp .lp-ausstattung-details { margin-bottom: 20px; }

/* =============================================================
   Kosten & Provision
   ============================================================= */
.lp .lp-kaufnebenkosten {
    margin-top: 20px;
    padding: 14px 16px;
    background: #f6f7f9;
    border-radius: 10px;
}
.lp .lp-kaufnebenkosten-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 16px;
    color: var(--lp-ink);
    margin-bottom: 4px;
}
.lp .lp-provision {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--lp-line);
    font-size: 16px;
    color: var(--lp-text);
}
.lp .lp-provision-hint { margin-top: 8px; font-size: 14px; color: var(--lp-muted); }

/* =============================================================
   Energieausweis — lesbare Schrift auf hellen Klassenfarben
   ============================================================= */
.lp .lp-energy-status { color: var(--lp-muted); margin: 0 0 8px; }
.lp .energy-bar.energy-B,
.lp .energy-bar.energy-C,
.lp .energy-bar.energy-D,
.lp .energy-bar.energy-E { color: #111418; }
.lp .energy-bar.active { box-shadow: inset 0 0 0 3px rgba(17, 20, 24, 0.85); }
.lp .energy-scale-ticks,
.lp .energy-labels { color: var(--lp-muted); font-size: 12px; }

/* =============================================================
   Sonstiges & rechtliche Hinweise (eingeklappt)
   ============================================================= */
.lp .lp-legal details > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.lp .lp-legal details > summary::-webkit-details-marker { display: none; }
.lp .lp-legal details > summary .section-title { margin: 0; font-size: 18px; }
.lp .lp-legal details > summary::after {
    content: '';
    width: 10px;
    height: 10px;
    border-right: 2px solid var(--lp-ink);
    border-bottom: 2px solid var(--lp-ink);
    transform: rotate(45deg);
    transition: transform 0.2s;
    flex-shrink: 0;
    margin-right: 4px;
}
.lp .lp-legal details[open] > summary::after { transform: rotate(-135deg); }
.lp .lp-legal details[open] > summary { margin-bottom: 16px; }
.lp .lp-legal .description-text { font-size: 15px; color: var(--lp-muted); }

/* =============================================================
   Ansprechpartner-Box (Seitenspalte)
   ============================================================= */
.lp .contact-box { padding: 26px 22px; margin-top: 0; }
.lp .contact-box .contact-title { font-size: 17px; font-weight: 700; color: var(--lp-ink); margin-bottom: 18px; }
.lp .contact-box .contact-name { font-size: 18px; font-weight: 700; color: var(--lp-ink); }
.lp .contact-box .contact-position { color: var(--lp-muted); }
.lp .contact-box .contact-item { font-size: 15px; }
.lp .contact-box .contact-item a { color: var(--lp-ink); }
.lp .contact-vcard { color: var(--lp-green); }
.lp .contact-trust { color: var(--lp-muted); font-size: 13px; }
.lp .contact-btn { min-height: 46px; font-size: 15px; }

/* =============================================================
   Sticky-Leiste: Termin ist die Hauptaktion, sobald möglich
   ============================================================= */
.lp .landing-sticky-cta { border-color: var(--lp-line); }
.lp .landing-sticky-price { color: var(--lp-ink); }
.lp .landing-sticky-btn-call,
.lp .landing-sticky-btn-mail,
.lp .landing-sticky-btn-term { min-height: 40px; }
.lp .landing-sticky-cta.has-term .landing-sticky-btn-call,
.lp .landing-sticky-cta.has-term .landing-sticky-btn-call:hover,
.lp .landing-sticky-cta.has-term .landing-sticky-btn-call:focus { background: #f0f1f3; color: var(--lp-ink); }
.lp .landing-sticky-cta.has-term .landing-sticky-btn-term,
.lp .landing-sticky-cta.has-term .landing-sticky-btn-term:hover,
.lp .landing-sticky-cta.has-term .landing-sticky-btn-term:focus { background: var(--lp-mint); color: var(--lp-ink); }
@media (max-width: 768px) {
    .lp .landing-sticky-cta.has-term .landing-sticky-btn-mail { display: none; }
}

/* =============================================================
   Finanzierung / Rendite / Besichtigung — Kontrast-Korrekturen
   ============================================================= */
.lp .finance-disclaimer { font-size: 12px; color: var(--lp-muted); line-height: 1.55; }
.lp .poi-hint { color: var(--lp-muted); }
.lp .finance-cta-btn,
.lp .finance-cta-btn:hover,
.lp .finance-cta-btn:focus { color: var(--lp-ink); }
.lp .viewing-booking-section { border-color: var(--lp-green-line); }

/* =============================================================
   Gebäude (3D) — Rahmen; der Viewer selbst bringt landing-building-3d.css mit
   ============================================================= */
.lp .lp-building-holder { min-height: 120px; }

/* =============================================================
   Formularfelder auf den LPs (Besichtigung): theme.css setzt Rahmen #e0e0e0
   (1,3:1) mit sehr spezifischem Selektor → hier lesbarer Rahmen (3:1).
   ============================================================= */
.lp .viewing-form-input:not(#lp-x),
.lp .finance-bundesland select:not(#lp-x) {
    border: 1px solid #8a929c;
    font-size: 16px; /* iOS zoomt sonst beim Fokus */
}

/* =============================================================
   Fuß: Hinweise, Footer
   ============================================================= */
.lp .landing-disclaimer {
    max-width: 1200px;
    margin: 8px auto 0;
    padding: 0 20px;
}
.lp .landing-disclaimer-text {
    font-size: 13px;
    line-height: 1.6;
    color: var(--lp-muted);
    text-align: left;
    margin: 0;
}
.lp .landing-footer { background: var(--lp-ink); margin-top: 32px; padding: 28px 20px 96px; }
.lp .landing-footer .footer-text { color: #c9ced6; font-size: 14px; }
.lp .landing-footer a,
.lp .landing-footer a:hover { color: #fff; text-decoration: underline; }
.lp .lp-error-link { color: var(--lp-green); text-decoration: underline; }
.lp .loading { color: var(--lp-muted); }

/* =============================================================
   Mobil
   ============================================================= */
@media (max-width: 768px) {
    body.lp { --lp-gap: 16px; }
    .lp .landing-logo-header { padding: 12px 0; }
    .lp .landing-logo { width: 150px; }
    .lp .landing-container { padding: 16px 16px 32px; }
    .lp .landing-header,
    .lp .landing-section { padding: 22px 18px; }
    .lp .landing-header .landing-title { font-size: 22px; margin-bottom: 14px; }
    .lp .landing-header .landing-price { font-size: 26px; }
    .lp .landing-section .section-title { font-size: 19px; margin-bottom: 16px; }
    .lp .landing-section .description-text { font-size: 16px; }
    .lp .details-grid { grid-template-columns: 1fr 1fr; gap: 14px 16px; }
    .lp .detail-item .detail-value { font-size: 16px; }
    .lp .detail-item .detail-label { font-size: 13px; }
    .lp .quick-facts { grid-template-columns: repeat(3, 1fr); padding: 14px 6px; }
    .lp .quick-fact-value { font-size: 16px; }
    .lp .ausstattung-list { grid-template-columns: 1fr 1fr; }
    .lp .ausstattung-item { font-size: 14px; padding: 8px 10px; }
    .lp .lp-kaufnebenkosten-head { flex-direction: column; gap: 0; }
    .lp .contact-box { margin-bottom: var(--lp-gap); }
}

@media (max-width: 380px) {
    .lp .details-grid { grid-template-columns: 1fr; }
    .lp .ausstattung-list { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .lp * { scroll-behavior: auto !important; }
}

@media print {
    .lp .landing-sticky-cta,
    .lp .lp-gallery-actions,
    .lp .lp-readmore { display: none !important; }
    .lp .lp-collapsible.is-collapsed { max-height: none; overflow: visible; }
    .lp .lp-collapsible.is-collapsed::after { display: none; }
}