diff --git a/webdesign/verwaltung.html b/webdesign/verwaltung.html
index e5a7e23a..c406f115 100644
--- a/webdesign/verwaltung.html
+++ b/webdesign/verwaltung.html
@@ -142,14 +142,73 @@
   .vw-detail { position: fixed; inset: 0; z-index: 100; display: none; }
   .vw-detail.vw-auf { display: block; }
   .vw-detail-schatten { position: absolute; inset: 0; background: rgba(2,4,8,.78); backdrop-filter: blur(3px); }
+  /* ---------- Detailansicht: zentriertes Fenster ----------
+     Vorher eine seitlich eingeschobene Leiste. Fuer so viel Inhalt ist
+     das das falsche Format: Der Blick springt beim Oeffnen nach rechts,
+     die Liste dahinter bleibt halb sichtbar und lenkt ab, und alles muss
+     sich in eine schmale Spalte quetschen -- "keine Angabe" stand
+     dadurch achtmal untereinander.
+
+     Jetzt mittig, breiter und zweispaltig. Der Blick bleibt, wo er ist,
+     und zusammengehoerende Angaben stehen nebeneinander statt
+     hintereinander. */
   .vw-detail-blatt {
-    position: absolute; top: 0; right: 0; bottom: 0;
-    width: min(680px, 100%);
-    background: #080d16; border-left: 1px solid var(--wd-rand-stark);
-    overflow-y: auto; padding: 1.4rem clamp(1rem,3vw,1.8rem) 3rem;
-    animation: vw-rein .28s cubic-bezier(.22,1,.36,1) both;
+    position: absolute;
+    top: 50%; left: 50%; transform: translate(-50%, -50%);
+    width: min(940px, calc(100vw - 2rem));
+    max-height: min(88vh, 900px);
+    background: linear-gradient(180deg, #0b1523, #070c15);
+    border: 1px solid var(--wd-rand-stark);
+    border-radius: 20px;
+    box-shadow: 0 50px 120px -40px rgba(0,0,0,.95), 0 0 0 1px rgba(127,208,232,.06) inset;
+    overflow-y: auto;
+    padding: clamp(1.2rem, 3vw, 1.9rem) clamp(1rem, 3vw, 2rem) clamp(1.4rem, 3vw, 2rem);
+    animation: vw-rein .26s cubic-bezier(.22,1,.36,1) both;
   }
-  @keyframes vw-rein { from { transform: translateX(24px); opacity: 0; } to { transform: none; opacity: 1; } }
+  @keyframes vw-rein {
+    from { transform: translate(-50%, -46%) scale(.97); opacity: 0; }
+    to   { transform: translate(-50%, -50%) scale(1); opacity: 1; }
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .vw-detail-blatt { animation: none; }
+  }
+
+  /* Kopfzeile klebt oben fest — bei langen Anfragen weiss man sonst nach
+     dem Scrollen nicht mehr, wessen Daten man gerade liest. */
+  .vw-detail-kopf {
+    position: sticky; top: calc(clamp(1.2rem, 3vw, 1.9rem) * -1);
+    margin: calc(clamp(1.2rem, 3vw, 1.9rem) * -1) calc(clamp(1rem, 3vw, 2rem) * -1) 1.2rem;
+    padding: 1.1rem clamp(1rem, 3vw, 2rem);
+    background: rgba(11, 21, 35, .96);
+    backdrop-filter: blur(10px);
+    border-bottom: 1px solid var(--wd-rand);
+    border-radius: 20px 20px 0 0;
+    z-index: 2;
+  }
+
+  /* Zwei Spalten ab Tablet: die Abschnitte sind unterschiedlich hoch,
+     deshalb Mauerwerk statt Raster — sonst entstehen grosse Luecken. */
+  @media (min-width: 780px) {
+    .vw-detail-spalten { columns: 2; column-gap: 1.4rem; }
+    .vw-detail-spalten > .vw-abschnitt {
+      break-inside: avoid; -webkit-column-break-inside: avoid;
+      display: inline-block; width: 100%;
+    }
+  }
+
+  /* Jeder Abschnitt wird eine eigene Flaeche statt nur einer Linie. */
+  .vw-detail-spalten > .vw-abschnitt {
+    padding: .95rem 1.1rem 1rem;
+    border-radius: 14px;
+    background: rgba(16, 26, 41, .5);
+    border: 1px solid var(--wd-rand);
+    margin-bottom: 1.1rem;
+  }
+  .vw-detail-spalten > .vw-abschnitt > h3 { border-bottom: none; padding-bottom: 0; margin-bottom: .7rem; }
+
+  /* "keine Angabe" tritt zurueck: Es ist die Abwesenheit einer Information
+     und darf nicht so aussehen wie eine. */
+  .vw-paar dd.vw-leer { font-size: .88rem; opacity: .55; }
   @media (prefers-reduced-motion: reduce) { .vw-detail-blatt { animation: none; } }
   .vw-detail-kopf { display: flex; align-items: flex-start; gap: 1rem; margin-bottom: 1.2rem; }
   .vw-zu {
@@ -757,6 +816,7 @@
           '<span class="vw-status vw-status--' + s(a.status) + '">' + s(STATUS_TEXT[a.status] || a.status) + "</span></div>" +
           '<button class="vw-zu" type="button" aria-label="Schließen">✕</button>' +
         "</div>" +
+        '<div class="vw-detail-spalten">' +
 
         '<div class="vw-abschnitt"><h3>Kontakt</h3>' +
           paar("E-Mail", a.email) +
@@ -842,6 +902,7 @@
           '<p class="wd-klein wd-leise">Archivieren löscht nichts — die Anfrage bleibt vollständig erhalten und lässt sich jederzeit zurückholen.</p>' +
           '<button type="button" class="wd-btn wd-btn--still wd-btn--klein" id="vw-archivieren">' +
           (a.archiviert ? "Aus dem Archiv zurückholen" : "Archivieren") + "</button>" +
+        "</div>" +
         "</div>";
 
       blatt.querySelector(".vw-zu").addEventListener("click", schliesseDetail);