Design a dark-mode website section: deep-space navy illuminated by radiant cyan conduits, precise telemetry cards, and cybernetic stage-lighting pedestals.
LAYOUT
The page uses an asymmetrical two-column hero rhythm framed within a 1240px container. The left column stacks metadata tags, display headline, summary text, dual actions, and a three-part feature list. The right column showcases the comparative node-to-card diagram over an illuminated pedestal. A dark rounded container anchors the bottom of the viewport, introducing secondary features on a horizontal grid.
PALETTE (use these exact hex values)
- #030712 — Cosmic Void: Root background canvas providing high contrast for glowing visual elements
- #081028 — Substratum Blue: Background for bottom feature shelf and elevated diagram panels
- #2563eb — Electric Cobalt: Solid primary action buttons, focused controls, and brand identity marks
- #38bdf8 — Bioluminescent Cyan: Leading stop in headline text gradient, telemetry checkmarks, and pedestal lighting
- #a855f7 — Synthetic Violet: Trailing stop in headline text gradient and connecting fiber lines
- #ef4444 — Entropy Red: Warning borders, fault icons, and failure sequence text in contrast diagram
- #ffffff — Photon White: Primary headings, active states, and bold value statements
- #94a3b8 — Starlight Slate: Body paragraphs, navigation links, and unselected status labels
- #1e293b — Nebula Border: Card outlines, pill contours, and structural layout separators
TYPOGRAPHY
Typeface Inter (or Geist Sans, SF Pro Display, Plus Jakarta Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px body, 16px body-lg, 20px subheading, 24px heading, 32px heading-lg, 48px display. Tracking -0.025em for display, -0.01em for headings, 0 for body. The typography speaks with authoritative, technical calm. Inter (or equivalent neo-grotesque sans-serif) delivers utilitarian clarity with machined geometric precision. The tight tracking at larger sizes conveys enterprise readiness and reliability, matching the infrastructure tone of an operating system.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 8px. Spacing on a 4px unit, 20px gaps, 80px between sections, 1200px container, comfortable density.
DEPTH
Depth is created using optical radiance rather than drop shadows. Translucent surface fills (#0a1329) with 1px structural outlines (#1e293b) sit on top of the deep canvas (#030712). Intense focal elements, such as the pedestal and the telemetry card, generate ambient cyan bloom using multiple layered radial gradients that bleed gently across neighboring surfaces.
IMAGERY
Avoids photography entirely, relying instead on clean vector node schematics paired with isometric glowing hardware metaphors (e.g., the concentric illuminated platform). Visuals must appear technical, structural, and schematic. Stylized 3D renderings or photorealistic assets would clash with the precise engineering aesthetic.
SIGNATURE DETAIL — the thing that makes this design itself
The dual-state architectural comparison diagram connected by glowing fiber optics and anchored on an illuminated cyan pedestal. This single visual moves the product from abstract code to a concrete, dependable runtime. Misusing it by over-saturating the canvas with multiple glowing pedestals destroys the focal anchor of the entire hero.
MUST
- Restrain gradient text strictly to key capability nouns, never whole paragraphs.
- Use 1px borders with low alpha (#1e293b) to define edges against the black canvas.
- Isolate danger colors (#ef4444) strictly to the 'before' state to reinforce contrast.
- Anchor floating 3D graphic representations with radiant floor pedestals.
AVOID
- Do not apply ambient radial glows behind body copy or primary navigation.
- Never use solid opaque fills for comparison node boxes.
- Avoid warm yellows or greens for brand elements outside isolated telemetry glyphs.
- Do not remove the glowing pedestal beneath the floating card; it breaks visual gravity.
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 
