Master Engagement Document

Platform overview, delivered work, companion brand & platform deliverables, and commercial & payment summary.

Client

PetStore.Direct

Production URL

productsearch.mypetjet.com

Currency

USD

Prepared

April 2026

Executive Brief
Why AI Agents — The Strategic Case
↓
Wait Time

Reduce customer response time from hours to seconds; AI agents handle inquiries 24/7 with no queue

↑
CSAT

Lift customer satisfaction scores; consistent, accurate, personalized responses at every touchpoint

↗
Revenue

Proactive outreach via voice, SMS, and WhatsApp campaigns; AI closes the loop from inquiry to purchase

What AI Agents Do for SMBs
  • Handle inbound inquiries, order status, product recommendations, and support escalations autonomously
  • Operate across every channel — chat, SMS, voice, WhatsApp — without adding headcount
  • Maintain session memory and context across interactions, so customers never repeat themselves
  • Qualify leads, run outbound campaigns, and hand off to humans only when truly needed

SMBs implementing AI agents see 200–500% ROI in year one, with payback periods of 1–3 months (McKinsey / AI SuperThinkers, 2026)

A 5-person team can operate with the rigor of a 50-person enterprise — without the $4M payroll

What Private Equity Should Know
  • AI is no longer experimental: 78% of organizations use AI in at least one business function (McKinsey State of AI 2025)
  • Customer-facing AI directly compresses labor costs while scaling throughput — the highest-leverage operational investment available
  • Businesses that deploy AI agents now build a compounding moat: proprietary data, trained workflows, and institutional memory competitors cannot replicate
  • The platform built for PetStore.Direct is multi-tenant by design — it can be extended to any portfolio company with no schema changes
Why Custom-Built Beats Off-the-Shelf

Data Privacy & Sovereignty — Customer data, pricing logic, and conversation history never leave your infrastructure. No third-party vendor owns your most sensitive operational data.

Local & Frontier LLM Flexibility — The platform is model-agnostic. Run cost-efficient open-source models (Llama, Mistral, Qwen) locally for routine queries; route only complex reasoning to frontier APIs. Up to 18× cheaper per token at volume vs. cloud-only.

Domain-Specific Accuracy — Generic off-the-shelf AI hallucinates on your catalog, your SKUs, your policies. A custom system is trained on your data and enforces zero-hallucination guarantees.

No Vendor Lock-In — You own the codebase, the schema, and the roadmap. Swap models, add channels, or white-label for new portfolio brands — no permission required.

Master Contents

This document consolidates the full engagement record into three self-contained parts, each independently referenceable.

Part 1 — Platform Overview & Delivered Work
  1. Executive summary
  1. Engagement at a glance
  1. Platform architecture
  1. Data model
  1. Ingestion, enrichment & classification pipeline
  1. Operator dashboard
  1. Conversational AI assistant (Ask PSD / Luna)
  1. Order status lookup
  1. Support hand-off via Gorgias
  1. In-chat purchase flow
  1. CRM, Campaigns & AI Agent Manager
  1. Integrations, security & deployment
Part 2 — Brand & Platform Deliverables
  1. Overview of companion deliverables
  1. Revival Animal Health — Shelter/Rescue Program
  1. Exodus — custom Shopify theme
  1. Summary of companion deliverables

Part 1
Platform Overview & Delivered Work

A consolidated technical and functional reference covering what was built, what it does, and how it is operated.

1. Executive Summary

PetStore.Direct operates a large Shopify catalog of professional pet-grooming equipment — clippers, blades, shears, shampoos, dryers and more. Before this engagement, product data was fragmented across tags, descriptions and tribal knowledge, with no automated way to find the right product quickly.

This engagement delivered an end-to-end Brand Intelligence & Customer Experience Platform, a production AI voice and chat assistant, operational tooling for staff, and an admin platform covering CRM, outbound campaigns and AI agent management — all deployed at productsearch.mypetjet.com.

What Was Delivered — At a Glance
Product Intelligence Platform

Ingests and enriches every Shopify product with structured, machine-readable intelligence under a managed multi-level taxonomy.

Operator Dashboard

Back-office for merchandisers and editors covering manufacturer management, enrichment queues, AI playground and taxonomy management.

Conversational AI (Ask PSD / Luna)

Handles product recommendations, order status, purchase initiation and support hand-off — embeddable across website, Gorgias, voice and SMS.

