# Direction 9: "Wayfinding" — the road-sign identity
### Token system + rationale, written before code (per brief §12.3–12.4)

---

## The idea in one paragraph

Every other supporters group is about a city. Southbound & Crown is about **the road to the city** — a club founded 25-odd miles south of the stadium that rents a bus to Atlanta every year (and needs a real roster of who's on it), and drives members across two states to two different clubs. So the site borrows the one graphic language built for exactly that: **American interstate signage** — guide-sign panels, exit tabs, FHWA arrows, mile markers, retroreflective chrome — rendered in the clubs' verified palette and warmed up with tailgate hospitality. Signage is also, not incidentally, the most legible visual system ever designed: built to be read at 70 mph, by everyone, at every age. That answers the brief's age-range requirement structurally, not as an afterthought.

**The two-club problem (§3.1) is solved by the metaphor itself:** one road, two exits. The hero is a single overhead gantry — one SOUTHBOUND & CROWN legend, two destination tabs beneath it: Charlotte FC (blue, MLS) and Greenville Triumph (gold, USL League One). SBC is the sign; the clubs are where it points. Club colors become *contextual edge treatments* on fixtures, membership lanes, and merch — never a 50/50 split identity.

## Palette (all derived from brief §4 — nothing invented)

| Token | Hex | Source / role |
|---|---|---|
| `--night` | `#0A0F1A` | Page ground. Asphalt at night — bridge between CLTFC black and Triumph navy `#272F3D` |
| `--sign` | `#132340` | Guide-sign panel navy — the signature surface (reads bluer than ground, like a lit sign) |
| `--panel` | `#0F1726` | Quiet card surface for non-sign content |
| `--ink` | `#F5F8FC` | Retroreflective white — primary text |
| `--silver` | `#A2AAAD` | CLTFC verified silver — muted text (≈8:1 on `--night`) |
| `--blue` | `#1A85C8` | CLTFC verified process blue — primary accent, links, Charlotte context |
| `--blue-bright` | `#4FB8F5` | Hover/glint state — continuity with shipped Tailgate HQ |
| `--gold` | `#F4C25E` | Triumph verified gold — Triumph context, crown moments, focus rings. Restrained. |

No purple. No burnt orange. No guide-sign green (palette discipline — signage reads through *structure*, not literal green). Primary CTA is **reflective white with night text** (13.9:1) — like sign button-copy — not an accent-color fill, which also sidesteps the white-on-`#1A85C8` 3.9:1 contrast trap.

## Typography (four voices, each with a story-true job)

| Role | Face | Why |
|---|---|---|
| Signage display | **Overpass** 700–900, caps | The open-source descendant of FHWA Highway Gothic — the literal typeface of American road signs. Authenticity, not "sporty template" |
| Text / UI | **Barlow** 400–700 | Jeremy Tribby's grotesk drawn from California public signage — the refined cousin; brief §4.5 names this family as the under-used athletic direction |
| Data / numerals | **Overpass Mono** | Odometer digits: kickoff times, prices, mile indices |
| Hospitality voice | **Newsreader Italic** | The "pull up a chair" register — reserved for pull-quotes only |

None of these appear on the §2 fatigue list (Inter / Poppins / Space Grotesk / Playfair).

## Layout concept (one sentence)

A night drive north on I-77: a fixed road-edge with mile markers ticking as you scroll, content arriving as lit sign panels — from the overhead gantry (hero), to the matchday departures board, to the Lot (tailgate map), to the toll lanes (membership), to the services sign (everything beyond matchday), ending at a "LAST EXIT BEFORE KICKOFF" join sign.

## Signature element

**The gantry sign system.** One hero gantry resolves the two-club identity in a single image; exit-tab panels recur as section furniture; a schematic **map of the Royal Family Tailgate Lot** (tents, grill, ping pong, Biñho, kids' zone, the Kenny Powers flag, "YOU ARE HERE") is the bespoke centerpiece no template could contain. Hero headline is the club's own words — **"Nothing could be finer"** — from the live site, set inside the sign panel so the type is an *object*, not a floating wordmark (the sbc6 complaint).

## Motion plan

One orchestrated moment: the gantry lights up on load (staggered panel reveal + a single specular sweep). After that: quiet scroll-reveals on sign panels, mile-marker updates via IntersectionObserver, hover glints. `prefers-reduced-motion`: all animation and transforms off, content visible immediately, marker updates instant — a real reduced variant, not a missing one.

## Self-critique against §2, item by item

- **Burnt orange `#E35708` dominant** — absent entirely; gold is Triumph's verified `#F4C25E`, small doses ✓
- **Pill badge + emoji eyebrow** — no pills, no emoji anywhere; eyebrows are signage caption lines ✓
- **Gradient-wash hero** — flat night ground; only a sub-2% monochrome horizon glow (atmosphere, not a color wash) ✓
- **Mid-sentence color-highlighted keyword** — headline is one color, all white ✓
- **Full-bleed color CTA band + stat row** — final CTA is a sign panel; zero stat rows and zero invented member counts ✓
- **Ghost-text watermark** — none ✓
- **Diagonal ribbon/banner** — exit tabs are rectangular sign tabs; SEC Quarterly quote is set as an editorial pull-quote ✓
- **ALL-CAPS everything + uniform thick black borders** — caps confined to sign legends; body is sentence-case Barlow; sign chrome (rounded, translucent white border) appears *only* on sign elements ✓
- **Font fatigue four** — not used ✓
- **Three-icon feature grid** — replaced by a motorist-services sign (stacked legend rows, no icon set) ✓
- **Fabricated stats/citations** — none; SEC Quarterly quote is real, prices are the real catalog, fixtures are labeled as sample data in-page ✓
- **The three AI default clusters** (cream/serif/terracotta · near-black + acid accent · broadsheet) — none; this is a two-accent brand-derived system on a navy ground with its own structural metaphor ✓
- **Purple** — no ✓

**Generic-default test:** an unbriefed "dark bold soccer site" produces near-black + Bebas condensed + hero wordmark + fixture cards + icon grid. This plan diverges at every one of those points (signage metaphor, Overpass/Newsreader, headline-in-object, departures board, services sign) — the one shared trait, the dark ground, is the brief's own §4.4 hypothesis and is earned by both clubs' dark palettes + shipped prior art.

## What stays honest

No real photography exists in this repo, so the concept fakes nothing: zero stock photos, zero placeholder gray boxes. The community's specificity is carried by *drawn* artifacts — the lot map, scarf-stripe merch art, the crest (its crown geometry reuses the shipped Tailgate HQ mark for continuity). Photo-dependent sections (Gallery) are deferred to the real build where actual tailgate photos exist.