@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
  --bg-deep: #000000;
  --bg-surface: #05070e;
  --bg-card: #080c16;
  --border-muted: #111827;
  --border-active: #1e293b;
  --accent-cyan: #0284c7;
  --accent-glow: rgba(2, 132, 199, 0.12);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background-color: var(--bg-deep);
}

body {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  background-color: var(--bg-deep);
  color: #94a3b8;
  line-height: 1.6;
}

/* Subtiler, dunkler Radial-Glow im Hintergrund (kein grelles Leuchten mehr) */
.hero-ambient {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 500px;
  height: 250px;
  background: radial-gradient(circle, var(--accent-glow) 0%, transparent 70%);
  filter: blur(100px);
  pointer-events: none;
  z-index: 0;
}

/* Dunkle Boxen */
.dark-panel {
  background: var(--bg-card);
  border: 1px solid var(--border-muted);
}
.dark-panel:hover {
  border-color: var(--border-active);
}

/* Custom Deep Scrollbar */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #000000;
}
::-webkit-scrollbar-thumb {
  background: #111827;
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #1e293b;
}