In-Chat Purchase Flow

Three-gated checkout that creates a Shopify draft order and emails a draft invoice on explicit customer confirmation.

Admin v2 — CRM & Campaigns

Full operational control of contacts, companies, deals, tasks, AI-driven outbound campaigns (voice/SMS/WhatsApp) and platform-wide agent routing.

Internationalisation

English production agent plus Spanish and Portuguese agents in testing, with per-language tone and recommendation adaptation.

2. Engagement at a Glance

Each business goal mapped to the outcome actually delivered.

3. Platform Architecture

The platform sits between Shopify — the authoritative catalog, inventory and orders system — and all customer-facing channels, with PostgreSQL as the central data store and a single chat API serving every channel with format-specific responses.

Technology Stack
Application Layer

Next.js 14 (App Router, React 18, server components) · TypeScript · Tailwind CSS + shadcn/ui + Radix primitives

Data

PostgreSQL via Prisma ORM · NextAuth with Prisma adapter (credentials + bcrypt)

Commerce & Help-Desk

Shopify REST + GraphQL Admin APIs with OAuth token auto-refresh · Gorgias via Model Context Protocol (MCP)

AI & Security

Gemini 2.5 Flash routed through an internal LLM gateway · AES-256-GCM encryption with dual-key rotation

Charts & Hosting

Recharts, Chart.js, Plotly · Managed Next.js hosting at productsearch.mypetjet.com

4. Data Model — Core Commerce Tables

The platform is multi-tenant from the ground up: every key table carries a tenantId column (defaulting to petstore-direct), so additional stores can be onboarded with no schema changes.

manufacturers

Brand/vendor records — name, website, contact, rating, verified flag, logo, source URL, last scrape timestamp.

products

Every Shopify product mirrored — name, price, SKU, variantId, handle/ID/URL, stock, tags, specs JSON, plus enrichment fields (qualitySignals, sellingDetails, enrichedCategory).

manufacturer_knowledge

Long-form brand intelligence — company overview, certifications, product categories, brandIntelligence JSON, research timestamp.

ChatbotConfig & Integrations

Per-tenant conversational personality, LLM settings, greeting, suggested questions, and MCP integration records (Gorgias and extensible to any MCP server).

Managed Taxonomy & Attribute System
Three-Level Taxonomy

A relational hierarchy replaces the flat legacy productType string, enforced via foreign keys:

  • Primary Category — e.g. "Clippers & Blades", "Shampoo & Conditioner"
  • Product Type — e.g. "Clipper", "Blade", "Shampoo"
  • Product Subtype — e.g. "A5 Blade", "5-in-1 Clipper"

Each product carries classification source, AI confidence score (0–1), needs-review flag and audit trail.

Attribute System (Facets)

Category-specific facets are modelled as data — not hard-coded — enabling the chatbot to ask "what coat type?" or "what blade size?" and filter precisely without a code change when a new facet is added.

  • AttributeGroup — e.g. "Functions", "Coat Types", "Motor Type" with input type and filterable flag
  • AttributeValue — enumerated values inside each group
  • ProductAttribute — join table connecting products to attribute values
5. Ingestion, Enrichment & Classification Pipeline

The platform ingests the Shopify catalog and layers three tiers of intelligence on top of each product — all idempotent, so reruns are cheap and existing enrichment is preserved.

Three-Tier Enrichment Pipeline
1
Tier 1 — Tag Mining

Rule-based extraction from Shopify tags. Outputs: isBestSeller, isTopRated, groomerEndorsements, coatTypes, collections, productType — no external API call.

2
Tier 2 — LLM Selling Intelligence

LLM reads product name + description and returns structured selling fields: features, benefits, idealFor, useCase, sellingPoints, keywords and a validated category.

3
Tier 3 — Brand Research

LLM researches the manufacturer: reputation, year founded, Amazon sentiment, pro-groomer sentiment and competitive market position — stored on ManufacturerKnowledge.

All tiers run in batches with progress tracking and a human review/approval UI before enriched data goes live. The AI taxonomy classifier then assigns Primary → Type → Subtype with a confidence score, surfacing low-confidence items in the review queue.

6. Operator Dashboard

A polished back-office at productsearch.mypetjet.com, fully behind NextAuth login, giving merchandisers and editors complete control without engineering involvement.

