Design a dark-mode website section: deep tech dark field transitioning cleanly into an open, high-legibility enterprise white footer canvas.
LAYOUT
The composition follows an intentional top-to-bottom binary shift. The upper hemisphere is an expansive dark-themed CTA block with centered display copy, dual actions, and a 4-part segmented metric grid. The lower hemisphere abruptly snaps to a 6-column clean white footer: brand lockup and blurb on the far left, four link groups in the center, and a newsletter capture form on the right, grounded by an edge-to-edge legal bar.
PALETTE (use these exact hex values)
- #030712 — Obsidian Deep: Background fill for the hero CTA section, contrasting against luminous light streaks.
- #ffffff — Clean Canvas: Primary surface for the multi-column footer block and main CTA display typography.
- #06b6d4 — Bioluminescent Cyan: Flanking vertical illumination streaks, brand mark gradient, and metric outline icons.
- #2563eb — Luminous Cerulean: Gradient start for primary CTA and solid fill for the newsletter submit button.
- #8b5cf6 — Digital Violet: Gradient stop on primary CTA button, imparting a sophisticated modern tech glow.
- #94a3b8 — Slate Text Muted: Subordinate body text and captions inside the dark CTA container.
- #4b5563 — Charcoal Footer Text: Navigation links, legal copyright, and descriptive paragraphs in the white footer.
- #111827 — Charcoal Footer Heading: Footer column headers, newsletter title, and company wordmark.
- #e5e7eb — Border Subtle Light: Footer sub-tier horizontal divider and email input field outline.
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans,SF Pro Display,system-ui), weights 400/500/600/700. Sizes 12px caption, 13px body-sm, 15px body, 15px subheading, 18px body-lg, 30px heading, 48px display. Tracking -0.03em at large display, 0 at body. The typographic tone is objective, technical, and authoritative. Inter (or similar refined geometric sans-serifs) performs cleanly across extreme scales—from a punchy 48px display statement with tight negative tracking to meticulous 12px legal disclaimers. Its neutral geometry prevents the expressive aurora backdrop from feeling chaotic.
GEOMETRY & SPACING
Corner radii — cards 0px, links 2px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1200px container, comfortable density.
DEPTH
Flat and atmosphere-driven. No drop shadows or raised surfaces are used anywhere in the layout. Hierarchy and visual depth rely solely on luminous gradients radiating behind crisp foreground typography on the dark section, followed by sheer flat contrast on the white footer.
IMAGERY
Abstract programmatic vertical light-streaks evoking synthetic sensory arrays or server telemetry. Gradients range strictly from deep cyan (#00d2ff) to vibrant teal/emerald (#10b981) against an inky void. Photographic imagery or 3D human renders are strictly absent and would compromise the algorithmic, data-first tone.
SIGNATURE DETAIL — the thing that makes this design itself
The jarring, razor-sharp edge where the dark cybernetic aurora CTA meets the sterile white enterprise footer without any decorative divider or gradient blend. It signals the boundary between cutting-edge computational autonomy (the void above) and institutional corporate reliability (the structured directory below).
MUST
- Strictly separate the CTA dark background and white footer with a razor-sharp horizontal line; do not blur or fade.
- Use thin 1px vertical borders (#ffffff15) to partition dark-field statistics.
- Render stat icons in thin stroke (1.5px) neon gradient hues matching the ambient background.
- Keep footer input fields cleanly outlined in 1px solid #d1d5db with 8px border radius.
AVOID
- Do not apply drop shadows to buttons; depth is created by gradient contrast alone.
- Never place full-bleed photography behind the aurora graphic effect.
- Avoid centering footer link columns; they must be strictly left-aligned under their respective headers.
- Do not use dark backgrounds for the footer directory; it must stay stark white.
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 中尝试 
