/* Ligo Ground – Karte, Projektseite, Formulare. Baut auf den Variablen und Bausteinen des
   LIGO-CUBE-Themes 2.0 auf (eckig, viel Weiß, dünne Versal-Überschriften). */

.lg-status { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--lc-ink-2); }
.lg-status i { width: 9px; height: 9px; background: var(--pin, var(--lc-ink)); flex: none; }

/* ---------- Filter ---------- */
.lg-filter { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--lc-gutter)) 16px; padding: 0 var(--lc-gutter) 2px; }
.lg-filter::-webkit-scrollbar { display: none; }
.lg-filter__chip { flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 8px 14px; border: 1px solid var(--lc-line-2); background: #fff; font-size: 12px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--lc-ink-2); cursor: pointer; border-radius: 0; }
.lg-filter__chip i { width: 9px; height: 9px; background: var(--pin); }
.lg-filter__chip span { color: var(--lc-ink-3); letter-spacing: 0; }
.lg-filter__chip:hover { border-color: var(--lc-ink); color: var(--lc-ink); }
.lg-filter__chip.is-aktiv { background: var(--lc-ink); border-color: var(--lc-ink); color: #fff; }
.lg-filter__chip.is-aktiv span { color: rgba(255, 255, 255, 0.6); }

/* ---------- Raster Karte + Liste ---------- */
.lg-uebersicht__raster { display: grid; gap: 20px; }
@media (min-width: 1024px) {
	.lg-uebersicht__raster { grid-template-columns: minmax(0, 1fr) 360px; align-items: start; }
	.lg-liste { max-height: min(76vh, 760px); overflow-y: auto; }
}

/* ---------- Karte ---------- */
.lg-karte { position: relative; }
.lg-karte__buehne { position: relative; overflow: hidden; border: 1px solid var(--lc-line); background: #eef1f1; aspect-ratio: 4 / 5; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
@media (min-width: 640px) { .lg-karte__buehne { aspect-ratio: 1 / 1; } }
@media (min-width: 1024px) { .lg-karte--gross .lg-karte__buehne { aspect-ratio: auto; height: min(76vh, 760px); } }
.lg-karte--lage .lg-karte__buehne { aspect-ratio: 5 / 4; }
.lg-karte__svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; cursor: grab; }
.lg-karte.is-ziehen .lg-karte__svg { cursor: grabbing; }

.lg-k-meer { fill: #eef1f1; }
.lg-k-nachbarn path { fill: #f6f5f2; stroke: #d9d6cf; stroke-width: 0.6; vector-effect: non-scaling-stroke; }
.lg-k-de { fill: #fff; }
.lg-k-laender path { fill: transparent; stroke: #cfccc6; stroke-width: 0.8; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.lg-k-laender path.is-bayern { fill: #f9f7f1; }
.lg-k-laender path:hover { fill: #f7f6f2; }
.lg-k-de-rand { fill: none; stroke: #8c8b87; stroke-width: 1.2; vector-effect: non-scaling-stroke; stroke-linejoin: round; pointer-events: none; }
.lg-k-seen path { fill: #dde6e8; stroke: none; }
.lg-k-fluesse path { fill: none; stroke: #b9d0d7; stroke-width: 1.8; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; }
.lg-k-orte circle { fill: #8c8b87; }
.lg-k-orte text { font-family: var(--lc-font); font-size: 12px; fill: #5d5d5a; paint-order: stroke; stroke: rgba(255, 255, 255, 0.9); stroke-width: 3px; stroke-linejoin: round; }
.lg-k-orte g.is-klein, .lg-k-orte g.is-verdeckt { display: none; }

.lg-pin { cursor: pointer; outline: none; }
.lg-pin__form { fill: var(--pin, var(--lc-ink)); stroke: #fff; stroke-width: 2; transition: transform 0.15s; }
.lg-pin__kern { fill: #fff; }
.lg-pin__ring { fill: var(--pin); opacity: 0; transform-box: fill-box; transform-origin: center; }
.lg-pin__name { font-family: var(--lc-font); font-size: 13px; font-weight: 700; fill: var(--lc-ink); paint-order: stroke; stroke: #fff; stroke-width: 4px; stroke-linejoin: round; letter-spacing: 0.02em; }
.lg-karte--lage .lg-pin__name { display: none; }
.lg-pin:hover .lg-pin__form, .lg-pin:focus-visible .lg-pin__form, .lg-pin.is-aktiv .lg-pin__form { stroke: var(--lc-ink); stroke-width: 2.5; }
.lg-pin:focus-visible .lg-pin__ring, .lg-pin.is-aktiv .lg-pin__ring { opacity: 0.22; }
.lg-pin.is-aktiv .lg-pin__ring { animation: lg-puls 1.8s ease-out infinite; }
.lg-pin.is-aus { display: none; }
@keyframes lg-puls { 0% { transform: scale(0.6); opacity: 0.35; } 100% { transform: scale(1.4); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .lg-pin.is-aktiv .lg-pin__ring { animation: none; } }

.lg-karte__knoepfe { position: absolute; top: 12px; right: 12px; display: grid; gap: 6px; z-index: 2; }
.lg-karte__knopf { width: 40px; height: 40px; border: 1px solid var(--lc-line-2); background: #fff; font-size: 20px; line-height: 1; color: var(--lc-ink); cursor: pointer; border-radius: 0; display: grid; place-items: center; padding: 0; }
.lg-karte__knopf:hover { border-color: var(--lc-ink); }
.lg-karte__knopf--text { width: auto; padding: 0 10px; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; }
.lg-karte--lage .lg-karte__knopf--text { display: none; }
.lg-karte__quelle { margin: 8px 0 0; font-size: 12px; color: var(--lc-ink-3); }

/* Vorschau: am Handy als Blatt unten in der Karte, am Rechner als Karte links unten */
.lg-vorschau { position: absolute; z-index: 3; left: 10px; right: 10px; bottom: 10px; background: #fff; border: 1px solid var(--lc-ink); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12); display: grid; grid-template-columns: 112px 1fr; animation: lg-rein 0.18s ease-out; }
.lg-vorschau[hidden] { display: none; }
@media (min-width: 640px) { .lg-vorschau { left: 16px; right: auto; bottom: 16px; width: 340px; grid-template-columns: 1fr; } }
@keyframes lg-rein { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
.lg-vorschau__bild { background: var(--lc-bg-2); }
.lg-vorschau__bild img { width: 100%; height: 100%; object-fit: cover; aspect-ratio: auto; }
@media (min-width: 640px) { .lg-vorschau__bild img { aspect-ratio: 16 / 9; height: auto; } }
.lg-vorschau__body { padding: 12px 14px 14px; display: grid; gap: 4px; min-width: 0; }
.lg-vorschau__titel { font-family: var(--lc-title); font-weight: 300; font-size: 20px; text-transform: uppercase; line-height: 1.05; margin: 2px 0 0; }
.lg-vorschau__ort { font-size: 13px; color: var(--lc-ink-2); }
.lg-vorschau__zahlen { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; margin-top: 2px; }
.lg-vorschau__zahlen strong { font-weight: 700; }
.lg-vorschau .lc-btn { margin-top: 8px; min-height: 42px; padding: 8px 14px; font-size: 12px; }
.lg-vorschau__zu { position: absolute; top: 4px; right: 4px; width: 36px; height: 36px; border: 0; background: rgba(255, 255, 255, 0.92); font-size: 22px; line-height: 1; cursor: pointer; color: var(--lc-ink); }

/* ---------- Liste ---------- */
.lg-liste { display: grid; gap: 10px; align-content: start; }
.lg-liste__item { display: grid; grid-template-columns: 96px 1fr 20px; gap: 14px; align-items: center; padding: 10px; border: 1px solid var(--lc-line); text-decoration: none; background: #fff; transition: border-color 0.15s; }
.lg-liste__item:hover, .lg-liste__item.is-aktiv { border-color: var(--lc-ink); }
.lg-liste__item.is-aus { display: none; }
.lg-liste__bild img, .lg-liste__bild .lc-placeholder { width: 96px; height: 72px; aspect-ratio: auto; object-fit: cover; }
.lg-liste__bild .lc-placeholder .lc-icon { width: 24px; height: 24px; }
.lg-liste__text { display: grid; gap: 3px; min-width: 0; }
.lg-liste__titel { font-family: var(--lc-title); font-weight: 300; font-size: 19px; text-transform: uppercase; line-height: 1.1; }
.lg-liste__ort { display: flex; align-items: center; gap: 4px; font-size: 13px; color: var(--lc-ink-2); }
.lg-liste__ort .lc-icon { width: 14px; height: 14px; }
.lg-liste__zahlen { display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 13px; }
.lg-liste__pfeil .lc-icon { width: 18px; height: 18px; }

/* ---------- Wege: kein Grundstück / Grundstück frei ---------- */
.lg-wege__raster { display: grid; gap: 1px; background: var(--lc-line); border: 1px solid var(--lc-line); }
@media (min-width: 768px) { .lg-wege__raster { grid-template-columns: 1fr 1fr; } }
.lg-weg { background: #fff; padding: clamp(22px, 3vw, 36px); display: grid; gap: 10px; align-content: start; }
.lg-weg > .lc-icon { width: 34px; height: 34px; color: var(--lc-red); }
.lg-weg .lc-h3 { margin: 4px 0 0; }
.lg-weg p { margin: 0; }
.lg-weg .lc-link { justify-self: start; margin-top: 6px; }

/* ---------- Pacht und Anfrage ---------- */
.lg-pacht__raster { display: grid; gap: clamp(32px, 5vw, 64px); }
@media (min-width: 1024px) { .lg-pacht__raster { grid-template-columns: 1fr 1fr; align-items: start; } }
.lg-pacht__punkte { margin-top: 24px; }
.lg-pacht__schritte { margin-top: 28px; }
.lg-pacht__formular { background: #fff; border: 1px solid var(--lc-line); padding: clamp(20px, 3vw, 36px); }
.lg-pacht__formular > .lc-h3 { margin-bottom: 18px; }
@media (min-width: 640px) { .lg-form .lc-form__grid { grid-template-columns: 1fr 1fr; } .lg-form .lc-form__field--wide { grid-column: 1 / -1; } }
.lg-kontakt { list-style: none; padding: 0; margin: 24px 0 0; display: grid; gap: 10px; }
.lg-kontakt li { display: flex; align-items: center; gap: 10px; }
.lg-kontakt a { text-decoration: none; }
.lg-kontakt a:hover { text-decoration: underline; }

/* ---------- Projektseite ---------- */
.lg-kopf__zeile { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; margin: 18px 0 0; }
.lg-kopf__ort { display: inline-flex; align-items: center; gap: 6px; color: var(--lc-ink-2); }
.lg-kopf__ort .lc-icon { width: 18px; height: 18px; }
.lg-kopf__bild figcaption { padding: 10px 0 0; font-size: 13px; color: var(--lc-ink-3); background: #fff; }
.lg-kopf__bild img { aspect-ratio: 16 / 9; }
@media (min-width: 900px) { .lg-kopf__bild img { aspect-ratio: 21 / 9; } }

.lg-facts { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 900px) { .lg-facts { grid-template-columns: repeat(4, 1fr); } }
.lg-facts dt small { color: var(--lc-ink-3); }
.lg-facts__klein { font-size: clamp(20px, 2.2vw, 28px) !important; }
.lg-facts__mittel { font-size: clamp(26px, 3vw, 40px) !important; white-space: nowrap; }
.lg-facts .lc-offen { font-size: 14px; }
.lg-eckdaten__knoepfe .lc-btn .lc-icon { width: 18px; height: 18px; }

.lg-info__raster { display: grid; gap: clamp(32px, 5vw, 72px); }
@media (min-width: 1024px) { .lg-info__raster { grid-template-columns: 1.1fr 1fr; } }
.lg-prose p { font-size: clamp(17px, 1.5vw, 19px); line-height: 1.6; }
.lg-info__specs { margin-top: 24px; }
.lg-lage__text { margin-top: 18px; color: var(--lc-ink-2); }

.lg-objekte__raster { grid-template-columns: 1fr; }
@media (min-width: 720px) { .lg-objekte__raster { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .lg-objekte__raster--3 { grid-template-columns: repeat(3, 1fr); } }
.lg-objekt__status { display: inline-flex !important; align-items: center; gap: 6px; }
.lg-objekt__status::before { content: ''; width: 8px; height: 8px; background: var(--badge); }
.lg-objekt__media { position: relative; display: block; cursor: zoom-in; }
.lg-objekt__media.is-plan { background: #fff; border-bottom: 1px solid var(--lc-line); }
.lg-objekt__media.is-plan img { object-fit: contain; padding: 46px 14px 14px; }
.lg-objekt__zahl { position: absolute; right: 10px; bottom: 10px; display: inline-flex; align-items: center; gap: 6px; padding: 4px 8px; background: rgba(255, 255, 255, 0.94); border: 1px solid var(--lc-line); font-size: 12px; }
.lg-objekt__zahl .lc-icon { width: 14px; height: 14px; }
.lg-objekt__text p { margin: 0; }
.lg-objekt--verkauft .lc-model__media img { filter: grayscale(1); opacity: 0.7; }
.lg-platzhalter { height: 100%; display: grid; place-content: center; justify-items: center; gap: 8px; color: var(--lc-ink-3); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; }
.lg-raeume { margin: 0 0 16px; border-top: 1px solid var(--lc-line); }
.lg-raeume summary { cursor: pointer; padding: 10px 0; font-size: 12.5px; letter-spacing: 0.12em; text-transform: uppercase; list-style: none; display: flex; justify-content: space-between; align-items: center; }
.lg-raeume summary::-webkit-details-marker { display: none; }
.lg-raeume summary::after { content: '+'; font-size: 20px; line-height: 1; }
.lg-raeume[open] summary::after { content: '−'; }
.lg-raeume__titel { margin: 6px 0 4px; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--lc-ink-3); }
.lg-raeume .lc-specs { margin-bottom: 8px; }
.lg-objekte__hinweis { margin-top: 24px; }

.lg-ausstattung__raster { display: grid; gap: 24px; }
@media (min-width: 900px) { .lg-ausstattung__raster { grid-template-columns: 1fr 1.4fr; } }
@media (min-width: 640px) { .lg-ausstattung__liste { grid-template-columns: 1fr 1fr; column-gap: 32px; } }

/* Galerie: Grundrisse groß ansehen */
.lg-galerie { width: min(1100px, calc(100vw - 24px)); max-height: calc(100vh - 24px); padding: 0; border: 0; background: #fff; }
.lg-galerie::backdrop { background: rgba(20, 20, 18, 0.72); }
.lg-galerie__kopf { position: sticky; top: 0; display: flex; justify-content: space-between; align-items: center; padding: 10px 10px 10px 18px; background: #fff; border-bottom: 1px solid var(--lc-line); z-index: 1; }
.lg-galerie__kopf strong { font-family: var(--lc-title); font-weight: 300; font-size: 22px; text-transform: uppercase; }
.lg-galerie__zu { width: 44px; height: 44px; border: 1px solid var(--lc-line-2); background: #fff; font-size: 24px; cursor: pointer; }
.lg-galerie__bilder { display: grid; gap: 24px; padding: 18px; }
.lg-galerie__bilder img { width: 100%; height: auto; }
.lg-galerie__bilder figcaption { font-size: 13px; color: var(--lc-ink-2); margin-top: 8px; }

.lg-schritte { list-style: none; counter-reset: lg-schritt; padding: 0; margin: 28px 0 0; border-top: 1px solid var(--lc-line); }
.lg-schritte li { counter-increment: lg-schritt; position: relative; padding: 16px 0 16px 52px; border-bottom: 1px solid var(--lc-line); }
.lg-schritte li::before { content: counter(lg-schritt, decimal-leading-zero); position: absolute; left: 0; top: 14px; font-family: var(--lc-title); font-weight: 300; font-size: 28px; line-height: 1; color: var(--lc-red); }
.lg-schritte strong { display: block; font-weight: 700; font-size: 14px; letter-spacing: 0.06em; text-transform: uppercase; }
.lg-schritte span { display: block; font-size: 14px; color: var(--lc-ink-2); margin-top: 4px; }
.lg-ende .lc-endcta { margin-top: 0; }

@media (max-width: 639px) {
	.lg-vorschau { grid-template-columns: 92px 1fr; }
	.lg-vorschau__body { padding: 10px 40px 12px 12px; gap: 2px; }
	.lg-vorschau__titel { font-size: 17px; }
	.lg-vorschau .lg-status { font-size: 10.5px; }
	.lg-vorschau__ort, .lg-vorschau__zahlen { font-size: 12.5px; }
	.lg-vorschau .lc-btn { min-height: 38px; margin-top: 6px; font-size: 11px; }
}