:root{
  --bg:#0b0d12; --card:#121623; --muted:#9aa4b2; --text:#e7ecf3; --line:#243047; --accent:#7c9cff;
  --ok:#22c55e; --warn:#f59e0b; --bad:#ef4444;
}
*{box-sizing:border-box}
body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;background:var(--bg);color:var(--text);line-height:1.5}
a{color:inherit;text-decoration:none}
.wrap{max-width:1150px;margin:0 auto;padding:16px}
header{position:sticky;top:0;z-index:10;background:rgba(11,13,18,.82);backdrop-filter: blur(12px);border-bottom:1px solid var(--line)}
.nav{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.brand{font-weight:900;letter-spacing:.2px}
.nav a{padding:10px 12px;border-radius:999px;border:1px solid transparent;color:var(--muted)}
.nav a.active{border-color:rgba(124,156,255,.55);color:var(--text)}
.nav a.cta{border-color:rgba(124,156,255,.65);color:var(--text)}
.hero{padding:54px 0 22px}
.heroGrid{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
@media(max-width:900px){.heroGrid{grid-template-columns:1fr}}
.h1{font-size:40px;line-height:1.1;margin:0}
.sub{color:var(--muted);margin-top:10px;max-width:60ch}
.card{background:linear-gradient(180deg, rgba(18,22,35,.85), rgba(18,22,35,.65));border:1px solid var(--line);border-radius:18px;padding:14px}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.col-8{grid-column:span 8} .col-4{grid-column:span 4} .col-12{grid-column:span 12}
@media(max-width:900px){.col-8,.col-4{grid-column:span 12}}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:transparent;color:var(--text);cursor:pointer}
.btn.primary{border-color:rgba(124,156,255,.65)}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
@media(max-width:700px){.kpis{grid-template-columns:1fr}}
.kpi{border:1px solid var(--line);border-radius:14px;padding:12px}
.kpi .v{font-size:18px;font-weight:800}
.kpi .l{font-size:12px;color:var(--muted)}
.sectionTitle{font-size:22px;margin:0 0 8px}
.muted{color:var(--muted)}
.filterBar{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 16px}
.pill{font-size:12px;padding:7px 10px;border:1px solid var(--line);border-radius:999px;color:var(--muted);cursor:pointer;user-select:none}
.pill.active{border-color:rgba(124,156,255,.65);color:var(--text)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media(max-width:900px){.cards{grid-template-columns:1fr}}
.houseCard{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:rgba(18,22,35,.55)}
.thumb{height:180px;background:#0f1422;border-bottom:1px solid #1d2740;display:flex;align-items:center;justify-content:center;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.houseBody{padding:12px}
.houseBody h3{margin:0 0 6px;font-size:16px}
.metaRow{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:12px}
.price{margin-top:10px;font-weight:900}
.status{margin-top:8px;display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:6px 10px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.dot{width:8px;height:8px;border-radius:999px;background:var(--muted)}
.status.frei{color:#bbf7d0;border-color:rgba(34,197,94,.35)} .status.frei .dot{background:var(--ok)}
.status.reserviert{color:#fde68a;border-color:rgba(245,158,11,.35)} .status.reserviert .dot{background:var(--warn)}
.status.verkauft{color:#fecaca;border-color:rgba(239,68,68,.35)} .status.verkauft .dot{background:var(--bad)}
.footer{border-top:1px solid var(--line);margin-top:28px;padding:18px 0;color:var(--muted);font-size:12px}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(max-width:800px){.gallery{grid-template-columns:1fr}}
.gallery img{width:100%;border-radius:14px;border:1px solid #1d2740}
.twoCol{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:900px){.twoCol{grid-template-columns:1fr}}
.kv{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kv .item{border:1px solid var(--line);border-radius:14px;padding:10px}
.kv .k{font-size:12px;color:var(--muted)}
.kv .v{font-weight:800}
.notice{padding:10px 12px;border:1px dashed rgba(124,156,255,.5);border-radius:14px;color:var(--muted)}
input, textarea, select{width:100%;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#0f1422;color:var(--text);outline:none}
textarea{min-height:96px;resize:vertical}
label{font-size:12px;color:var(--muted)}
.row{display:flex;gap:10px;flex-wrap:wrap}