From 648a28ec116f64768242cc920ffd03f7deb64497 Mon Sep 17 00:00:00 2001
From: Dogfather <dogfather1608@gmail.com>
Date: Mon, 3 Aug 2026 03:41:47 +0200
Subject: [PATCH] bewerben.html: Mitten-Emblem zum "Reaktorkern" umgebaut
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Vorher: flacher zweifarbiger Kreis (hart 48/52 geteilt Blau/Rot) mit
Blitz-Emoji. Jetzt: dunkle Kern-Mitte mit separat rotierendem Farbring
dahinter (::before, conic-gradient Blau→Lila→Rot) — der Ring dreht sich,
der Blitz bleibt aufrecht stehen statt mitzudrehen. Größer (60px statt
42px), stärkerer Textschatten am Blitz, kräftigerer Puls-Glow. Zwei
kollidierende alte CSS-Regeln für denselben Selektor zu einer sauberen
zusammengeführt.
---
 assets/css/main.css | 56 ++++++++++++++++++++++++++++-----------------
 1 file changed, 35 insertions(+), 21 deletions(-)

diff --git a/assets/css/main.css b/assets/css/main.css
index 520f8b7..814f7d1 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -2191,23 +2191,44 @@ body.mit-hintergrund::after {
     transparent 100%);
   box-shadow: 0 0 16px rgba(143, 217, 234, .35), 0 0 16px rgba(217, 74, 92, .3);
 }
+/* "Reaktorkern"-Emblem: dunkle Mitte mit statischem Blitz, dahinter ein
+   EIGENER, separat rotierender Farbring (::before) — dadurch dreht sich
+   der Farbschein, ohne dass der Blitz selbst mitdreht/schief steht. */
 .bewerben-wall span {
-  position: absolute;
+  position: relative;
+  isolation: isolate;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
-  width: 42px;
-  height: 42px;
+  width: 60px;
+  height: 60px;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
-  font-size: 1.1rem;
-  background: linear-gradient(135deg, #8fd9ea 0%, #8fd9ea 48%, #d94a5c 52%, #d94a5c 100%);
-  border: 2px solid rgba(255, 255, 255, .18);
-  box-shadow: 0 0 0 6px rgba(10, 12, 16, .55),
-              0 0 20px rgba(143, 217, 234, .4),
-              0 0 20px rgba(217, 74, 92, .35);
+  font-size: 1.65rem;
+  background: radial-gradient(circle at 34% 28%, #232830, #0a0c10 72%);
+  border: 1px solid rgba(255, 255, 255, .2);
+  text-shadow: 0 0 10px rgba(255, 214, 140, .9), 0 0 4px rgba(0, 0, 0, .6);
+  box-shadow: 0 0 0 4px rgba(10, 12, 16, .85),
+              0 0 0 6px rgba(255, 255, 255, .14),
+              0 0 26px rgba(143, 217, 234, .45),
+              0 0 26px rgba(217, 74, 92, .4);
+}
+.bewerben-wall span::before {
+  content: "";
+  position: absolute;
+  inset: -5px;
+  z-index: -1;
+  border-radius: 50%;
+  background: conic-gradient(from 0deg,
+    #8fd9ea 0%, #b285c9 25%, #d94a5c 50%, #b285c9 75%, #8fd9ea 100%);
+  filter: blur(2px) saturate(1.3);
+  animation: bewerben-emblem-spin 5s linear infinite;
+}
+@keyframes bewerben-emblem-spin { to { transform: rotate(360deg); } }
+@media (prefers-reduced-motion: reduce) {
+  .bewerben-wall span::before { animation: none; }
 }
 @media (max-width: 760px) {
   .bewerben-split { flex-direction: column; gap: 2.2rem; width: 100%; }
@@ -2314,25 +2335,18 @@ body.mit-hintergrund::after {
   100% { background-position: 0 -180%; }
 }
 .bewerben-wall span {
-  width: 58px;
-  height: 58px;
-  font-size: 1.5rem;
-  box-shadow: 0 0 0 3px rgba(10, 12, 16, .75),
-              0 0 0 5px rgba(255, 255, 255, .16),
-              0 0 26px rgba(143, 217, 234, .5),
-              0 0 26px rgba(217, 74, 92, .45);
   animation: bewerben-emblem-pulse 2.4s ease-in-out infinite;
 }
 @keyframes bewerben-emblem-pulse {
   0%, 100% {
     transform: translate(-50%, -50%) scale(1);
-    box-shadow: 0 0 0 3px rgba(10, 12, 16, .75), 0 0 0 5px rgba(255, 255, 255, .16),
-                0 0 26px rgba(143, 217, 234, .5), 0 0 26px rgba(217, 74, 92, .45);
+    box-shadow: 0 0 0 4px rgba(10, 12, 16, .85), 0 0 0 6px rgba(255, 255, 255, .14),
+                0 0 26px rgba(143, 217, 234, .45), 0 0 26px rgba(217, 74, 92, .4);
   }
   50% {
-    transform: translate(-50%, -50%) scale(1.1);
-    box-shadow: 0 0 0 3px rgba(10, 12, 16, .75), 0 0 0 6px rgba(255, 255, 255, .28),
-                0 0 40px rgba(143, 217, 234, .7), 0 0 40px rgba(217, 74, 92, .6);
+    transform: translate(-50%, -50%) scale(1.08);
+    box-shadow: 0 0 0 4px rgba(10, 12, 16, .85), 0 0 0 7px rgba(255, 255, 255, .26),
+                0 0 42px rgba(143, 217, 234, .7), 0 0 42px rgba(217, 74, 92, .6);
   }
 }
 @media (prefers-reduced-motion: reduce) {