Design a light-mode website section: hygienic pastel-coded bento cards anchored by precise quantified clinical telemetry.
LAYOUT
Centered single-section layout with a strict vertical rhythm: pill eyebrow badge first, followed by a stacked display headline and constrained 600px paragraph. Below sits a rigid 5-column grid of equal-width feature cards (16px gap), concluding with a complementary 5-column metric summary card directly beneath.
PALETTE (use these exact hex values)
- #fafbfe — Canvas Background: ambient page background with faint top-edge radial luminescence
- #ffffff — Surface White: elevated cards and metric container surface
- #edf2f7 — Border Subtle: hairline boundary framing cards, badges, and containers
- #0f172a — Primary Text: headline display and bold card titles
- #64748b — Muted Text: secondary paragraph copy, checklist items, and metric labels
- #3b82f6 — Scheduling Blue: icon, divider line, checkmarks, and stat for scheduling column
- #f43f5e — Patient Rose: icon, divider line, checkmarks, and stat for patient experience column
- #06b6d4 — Intelligence Teal: icon, divider line, checkmarks, and stat for clinical copilot column
- #8b5cf6 — Revenue Violet: icon, divider line, checkmarks, and stat for revenue optimization column
- #0284c7 — Compliance Cobalt: icon, divider line, checkmarks, and stat for compliance column
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Inter, Geist, DM Sans), weights 400/500/600/700. Sizes 11px caption, 12px body-sm, 13px body, 15px body-lg, 17px subheading, 36px heading, 46px display. Tracking -0.025em for display, 0 for body, 0.05em for caps. The typographic tone is authoritative, hygienic, and modern-clinical. Using a clean neo-grotesque sans-serif with geometric roundness (such as Plus Jakarta Sans or Geist) creates immediate trust and technological credibility without appearing sterile or cold.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 8px, buttons 9999px. Spacing on a 4px unit, 16px gaps, 80px between sections, 1200px container, comfortable density.
DEPTH
Depth is created almost entirely without drop shadows. The design relies on pure white surfaces resting on a barely-there #fafbfe cool gray canvas, delineated by crisp 1px #edf2f7 hairline borders. Ambient elevation is suggested solely through a very soft, faint radial glow beneath the header.
IMAGERY
No photographic imagery is present. Visual rhythm is carried entirely by delicate two-tone line icons, micro-checkmarks, colored horizontal pill dividers, and crisp mathematical typography. Any illustrative addition should be restricted to minimal, monoline stroke-based vectors.
SIGNATURE DETAIL — the thing that makes this design itself
The strict vertical chromatic pipeline: each column has its own singular accent token that flows sequentially through the icon background, a short 28px divider dash, the bullet checkmarks, and the bottom 36px metric.
MUST
- Strictly align each metric column horizontally with its corresponding feature card directly above.
- Use exactly one distinct accent color token per column across icon, divider bar, checkmarks, and stat.
- Keep card stroke borders extremely faint (1px solid #edf2f7) with no visible black drop shadow.
- Set the hero headline's concluding phrase in the primary brand blue #3b66f5.
AVOID
- Never mix accent colors within the same column or card unit.
- Do not use dark or heavy drop shadows; cards should rely on thin borders and subtle ambient lightness.
- Never wrap feature card titles onto three lines; enforce concise 2-line max labels.
- Do not omit the small colored horizontal line separating the icon from the title.
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 中尝试 
