/* Wander Wonders · Weltkarte */
#ww-globe{--gold:#D4AF62;--gold-dim:rgba(212,175,98,.6);--petrol:#1F5C50;--espresso:#241A10;--parchment:#F2EDE0;
  --serif:'Raleway',system-ui,sans-serif;--sans:'DM Sans',system-ui,sans-serif;
  position:relative;width:100vw;margin-left:calc(50% - 50vw);height:min(88vh,820px);min-height:480px;
  background:#000;color:var(--parchment);font-family:var(--sans);overflow:hidden;-webkit-tap-highlight-color:transparent}
#ww-globe [hidden]{display:none!important}
#ww-globe *,#ww-globe *::before,#ww-globe *::after{box-sizing:border-box}
#ww-globe h1,#ww-globe h2,#ww-globe p{letter-spacing:normal}

#ww-globe .ww-canvas{position:absolute;inset:0;z-index:0}
#ww-globe .masthead{position:absolute;top:18px;left:22px;z-index:5;pointer-events:none;max-width:70%}
#ww-globe .masthead h1{margin:0;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.35rem,3.2vw,2rem);line-height:1.15;color:var(--parchment)}
#ww-globe .masthead h1,#ww-globe .masthead p{text-shadow:0 1px 8px #000}
#ww-globe .masthead p{margin:.35rem 0 0;font-weight:300;font-size:.82rem;color:var(--gold-dim);letter-spacing:.02em}
#ww-globe .filters{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:5;display:flex;gap:6px;padding:5px;border:1px solid rgba(212,175,98,.35);border-radius:999px;background:rgba(0,0,0,.6);backdrop-filter:blur(6px)}
#ww-globe .filters button{font:400 .8rem var(--sans);color:var(--parchment);background:none;border:0;border-radius:999px;padding:.5rem .95rem;cursor:pointer;display:flex;align-items:center;gap:.45rem;opacity:.5;transition:opacity .2s,background .2s}
#ww-globe .filters button[aria-pressed="true"]{opacity:1;background:rgba(212,175,98,.14)}
#ww-globe .filters button:focus-visible,#ww-globe .pin:focus-visible,#ww-globe .card:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
#ww-globe .swatch{width:9px;height:9px;border-radius:50%;background:var(--gold)}
#ww-globe .swatch.book{background:var(--parchment)}
#ww-globe .unused-demo{position:absolute;top:20px;right:22px;z-index:5;font-size:.7rem;color:rgba(242,237,224,.45);font-weight:300}
#ww-globe .pin{pointer-events:auto;cursor:pointer;background:none;border:0;padding:10px;margin:0;transform:translate(-50%,-50%);transition:opacity .25s}
#ww-globe .pin .dot{display:block;width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(212,175,98,.22),0 0 14px rgba(212,175,98,.7);transition:transform .2s}
#ww-globe .pin:hover .dot,#ww-globe .pin.active .dot{transform:scale(1.5)}
#ww-globe .pin.book .dot{width:24px;height:24px;background:var(--parchment);display:grid;place-items:center;box-shadow:0 0 0 2px var(--gold),0 0 16px rgba(242,237,224,.55)}
#ww-globe .pin.book .dot svg{width:14px;height:14px}
#ww-globe .pin.hidden-side{opacity:0;pointer-events:none}
#ww-globe .card{position:absolute;z-index:10;width:270px;background:var(--parchment);color:var(--ink);border-radius:3px;overflow:hidden;cursor:pointer;text-decoration:none;display:block;box-shadow:0 18px 40px rgba(0,0,0,.6);border:1px solid var(--gold);opacity:0;transform:translateY(6px);transition:opacity .18s,transform .18s;pointer-events:none}
#ww-globe .card.show{opacity:1;transform:none;pointer-events:auto}
#ww-globe .card .img{height:120px;overflow:hidden;background:linear-gradient(135deg,var(--petrol),var(--espresso));background-size:cover;background-position:center;position:relative}
#ww-globe .card .img .place{position:absolute;left:14px;bottom:10px;font-family:var(--serif);font-style:italic;color:var(--parchment);font-size:.95rem;text-shadow:0 1px 6px rgba(0,0,0,.6)}
#ww-globe .card .body{padding:13px 15px 15px}
#ww-globe .card .meta{font-size:.72rem;color:#7a6a52;margin:0 0 .3rem}
#ww-globe .card h2{font-family:var(--serif);font-weight:500;font-size:1.12rem;line-height:1.25;margin:0 0 .4rem;color:var(--espresso)}
#ww-globe .card .teaser{font-family:var(--serif);font-size:.86rem;line-height:1.5;margin:0 0 .7rem;color:#4a3d2c}
#ww-globe .card .go{text-decoration:none;font-size:.78rem;font-weight:500;color:var(--petrol)}
@media (hover:none),(max-width:600px){
#ww-globe .card .img{height:88px}
#ww-globe .card{left:12px!important;right:12px;bottom:calc(76px + env(safe-area-inset-bottom,0px));top:auto!important;width:auto;max-width:460px;margin:0 auto}
}
@media (prefers-reduced-motion:reduce){#ww-globe .card,#ww-globe .pin,#ww-globe .pin .dot{transition:none}}

#ww-globe .card .badge{display:inline-block;margin-left:.4rem;padding:.05rem .45rem;border:1px solid var(--gold);border-radius:999px;color:#8a6d2f;font-size:.66rem}
#ww-globe .attrib{position:absolute;right:10px;bottom:6px;z-index:5;font-size:.62rem;color:rgba(242,237,224,.5)}
#ww-globe .attrib a{color:inherit;text-decoration:none}
#ww-globe .status{position:absolute;inset:0;display:grid;place-items:center;z-index:4;font-family:var(--serif);font-style:italic;color:var(--gold-dim);pointer-events:none}
#ww-globe::before{content:'';position:absolute;top:0;left:0;right:0;height:120px;background:linear-gradient(rgba(0,0,0,.85),rgba(0,0,0,0));z-index:4;pointer-events:none}
#ww-globe .stadt{pointer-events:none;transform:translate(-50%,-50%);font:400 10px/1 var(--sans);color:rgba(242,237,224,.72);text-shadow:0 0 3px #000,0 0 6px #000;white-space:nowrap;letter-spacing:.02em;transition:opacity .2s}
#ww-globe .stadt.gross{font-size:12px;font-weight:500;color:rgba(242,237,224,.9)}
#ww-globe .stadt::before{content:'';display:inline-block;width:3px;height:3px;border-radius:50%;background:rgba(242,237,224,.7);margin-right:4px;vertical-align:middle}
#ww-globe .stadt.hidden-side{opacity:0}
#ww-globe .card .photo{position:absolute;inset:0;background:inherit;background-size:cover;background-position:center;transition:filter .25s}
#ww-globe .card.locked .photo{filter:blur(9px) saturate(.7) brightness(.8);transform:scale(1.15)}
#ww-globe .card .img .place{z-index:1}
#ww-globe .card .lockbadge{position:absolute;top:10px;right:10px;z-index:1;width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.45);display:none;place-items:center}
#ww-globe .card.locked .lockbadge{display:grid}
#ww-globe .card .actions{display:flex;align-items:center;justify-content:space-between;gap:.6rem}
#ww-globe .card.locked .go{display:inline-block;background:var(--petrol);color:var(--parchment);padding:.45rem .8rem;border-radius:999px}
#ww-globe .card .merken{font:500 .74rem var(--sans);color:var(--espresso);background:none;border:1px solid rgba(36,26,16,.25);border-radius:999px;padding:.35rem .7rem;cursor:pointer;display:flex;align-items:center;gap:.35rem}
#ww-globe .card .merken[aria-pressed="true"]{background:var(--gold);border-color:var(--gold)}
#ww-globe .card .merken svg{width:13px;height:13px}
#ww-globe .pin.locked .dot{width:20px;height:20px;background:rgba(10,20,18,.85);border:1px solid rgba(212,175,98,.6);box-shadow:0 0 10px rgba(212,175,98,.25);display:grid;place-items:center}
#ww-globe .pin.locked .dot svg{width:10px;height:10px}
#ww-globe .pin.saved .dot{box-shadow:0 0 0 2px var(--parchment),0 0 16px rgba(212,175,98,.9)}
#ww-globe .bar{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);z-index:5;display:flex;align-items:center;gap:.6rem;padding:.45rem .55rem .45rem 1rem;border:1px solid rgba(212,175,98,.35);border-radius:999px;background:rgba(0,0,0,.65);backdrop-filter:blur(6px);font-size:.78rem;white-space:nowrap}
#ww-globe .bar .zahl b{color:var(--gold);font-weight:500}
#ww-globe .bar a,#ww-globe .bar button{font:500 .76rem var(--sans);color:#000;background:var(--gold);border:0;border-radius:999px;padding:.42rem .85rem;text-decoration:none;cursor:pointer}
#ww-globe .bar button[aria-pressed="false"]{background:transparent;color:var(--parchment);border:1px solid rgba(212,175,98,.45)}
#ww-globe .vorschau{position:absolute;top:18px;right:18px;z-index:6;display:flex;border:1px solid rgba(212,175,98,.35);border-radius:999px;overflow:hidden;font-size:.68rem}
#ww-globe .vorschau button{font:400 .68rem var(--sans);background:none;border:0;color:rgba(242,237,224,.6);padding:.35rem .65rem;cursor:pointer}
#ww-globe .vorschau button[aria-pressed="true"]{background:rgba(212,175,98,.2);color:var(--parchment)}
@media (max-width:600px){#ww-globe .bar{font-size:.72rem;padding-left:.8rem}#ww-globe .vorschau{top:auto;bottom:70px;right:auto;left:16px}#ww-globe .card{bottom:calc(112px + env(safe-area-inset-bottom,0px))}}
#ww-globe .themen{position:absolute;left:0;right:0;bottom:70px;z-index:5;display:flex;gap:6px;overflow-x:auto;padding:4px 16px;justify-content:safe center;scrollbar-width:none}
#ww-globe .themen::-webkit-scrollbar{display:none}
#ww-globe .themen button{flex:none;font:400 .74rem var(--sans);color:var(--parchment);background:rgba(0,0,0,.6);border:1px solid rgba(212,175,98,.35);border-radius:999px;padding:.38rem .8rem;cursor:pointer;backdrop-filter:blur(6px);white-space:nowrap}
#ww-globe .themen button span{opacity:.55;margin-left:.15rem}
#ww-globe .themen button[aria-pressed="true"]{background:var(--gold);color:#000;border-color:var(--gold)}
#ww-globe .pin{position:relative}
#ww-globe .pin.neu::after{content:attr(data-neu);position:absolute;left:50%;top:-6px;transform:translateX(-50%);font:600 8.5px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;background:var(--gold);color:#000;padding:2px 5px;border-radius:999px;white-space:nowrap}
#ww-globe .pin.neu .dot{animation:wwpuls 2.2s ease-out infinite}
@keyframes wwpuls{0%{box-shadow:0 0 0 0 rgba(212,175,98,.7),0 0 14px rgba(212,175,98,.7)}70%{box-shadow:0 0 0 12px rgba(212,175,98,0),0 0 14px rgba(212,175,98,.7)}100%{box-shadow:0 0 0 0 rgba(212,175,98,0),0 0 14px rgba(212,175,98,.7)}}
#ww-globe .card .neubadge{display:inline-block;margin-right:.4rem;padding:.05rem .45rem;border-radius:999px;background:var(--gold);color:#000;font-size:.64rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}
@media (max-width:600px){#ww-globe .card{bottom:calc(116px + env(safe-area-inset-bottom,0px))!important}#ww-globe .vorschau{bottom:auto!important;top:118px!important;left:22px!important}}
@media (prefers-reduced-motion:reduce){#ww-globe .pin.neu .dot{animation:none}}
#ww-globe .vignette{position:absolute;z-index:6;display:block;width:150px;background:var(--parchment);border:1px solid var(--gold);border-radius:3px;overflow:hidden;text-decoration:none;box-shadow:0 10px 26px rgba(0,0,0,.55);transform:translate(-50%,calc(-100% - 16px)) scale(.9);transform-origin:50% 100%;opacity:0;transition:opacity .45s,transform .45s}
#ww-globe .vignette.show{opacity:1;transform:translate(-50%,calc(-100% - 16px)) scale(1)}
#ww-globe .vignette.unten{transform:translate(-50%,16px) scale(.9);transform-origin:50% 0}
#ww-globe .vignette.unten.show{transform:translate(-50%,16px) scale(1)}
#ww-globe .vignette .v-img{display:block;height:96px;background:linear-gradient(135deg,var(--petrol),var(--espresso));background-size:cover;background-position:center}
#ww-globe .vignette .v-txt{display:block;padding:7px 9px 8px}
#ww-globe .vignette b{display:block;font:500 .8rem/1.25 var(--serif);color:var(--espresso)}
#ww-globe .vignette i{display:block;font:normal 400 .66rem/1.3 var(--sans);color:#7a6a52;margin-top:2px}
#ww-globe.hero .masthead h1{font-size:clamp(1.7rem,4.6vw,3rem)}
@media (max-width:600px){#ww-globe .vignette{width:124px}#ww-globe .vignette .v-img{height:78px}}
#ww-globe .masthead h1{font-family:var(--serif);font-weight:200;font-style:italic}
#ww-globe .card h2,#ww-globe .vignette b{font-family:var(--serif);font-weight:400}
#ww-globe .card .teaser{font-family:var(--sans);font-weight:300}

/* Im Theme: Grösse kommt vom umgebenden Bereich */
#ww-globe{width:100%;margin-left:0;height:100%;min-height:0}
#ww-globe .status{color:var(--gold-dim)}
#ww-globe button{font-family:var(--sans)}
/* Theme-Stile neutralisieren */
#ww-globe h1,#ww-globe h2,#ww-globe p,#ww-globe a,#ww-globe button,#ww-globe .stadt,#ww-globe .place,#ww-globe .zahl{text-transform:none;letter-spacing:normal}
#ww-globe .masthead p{font-style:normal;font-family:var(--sans)}
#ww-globe .card p{margin:0}
#ww-globe .card .meta{margin:0 0 .3rem}
#ww-globe .card .teaser{margin:0 0 .7rem}
#ww-globe .card h2{margin:0 0 .4rem}

/* Platzhalter, bis der Globus geladen ist */
#ww-globe .ww-canvas{background:radial-gradient(circle at 50% 52%,rgba(31,92,80,.35) 0,#06110f 30%,rgba(212,175,98,.12) 31%,transparent 34%)}
#ww-globe .ww-canvas canvas{background:#000}
/* Grosse Ansicht direkt auf der Startseite */
#ww-globe.offen{position:fixed!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;margin:0!important;z-index:99990}
html.ww-globe-offen,html.ww-globe-offen body{overflow:hidden!important}
#ww-globe .zu{position:absolute;top:14px;right:16px;z-index:12;width:42px;height:42px;border-radius:50%;border:1px solid rgba(212,175,98,.5);background:rgba(0,0,0,.6);color:var(--parchment);font:300 26px/1 var(--sans);cursor:pointer;display:grid;place-items:center}
#ww-globe .zu[hidden]{display:none}