Mobile polish: fix 320px overflow, 44px tap targets, readable badges

- Project cards stack credits under title on small screens
- Fluid headings on /work and project pages; next-project banner wraps
- Footer, back, award and nav links padded to ~44px touch targets
- theRender.Fish marked as in-house project

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

app/work/[slug]/page.tsx

@@ -52,7 +52,7 @@ export default async function ProjectPage({ params }: PageProps<"/work/[slug]">)
       <div className="mx-auto max-w-7xl px-5 md:px-8">
         <Link
           href="/work/"
-          className="font-mono text-xs tracking-[0.2em] text-muted uppercase transition-colors hover:text-fg"
+          className="-my-3.5 inline-block py-3.5 font-mono text-xs tracking-[0.2em] text-muted uppercase transition-colors hover:text-fg"
         >
           ← All work
         </Link>
@@ -106,7 +106,7 @@ export default async function ProjectPage({ params }: PageProps<"/work/[slug]">)
           </ul>
           <a
             href={`mailto:${site.email}?subject=${encodeURIComponent(`Enquiry: ${project.title}`)}`}
-            className="mt-12 inline-block font-mono text-xs tracking-[0.2em] text-accent uppercase hover:text-fg"
+            className="mt-9 inline-block py-3 font-mono text-xs tracking-[0.2em] text-accent uppercase hover:text-fg"
           >
             Talk to us about a project like this →
           </a>
@@ -115,13 +115,13 @@ export default async function ProjectPage({ params }: PageProps<"/work/[slug]">)
 
       <Link href={`/work/${next.slug}/`} className="group block border-t border-line">
         <div className="mx-auto flex max-w-7xl items-center justify-between gap-6 px-5 py-14 md:px-8 md:py-20">
-          <div>
+          <div className="min-w-0">
             <p className="font-mono text-xs tracking-[0.3em] text-muted uppercase">Next project</p>
-            <p className="mt-3 font-display text-3xl font-thin uppercase transition-colors group-hover:text-accent md:text-6xl">
+            <p className="mt-3 font-display text-3xl font-thin break-words uppercase transition-colors group-hover:text-accent md:text-6xl">
               {next.title}
             </p>
           </div>
-          <span className="font-display text-4xl font-thin transition-transform group-hover:translate-x-2 md:text-6xl">
+          <span className="shrink-0 font-display text-4xl font-thin transition-transform group-hover:translate-x-2 md:text-6xl">
             →
           </span>
         </div>

app/work/page.tsx

@@ -14,7 +14,7 @@ export default function WorkPage() {
   return (
     <div className="mx-auto max-w-7xl px-5 pt-36 pb-24 md:px-8 md:pt-48 md:pb-36">
       <SectionLabel index="—">Work</SectionLabel>
-      <h1 className="font-display text-6xl leading-[0.9] font-thin uppercase md:text-9xl">
+      <h1 className="font-display text-[clamp(2.75rem,15vw,8rem)] leading-[0.9] font-thin uppercase">
         Selected <span className="font-light">work</span>
       </h1>
       <section id="filmography" className="mt-20">