Design a light-mode website section: clinical enterprise precision suspended gracefully over a warm, sunlit alpine meadow landscape.
LAYOUT
Asymmetric two-column split hero occupying a standard 1360px container. The left column (roughly 42% width) is vertically stacked: status pill, display title, descriptive paragraph, dual CTA buttons, and metric proof badge. The right column (58% width) is a dynamic scattered 2x3 masonry constellation of modular cards surrounding a dominant dark console. A glass dock spans horizontally along the lower landscape threshold.
PALETTE (use these exact hex values)
- #F1F6FB — Canvas Sky Mist: top background wash behind navigation and primary typography
- #FFFFFF — Pure Card White: primary surface fill for floating modular UI cards and pill containers
- #0E1726 — Console Slate Night: high-contrast focal dashboard card displaying real-time AI telemetry
- #0D62E0 — Care Royal Blue: primary CTA button background and keyword emphasis in hero title
- #0F172A — Deep Slate Text: primary headings, prominent numbers, and bold micro-labels
- #475569 — Subtle Muted Slate: body copy, supporting descriptions, and inactive metadata tags
- #10B981 — Vibrant Teal Indicator: success badges, completed checkmarks, and operational status dots
- #F59E0B — Warm Amber Notice: compliance icons and triage action tags within card components
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans, SF Pro Display, General Sans), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 17px body-lg, 24px subheading, 56px display. Tracking -0.025em on titles, -0.01em on body, +0.02em on caps. Clean, authoritative, and compassionate. The geometric neo-grotesque type delivers clinical reliability and technical rigor without feeling cold or intimidating. Subtle negative tracking on display sizes keeps the 56px headline dense and assertive, while open tracking on uppercase micro-labels ensures effortless legibility in medical status tags.
GEOMETRY & SPACING
Corner radii — cards 20px, links 999px, inputs 10px, buttons 10px. Spacing on a 8px unit, 20px gaps, 96px between sections, 1360px container, comfortable density.
DEPTH
Depth is created through atmospheric layering rather than harsh shadows. The photographic landscape acts as the deepest ground, while white floating cards cast very broad, low-opacity ambient shadows (0 14px 40px rgba(15, 23, 42, 0.07)). The central dark console provides an illusion of layered software projection directly on top of subtle sine-wave particle tracks.
IMAGERY
Warm, authentic human-focused healthcare photography depicting nurses and elderly residents engaging with natural smiles. Imagery is neatly masked into rounded frames inside cards, juxtaposed against a sweeping real-world landscape of rolling alpine hills and yellow wildflowers. Avoid sterile hospital rooms, cold diagnostic machines, or generic corporate stock models.
SIGNATURE DETAIL — the thing that makes this design itself
The juxtaposition of an inky dark-slate telemetry card floating alongside crisp white healthcare modules, set against a photorealistic sunlit alpine meadow landscape. Misusing this means either flattening everything to white cards, eliminating the dark focal anchor, or discarding the scenic meadow base in favor of a sterile flat gradient.
MUST
- Anchor headline attention by highlighting critical noun phrases in vibrant royal blue (#0D62E0).
- Keep card corners consistently rounded to 20px for modular floating components.
- Use pill tags (999px radius) for all categorical kickers, status indicators, and avatars.
- Introduce warm human imagery via rounded rectangular cutouts within top and bottom card clusters.
AVOID
- Do not use harsh black (#000000) for text or borders; stick to deep slate (#0F172A).
- Do not use sharp 0px or small 4px radii on floating modules; it ruins the modern medical softness.
- Do not crowd the left column with imagery; allow the 56px headline generous whitespace.
- Never replace the dark central tile with a white card; the composition requires high-contrast visual weight.
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 中尝试 
