/* Hub — neutrals + accents uit de drie logo-paletten */
:root {
  --bg: #0c0f12;
  --bg-elevated: #151a1f;
  --text: #f3f6f8;
  --text-muted: #9aa5b0;
  --accent: #6ca974;
  --accent-2: #00a99d;
  --accent-3: #ff843e;
  --border: rgba(255, 255, 255, 0.1);
  --font-display: "Outfit", system-ui, sans-serif;
  --font-body: "Manrope", system-ui, sans-serif;
}

.hero-hub {
  background:
    radial-gradient(ellipse 55% 50% at 15% 30%, rgba(108, 169, 116, 0.28), transparent 60%),
    radial-gradient(ellipse 45% 40% at 85% 25%, rgba(255, 132, 62, 0.22), transparent 55%),
    radial-gradient(ellipse 40% 45% at 70% 85%, rgba(0, 169, 157, 0.24), transparent 55%),
    linear-gradient(165deg, #0c0f12, #12181e 60%, #0c0f12);
}

.hero-atmosphere {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, var(--bg) 100%);
  pointer-events: none;
}

.brand-hub .section-title {
  font-size: clamp(1.7rem, 3.5vw, 2.4rem);
}