Dashboard & Search

Stats cards, manufacturer bar chart, stock donut, category pie, quick actions. Advanced manufacturer and product search.

Data Scraper & Enrichment

Triggers Shopify sync and per-brand scrape jobs; shows job-status dashboard. Tier status, review queues for products and brand intelligence.

Chatbot Playground

Live tuning of ChatbotConfig — greeting, LLM model, temperature, max tokens, behaviour/response/keyword instructions — with a built-in test console.

Taxonomy & Integrations

Manage Primary Categories, Product Types, Subtypes, Attribute Groups and Values. Install and configure third-party integrations (Gorgias MCP today).

7. Conversational AI Assistant — Ask PSD / Luna

The centrepiece of the platform. Luna handles product discovery, order status, purchase initiation and support hand-off — delivered by a single /api/chat endpoint consumed across four channels: website widget (SSE streaming), Gorgias help-desk (plain text), voice/SMS (tool-json) and any external LLM orchestrator.

The 5-Stage Chat Pipeline

The pipeline is short-circuiting — cheap stages run first so non-product traffic (greetings, order lookups) never pays for an LLM call. Each stage is deterministic; the LLM is only invoked when genuinely needed for generation or formatting.

Session Memory & Intent Classification
Session Memory

Many callers (Gorgias tickets, SMS, voice) are stateless. The platform maintains an in-process session store keyed by session_id / ticket_id containing:

  • Conversation history (last N turns)
  • Guided-flow state and answers so far
  • Selected product (locked for purchase)
  • Last recommended products (for "the second one")
  • Pending checkout and support hand-off state
Intent Classification

Before any LLM call, messages are classified deterministically:

  • Greeting/thanks — canned response, no LLM or DB hit
  • Order status — regex extracts order number/email, calls Shopify directly
  • Support intent — pattern match with false-positive guards → hand-off flow
  • Purchase intent — "buy", "invoice me", "checkout" → three-stage purchase flow
  • Product discovery — guided flow engine or flat preference extractor
Guided Flow Engine

Complex categories (clippers, blades, combs, shears) use a data-driven decision tree. The engine — not the LLM — owns the conversation structure. The LLM only phrases questions and formats the final answer.

FlowNode & Conditional Nodes

Each node poses one question with typed options (label + regex patterns). Conditional nodes skip questions when answers can be inferred from prior context. Attribute-group-backed nodes pull options from the managed taxonomy at runtime — add a new value in the admin UI and the chatbot picks it up immediately.

Brand Priority & Compatibility Maps

Curated compatibility tables for 5-in-1 clippers and mini trimmers, including purpose tags (haircuts vs sanitary-only), enabling cross-sell scenarios like "which blades fit an Andis Pulse ZR II?"

Progressive Relaxation

If a strict search returns fewer than a minimum number of products, the engine reports which filters it relaxed (e.g. "dropped brand", "dropped material") so the bot can explain the widened search rather than silently returning nothing.

Zero-Hallucination Product Pipeline
Core Correctness Guarantee

Luna can only recommend real, in-stock, verified-URL products. Every generated URL returned HTTP 200 in smoke tests.

01
Database Search

searchProductsWithPreferences() queries PostgreSQL using taxonomy foreign-key filters, attribute-value joins and text matching. Results ranked by brand priority, stock and relevance.

02
URL Validation

Every product's buyUrl is reconstructed from the Shopify handle; buildSafeProductUrl() verifies HTTP 200 before surfacing. validateProductUrls() checks every product in a response batch.

03
Inline Grounding Rules

The LLM prompt carries an ABSOLUTE RULE: only mention products in the MATCHING PRODUCTS section; copy name, price and buyUrl character-for-character. Rules appear at the top of the system prompt AND above the product list.

04
Empty-Search & Clarification Guardrails

Zero results inject a "NO MATCHING PRODUCTS FOUND" marker. During clarifying questions, a "NO PRODUCT DATA PROVIDED" marker forbids naming any specific product or price.

05
Post-Generation Validators

stripFabricatedProducts() and validateNoHallucinatedProducts() cross-check every referenced product against the per-response verified catalog map; anything not on the allow-list is removed.

