Design a dark-mode web interface screen: dual-canvas fintech architecture balancing high-depth midnight command visuals with clinical, paper-white product evaluation surfaces.
LAYOUT
The page adheres to a 1200px centered grid utilizing a dramatic thematic sandwich: dark hero with split copy/isometric screen, transitioning directly to a daylight-white feature block with a 6-card grid and embedded dark stat bar. This continues into a 3-tier pricing matrix, before switching back to deep midnight for a dual-card testimonial slider, an enclosed CTA strip, and a compact tabular footer.
PALETTE (use these exact hex values)
- #070B19 — Midnight Space: Primary background for hero section, navigation bar, testimonial band, and global footer.
- #FFFFFF — Clinical White: Background for feature breakdown, pricing sections, and light-theme card fills.
- #0F172A — Card Slate Dark: Fill for stats ribbon, floating testimonial cards, and pre-footer CTA container.
- #2DD4BF — Electric Cyan: High-priority action color for primary CTA buttons and hero accent highlights.
- #3B49DF — Royal Indigo: Emphasized pricing tier card button, badge backgrounds, and ambient glow undertones.
- #8B5CF6 — Ambient Violet Glow: Diffused background radial lighting behind hero mockups and section divider gradients.
- #0F172A — Text Primary Dark: Headlines and high-contrast labels within the white mid-section canvas.
- #FFFFFF — Text Primary Light: Primary text, metric numbers, and button labels on dark midnight surfaces.
- #94A3B8 — Text Muted Slate: Secondary descriptors, navigation links, and inactive icons on dark backgrounds.
- #E2E8F0 — Border Light Stroke: Subtle card outlines and section separators across the light mid-body.
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, Manrope, SF Pro Display), weights 400/500/600/700. Sizes 12px caption, 13px body-sm, 15px body, 18px body-lg, 20px subheading, 32px heading, 48px display. Tracking -0.025em for display headers, 0 for body. The typographic tone is authoritative, institutional, and razor-sharp, driven by Plus Jakarta Sans. Its wide apertures, tight display tracking (-0.025em), and clear numerical glyphs reflect modern institutional fintech efficiency. When licensing or rendering, Inter or Manrope serve as exact drop-in replacements without breaking column wraps.
GEOMETRY & SPACING
Corner radii — cards 12px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 96px between sections, 1200px container, comfortable density.
DEPTH
Depth is strictly compartmentalized by canvas mode. Dark sections rely on luminous ambient backdrops (soft radial gradients in #8B5CF6 and #3B82F6 at 20-30% opacity) beneath subtle 1px white/slate translucent borders (rgba(255, 255, 255, 0.08)). Light sections discard shadows entirely, enforcing planar clarity via crisp 1px borders (#E2E8F0) and disciplined whitespace.
IMAGERY
Visual imagery is anchored by clinical UI product captures, rendered in slight 3D isometric perspective with high-density data tables, dark surfaces, and thin line-art charts. Supplementary icons are thin, precise 1.5px vector strokes enclosed in squircle color pads. Never use generic corporate stock photography or lifestyle imagery.
SIGNATURE DETAIL — the thing that makes this design itself
The sudden, cinematic transition from an atmospheric dark command center (complete with a glowing, tilted isometric dashboard) straight into a stark white, border-ruled utility grid. To execute it properly, maintain identical 1200px container bounds across the transition and carry the cyan accent color across both halves as an unbroken visual tether. Misusing it involves adding grey transition zones or muddying the white section with shadows.
MUST
- Switch abruptly between dark midnight and pure white sections without intermediate neutral grey bridges.
- Limit electric cyan (#2DD4BF) exclusively to conversion buttons, active toggles, and hero highlight text.
- Maintain uniform 12px border radii on all structural cards across both dark and light sections.
- Use soft pastel backgrounds (cyan, lavender, amber) inside 44px rounded squares for light-mode feature icons.
AVOID
- Do not introduce sharp 0px or pill 999px radii to content cards; keep them strictly at 12px.
- Do not saturate card backgrounds in the middle section; keep the canvas pure white (#FFFFFF).
- Do not apply heavy drop shadows with high blur in the light section; rely on 1px borders (#E2E8F0).
- Do not mix serif fonts into headlines; maintain geometric neo-grotesk styling throughout.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 2192:3760. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. 在 DraPub 中尝试 
