Design a dark-mode website section: clinical deep-space dark mode illuminated by sweeping bioluminescent cyan beams and floating frosted glass telemetry nodes.
LAYOUT
The viewport uses a balanced two-column asymmetric hero split over a 1280px container. The left column (roughly 45% width) houses the overline, dominant 64px headline, narrative body, dual CTA button group, and a three-column statistical proof strip. The right column (55% width) hosts the interactive visual synapse diagram with stacked agent glass cards anchored against sweeping diagonal cyan rays.
PALETTE (use these exact hex values)
- #02050e — Obsidian Canvas: Deepest primary background canvas absorbing light across the entire viewport.
- linear-gradient(90deg, #a3f784 0%, #5ce4c6 100%) — Primary Action Gradient: Vibrant lime-to-mint gradient fill for primary CTA buttons and accent emphasis.
- #38bdf8 — Electric Cyan: Overline kicker text, starburst gradient highlight, and connector path glow.
- #6ee7b7 — Mint Accent: Emphasis coloring for final word 'practices.' in hero display title.
- #ffffff — Text Primary: Headlines, card titles, stat metrics, and high-emphasis labels.
- #94a3b8 — Text Secondary: Subheadlines, card sub-items, navigation links, and stat descriptor text.
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, SF Pro Display, General Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px body, 16px body-lg, 20px subheading, 28px heading, 64px display. Tracking -0.03em at display, 0.08em at overline. Plus Jakarta Sans conveys sharp, modern computational precision balanced with approachable clinical clarity. The heavy weight display sizing paired with tight letterspacing feels authoritative and enterprise-ready, while the spaced cyan kicker injects a terminal-like technological authority.
GEOMETRY & SPACING
Corner radii — cards 20px, links 999px, inputs 999px, buttons 10px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Elevation is achieved entirely without physical dark dropshadows. Instead, depth is communicated through atmospheric luminosity: layered translucent glass cards (blur 12px-20px) sitting on top of a diagonal volumetric light ray that glows outwards from behind the canvas.
IMAGERY
Visual imagery avoids raster photography in favor of a clean, schematic product diagram with neon luminescence. Elements include floating vector connection lines, branded icon pills, and high-fidelity simulated agent telemetry dashboards against deep space gradients.
SIGNATURE DETAIL — the thing that makes this design itself
The sweeping diagonal cyan-blue auroral light beam juxtaposed against the glowing central AI star node that dynamically branches into glass-morphic channel pills and telemetry cards. Replicate by layering an angled radial gradient (#00a6ff) behind translucent card surfaces (rgba(9, 18, 38, 0.65)) with 1px luminescent cyan borders.
MUST
- Reserve the lime-mint gradient exclusively for the primary CTA and key accent phrases.
- Use backdrop-filter blur(16px) on all floating glass cards and pills.
- Keep display headline tracking strictly negative (-0.03em) for a unified typographic lockup.
- Apply fine 1px luminescent cyan borders (rgba(56, 189, 248, 0.2)) to dark cards.
AVOID
- Never use pure white backgrounds for cards; always use translucent dark glass.
- Do not introduce warm hues like orange, red, or yellow into the primary interface palette.
- Avoid thick solid borders; borders must never exceed 1px hairline thickness.
- Do not apply heavy dropshadows; rely solely on soft colored radial back-glows.
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 中尝试 
