/* Willkommensfenster für Besucher aus einem Reel (?von=<kurzlink>). Nutzt die Tokens aus site.css. */
.wk{position:fixed;left:0;right:0;bottom:0;z-index:2000;display:flex;justify-content:center;pointer-events:none;
  transform:translateY(105%);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.wk.offen{transform:translateY(0)}
.wk-karte{pointer-events:auto;position:relative;width:100%;max-width:460px;max-height:64vh;overflow:auto;
  background:var(--panel,#1d2329);color:var(--ink,#e8e3d6);border:1px solid var(--line,#2f3a42);border-bottom:0;
  border-radius:22px 22px 0 0;box-shadow:0 -12px 40px rgba(0,0,0,.55);padding:14px 16px calc(12px + env(safe-area-inset-bottom,0px));
  font-family:var(--serif,Georgia,serif)}
.wk-griff{width:44px;height:5px;border-radius:3px;background:var(--line,#2f3a42);margin:0 auto 10px}
.wk-zu{position:absolute;top:10px;right:10px;width:40px;height:40px;border:0;border-radius:50%;background:transparent;
  color:var(--muted,#9aa6ad);font-size:24px;line-height:40px;cursor:pointer}
.wk-zu:focus-visible,.wk-cta:focus-visible,.wk-weiter:focus-visible,.wk-badges a:focus-visible{outline:3px solid var(--gold,#c9a24a);outline-offset:2px}
.wk-kopf{display:flex;align-items:flex-end;gap:10px;margin-top:-4px;padding-right:34px}
.wk-werner{width:92px;height:auto;flex:none;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
.wk-blase{position:relative;flex:1;background:var(--panel2,#232b32);border:1px solid var(--line,#2f3a42);border-radius:16px;
  padding:9px 13px;font-size:17px;line-height:1.3;margin-bottom:12px}
.wk-blase::before{content:"";position:absolute;left:-8px;bottom:16px;width:14px;height:14px;background:inherit;
  border-left:1px solid var(--line,#2f3a42);border-bottom:1px solid var(--line,#2f3a42);transform:rotate(45deg)}
.wk-ki{display:block;font-family:var(--mono,monospace);font-size:11px;color:var(--muted,#9aa6ad);margin-top:4px}
.wk-titel{font-size:23px;line-height:1.15;margin:2px 0 8px;font-weight:700;color:var(--ink,#e8e3d6)}
.wk-fakten{display:flex;flex-wrap:wrap;gap:5px;list-style:none;margin:0 0 12px;padding:0}
.wk-fakten li{font-size:14.5px;background:rgba(201,162,74,.12);border:1px solid rgba(201,162,74,.45);color:var(--ink,#e8e3d6);
  border-radius:999px;padding:4px 10px}
.wk-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;border:0;border-radius:14px;
  background:var(--gold,#c9a24a);color:var(--gold-ink,#1a1206);font:700 18px var(--serif,Georgia,serif);cursor:pointer}
.wk-cta svg{flex:none}
.wk-app{display:flex;gap:12px;align-items:center;margin-top:12px;padding-top:12px;border-top:1px solid var(--line,#2f3a42)}
.wk-handy{width:58px;flex:none;border-radius:12px;border:3px solid #0b0e10;box-shadow:0 4px 14px rgba(0,0,0,.5)}
.wk-app p{margin:0 0 7px;font-size:15px;line-height:1.35}
.wk-app b{color:var(--gold,#c9a24a);font-weight:700}
.wk-badges{display:flex;gap:8px;flex-wrap:wrap}
.wk-badges img{height:38px;width:auto;display:block}
.wk-weiter{display:block;margin:6px auto 0;background:none;border:0;color:var(--muted,#9aa6ad);font:15px var(--serif,Georgia,serif);
  text-decoration:underline;cursor:pointer;min-height:40px}
.wk-quelle{text-align:center;font-family:var(--mono,monospace);font-size:11px;color:var(--muted,#9aa6ad);margin:4px 0 0}
@media (min-width:900px){.wk{justify-content:flex-start;left:16px;bottom:16px}.wk-karte{border-radius:22px;border-bottom:1px solid var(--line,#2f3a42)}}
@media (prefers-reduced-motion:reduce){.wk{transition:none}}
/* „Gefällt dir die Karte?“ für Reel-Besucher (19.10.2026) */
.modal-card.wk-fm{max-width:420px}
.wk-fm .wk-kopf{margin-top:6px;padding-right:0}
.wk-fm .wk-werner{width:78px}
.wk-fm .wk-blase{font-size:16.5px;margin-bottom:8px}
.wk-fm-text{font-size:16px;line-height:1.42;margin:10px 0 12px}
.wk-fm-text b{color:var(--gold,#c9a24a)}
.wk-pro{display:block;width:100%;margin-top:14px;min-height:46px;padding:8px 12px;border:1px solid var(--gold,#c9a24a);border-radius:12px;
  background:linear-gradient(180deg,#2a2118,#211a12);color:var(--gold,#c9a24a);font:700 15px var(--serif,Georgia,serif);cursor:pointer}
.wk-pro:focus-visible{outline:3px solid var(--gold,#c9a24a);outline-offset:2px}
