Design a light-mode website section: clinical orbital intelligence anchored on sterile daylight with a high-contrast tactical darkroom console.
LAYOUT
The header spans the full max-width with a symmetrical split: brandmark left, navigation center, compact dark CTA right. The hero divides the viewport into two columns: a 45% wide left stack containing kicker, display headline, body copy, dual buttons, and metrics bar. The remaining 55% is claimed by the oversized, perspective-tilted hardware screen displaying mission control software. Below the content, a faint dot-matrix wave grounds the bottom left.
PALETTE (use these exact hex values)
- #FFFFFF — Canvas Ground: Primary surface for the hero typography and left-hand corporate navigation.
- #090D16 — Console Hull: Deep navy-black shell enclosing the perspective telemetry dashboard mockup.
- #0F1626 — Console Card: Segmented card containers within the dashboard for graphs, feeds, and feeds.
- #1D68F2 — Active Cobalt: Primary action fill on the hero CTA, eyebrow kicker text, and selected app icons.
- #0B0F19 — Midnight Ink: Extreme contrast text color for primary display headlines and brand logomark.
- #5A6578 — Tactical Slate: Body copy, secondary subheadings, and unselected navigation link labels.
- #EF4444 — Warning Alert: High-priority telemetry warnings, threat markers, and trajectory lines on dark UI.
- #10B981 — Operational Emerald: Telemetry nominal status dots and system verification indicators.
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans, SF Pro Display, Helvetica Neue), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px body-lg, 28px subheading, 56px display. Tracking -0.025em for display, 0.08em for uppercase kickers. The typographic tone is authoritative, severe, and defense-grade, evoking aerospace instrumentation and national security readiness. Inter or Plus Jakarta Sans provides the neutral, high-legibility geometric chassis required for clinical credibility. The bold punctuation-delimited triple-word headline provides a cadence like a military doctrine, contrasted immediately with light monospaced sub-labels.
GEOMETRY & SPACING
Corner radii — cards 12px, links 2px, inputs 6px, buttons 6px. Spacing on a 4px unit, 16px gaps, 80px between sections, 1360px container, tight density.
DEPTH
Depth is created almost entirely through the hard contrast between the pristine light page ground and the deep midnight dashboard. The dark dashboard features an expansive, low-opacity ambient drop shadow (0 25px 50px -12px rgba(11, 15, 25, 0.25)) that makes it float forward into physical space. Within the dashboard itself, elevation is purely planar, separated by 1px stroke boundaries (#1E293B) rather than shadows.
IMAGERY
The core visual asset is a photorealistic dark-side globe rendering with bright atmospheric rim lighting and digital orbital trajectories. A secondary abstract stippled particle wave sits in the bottom left canvas, suggesting radar coverage or sensor fields without cluttering. Imagery must always remain strictly technical, militaristic, and orbital; lifestyle photography or warm human elements would ruin the brand posture.
SIGNATURE DETAIL — the thing that makes this design itself
The split-world juxtaposition: an austere, stark white editorial presentation on the left that flows seamlessly into an angled, hyper-dense dark mission-control cockpit on the right. Misusing this means either flattening the dashboard onto the 2D plane without perspective or turning the entire hero into a generic dark mode page.
MUST
- Keep the primary background clinical white (#FFFFFF) to preserve the sharp contrast against the dark console.
- Restrict bright electric red (#EF4444) strictly to active missile/threat detections in telemetry views.
- Maintain tight, punchy punctuation in the display headline ('Detect. Track. Defend.').
- Use monospaced numbers (#000000 / #FFFFFF) in telemetry widgets to avoid visual jitter.
AVOID
- Do not convert the entire canvas to dark mode; the contrast between light copy and dark cockpit is vital.
- Never soften the headline with rounded or playful font families; it must remain technical and urgent.
- Do not add heavy multi-color gradients to CTA buttons; stick to flat #1D68F2.
- Avoid pill radius on action buttons; use a controlled 6px radius instead.
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 中尝试 
