/* ══════════════════════════════════════════════════════════════
   SERVER & PLATTFORMEN — „Die Architektur folgt der Arbeit."

   WELT      ein räumliches Infrastruktur-Modell
   HELD      das Unternehmen als ORT
   KAMERA    der Besucher schaltet Bedingungen — und BAUT damit
   MOMENT    am Ende steht eine Architektur, die er selbst gestellt
             hat, ohne dass ihm jemand eine Prozentzahl gezeigt hat

   AUSDRÜCKLICH KEINE PROZENTE. Die Vorgängerfassung hat
   Gewichtungen in Balken ausgedrückt — das ist Scheingenauigkeit
   und war die eigentliche Schwäche der Seite.
══════════════════════════════════════════════════════════════ */

.plc {
  --plc-bg: #0b0f14;
  --plc-panel: #141a22;
  --plc-ink: #e6ecf3;
  --plc-mut: #7e8b9c;
  --plc-line: rgba(255,255,255,.09);
  --plc-in: #63b3a0;      /* im Haus */
  --plc-out: #d98b4a;     /* ausserhalb */
  --plc-ease: cubic-bezier(.22,.9,.24,1);

  position: relative; width: 100vw; margin-left: calc(50% - 50vw);
  background: var(--plc-bg); color: var(--plc-ink); overflow-x: clip;
}
.plc-in { width: min(1220px, 92vw); margin-inline: auto; }

.plc-slug { padding: clamp(4.5rem,9vh,7rem) 0 clamp(1.2rem,3vh,1.8rem); }
.plc-slug__k { font-family: var(--font-heading); font-size: .66rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--plc-in); }
.plc-slug__h { font-family: var(--font-heading); font-weight: 800; letter-spacing: -.032em; font-size: clamp(1.45rem,3.2vw,2.35rem); margin: .6rem 0 .5rem; max-width: 22ch; }
.plc-slug__c { margin: 0; color: var(--plc-mut); font-size: .93rem; line-height: 1.62; max-width: 58ch; }

/* ── Der Bauplatz ────────────────────────────────────────────── */
.plc-yard {
  display: grid; grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr);
  gap: clamp(1rem,3vw,2.2rem); align-items: start; padding-bottom: clamp(2rem,5vh,3rem);
}
@media (max-width: 900px) { .plc-yard { grid-template-columns: 1fr; } }

/* Bedingungen — was im Betrieb WAHR ist, nicht was man sich wünscht */
.plc-cons { border: 1px solid var(--plc-line); border-radius: 12px; background: var(--plc-panel); padding: clamp(1rem,2.4vw,1.4rem); }
.plc-cons__k { font-family: var(--font-heading); font-size: .6rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--plc-mut); margin: 0 0 .9rem; }
.plc-c {
  display: flex; align-items: flex-start; gap: .6rem; width: 100%; text-align: left;
  appearance: none; font: inherit; cursor: pointer; color: var(--plc-ink);
  border: 1px solid var(--plc-line); border-radius: 9px; padding: .6rem .7rem;
  background: rgba(255,255,255,.022); margin-bottom: .5rem;
  transition: border-color .25s var(--plc-ease), background .25s var(--plc-ease);
}
.plc-c:last-child { margin-bottom: 0; }
.plc-c:hover { border-color: rgba(99,179,160,.45); }
.plc-c:focus-visible { outline: 2px solid var(--plc-in); outline-offset: 2px; }
.plc-c.is-on { border-color: var(--plc-in); background: rgba(99,179,160,.1); }
.plc-c__box {
  flex: none; width: 1.05rem; height: 1.05rem; border-radius: 4px; margin-top: .1rem;
  border: 1px solid var(--plc-line); background: rgba(255,255,255,.05);
  display: grid; place-items: center; font-size: .7rem; color: #04231c;
}
.plc-c.is-on .plc-c__box { background: var(--plc-in); border-color: var(--plc-in); }
.plc-c.is-on .plc-c__box::after { content: "✓"; font-weight: 900; }
.plc-c__t { font-family: var(--font-heading); font-weight: 700; font-size: .84rem; display: block; }
.plc-c__s { font-size: .72rem; color: var(--plc-mut); line-height: 1.45; }

/* Das Modell */
.plc-model {
  position: relative; border: 1px solid var(--plc-line); border-radius: 12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 40%),
    var(--plc-panel);
  padding: clamp(1rem,2.4vw,1.5rem); min-height: 430px;
}
.plc-model__k { font-family: var(--font-heading); font-size: .6rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--plc-mut); margin: 0 0 .8rem; }

