Bewerben-Uebersicht: neues Split-Bild, zwei Spalten, Trennwand, zweifarbige Buttons

- Neues Hintergrundbild (Husky + Dogi zwischen Blau/Rot-Blitzen) auf
  bewerben.html, ersetzt das alte Motiv
- Layout in zwei Spalten: Modi + Kooperation links (blaue Community-
  Seite des Bildes), Scout + Streamer/Creator-Bewerbung rechts (rote
  Agentur-Seite), passend zur Bildkomposition
- Kleine leuchtende Trennwand in der Mitte, blau-lila-rot-Verlauf mit
  Blitz-Knoten, verbindet die Bild-Lichtgrenze visuell mit dem Layout
- "Bewerben"-Knopf in der Navigation und der Musik-Knopf unten rechts
  sind jetzt fest halb babyblau/halb rot (statt Theme-Farbe) -- beide
  gehoeren zu keiner der beiden Welten allein

Co-Authored-By: Claude Opus 5 <[email protected]>

assets/css/main.css

@@ -190,14 +190,19 @@ header.site-header {
 }
 .nav-dropdown a:hover, .nav-dropdown a.active { background: var(--bg-alt); color: var(--accent); }
 
+/* "Bewerben" ist der Treffpunkt beider Welten (Team Dogi + Spicy Media) —
+   deshalb bewusst FEST halb babyblau, halb rot, unabhängig vom Theme der
+   gerade offenen Seite. Kein var(--accent), sondern die festen Markenfarben. */
 .nav-cta {
   padding: .55rem 1.1rem;
   border-radius: 999px;
-  background: var(--accent);
-  color: var(--accent-contrast);
+  background: linear-gradient(90deg, #8fd9ea 0%, #8fd9ea 49%, #d94a5c 51%, #d94a5c 100%);
+  color: #0a0c10;
   font-weight: 700;
   font-size: .88rem;
+  transition: filter .2s ease, transform .2s ease;
 }
+.nav-cta:hover { filter: brightness(1.08); transform: translateY(-1px); }
 
 /* Interner Login — dezent, aber auf jeder Seite oben rechts auffindbar */
 .nav-login {
@@ -1079,6 +1084,81 @@ body.mit-hintergrund::after {
   .pyramid-tier .profile-card { max-width: min(78vw, 240px) !important; }
 }
 
+/* ==========================================================================
+   BEWERBEN-SPLIT — zwei Welten, zwei Spalten, kleine Trennwand in der Mitte
+   Passend zum Hintergrundbild: Community/Team Dogi (blau) links,
+   Agentur/Spicy Media (rot) rechts.
+   ========================================================================== */
+.bewerben-split {
+  display: flex;
+  align-items: stretch;
+  gap: clamp(1.4rem, 4vw, 3.2rem);
+  max-width: 980px;
+  margin: 0 auto;
+}
+.bewerben-side {
+  flex: 1 1 0;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 1.2rem;
+}
+.bewerben-side-label {
+  text-align: center;
+  font-family: var(--font-head);
+  font-weight: 800;
+  font-size: .74rem;
+  letter-spacing: .1em;
+  text-transform: uppercase;
+  margin-bottom: .2rem;
+}
+.bewerben-side-blau .bewerben-side-label { color: #8fd9ea; text-shadow: 0 0 14px rgba(143, 217, 234, .5); }
+.bewerben-side-rot .bewerben-side-label { color: #d94a5c; text-shadow: 0 0 14px rgba(217, 74, 92, .5); }
+.bewerben-side .card { height: auto; }
+
+/* Die kleine Trennungswand: ein leuchtender Steg von blau nach rot,
+   mit einem Blitz-Knoten in der Mitte — passend zur Lichtgrenze im Bild. */
+.bewerben-wall {
+  flex: none;
+  width: 3px;
+  align-self: stretch;
+  position: relative;
+  border-radius: 3px;
+  background: linear-gradient(to bottom,
+    transparent 0%,
+    #8fd9ea 18%,
+    #b285c9 50%,
+    #d94a5c 82%,
+    transparent 100%);
+  box-shadow: 0 0 16px rgba(143, 217, 234, .35), 0 0 16px rgba(217, 74, 92, .3);
+}
+.bewerben-wall span {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 42px;
+  height: 42px;
+  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);
+}
+@media (max-width: 760px) {
+  .bewerben-split { flex-direction: column; gap: 2.2rem; }
+  .bewerben-wall {
+    width: 100%;
+    height: 3px;
+    background: linear-gradient(to right, transparent 0%, #8fd9ea 18%, #b285c9 50%, #d94a5c 82%, transparent 100%);
+  }
+}
+
 /* ==========================================================================
    TEAM-DOGI-HINTERGRUND — die große Team-Collage hinter dem Team-Abschnitt
    ========================================================================== */
@@ -1136,6 +1216,8 @@ body.seite-laedt main { opacity: .55; transition: opacity .15s ease; }
   align-items: flex-end;
   gap: 12px;
 }
+/* Musik gehört zu Hasidog UND Van-Van, also zu beiden Welten — deshalb
+   auch hier fest halb babyblau, halb rot, statt der Theme-Farbe. */
 .music-toggle {
   width: 54px;
   height: 54px;
@@ -1147,11 +1229,12 @@ body.seite-laedt main { opacity: .55; transition: opacity .15s ease; }
   align-items: center;
   justify-content: center;
   cursor: pointer;
-  color: var(--accent-contrast);
-  border: 1px solid color-mix(in srgb, var(--accent) 60%, transparent);
-  background: linear-gradient(135deg, var(--accent), var(--accent-2));
+  color: #0a0c10;
+  border: 1px solid rgba(255, 255, 255, .18);
+  background: linear-gradient(90deg, #8fd9ea 0%, #8fd9ea 49%, #d94a5c 51%, #d94a5c 100%);
   box-shadow: 0 12px 30px rgba(0, 0, 0, .45),
-              0 0 24px color-mix(in srgb, var(--accent) 35%, transparent);
+              0 0 18px rgba(143, 217, 234, .35),
+              0 0 18px rgba(217, 74, 92, .3);
   transition: transform .25s ease, filter .25s ease, box-shadow .25s ease;
 }
 .music-toggle:hover,
@@ -1159,7 +1242,8 @@ body.seite-laedt main { opacity: .55; transition: opacity .15s ease; }
   transform: translateY(-2px) scale(1.05);
   filter: brightness(1.12);
   box-shadow: 0 16px 38px rgba(0, 0, 0, .5),
-              0 0 34px color-mix(in srgb, var(--accent) 55%, transparent);
+              0 0 26px rgba(143, 217, 234, .5),
+              0 0 26px rgba(217, 74, 92, .45);
 }
 .music-widget.open .music-toggle { transform: rotate(12deg); }