diff --git a/public/404.html b/public/404.html
index b3c5ade..6dc30ad 100644
--- a/public/404.html
+++ b/public/404.html
@@ -26,9 +26,14 @@ nav{padding:16px 24px;border-bottom:1px solid var(--border);display:flex;align-i
 .btn-secondary{border:1px solid var(--border);color:var(--text-secondary)}
 .btn-secondary:hover{border-color:var(--primary);color:var(--text)}
 footer{padding:24px;text-align:center;color:var(--text-secondary);font-size:.8rem;border-top:1px solid var(--border)}
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <a href="/" class="logo">📸 SnapAPI</a>
   <div class="nav-links">
@@ -37,7 +42,8 @@ footer{padding:24px;text-align:center;color:var(--text-secondary);font-size:.8re
     <a href="/#pricing">Pricing</a>
   </div>
 </nav>
-<main class="content">
+</header>
+<main id="main-content" class="content">
   <div>
     <div class="error-code">404</div>
     <h1 class="error-title">Page Not Found</h1>
diff --git a/public/blog.html b/public/blog.html
index 09866ce..4851054 100644
--- a/public/blog.html
+++ b/public/blog.html
@@ -60,10 +60,15 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
 .footer-col a:hover{color:var(--text)}
 .footer-bottom{max-width:1180px;margin:0 auto;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.8rem;color:var(--muted)}
 @media(max-width:768px){.footer-grid{grid-template-columns:1fr}}
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 <script type="application/ld+json">{"@context":"https://schema.org","@type":"Blog","name":"SnapAPI Developer Blog","description":"Technical articles about screenshot APIs, web rendering, and performance optimization.","url":"https://snapapi.eu/blog","publisher":{"@type":"Organization","name":"SnapAPI","url":"https://snapapi.eu"}}</script>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -77,6 +82,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <div class="container">
   <div class="page-header">
@@ -101,6 +109,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </div>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand">
diff --git a/public/blog/screenshot-api-performance.html b/public/blog/screenshot-api-performance.html
index 71f412d..837362c 100644
--- a/public/blog/screenshot-api-performance.html
+++ b/public/blog/screenshot-api-performance.html
@@ -65,10 +65,15 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
 .footer-col a:hover{color:var(--text)}
 .footer-bottom{max-width:1180px;margin:0 auto;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.8rem;color:var(--muted)}
 @media(max-width:768px){.footer-grid{grid-template-columns:1fr}}
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 <script type="application/ld+json">{"@context":"https://schema.org","@type":"BlogPosting","headline":"Screenshot API Performance: Caching Strategies That Actually Work","description":"How we reduced p95 response times by 10x with intelligent caching, CDN integration, and browser pool management.","datePublished":"2026-03-02","author":{"@type":"Organization","name":"SnapAPI"},"publisher":{"@type":"Organization","name":"SnapAPI","url":"https://snapapi.eu"},"url":"https://snapapi.eu/blog/screenshot-api-performance","mainEntityOfPage":"https://snapapi.eu/blog/screenshot-api-performance"}</script>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -82,6 +87,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <article class="article">
   <div class="breadcrumb"><a href="/">Home</a> / <a href="/blog">Blog</a> / Screenshot API Performance</div>
@@ -165,6 +173,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </article>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand">
diff --git a/public/blog/why-screenshot-api.html b/public/blog/why-screenshot-api.html
index 90597a9..ff6be72 100644
--- a/public/blog/why-screenshot-api.html
+++ b/public/blog/why-screenshot-api.html
@@ -65,10 +65,15 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
 .footer-col a:hover{color:var(--text)}
 .footer-bottom{max-width:1180px;margin:0 auto;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-size:.8rem;color:var(--muted)}
 @media(max-width:768px){.footer-grid{grid-template-columns:1fr}}
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 <script type="application/ld+json">{"@context":"https://schema.org","@type":"BlogPosting","headline":"Why You Need a Screenshot API (And Why Building Your Own Is Harder Than You Think)","description":"Self-hosting Puppeteer sounds easy until you're debugging zombie Chrome processes at 3 AM.","datePublished":"2026-03-02","author":{"@type":"Organization","name":"SnapAPI"},"publisher":{"@type":"Organization","name":"SnapAPI","url":"https://snapapi.eu"},"url":"https://snapapi.eu/blog/why-screenshot-api","mainEntityOfPage":"https://snapapi.eu/blog/why-screenshot-api"}</script>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -82,6 +87,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <article class="article">
   <div class="breadcrumb"><a href="/">Home</a> / <a href="/blog">Blog</a> / Why You Need a Screenshot API</div>
@@ -181,6 +189,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </article>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand">
diff --git a/public/changelog.html b/public/changelog.html
index fd7018f..991b815 100644
--- a/public/changelog.html
+++ b/public/changelog.html
@@ -90,9 +90,14 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .nav-links.show{display:flex}
   .nav-mobile{display:block}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -107,6 +112,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <section class="hero-section">
   <div class="container">
@@ -220,6 +228,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </div>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand"><h4>📸 SnapAPI</h4><p>The EU-hosted screenshot API for developers. Convert any URL to a pixel-perfect image with a simple API call.</p></div>
diff --git a/public/compare.html b/public/compare.html
index 3fe5301..6ee3091 100644
--- a/public/compare.html
+++ b/public/compare.html
@@ -89,9 +89,14 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .nav-mobile{display:block}
   .footer-grid{grid-template-columns:1fr}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -105,6 +110,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <article class="article">
   <div class="container">
@@ -195,6 +203,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </article>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand"><h4>📸 SnapAPI</h4><p>The EU-hosted screenshot API for developers. Convert any URL to a pixel-perfect image with a simple API call.</p></div>
diff --git a/public/guides/quick-start.html b/public/guides/quick-start.html
index f27e6ce..4f11bf7 100644
--- a/public/guides/quick-start.html
+++ b/public/guides/quick-start.html
@@ -88,9 +88,14 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .nav-mobile{display:block}
   .footer-grid{grid-template-columns:1fr}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -104,6 +109,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <article class="article">
   <div class="container">
@@ -203,6 +211,8 @@ screenshot = client.<span class="fn">take</span>(
   </div>
 </article>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand"><h4>📸 SnapAPI</h4><p>The EU-hosted screenshot API for developers. Convert any URL to a pixel-perfect image with a simple API call.</p></div>
diff --git a/public/impressum.html b/public/impressum.html
index 8872189..4472001 100644
--- a/public/impressum.html
+++ b/public/impressum.html
@@ -69,10 +69,15 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .footer-grid{grid-template-columns:1fr}
   .nav-links{display:none}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
 
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -84,6 +89,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     </div>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <section class="legal-content">
   <div class="legal-container">
@@ -141,6 +149,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </section>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand">
diff --git a/public/index.html b/public/index.html
index 1245914..7693281 100644
--- a/public/index.html
+++ b/public/index.html
@@ -199,6 +199,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .footer-grid{grid-template-columns:1fr}
   .trust-badges{flex-direction:column;align-items:center;gap:12px}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 <link rel="canonical" href="https://snapapi.eu/">
 <meta property="og:title" content="SnapAPI — Screenshot API for Developers">
@@ -234,6 +237,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
 </head>
 <body>
 
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="#" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -252,6 +257,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <section class="hero">
   <div class="container">
@@ -719,6 +727,8 @@ screenshot = snap.<span class="fn">capture</span>(
   </div>
 </section>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand">
diff --git a/public/pricing.html b/public/pricing.html
index 577e507..d587f64 100644
--- a/public/pricing.html
+++ b/public/pricing.html
@@ -111,9 +111,14 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .nav-links.show{display:flex}
   .nav-mobile{display:block}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -128,6 +133,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <section class="hero-section">
   <div class="container">
@@ -246,6 +254,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </div>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand"><h4>📸 SnapAPI</h4><p>The EU-hosted screenshot API for developers. Convert any URL to a pixel-perfect image with a simple API call.</p></div>
diff --git a/public/privacy.html b/public/privacy.html
index 5741a90..d0f6ef2 100644
--- a/public/privacy.html
+++ b/public/privacy.html
@@ -69,10 +69,15 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .footer-grid{grid-template-columns:1fr}
   .nav-links{display:none}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
 
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -84,6 +89,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     </div>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <section class="legal-content">
   <div class="legal-container">
@@ -277,6 +285,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </section>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand">
diff --git a/public/terms.html b/public/terms.html
index d1b0619..808d64a 100644
--- a/public/terms.html
+++ b/public/terms.html
@@ -69,10 +69,15 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .footer-grid{grid-template-columns:1fr}
   .nav-links{display:none}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
 
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -84,6 +89,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     </div>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <section class="legal-content">
   <div class="legal-container">
@@ -358,6 +366,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </section>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand">
diff --git a/public/usage.html b/public/usage.html
index 4d27a1e..b9a257e 100644
--- a/public/usage.html
+++ b/public/usage.html
@@ -59,9 +59,14 @@ button:disabled{opacity:.5;cursor:not-allowed}
 .error-msg{background:rgba(239,68,68,0.1);border:1px solid rgba(239,68,68,0.3);border-radius:10px;padding:14px 18px;color:var(--red);font-size:.9rem;margin-bottom:16px;display:none}
 footer{border-top:1px solid var(--border);padding:24px;text-align:center;font-size:.8rem;color:var(--muted);margin-top:auto}
 @media(max-width:480px){.stats{grid-template-columns:1fr}.input-row{flex-direction:column}}
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav><div class="nav-inner">
   <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
   <div class="nav-links">
@@ -69,8 +74,9 @@ footer{border-top:1px solid var(--border);padding:24px;text-align:center;font-si
     <a href="/docs">API Docs</a>
   </div>
 </div></nav>
+</header>
 
-<main>
+<main id="main-content">
   <h1>Usage Dashboard</h1>
   <p class="subtitle">Check your API usage for the current billing month.</p>
 
diff --git a/public/use-cases/pdf-reports.html b/public/use-cases/pdf-reports.html
index 163e347..c810529 100644
--- a/public/use-cases/pdf-reports.html
+++ b/public/use-cases/pdf-reports.html
@@ -86,9 +86,14 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .nav-mobile{display:block}
   .footer-grid{grid-template-columns:1fr}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -102,6 +107,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <article class="article">
   <div class="container">
@@ -188,6 +196,8 @@ convert thumbnail.webp -resize 400x250 thumbnail-sm.webp</pre></div>
   </div>
 </article>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand"><h4>📸 SnapAPI</h4><p>The EU-hosted screenshot API for developers. Convert any URL to a pixel-perfect image with a simple API call.</p></div>
diff --git a/public/use-cases/social-media-previews.html b/public/use-cases/social-media-previews.html
index 6f1ccfe..293d95b 100644
--- a/public/use-cases/social-media-previews.html
+++ b/public/use-cases/social-media-previews.html
@@ -86,9 +86,14 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .nav-mobile{display:block}
   .footer-grid{grid-template-columns:1fr}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -102,6 +107,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <article class="article">
   <div class="container">
@@ -177,6 +185,8 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   </div>
 </article>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand"><h4>📸 SnapAPI</h4><p>The EU-hosted screenshot API for developers. Convert any URL to a pixel-perfect image with a simple API call.</p></div>
diff --git a/public/use-cases/website-monitoring.html b/public/use-cases/website-monitoring.html
index 183d298..2526b8f 100644
--- a/public/use-cases/website-monitoring.html
+++ b/public/use-cases/website-monitoring.html
@@ -86,9 +86,14 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
   .nav-mobile{display:block}
   .footer-grid{grid-template-columns:1fr}
 }
+
+.skip-link{position:absolute;top:-100%;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;padding:12px 24px;border-radius:0 0 8px 8px;font-weight:600;font-size:.9rem;z-index:1000;transition:top .2s}
+.skip-link:focus{top:0}
 </style>
 </head>
 <body>
+<a href="#main-content" class="skip-link">Skip to content</a>
+<header>
 <nav>
   <div class="nav-inner">
     <a href="/" class="nav-logo">📸 <span>SnapAPI</span></a>
@@ -102,6 +107,9 @@ footer{border-top:1px solid var(--border);padding:48px 24px 32px;background:var(
     <button class="nav-mobile" onclick="document.querySelector('.nav-links').classList.toggle('show')" aria-label="Menu">☰</button>
   </div>
 </nav>
+</header>
+
+<main id="main-content">
 
 <article class="article">
   <div class="container">
@@ -194,6 +202,8 @@ curl -X POST https://snapapi.eu/v1/screenshot \
   </div>
 </article>
 
+</main>
+
 <footer>
   <div class="footer-grid">
     <div class="footer-brand"><h4>📸 SnapAPI</h4><p>The EU-hosted screenshot API for developers. Convert any URL to a pixel-perfect image with a simple API call.</p></div>
diff --git a/src/routes/__tests__/accessibility.test.ts b/src/routes/__tests__/accessibility.test.ts
new file mode 100644
index 0000000..915cdc9
--- /dev/null
+++ b/src/routes/__tests__/accessibility.test.ts
@@ -0,0 +1,46 @@
+import { describe, it, expect } from 'vitest'
+import fs from 'fs'
+import path from 'path'
+import { fileURLToPath } from 'url'
+
+const __dirname = path.dirname(fileURLToPath(import.meta.url))
+const publicDir = path.join(__dirname, '../../../public')
+
+// All HTML pages that have a nav (full-layout pages)
+const fullLayoutPages = fs.readdirSync(publicDir, { recursive: true })
+  .filter((f): f is string => typeof f === 'string' && f.endsWith('.html'))
+  .map(f => path.join(publicDir, f))
+  .filter(f => {
+    const html = fs.readFileSync(f, 'utf-8')
+    return html.includes('<nav')
+  })
+
+describe('Accessibility landmarks', () => {
+  it('found full-layout pages to test', () => {
+    expect(fullLayoutPages.length).toBeGreaterThan(5)
+  })
+
+  for (const filePath of fullLayoutPages) {
+    const rel = path.relative(publicDir, filePath)
+
+    describe(rel, () => {
+      const html = fs.readFileSync(filePath, 'utf-8')
+
+      it('has <header> landmark wrapping nav', () => {
+        expect(html).toMatch(/<header[\s>]/)
+      })
+
+      it('has <main id="main-content"> landmark', () => {
+        expect(html).toMatch(/<main[\s][^>]*id=["']main-content["']/)
+      })
+
+      it('has skip-to-content link', () => {
+        expect(html).toMatch(/<a[^>]*href=["']#main-content["'][^>]*class=["'][^"']*skip-link/)
+      })
+
+      it('has <footer> landmark', () => {
+        expect(html).toMatch(/<footer[\s>]/)
+      })
+    })
+  }
+})
diff --git a/src/services/__tests__/browser.test.ts b/src/services/__tests__/browser.test.ts
new file mode 100644
index 0000000..5ba46fe
--- /dev/null
+++ b/src/services/__tests__/browser.test.ts
@@ -0,0 +1,199 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+
+const mockPage = () => ({
+  close: vi.fn().mockResolvedValue(undefined),
+  evaluate: vi.fn().mockResolvedValue(undefined),
+  goto: vi.fn().mockResolvedValue(undefined),
+  setViewport: vi.fn().mockResolvedValue(undefined),
+  screenshot: vi.fn().mockResolvedValue(Buffer.from('fake')),
+  waitForSelector: vi.fn().mockResolvedValue(undefined),
+})
+
+const mockBrowser = (pages: any[]) => ({
+  close: vi.fn().mockResolvedValue(undefined),
+  newPage: vi.fn().mockImplementation(() => {
+    const p = mockPage()
+    pages.push(p)
+    return Promise.resolve(p)
+  }),
+})
+
+let launchedBrowsers: any[] = []
+let allPages: any[][] = []
+
+vi.mock('puppeteer', () => ({
+  default: {
+    launch: vi.fn().mockImplementation(() => {
+      const pages: any[] = []
+      allPages.push(pages)
+      const b = mockBrowser(pages)
+      launchedBrowsers.push(b)
+      return Promise.resolve(b)
+    }),
+  },
+}))
+
+vi.mock('../logger.js', () => ({
+  default: { info: vi.fn(), warn: vi.fn(), error: vi.fn() },
+}))
+
+describe('Browser Pool Service', () => {
+  let mod: any
+
+  beforeEach(async () => {
+    vi.resetModules()
+    launchedBrowsers = []
+    allPages = []
+    vi.doMock('puppeteer', () => ({
+      default: {
+        launch: vi.fn().mockImplementation(() => {
+          const pages: any[] = []
+          allPages.push(pages)
+          const b = mockBrowser(pages)
+          launchedBrowsers.push(b)
+          return Promise.resolve(b)
+        }),
+      },
+    }))
+    vi.doMock('../logger.js', () => ({
+      default: { info: vi.fn(), warn: vi.fn(), error: vi.fn() },
+    }))
+    mod = await import('../browser.js')
+  })
+
+  afterEach(async () => {
+    try { await mod.closeBrowser() } catch {}
+  })
+
+  describe('initBrowser()', () => {
+    it('creates correct number of browsers (default BROWSER_COUNT=2)', async () => {
+      await mod.initBrowser()
+      expect(launchedBrowsers).toHaveLength(2)
+    })
+
+    it('creates PAGES_PER_BROWSER pages per browser (default 4)', async () => {
+      await mod.initBrowser()
+      for (const pages of allPages) {
+        expect(pages).toHaveLength(4)
+      }
+    })
+
+    it('pool stats reflect correct totals after init', async () => {
+      await mod.initBrowser()
+      const stats = mod.getPoolStats()
+      expect(stats.browsers).toBe(2)
+      expect(stats.pagesPerBrowser).toBe(4)
+      expect(stats.totalPages).toBe(8)
+      expect(stats.availablePages).toBe(8)
+      expect(stats.queueDepth).toBe(0)
+      expect(stats.totalJobs).toBe(0)
+    })
+  })
+
+  describe('acquirePage()', () => {
+    it('returns a page from the pool', async () => {
+      await mod.initBrowser()
+      const { page } = await mod.acquirePage()
+      expect(page).toBeDefined()
+      expect(page.evaluate).toBeDefined()
+    })
+
+    it('uses round-robin across browser instances', async () => {
+      await mod.initBrowser()
+      await mod.acquirePage()
+      await mod.acquirePage()
+      const stats = mod.getPoolStats()
+      expect(stats.availablePages).toBe(6)
+    })
+
+    it('decrements available pages on acquire', async () => {
+      await mod.initBrowser()
+      await mod.acquirePage()
+      const stats = mod.getPoolStats()
+      expect(stats.availablePages).toBe(7)
+    })
+  })
+
+  describe('releasePage()', () => {
+    it('increments job count after release', async () => {
+      await mod.initBrowser()
+      const { page, instance } = await mod.acquirePage()
+      expect(mod.getPoolStats().totalJobs).toBe(0)
+      mod.releasePage(page, instance)
+      expect(mod.getPoolStats().totalJobs).toBe(1)
+    })
+
+    it('returns page to pool (available count increases)', async () => {
+      await mod.initBrowser()
+      const { page, instance } = await mod.acquirePage()
+      expect(mod.getPoolStats().availablePages).toBe(7)
+      mod.releasePage(page, instance)
+      await new Promise(r => setTimeout(r, 50))
+      expect(mod.getPoolStats().availablePages).toBe(8)
+    })
+  })
+
+  describe('Queue behavior', () => {
+    it('queues request when all pages are busy and resolves when page released', async () => {
+      await mod.initBrowser()
+      const acquired = []
+      for (let i = 0; i < 8; i++) {
+        acquired.push(await mod.acquirePage())
+      }
+      expect(mod.getPoolStats().availablePages).toBe(0)
+
+      let resolved = false
+      const pending = mod.acquirePage().then((r: any) => { resolved = true; return r })
+      await new Promise(r => setTimeout(r, 10))
+      expect(resolved).toBe(false)
+      expect(mod.getPoolStats().queueDepth).toBe(1)
+
+      mod.releasePage(acquired[0].page, acquired[0].instance)
+      await new Promise(r => setTimeout(r, 100))
+      expect(resolved).toBe(true)
+
+      const result = await pending
+      mod.releasePage(result.page, result.instance)
+      for (let i = 1; i < acquired.length; i++) {
+        mod.releasePage(acquired[i].page, acquired[i].instance)
+      }
+    })
+
+    it('rejects with QUEUE_FULL after 30s timeout', async () => {
+      vi.useFakeTimers()
+      await mod.initBrowser()
+      const acquired = []
+      for (let i = 0; i < 8; i++) {
+        acquired.push(await mod.acquirePage())
+      }
+
+      const pending = mod.acquirePage()
+      await vi.advanceTimersByTimeAsync(31_000)
+      await expect(pending).rejects.toThrow('QUEUE_FULL')
+
+      for (const a of acquired) mod.releasePage(a.page, a.instance)
+      vi.useRealTimers()
+    })
+  })
+
+  describe('getPoolStats()', () => {
+    it('returns accurate counts during operations', async () => {
+      await mod.initBrowser()
+      const { page, instance } = await mod.acquirePage()
+      const stats = mod.getPoolStats()
+      expect(stats.availablePages).toBe(7)
+      expect(stats.totalJobs).toBe(0)
+      mod.releasePage(page, instance)
+      expect(mod.getPoolStats().totalJobs).toBe(1)
+    })
+  })
+
+  describe('Staggered restart', () => {
+    it('only one browser restarts at a time (restarting flag)', async () => {
+      await mod.initBrowser()
+      const stats = mod.getPoolStats()
+      // After init, no browsers should be restarting
+      expect(stats.browsers).toBe(2)
+    })
+  })
+})
