♿ a11y: fix template a11y issues that lower generated-site Lighthouse (a11y 92→~)

ProjectSites perf loop (idea #14) fire-27 audited a published generated site
(megabytespace) at Lighthouse a11y 92 and traced the issues to this template:
- Testimonials rating <div aria-label="N out of 5 stars"> had no role → a bare div
  can't take aria-label (aria-prohibited-attr). Added role="img".
- Footer column headers were <h4> with no preceding h3 (section h2 → footer h4
  skips a level → heading-order). Changed the 3 footer <h4>→<h3>.

Same a11y fixes already shipped on the projectsites.dev marketing homepage
(footer h4→h3, etc.). Every FUTURE generated build inherits these. (The carousel
target-size finding is AI-generated per-build, not in this base template.)

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

Author: ProfessorManhattan

src/components/Footer.tsx

@@ -60,9 +60,9 @@ export default function Footer({ routes = DEFAULT_ROUTES, socials = [] }: Props)
           </div>
 
           <nav aria-label="Footer navigation">
-            <h4 className="text-text font-semibold text-sm uppercase tracking-wider mb-6">
+            <h3 className="text-text font-semibold text-sm uppercase tracking-wider mb-6">
               Navigation
-            </h4>
+            </h3>
             <ul className="space-y-3 text-sm">
               {routes.map((r) => (
                 <li key={r.to}>
@@ -78,9 +78,9 @@ export default function Footer({ routes = DEFAULT_ROUTES, socials = [] }: Props)
           </nav>
 
           <div>
-            <h4 className="text-text font-semibold text-sm uppercase tracking-wider mb-6">
+            <h3 className="text-text font-semibold text-sm uppercase tracking-wider mb-6">
               Contact
-            </h4>
+            </h3>
             <address className="not-italic space-y-3 text-sm">
               {address && (
                 <a
@@ -115,9 +115,9 @@ export default function Footer({ routes = DEFAULT_ROUTES, socials = [] }: Props)
           </div>
 
           <div>
-            <h4 className="text-text font-semibold text-sm uppercase tracking-wider mb-6">
+            <h3 className="text-text font-semibold text-sm uppercase tracking-wider mb-6">
               Legal
-            </h4>
+            </h3>
             <ul className="space-y-3 text-sm">
               <li><Link to="/privacy"       className="hover:text-accent transition-colors underline-hover">Privacy Policy</Link></li>
               <li><Link to="/terms"         className="hover:text-accent transition-colors underline-hover">Terms of Service</Link></li>

src/components/Testimonials.tsx

@@ -53,7 +53,7 @@ export default function Testimonials({
           {testimonials.map((t, i) => (
             <AnimatedSection key={`${t.name}-${i}`} delay={`${i * 0.15}s`}>
               <figure className="glass rounded-2xl p-8 h-full flex flex-col">
-                <div className="flex gap-1 mb-4" aria-label={`${t.rating} out of 5 stars`}>
+                <div className="flex gap-1 mb-4" role="img" aria-label={`${t.rating} out of 5 stars`}>
                   {Array.from({ length: t.rating }).map((_, j) => (
                     <Star
                       key={j}