Design a light-mode website section: editorial enterprise rigor rendered in warm ivory, literary serif typography, and tactile diagrammatic card pipelines.
LAYOUT
Asymmetric two-column split within a centered 1240px container. The left 45% is dedicated to editorial authority: brand headline, succinct descriptor, paired CTAs, and a three-column trust feature list. The right 55% hosts an expansive visual orchestration diagram with inputs on the left, an orchestration card in the center, and destinations plus telemetry on the right.
PALETTE (use these exact hex values)
- #FAF8F5 — Parchment Canvas: Base canvas tone providing an intellectual, warm paper backdrop across the viewport
- #FFFFFF — Elevated Card White: Background for floating schematic workflow cards and step nodes
- #1B1C1E — Charcoal Black: Primary headings, dominant button fills, and active navigation labels
- #666970 — Muted Slate: Body copy, supporting explanations, and secondary metadata captions
- #EAE6DE — Warm Outline: Card borders, secondary button outlines, and structural diagram container strokes
- #D85A5A — Accent Coral: Start of headline text gradient, primary logo stripe, and classifier icons
- #5C73B8 — Accent Slate Blue: Midpoint of headline gradient, second logo stripe, and extraction icons
- #3B8E71 — Accent Sage: End of headline gradient, third logo stripe, and validation status badges
TYPOGRAPHY
Typeface Canela (or Newsreader, Instrument Serif, Playfair Display), weights 400/500. Sizes 11px caption, 13px body-sm, 15px body, 18px body-lg, 20px subheading, 68px display. Tracking -0.025em. The typography speaks with the quiet confidence of an elite publication meeting enterprise technology. The serif headline brings warmth, gravitas, and human deliberation, balancing the potentially sterile nature of automated document processing. For production, Canela or Newsreader delivers the exact weight and grace needed.
GEOMETRY & SPACING
Corner radii — cards 14px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 80px between sections, 1240px container, airy density.
DEPTH
Depth is created through soft layered card surfaces rather than heavy shadows. White cards cast faint ambient drop shadows (0 12px 32px rgba(27, 28, 30, 0.04)) across the parchment background, providing tactile elevation without visual noise. Connecting diagram lines sit underneath the cards on level 0, establishing clear spatial hierarchy.
IMAGERY
Avoids literal stock photography entirely in favor of an abstract, programmatic workflow schematic. The visual artifact blends architectural system diagrams (inputs, orchestration, outputs, metrics) with a faint ethereal pastel vertical fluting in the background. Diagrams must feel rigorous, precise, and bespoke.
SIGNATURE DETAIL — the thing that makes this design itself
The harmonious union of an editorial literary serif title with a multi-stop horizontal gradient accent ('Enterprises') against a warm parchment background, anchored on the right by a precise, floating schematic workflow pipeline.
MUST
- Use warm parchment #FAF8F5 as the primary background instead of pure digital white #FFFFFF.
- Limit the multi-color gradient strictly to the emphasis word in the serif display headline.
- Maintain high contrast by using deep charcoal #1B1C1E for primary actions and body copy.
- Wrap diagram components in crisp white cards with fine borders and soft airy shadows.
AVOID
- Do not use harsh cold gray backgrounds or default blue enterprise links.
- Do not render body text or interactive labels in the serif display typeface.
- Do not overload buttons with bright color gradients; reserve gradient strictly for typographic accents.
- Do not apply heavy dark borders; keep container strokes light and tone-matched to #EAE6DE.
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 中尝试 
