/* Karte "Große Reichweite" (Runde 8): selbst gezeichnete Deutschlandkarte, Bamberg als Mitte.
   Ohne JS und mit prefers-reduced-motion steht sie fertig gezeichnet da; die Zeichen-Animation
   startet nur, wenn reichweite.js .rw--js setzt und die Karte ins Bild kommt. */
.scard__pic--karte{background:color-mix(in srgb,var(--a1,#1C4A33) 70%,var(--bg,#0E1A13))}
.scard__pic--karte::after{display:none}
.rw__svg{position:absolute;inset:0;width:100%;height:100%;display:block;padding:clamp(.6rem,2vw,1.4rem)}
.rw__de{fill:color-mix(in srgb,var(--a2,#2E6B48) 55%,transparent);stroke:color-mix(in srgb,var(--ink,#EFEBE1) 45%,transparent);stroke-width:1.1;stroke-linejoin:round}
.rw__ln{fill:none;stroke:var(--accent,#C9AA70);stroke-width:1.3;stroke-linecap:round;opacity:.85}
.rw__pt{fill:var(--ink,#EFEBE1)}
.rw__pt--n{fill:var(--accent,#C9AA70)}
.rw__home{fill:var(--accent,#C9AA70);stroke:var(--bg,#0E1A13);stroke-width:2}
.rw__ring{fill:none;stroke:var(--accent,#C9AA70);stroke-width:1.5;transform-box:fill-box;transform-origin:center;opacity:0}
@media (prefers-reduced-motion:no-preference){
  .rw--js .rw__de{opacity:0;transition:opacity .9s var(--ease,ease)}
  .rw--js .rw__ln{stroke-dasharray:1;stroke-dashoffset:1}
  .rw--js .rw__pt{opacity:0;transform-box:fill-box;transform-origin:center;transform:scale(.2)}
  .rw--js .rw__home{opacity:0}
  .rw--in.rw--js .rw__de{opacity:1}
  .rw--in.rw--js .rw__home{opacity:1;transition:opacity .5s var(--ease,ease) .5s}
  .rw--in.rw--js .rw__ln{stroke-dashoffset:0;transition:stroke-dashoffset 1.1s var(--ease-std,ease) calc(.9s + var(--k,0) * .12s)}
  .rw--in.rw--js .rw__pt{opacity:1;transform:none;transition:opacity .4s ease calc(1.6s + var(--k,0) * .12s),transform .5s var(--ease,ease) calc(1.6s + var(--k,0) * .12s)}
  .rw--in .rw__ring{animation:rw-ring 3.2s ease-out 2.6s infinite}
  .rw--in .rw__ring--2{animation-delay:4.2s}
}
@keyframes rw-ring{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(7)}}
