Design a dark-mode website section: deep navy command center anchored by glowing systemic nodes, technical authority, and calm circuit-board precision.
LAYOUT
The layout is divided into two distinct horizontal tiers within a 1280px constrained container. The top tier is a self-contained hero CTA card split 45/55 between left-aligned conversion copy and a centralized radial node architecture on the right. The lower tier features a 6-column footer grid (brandmark summary + 4 link lists + newsletter signup), concluding with a full-width bottom metadata bar housing copyright and live operational telemetry.
PALETTE (use these exact hex values)
- #040812 — Canvas Ground: Root page background behind CTA card and site footer container.
- #0a1120 — Elevated Container: Background for the large upper CTA card housing the system map.
- #101b2e — Node Surface: Background fill for orchestrator diagram nodes and newsletter input field.
- #1a263d — Border Subtle: 1px hairline borders for the main card, nodes, badges, and input boundaries.
- #2b7fff — Electric Cobalt: Primary CTA button background, key headline text accent, and central node glow.
- #10b981 — Telemetry Emerald: System status operational indicator, SOC 2 badge icon, and invoice node wire.
- #06b6d4 — Telemetry Cyan: Connector route and indicator dot for submittal and drawing nodes.
- #a855f7 — Telemetry Purple: Circuit path and status dot for RFIs and stakeholder nodes.
- #f8fafc — Text Primary: Primary headings, active link headers, node titles, and brandmark text.
- #94a3b8 — Text Muted: Paragraph copy, footer links, node status descriptions, and copyright notices.
TYPOGRAPHY
Typeface Inter (or Geist, Plus Jakarta Sans, system-ui), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px body, 16px body-lg, 18px subheading, 20px heading, 44px display. Tracking -0.03em at display, 0.01em at body, 0.08em at labels. The typography is clinical, modern, and authoritative. Set in Inter or Geist, the type balances dense technical data at 11-13px with an imposing, tightly tracked (-0.03em) 44px display headline. The single blue-accented word in the headline provides instant emotional emphasis on reliability ('confidence').
GEOMETRY & SPACING
Corner radii — cards 24px, links 6px, inputs 10px, buttons 10px. Spacing on a 8px unit, 24px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Depth is produced via subtle value tiering and luminescence rather than traditional box shadows. Surfaces step from #040812 (base canvas) to #0a1120 (card container) to #101b2e (interactive nodes), separated by crisp 1px borders (#1a263d). The only true glow effect is a localized radial halo of 12px to 16px soft cobalt bloom centered on the primary orchestrator node.
IMAGERY
There is no photographic imagery present. The visual language relies purely on schematic system architecture: line-drawn vector iconography, 2px orthogonal routing traces, and terminal dot indicators. Any future imagery must consist of strict wireframe UI mocks, technical schematics, or schematic blueprints—never lifestyle photography.
SIGNATURE DETAIL — the thing that makes this design itself
The standout signature is the radial AI Orchestrator diagram on the CTA card: a central glowing cobalt hub interconnected to eight satellite workflow nodes via rounded orthogonal circuit traces and miniature telemetry dots. Misusing this feature by cluttering lines, adding diagonal paths, or changing terminal nodes into arbitrary shapes instantly dissolves the enterprise control-plane identity.
MUST
- Keep background surfaces within deep slate/navy spectrums (#040812 to #101b2e); never use true pitch black.
- Use electric blue (#2b7fff) sparingly: exclusively for primary CTA buttons, hero word highlight, and central orchestrator glow.
- Ensure all technical circuit lines have an orthogonal 90-degree bend with generous corner rounding.
- Pair satellite nodes with dual-line typography: 12px semi-bold white title over 11px muted status description.
AVOID
- Do not introduce filled solid badges or neon background fills behind icons; use translucent or line styles.
- Never make secondary action buttons solid; keep them strictly ghost links with arrow affordance.
- Avoid straight diagonal lines in node connections; use strictly orthogonal routed paths.
- Do not use high-saturation reds or warm yellows in the node telemetry; keep accents restricted to emerald, cyan, and purple.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1792:1024. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试 