Response Formats & Performance
Four Response Formats
Performance Optimisations
  • Tenant-config cache — ChatbotConfig cached in-process, warmed with configured queries
  • Precomputed responses — gold-standard answers for common voice queries served in milliseconds, no LLM call
  • Per-query cache — normalised (query, preferences, tenant) tuples cached with freshness re-validation
  • Voice sanitiser — strips URLs and bullet points; targets ~30 seconds of speech at 150 wpm
8. Order Status Lookup

Order-status responses are fast, cheap and impossible to hallucinate — the LLM is used purely for tone, with a hard template fallback guaranteeing a correct answer even if the LLM call fails.

9. Support Hand-Off via Gorgias

When a customer needs a human — damaged item, return, complex complaint — Luna performs a structured hand-off rather than dumping the conversation on the support team.

Support Hand-Off: Detection & State Machine
Detection Logic
  • Guards against false positives — hypothetical phrasing rejected
  • "Talk to a human" / frustration markers routed to Gorgias's native live-agent rule, not the hand-off flow
  • Returns a confidence grade: high / medium / low
State Machine

detect → confirm → collect_email → collect_order → collect_phone → pre_handoff → execute → done

At pre_handoff, Luna shows a summary and asks "Is there anything else you'd like me to include?" At execute, the hand-off fires via two Gorgias MCP tools in exact order:

  1. create_ticket_note — writes a structured internal note (blocking; failure causes Luna to apologise rather than silently lose context)
  1. update_ticket — sets assignee to null, returning the ticket to the unassigned queue

Once complete, Luna goes silent on that ticket — no further AI replies generated.

10. In-Chat Purchase Flow

Luna can drive a customer through to a paid order without leaving the chat. Because the stakes are high (real money, real orders), the flow is explicit and three-gated.

Stage 1 — Product Selection

Customer picks a product by name, number or card click. Platform locks it into session as selectedProduct — capturing variantId, title, SKU, price and URL. Subsequent turns reference this locked record.

Stage 2 — Email & Order Summary

Luna asks for the customer's email, validates format, stores a pendingCheckout in session state, and shows an order summary (item, variant, quantity, price, URL).

Stage 3 — Confirmation Gate

Customer must explicitly type "Confirmed." A checkoutAttempts counter prevents retry loops. On confirmation, the platform creates a Shopify draft order via Admin API and emails a draft invoice to the customer.

11. CRM, Campaigns & AI Agent Manager (Admin v2)

Admin v2 extends the original operator dashboard into a full operational hub covering CRM, outbound campaigns and platform-level AI agent management. It is workflow-oriented — non-engineers can run end-to-end programs without touching code.

CRM — Contacts & Companies
Contact Record Shape
  • Identity & reach — name, email, phone, mobile
  • Work context — job title, department
  • Structure — company link, notes, tags, custom fields
  • Audit — created by, activity log (created/updated/deleted with change snapshots)
Import Flow

Drag-and-drop file upload; auto-map headers from common names (e.g. "firstname", "email"); preview valid vs problematic rows before commit; optional auto-creation of companies from the company_name column.

Companies, Deals & Tasks

Full company records (name, website, industry, revenue, address, tags, custom fields). Pipeline-style deals. Task board for operational follow-ups. Contact groups as first-class objects reusable in campaigns.

Campaigns — Four-Step Wizard
1
Campaign Basics

Name, type and description. Types: Voice (AI Assistant), SMS, WhatsApp, Multi-Channel.

2
Audience

Build recipient list from: file upload, CRM contacts, Google Sheets, Airtable, contact groups, or demo seed data — with preview and validation before commit.

3
Setup

Channel-specific configuration: Telnyx Call Control Application, greeting text, concurrency, assistant selection, caller ID, calling window (e.g. 09:00–20:00), timezone, retry settings.

4
Launch

Review the plan and move from preparation into executable state. Statuses: draft, scheduled, running, paused, completed, cancelled (soft-delete preserves history).

Campaign analytics include per-recipient status (pending, scheduled, in_progress, completed, failed, no_answer, voicemail), timezone distribution, and CSV export up to 10,000 rows. Optional product-purchase webhook automation enables confirmed purchases to notify an external checkout/OMS pipeline.

AI Assistants & Agent Manager
AI Assistants (Telnyx Workspace)

Full AssistantEditor: pick models dynamically, attach MCP servers and tools, manage integration secrets, assign phone numbers, and QA via AssistantActions console (outbound call, webcall, test chat, clone, embed preview).

