# VIH Execujet Website Prototype — v3 "Meridian" ## Project Overview A fresh visual concept for the VIH Execujet website redesign — Western Canada's premier long-range private aviation provider. v3 is a **new design language ("Meridian")** built from a clean canvas, rooted in an *evolved* navy/gold brand. Final build will be WordPress + Kadence theme. **Prototype history (context):** - `Prototype/` (v1) — complete baseline, navy/gold + Playfair/Inter. Comprehensive but conventional. - `Prototype_v2/` — partial (~40%) "ultra-luxury" exploration (darker #050b14 + Cormorant). - `Prototype_v3/` (this) — **definitive new concept**, built fresh. Keeps brand navy/gold DNA but a distinct, more editorial system. **Client:** VIH Execujet (Dave Des Roches — Director/VP) **Agency:** Bowden Works (Rian Bowden) **Developer:** Adi (prototyping) **Timeline:** Target launch mid-summer 2026 (Falcon 7X arriving ~June 2026) **Confidentiality:** HIGH — not public until launch. Falcon 7X acquisition is CONFIDENTIAL until client authorizes. ## Target Audience - Ultra-high-net-worth (UHNW) individuals - Corporate executives - Family offices - Aircraft owners - Luxury travel advisors Key insight: acquired through trust & personal introductions, NOT advertising. Privacy is paramount. They browse on phones → mobile-first. ## Positioning & Strategy - **"Western Canada's premier long-range private aviation provider — based on Vancouver Island."** - Differentiate on **service excellence, discretion, Victoria/Island base, long-range capability, and carbon-neutral fleet** — NOT "the only Falcon 7X." (Critical finding: Anderson Air in Vancouver already operates a Falcon 7X.) - Core objective: **fewer words, more visual impact, convert UHNW visitors into charter clients.** Conversion over SEO-content. - Empty Legs = primary customer acquisition gateway. - LinkedIn = the only social channel; pages must produce clean Open Graph previews. ## Design Direction — v3 "Meridian" Concept: **editorial-aviation** — navigation/instrument precision meets high-end magazine art direction. Evolves the navy/gold brand to higher contrast and a touch of warmth. ### Palette (evolved navy/gold — see `style-guide.css` for source of truth) - **Dark:** ink `#060B14` (near-black, cinematic), navy `#0B1B30` (primary), navy-700 `#122740` (panels), steel/line `#1C3A5C` - **Gold (restrained):** gold `#C2A24E`, gold-bright `#E6CE92` (highlight/hover), gold-deep `#8A6E32` - **Light (warm, editorial):** paper `#FBFAF6`, ivory `#F3EFE6`, smoke `#E7E2D6` - **Text on dark:** `#E8E6E0` / muted blue-grey `#9FB0C2` - **Text on light:** ink `#14202E` / body `#45525F` ### Typography (fresh vs v1/v2) - **Display/headings:** `Fraunces` — high-contrast editorial serif (NEW; v1=Playfair, v2=Cormorant) - **Body/UI:** `Inter` - **Labels/eyebrows:** Inter, UPPERCASE, wide tracking, with a leading gold hairline - **Coordinates / spec accents:** mono (`Spline Sans Mono`, fallback `JetBrains Mono`) — used sparingly for an instrument feel ### Signature motifs (what makes v3 "new") 1. Hairline coordinate system — thin rules, corner ticks, ICAO + lat/long tags (e.g. `CYYJ · 48.6469°N 123.4258°W`) 2. Oversized section index numbers (`01 / 02 / 03`) and editorial asymmetry 3. Gold as hairlines & small-caps only — never large fills 4. Full-bleed cinematic imagery with framed editorial captions 5. Motion: masked text reveals, slow parallax, thin scroll heading/progress indicator — subtle, purposeful ### Principles Visual-first storytelling · whitespace as luxury · discreet & precise tone · mobile-first · motion with purpose. ## Design System Quick Reference (`style-guide.css`) Use these tokens & classes when building pages — never hardcode values. **Fonts** — load in every page ``: ```html ``` `--font-display` Fraunces · `--font-body` Inter · `--font-mono` Spline Sans Mono **Colors:** `--ink #060B14` · `--navy #0B1B30` · `--navy-700 #102740` · `--steel #1C3A5C` · `--gold #C2A24E` · `--gold-bright #E6CE92` · `--gold-deep #8A6E32` · `--paper #FBFAF6` · `--ivory #F3EFE6` · `--smoke #E7E2D6` · text `--on-dark / --on-dark-mute / --on-light / --on-light-body` **Layout:** `.container` (+`--narrow`/`--wide`) · `.section` (+`--sm`) · `.grid` (+`--2`/`--3`/`--4`/`--asym`/`--asym-rev`) · surfaces `.surface-ink`/`-navy`/`-panel`/`-paper`/`-ivory` (headings & accents auto-invert on dark) **Signature motifs:** `.eyebrow` (+`--center`) · `.coord` · `.section-index` (+`--big`) · `.rule` (+`--gold`/`--short`) · `.frame` (+`--inset`) · `.coord-rail` · `.scrim` + `.scrim__bg` · `.badge` (+`--solid`) **Buttons/links:** `.btn` (+`--outline`/`--ghost`/`--lg`/`--sm`/`--block`) · `.link-arrow` (wrap arrow in ``) **Components:** `.fleet-card` (`__media`/`__tag`/`__body`/`__name`/`__specs`) · `.spec`/`.spec__value`(`.unit`)/`.spec__label` · `.spec-list` · `.stat`(`__num`/`__label`) · `.amenity-list`/`.amenity`(`__mark`) · `.leg-card`(`__route`/`__meta`/`__date`/`__seats`) · `.card`(`__media`/`__body`/`__title`) · `.figure`/`.figure__caption` · `.compare`/`.compare-wrap` (comparison table, `tr.is-flagship`) · `.img-overflow` (+`--bottom`/`--top`/`--framed`; parent `.section--overflow`, receiver `.section--overflow-pad-top`) · `.seam`(`__mark`/`__label`) · `.section-curve` + `.section-curve__divider--{ink/navy/panel/paper/ivory}` (soft curve; colour must match source section, max 2–3/page). **Section transitions:** default to `.seam` (crisp/editorial); use `.section-curve` for soft/organic moments **Forms:** `.field`/`.field__label` · `.input` · `.select` · `.textarea` **Header/footer base:** `.topbar` · `.site-header` (+`--transparent`/`--scrolled`) · `.nav`(`__logo`/`__menu`/`__link`/`__toggle`) · `.site-footer`(`.footer__brand`/`.footer__bottom`) **Motion:** add `.u-reveal` (or `.u-reveal-mask` for headings) + optional `data-delay="1|2|3"`; include the IntersectionObserver snippet from `style-guide.html`. Honors `prefers-reduced-motion`. ## Prototype Architecture ### Chunked Approach (reused, proven) Each page = reusable chunks: 1. **header.html** — top bar, logo, nav (mega menu), transparent→sticky 2. **body-[pagename].html** — unique main content 3. **prefooter.html** — "Request a Quote" CTA + trust signals 4. **footer.html** — footer nav, contact, LinkedIn, legal ### Standalone Preview Rule Every HTML file MUST be a complete, previewable document: - Include ``, ``, ``, `` - Link to `style-guide.css` - Render correctly opened directly in Chrome - Placeholder images via `https://placehold.co/WIDTHxHEIGHT/0B1B30/C2A24E?text=Label` ### Planned files ``` Prototype_v3/ ├── CLAUDE.md ├── TODO.md ├── style-guide.css # v3 "Meridian" design system (source of truth) ├── style-guide.html # visual reference / concept preview ├── header.html # global chunks — used on every page ├── prefooter.html ├── footer.html │ ├── body-home.html │ ├── body-fleet-index.html # Fleet — comparison table + cards │ ├── body-fleet-falcon7x.html # flagship │ ├── body-fleet-challenger604.html │ ├── body-fleet-challenger605.html │ └── body-fleet-caravan208.html │ ├── body-services-charter.html # Services — siblings (no index page) ├── body-services-management.html ├── body-services-adventure.html ├── body-services-medevac.html ├── body-services-maintenance.html ├── body-services-emptylegs.html # also top-level in nav (acquisition gateway) │ ├── body-destinations.html │ ├── body-about.html # About — company & heritage (since 1955) │ ├── body-about-team.html # leadership index (grid of 4) │ │ ├── body-about-team-jeff-wolfe.html # Ops Manager / Chief Pilot │ │ ├── body-about-team-tanya-dawshka.html # Customer Service Manager │ │ ├── body-about-team-jon-fulton.html # Director of Maintenance │ │ └── body-about-team-pete-norie.html # Chief Adventure Officer │ ├── body-about-safety.html # safety record & certifications │ └── body-about-sustainability.html # carbon offset (replaces /carbon-neutral 404) │ └── body-contact.html # Flat files in one folder — indentation shows page/IA hierarchy, not subfolders. ``` ## Assets (real files in `assets/`) Real brand/imagery assets are available — prefer these over `placehold.co` where applicable. - `assets/logo.png` — **Official VIH Execujet wordmark** (gold "VIH EXECUJET" wedge-serif italic + olive-green swoosh, transparent bg). Use in header & footer in place of the text logo. - `assets/Carbon Cure Logo.png` — CarbonCure partner logo → Sustainability / carbon-offset page. - `assets/challenger-604-range.png` — Challenger 604 range map. - `assets/challenger+605+range.png` — Challenger 605 range map. - `assets/cessna+range.png` — Cessna Caravan 208 range map. - (The three above are the current-site **static** range maps → use on fleet pages now; proposal calls for **interactive** range maps later.) - `assets/bottom-divider.png` — large decorative section-divider graphic (~1.3 MB; optimise before production use). - `assets/image.png` — current-site composite "Industry-leading, carbon-neutral fleet" (Challenger 605 over a world map). Reference/placeholder for a fleet or carbon-neutral section. Notes: the logo carries an olive-green swoosh (brand mark) — core palette still stays navy/gold per brief. Always verify **no visible tail numbers** before using any real aircraft photo. --- ## Asset Usage Convention (prototype consistency rules) ### Client photo batch — catalog 17 photos sourced from the client (`/srv/apps/vihexecujet/assets/vihe-photo-01.jpg` … `vihe-photo-17.jpg`): | Range | Subject | |---|---| | 01–05 | Aircraft exterior / hangar shots | | 06 | Cockpit | | 07–08 | Galley | | 09–15 | Cabin seating / interior | | 16–17 | Lavatory | No destination/city photography in the client batch — those sections use `placehold.co` until the client provides destination imagery. ### Path convention | Path | Use for | |---|---| | `assets/plane/vihe-photo-XX.jpg` | Aircraft, fleet, cabin, and aviation-context cards (fleet cards, empty leg cards, destination featured card, etc.) | | `assets/vihe-photo-XX.jpg` | Full-bleed scrims and section backgrounds (prefooter, services BG, hero) | | `assets/plane/falcon7x.png` | Falcon 7X silhouette — fleet cards only | | `assets/falcon7x-hero.mp4` | Hero background video | **Symlink rule:** the `assets/plane/` folder contains symlinks to `/srv/apps/vihexecujet/assets/`. Before referencing a new photo as `assets/plane/vihe-photo-XX.jpg`, create the symlink first: ```bash ln -sf /srv/apps/vihexecujet/assets/vihe-photo-XX.jpg \ /srv/apps/vihexecujet/wp-content/prototype/assets/plane/vihe-photo-XX.jpg ``` ### Photos in use (body-home.html — updated 2026-06-14) | Photo | Section | Path used | |---|---|---| | vihe-photo-01.jpg | Arriving 2026 spotlight | `assets/plane/` | | vihe-photo-04.jpg | Journal card — Falcon 7X article | `assets/` | | vihe-photo-05.jpg | Services V2 — section background | `assets/` | | vihe-photo-09.jpg | Prefooter scrim + Journal card — Zero Touch Travel | `assets/` | | vihe-photo-10.jpg | Empty Legs card — Victoria → Kona | `assets/plane/` | | vihe-photo-11.jpg | Empty Legs card — Montreal → Victoria | `assets/plane/` | | vihe-photo-12.jpg | Empty Legs card — Victoria → Palm Springs | `assets/plane/` | | vihe-photo-13.jpg | Destinations featured card (Victoria → Hawaii) | `assets/plane/` | | vihe-photo-14.jpg | Journal card — BC Wilderness by Amphibian | `assets/plane/` | | falcon7x.png | Fleet V2 & V3 cards — Falcon 7X | `assets/plane/` | | falcon7x-hero.mp4 | Hero — background video | `assets/` | **Available (not yet used):** vihe-photo-02, 03, 06, 07, 08, 15, 16, 17 ### Reuse rule - Avoid using the same photo **twice on the same page** where possible. - Reuse across different pages (e.g., vihe-photo-09 on home prefooter and again on charter page) is acceptable. ### Placeholder rule When no suitable real photo exists (e.g., destination/city photography), keep `placehold.co`: ```text https://placehold.co/WIDTHxHEIGHT/0B1B30/C2A24E?text=Label ``` This signals clearly to the client that photography is needed, rather than using a misleading aircraft interior in place of a city shot. ## Kadence Theme Compatibility Use patterns achievable in Kadence: - **Kadence Blocks:** Row Layout, Advanced Heading, Info Box, Icon List, Tabs, Accordion, Testimonials, Form - **Header/Footer Builder:** sticky nav, transparent header, mega menu - **Kadence Elements:** custom hooks, conditional content - OK to be creative beyond stock blocks — must be buildable with custom CSS/JS or Kadence Pro. Mark Kadence equivalents in comments where useful. ## Key Business Rules - Tail numbers must NOT be visible in any imagery - No customer-identifiable imagery — privacy is paramount - No traditional testimonials with names/logos — trust via safety record, team credentials, operational history - No stock photos in final build (placeholders now → real photography later) - Empty Legs = primary acquisition gateway (card-based, filterable, notification signup) - Falcon 7X = fleet flagship & leads differentiation, but CONFIDENTIAL until authorized; don't claim "only/exclusive" - LinkedIn = main social channel - Confidential project — not public until launch ## Coding Conventions - Semantic HTML5 - CSS custom properties for all design tokens - BEM-style class naming - Mobile-first breakpoints: 480px, 768px, 1024px, 1280px - Placeholder images: `https://placehold.co/WIDTHxHEIGHT/0B1B30/C2A24E?text=Label` - Comment Kadence block equivalents where applicable ## Current Website Content Reference Source: `../Prototype/context_crawler_vihexecujet.com_2026-04-03T03-50-10.json` ### Contact Information - **Phone:** 250-655-6844 (main), 236-339-4274 (advisor line) - **Email:** charter@vih.com - **Location:** Victoria International Airport CYYJ, 1962 Canso Road, North Saanich, BC V8L 5V5 ### Company - Part of **VIH Aviation Group** — in business since **1955** - VIH Execujet established as full-service corporate aviation company since **2007** - VIH Aviation Group divisions: VIH Helicopters, VIH Aerospace, YYJFBO Services, Cougar Helicopters, VIH Execujet - Community support: BC Cancer, David Foster Foundation, Power to Be ### Leadership Team - **Jeff Wolfe** — Operations Manager/Chief Pilot. 35+ years experience, 10,000+ flight hours. Purdue Aviation Technology grad. Started flying age 15. Career: Falcon Express (Dubai), United Airlines, SkyCharter (Toronto), Canada Coastal Aviation. VIH Execujet since 2007, Chief Pilot 2009, Ops Manager 2010. - **Tanya Dawshka** — Customer Service Manager. 20+ years private aviation. Career: YYJ FBO (2003), Piedmont Hawthorne, Omega Aviation. VIH Execujet since 2014. Fluent: English, French, Spanish. - **Jon Fulton** — Director of Maintenance. Transport Canada AME M1/M2, FAA A&P license. Quality Assurance Manager. Expertise in CARs/AMOs/Air Carriers. - **Pete Norie** — Chief Adventure Officer. 20+ years professional BC backcountry guiding. Skilled floatplane and helicopter pilot. → **Each member gets an individual, indexable page** (WordPress custom post type) for SEO/AI discoverability — NOT pop-up modals (modals have no URL/meta = no SEO value; key finding vs NovaJet/VistaJet). The team index (`body-about-team.html`) is a grid linking to each `body-about-team-{name}.html`. Use `Person` schema markup per page. ### Fleet Specifications (ACCURATE — use these numbers) **Dassault Falcon 7X (NEW — arriving ~June 2026, flagship, CONFIDENTIAL):** - Passengers: 14 · Ultra-long-range trijet · Range: 5,950 nm · Speed: Mach 0.90 · Baggage: 140 cu ft - Very uncommon in Canada — key differentiator (but Anderson Air also operates one) **Challenger 604:** - Passengers: 10 (6 club seats + 4-place divan, sleeps 6) · Cruising Speed: 528 mph · Range: 4,692 sm · Baggage: 115 cu ft (10 pax + 10 golf club sets + light bags) - Amenities: Deluxe Galley, Complimentary Wi-Fi, Video Entertainment System, Lavatory - Cabin: Widest of any true business jet, 6ft+ headroom, passive noise insulation - Sample times: Hawaii 5h 30m; Japan/Europe ~10h **Challenger 605:** - Passengers: 10 (6 club seats + 4-place divan, sleeps 6) · Cruising Speed: 528 mph · Range: 4,692 sm · Baggage: 115 cu ft - Amenities: Deluxe Galley, Wi-Fi, Video Entertainment System, Lavatory · Same cabin specs as 604 **Cessna Caravan 208 Amphibian:** - Passengers: 7 (club) or 9 (high-density) · Cruising Speed: 170 mph - Baggage: 1 per person, soft bags preferred, 24"x12" opening, max depth 24.5" - Operates from: Tofino, Whistler, Seattle, Vancouver, Victoria · Amphibian (water or land) - Nimmo Bay & Okanagan: ~1h 20m · Best safety record in its class ### Charter Service Features Personalized flexible schedules · Zero Touch Travel (direct vehicle-to-jet, no terminals) · Free Wi-Fi on North America flights · Ground transportation at destination · Pets welcome · Seamless customs · In-flight catering · Certified cabin attendant every flight · Crew: FlightSafety International annual recurrent training. ### Safety & Maintenance One of the best safety records in industry for 5+ decades · 99%+ dispatch reliability for last 15 years · Pilots average 8,000 hrs total flight time · Annual recurrent training (FlightSafety International) · Transport Canada compliant · Last TC audit 2025 · AMO externally audited annually. ### Sustainability Partner: **CarbonCure Technologies** — purchases carbon credits to offset annual Scope 1 CO2e from charter fleet. CarbonCure injects captured CO2 into concrete → permanent mineralization. Awards: Carbon XPRIZE Grand Prize, Cleantech 100 Hall of Fame. Investors: Breakthrough Energy Ventures, Amazon, Microsoft, Samsung. ### Aircraft Management Services Full-service: Aircraft Choice & Inspection, Negotiation & Acquisition, Registration, Insurance, Crew Training/Staffing/Scheduling, Flight Coordination, Maintenance & Grooming, Hangar Storage, Accounting. Charter market offset option. Shared ownership partnerships available. ### Adventure Charter Chief Adventure Officer Pete Norie (20+ yrs BC backcountry). Cessna Caravan Amphibian — luxury resort transfers, adventure tours, bespoke fishing trips. Destinations: Tofino, Whistler, BC wilderness lodges, remote coastal retreats. ### Medical Evacuations Partner: **LIFESUPPORT Air Medical Services** — 24/7 repatriation worldwide. West coast = strategic advantage for Asia/Pacific. ### Destinations — Sample Routes (for Destinations page) Aspirational, route-based content (from proposal + fleet sample times). Pair each with flight time + lifestyle imagery: - Victoria → Hawaii (Kona) — ~5h 30m (Challenger) - Vancouver → Tokyo — Falcon 7X non-stop (ultra-long-range showcase) - Victoria → Cabo San Lucas - Vancouver → London — Falcon 7X non-stop - BC wilderness lodges — Nimmo Bay / Okanagan ~1h 20m (Caravan amphibian) ### Empty Legs — Sample Listings (layout reference, from current site) Card data shape: route · date · aircraft · duration · seats · type. Real data is dynamic — these are for layout only: - May 23 · Victoria/Vancouver → Kona · Challenger 604 · 10 seats · Empty Leg - Apr 28 · Montreal/Toronto → Victoria/Vancouver · Challenger 605 · 5.2 hrs · Empty Leg - May 18 · Victoria/Vancouver → Palm Springs · Challenger 604 · 2.4 hrs · 10 seats · Empty Leg - Apr 20 · Kona → Kelowna · Challenger 604 · 6.5 hrs · 4 seats · Shared Flight - Oct 17 · Kona → Victoria/Vancouver · Challenger 604 · 10 seats · Empty Leg ### Current Site Navigation (Squarespace — reference) Primary: Empty Legs | Home | Fleet (604, 605, Caravan) | Services (Charter, Management, Adventure, Medevac, Maintenance) | About (Company, Team, Safety, Carbon Offset) | Contact | Advisor Notable issues to fix: slow hero video, accordion empty legs, "get on board ✈✈✈" animation (unprofessional), broken heading structure, tail numbers visible, /carbon-neutral → 404, no individual aircraft pages (carousel only).