Style Guide
TCR Brand Standards (Baseline)
Extends to all digital (organic: Kate/Kiana • paid: Tara). This page mirrors active Qode settings.
Live Baseline
- Modern navigation (English/Español)
- Mobile-first CTAs (hero form + phone)
- Hero video: title toggle, captions, fullscreen, cast
- Podcast library exposed site-wide via nav
- Hero “What We Do” typography increased for readability
- Google/BBB review ticker
- Cost calculator (reduced profile, stays on-site)
- Interior title gradient header
- Form routing: Marketing, Daniela, Tara, MJ (after hours)
- Timeshare Survey (per Daniela)
Color System
Navy
#0A2D6D
Aqua
#00BFD6
Aqua Mid
#00A9C6
Light Aqua
#5FE3F5
Box BG
#E3F6F8
Title Gradient (Qode header area)
linear-gradient(to bottom, #0A2D6D 60%, #00A9C6 92%, #5FE3F5 100%)
Typography (from Qode → Fonts)
| Element | Font Family | Font Size | Line Height | Weight | Style | Text Color |
|---|---|---|---|---|---|---|
| H1 | Playfair Display | 52px | 52px | 600 Semi-Bold | Normal | #0A2D6D |
| H2 | Playfair Display | 48px | 48px | 500 Medium | Normal | #00BFD6 |
| H3 | Montserrat | 23px | 26px | 600 Semi-Bold | Normal | #00BFD6 |
| H4 | Montserrat | 23px | 30px | 600 Semi-Bold | Normal | #00BFD6 |
| H5 | Playfair Display | 60px | 62px | 600 Semi-Bold | Normal | #0A2D6D |
| H6 | Roboto Condensed | 24px | 30px | 500 Medium | Normal | #00BFD6 |
Playfair Display — H1
Playfair Display — H2
Montserrat — H3
Montserrat — H4
Playfair Display — H5
Roboto Condensed — H6
Note: Fonts should already be enqueued by Qode. If not, add Playfair Display, Montserrat, and Roboto Condensed via Qode or a performance plugin.
Key Components
Buttons
Form Field
Labels visible; placeholders are assistive only.
Routing: Marketing, Daniela, Tara, MJ (after hours)
Interior Title Header
Example Interior Page Title
Subtitle / breadcrumb area
Review Ticker
★★★★★ ★ Google • “Fast, professional, compassionate.”
BBB A+ • “Excellent communication at every step.”
★★★★★ ★ • “They handled everything with care.”
Google • “Clear, honest, efficient.”
★★★★★ ★ Google • “Fast, professional, compassionate.”
BBB A+ • “Excellent communication at every step.”
Responsive Phone CTA
Call: 520-467-6950
Ops: Accessibility • SEO • Performance
- Contrast: aim for WCAG AA (4.5:1 body, 3:1 large text)
- Schema: FAQPage, Organization, VideoObject, BreadcrumbList
- Images: WEBP/AVIF, lazy-load non-critical, include width/height
- Fonts: minimize families; preload only if needed
- Tracking: form submits, calls, calculator use, podcast plays