Passage - Immersive Scotland Landing Page Template

Feature list

This template packages storytelling and direct sales into one scroll. Each built-in feature comes from a deliberate design decision in the source brief.

Location-Responsive Search Header

A centred search field sits over a slow aerial coastline video that dissolves into cloud. Visitors type a Scottish place name, clan name, or region and the page scrolls them into a matching sample itinerary. A fallback prompt suggests "Try: Skye, Orkney, or Harris" for visitors who pause, so no one reaches a dead end.

Timestamped Day-in-the-Life Scroll

Each scroll section is a named chapter of one real touring day, marked with a soft aurora green timestamp. The chapters run from early morning through midday and into the evening. As the visitor scrolls deeper, the page background shifts from weathered quartz white toward deep Hebridean navy, mirroring the arc of a northern Scottish day collapsing into luminous night.

Slide-In Booking Drawer

Clicking "Reserve Your Passage" opens a drawer without leaving the page. The drawer contains a departure calendar with live availability shown in aurora green, a group size selector from one to six, a single optional field for family connections to Scotland, and per-person pricing displayed beside every available date.

"Gift This Journey" Voucher Flow

A secondary link beneath the main call to action opens a separate voucher purchase flow. This path serves anniversary couples and retiring travellers who want to give the experience as a gift rather than booking it for themselves directly.

Sticky Anchored Call to Action

The "Reserve Your Passage" button appears first after the midday scroll chapter. It then anchors to the bottom of the viewport on continued scrolling, keeping the booking action visible throughout the lower half of the page without interrupting the narrative.

Northern Lights Colour System

The palette uses four purposeful colours: deep Hebridean sea navy for dark backgrounds, aurora green for interactive moments and availability indicators, peat-smoke violet for hover states and selected calendar dates, and weathered quartz white for body text and open space. Each colour carries a specific role and never appears outside it.

Page sections overview

Design & branding system

The visual identity follows a Marine and Coastal theme expressed through the Northern Lights colour palette. Every colour in the system has a fixed role, so the design stays coherent as the page shifts tone from morning brightness to evening depth.

• Four-colour palette: deep Hebridean sea navy (#0B1D3A) for dark backgrounds, aurora green (#2ED8A3) for interactive elements and availability, peat-smoke violet (#5C3D6E) for hover states and selected dates only, and weathered quartz white (#EDE8E3) for body text and breathing space
• Backgrounds alternate between navy and quartz white across sections, with the transition to full navy completing gradually as the day-in-the-life narrative moves toward evening
• Aurora green marks interactive moments, live availability indicators, and chapter timestamps; peat violet appears only on hover and selected states, rewarding attention like the northern lights themselves

Mobile & speed optimization

The single-column flow layout is built to perform on smaller screens without restructuring. The scroll-driven narrative and vertical chapter progression translate naturally to a phone held in portrait mode.

• Single-column structure eliminates complex grid reflows; the chapter-by-chapter scroll reads cleanly on any screen width
• The booking drawer opens as an overlay, keeping the visitor on the same page rather than routing them to a separate checkout screen on mobile
• The location search header, fallback nudge text, and chapter timestamps are all designed as lightweight text-first components that load without heavy asset dependency

How this template helps you convert

The page earns the booking by making the visitor feel they have already lived the touring day. The sale follows naturally rather than being forced at the top of the page.

1. The location search personalises the journey from the first interaction, connecting diaspora and ancestry visitors to a specific Scottish geography before they read a single itinerary line
2. The timestamped scroll builds proof of an experience that already happened, replacing vague brochure claims with concrete moments that feel witnessed rather than invented
3. The sticky "Reserve Your Passage" button and the "Gift This Journey" secondary link serve two distinct buyer types simultaneously, reducing friction for both the direct booker and the gift purchaser

Other information about this template

This template is a strong fit for Scotland cultural tour operators who want a page that reflects the distinctiveness of their offering. It is not a generic travel booking page; every structural decision traces back to the specific character of small-boat coastal touring in the Scottish Hebrides and island communities.

• The optional heritage field in the booking drawer, "Any family connections to Scotland we should know about?", signals to ancestry travellers that their background is part of the experience, not a footnote
• The page direction is Direct Sales, meaning every scroll section is oriented toward a confirmed departure booking rather than toward a lead form or enquiry submission
• The creative direction is Day-in-the-Life, a format that works particularly well for tours where the sequence and specificity of the day are the product's main selling point
• The template style is Single Column Flow, which keeps mobile and desktop experiences consistent and keeps the narrative linear and uninterrupted
• The header concept is a Location Input, a component that distinguishes this page from standard tour operator pages and creates an immediate sense of personal relevance for Scottish heritage visitors from Canada, Australia, and the United States