Fairdeal Homes

Overview

Fairdeal Homes is a property-focused landing experience for Nikoo Garden Estate / Bhartiya Garden Estate in North Bengaluru. The site presents the project as a high-intent residential investment and turns visitors toward direct inquiry actions: WhatsApp, email, phone, booking a free site visit, and unlocking floor plans.

The project in vested-master is a Next.js 16 app using the App Router, React 19, Tailwind CSS 4, local typefaces, motion-based scroll animation, Radix UI primitives, Heroicons, and Lucide icons. It is structured as a reusable property shell, with the Nikoo content centralized in app/_content/nikoo.ts.

Product goal

The site is designed for a real-estate conversion path rather than passive browsing. The first screen uses a video hero with a poster fallback, a compact header, and clear CTAs. Supporting sections build confidence with amenities, location advantages, layouts, FAQs, RERA details, and a disclaimer.

Experience design

Hero and conversion

The page opens with a full-bleed property video (HeroEmbed) layered under a dark overlay, a local poster image, and headline copy from the content module:

• "North Bengaluru's Most Promising Residential Investment"
• "Premium homes in a well-connected location with exceptional long-term value."

The header exposes project navigation, email, WhatsApp, and phone actions. A floating CTA appears after the hero scroll threshold and opens the inquiry form directly on the contact step.

Property confidence

The core content answers the questions a buyer or investor is likely to ask before calling:

• Why Bhartiya Garden Estate: scale, greenery, home formats, amenities, and connectivity.
• Location: Devanahalli, Bangalore, with map embed, static map image, and directions link.
• Proximity: airport, upcoming metro, Manyata Tech Park, schools, hospital, mall, and tech parks.
• Layouts: studio through four-bed/staff options, with floor-plan access.
• FAQs and legal context: price, investment case, RERA approval, special offers, and disclaimer.

Lead funnel

The inquiry system is shared through InquiryModalProvider in the root layout. Any CTA can open the same modal at a specific step.

The modal is a three-step flow:

1. Preference: end use or investment.
2. Budget: under Rs. 50 lakhs, under Rs. 1 crore, under Rs. 3 crores, or no limit.
3. Contact: name, phone number, and preferred mode of contact.

Submission calls the server action in app/_actions/handleForm.ts, which posts the lead payload to a Google Apps Script endpoint. On success, the client pushes a lead_submitted event to window.dataLayer, supporting GTM measurement without coupling analytics to every button.

Architecture

Implementation notes

The domain mapping in config/domains.ts maps www.nikoogardenestates.co.in to /nikoo. The proxy.ts middleware rewrites only the root path for that host, so legal pages and static assets still resolve normally.

Property data is centralized instead of spread across sections. That keeps later property pages practical: a new property can follow the same route structure, content module shape, and component set without rewriting the landing shell.

The flat-card interaction uses a controlled reveal pattern: the first floor plan opens directly, while later plans can require the visitor to submit contact details before the plan dialog is shown. This makes the layouts section part of the conversion funnel without blocking the entire page.

Source highlights

• app/(properties)/nikoo/page.tsx composes the landing page from reusable sections.
• app/_content/nikoo.ts owns the property copy, CTA links, map data, amenities, proximity list, flat options, and FAQ.
• app/_context/InquiryModalContext.tsx coordinates shared modal state across header, hero, floating CTA, footer, and flat cards.
• app/_actions/handleForm.ts submits inquiry data to the lead-capture endpoint.
• config/domains.ts and proxy.ts connect the custom property domain to the internal route.

Links

Live site

Project repository

Local source: vested-master