/* Die Grenze des Hauses */
.plc-stage { position: relative; width: 100%; aspect-ratio: 16 / 11; min-height: 300px; }
.plc-house {
  position: absolute; left: 2%; top: 6%; width: 62%; height: 74%;
  border: 1px dashed rgba(99,179,160,.45); border-radius: 10px;
  background: rgba(99,179,160,.045);
}
.plc-house__l {
  position: absolute; top: .4rem; left: .6rem;
  font-size: .58rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--plc-in);
}
.plc-wires { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.plc-wire {
  stroke: rgba(255,255,255,.2); stroke-width: .5; fill: none;
  opacity: 0; transition: opacity .5s var(--plc-ease);
}
.plc-wire.is-on { opacity: 1; }
.plc-wire--sec { stroke: var(--plc-in); stroke-dasharray: 2 1.4; }
.plc-wire--ext { stroke: var(--plc-out); stroke-dasharray: 1.2 1.6; }
.plc-wire--red { stroke: var(--plc-in); stroke-width: .9; opacity: 0; }
.plc-wire--red.is-on { opacity: .85; }

.plc-node {
  position: absolute; transform: translate(-50%, -50%);
  border: 1px solid var(--plc-line); border-radius: 8px;
  background: #1b232d; padding: .4rem .6rem; white-space: nowrap;
  font-family: var(--font-heading); font-weight: 700; font-size: .72rem;
  box-shadow: 0 8px 22px rgba(0,0,0,.4);
  opacity: 0; scale: .82;
  transition: opacity .45s var(--plc-ease), scale .45s var(--plc-ease);
}
.plc-node.is-on { opacity: 1; scale: 1; }
.plc-node__s { display: block; font-weight: 600; font-size: .62rem; color: var(--plc-mut); }
.plc-node--core { border-color: rgba(255,255,255,.3); opacity: 1; scale: 1; }
.plc-node--in { border-color: rgba(99,179,160,.5); }
.plc-node--out { border-color: rgba(217,139,74,.5); }

.plc-log { margin-top: 1rem; border-top: 1px solid var(--plc-line); padding-top: .9rem; }
.plc-log__k { font-size: .58rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--plc-mut); margin: 0 0 .5rem; }
.plc-log__l { font-size: .82rem; color: var(--plc-ink); line-height: 1.6; margin: 0 0 .35rem; display: flex; gap: .5rem; }
.plc-log__l::before { content: "→"; color: var(--plc-in); flex: none; }
.plc-log__empty { font-size: .82rem; color: var(--plc-mut); margin: 0; line-height: 1.6; }

.plc-verdict {
  margin-top: 1rem; border: 1px solid rgba(99,179,160,.28); border-radius: 10px;
  background: rgba(99,179,160,.06); padding: .8rem .95rem;
}
.plc-verdict__k { font-size: .58rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--plc-in); margin: 0 0 .3rem; }
.plc-verdict__t { font-family: var(--font-heading); font-weight: 800; font-size: .95rem; margin: 0 0 .25rem; }
.plc-verdict__s { font-size: .8rem; color: var(--plc-mut); line-height: 1.55; margin: 0; }

/* ── Leseebene ───────────────────────────────────────────────── */
.plc-read { padding: clamp(3.5rem,9vh,6rem) 0 clamp(4rem,10vh,7rem); border-top: 1px solid var(--plc-line); margin-top: clamp(2rem,5vh,3rem); }
.plc-read__grid { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); gap: clamp(1.6rem,5vw,4rem); align-items: start; }
@media (max-width: 880px) { .plc-read__grid { grid-template-columns: 1fr; } }
.plc-read__lead { font-size: clamp(1.02rem,1.5vw,1.16rem); line-height: 1.66; margin: 0 0 1rem; }
.plc-read__p { font-size: .93rem; line-height: 1.72; color: var(--plc-mut); margin: 0 0 .9rem; max-width: 62ch; }
.plc-read__p b { color: var(--plc-ink); }
.plc-read__p a, .plc-qa__a a, .plc-rel a { color: var(--plc-in); text-underline-offset: 3px; }
.plc-qa { border-left: 1px solid var(--plc-line); padding-left: clamp(.9rem,2vw,1.6rem); }
@media (max-width: 880px) { .plc-qa { border-left: none; border-top: 1px solid var(--plc-line); padding: 1.4rem 0 0; } }
.plc-qa__h { font-family: var(--font-heading); font-size: .62rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--plc-mut); margin: 0 0 1rem; }
.plc-qa__i { margin: 0 0 1.1rem; }
.plc-qa__q { font-family: var(--font-heading); font-weight: 700; font-size: .86rem; margin: 0 0 .28rem; }
.plc-qa__a { font-size: .82rem; line-height: 1.62; color: var(--plc-mut); margin: 0; }
.plc-close { margin-top: clamp(2rem,5vh,3rem); padding-top: 1.4rem; border-top: 1px solid var(--plc-line); }
.plc-close__t { font-family: var(--font-heading); font-weight: 800; letter-spacing: -.028em; font-size: clamp(1.15rem,2.3vw,1.6rem); margin: 0 0 .9rem; max-width: 32ch; }
.plc-go { display: inline-flex; align-items: center; gap: .45rem; font-family: var(--font-heading); font-weight: 700; font-size: .88rem;
  color: #04231c; background: var(--plc-in); text-decoration: none; padding: .68rem 1.25rem; border-radius: 999px; transition: transform .22s var(--plc-ease); }
.plc-go:hover { transform: translateY(-2px); }
.plc-go--q { background: transparent; color: var(--plc-ink); border: 1px solid var(--plc-line); }
.plc-rel { margin: 1.1rem 0 0; font-size: .82rem; color: var(--plc-mut); }

@media (prefers-reduced-motion: reduce) {
  .plc-node, .plc-wire { transition: none; }
}
