# Story 9.3: Logo Integration

## Epic Reference
**Epic 9:** Design & Branding Implementation

## User Story
As a **visitor**,
I want **to see the Libra scales logo prominently displayed**,
So that **I recognize the firm's branding**.

## Acceptance Criteria

### Logo Placement
- [ ] Navigation: Top left (desktop), centered (mobile)
- [ ] Footer: Smaller version
- [ ] Email templates: Header
- [ ] PDF exports: Header

### Logo Specifications
- [ ] Minimum size: 120px (desktop), 80px (mobile)
- [ ] Clear space: 20px padding minimum

### Format Support
- [ ] SVG primary (scalable)
- [ ] PNG fallback

### Color Variations
- [ ] Full color (gold on navy)
- [ ] Reversed (navy on light)
- [ ] Monochrome gold

### Features
- [ ] Responsive sizing
- [ ] Accessible alt text

## Technical Notes

```blade
<!-- resources/views/components/logo.blade.php -->
@props([
    'size' => 'default',
    'variant' => 'full'
])

@php
$sizes = [
    'small' => 'h-8',
    'default' => 'h-12',
    'large' => 'h-16',
];

$variants = [
    'full' => 'logo.svg',
    'reversed' => 'logo-reversed.svg',
    'mono' => 'logo-mono.svg',
];
@endphp

<img
    src="{{ asset('images/' . $variants[$variant]) }}"
    alt="{{ __('Libra Law Firm') }}"
    {{ $attributes->merge(['class' => $sizes[$size]]) }}
/>
```

## Definition of Done
- [ ] Logo displays in navigation
- [ ] Logo displays in footer
- [ ] Logo in email templates
- [ ] Responsive sizing works
- [ ] All color variants available
- [ ] Alt text correct
- [ ] Tests pass

## Estimation
**Complexity:** Low | **Effort:** 2 hours