Design a dark-mode website section: luminous fiber-optic streams converging from the dark void into a single coherent intelligence core.
LAYOUT
The hero employs an asymmetric two-column split across a 1280px max-width boundary. The left column (55% width) holds the hierarchical narrative: category pill badge, towering 64px display headline, three-line body summary, dual CTA cluster, and a horizontal row of enterprise compliance trust badges. The right column (45% width) presents the data flow schematic where vertical categorical inputs funnel into the luminous intelligence core and exit as a concentrated ray of context.
PALETTE (use these exact hex values)
- #020508 — Void Black: Absolute backdrop canvas providing total optical absorption for glow effects
- #071018 — Surface Elevated: Background for secondary interactive controls and nested pill containers
- #52e5b8 — Electric Mint: Primary hero CTA fill, key headline emphasis text, and central glowing node accent
- #03281c — Deep Mint Foreground: High-contrast dark typography placed atop the electric mint button background
- #ffffff — Pure Starlight: Primary headline text, high-emphasis titles, and active navigation labels
- #94a3b8 — Subdued Slate: Body descriptions, secondary labels, and inactive chevron navigation markers
- #ff8a3d — Amber Ingestion: Fine trace line and icon accent representing people and expertise data feeds
- #7c5cff — Purple Content: Vector connection trace representing unstructured content and documents
- #1a2430 — Border Subtle: Hairline 1px perimeter outlines on dark secondary buttons and pill badges
TYPOGRAPHY
Typeface Inter Display (or Plus Jakarta Sans, Geist Sans, system-ui), weights 400/500/600/700. Sizes 12px caption, 14px body-sm, 16px body, 18px body-lg, 20px heading, 64px display. Tracking -0.03em at display, 0.05em at micro badges. The typographic tone is authoritative, clean, and hyper-modern, driven by an engineered geometric sans-serif (Inter Display match). The extreme negative tracking at 64px delivers an institutional enterprise gravity, while the generous letter-spacing on micro labels conveys precision instrumentation. If substituting, choose modern digital-native faces like Geist Sans or Plus Jakarta Sans, never rounded or playful humanist fonts.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Depth is created purely by luminosity and light emission rather than standard drop shadows. The background acts as an infinite optical sink, while the central node and light fibers cast radial and gaussian glows (box-shadow: 0 0 32px rgba(82, 229, 184, 0.35)) to float above the surface. Fine 1px borders provide tactile edge definition without muddying the void.
IMAGERY
The imagery is strictly schematic and computational, centered on an ethereal column of vertical optical fibers that bundle and bend into a glowing silicon core. Light travels along delicate colored trace wires representing data ingestion streams. Photorealistic human imagery or cartoon vector illustrations would completely destroy the high-tech enterprise tone.
SIGNATURE DETAIL — the thing that makes this design itself
The defining visual hallmark is the right-hand optical fiber nexus: multi-colored categorical data paths (orange, purple, blue, green) that bend and fuse into an intense, vertically-sheared mint light beam centered around a glowing squircle processor. To use it properly, ensure the incoming traces look like thin signal conduits while the converging beam feels luminous and radiant. Misusing it involves making the lines thick or adding heavy gradient fills that obscure the dark canvas.
MUST
- Use pure void black (#020508) as the canvas to let neon accents maintain intense contrast.
- Restrict bright mint green (#52e5b8) to primary conversion actions and deliberate highlight phrases.
- Ensure the hero title uses tight tracking (-0.035em) with exact one-word color highlighting.
- Keep connecting circuit traces ultra-fine (1px to 1.5px stroke) to simulate optical glass fibers.
AVOID
- Do not introduce heavy opaque gray card containers behind the hero typography or diagrams.
- Do not use multiple bright gradient buttons; only one dominant primary CTA is permitted.
- Never replace the fiber-optic vertical light beam with generic flat geometric vector blocks.
- Do not allow secondary trace line colors (orange, purple) to overpower the dominant mint glow.
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. 在 DraPub 中尝试 
