Design a light-mode website section: warm editorial typography meets modern enterprise saas atop layered porcelain cards and deep emerald curves.
LAYOUT
Structured around an asymmetric 50/50 two-column hero grid. The left column stacks the kicker badge, dual-tone editorial headline, descriptive paragraph, dual CTA buttons, and a tripartite feature strip in strict vertical rhythm. The right column breaks the strict grid with an elevated, slightly angled application mockup layered with floating satellite insight cards that bleed elegantly toward the bottom-right viewport.
PALETTE (use these exact hex values)
- #FBFBF9 — Canvas Porcelain: Default page background delivering a warm, publication-grade foundation.
- #FFFFFF — Card Pure White: Background for floating UI boards, stat widgets, and popovers.
- #085244 — Forest Primary: Primary action button fill, logo mark, and italic headline emphasis.
- #052B24 — Deep Midnight Emerald: Rich organic swooping corner canvas fill with subtle patterned dots.
- #111918 — Charcoal Black: Dominant color for primary display typography and main card headings.
- #566260 — Slate Neutral: Body copy, navigation links, and candidate sub-labels.
- #E5E7E5 — Border Hairline: Subtle card outlines, button borders, and column dividers.
- #FFF8EE — Warm Sparkle Tint: Background fill for the top eyebrow pill badge.
- #D97706 — Amber Star: Accent star iconography in the AI kicker chip.
TYPOGRAPHY
Typeface Newsreader (or Fraunces, Canela, Tiempos Headline), weights 400/500/600. Sizes 11px caption, 13px body-sm, 15px body, 17px body-lg, 20px subheading, 60px display. Tracking -0.025em. The typography speaks with authoritative elegance by juxtaposing an expressive transitional serif display face with an impeccably neutral modern sans-serif. Newsreader or Fraunces provides intellectual prestige and editorial weight, while Plus Jakarta Sans delivers crisp, functional legibility across complex software UI chips.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 8px, buttons 10px. Spacing on a 8px unit, 20px gaps, 80px between sections, 1280px container, comfortable density.
DEPTH
Depth is created through gentle, diffused dual-layer drop shadows (0 12px 32px -4px rgba(0, 40, 30, 0.08)) applied to pure white cards resting on the ivory canvas. The kanban workspace and its two satellite cards are physically stepped using overlapping z-index layers, culminating in the metric card casting a soft shadow over the deep emerald organic background.
IMAGERY
Avoid photographic hero imagery or generic stock lifestyle photos of office workers. The visual language relies purely on immaculate vector UI abstractions, crisp SVG iconography, authentic miniature avatars within candidate cards, and subtle dot-matrix geometric accents overlaid on dark corner curves.
SIGNATURE DETAIL — the thing that makes this design itself
The dual-tone headline transition from charcoal upright roman into a deep forest green italic cursive ('faster, together.'), visually mirrored by floating porcelain UI cards that overlap an organic deep-emerald textured backdrop.
MUST
- Switch display headlines from upright charcoal into forest green italic on the punchline.
- Use warm ivory (#FBFBF9) instead of sterile 100% white for the background canvas.
- Maintain generous 10px-16px border-radius values across all cards and interactive buttons.
- Pair software UI mockups with detached floating satellite cards to create depth.
AVOID
- Do not use high-saturation neon greens; stick strictly to deep corporate forest greens.
- Do not render the entire display headline in italics; reserve it exclusively for the final clause.
- Never use sharp 0px corners; this identity demands softened, humanized geometry.
- Avoid flat, single-layer software screenshots without floating context chips.
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. Try in DraPub 
