Vision analysis (read-only)
## Palette
- `#0A1E47` Primary navy (header, footer, CTA backgrounds)
- `#1B57B3` Secondary blue (links, button accents, timeline highlight)
- `#E63946` / `#D32027` Red accent (savings badges, sale callouts)
- `#2BB673` Green (transactional CTAs like "Book Your Test Drive")
- `#F4F5F7` Light grey (alternating section backgrounds, cards)
- `#FFFFFF` Background base
- `#333740` Body text dark grey
## Typography
- Sans-serif throughout, geometric/neutral (similar to Inter, Source Sans, or DIN-style).
- Headings: bold/semibold (600–700), tight letter spacing, sizes roughly 28–44px for section titles, ~20–24px for card titles.
- Body: regular weight (400), ~14–16px, generous line-height (~1.5).
- Prices use a heavier weight and slightly larger size to anchor cards (~22–26px bold).
- Uppercase used sparingly on badges/labels ("SAVE £1,000", "DRIVE FOR YOUR COMMUNITY").
- A custom script/logo font for the "100" anniversary mark only.
## Layout patterns
- Fixed dark navy top bar with thin utility row.
- Full-bleed hero banner with overlaid promotional modal (centered, white card with rounded corners and countdown timer).
- Content sections alternate white / light-grey backgrounds; max-width container roughly 1200–1300px, centered.
- Repeating 3-column card grids (vehicle listings, category tiles) with consistent gutter (~24px).
- Cards: white background, subtle shadow, image top, structured info rows (price | monthly), full-width button at base.
- Horizontal timeline component with dots and year labels (alternating top/bottom).
- Footer is multi-column (4–5 cols) with link lists, on dark navy.
- Vertical rhythm uses ~60–80px section padding; clear separation between blocks.
## Imagery
- High-quality product photography (cars) shot at 3/4 angles on neutral/studio backdrops.
- Hero uses cinematic lifestyle photography with dark overlays for text legibility.
- Heritage/timeline section uses sepia-toned or B&W archival photos to convey legacy.
- Category tiles use photographic backgrounds with semi-transparent dark overlays and centered white labels.
- Small badge-style graphics (savings, anniversary logo) integrated as floating elements over hero.
## Micro-copy
- British English, dealership/automotive tone: trustworthy, promotional, community-oriented.
- Headlines short and action-led: "Let us help you", "Keep up to date", "Celebrating our 100th Anniversary".
- CTAs are direct verbs: "Book Your Test Drive", "Get a valuation", "View details", "Get in touch".
- Uses promotional emphasis with currency and asterisks: "Ford donates £30", "SAVE £1,000".
- Sentences in supporting copy are 1–2 lines, friendly second-person ("Enter your registration...").
- Minimal exclamation marks; tone is informative rather than hyped.
## What to emulate
- Navy + red + green tri-color system with white/light-grey neutral base for a classic automotive retail feel.
- Card-based product grids with image-top, price block, dual-CTA pattern and clear "From £ / per month" hierarchy.
- Promotional modal overlay with countdown timer on hero for time-limited offers.
- Heritage storytelling section with horizontal interactive timeline and sepia photos.
- Quick-action tri-column block ("Book service / Value vehicle / Find offers") with inline input fields acting as mini-forms.
## What to avoid
- Cluttered top region: too many simultaneous overlays (modal + badges + carousel) can feel overwhelming—don't replicate the density unless promotional.
- Inconsistent corner radii / mixed button shapes; keep one radius system rather than the mix seen here.
- Overuse of bright red badges everywhere — reserve red strictly for genuine savings/urgency.