feat(brand): wire AnimatedLogo into Header + Footer

- Header: replaces AvBeatLogo across all 3 breakpoints (full / no-tagline / iconOnly).
- Footer: replaces AvBeatLogo full variant.
- AnimatedLogo: new iconOnly prop hides the wordmark+tagline span entirely for the mobile breakpoint.

Existing AvBeatLogo file kept on disk for now (unimported, can be deleted later) so we have a quick rollback target if anyone wants the static A+V monogram back.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/components/AnimatedLogo.tsx

@@ -38,6 +38,9 @@ interface Props {
   size?: number;
   variant?: AnimatedLogoVariant;
   showTagline?: boolean;
+  /** If true, emblem only — wordmark + tagline hidden. Use on mobile
+   *  breakpoints where horizontal space is tight. */
+  iconOnly?: boolean;
   className?: string;
 }
 
@@ -45,6 +48,7 @@ export default function AnimatedLogo({
   size = 64,
   variant = 'onLight',
   showTagline = true,
+  iconOnly = false,
   className = '',
 }: Props) {
   // useId for stable, SSR-safe unique IDs (the page can render two of
@@ -162,6 +166,7 @@ export default function AnimatedLogo({
       </svg>
 
       {/* ── WORDMARK + TAGLINE ───────────────────────────────────── */}
+      {!iconOnly && (
       <span
         className="al-text"
         style={{ display: 'inline-flex', flexDirection: 'column', gap: Math.round(size * 0.08), minWidth: 0 }}
@@ -210,6 +215,7 @@ export default function AnimatedLogo({
           </span>
         )}
       </span>
+      )}
 
       {/*
         Component-scoped CSS. Keeping it inline (style jsx-free) so the