Landing page for a dry cleaning service

The task

ChistoDom is an on-site cleaning service for sofas, carpets and mattresses: a technician arrives the same day and cleans the furniture right in the apartment, in 1-3 hours. Customers in this niche do not want to call to learn the price, and they worry about chemicals around kids and pets. So the site has to show prices upfront and take a request without a phone call - starting from the first screen. A demo project: the company is fictional, the brief is real.

The solution

The look is fresh and simple: white background, one sky-blue accent, rounded headings, cards with large corner radii. No dark sections, no corporate filler - ordering a cleaning should feel as easy as calling a cab.

• The request form sits in the hero: name, phone, “what to clean” - the way delivery apps do it, no scrolling to the bottom.
• Pricing is a grid of cards: icon, photo, price. Plus-minus buttons build an order, the calculator totals it, applies a 10% discount from two items, and prices carpets by area.
• One button carries the assembled list into the final form’s “what to clean” field, so the visitor never retypes it.
• Before/after sliders on a sofa and a mattress; the caption says plainly that the shots are illustrative - a fictional company has no real jobs to show.
• The process is laid out on an hour scale: request, dispatch within 2 hours, cleaning 1-3 hours, drying 4-6 hours - a morning request, a dry sofa by evening.
• The 7,800-visits figure is unpacked into an infographic by item type, with counters that animate on scroll.

Details that are easy to miss

• The before/after slider is a native input type=range: it works from the keyboard and on touchscreens without a single library, and each slider carries its own aria-label.
• The phone mask follows the browser language: a +7 format for Russian-speaking visitors, +1 for everyone else. Validation counts digits; errors appear as text under the field and are linked to it via aria-describedby.
• Consent to data processing is a required checkbox in both forms, linked to a separate policy page.
• Demo hygiene: a disclaimer page states the company does not exist, and the page carries noindex both in the meta tag and in the X-Robots-Tag header - it never competes with real businesses in search.
• prefers-reduced-motion disables the counters and reveal animations; the FAQ accordion uses aria-expanded, and the calculator total is announced through aria-live.
• No build step, no dependencies: the page opens straight from disk with a double click.

The numbers

Eleven sections - from the hero request form to the FAQ and the final order form - live on a single page. The images are 16 subjects in WebP with a JPG fallback, each in two sizes for different screens, lazy-loaded as you scroll.