Design a light-mode website section: precision enterprise healthcare darkroom anchored in surgical teal, live code proof, and calm ivory foundations.
LAYOUT
The page flows vertically from high emotional energy to systematic utility. It begins with the self-contained 1240px dark CTA banner housing a balanced 50/50 split between value proposition and code proof. Directly beneath, an ample 64px gap transitions into a light 6-column footer grid, completed by a bottom legal bar with region selection.
PALETTE (use these exact hex values)
- #091c20 — Deep Obsidian Teal: Background fill for the primary CTA banner and dark terminal container
- #f8fafc — Clinical Off White: Primary page canvas housing the sitemap footer and utility links
- #34b382 — Surgical Mint: Primary action button background, status telemetry dots, and headline emphasis
- #0d262b — Terminal Card Charcoal: Fill for the embedded API code box inside the dark CTA banner
- #1b3c43 — Terminal Hairline Border: Subtle stroke defining the code box, pill badges, and input borders
- #ffffff — Text Crisp White: Primary display headings and active tab labels on dark surfaces
- #8ba6ab — Muted Slate Teal: Secondary description copy and inactive tab labels inside the dark hero
- #0f172a — Footer Ink Charcoal: Column headers and brand identity labels on the light footer
- #64748b — Footer Soft Gray: Footer navigation links, legal copyright notice, and placeholder text
- #ffffff — Light Card Surface: Background for the feature callout card on the bottom right
TYPOGRAPHY
Typeface Inter (or Plus Jakarta Sans, SF Pro Display, Helvetica Neue), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 14px body, 15px subheading, 16px body-lg, 20px heading, 36px display. Tracking -0.02em at display, 0 at body, 0.05em at caps. The voice is clinical, highly competent, and developer-literate. Inter provides neutral, highly readable structural scaffolding, while JetBrains Mono injects developer-grade rigor that reassures enterprise IT buyers.
GEOMETRY & SPACING
Corner radii — cards 24px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 64px between sections, 1240px container, comfortable density.
DEPTH
Depth is strictly restrained and graphic rather than skeuomorphic. The dark CTA box utilizes ambient corner radial highlights rather than drop shadows, while the light promo card uses a crisp 1px neutral hairline border (#e2e8f0) with zero blur shadow.
IMAGERY
Iconography is purely line-drawn with uniform 1.5px stroke weight (shields, padlocks, arrows, and dialogue bubbles). No photographic imagery is used; the technical interface terminal serves as the visual centerpiece.
SIGNATURE DETAIL — the thing that makes this design itself
The dual-tone split CTA hero embedding an active JSON API execution terminal alongside clinical enterprise compliance marks.
MUST
- Highlight only the final critical clause in display headlines with mint (#34b382).
- Maintain high contrast between the dark CTA hero and the clean white footer base.
- Render code payloads in a legitimate monospaced font with realistic HTTP status indicators.
- Use 24px border radius consistently on hero level containers.
AVOID
- Never introduce warm colors like orange or red; maintain cold surgical teal dominance.
- Do not drop the dark CTA container straight onto a dark footer without clear boundary separation.
- Avoid omitting the developer code block, as it establishes the core technical proof.
- Do not use generic pill buttons for primary actions; use 8px rounded rectangles.
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 中尝试 
