/* styles/neon-release.css
   Neon/Cyber-Glow-Ergaenzung NUR fuer /release/converter/.
   Wird exklusiv in release/converter/index.html eingebunden.
   Statisch — keine neuen Animationen. */

/* ============================================================
   Body & tief-schwarzer Hintergrund
   ============================================================ */

body {
  background: #000;
}

/* Statisches symmetrisches Leuchtkreuz HINTER .bg-grid (z-index 0).
   z-index -1 legt es hinter alle bestehenden Bg-Ebenen. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    /* vertikaler Lichtstrahl oben */
    radial-gradient(ellipse 55% 32% at 50% -6%, rgba(58, 228, 255, 0.24), transparent 68%),
    /* vertikaler Lichtstrahl unten (mint) */
    radial-gradient(ellipse 55% 32% at 50% 106%, rgba(74, 242, 197, 0.14), transparent 68%),
    /* horizontaler Lichtstrahl links */
    radial-gradient(ellipse 32% 55% at -8% 50%, rgba(58, 228, 255, 0.11), transparent 68%),
    /* horizontaler Lichtstrahl rechts (purple) */
    radial-gradient(ellipse 32% 55% at 108% 50%, rgba(179, 136, 255, 0.11), transparent 68%),
    /* zentrale Facette */
    radial-gradient(circle at 50% 35%, rgba(58, 228, 255, 0.14) 0%, rgba(74, 242, 197, 0.07) 16%, transparent 40%),
    /* untere Eck-Glows */
    radial-gradient(circle at 85% 100%, rgba(179, 136, 255, 0.12), transparent 48%),
    radial-gradient(circle at 15% 100%, rgba(58, 228, 255, 0.08), transparent 48%);
  pointer-events: none;
}

/* Subtiles statisches Kreuz-Raster hinter den Inhalten, vor body::before */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  opacity: 0.10;
  background:
    linear-gradient(
      90deg,
      transparent calc(50% - 1px),
      rgba(58, 228, 255, 0.08) calc(50% - 1px),
      rgba(58, 228, 255, 0.08) calc(50% + 1px),
      transparent calc(50% + 1px)
    ),
    linear-gradient(
      0deg,
      transparent calc(50% - 1px),
      rgba(58, 228, 255, 0.06) calc(50% - 1px),
      rgba(58, 228, 255, 0.06) calc(50% + 1px),
      transparent calc(50% + 1px)
    );
  pointer-events: none;
}

/* ============================================================
   HUD-Leiste
   ============================================================ */

body .cyber-bar {
  border-bottom-color: rgba(58, 228, 255, 0.22);
  box-shadow:
    0 4px 24px rgba(0, 0, 0, 0.35),
    0 0 20px rgba(58, 228, 255, 0.06);
}

/* ============================================================
   Hero
   ============================================================ */

body .conv-hero {
  text-shadow: 0 0 18px rgba(58, 228, 255, 0.18);
}

body .hero-eyebrow {
  text-shadow: 0 0 10px rgba(58, 228, 255, 0.5);
}

/* ============================================================
   Download-Card
   ============================================================ */

body .conv-download-card {
  border-color: rgba(58, 228, 255, 0.22);
  box-shadow:
    0 0 38px rgba(58, 228, 255, 0.10),
    0 12px 34px rgba(0, 0, 0, 0.35);
}

body .conv-download-card::before {
  box-shadow:
    0 0 16px rgba(58, 228, 255, 0.95),
    -8px 0 40px 8px rgba(58, 228, 255, 0.45),
    -20px 0 100px 28px rgba(58, 228, 255, 0.18);
}

body .btn-primary {
  box-shadow:
    0 0 28px rgba(58, 228, 255, 0.55),
    0 12px 32px rgba(0, 0, 0, 0.35);
}

body .btn-primary:hover {
  box-shadow:
    0 0 42px rgba(58, 228, 255, 0.75),
    0 16px 40px rgba(0, 0, 0, 0.42);
}

/* ============================================================
   Stats
   ============================================================ */

body .conv-stats {
  border-color: rgba(58, 228, 255, 0.20);
  box-shadow:
    0 0 34px rgba(58, 228, 255, 0.08),
    0 10px 30px rgba(0, 0, 0, 0.30);
}

body .conv-stat__num {
  text-shadow: 0 0 14px rgba(58, 228, 255, 0.25);
}

/* ============================================================
   Feature-Cards
   ============================================================ */

body .feature-card {
  border-color: rgba(58, 228, 255, 0.16);
  box-shadow: 0 0 22px rgba(58, 228, 255, 0.05);
}

body .feature-card::before {
  box-shadow: 0 0 12px rgba(58, 228, 255, 0.9);
}

body .feature-card:hover {
  border-color: rgba(58, 228, 255, 0.42);
  box-shadow: 0 0 30px rgba(58, 228, 255, 0.12);
}

/* ============================================================
   Workflow
   ============================================================ */

body .workflow-step {
  border-color: rgba(58, 228, 255, 0.16);
  box-shadow: 0 0 22px rgba(58, 228, 255, 0.05);
}

body .workflow-step .num {
  box-shadow:
    0 0 18px rgba(74, 242, 197, 0.65),
    0 0 48px 8px rgba(74, 242, 197, 0.18);
}

/* ============================================================
   Guide-Tabs & Guide-Panels
   ============================================================ */

body .guide-tabs {
  border-color: rgba(58, 228, 255, 0.18);
  box-shadow: 0 0 22px rgba(58, 228, 255, 0.06);
}

body .guide-tab[aria-selected="true"] {
  text-shadow: 0 0 10px rgba(58, 228, 255, 0.45);
}

body .guide-panel {
  border-color: rgba(58, 228, 255, 0.14);
  box-shadow: inset 0 0 34px rgba(58, 228, 255, 0.04);
}

/* ============================================================
   Render-Pipeline
   ============================================================ */

body .render-pipeline {
  border-color: rgba(58, 228, 255, 0.16);
  box-shadow: 0 0 26px rgba(58, 228, 255, 0.06);
}

/* ============================================================
   Patch-Notes
   ============================================================ */

body .patch-notes-card {
  border-color: rgba(58, 228, 255, 0.18);
  box-shadow:
    0 0 26px rgba(58, 228, 255, 0.07),
    inset 0 0 40px rgba(58, 228, 255, 0.03);
}

/* ============================================================
   Section "01 / 02 / 03" Ueberschriften
   ============================================================ */

body .section-label {
  text-shadow: 0 0 10px rgba(58, 228, 255, 0.35);
}

body .section-head h2 {
  text-shadow: 0 0 14px rgba(58, 228, 255, 0.22);
}