Justicehub Brand Alignment

---
name: justicehub-brand-alignment
description: JusticeHub brand alignment and design system. Use for page creation, design review, component patterns, accessibility, and copy writing.
---

# JusticeHub Brand Alignment

## Core Philosophy
**"Truth needs no filter, accessible by design"**

- Direct & Uncompromising
- Evidence-Based (data-driven, research-backed)
- Accessible First (WCAG AAA)
- Community-Centered
- Revolutionary Infrastructure

## Voice Rules

| DO | DON'T |
|----|-------|
| "Australia locks up children. Communities have the cure." | "Together we can make a difference" |
| "24x Indigenous kids locked up vs non-Indigenous" | "Disproportionate representation" |
| "FIND HELP NOW" | "Learn More" |
| Blunt honesty, numbers over narratives | Soft language, charity framing |

## Style Contexts

| Context | Background | Key Colors |
|---------|------------|------------|
| Homepage/Marketing | White | Black, Red accent |
| ALMA Intelligence | Dark (#0a0f16) | Green/Orange data |
| Steward/Community | White | Green-700 accent |
| Admin/SimCity | Gray-50 | Hard shadows |

## Key Classes

```css
.container-justice     /* Max-width container */
.section-padding       /* py-20 */
.headline-truth        /* Hero headlines */
.hero-stat             /* Large mono numbers */
```

## SimCity Shadow
```css
shadow-[4px_4px_0px_0px_rgba(0,0,0,1)]
shadow-[6px_6px_0px_0px_rgba(0,0,0,1)] /* hover */
```

## Data Colors
- **Success/Community**: Blue (#1e40af)
- **Failure/Detention**: Orange (#ea580c)

## File References

| Need | Reference |
|------|-----------|
| Color palette | `references/colors.md` |
| Components | `references/components.md` |
| Page templates | `references/templates.md` |
| Accessibility | `references/accessibility.md` |
| Steward styling | `references/steward-styling.md` |