Design a dark-mode website section: mission-critical ai infrastructure framed in deep obsidian navy with electric cerulean particle resonance.
LAYOUT
The viewport is bisected into two key functional zones within a 1280px container. The top zone holds a split hero/CTA featuring display copy on the left and a four-stat telemetry strip overlaid on a particle cloud on the right. A single full-bleed 1px horizontal rule marks the boundary to the bottom zone, which contains a multi-column enterprise footer organized into branding, four navigation columns, and a right-aligned newsletter capture.
PALETTE (use these exact hex values)
- #050811 — Deep Space Void: Global page canvas and fundamental dark background behind all modules
- #0c1322 — Elevated Surface: Background for email text input and social icon tiles
- #141e30 — Subtle Boundary: 1px hairline dividers separating the hero CTA from the footer and dividing metrics
- #2b66f6 — Electric Cobalt: Primary interactive buttons, key focal link text, and core brand emphasis
- #4388ff — Cerulean Radiance: Gradient start point for the hero text emphasis and particle mesh lighting
- #34d399 — Telemetry Mint: System status indicator dots and high-reliability operational badges
- #ffffff — Pure Stark: Display headings, numeric metrics, brand title, and primary button labels
- #94a3b8 — Cool Steel: Hero summary paragraph, navigation text links, and metric labels
- #64748b — Deep Muted Slate: Sub-metric explanations, newsletter disclaimer, and copyright metadata
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, 15px body-lg, 18px subheading, 28px heading, 48px display. Tracking -0.025em on display, 0.08em on uppercase labels. The typographic tone is ultra-composed, technical, and unflinchingly authoritative, mirroring mission-critical terminal interfaces. Inter provides a clean, neutral skeleton that eliminates decorative quirkiness while maximizing tabular and metric legibility. If substituting, use Geist Sans or SF Pro to preserve the cold, precise developer-first cadence.
GEOMETRY & SPACING
Corner radii — cards 8px, links 9999px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Depth is rendered flat-architectural without drop shadows or physical skeuomorphism. Separation relies purely on value changes from the #050811 canvas to #0c1322 surface fills, sealed by crisp 1px borders (#141e30). Atmospheric depth emerges exclusively from an ambient blue particle point cloud layered behind the telemetry cluster.
IMAGERY
Visual assets are strictly synthetic and data-driven, featuring a high-density 3D particle lattice or point cloud rendered in shades of cerulean blue (#2b66f6 to #4388ff). Photography, human portraits, and illustrative cartoons are strictly forbidden; only computational, mathematical, or schematic nodes may be used.
SIGNATURE DETAIL — the thing that makes this design itself
The design's unmistakable hallmark is the four-column telemetry cluster anchored alongside the CTA, separated by razor-thin vertical rules and hovering directly over a dark cerulean particle wave. To preserve it, maintain the rigorous cadence of icon, 28px metric, label, and secondary footnote. It is degraded whenever cards or background panels are introduced behind the metrics, breaking the seamless atmospheric blend.
MUST
- Reserve the electric cobalt (#2b66f6) strictly for primary forward actions and focused typographic highlights.
- Format category headers in the footer as uppercase, tracking at 0.08em, 11px, in pure white (#ffffff).
- Use 1px hairline rules in #141e30 for metric separators and major horizontal layout dividing lines.
- Anchor status dots with a distinct 6px circular glyph colored in vibrant mint (#34d399).
AVOID
- Do not introduce warm accents like red, orange, or yellow outside of severe system failure warnings.
- Never use soft drop shadows; depth must be defined entirely by borders, surface steps, and background particle luminosity.
- Do not center-align the footer columns; all vertical lists must adhere to strict left-alignment.
- Never omit the subtle 1px vertical borders between the telemetry metric columns.
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 中尝试 
