/* Allgäu-Karte (karte.html) */
.km-section{padding:48px 0 72px}
.km-wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,.7fr);border-radius:10px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);background:var(--white)}
.km-mapbox{position:relative;background:#24352B;min-height:620px;overflow:hidden}
.km-mapbox #map{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:manipulation}
.km-mapbox .intro{position:absolute;left:20px;top:18px;z-index:3;max-width:min(70%,420px);pointer-events:none;color:#fff}
.km-mapbox .intro strong{display:block;font-family:var(--font-display);font-size:clamp(1.2rem,2.4vw,1.7rem);line-height:1.15;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.km-mapbox .intro span{display:block;margin-top:6px;font-size:.88rem;opacity:.85;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.km-filters{position:absolute;left:20px;bottom:18px;z-index:3;display:flex;flex-wrap:wrap;gap:8px;max-width:calc(100% - 150px)}
.km-chip{appearance:none;border:1px solid #4a6b57;background:rgba(22,33,26,.8);color:#e9e4d8;padding:8px 14px;border-radius:999px;font:inherit;font-size:.88rem;cursor:pointer;backdrop-filter:blur(6px);transition:background .2s,border-color .2s,color .2s,transform .2s}
.km-chip:hover{border-color:var(--gold);transform:translateY(-1px)}
.km-chip[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:#1d140a;font-weight:600}
.km-reset{position:absolute;right:20px;bottom:18px;z-index:3;appearance:none;border:1px solid var(--gold);background:rgba(22,33,26,.8);color:#e3b56d;padding:8px 14px;border-radius:999px;font:inherit;font-size:.88rem;cursor:pointer;opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .3s,transform .3s}
.km-reset.on{opacity:1;pointer-events:auto;transform:none}
.km-reset:hover{background:var(--gold);color:#1d140a}

/* Karte */
.km-mapbox .pin{cursor:pointer;outline:none;transition:opacity .35s}
.km-mapbox .pin .drop{transform-box:fill-box;transform-origin:50% 100%;animation:kmdrop .7s cubic-bezier(.3,1.5,.5,1) both;animation-delay:var(--d,0s)}
@keyframes kmdrop{from{transform:translateY(-60px) scale(.6);opacity:0}to{transform:none;opacity:1}}
.km-mapbox .pin .head{fill:#C08A3E;stroke:#fff;stroke-width:2;transition:fill .25s}
.km-mapbox .pin .dot{fill:#16211a}
.km-mapbox .pin .badge{fill:#16211a;stroke:#e3b56d;stroke-width:1.5}
.km-mapbox .pin .num{fill:#e3b56d;font-family:var(--font-body);font-size:11px;font-weight:700;text-anchor:middle;dominant-baseline:central}
.km-mapbox .pin .lbl{fill:#fff;font-family:var(--font-body);font-size:13px;font-weight:600;text-anchor:middle;paint-order:stroke;stroke:#16211a;stroke-width:4px;stroke-linejoin:round;letter-spacing:.02em}
.km-mapbox .pin .pulse{fill:none;stroke:#e3b56d;stroke-width:2;transform-box:fill-box;transform-origin:50% 50%;animation:kmpulse 2.6s ease-out infinite;animation-delay:var(--d,0s);opacity:0}
@keyframes kmpulse{0%{transform:scale(.3);opacity:.9}100%{transform:scale(2.6);opacity:0}}
.km-mapbox .pin:hover .head,.km-mapbox .pin:focus-visible .head,.km-mapbox .pin.sel .head{fill:#e3b56d}
.km-mapbox .pin:focus-visible .lbl{stroke:#C08A3E}
.km-mapbox .pin .hover{transform-box:fill-box;transform-origin:50% 100%;transition:transform .25s}
.km-mapbox .pin:hover .hover,.km-mapbox .pin.sel .hover{transform:scale(1.18)}
.km-mapbox .pin.dim{opacity:.22;pointer-events:none;filter:grayscale(1)}
.km-mapbox .cloud{animation:kmdrift 60s linear infinite alternate}
@keyframes kmdrift{from{transform:translateX(-40px)}to{transform:translateX(60px)}}
.km-mapbox .shimmer{animation:kmshimmer 6s ease-in-out infinite alternate}
@keyframes kmshimmer{from{opacity:.75}to{opacity:1}}

/* Panel */
.km-panel{background:var(--parchment);padding:26px 24px 36px;overflow:auto;max-height:720px}
.km-panel h2{font-size:1.45rem;margin:0}
.km-panel .sub{margin:6px 0 0;font-size:.92rem;color:var(--stone)}
.km-panel .place-list{margin-top:18px;display:grid;gap:8px}
.km-panel .place-btn{appearance:none;text-align:left;font:inherit;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;display:flex;justify-content:space-between;align-items:center;gap:10px;cursor:pointer;color:var(--ink);transition:border-color .2s,transform .2s,box-shadow .2s}
.km-panel .place-btn:hover{border-color:var(--gold);transform:translateX(3px);box-shadow:var(--shadow)}
.km-panel .place-btn span{font-size:.85rem;color:var(--stone);white-space:nowrap}
.km-panel .back-link{appearance:none;background:none;border:0;font:inherit;color:var(--gold-deep);cursor:pointer;margin-bottom:12px;padding:0;font-size:.92rem}
.km-panel .back-link:hover{text-decoration:underline}
.km-panel .units{margin-top:18px;display:grid;gap:14px}
.km-unit{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:16px;border-left:4px solid var(--gold);animation:kmrise .45s both;animation-delay:var(--d,0s)}
@keyframes kmrise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.km-unit h3{font-size:1.05rem;margin:0}
.km-unit .meta{font-size:.88rem;color:var(--stone);margin:3px 0 0}
.km-unit .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.km-tag{font-size:.74rem;padding:3px 10px;border-radius:999px;background:var(--parchment-deep);color:var(--ink-soft);font-weight:600}
.km-tag.hund{background:#dfeadd;color:#27442c}
.km-tag.monteur{background:#dde6ec;color:#23404f}
.km-unit .actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.km-btn{display:inline-block;text-decoration:none;padding:9px 16px;border-radius:var(--radius);font-size:.9rem;font-weight:600;transition:transform .2s,background .2s,color .2s}
.km-btn.gold{background:var(--gold);color:#1d140a}
.km-btn.gold:hover{background:var(--gold-deep);color:#fff;transform:translateY(-1px)}
.km-btn.ghost{border:1px solid var(--ink);color:var(--ink)}
.km-btn.ghost:hover{background:var(--ink);color:#fff}
.km-panel .hint{margin-top:22px;font-size:.82rem;color:var(--stone)}

@media (max-width:860px){
  .km-section{padding:28px 0 48px}
  .km-wrap{grid-template-columns:1fr}
  .km-mapbox{height:70vh;min-height:440px}
  .km-panel{max-height:none;padding:22px 16px 32px}
  .km-filters{max-width:calc(100% - 24px);bottom:62px;left:12px}
  .km-reset{right:12px;bottom:14px}
  .km-mapbox .intro{left:14px;top:12px}
}
@media (prefers-reduced-motion:reduce){
  .km-mapbox *,.km-unit{animation:none!important;transition:none!important}
}