/* ================================================================
   THEME: Bochum Blau  ·  Palette "Bochum Blue Trust"
   Hell · Signal-Blau #005CA9 + Slate-Sekundär · Klinisch & Vertrauenswürdig
   Aktivierung: Deploy über admin/design-variants.html
   ----------------------------------------------------------------
   Briefing-Palette:
     Primary   #005CA9   Secondary #64748B
     Tertiary  #F8FAFC   Neutral   #1B1B1B
   ================================================================ */

:root {
  color-scheme: light;

  /* Brand – Primary #005CA9 */
  --brand:         #005CA9;
  --brand-hov:     #0E6FBE;
  --brand-act:     #00497F;
  --brand-dim:     rgba(0,92,169,.10);
  --brand-dim-str: rgba(0,92,169,.20);

  /* Accent – Secondary #64748B (Slate) */
  --accent:        #64748B;
  --accent-dim:    rgba(100,116,139,.14);
  --teal:          #0284C7;

  /* Surfaces – Tertiary #F8FAFC + Slate-Skala */
  --bg:            #F8FAFC;
  --surface:       #FFFFFF;
  --surface-alt:   #EEF2F7;
  --surface-3:     #E2E8F0;
  --surface-4:     #CBD5E1;

  /* Borders – Slate */
  --border:        rgba(100,116,139,.20);
  --border-str:    rgba(100,116,139,.34);

  /* Text – Neutral #1B1B1B + Slate */
  --text:          #1B1B1B;
  --text-2:        #334155;
  --text-m:        #64748B;
  --text-dis:      #94A3B8;

  /* Semantic */
  --success:       #0D7A3E;
  --success-bg:    rgba(13,122,62,.10);
  --warning:       #B45309;
  --warning-bg:    rgba(180,83,9,.10);
  --destructive:   #C0392B;
  --dest-bg:       rgba(192,57,43,.10);
  --info:          #005CA9;
  --info-bg:       rgba(0,92,169,.10);

  /* Glows */
  --glow-xs:   0 1px 3px rgba(0,0,0,.08), 0 0 8px rgba(0,92,169,.06);
  --glow-sm:   0 2px 8px rgba(0,0,0,.10), 0 0 20px rgba(0,92,169,.07);
  --glow-md:   0 4px 16px rgba(0,0,0,.11), 0 0 40px rgba(0,92,169,.08);
  --glow-lg:   0 8px 32px rgba(0,0,0,.13), 0 0 70px rgba(0,92,169,.09);
  --focus:     0 0 0 3px rgba(0,92,169,.30);
}

/* ── Navigation ─────────────────────────────────────────────── */
.nav__hamburger span { background: var(--text); }

.nav.scrolled {
  background: rgba(248,250,252,.92);
  border-bottom-color: rgba(100,116,139,.16);
  box-shadow: 0 2px 12px rgba(0,0,0,.08);
}
.nav__mobile {
  background: rgba(248,250,252,.97);
  border-top-color: rgba(100,116,139,.14);
}

/* ── Hero Glows ──────────────────────────────────────────────── */
.hero__glow-1 {
  background: radial-gradient(circle, rgba(0,92,169,.10) 0%, transparent 65%);
}
.hero__glow-2 {
  background: radial-gradient(circle, rgba(100,116,139,.10) 0%, transparent 65%);
}
.hero__title .highlight {
  text-shadow: 0 0 30px rgba(0,92,169,.25);
}

/* ── Stat Cards ──────────────────────────────────────────────── */
.hero__stat-card--accent {
  border-color: rgba(0,92,169,.22);
  background: linear-gradient(135deg, var(--surface), rgba(0,92,169,.06));
}

/* ── Stats-Section Glow ──────────────────────────────────────── */
.stats::before {
  background: radial-gradient(ellipse, rgba(0,92,169,.08) 0%, transparent 65%);
}

/* ── CTA Banner Glow ─────────────────────────────────────────── */
.cta-banner::before {
  background: radial-gradient(ellipse, rgba(0,92,169,.08) 0%, transparent 65%);
}

/* ── Listen-Bullets – SVG in Signal-Blau ───────────────────── */
.content-body ul li::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23005CA9' stroke-width='3'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}

/* ── Ghost Button ────────────────────────────────────────────── */
.btn--ghost {
  background: rgba(0,0,0,.04);
  color: var(--text);
  border-color: rgba(0,0,0,.14);
}
.btn--ghost:hover {
  background: rgba(0,0,0,.08);
  border-color: rgba(0,0,0,.20);
}

/* ── Footer – Tiefes Signal-Blau ─────────────────────────────── */
/* Footer bleibt dunkel, obwohl der Rest des Themes hell ist – die
   Text-Tokens sind daher lokal für den dunklen Hintergrund überschrieben
   (sonst greifen die hellen-Theme-Werte, kaum lesbar auf #00345C). */
.footer {
  background: #00345C;
  border-top-color: rgba(255,255,255,.07);
  --text: #F4F7FC;
  --text-2: #D3DCEC;
  --text-m: #A8B7D1;
  --text-dis: #7E8FB0;
}