Design a dark-mode website section: deep midnight canvas electrified by glowing neon cyan shields, precise metrics, and muted slate telemetry.
LAYOUT
The layout follows a top-down structured grid: a top-left aligned header block sets category context, followed immediately by an asymmetrical two-column main section (approx 65% hero card on the left, 35% vertical stack of three cards on the right). Below this sits a full-width panoramic impact card containing a title group on the left and four evenly spaced stat columns on the right. The visual flow guides attention from the hero shield to the stack, then settles on the impact metrics.
PALETTE (use these exact hex values)
- #06090e — Canvas Background: Deepest backdrop surface for the entire feature section layout
- #0b111a — Card Surface: Background fill for all feature cards and stat panels
- #1c2738 — Card Border: Subtle 1px perimeter outline defining panel boundaries
- #38bdf8 — Electric Cyan: Primary focal glow, neon vector outlines, and prominent key metric highlights
- #34d399 — Neon Emerald: Accent icon backdrop and small badge text for trust/metrics callouts
- #3b82f6 — Royal Indigo: Secondary icon tiles and subtle gradient halo illumination
- #818cf8 — Vibrant Purple: Tertiary feature category icon tile background
- #ffffff — Text Primary: Main headings, high-impact titles, and active button labels
- #94a3b8 — Text Muted: Secondary descriptions, bullet points, and subheaders
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans, SF Pro Display), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px subheading, 24px heading, 28px heading-lg, 36px display. Tracking -0.02em at titles, 0.05em at uppercase tags. The typography is clinical, confident, and highly legible, using a modern geometric/humanist sans-serif like Inter. Heavyweights are reserved strictly for brief, punchy headings, while body copy maintains high legibility with generous letter-tracking at smaller sizes. The voice reads as enterprise healthcare-grade software: calm, reliable, and mathematically precise.
GEOMETRY & SPACING
Corner radii — cards 16px, links 999px, inputs 10px, buttons 10px. Spacing on a 8px unit, 20px gaps, 64px between sections, 1240px container, comfortable density.
DEPTH
Depth is created purely through luminous edge contrast and soft optical glow rather than drop shadows. Surface levels differ subtly between the #06090e base canvas and the #0b111a card fill, framed by a soft 1px border (#1c2738). Neon cyan elements project a soft radial atmosphere onto background grids, producing an illuminated glass cockpit feeling.
IMAGERY
The imagery is entirely abstract, technical, and vector-based—exemplified by the glowing dual-stroke cyan shield set atop perspective wireframe grids. No photography, stock human images, or skeuomorphic textures are present. Any replacement graphic must remain a vector line-art asset glowing against dark blue space.
SIGNATURE DETAIL — the thing that makes this design itself
The glowing cyan vector shield radiating over a subtle perspective grid inside a dark bordered card. It instantly signals automated, cybernetic protection. To replicate it, use a dual-stroke vector outline with an outer SVG gaussian blur filter (radius ~12px) layered atop faint 1px cyan grid lines fading into #06090e.
MUST
- Use 1px borders colored around #1c2738 to subtly delineate dark surfaces without stark contrast.
- Restrict bright cyan (#38bdf8) to focal graphics, active metrics, and critical checkmarks.
- Maintain generous padding (minimum 24px to 36px) inside all card containers.
- Use uppercase tracking (0.08em) strictly on small category pills and sub-labels under 12px.
AVOID
- Never use pure white (#ffffff) borders or heavy 2px+ divider strokes.
- Do not fill large card backgrounds with bright cyan or saturated gradients.
- Avoid mixed border radii; lock cards to 16px and small button/icon tiles to 10px.
- Do not add drop shadows that cast light onto dark backgrounds—use subtle cyan light blooms instead.
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 中尝试 
