An AI job-hunting platform built on an energetic spring-mint green against black and white, with pale-mint section bands carrying the page rhythm. Bold condensed Titillium Web display headings pair with a clean Inter UI, and the CTA system runs on high-contrast pill buttons — black pills for primary actions, a mint-green pill for the signature accent.
Titillium Web carries the bold, slightly condensed display headings; Inter handles all body, UI, and button text. Heavy condensed headlines over light, airy Inter body is the core typographic tension.
White product-mockup card with a 40px asymmetric corner, floating on a soft shadow over the mint band.
White quote card, 1px hairline border, 24px corners — avatar, name and a user-love quote.
The full-width black band with a continuously scrolling marquee of live job titles.
White field, 1px hairline border, square corners.
8px base unit. Feature cards sit at lg (24px); full-width bands breathe at section (96px); the primary pill uses wide sm/section padding.
A wide range: square (0px) inputs, 12–24px cards, then pill buttons at 28px (black) and 36px (mint), plus a distinctive 40px product-card corner and fully round (9999px) score rings.
| Name | Width | Key changes |
|---|---|---|
| Mobile | < 576px | Single column; nav → hamburger; feature rows stack; pills go full-width |
| Tablet | 576–991px | Two-column feature rows collapse; testimonials drop to 1–2 up |
| Laptop | 992–1199px | Multi-column grids intact; tightened gutters |
| Desktop | ≥ 1200px | Full layout; centered ~1200px column; full-bleed mint & black bands |
Touch targets: button-primary clears 44×44 WCAG-AAA at 0/20px padding. Collapsing: nav → hamburger below the tablet breakpoint (yellow CTA stays); multi-column pricing/feature grids reflow to a single stacked column; section padding compresses from section (128px) toward giant (64px); display type scales down while keeping weight 500.