Design a dark-mode website section: dark industrial robotics console illuminated by high-voltage cyan signal paths and tactical gradient controls.
LAYOUT
Structured around an asymmetrical two-column desktop grid within a 1280px container. The left column hosts the textual hierarchy—eyebrow, massive display headline, paragraph, dual CTA buttons, and a 4-column metric grid. The right column is entirely devoted to the angled isometric flow diagram, creating a seamless contrast between text clarity and process visualization.
PALETTE (use these exact hex values)
- #0b0f17 — Void Surface: Deep matte background canvas across the entire viewport
- #1e293b — Subtle Border: Secondary button outlines, grid separators, and structural division lines
- #00e5c9 — Signal Cyan: Live state indicators, flow-line illumination, eyebrow label, and metric icons
- linear-gradient(90deg, #5843ea 0%, #00d2b4 100%) — Action Gradient: Primary conversion button fill in hero and navigation bar
- #ffffff — Pure Text: Headline typography, stat values, and active interactive titles
- #94a3b8 — Muted Slate: Body copy, secondary labels, navigation links, and step descriptors
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, DM Sans, General Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px subheading, 24px heading, 56px display. Tracking -0.03em at display, 0.12em at eyebrow. The typographic tone is authoritative, hyper-efficient, and engineered. Plus Jakarta Sans or a clean neo-grotesque like Inter provides geometric precision without feeling sterile. Tight negative tracking on display headings delivers an aggressive, modern commercial presence.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 10px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Depth is rendered organically through lighting within the 3D isometric render rather than UI drop shadows. The UI plane remains remarkably flat and grounded, relying on luminous neon glows and 1px borders to separate interactive surfaces.
IMAGERY
Features dark-mode 3D isometric renders of real-world logistics machinery (freight containers, robotic arms, conveyor tracks, sorting bins). Visuals must feel engineered, matte-textured, and functional; casual illustrations or stock human photography would completely break the aesthetic.
SIGNATURE DETAIL — the thing that makes this design itself
The glowing cyan vector path meandering through realistic isometric industrial hardware, linking sequential operational steps to validate the software's automated orchestration.
MUST
- Anchor the right half of the hero with detailed 3D technical imagery against the dark background.
- Use radiant cyan (#00e5c9) strictly for status indicators, process flow conduits, and stat icons.
- Maintain high headline impact by breaking sentences across two short, punchy lines ending in periods.
- Apply the gradient (#5843ea to #00d2b4) only to high-priority conversion buttons.
AVOID
- Do not switch the canvas to light mode; the visual identity depends on darkness.
- Do not use warm accent colors like red, orange, or yellow for primary UI components.
- Do not remove the glowing cyan conduit connecting the isometric workflow steps.
- Do not exceed a 10px to 12px border radius on CTA buttons; fully round pills weaken the industrial tone.
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 