Agent Manager — Platform-Level Routing

Per-agent: display name, tier (simple/advanced/third_party), provider (Telnyx / Advanced RAG / External LLM), status, external ref, public embed key, relationship label, usage/cost summaries.

Tiered chat: toggle L1 → L2 escalation, choose a Level 2 agent, and optionally configure a proxy brain delegate for advanced routing scenarios.

Knowledge Sources

file_upload, url, sitemap, ticket, email_vault, external_bucket, manual_qa, call_transcript

Routing Providers

Telnyx native · Advanced in-app RAG · External LLM / super-assistant API

Authenticated API

POST /api/agents/{agentId}/chat with conversation, channel, metadata and handoff hints

The Three Pillars of Admin v2
CRM

System of record for people, accounts, tasks; import plus groups; activity history; optional GoHighLevel sync.

Campaigns

Audiences from CRM/files/sheets/Airtable; pacing and calling windows; voice/SMS/WhatsApp; per-recipient status; CSV export; optional purchase webhook flow.

AI Agents

Telnyx assistants with rich editor and QA console; platform agents for routing, embeds, tiered escalation and usage/cost visibility; optional RAG and external LLM backends.

12. Integrations
Shopify

OAuth install with auto-refresh; encrypted token storage; REST catalog endpoints for scraper; direct order lookups for order-status flow; draft-order creation for purchase flow. Shopify is the authoritative source for post-purchase data (replacing the earlier ShipStation approach).

Gorgias (MCP)

Generic MCP integration framework with configurable server URL, transport, encrypted headers, per-call timeout, connection tester and bulk tool sync. Gorgias is the first integration wired up; the framework is extensible to any MCP-compatible service without code changes.

Voice Channel (Telnyx — Ready)

Full Telnyx voice-integration guide shipped with the platform. The format=tool-json response already includes voice_text (TTS-sanitised), mode, context, products (top-product URL for SMS follow-up) and meta.latencyMs.

Multi-Tenant Ready

Every tenant-aware table carries tenantId; every API call resolves the tenant via headers or body. Onboarding a second store requires only seeding a new tenant row and its ChatbotConfig — no schema changes.

13. Security, Observability & Deployment
Security
  • AES-256-GCM secrets at rest with scrypt-derived keys and dual-key rotation
  • Bearer token required on all external /api/chat calls; bad tokens return structured AUTH_INVALID errors
  • CORS whitelisted to PSD storefront, platform host and Shopify admin origin
  • NextAuth + bcrypt passwords, Prisma session adapter, role-based access
  • tenantId isolation on every multi-tenant query
Observability
  • Structured logs with stage tags for easy grep
  • /api/chat/health verifies DB, LLM key and auth token; returns 200/503 with per-check detail
  • meta.latencyMs in every tool-json response for end-to-end performance tracking
  • Scrape and enrichment job state written to DB and exposed via dashboard
Deployment

Hosted at productsearch.mypetjet.com with automatic build/deploy pipeline. Prisma handles forward-compatible migrations — production data is never discarded.

14. Quality Evidence
Anti-Hallucination Smoke Tests

