/* Startseite (Stadtplan). Änderungen nur nach Absprache im Issue. */
:root { --bg:#f7f7fb; --ink:#0b1b3f; --muted:#5b6478; --mag:#e6007e; --blue:#0b3a8e; --sky:#3fb6f0; --card:#fff; }
@media (prefers-color-scheme: dark) { :root { --bg:#0b1020; --ink:#eef1f8; --muted:#a3abc2; --card:#141a2e; } }
* { box-sizing:border-box; }
body { margin:0; font-family: system-ui, -apple-system, "Segoe UI", Inter, sans-serif; background:var(--bg); color:var(--ink); }
.kopf { display:flex; flex-direction:column; align-items:center; text-align:center; padding:64px 16px 24px; }
.balken { height:6px; width:min(560px,100%); border-radius:99px; background:linear-gradient(90deg,var(--mag),var(--blue),var(--sky)); margin-bottom:36px; }
h1 { margin:0; font-size:clamp(2.4rem,7vw,4rem); letter-spacing:-.02em; line-height:1.05; }
h1 span { background:linear-gradient(90deg,var(--mag),var(--blue)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.lead { margin:18px 0 0; font-size:1.15rem; color:var(--muted); max-width:560px; line-height:1.55; }
.zahl { color:var(--muted); margin-top:14px; }
.zahl b { color:var(--ink); }
main { max-width:960px; margin:0 auto; padding:16px 16px 40px; }
h2 { font-size:1rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.stadt { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:14px; }
.haus-kachel { display:flex; flex-direction:column; gap:4px; background:var(--card); border-radius:18px; padding:20px 18px; text-decoration:none; color:inherit; box-shadow:0 2px 14px rgba(11,27,63,.06); transition:transform .15s, box-shadow .15s; }
.haus-kachel:hover { transform:translateY(-3px); box-shadow:0 8px 24px rgba(11,27,63,.12); }
.haus-kachel .emoji { font-size:2rem; }
.haus-kachel small { color:var(--muted); line-height:1.4; }
.haus-kachel.neu { border:2px dashed color-mix(in oklab, var(--muted) 40%, transparent); box-shadow:none; background:transparent; }
footer { text-align:center; color:var(--muted); font-size:.85rem; padding:24px 16px 48px; }
footer a { color:inherit; }
