Design a dark-mode website section: deep midnight canvas anchored by floating api telemetry cards connected through glowing radial orbits.
LAYOUT
The hero uses a 50/50 desktop split inside a 1280px max-width container. The left column stacks metadata eyebrow, massive 3-line headline, body paragraph, paired CTA buttons, and reassurance row. The right column showcases a dynamic orbital diagram where four specialized feature cards orbit a central elevated API terminal card.
PALETTE (use these exact hex values)
- #050814 — Midnight Ground: Deep structural backdrop for the hero header and canvas surface
- #0f2048 — Deep Royal Ambient: Diffused atmospheric radial glow beneath central telemetry cards
- #0b1226 — Card Surface: Background fill for floating orbit feature cards and code consoles
- #1e2c4f — Card Border: Subtle 1px boundary stroke framing dark elevated cards
- #ffffff — Primary Text: Headlines, high-priority titles, and active tab highlights
- #94a3b8 — Muted Text: Body copy, supporting metadata, and inactive navigation links
- #818cf8 — Eyebrow Indigo: Category tags, feature eyebrow labels, and terminal status markers
- linear-gradient(90deg, #4f46e5 0%, #ec4899 55%, #f97316 100%) — Hero CTA Gradient: High-conversion CTA button fill and hero display text accent
- #5d5fef — Solid Indigo Accent: Header CTA button fill and language pill active state indicator
- #4ade80 — Syntax Green: Terminal status indicators and live API response telemetry markers
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, DM Sans, system-ui), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 16px body, 18px body-lg, 20px subheading, 28px heading, 64px display. Tracking -0.03em at display, 0 at body. The typographic tone is authoritative, highly technical, and modern. Plus Jakarta Sans conveys approachable engineering maturity with its round geometry and tight headline tracking (-0.035em). JetBrains Mono provides precise, professional code formatting that immediately establishes developer credibility.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Depth is created through luminosity and layered translucency rather than traditional drop shadows. Ambient radial blue glows (#0f2048 to #1a367d) sit behind elevated dark cards, mimicking light cast through tinted glass. The central terminal card overlaps the orbiting satellite cards via z-index layering and crisp 1px borders.
IMAGERY
Visual assets consist strictly of minimalist vector graphics: 3D perspective wireframe skyscrapers, flat location pins, line-based ROI sparklines, and radar rings. Everything is rendered in semi-translucent neon wireframes against dark fills. Avoid photorealistic real estate photography or generic stock imagery.
SIGNATURE DETAIL — the thing that makes this design itself
The standout signature is the orbital API composition: an elevated interactive code terminal anchored at the center, surrounded by satellite use-case cards connected by faint dashed orbital paths over a soft royal blue glow. To use it properly, keep the center card grounded in code while peripheral cards represent business outcomes. Misusing it involves crowding the orbit with too many cards or eliminating the dashed trajectories.
MUST
- Use deep indigo radial glows (#0f2048) behind cards to simulate spatial atmospheric depth.
- Restrict the vibrant multi-stop gradient to only the primary CTA and key phrase accent.
- Maintain high contrast by keeping primary display typography crisp pure white (#ffffff).
- Anchor code displays with genuine syntax coloring (amber keys, green strings, cyan integers).
AVOID
- Never use pure black (#000000); maintain deep navy (#050814) for background depth.
- Avoid applying the multi-stop gradient to borders or background cards indiscriminately.
- Do not remove the code terminal tabs; they signal developer accessibility and readiness.
- Never use heavy drop shadows on cards; rely on fine borders and ambient radial illumination.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1440:896. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. Try in DraPub 