Queries like "Professional Clippers" and "#4F A5 Blades" returned only real DB records (e.g. CeramicEdge #5FC by Andis, UltraEdge #5FC by Andis) — verified against screenshots in the client artefact pack.

URL Integrity

Every surfaced buyUrl independently fetched and returned HTTP 200 (e.g. petstore.direct/products/ceramicedge-5fc-finish-cut-grooming-blade-by-andis).

Clarification-Mode Grounding

Clarification turns include an explicit "no product data provided" marker; the assistant asks follow-up questions without naming any specific products or prices.

Empty-Catalog Grounding

Zero-result searches inject a "no matching products found" marker so the bot replies honestly instead of inventing filler items.

Purchase Flow Gates

Customer must explicitly type "Confirmed" before a draft order is created; session state locks the chosen product and email so an ambiguous reply cannot trigger an unintended order.

Order Lookups

Direct Shopify calls with a template fallback guarantee a correct, deterministic answer even if the LLM formatter is unavailable.

15. Delivered Work — Itemised

Every component delivered across the main engagement, with business impact. Companion brand & design deliverables (Revival and Exodus) are covered in Part 2; commercial terms in Part 3.

1
AI Shopify Integration & Draft Orders

Transaction-capable sales engine: dynamic draft-order creation, AI-driven product selection, automated post-chat email, OAuth auto-refresh.

2
Gorgias Integration

Hybrid AI-human support: auto ticket creation, call-escalation logic, context survival across voice, chat and support infrastructure.

3
AI Monitoring & Multi-Language

Daily monitoring, rapid iteration pipeline, English production agent plus Spanish and Portuguese agents in testing.

4
Admin Dashboard v1

Call-history tracking, AI testing interface, analytics dashboard and debugging-visibility tools for internal review.

5
Post-Purchase Tracking

Preliminary ShipStation work absorbed into Shopify-native order lookup; "Where is my order?" handled via Shopify Admin API with Gorgias escalation triggers.

6
Product Search Engine

Semantic search, ranking/scoring algorithms, featured-product prioritisation, AI weighting logic — the core engine behind AI sales performance.

7
AI Chat Integration

Chat widget deployed in Shopify, integrated with product engine and Gorgias; real-time recommendations and human escalation from chat.

8
Admin Dashboard v2

Full CRM, four-step campaign wizard, multi-agent orchestration, tiered routing, knowledge sources and authenticated chat API.

16. Extensibility Roadmap

The platform is architected to extend, not rewrite, when PSD's needs evolve.

New Facets / Filters

Add an Attribute Group plus Values in the admin UI — the guided flow picks them up on the next turn with no code change.

New Product Categories

Add a Primary Category / Product Type / Subtype row; re-run the AI classifier to backfill products automatically.

New Tenants

Every table is tenant-scoped; onboarding is a config-only change — seed a new tenant row and ChatbotConfig.

New Channels & Integrations

Reuse format=tool-json for any new channel. Any MCP-compatible service can be added through Settings → Integrations without code changes.

New LLM Models

Model name, temperature and max-tokens are part of ChatbotConfig and editable in the Chatbot Playground — no deploy required to swap models.

New Outbound Programs

Spin up another campaign through the four-step wizard, reusing existing CRM contacts, assistants and integration secrets.

17. Documentation Shipped with the Platform
PSD Chatbot Intelligence Guide

/psd-chatbot-intelligence-guide.md (and PDF) — canonical guide for consuming GET /api/export/chatbot-knowledge: product schema, voice/tone guidelines, recommendation logic, brand-intelligence usage, groomer endorsements, coat-type intelligence, sales-aware responses, response templates and API reference.

Telnyx Voice Integration Guide

/docs/telnyx-voice-integration.md — step-by-step guide for wiring the voice channel, including webhook URLs, tenant query params and audio codec preferences.

Taxonomy Reference

/prisma/TAXONOMY.md — formal description of the managed taxonomy, why it exists, migration path and file layout.

Sample Export Payload

/psd-products-sample-export.json — sample of the export payload so integrators can build against a known shape before connecting to the live API.

Part 1 Summary

PetStore.Direct now has a single, authoritative platform that mirrors and enriches the entire Shopify catalog; exposes that intelligence through a managed taxonomy and a polished admin dashboard; drives a production-grade conversational assistant that cannot recommend a product that doesn't exist; handles orders, purchases and support hand-off end-to-end; and provides a full CRM, Campaigns and AI Agent Manager layer for scalable outbound operations — all ready for voice, SMS and additional tenants without further engineering.

Part 2
Brand & Platform Deliverables

Revival Animal Health design package & Exodus custom Shopify theme.

18. Overview of Companion Deliverables
Revival Animal Health — Shelter/Rescue Program

A complete marketing-site design package produced for Revival's in-house development team to implement. The deliverable is the design specification itself — page structures, route variants, brand system, interactive patterns, content inventory and asset references — along with client revisions applied during review.

Exodus — Custom Shopify Theme

A working theme implementation built on Shopify's Dawn reference architecture, with custom sections, snippets, CSS, JavaScript and JSON templates — delivered ready for handoff or further implementation feedback.

19. Revival Animal Health — Shelter/Rescue Program

A comprehensive design package for Revival Animal Health's Shelter/Rescue Program marketing experience — full page designs, brand system and interaction specification handed to Revival's in-house programmers, including all revisions from the client review cycle.

Revival — Scope & Brand System
Design Deliverable Scope
  • Three route variants with distinct layout and content treatments
  • Full section-by-section page structures (hero, navigation, eligibility, benefits, process, support, footer)
  • Interactive behaviour specified for carousel, tabbed About section and FAQ accordion
  • Content and asset inventory with filenames for unambiguous handover
  • Recommended next steps for accessibility, SEO, form wiring and final copy
  • Client-requested revisions applied across all page variants
Brand & Visual System (Design Tokens)
  • Revival Blue — primary brand; navigation, headings, primary buttons
  • Revival Red — accent; e.g. newsletter submit control
  • Revival Yellow — CTA fills; Apply Now and high-emphasis buttons
  • Revival Light Blue — surfaces and subtle emphasis
  • Cream Light / Dark — warm neutrals for section backgrounds

Typography: Poppins and Source Sans 3 (Google Fonts) with a responsive utility-first layout approach recommended to the implementation team.

Revival — Three Page Variants
/ — Primary Landing

Sticky nav, category strip, blue info banner, full-bleed hero carousel (3 slides with prev/next and dot indicators), tabbed About section (4 topics, image alternating left/right), Who's Eligible grid, Program Benefits, 4-step Application Process, Expert Help band, newsletter footer.

/home-v2 — Alternate Hero

Same overall sections and messaging as the primary landing, with the hero redesigned as a two-column block: fixed headline "Every heart - every animal" with bullets on the left; image carousel on the right. Intended as layout option B for review.

/shelter-rescue — Extended Program Page

Top promo bar, "Shelter/Rescue Log In" nav, static two-column hero, 5-tab About section (adding a narrative-only "Together" tab), FAQ accordion (3 questions), and program benefits copy referencing 4,000+ organisations.

Revival — Interactive Patterns & Content Notes
20. Exodus — Custom Shopify Theme

The Exodus theme is built on Shopify's Dawn reference architecture with custom sections, snippets, CSS, JavaScript and JSON templates — covering header, collections, product cards, product detail page, cart and homepage/content templates.

Exodus — Header, Navigation & Collections
Site Header (exodus-header.liquid)

Full-width bar with logo, primary nav, account/cart icons and mobile drawer. Desktop dropdowns use accessible <details>/<summary> structure with optional "View all" row and nested grandchild panels. Mobile renders the same tree as nested expandable sections. A small capture-phase click handler syncs aria-expanded on triggers.

All Collections Page

Replaces the default list-collections section with a responsive grid (2–4 columns desktop, 1 column mobile). Collection cards are gradient tiles (blue or green preset) with the collection title in white — no collection image needed. Theme editor controls: heading, gradient style, sort order, column count, padding. Paginated at 30 per page.

Exodus — Unified Product Card System

The shared wrapper class .exodus-product-cards applies consistent grid spacing, card chrome, typography, price, badge, hover and rating styles anywhere it is present — across collection pages, featured collections, search results and related products.

Card Visual Design

Light gray (#F5F5F5) media area, 10px rounded corners, contain-fit product images with padding. Title: DM Sans semibold ~22px. Price: larger semibold treatment. Optional subtitle from custom.subtitle metafield.

Star Rating Snippet

SVG full, half (gradient split) and empty stars; accent colour #EF8E06. Outputs numeric score (e.g. 4.5/5) and review count. Half-star threshold uses a 0.25 remainder rule. Data sources: standard reviews metafield → custom.rating / custom.review_count → placeholder "No reviews yet" (5 gray stars) to keep card heights consistent.

Information Order

Rating (when enabled) → Price → Optional subtitle metafield → Vendor (when enabled) — matching a "score → offer → detail → brand" reading order.

Exodus — Product Detail Page & Cart
Product Detail Page

New subtitle block type outputs product.metafields.custom.subtitle with theme-editor help text. Block order updated: title → price → subtitle → vendor → variant picker → quantity → buy buttons. Subtitle styling applies to both legacy and new CSS classes for consistent typography.

Cart Experience (exodus-cart.css)
  • Breadcrumb trail: Home → Cart (current)
  • Cart title and "Continue shopping" link in one flex row
  • Line items as card rows (CSS grid: image | details | quantity | total) with border, radius and light background
  • Order Summary footer: Subtotal, Shipping/Tax at checkout (muted), Estimated Total (emphasised), full-width checkout buttons
  • New translation keys for order summary title, shipping/tax messaging and estimated total
Exodus — Primary Files Reference