Design a light-mode website section: tactile industrial field photography grounded by precise b2b ergonomics and ethereal blue stippled kinetic atmosphere.
LAYOUT
Structured two-column layout occupying a 1280px container. The left column (approximately 45% width) holds vertical progressive disclosure: category pill, 3-line display headline, supporting paragraph, CTA group, and reassurance microcopy. The right column (55% width) forms an orchestrated asymmetrical mosaic of three photo cards, one central smartphone frame, and an offset metric badge over an ethereal dot-matrix cloud.
PALETTE (use these exact hex values)
- #FFFFFF — Canvas White: Dominant background canvas across page and floating micro-pill surfaces
- #F8FAFC — Panel Tint: Subtle cool-toned container surface for lower social proof section
- #0E1726 — Ink Slate: High-contrast headings, primary logo, and core UI icons
- #5A6578 — Muted Steel: Body copy, navigation links, reassurance microcopy, and secondary badges
- #1860EC — Electric Cobalt: Primary interactive buttons, key headline highlight word, and chat send bubble
- #EBF2FE — Ice Blue Tint: Background pill fill for top feature category badge and AI sparkle icon
- #10B981 — Success Emerald: Metric badge checkmark circle for performance validation
- #E2E8F0 — Hairline Border: Outlines on secondary CTA buttons, metric badges, and lower panel divider
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, DM Sans, General Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px body-lg, 20px subheading, 64px display. Tracking -0.03em at display, -0.01em at body, 0.08em at caps. Pragmatic, authoritative, and frictionless. The bold sans-serif display typography creates immediate industrial credibility with tight letterspacing and heavy weights, while maintaining clean readability at small technical scales in mobile UI prompts. Plus Jakarta Sans or Inter provides the necessary mechanical precision without feeling sterile.
GEOMETRY & SPACING
Corner radii — cards 18px, links 6px, inputs 10px, buttons 10px. Spacing on a 8px unit, 20px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Subtle and targeted elevation only. Floating cards and the iPhone mockup feature an ultra-soft diffuse drop shadow (0 12px 32px rgba(15, 23, 42, 0.08)) that lifts them cleanly off the stippled cyan atmospheric cloud. Micro-badges on images use pure white surfaces with crisp 1px borders to separate without muddy shadows.
IMAGERY
Photography captures real-world technical maintenance: technicians wearing hard hats, industrial machinery, wiring cabinets, and mechanical components (filters, motors, gears). Lighting is natural workshop illumination with crisp focus. Abstract AI imagery is strictly restricted to a fine-grained, blue particulate stipple texture that blooms organically in the background.
SIGNATURE DETAIL — the thing that makes this design itself
The juxtaposition of gritty, authentic factory equipment photos nested alongside an organic stippled blue halftone cloud and a floating handheld UI mockup. To replicate it, layer candid industrial action shots with white micro-pill labels and a realistic smartphone over an ethereal cyan dot-matrix powder bloom.
MUST
- Highlight only the final key benefit word ('AI.') in Electric Cobalt (#1860EC) within the main headline.
- Pair candid, high-resolution photography of real factory floor technicians with immaculate, clean UI badges.
- Keep device mockups strictly to genuine mobile form factors to reflect handheld field usage.
- Use soft stippled, pointillist cyan/blue particulate gradients behind visual assets to communicate AI processing.
AVOID
- Do not use dark sci-fi neon styling or glowing grids; the aesthetic must remain grounded, bright, and enterprise-grade.
- Never make all CTA buttons blue; preserve clear hierarchy with one primary filled button and one light border secondary.
- Do not round headline CTA buttons into full pills; keep their radius at 10px while badges stay fully rounded.
- Avoid generic 3D illustrations or abstract robot renders in place of authentic shop-floor workers.
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 中尝试 
