/* Begehbarer Demo-Graph — geteilt von demo.html, index.html und business-graph.html */
.demo-wrap { display:grid; grid-template-columns:1.25fr 0.95fr; gap:clamp(20px,3vw,34px); align-items:start; }
@media (max-width:960px){ .demo-wrap { grid-template-columns:1fr; } }
.stage { position:relative; aspect-ratio:1/0.82; border:1px solid var(--line); border-radius:4px; background:var(--paper-2); overflow:hidden;
  background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px); background-size:34px 34px; }
.stage .corner { position:absolute; left:14px; top:12px; font-family:var(--mono); font-size:0.64rem; letter-spacing:0.12em; color:var(--sage); z-index:3; }
.stage .fict { position:absolute; right:14px; top:12px; font-family:var(--mono); font-size:0.6rem; letter-spacing:0.06em; color:var(--sage); border:1px solid var(--line-dash); border-radius:100px; padding:3px 10px; z-index:3; }
.stage svg.edges { position:absolute; inset:0; width:100%; height:100%; }
.stage svg.edges line { stroke:var(--line-dash); stroke-width:1.2; transition:stroke .2s, stroke-width .2s; }
.stage svg.edges line.on { stroke:var(--green); stroke-width:2; }
.nd { position:absolute; transform:translate(-50%,-50%); left:calc(var(--x)*1%); top:calc(var(--y)*1%);
  display:flex; flex-direction:column; align-items:center; gap:6px; cursor:pointer; z-index:2; background:none; border:0; padding:0; }
.nd .disc { width:46px; height:46px; border-radius:50%; border:1px solid var(--line-dash); background:var(--paper); display:grid; place-items:center; transition:.18s; }
.nd .disc svg { width:20px; height:20px; stroke:var(--sage); fill:none; stroke-width:1.5; }
.nd .lb { font-family:var(--mono); font-size:0.63rem; letter-spacing:0.03em; color:var(--sage); white-space:nowrap; text-align:center; }
.nd.hub .disc { width:60px; height:60px; border-color:var(--green); }
.nd.hub .disc svg { width:24px; height:24px; stroke:var(--green); }
.nd:hover .disc { border-color:var(--green); transform:translateY(-2px); }
.nd.on .disc { border-color:var(--green); background:var(--green-900); box-shadow:0 0 0 4px rgba(0,120,212,0.14); }
.nd.on .disc svg { stroke:var(--paper); }
.nd.on .lb { color:var(--green); }
.nd.warn .disc { border-color:var(--brick); border-style:dashed; }
.nd.warn .disc svg { stroke:var(--brick); }
.nd.dim { opacity:0.32; }
.panel { border:1px solid var(--line); border-radius:4px; background:var(--paper-2); padding:clamp(20px,2.4vw,28px); position:sticky; top:90px; }
.panel .pk { font-family:var(--mono); font-size:0.62rem; letter-spacing:0.12em; color:var(--ocher-600); }
.panel h3 { font-family:var(--serif); font-size:clamp(1.3rem,2.2vw,1.7rem); margin:8px 0 12px; line-height:1.1; }
.panel .lede-sm { font-size:0.92rem; color:var(--sage); line-height:1.55; margin-bottom:18px; }
.facts { display:grid; gap:10px; border-top:1px solid var(--line); padding-top:16px; }
.fact { display:grid; grid-template-columns:11ch 1fr; gap:12px; align-items:baseline; }
.fact .fk { font-family:var(--mono); font-size:0.58rem; letter-spacing:0.09em; color:var(--sage); text-transform:uppercase; }
.fact .fv { font-size:0.9rem; }
.srcs { margin-top:18px; border-top:1px solid var(--line); padding-top:16px; }
.srcs .sh { font-family:var(--mono); font-size:0.6rem; letter-spacing:0.1em; color:var(--sage); text-transform:uppercase; margin-bottom:10px; }
.src { display:flex; gap:10px; align-items:baseline; padding:9px 0; border-bottom:1px solid var(--line-soft); font-size:0.86rem; }
.src:last-child { border-bottom:0; }
.src .sd { font-family:var(--mono); font-size:0.62rem; color:var(--green); white-space:nowrap; }
.qs { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; }
.q { font-family:var(--sans); font-size:0.86rem; text-align:left; padding:10px 14px; border:1px solid var(--line); border-radius:100px; background:var(--paper); color:var(--ink); cursor:pointer; transition:.16s; }
.q:hover { border-color:var(--green); }
.q.on { background:var(--green-900); border-color:var(--green-900); color:var(--paper); }
.hint { font-family:var(--mono); font-size:0.68rem; color:var(--sage); margin-top:14px; letter-spacing:0.02em; }
