Design a light-mode website section: serene clinical intelligence wrapped in airy lavender tints and balanced editorial typography.
LAYOUT
The layout is divided into three distinct vertical zones inside a 1240px container. The top zone splits into an editorial headline on the left and a three-column metric cluster on the right. The middle zone is a balanced 3x2 grid of feature cards spaced by 20px gutters. The bottom zone concludes with a full-width trust bar combining clinical checklist items with a single high-contrast CTA.
PALETTE (use these exact hex values)
- #FAFAFD — Canvas Background: Page-level background tint providing soft atmospheric contrast against white cards
- #FFFFFF — Card Surface: Primary surface for modular feature cards, stat clusters, and bottom footer ribbon
- #EDEFF5 — Card Border: Hairline structural border delineating cards and pills against the canvas
- #5850EC — Brand Indigo: Accent text within the main headline, icon glyphs, and primary CTA button fill
- #121826 — Primary Text: Primary headlines, stat numbers, card titles, and high-contrast structural text
- #6B7280 — Muted Text: Body copy descriptions, stat captions, and checkmark feature labels
- #E0564C — Coral Accent: Highlight color for regulatory and consent icons, stats, and tag chips
- #2563EB — Cobalt Accent: Highlight color for communication icons, stats, and metadata tags
TYPOGRAPHY
Typeface Newsreader (or Instrument Serif, Georgia, Source Serif 4), weights 400/600. Sizes 11px caption, 13px body-sm, 14px body, 16px subheading, 28px heading, 42px display. Tracking -0.02em. The typographic voice blends institutional medical prestige with contemporary digital agility. The display headline employs an elegant editorial serif (reminiscent of Newsreader) to evoke trustworthiness, intellectual rigor, and patient empathy. In contrast, Inter delivers high-efficiency, neutral readability across dense clinical descriptors, stats, and navigation labels.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 8px, buttons 10px. Spacing on a 8px unit, 20px gaps, 80px between sections, 1240px container, comfortable density.
DEPTH
Elevation is expressed with flat, crisp graphic clarity rather than heavy realistic shadows. Cards sit upon the slightly tinted canvas defined by a crisp 1px neutral outline and an exceptionally diffuse ambient shadow (blur 24px, opacity 3%). This creates an orderly, clean-room medical software feel without tactile skeumorphism.
IMAGERY
No photographic imagery is present; the design relies exclusively on refined vector iconography encased in pastel tinted discs. Icons are strictly geometric, monoline, and friendly, representing healthcare concepts like speech bubbles, translation globes, clipboards, and shields. Cluttered illustrations or photorealistic medical photos would violate the clinical precision.
SIGNATURE DETAIL — the thing that makes this design itself
The signature element is the combination of an editorial serif headline accented by colored inline emphasis ('Care in any language.') directly mirrored by pastel circular icon badges throughout the card grid. Misusing this system typically involves using the serif font inside the UI cards or oversaturating the badge backgrounds, destroying the delicate clinical atmosphere.
MUST
- Keep the canvas background subtly tinted (#FAFAFD) to make white cards pop cleanly.
- Use Newsreader serif exclusively for the primary display headline; never use it in cards.
- Maintain categorical accent color consistency between the icon, the stat, and the card's tags.
- Keep card borders sharp at 1px solid #EDEFF5 with zero or imperceptible drop shadow.
AVOID
- Do not introduce dark saturated backgrounds; the design relies entirely on light-mode restraint.
- Do not apply drop shadows heavier than 0 4px 20px rgba(0, 0, 0, 0.03).
- Do not mix more than three accent colors across the icon category sets.
- Do not use full-width solid colored backgrounds for feature cards.
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 中尝试 
