Berth is an industrial-themed landing page template built for cruise port and terminal operators. It leads with oversized metric cards, modular expandable content blocks, and a panoramic header image to communicate scale instantly. Designed for port authority directors, cruise line operations leads, and municipal development boards, it drives qualified inquiries through two focused lead capture forms.
by Rocket studio
Loading preview…
Quick summary
Berth is a card-grid landing page template for cruise port and terminal facilities. It opens with a drone-perspective header, then builds trust through count-up metric cards, expandable infrastructure cards, and a short lead capture form. The design uses an Industrial Raw aesthetic with a Carbon Fiber color palette to reflect the weight and precision of large-scale maritime operations.
Who this template is for
This template is built for professionals who operate or develop major cruise port infrastructure. It speaks directly to decision-makers who evaluate terminal capability before committing to a partnership or route.
Port authority directors negotiating terminal expansions or multi-berth leases
Cruise line operations vice presidents routing new itineraries and assessing turnaround capacity
Municipal development boards evaluating the economic impact of new ship call agreements
What problem this template solves
Most port and terminal pages bury critical data inside PDFs or behind inquiry forms. Serious operators need to assess scale, depth, and throughput before they reach out. This template puts that proof front and center so qualified leads arrive already informed.
Decision-makers struggle to find hard infrastructure data quickly on standard port websites
Generic contact pages fail to capture the specific inquiry type needed to route leads efficiently
A lack of visible scale evidence causes high-value prospects to disengage before converting
What you get with this template
You get a single-page lead generation layout purpose-built for cruise terminal marketing. Every section is structured to present evidence before asking for anything in return.
A full-width panoramic header with an editorial drone photograph and headline overlay
Four count-up metric cards displaying annual throughput, turnaround time, berth depth, and economic impact
Modular flip-and-expand content cards covering infrastructure specs, terminal blueprints, passenger flow diagrams, environmental compliance data, and port-of-call case studies
Theme
Industrial Raw
Creative direction
Stats-First Impact
Color system
Carbon Fiber
Style
Card Grid (Modular)
Direction
Lead Generation
Page Sections
Count-up Metric Grid
Modular Flip-and-expand Cards
Panoramic Drone Header
Dual Lead Capture System
Industrial Raw Color System
Port-of-call Case Study Cards
Related questions
Who is this landing page template designed for?
Can the metric cards be updated with real terminal figures?
What inquiry types does the lead form support?
Does the template include a way to capture lighter-touch leads?
How many content card rows does the template include?
A primary lead form requesting port or cruise line name, role, and inquiry type
A secondary floating call-to-action capturing email for a downloadable port fact sheet
Feature list
This template is built around a set of deliberate, brief-backed capabilities that work together to convert serious maritime industry prospects.
Count-Up Metric Grid
Four oversized stat cards animate on scroll entry, counting up to final values for annual throughput, average turnaround time, berth depth in metres, and economic impact in dollars. Numbers are sized to be legible from a distance, making the scale of the terminal immediately clear.
Modular Flip-and-Expand Cards
Content cards across the infrastructure, compliance, and case-study rows flip or expand on click. This lets visitors explore technical depth at their own pace without being forced through a linear scroll. Each card layer rewards curiosity with additional specification detail.
Panoramic Drone Header
The header stretches edge to edge with an aerial golden-hour image showing two cruise vessels berthed bow-to-stern along a 1,200-metre quay wall. The image is desaturated to feel documentary rather than promotional, with a thin signal-orange rule underlining the headline.
Dual Lead Capture System
A primary short-form card collects port or cruise line name, role, and inquiry type covering new itinerary, terminal lease, and expansion partnership options. A secondary floating button captures a single email address in exchange for the port fact sheet, serving lighter-touch visitors.
Industrial Raw Visual Theme
The Carbon Fiber color system uses deep hull black, gantry crane graphite, dock-plate silver, and signal-orange. Orange is reserved strictly for calls-to-action, live data callouts, and hover states, keeping the palette disciplined and visually purposeful throughout the page.
Case Study Card Row
Dedicated cards present recent port-of-call partnership examples. Each card can expand to reveal outcome data and operational context, giving prospective partners concrete reference points drawn from real terminal activity rather than generic claims.
Page sections overview
Section
Purpose
Panoramic Header
Establishes scale with aerial drone imagery and headline stat
Count-Up Metrics
Delivers four key performance figures on scroll entry
Infrastructure Spec Cards
Presents berth dimensions, quay capacity, and terminal specs
Terminal Blueprint Cards
Shows layout diagrams for passenger flow and gate configuration
Passenger Flow Diagrams
Illustrates how 4,000 passengers clear the terminal in under 90 minutes
Environmental Compliance Cards
Communicates regulatory and sustainability data to partners
Port-of-Call Case Studies
Provides evidence from recent cruise line partnership outcomes
Primary Lead Form
Captures qualified inquiries by role, port name, and inquiry type
Floating Fact Sheet call to action
Collects email for lightweight lead nurture via downloadable asset
Design & branding system
The template uses an Industrial Raw theme built on a Carbon Fiber palette. Every color choice reflects the physical character of a working deep-water terminal: matte, structural, and built to communicate under pressure.
Hull black (#1A1A2E) and gantry graphite (#3D3D5C) form the base layers for backgrounds and card surfaces
Dock-plate silver (#B0B0C8) handles body text, labels, and secondary user interface elements for clear contrast
Signal-orange (#FF5722) is reserved exclusively for call-to-action buttons, live data callouts, and hover states to direct attention without competing with content
Mobile & speed optimization
The card-grid layout is structured to reflow cleanly across screen sizes. Modular cards stack vertically on smaller screens without losing the hierarchy established in the desktop layout.
Count-up metric cards resize to remain legible on mobile viewports without truncating figures
The floating fact-sheet call-to-action repositions to stay accessible as users scroll on touch devices
The panoramic header image scales proportionally to preserve the aerial composition on all screen widths
How this template helps you convert
The page is built on a deliberate evidence-first conversion logic. Visitors encounter proof of terminal capability long before they see a form, which means the leads who do submit are already qualified.
Count-up metrics and infrastructure cards establish credibility in the first viewport scroll, so visitors understand terminal scale before reading a single marketing claim.
The dual lead capture system serves two distinct intent levels: a detailed inquiry form for high-intent partners and a single-field email capture for prospects who are still researching, so no qualified visitor leaves without a touchpoint.
Other information about this template
This template is part of a Marine and Maritime category collection focused on Port and Harbor infrastructure. It is specifically positioned within the Cruise Port and Terminal niche, making it a focused tool for a narrow but high-value audience segment.
The template style is Card Grid (Modular), meaning individual content blocks can be updated or reordered independently without rebuilding the full layout
The creative direction is Stats-First Impact, a deliberate choice to lead with verified numbers rather than marketing language
The header concept is Panoramic and Wide, designed to work with high-resolution aerial or drone photography for maximum first impression
The landing page direction is Lead Generation, meaning every structural decision from card order to call to action placement serves a single conversion goal
