/* ── KARTE LAYOUT ── */
.karte-wrap {
  display: flex;
  border: 1px solid #ddd8ce;
  margin-top: 48px;
  background: #f9f7f3;
}
.karte-svg-col {
  flex: 1;
  background: #4a7c4a;
}
.karte-svg-col svg {
  width: 100%;
  height: auto;
  display: block;
}
.karte-info-col {
  width: 300px;
  flex-shrink: 0;
  padding: 32px 28px;
  border-left: 1px solid #ddd8ce;
  background: #f9f7f3;
  box-sizing: border-box;
}

/* ── INFO PANEL ── */
.ki-hint {
  font-size: 13px;
  color: #aaa;
  line-height: 1.7;
  margin-top: 16px;
}
.ki-nr {
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #1a7a6a;
  margin-bottom: 8px;
}
.ki-name {
  font-size: 22px;
  color: #1a1814;
  margin-bottom: 20px;
  line-height: 1.2;
  font-family: Georgia, serif;
}
.ki-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 6px;
  margin-bottom: 16px;
}
.ki-cell {
  background: #f0f7f6;
  padding: 9px 11px;
}
.ki-cell-lbl {
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: #999;
  margin-bottom: 3px;
}
.ki-cell-val {
  font-size: 15px;
  color: #1a7a6a;
  font-family: Georgia, serif;
}
.ki-text {
  font-size: 12px;
  color: #6b6560;
  line-height: 1.85;
  border-top: 1px solid #ddd8ce;
  padding-top: 12px;
}
.ki-legende {
  margin-top: 28px;
  border-top: 1px solid #ddd8ce;
  padding-top: 16px;
}
.ki-legende-titel {
  font-size: 9px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #aaa;
  margin-bottom: 10px;
}
.ki-legende-item {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 7px;
  font-size: 12px;
  color: #6b6560;
}
.ki-legende-dot {
  width: 26px;
  height: 11px;
  border-radius: 2px;
  flex-shrink: 0;
}

/* ── SVG SEEN ── */
.see {
  cursor: crosshair;
  transition: filter .15s;
}
.see:hover {
  filter: brightness(1.25) saturate(1.3);
}
.see-aktiv {
  filter: brightness(1.3) saturate(1.4);
  stroke: #fff;
  stroke-width: 2px;
}

/* ── RESPONSIVE ── */
@media (max-width: 800px) {
  .karte-wrap { flex-direction: column; }
  .karte-info-col { width: 100%; border-left: none; border-top: 1px solid #ddd8ce; }
}

#ki-detail { display: none; }
.ki-legende-obere  { background: #2ab8a8; }
.ki-legende-kozjak { background: #1a8878; }
.ki-legende-untere { background: #0e7060; }
.table-scroll { overflow-x: auto; margin-top: 48px; }
.info-grid-mt { margin-top: 56px; }