Design a light-mode website section: crystalline glass floating over a warm sunrise gradient, engineered for enterprise clarity.
LAYOUT
The header floats centered across the top with a pill silhouette. The main hero split spans two columns: the left houses the product badge, giant 60px display statement, descriptive paragraph, dual CTA buttons, and 3-point value proposition; the right features an expansive tilted glass workspace mockup that terminates over a horizon grid above the client trust line.
PALETTE (use these exact hex values)
- linear-gradient(135deg, #FFF1E6 0%, #FBECE2 25%, #E6F3FD 65%, #C2E2FB 100%) — Canvas Gradient: Full hero background fill transitioning smoothly from warm peach to atmospheric sky blue
- #0E1E38 — Deep Navy Text: Primary headline, logo mark text, and prominent content labels
- #53647E — Slate Blue Body: Subtitles, body paragraphs, and secondary navigation links
- #1D68F2 — Cobalt Primary: Primary CTA button background, active tab indicators, and brand glyphs
- #28B1B8 — Teal Accent: Accent text highlight ('redefined'), success states, and metric progress bars
- #FFF4EC — Warm Tag Background: Background for due date badges and warning status chips
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, DM Sans, General Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 17px body-lg, 20px subheading, 24px heading, 42px heading-lg, 60px display. Tracking -0.03em at display, -0.01em at body. The type is clean, institutional, and technical yet approachable. Plus Jakarta Sans provides crisp geometry with friendly circular counters, balancing municipal authority with next-generation AI efficiency. Fallbacks like Inter or General Sans work seamlessly if geometric proportions are preserved.
GEOMETRY & SPACING
Corner radii — cards 20px, links 9999px, inputs 10px, buttons 10px. Spacing on a 8px unit, 20px gaps, 80px between sections, 1240px container, comfortable density.
DEPTH
Depth is created using multi-planar 3D glass sheets floating above an architectural grid floor. Shadows are soft, wide-spread, and tinted with ambient cyan and sky blue rather than neutral black. Crisp 1px inner and outer translucent borders reinforce the tactile edge of physical glass.
IMAGERY
The visual hero is an axonometric 3D software rendering combined with an aerial architectural blueprint tile. Imagery avoids photorealism, relying instead on clean 3D isometric CAD geometry with soft ambient occlusion and clean white-and-blue materials.
SIGNATURE DETAIL — the thing that makes this design itself
The dual-tone atmospheric canvas (warm dawn peach meeting crystalline sky blue) hosting a multi-layered, floating architectural glass interface. Replicate it with a 135-degree diffuse gradient and layered semi-transparent cards with 1px translucent white borders.
MUST
- Use high-transparency frosted glass panels with crisp 1px pure white outlines.
- Pair deep navy typography (#0E1E38) with soft peach and cyan canvas atmospheres.
- Highlight key verbs or breakthrough features using gradient text transitions to bright cyan.
- Keep buttons compact with clean 10px border radii rather than full pills for actions.
AVOID
- Do not use dark, heavy dropshadows; stick to diffused, ambient blue-tinted glows.
- Do not make the entire background a solid flat white or grey.
- Avoid harsh square corners; every container must have between 10px and 24px radius.
- Never use pure black (#000000) for typography; rely exclusively on navy-tinted tones.
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 中尝试 
