Design a dark-mode website section: industrial deep space engineering framed by restrained mint accents, atmospheric planetary depth, and crisp telemetry typography.
LAYOUT
Asymmetric two-column split layout spanning a 1280px grid. The left column (spanning ~45% width) holds the narrative block: display title, lead paragraph, dual CTA buttons, and a 3-column telemetry metric dock. The right column (~55% width) and canvas underlay are dedicated entirely to the hero spacecraft and industrial laser beam visual.
PALETTE (use these exact hex values)
- #020406 — Deep Space Void: Absolute background canvas behind the orbital imagery
- #0d141b — Orbital Slate: Translucent backing for secondary hover states and metric card containers
- #3fa381 — Mission Mint: Primary CTA button fill, active indicators, and logo icon graphic
- #356254 — Submerged Jade: Muted green text highlight applied exclusively to the middle display line
- #e29a66 — Beam Amber: Warm highlight line for the auxiliary top button border and graphical focal beam
- #f8fafc — Telemetry White: Primary headings, action button labels, and high-emphasis metric numbers
- #94a3b8 — Atmosphere Grey: Lead narrative copy, sub-labels, and horizontal navigation links
- #25323d — Precision Border: 1px hairline outlines on ghost buttons, tags, and separators
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans,Geist Sans,Helvetica Neue), weights 400/500/600/700. Sizes 12px caption, 13px body-sm, 15px body, 20px subheading, 28px heading, 64px display. Tracking -0.03em at display, 0.05em at caps. The type choice is stark, rational, and unembellished—evoking mission telemetry dashboards and precision defense interfaces. The extreme weight contrast between the 64px display headline and the 12px technical stat labels reinforces a sense of industrial scale. Inter or Geist Sans serves as an ideal zero-license modern grotesque replacement.
GEOMETRY & SPACING
Corner radii — cards 8px, links 4px, inputs 6px, buttons 6px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1280px container, comfortable density.
DEPTH
Depth is created entirely through photographic atmospheric layering, where elements sit directly over orbital renders with zero drop shadows. Card surfaces and buttons rely on 1px translucent borders (rgba(255, 255, 255, 0.12)) and dark alpha fills to separate themselves from the planetary imagery behind them.
IMAGERY
Photorealistic, cinematic 3D CGI rendering depicting hard-surface aerospace equipment, spacecraft arrays, and mega-scale planetary infrastructure. Imagery must feel mathematically grounded and physically plausible, avoiding cartoonish sci-fi tropes, lens flares, or generic galaxy nebulae.
SIGNATURE DETAIL — the thing that makes this design itself
The three-line 64px display title with the middle line tinted in low-luminance jade (#356254) followed by a deliberate full stop, set directly beside a high-intensity photonic amber beam piercing downward from orbit. Misusing it by brightening the green line ruins the understated technical sophistication.
MUST
- Use strict left-aligned text composition for the hero stack to preserve vertical reading tension.
- Restrict bright mint green (#3fa381) to primary actions, key metrics, and orbital trace vectors.
- Tint secondary headline phrases in desaturated deep jade (#356254) rather than bright saturated accents.
- Maintain high letter-spacing (0.08em+) on small capitalized navigational and branding text.
AVOID
- Do not apply heavy dropshadows or glowing neon glows to buttons; maintain planar precision.
- Do not use multi-color gradients across the display headline text.
- Do not crowd the right half of the canvas where the satellite and beam need visual clearance.
- Do not use fully rounded pill shapes for primary buttons; keep corners clipped to 6px.
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 中尝试 
