diff --git a/.github/workflows/build-and-publish.yml b/.github/workflows/build-and-publish.yml
index 0401832..c0fa147 100644
--- a/.github/workflows/build-and-publish.yml
+++ b/.github/workflows/build-and-publish.yml
@@ -15,6 +15,8 @@ jobs:
     if: startsWith(github.ref, 'refs/tags/')
     permissions:
       contents: write
+    env:
+      HUSKY: 0
     steps:
       - name: Checkout code
         uses: actions/checkout@v4
diff --git a/.github/workflows/sponsors.yml b/.github/workflows/sponsors.yml
index 0b1435b..8d261dc 100644
--- a/.github/workflows/sponsors.yml
+++ b/.github/workflows/sponsors.yml
@@ -1,7 +1,5 @@
 name: Update Sponsors
 on:
-  schedule:
-    - cron: '0 0 * * *'  # Daily
   workflow_dispatch:
 jobs:
   update:
diff --git a/.github/workflows/static.yml b/.github/workflows/static.yml
index b0f91c5..c81d723 100644
--- a/.github/workflows/static.yml
+++ b/.github/workflows/static.yml
@@ -27,6 +27,7 @@ concurrency:
 env:
   SIMPLE_MODE: ${{ vars.SIMPLE_MODE }}
   BASE_URL: ${{ vars.BASE_URL }}/ 
+  HUSKY: 0 
 
 jobs:
   # Single deploy job since we're just deploying
diff --git a/.gitignore b/.gitignore
index 3527f29..c4f76c1 100644
--- a/.gitignore
+++ b/.gitignore
@@ -12,6 +12,9 @@ dist
 dist-ssr
 *.local
 .npm-cache
+.env
+.env.production
+.env.local
 
 # Editor directories and files
 .vscode/*
diff --git a/.husky/pre-commit b/.husky/pre-commit
new file mode 100644
index 0000000..2312dc5
--- /dev/null
+++ b/.husky/pre-commit
@@ -0,0 +1 @@
+npx lint-staged
diff --git a/404.html b/404.html
index ba1c6b9..5d2924d 100644
--- a/404.html
+++ b/404.html
@@ -45,7 +45,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/index.html">BentoPDF</a>
                     </span>
@@ -166,11 +166,11 @@
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
                     <p class="text-gray-400 text-sm" data-i18n="footer.copyright">
-                        &copy; 2025 BentoPDF. All rights reserved.
+                        &copy; 2026 BentoPDF. All rights reserved.
                     </p>
                     <p class="text-gray-500 text-xs mt-2">
                         <span data-i18n="footer.version">Version</span> <span id="app-version"></span>
diff --git a/Dockerfile b/Dockerfile
index de59634..defc4d9 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -7,6 +7,7 @@ FROM node:20-alpine AS builder
 WORKDIR /app
 COPY package*.json ./
 COPY vendor ./vendor
+ENV HUSKY=0
 RUN npm ci
 COPY . .
 
@@ -36,8 +37,12 @@ LABEL org.opencontainers.image.url="https://github.com/alam00000/bentopdf"
 # global arg to local arg
 ARG BASE_URL
 
+# Set this to "true" to disable Nginx listening on IPv6
+ENV DISABLE_IPV6=false
+
 COPY --chown=nginx:nginx --from=builder /app/dist /usr/share/nginx/html${BASE_URL%/}
 COPY --chown=nginx:nginx nginx.conf /etc/nginx/nginx.conf
+COPY --chown=nginx:nginx --chmod=755 nginx-ipv6.sh /docker-entrypoint.d/99-disable-ipv6.sh
 RUN mkdir -p /etc/nginx/tmp && chown -R nginx:nginx /etc/nginx/tmp
 
 EXPOSE 8080
diff --git a/README.md b/README.md
index 2b418d1..379c25f 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-<p align="center"><img src="public/images/favicon.svg" width="80"></p>
+<p align="center"><img src="public/images/favicon-no-bg.svg" width="80"></p>
 <h1 align="center">BentoPDF</h1>
 
 **BentoPDF** is a powerful, privacy-first, client-side PDF toolkit that is self hostable and allows you to manipulate, edit, merge, and process PDF files directly in your browser. No server-side processing is required, ensuring your files remain secure and private.
@@ -162,6 +162,8 @@ BentoPDF offers a comprehensive suite of tools to handle all your PDF needs.
 | **Decrypt PDF**        | Remove password protection from a PDF (password required).         |
 | **Change Permissions** | Set or modify user permissions for printing, copying, and editing. |
 | **Sign PDF**           | Add your digital signature to a document.                          |
+| **Digital Signature**  | Add cryptographic digital signatures using X.509 certificates (PFX/PEM). |
+| **Validate Signature** | Verify digital signatures and view certificate details.            |
 | **Redact Content**     | Permanently remove sensitive content from your PDFs.               |
 | **Edit Metadata**      | View and modify PDF metadata (author, title, keywords, etc.).      |
 | **Remove Metadata**    | Strip all metadata from your PDF for privacy.                      |
@@ -434,6 +436,89 @@ docker run -p 8080:8080 bentopdf
 
 For detailed security configuration, see [SECURITY.md](SECURITY.md).
 
+### Digital Signature CORS Proxy (Required)
+
+The **Digital Signature** tool uses a signing library that may need to fetch certificate chain data from certificate authority provider. Since many certificate servers don't include CORS headers, a proxy is required for this feature to work in the browser.
+
+**When is the proxy needed?**
+- Only when using the Digital Signature tool
+- Only if your certificate requires fetching issuer certificates from external URLs
+- Self-signed certificates typically don't need this
+
+**Deploying the CORS Proxy (Cloudflare Workers):**
+
+1. **Navigate to the cloudflare directory:**
+   ```bash
+   cd cloudflare
+   ```
+
+2. **Login to Cloudflare (if not already):**
+   ```bash
+   npx wrangler login
+   ```
+
+3. **Deploy the worker:**
+   ```bash
+   npx wrangler deploy
+   ```
+
+4. **Note your worker URL** (e.g., `https://bentopdf-cors-proxy.your-subdomain.workers.dev`)
+
+5. **Set the environment variable when building:**
+   ```bash
+   VITE_CORS_PROXY_URL=https://your-worker-url.workers.dev npm run build
+   ```
+
+#### Production Security Features
+
+The CORS proxy includes several security measures:
+
+| Feature | Description |
+|---------|-------------|
+| **URL Restrictions** | Only allows certificate URLs (`.crt`, `.cer`, `.pem`, `/certs/`, `/ocsp`) |
+| **Private IP Blocking** | Blocks requests to localhost, 10.x, 192.168.x, 172.16-31.x |
+| **File Size Limit** | Rejects files larger than 10MB |
+| **Rate Limiting** | 60 requests per IP per minute (requires KV) |
+| **HMAC Signatures** | Optional client-side signing (limited protection) |
+
+#### Enabling Rate Limiting (Recommended)
+
+Rate limiting requires Cloudflare KV storage:
+
+```bash
+cd cloudflare
+
+# Create KV namespace
+npx wrangler kv namespace create "RATE_LIMIT_KV"
+
+# Copy the returned ID and add to wrangler.toml:
+# [[kv_namespaces]]
+# binding = "RATE_LIMIT_KV"
+# id = "YOUR_ID_HERE"
+
+# Redeploy
+npx wrangler deploy
+```
+
+**Free tier limits:** 100,000 reads/day, 1,000 writes/day (~300-500 signatures/day)
+
+#### HMAC Signature Verification (Optional)
+
+> **⚠️ Security Warning:** Client-side secrets can be extracted from bundled JavaScript. For production deployments with sensitive requirements, use your own backend server to proxy requests instead of embedding secrets in frontend code.
+
+BentoPDF uses client-side HMAC as a deterrent against casual abuse, but accepts this tradeoff due to its fully client-side architecture. To enable:
+
+```bash
+# Generate a secret
+openssl rand -hex 32
+
+# Set on Cloudflare Worker
+npx wrangler secret put PROXY_SECRET
+
+# Set in build environment
+VITE_CORS_PROXY_SECRET=your-secret npm run build
+```
+
 ### 📦 Version Management
 
 BentoPDF supports semantic versioning with multiple Docker tags available on both Docker Hub and GitHub Container Registry:
diff --git a/about.html b/about.html
index c7d6b41..fd431c3 100644
--- a/about.html
+++ b/about.html
@@ -54,7 +54,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="index.html">BentoPDF</a>
           </span>
@@ -234,11 +234,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm" data-i18n="footer.copyright">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             <span data-i18n="footer.version">Version</span> <span id="app-version"></span>
diff --git a/cloudflare/cors-proxy-worker.js b/cloudflare/cors-proxy-worker.js
new file mode 100644
index 0000000..b9ba458
--- /dev/null
+++ b/cloudflare/cors-proxy-worker.js
@@ -0,0 +1,351 @@
+/**
+ * BentoPDF CORS Proxy Worker
+ * 
+ * This Cloudflare Worker proxies certificate requests for the digital signing tool.
+ * It fetches certificates from external CAs that don't have CORS headers enabled
+ * and returns them with proper CORS headers.
+ * 
+ * 
+ * Deploy: npx wrangler deploy
+ * 
+ * Required Environment Variables (set in wrangler.toml or Cloudflare dashboard):
+ * - PROXY_SECRET: Shared secret for HMAC signature verification
+ */
+
+const ALLOWED_PATTERNS = [
+    /\.crt$/i,
+    /\.cer$/i,
+    /\.pem$/i,
+    /\/certs\//i,
+    /\/ocsp/i,
+    /\/crl/i,
+    /caIssuers/i,
+];
+
+const ALLOWED_ORIGINS = [
+    'https://www.bentopdf.com',
+    'https://bentopdf.com',
+];
+
+const BLOCKED_DOMAINS = [
+    'localhost',
+    '127.0.0.1',
+    '0.0.0.0',
+];
+
+
+const MAX_TIMESTAMP_AGE_MS = 5 * 60 * 1000;
+
+const RATE_LIMIT_MAX_REQUESTS = 60;
+const RATE_LIMIT_WINDOW_MS = 60 * 1000;
+
+const MAX_FILE_SIZE_BYTES = 10 * 1024 * 1024;
+
+async function verifySignature(message, signature, secret) {
+    try {
+        const encoder = new TextEncoder();
+        const key = await crypto.subtle.importKey(
+            'raw',
+            encoder.encode(secret),
+            { name: 'HMAC', hash: 'SHA-256' },
+            false,
+            ['verify']
+        );
+
+        const signatureBytes = new Uint8Array(
+            signature.match(/.{1,2}/g).map(byte => parseInt(byte, 16))
+        );
+
+        return await crypto.subtle.verify(
+            'HMAC',
+            key,
+            signatureBytes,
+            encoder.encode(message)
+        );
+    } catch (e) {
+        console.error('Signature verification error:', e);
+        return false;
+    }
+}
+
+async function generateSignature(message, secret) {
+    const encoder = new TextEncoder();
+    const key = await crypto.subtle.importKey(
+        'raw',
+        encoder.encode(secret),
+        { name: 'HMAC', hash: 'SHA-256' },
+        false,
+        ['sign']
+    );
+
+    const signature = await crypto.subtle.sign(
+        'HMAC',
+        key,
+        encoder.encode(message)
+    );
+
+    return Array.from(new Uint8Array(signature))
+        .map(b => b.toString(16).padStart(2, '0'))
+        .join('');
+}
+
+function isAllowedOrigin(origin) {
+    if (!origin) return false;
+    return ALLOWED_ORIGINS.some(allowed => origin.startsWith(allowed.replace(/\/$/, '')));
+}
+
+function isValidCertificateUrl(urlString) {
+    try {
+        const url = new URL(urlString);
+
+        if (!['http:', 'https:'].includes(url.protocol)) {
+            return false;
+        }
+
+        if (BLOCKED_DOMAINS.some(domain => url.hostname.includes(domain))) {
+            return false;
+        }
+
+        const hostname = url.hostname;
+        if (/^10\./.test(hostname) ||
+            /^172\.(1[6-9]|2[0-9]|3[0-1])\./.test(hostname) ||
+            /^192\.168\./.test(hostname)) {
+            return false;
+        }
+
+        return ALLOWED_PATTERNS.some(pattern => pattern.test(urlString));
+    } catch {
+        return false;
+    }
+}
+
+function corsHeaders(origin) {
+    return {
+        'Access-Control-Allow-Origin': origin || '*',
+        'Access-Control-Allow-Methods': 'GET, OPTIONS',
+        'Access-Control-Allow-Headers': 'Content-Type',
+        'Access-Control-Max-Age': '86400',
+    };
+}
+
+function handleOptions(request) {
+    const origin = request.headers.get('Origin');
+    return new Response(null, {
+        status: 204,
+        headers: corsHeaders(origin),
+    });
+}
+
+export default {
+    async fetch(request, env, ctx) {
+        const url = new URL(request.url);
+        const origin = request.headers.get('Origin');
+
+        if (request.method === 'OPTIONS') {
+            return handleOptions(request);
+        }
+
+        // NOTE: If you are selfhosting this proxy, you can remove this check, or can set it to only accept requests from your own domain
+        if (!isAllowedOrigin(origin)) {
+            return new Response(JSON.stringify({
+                error: 'Forbidden',
+                message: 'This proxy only accepts requests from bentopdf.com',
+            }), {
+                status: 403,
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+            });
+        }
+
+        if (request.method !== 'GET') {
+            return new Response('Method not allowed', {
+                status: 405,
+                headers: corsHeaders(origin),
+            });
+        }
+
+        const targetUrl = url.searchParams.get('url');
+        const timestamp = url.searchParams.get('t');
+        const signature = url.searchParams.get('sig');
+
+        if (env.PROXY_SECRET) {
+            if (!timestamp || !signature) {
+                return new Response(JSON.stringify({
+                    error: 'Missing authentication parameters',
+                    message: 'Request must include timestamp (t) and signature (sig) parameters',
+                }), {
+                    status: 401,
+                    headers: {
+                        ...corsHeaders(origin),
+                        'Content-Type': 'application/json',
+                    },
+                });
+            }
+
+            const requestTime = parseInt(timestamp, 10);
+            const now = Date.now();
+            if (isNaN(requestTime) || Math.abs(now - requestTime) > MAX_TIMESTAMP_AGE_MS) {
+                return new Response(JSON.stringify({
+                    error: 'Request expired or invalid timestamp',
+                    message: 'Timestamp must be within 5 minutes of current time',
+                }), {
+                    status: 401,
+                    headers: {
+                        ...corsHeaders(origin),
+                        'Content-Type': 'application/json',
+                    },
+                });
+            }
+
+            const message = `${targetUrl}${timestamp}`;
+            const isValid = await verifySignature(message, signature, env.PROXY_SECRET);
+
+            if (!isValid) {
+                return new Response(JSON.stringify({
+                    error: 'Invalid signature',
+                    message: 'Request signature verification failed',
+                }), {
+                    status: 401,
+                    headers: {
+                        ...corsHeaders(origin),
+                        'Content-Type': 'application/json',
+                    },
+                });
+            }
+        }
+
+        if (!targetUrl) {
+            return new Response(JSON.stringify({
+                error: 'Missing url parameter',
+                usage: 'GET /?url=<certificate_url>',
+            }), {
+                status: 400,
+                headers: {
+                    ...corsHeaders(origin),
+                    'Content-Type': 'application/json',
+                },
+            });
+        }
+
+        if (!isValidCertificateUrl(targetUrl)) {
+            return new Response(JSON.stringify({
+                error: 'Invalid or disallowed URL',
+                message: 'Only certificate-related URLs are allowed (*.crt, *.cer, *.pem, /certs/, /ocsp, /crl)',
+            }), {
+                status: 403,
+                headers: {
+                    ...corsHeaders(origin),
+                    'Content-Type': 'application/json',
+                },
+            });
+        }
+
+        const clientIP = request.headers.get('CF-Connecting-IP') || 'unknown';
+        const rateLimitKey = `ratelimit:${clientIP}`;
+        const now = Date.now();
+
+        if (env.RATE_LIMIT_KV) {
+            const rateLimitData = await env.RATE_LIMIT_KV.get(rateLimitKey, { type: 'json' });
+            const requests = rateLimitData?.requests || [];
+
+            const recentRequests = requests.filter(t => now - t < RATE_LIMIT_WINDOW_MS);
+
+            if (recentRequests.length >= RATE_LIMIT_MAX_REQUESTS) {
+                return new Response(JSON.stringify({
+                    error: 'Rate limit exceeded',
+                    message: `Maximum ${RATE_LIMIT_MAX_REQUESTS} requests per minute. Please try again later.`,
+                    retryAfter: Math.ceil((recentRequests[0] + RATE_LIMIT_WINDOW_MS - now) / 1000),
+                }), {
+                    status: 429,
+                    headers: {
+                        ...corsHeaders(origin),
+                        'Content-Type': 'application/json',
+                        'Retry-After': Math.ceil((recentRequests[0] + RATE_LIMIT_WINDOW_MS - now) / 1000).toString(),
+                    },
+                });
+            }
+
+            recentRequests.push(now);
+            await env.RATE_LIMIT_KV.put(rateLimitKey, JSON.stringify({ requests: recentRequests }), {
+                expirationTtl: 120,
+            });
+        }
+
+        try {
+            const response = await fetch(targetUrl, {
+                headers: {
+                    'User-Agent': 'BentoPDF-CertProxy/1.0',
+                },
+            });
+
+            if (!response.ok) {
+                return new Response(JSON.stringify({
+                    error: 'Failed to fetch certificate',
+                    status: response.status,
+                    statusText: response.statusText,
+                }), {
+                    status: response.status,
+                    headers: {
+                        ...corsHeaders(origin),
+                        'Content-Type': 'application/json',
+                    },
+                });
+            }
+
+            const contentLength = parseInt(response.headers.get('Content-Length') || '0', 10);
+            if (contentLength > MAX_FILE_SIZE_BYTES) {
+                return new Response(JSON.stringify({
+                    error: 'File too large',
+                    message: `Certificate file exceeds maximum size of ${MAX_FILE_SIZE_BYTES / 1024}KB`,
+                    size: contentLength,
+                    maxSize: MAX_FILE_SIZE_BYTES,
+                }), {
+                    status: 413,
+                    headers: {
+                        ...corsHeaders(origin),
+                        'Content-Type': 'application/json',
+                    },
+                });
+            }
+
+            const certData = await response.arrayBuffer();
+
+            if (certData.byteLength > MAX_FILE_SIZE_BYTES) {
+                return new Response(JSON.stringify({
+                    error: 'File too large',
+                    message: `Certificate file exceeds maximum size of ${MAX_FILE_SIZE_BYTES / 1024}KB`,
+                    size: certData.byteLength,
+                    maxSize: MAX_FILE_SIZE_BYTES,
+                }), {
+                    status: 413,
+                    headers: {
+                        ...corsHeaders(origin),
+                        'Content-Type': 'application/json',
+                    },
+                });
+            }
+
+            return new Response(certData, {
+                status: 200,
+                headers: {
+                    ...corsHeaders(origin),
+                    'Content-Type': response.headers.get('Content-Type') || 'application/x-x509-ca-cert',
+                    'Content-Length': certData.byteLength.toString(),
+                    'Cache-Control': 'public, max-age=86400',
+                },
+            });
+        } catch (error) {
+            return new Response(JSON.stringify({
+                error: 'Proxy error',
+                message: error.message,
+            }), {
+                status: 500,
+                headers: {
+                    ...corsHeaders(origin),
+                    'Content-Type': 'application/json',
+                },
+            });
+        }
+    },
+};
diff --git a/cloudflare/wrangler.toml b/cloudflare/wrangler.toml
new file mode 100644
index 0000000..491b4ae
--- /dev/null
+++ b/cloudflare/wrangler.toml
@@ -0,0 +1,45 @@
+name = "bentopdf-cors-proxy"
+main = "cors-proxy-worker.js"
+compatibility_date = "2024-01-01"
+
+# Deploy to Cloudflare's global network
+# If you are self hosting change the name to your worker name
+# Run: npx wrangler deploy
+
+# =============================================================================
+# SECURITY FEATURES
+# =============================================================================
+#
+# 1. SIGNATURE VERIFICATION (Optional - for anti-spoofing)
+#    - Generate secret: openssl rand -hex 32
+#    - Set secret: npx wrangler secret put PROXY_SECRET
+#    - Note: Secret is visible in frontend JS, so provides limited protection
+#
+# 2. RATE LIMITING (Recommended - requires KV)
+#    - Create KV namespace: npx wrangler kv namespace create "RATE_LIMIT_KV"
+#    - Uncomment the kv_namespaces section below with the returned ID
+#    - Limits: 60 requests per IP per minute
+#
+# 3. FILE SIZE LIMIT
+#    - Automatic: Rejects files larger than 1MB
+#    - Certificates are typically <10KB, so this prevents abuse
+#
+# 4. URL RESTRICTIONS
+#    - Only certificate URLs allowed (*.crt, *.cer, *.pem, /certs/, etc.)
+#    - Blocks private IPs (localhost, 10.x, 192.168.x, 172.16-31.x)
+
+# =============================================================================
+# KV NAMESPACE FOR RATE LIMITING
+# =============================================================================
+[[kv_namespaces]]
+binding = "RATE_LIMIT_KV"
+id = "b88e030b308941118cd484e3fcb3ae49"
+
+# Optional: Custom domain routing
+# routes = [
+#   { pattern = "cors-proxy.bentopdf.com/*", zone_name = "bentopdf.com" }
+# ]
+
+# Optional: Environment variables (for non-secret config)
+# [vars]
+# ALLOWED_ORIGINS = "https://www.bentopdf.com,https://bentopdf.com"
\ No newline at end of file
diff --git a/contact.html b/contact.html
index 77b17e2..624816f 100644
--- a/contact.html
+++ b/contact.html
@@ -6,30 +6,33 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <!-- Primary Meta Tags -->
   <title>Contact BentoPDF - Get in Touch | Support</title>
-  <meta name="description" content="Contact BentoPDF for support, questions, or feedback. Reach us at contact@bentopdf.com - we're here to help with your PDF needs.">
+  <meta name="description"
+    content="Contact BentoPDF for support, questions, or feedback. Reach us at contact@bentopdf.com - we're here to help with your PDF needs.">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/contact">
-  
+
   <!-- Open Graph -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/contact">
   <meta property="og:title" content="Contact BentoPDF - Get in Touch | Support">
-  <meta property="og:description" content="Contact BentoPDF for support, questions, or feedback. Reach us at contact@bentopdf.com - we're here to help with your PDF needs.">
+  <meta property="og:description"
+    content="Contact BentoPDF for support, questions, or feedback. Reach us at contact@bentopdf.com - we're here to help with your PDF needs.">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-contact.png">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="Contact BentoPDF - Get in Touch | Support">
-  <meta name="twitter:description" content="Contact BentoPDF for support, questions, or feedback. Reach us at contact@bentopdf.com - we're here to help with your PDF needs.">
+  <meta name="twitter:description"
+    content="Contact BentoPDF for support, questions, or feedback. Reach us at contact@bentopdf.com - we're here to help with your PDF needs.">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-contact.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <title>Contact BentoPDF - Get in Touch | Support</title>
-  
+
   <link rel="alternate" hreflang="en" href="/en/contact.html" />
   <link rel="alternate" hreflang="de" href="/de/contact.html" />
   <link rel="alternate" hreflang="vi" href="/vi/contact.html" />
@@ -52,7 +55,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="index.html">BentoPDF</a>
           </span>
@@ -125,11 +128,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm" data-i18n="footer.copyright">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             <span data-i18n="footer.version">Version</span> <span id="app-version"></span>
diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml
index 2dc72bf..1e6b4ab 100644
--- a/docker-compose.dev.yml
+++ b/docker-compose.dev.yml
@@ -9,3 +9,6 @@ services:
     ports:
       - '8080:8080'
     restart: unless-stopped
+    # For IPv4-only environments
+    #environment:
+    #  - DISABLE_IPV6=true
diff --git a/docker-compose.yml b/docker-compose.yml
index 494eff5..4999418 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -7,3 +7,6 @@ services:
     restart: unless-stopped
     ports:
       - '8080:8080'
+    # For IPv4-only environments
+    #environment:
+    #  - DISABLE_IPV6=true
diff --git a/docs/.vitepress/config.mts b/docs/.vitepress/config.mts
index 47d72a3..391fca8 100644
--- a/docs/.vitepress/config.mts
+++ b/docs/.vitepress/config.mts
@@ -8,7 +8,7 @@ export default defineConfig({
 
     themeConfig: {
         // https://vitepress.dev/reference/default-theme-config
-        logo: '/images/favicon.svg',
+        logo: '/images/favicon-no-bg.svg',
 
         nav: [
             { text: 'Home', link: '/' },
@@ -65,7 +65,7 @@ export default defineConfig({
 
         footer: {
             message: 'Dual-licensed under AGPL-3.0 and Commercial License.',
-            copyright: 'Copyright © 2025 BentoPDF'
+            copyright: 'Copyright © 2026 BentoPDF'
         },
 
         search: {
diff --git a/docs/self-hosting/cloudflare.md b/docs/self-hosting/cloudflare.md
index 6904cef..0d8850f 100644
--- a/docs/self-hosting/cloudflare.md
+++ b/docs/self-hosting/cloudflare.md
@@ -76,3 +76,44 @@ npm run build
 ### Worker Size Limits
 
 If using Cloudflare Workers for advanced routing, note the 1 MB limit for free plans.
+
+## CORS Proxy Worker (For Digital Signatures)
+
+The Digital Signature tool requires a CORS proxy to fetch certificate chains. Deploy the included worker:
+
+```bash
+cd cloudflare
+npx wrangler login
+npx wrangler deploy
+```
+
+### Security Features
+
+| Feature | Description |
+|---------|-------------|
+| **URL Restrictions** | Only certificate URLs allowed |
+| **File Size Limit** | Max 10MB per request |
+| **Rate Limiting** | 60 req/IP/min (requires KV) |
+| **Private IP Blocking** | Blocks localhost, internal IPs |
+
+### Enable Rate Limiting
+
+```bash
+# Create KV namespace
+npx wrangler kv namespace create "RATE_LIMIT_KV"
+
+# Add to wrangler.toml with returned ID:
+# [[kv_namespaces]]
+# binding = "RATE_LIMIT_KV"
+# id = "YOUR_ID"
+
+npx wrangler deploy
+```
+
+### Build with Proxy URL
+
+```bash
+VITE_CORS_PROXY_URL=https://your-worker.workers.dev npm run build
+```
+
+> **Note:** See [README](https://github.com/alam00000/bentopdf#digital-signature-cors-proxy-required) for HMAC signature setup.
diff --git a/docs/self-hosting/cors-proxy.md b/docs/self-hosting/cors-proxy.md
new file mode 100644
index 0000000..2797a19
--- /dev/null
+++ b/docs/self-hosting/cors-proxy.md
@@ -0,0 +1,116 @@
+# CORS Proxy for Certificate Fetching
+
+The digital signature tool uses a CORS proxy to fetch issuer certificates from external Certificate Authorities (CAs). This is necessary because many CA servers don't include CORS headers in their responses, which prevents direct browser-based fetching.
+
+## How It Works
+
+When signing a PDF with a certificate:
+
+1. The `zgapdfsigner` library tries to build a complete certificate chain
+2. It fetches issuer certificates from URLs embedded in your certificate's AIA (Authority Information Access) extension
+3. These requests are routed through a CORS proxy that adds the necessary `Access-Control-Allow-Origin` headers
+4. The proxy returns the certificate data to the browser
+
+## Self-Hosting the CORS Proxy
+
+If you're self-hosting BentoPDF, you'll need to deploy your own CORS proxy.
+
+### Option 1: Cloudflare Workers (Recommended)
+
+1. **Install Wrangler CLI**:
+   ```bash
+   npm install -g wrangler
+   ```
+
+2. **Login to Cloudflare**:
+   ```bash
+   wrangler login
+   ```
+
+3. **Deploy the proxy**:
+   ```bash
+   cd cloudflare
+   wrangler deploy
+   ```
+
+4. **Update your environment**:
+   Create a `.env` or set in your hosting platform:
+   ```
+   VITE_CORS_PROXY_URL=https://your-worker-name.your-subdomain.workers.dev
+   ```
+
+5. **Rebuild BentoPDF**:
+   ```bash
+   npm run build
+   ```
+
+### Option 2: Custom Backend Proxy
+
+You can also create your own proxy endpoint. The requirements are:
+
+1. Accept GET requests with a `url` query parameter
+2. Fetch the URL from your server (no CORS restrictions server-side)
+3. Return the response with these headers:
+   - `Access-Control-Allow-Origin: *` (or your specific origin)
+   - `Access-Control-Allow-Methods: GET, OPTIONS`
+   - `Content-Type: application/x-x509-ca-cert`
+
+Example Express.js implementation:
+
+```javascript
+app.get('/api/cert-proxy', async (req, res) => {
+  const targetUrl = req.query.url;
+  
+  // Validate it's a certificate URL
+  if (!isValidCertUrl(targetUrl)) {
+    return res.status(400).json({ error: 'Invalid URL' });
+  }
+  
+  try {
+    const response = await fetch(targetUrl);
+    const data = await response.arrayBuffer();
+    
+    res.set('Access-Control-Allow-Origin', '*');
+    res.set('Content-Type', 'application/x-x509-ca-cert');
+    res.send(Buffer.from(data));
+  } catch (error) {
+    res.status(500).json({ error: 'Proxy error' });
+  }
+});
+```
+
+## Security Considerations
+
+The included Cloudflare Worker has several security measures:
+
+- **URL Validation**: Only allows certificate-related URLs (`.crt`, `.cer`, `.pem`, `/certs/`, `/ocsp`, `/crl`)
+- **Blocked Domains**: Prevents access to localhost and private IP ranges
+- **HTTP Methods**: Only allows GET requests
+
+## Disabling the Proxy
+
+If you don't want to use a CORS proxy, set the environment variable to an empty string:
+
+```
+VITE_CORS_PROXY_URL=
+```
+
+**Note**: Without the proxy, signing with certificates that require external chain fetching (like FNMT or some corporate CAs) will fail.
+
+## Troubleshooting
+
+### "Failed to fetch certificate chain" Error
+
+1. Check that your CORS proxy is deployed and accessible
+2. Verify the `VITE_CORS_PROXY_URL` is correctly set
+3. Test the proxy directly:
+   ```bash
+   curl "https://your-proxy.workers.dev?url=https://www.cert.fnmt.es/certs/ACUSU.crt"
+   ```
+
+### Certificates That Work Without Proxy
+
+Some certificates include the full chain in the P12/PFX file and don't require external fetching:
+- Self-signed certificates
+- Some commercial CAs that bundle intermediate certificates
+- Certificates you've manually assembled with the full chain
diff --git a/docs/self-hosting/docker.md b/docs/self-hosting/docker.md
index 1c33236..0130afd 100644
--- a/docs/self-hosting/docker.md
+++ b/docs/self-hosting/docker.md
@@ -2,6 +2,15 @@
 
 The easiest way to self-host BentoPDF in a production environment.
 
+> [!IMPORTANT]
+> **Required Headers for Office File Conversion**
+> 
+> LibreOffice-based tools (Word, Excel, PowerPoint conversion) require these HTTP headers for `SharedArrayBuffer` support:
+> - `Cross-Origin-Opener-Policy: same-origin`
+> - `Cross-Origin-Embedder-Policy: require-corp`
+> 
+> The official Docker images include these headers. If using a reverse proxy (Traefik, Caddy, etc.), ensure these headers are preserved or added.
+
 ## Quick Start
 
 ```bash
@@ -106,6 +115,10 @@ services:
       - "traefik.http.routers.bentopdf.entrypoints=websecure"
       - "traefik.http.routers.bentopdf.tls.certresolver=letsencrypt"
       - "traefik.http.services.bentopdf.loadbalancer.server.port=8080"
+      # Required headers for SharedArrayBuffer (LibreOffice WASM)
+      - "traefik.http.routers.bentopdf.middlewares=bentopdf-headers"
+      - "traefik.http.middlewares.bentopdf-headers.headers.customresponseheaders.Cross-Origin-Opener-Policy=same-origin"
+      - "traefik.http.middlewares.bentopdf-headers.headers.customresponseheaders.Cross-Origin-Embedder-Policy=require-corp"
     restart: unless-stopped
 ```
 
@@ -135,6 +148,8 @@ Caddyfile:
 ```
 pdf.example.com {
     reverse_proxy bentopdf:8080
+    header Cross-Origin-Opener-Policy "same-origin"
+    header Cross-Origin-Embedder-Policy "require-corp"
 }
 ```
 
diff --git a/docs/self-hosting/index.md b/docs/self-hosting/index.md
index f8de37c..a492ec2 100644
--- a/docs/self-hosting/index.md
+++ b/docs/self-hosting/index.md
@@ -81,6 +81,7 @@ Choose your platform:
 - [Nginx](/self-hosting/nginx)
 - [Apache](/self-hosting/apache)
 - [Docker](/self-hosting/docker)
+- [CORS Proxy](/self-hosting/cors-proxy) - Required for digital signatures
 
 ## System Requirements
 
diff --git a/eslint.config.mjs b/eslint.config.mjs
new file mode 100644
index 0000000..d1130f8
--- /dev/null
+++ b/eslint.config.mjs
@@ -0,0 +1,47 @@
+import globals from "globals";
+import pluginJs from "@eslint/js";
+import tseslint from "typescript-eslint";
+import eslintConfigPrettier from "eslint-config-prettier";
+
+export default [
+    { files: ["**/*.{js,mjs,cjs,ts}"] },
+    { ignores: ["dist/**", "coverage/**", "node_modules/**", "**/.vitepress/cache/**", "public/**/*.min.js"] },
+    { languageOptions: { globals: { ...globals.browser, ...globals.node } } },
+    pluginJs.configs.recommended,
+    ...tseslint.configs.recommended,
+    eslintConfigPrettier,
+    {
+        rules: {
+            "@typescript-eslint/no-explicit-any": "warn",
+            "@typescript-eslint/no-unused-vars": ["warn", { "argsIgnorePattern": "^_" }],
+            "@typescript-eslint/no-unused-expressions": "warn",
+            "no-redeclare": "warn",
+            "no-constant-condition": "warn",
+            "no-ex-assign": "warn",
+            "no-empty": "warn",
+            "no-case-declarations": "warn",
+            "@typescript-eslint/no-this-alias": "warn",
+            "no-func-assign": "warn",
+            "no-fallthrough": "warn",
+            "no-cond-assign": "warn",
+            "no-irregular-whitespace": "warn",
+            "no-prototype-builtins": "warn",
+            "no-undef": "warn",
+            "no-useless-escape": "warn",
+            "no-unsafe-finally": "warn",
+            "no-self-assign": "warn",
+            "no-control-regex": "warn",
+            "@typescript-eslint/no-require-imports": "warn",
+            "getter-return": "warn",
+            "no-constant-binary-expression": "warn",
+            "@typescript-eslint/ban-ts-comment": "warn",
+            "no-unused-private-class-members": "warn",
+            "no-unreachable": "warn",
+            "no-setter-return": "warn",
+            "no-useless-catch": "warn",
+            "valid-typeof": "warn",
+            "no-sparse-arrays": "warn",
+            "no-misleading-character-class": "warn"
+        }
+    }
+];
diff --git a/faq.html b/faq.html
index 1991fbe..00f40c0 100644
--- a/faq.html
+++ b/faq.html
@@ -6,28 +6,31 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <!-- Primary Meta Tags -->
   <title>FAQ - Frequently Asked Questions | BentoPDF</title>
-  <meta name="description" content="Find answers to common questions about BentoPDF. Learn about privacy, features, file limits, and how our browser-based PDF tools work.">
+  <meta name="description"
+    content="Find answers to common questions about BentoPDF. Learn about privacy, features, file limits, and how our browser-based PDF tools work.">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/faq">
-  
+
   <!-- Open Graph -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/faq">
   <meta property="og:title" content="FAQ - Frequently Asked Questions | BentoPDF">
-  <meta property="og:description" content="Find answers to common questions about BentoPDF. Learn about privacy, features, file limits, and how our browser-based PDF tools work.">
+  <meta property="og:description"
+    content="Find answers to common questions about BentoPDF. Learn about privacy, features, file limits, and how our browser-based PDF tools work.">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-faq.png">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="FAQ - Frequently Asked Questions | BentoPDF">
-  <meta name="twitter:description" content="Find answers to common questions about BentoPDF. Learn about privacy, features, file limits, and how our browser-based PDF tools work.">
+  <meta name="twitter:description"
+    content="Find answers to common questions about BentoPDF. Learn about privacy, features, file limits, and how our browser-based PDF tools work.">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-faq.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <title>FAQ - Frequently Asked Questions | BentoPDF</title>
   <link href="/src/css/styles.css" rel="stylesheet" />
 
@@ -47,7 +50,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="index.html">BentoPDF</a>
           </span>
@@ -267,11 +270,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
diff --git a/index.html b/index.html
index 7808b84..0770c6f 100644
--- a/index.html
+++ b/index.html
@@ -69,7 +69,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="index.html">BentoPDF</a>
           </span>
@@ -903,7 +903,7 @@
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm" data-i18n="footer.copyright">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             <span data-i18n="footer.version">Version</span> <span id="app-version"></span>
diff --git a/licensing.html b/licensing.html
index 8e9fe18..20b3f12 100644
--- a/licensing.html
+++ b/licensing.html
@@ -4,30 +4,33 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <!-- Primary Meta Tags -->
-  <title>Licensing Information - Open Source PDF Tools | BentoPDF</title>
-  <meta name="description" content="Learn about BentoPDF licensing and the open-source libraries we use. Free PDF tools built with transparency.">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/licensing">
-  
-  <!-- Open Graph -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/licensing">
-  <meta property="og:title" content="Licensing Information - Open Source PDF Tools | BentoPDF">
-  <meta property="og:description" content="Learn about BentoPDF licensing and the open-source libraries we use. Free PDF tools built with transparency.">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-licensing.png">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:title" content="Licensing Information - Open Source PDF Tools | BentoPDF">
-  <meta name="twitter:description" content="Learn about BentoPDF licensing and the open-source libraries we use. Free PDF tools built with transparency.">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-licensing.png">
-  <meta name="twitter:site" content="@BentoPDF">
-  
+    <!-- Primary Meta Tags -->
+    <title>Licensing Information - Open Source PDF Tools | BentoPDF</title>
+    <meta name="description"
+        content="Learn about BentoPDF licensing and the open-source libraries we use. Free PDF tools built with transparency.">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/licensing">
+
+    <!-- Open Graph -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/licensing">
+    <meta property="og:title" content="Licensing Information - Open Source PDF Tools | BentoPDF">
+    <meta property="og:description"
+        content="Learn about BentoPDF licensing and the open-source libraries we use. Free PDF tools built with transparency.">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-licensing.png">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:title" content="Licensing Information - Open Source PDF Tools | BentoPDF">
+    <meta name="twitter:description"
+        content="Learn about BentoPDF licensing and the open-source libraries we use. Free PDF tools built with transparency.">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-licensing.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
     <title>Licensing Information - Open Source PDF Tools | BentoPDF</title>
     <link rel="alternate" hreflang="en" href="/en/licensing.html" />
     <link rel="alternate" hreflang="de" href="/de/licensing.html" />
@@ -35,15 +38,15 @@
     <link rel="alternate" hreflang="x-default" href="/en/licensing.html" />
     <link href="/src/css/styles.css" rel="stylesheet" />
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900 text-gray-300">
@@ -51,7 +54,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="index.html">BentoPDF</a>
                     </span>
@@ -732,11 +735,11 @@
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
                     <p class="text-gray-400 text-sm" data-i18n="footer.copyright">
-                        &copy; 2025 BentoPDF. All rights reserved.
+                        &copy; 2026 BentoPDF. All rights reserved.
                     </p>
                     <p class="text-gray-500 text-xs mt-2">
                         <span data-i18n="footer.version">Version</span> <span id="app-version"></span>
@@ -820,8 +823,8 @@
     <script type="module" src="src/version.ts"></script>
     <script type="module" src="src/js/main.ts"></script>
     <script type="module" src="src/js/mobileMenu.ts"></script>
-  <!-- JSON-LD Schema -->
-  <script type="application/ld+json">
+    <!-- JSON-LD Schema -->
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "WebPage",
diff --git a/nginx-ipv6.sh b/nginx-ipv6.sh
new file mode 100644
index 0000000..f2a5ee5
--- /dev/null
+++ b/nginx-ipv6.sh
@@ -0,0 +1,17 @@
+#!/bin/sh
+# @see: https://github.com/nginx/docker-nginx-unprivileged/tree/main/stable/alpine-slim
+
+set -e
+
+entrypoint_log() {
+    if [ -z "${NGINX_ENTRYPOINT_QUIET_LOGS:-}" ]; then
+        echo "$@"
+    fi
+}
+
+if [ "$DISABLE_IPV6" = "true" ]; then
+  entrypoint_log "Disabling the Nginx IPv6 listener"
+  sed -i '/^[[:space:]]*listen[[:space:]]*\[::\]:[0-9]*/s/^/#/' /etc/nginx/nginx.conf
+fi
+
+exit 0
diff --git a/nginx.conf b/nginx.conf
index 8de1d2b..95816f7 100644
--- a/nginx.conf
+++ b/nginx.conf
@@ -26,7 +26,7 @@ http {
         root /usr/share/nginx/html;
         index index.html;
         
-        rewrite ^/(en|de|es|zh|vi)/(.*)$ /$2 last;
+        rewrite ^/(en|de|es|zh|vi|it)/(.*)$ /$2 last;
 
         location ~* \.html$ {
             expires 1h;
@@ -96,6 +96,7 @@ http {
         add_header X-Content-Type-Options "nosniff" always;
         add_header X-XSS-Protection "1; mode=block" always;
         add_header Cross-Origin-Opener-Policy "same-origin" always;
+        add_header Cross-Origin-Embedder-Policy "require-corp" always;
         add_header Cross-Origin-Resource-Policy "cross-origin" always;
     }
 }
diff --git a/package-lock.json b/package-lock.json
index 9277204..85740f5 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,16 +1,16 @@
 {
   "name": "bento-pdf",
-  "version": "1.15.3",
+  "version": "1.15.4",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "bento-pdf",
-      "version": "1.15.3",
+      "version": "1.15.4",
       "license": "AGPL-3.0-only",
       "dependencies": {
         "@bentopdf/gs-wasm": "^0.1.0",
-        "@bentopdf/pymupdf-wasm": "^0.1.9",
+        "@bentopdf/pymupdf-wasm": "^0.1.10",
         "@fontsource/cedarville-cursive": "^5.2.7",
         "@fontsource/dancing-script": "^5.2.8",
         "@fontsource/dm-sans": "^5.2.8",
@@ -24,6 +24,7 @@
         "@phosphor-icons/web": "^2.1.2",
         "@tailwindcss/vite": "^4.1.15",
         "@types/markdown-it": "^14.1.2",
+        "@types/node-forge": "^1.3.14",
         "@types/papaparse": "^5.5.2",
         "archiver": "^7.0.1",
         "blob-stream": "^0.1.3",
@@ -52,6 +53,7 @@
         "markdown-it-task-lists": "^2.1.1",
         "markdown-it-toc-done-right": "^4.2.0",
         "mermaid": "^11.12.2",
+        "node-forge": "^1.3.3",
         "papaparse": "^5.5.3",
         "pdf-lib": "^1.17.1",
         "pdfjs-dist": "^5.4.296",
@@ -63,9 +65,11 @@
         "tiff": "^7.1.2",
         "utif": "^3.1.0",
         "vite-plugin-static-copy": "^3.1.4",
-        "xlsx": "file:vendor/sheetjs/xlsx-0.20.2.tgz"
+        "xlsx": "file:vendor/sheetjs/xlsx-0.20.2.tgz",
+        "zgapdfsigner": "^2.7.5"
       },
       "devDependencies": {
+        "@eslint/js": "^9.39.2",
         "@testing-library/dom": "^10.4.1",
         "@types/blob-stream": "^0.1.33",
         "@types/html2canvas": "^1.0.0",
@@ -74,9 +78,15 @@
         "@types/utif": "^3.0.6",
         "@vitest/coverage-v8": "^3.2.4",
         "@vitest/ui": "^3.2.4",
+        "eslint": "^9.39.2",
+        "eslint-config-prettier": "^10.1.8",
+        "globals": "^17.0.0",
+        "husky": "^9.1.7",
         "jsdom": "^27.0.1",
+        "lint-staged": "^16.2.7",
         "prettier": "^3.6.2",
         "typescript": "~5.9.3",
+        "typescript-eslint": "^8.51.0",
         "vite": "^7.1.11",
         "vite-plugin-compression": "^0.5.1",
         "vite-plugin-node-polyfills": "^0.24.0",
@@ -253,6 +263,7 @@
       "integrity": "sha512-ZsOJqu4HOG5BlvIFnMU0YKjQ9ZI6r3C31dg2jk5kMWPSdhJpYL9xa5hEe7aieE+707dXeMI4ej3diy6mXdZpgA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@algolia/client-common": "5.46.2",
         "@algolia/requester-browser-xhr": "5.46.2",
@@ -377,15 +388,6 @@
         "url": "https://github.com/sponsors/antfu"
       }
     },
-    "node_modules/@antfu/install-pkg/node_modules/tinyexec": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.0.2.tgz",
-      "integrity": "sha512-W/KYk+NFhkmsYpuHq5JykngiOCnxeVL8v8dFnqxSD8qEEdRfXk1SDM6JzNqcERbcGYj9tMrDQBYV9cjgnunFIg==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=18"
-      }
-    },
     "node_modules/@asamuzakjp/css-color": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-4.1.1.tgz",
@@ -506,14 +508,15 @@
       "resolved": "https://registry.npmjs.org/@bentopdf/gs-wasm/-/gs-wasm-0.1.0.tgz",
       "integrity": "sha512-C71zxZW4R7Oa6fdya5leTh2VOZOxqH8IQlveh13OeuwZ2ulrovSi9629xTzAiIeeVKvDZma1Klxy4MuK65xe9w==",
       "license": "AGPL-3.0",
+      "peer": true,
       "dependencies": {
         "@types/emscripten": "^1.39.10"
       }
     },
     "node_modules/@bentopdf/pymupdf-wasm": {
-      "version": "0.1.9",
-      "resolved": "https://registry.npmjs.org/@bentopdf/pymupdf-wasm/-/pymupdf-wasm-0.1.9.tgz",
-      "integrity": "sha512-EO1JZIS6EXc8hJ61QjFniVqIyJlCvC/OOIdFS55M0TSCbLWV8n23YkyBda5+udpkocW0JZ4mCoHw1lnLQ4v+oA==",
+      "version": "0.1.10",
+      "resolved": "https://registry.npmjs.org/@bentopdf/pymupdf-wasm/-/pymupdf-wasm-0.1.10.tgz",
+      "integrity": "sha512-gej9ItnAswVZhJin8gb0D7rYKqEWvBtO72M4d0eRKP4oARS67eOQERLaKBE4wulIst1x3r3PtHi7673PCmIv+A==",
       "license": "AGPL-3.0",
       "peerDependencies": {
         "@bentopdf/gs-wasm": "*"
@@ -664,6 +667,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18"
       },
@@ -707,6 +711,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18"
       }
@@ -729,7 +734,7 @@
         "preact": "^10.0.0"
       }
     },
-    "node_modules/@docsearch/js/node_modules/@docsearch/react": {
+    "node_modules/@docsearch/react": {
       "version": "3.8.2",
       "resolved": "https://registry.npmjs.org/@docsearch/react/-/react-3.8.2.tgz",
       "integrity": "sha512-xCRrJQlTt8N9GU0DG4ptwHRkfnSnD/YpdeaXe02iKfqs97TkZJv60yE+1eq/tjPcVnTW8dP5qLP7itifFVV5eg==",
@@ -762,54 +767,12 @@
         }
       }
     },
-    "node_modules/@docsearch/js/node_modules/react": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
-      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "loose-envify": "^1.1.0"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/@docsearch/js/node_modules/react-dom": {
-      "version": "18.3.1",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
-      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "loose-envify": "^1.1.0",
-        "scheduler": "^0.23.2"
-      },
-      "peerDependencies": {
-        "react": "^18.3.1"
-      }
-    },
-    "node_modules/@docsearch/js/node_modules/scheduler": {
-      "version": "0.23.2",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
-      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
-      "dev": true,
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "loose-envify": "^1.1.0"
-      }
-    },
     "node_modules/@embedpdf/core": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/@embedpdf/core/-/core-1.5.0.tgz",
       "integrity": "sha512-Yrh9XoVaT8cUgzgqpJ7hx5wg6BqQrCFirqqlSwVb+Ly9oNn4fZbR9GycIWmzJOU5XBnaOJjXfQSaDyoNP0woNA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@embedpdf/engines": "1.5.0",
         "@embedpdf/models": "1.5.0"
@@ -960,6 +923,7 @@
       "resolved": "https://registry.npmjs.org/@embedpdf/plugin-history/-/plugin-history-1.5.0.tgz",
       "integrity": "sha512-p7PTNNaIr4gH3jLwX+eLJe1DeUXgi21kVGN6SRx/pocH8esg4jqoOeD/YiRRZoZnPOiy0jBXVhkPkwSmY7a2hQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@embedpdf/models": "1.5.0"
       },
@@ -976,6 +940,7 @@
       "resolved": "https://registry.npmjs.org/@embedpdf/plugin-interaction-manager/-/plugin-interaction-manager-1.5.0.tgz",
       "integrity": "sha512-ckHgTfvkW6c5Ta7Mc+Dl9C2foVnvEpqEJ84wyBnqrU0OWbe/jsiPhyKBVeartMGqNI/kVfaQTXupyrKhekAVmg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@embedpdf/models": "1.5.0"
       },
@@ -993,6 +958,7 @@
       "resolved": "https://registry.npmjs.org/@embedpdf/plugin-loader/-/plugin-loader-1.5.0.tgz",
       "integrity": "sha512-P4YpIZfaW69etYIjphyaL4cGl2pB14h3OdTE0tRQ2pZYZHFLTvlt4q9B3PVSdhlSrHK5nob7jfLGon2U7xCslg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@embedpdf/models": "1.5.0"
       },
@@ -1065,6 +1031,7 @@
       "resolved": "https://registry.npmjs.org/@embedpdf/plugin-render/-/plugin-render-1.5.0.tgz",
       "integrity": "sha512-ywwSj0ByrlkvrJIHKRzqxARkOZriki8VJUC+T4MV8fGyF4CzvCRJyKlPktahFz+VxhoodqTh7lBCib68dH+GvA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@embedpdf/models": "1.5.0"
       },
@@ -1099,6 +1066,7 @@
       "resolved": "https://registry.npmjs.org/@embedpdf/plugin-scroll/-/plugin-scroll-1.5.0.tgz",
       "integrity": "sha512-RNmTZCZ8X1mA8cw9M7TMDuhO9GtkOalGha2bBL3En3D1IlDRS7PzNNMSMV7eqT7OQICSTltlpJ8p8Qi5esvL/Q==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@embedpdf/models": "1.5.0"
       },
@@ -1135,6 +1103,7 @@
       "resolved": "https://registry.npmjs.org/@embedpdf/plugin-selection/-/plugin-selection-1.5.0.tgz",
       "integrity": "sha512-zrxLBAZQoPswDuf9q9DrYaQc6B0Ysc2U1hueTjNH/4+ydfl0BFXZkKR63C2e3YmWtXvKjkoIj0GyPzsiBORLUw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@embedpdf/models": "1.5.0"
       },
@@ -1225,6 +1194,7 @@
       "resolved": "https://registry.npmjs.org/@embedpdf/plugin-viewport/-/plugin-viewport-1.5.0.tgz",
       "integrity": "sha512-G8GDyYRhfehw72+r4qKkydnA5+AU8qH67g01Y12b0DzI0VIzymh/05Z4dK8DsY3jyWPXJfw2hlg5+KDHaMBHgQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@embedpdf/models": "1.5.0"
       },
@@ -1270,23 +1240,6 @@
         "vue": ">=3.2.0"
       }
     },
-    "node_modules/@emnapi/runtime": {
-      "version": "1.7.1",
-      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.7.1.tgz",
-      "integrity": "sha512-PVtJr5CmLwYAU9PZDMITZoR5iAOShYREoR45EyyLrbntV50mdePTgUn4AmOw90Ifcj+x2kRjdzr1HP3RrNiHGA==",
-      "license": "MIT",
-      "optional": true,
-      "dependencies": {
-        "tslib": "^2.4.0"
-      }
-    },
-    "node_modules/@emnapi/runtime/node_modules/tslib": {
-      "version": "2.8.1",
-      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
-      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
-      "license": "0BSD",
-      "optional": true
-    },
     "node_modules/@esbuild/aix-ppc64": {
       "version": "0.27.2",
       "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.2.tgz",
@@ -1703,6 +1656,181 @@
         "node": ">=18"
       }
     },
+    "node_modules/@eslint-community/eslint-utils": {
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.1.tgz",
+      "integrity": "sha512-phrYmNiYppR7znFEdqgfWHXR6NCkZEK7hwWDHZUjit/2/U0r6XvkDl0SYnoM51Hq7FhCGdLDT6zxCCOY1hexsQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eslint-visitor-keys": "^3.4.3"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0"
+      }
+    },
+    "node_modules/@eslint-community/eslint-utils/node_modules/eslint-visitor-keys": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
+      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@eslint-community/regexpp": {
+      "version": "4.12.2",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.2.tgz",
+      "integrity": "sha512-EriSTlt5OC9/7SXkRSCAhfSxxoSUgBm33OH+IkwbdpgoqsSsUg7y3uh+IICI/Qg4BBWr3U2i39RpmycbxMq4ew==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
+      }
+    },
+    "node_modules/@eslint/config-array": {
+      "version": "0.21.1",
+      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.21.1.tgz",
+      "integrity": "sha512-aw1gNayWpdI/jSYVgzN5pL0cfzU02GT3NBpeT/DXbx1/1x7ZKxFPd9bwrzygx/qiwIQiJ1sw/zD8qY/kRvlGHA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/object-schema": "^2.1.7",
+        "debug": "^4.3.1",
+        "minimatch": "^3.1.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/config-helpers": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.4.2.tgz",
+      "integrity": "sha512-gBrxN88gOIf3R7ja5K9slwNayVcZgK6SOUORm2uBzTeIEfeVaIhOpCtTox3P6R7o2jLFwLFTLnC7kU/RGcYEgw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/core": "^0.17.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/core": {
+      "version": "0.17.0",
+      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.17.0.tgz",
+      "integrity": "sha512-yL/sLrpmtDaFEiUj1osRP4TI2MDz1AddJL+jZ7KSqvBuliN4xqYY54IfdN8qD8Toa6g1iloph1fxQNkjOxrrpQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@types/json-schema": "^7.0.15"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/eslintrc": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.3.tgz",
+      "integrity": "sha512-Kr+LPIUVKz2qkx1HAMH8q1q6azbqBAsXJUxBl/ODDuVPX45Z9DfwB8tPjTi6nNZ8BuM3nbJxC5zCAg5elnBUTQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "^6.12.4",
+        "debug": "^4.3.2",
+        "espree": "^10.0.1",
+        "globals": "^14.0.0",
+        "ignore": "^5.2.0",
+        "import-fresh": "^3.2.1",
+        "js-yaml": "^4.1.1",
+        "minimatch": "^3.1.2",
+        "strip-json-comments": "^3.1.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@eslint/eslintrc/node_modules/globals": {
+      "version": "14.0.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz",
+      "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@eslint/js": {
+      "version": "9.39.2",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.39.2.tgz",
+      "integrity": "sha512-q1mjIoW1VX4IvSocvM/vbTiveKC4k9eLrajNEuSsmjymSDEbpGddtpfOoN7YGAqBK3NG+uqo8ia4PDTt8buCYA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      }
+    },
+    "node_modules/@eslint/object-schema": {
+      "version": "2.1.7",
+      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.7.tgz",
+      "integrity": "sha512-VtAOaymWVfZcmZbp6E2mympDIHvyjXs/12LqWYjVw6qjrfF+VK+fyG33kChz3nnK+SU5/NeHOqrTEHS8sXO3OA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@eslint/plugin-kit": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.4.1.tgz",
+      "integrity": "sha512-43/qtrDUokr7LJqoF2c3+RInu/t4zfrpYdoSDfYyhg52rwLV6TnOvdG4fXm7IkSB3wErkcmJS9iEhjVtOSEjjA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/core": "^0.17.0",
+        "levn": "^0.4.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      }
+    },
+    "node_modules/@exodus/bytes": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/@exodus/bytes/-/bytes-1.8.0.tgz",
+      "integrity": "sha512-8JPn18Bcp8Uo1T82gR8lh2guEOa5KKU/IEKvvdp0sgmi7coPBWf1Doi1EXsGZb2ehc8ym/StJCjffYV+ne7sXQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@exodus/crypto": "^1.0.0-rc.4"
+      },
+      "peerDependenciesMeta": {
+        "@exodus/crypto": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@fontsource/cedarville-cursive": {
       "version": "5.2.7",
       "resolved": "https://registry.npmjs.org/@fontsource/cedarville-cursive/-/cedarville-cursive-5.2.7.tgz",
@@ -1766,10 +1894,62 @@
         "url": "https://github.com/sponsors/ayuhito"
       }
     },
+    "node_modules/@humanfs/core": {
+      "version": "0.19.1",
+      "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
+      "integrity": "sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanfs/node": {
+      "version": "0.16.7",
+      "resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.7.tgz",
+      "integrity": "sha512-/zUx+yOsIrG4Y43Eh2peDeKCxlRt/gET6aHfaKpuq267qXdYDFViVHfMaLyygZOnl0kGWxFIgsBy8QFuTLUXEQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@humanfs/core": "^0.19.1",
+        "@humanwhocodes/retry": "^0.4.0"
+      },
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanwhocodes/module-importer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
+      "integrity": "sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=12.22"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
+    "node_modules/@humanwhocodes/retry": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.3.tgz",
+      "integrity": "sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
     "node_modules/@iconify-json/simple-icons": {
-      "version": "1.2.63",
-      "resolved": "https://registry.npmjs.org/@iconify-json/simple-icons/-/simple-icons-1.2.63.tgz",
-      "integrity": "sha512-xZl2UWCwE58VlqZ+pDPmaUhE2tq8MVSTJRr4/9nzzHlDdjJ0Ud1VxNXPrwTSgESKY29iCQw3S0r2nJTSNNngHw==",
+      "version": "1.2.65",
+      "resolved": "https://registry.npmjs.org/@iconify-json/simple-icons/-/simple-icons-1.2.65.tgz",
+      "integrity": "sha512-v/O0UeqrDz6ASuRVE5g2Puo5aWyej4M/CxX6WYDBARgswwxK0mp3VQbGgPFEAAUU9QN02IjTgjMuO021gpWf2w==",
       "dev": true,
       "license": "CC0-1.0",
       "dependencies": {
@@ -1793,497 +1973,6 @@
         "mlly": "^1.8.0"
       }
     },
-    "node_modules/@img/colour": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@img/colour/-/colour-1.0.0.tgz",
-      "integrity": "sha512-A5P/LfWGFSl6nsckYtjw9da+19jB8hkJ6ACTGcDfEJ0aE+l2n2El7dsVM7UVHZQ9s2lmYMWlrS21YLy2IR1LUw==",
-      "license": "MIT",
-      "optional": true,
-      "peer": true,
-      "engines": {
-        "node": ">=18"
-      }
-    },
-    "node_modules/@img/sharp-darwin-arm64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-arm64/-/sharp-darwin-arm64-0.34.5.tgz",
-      "integrity": "sha512-imtQ3WMJXbMY4fxb/Ndp6HBTNVtWCUI0WdobyheGf5+ad6xX8VIDO8u2xE4qc/fr08CKG/7dDseFtn6M6g/r3w==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-darwin-arm64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-darwin-x64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-darwin-x64/-/sharp-darwin-x64-0.34.5.tgz",
-      "integrity": "sha512-YNEFAF/4KQ/PeW0N+r+aVVsoIY0/qxxikF2SWdp+NRkmMB7y9LBZAVqQ4yhGCm/H3H270OSykqmQMKLBhBJDEw==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-darwin-x64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-libvips-darwin-arm64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-arm64/-/sharp-libvips-darwin-arm64-1.2.4.tgz",
-      "integrity": "sha512-zqjjo7RatFfFoP0MkQ51jfuFZBnVE2pRiaydKJ1G/rHZvnsrHAOcQALIi9sA5co5xenQdTugCvtb1cuf78Vf4g==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-darwin-x64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-darwin-x64/-/sharp-libvips-darwin-x64-1.2.4.tgz",
-      "integrity": "sha512-1IOd5xfVhlGwX+zXv2N93k0yMONvUlANylbJw1eTah8K/Jtpi15KC+WSiaX/nBmbm2HxRM1gZ0nSdjSsrZbGKg==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "darwin"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-arm": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm/-/sharp-libvips-linux-arm-1.2.4.tgz",
-      "integrity": "sha512-bFI7xcKFELdiNCVov8e44Ia4u2byA+l3XtsAj+Q8tfCwO6BQ8iDojYdvoPMqsKDkuoOo+X6HZA0s0q11ANMQ8A==",
-      "cpu": [
-        "arm"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-arm64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-arm64/-/sharp-libvips-linux-arm64-1.2.4.tgz",
-      "integrity": "sha512-excjX8DfsIcJ10x1Kzr4RcWe1edC9PquDRRPx3YVCvQv+U5p7Yin2s32ftzikXojb1PIFc/9Mt28/y+iRklkrw==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-ppc64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-ppc64/-/sharp-libvips-linux-ppc64-1.2.4.tgz",
-      "integrity": "sha512-FMuvGijLDYG6lW+b/UvyilUWu5Ayu+3r2d1S8notiGCIyYU/76eig1UfMmkZ7vwgOrzKzlQbFSuQfgm7GYUPpA==",
-      "cpu": [
-        "ppc64"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-riscv64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-riscv64/-/sharp-libvips-linux-riscv64-1.2.4.tgz",
-      "integrity": "sha512-oVDbcR4zUC0ce82teubSm+x6ETixtKZBh/qbREIOcI3cULzDyb18Sr/Wcyx7NRQeQzOiHTNbZFF1UwPS2scyGA==",
-      "cpu": [
-        "riscv64"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-s390x": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-s390x/-/sharp-libvips-linux-s390x-1.2.4.tgz",
-      "integrity": "sha512-qmp9VrzgPgMoGZyPvrQHqk02uyjA0/QrTO26Tqk6l4ZV0MPWIW6LTkqOIov+J1yEu7MbFQaDpwdwJKhbJvuRxQ==",
-      "cpu": [
-        "s390x"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linux-x64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linux-x64/-/sharp-libvips-linux-x64-1.2.4.tgz",
-      "integrity": "sha512-tJxiiLsmHc9Ax1bz3oaOYBURTXGIRDODBqhveVHonrHJ9/+k89qbLl0bcJns+e4t4rvaNBxaEZsFtSfAdquPrw==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linuxmusl-arm64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-arm64/-/sharp-libvips-linuxmusl-arm64-1.2.4.tgz",
-      "integrity": "sha512-FVQHuwx1IIuNow9QAbYUzJ+En8KcVm9Lk5+uGUQJHaZmMECZmOlix9HnH7n1TRkXMS0pGxIJokIVB9SuqZGGXw==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-libvips-linuxmusl-x64": {
-      "version": "1.2.4",
-      "resolved": "https://registry.npmjs.org/@img/sharp-libvips-linuxmusl-x64/-/sharp-libvips-linuxmusl-x64-1.2.4.tgz",
-      "integrity": "sha512-+LpyBk7L44ZIXwz/VYfglaX/okxezESc6UxDSoyo2Ks6Jxc4Y7sGjpgU9s4PMgqgjj1gZCylTieNamqA1MF7Dg==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-linux-arm": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm/-/sharp-linux-arm-0.34.5.tgz",
-      "integrity": "sha512-9dLqsvwtg1uuXBGZKsxem9595+ujv0sJ6Vi8wcTANSFpwV/GONat5eCkzQo/1O6zRIkh0m/8+5BjrRr7jDUSZw==",
-      "cpu": [
-        "arm"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-arm": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-arm64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-arm64/-/sharp-linux-arm64-0.34.5.tgz",
-      "integrity": "sha512-bKQzaJRY/bkPOXyKx5EVup7qkaojECG6NLYswgktOZjaXecSAeCWiZwwiFf3/Y+O1HrauiE3FVsGxFg8c24rZg==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-arm64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-ppc64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-ppc64/-/sharp-linux-ppc64-0.34.5.tgz",
-      "integrity": "sha512-7zznwNaqW6YtsfrGGDA6BRkISKAAE1Jo0QdpNYXNMHu2+0dTrPflTLNkpc8l7MUP5M16ZJcUvysVWWrMefZquA==",
-      "cpu": [
-        "ppc64"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-ppc64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-riscv64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-riscv64/-/sharp-linux-riscv64-0.34.5.tgz",
-      "integrity": "sha512-51gJuLPTKa7piYPaVs8GmByo7/U7/7TZOq+cnXJIHZKavIRHAP77e3N2HEl3dgiqdD/w0yUfiJnII77PuDDFdw==",
-      "cpu": [
-        "riscv64"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-riscv64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-s390x": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-s390x/-/sharp-linux-s390x-0.34.5.tgz",
-      "integrity": "sha512-nQtCk0PdKfho3eC5MrbQoigJ2gd1CgddUMkabUj+rBevs8tZ2cULOx46E7oyX+04WGfABgIwmMC0VqieTiR4jg==",
-      "cpu": [
-        "s390x"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-s390x": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linux-x64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linux-x64/-/sharp-linux-x64-0.34.5.tgz",
-      "integrity": "sha512-MEzd8HPKxVxVenwAa+JRPwEC7QFjoPWuS5NZnBt6B3pu7EG2Ge0id1oLHZpPJdn3OQK+BQDiw9zStiHBTJQQQQ==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linux-x64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linuxmusl-arm64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-arm64/-/sharp-linuxmusl-arm64-0.34.5.tgz",
-      "integrity": "sha512-fprJR6GtRsMt6Kyfq44IsChVZeGN97gTD331weR1ex1c1rypDEABN6Tm2xa1wE6lYb5DdEnk03NZPqA7Id21yg==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linuxmusl-arm64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-linuxmusl-x64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-linuxmusl-x64/-/sharp-linuxmusl-x64-0.34.5.tgz",
-      "integrity": "sha512-Jg8wNT1MUzIvhBFxViqrEhWDGzqymo3sV7z7ZsaWbZNDLXRJZoRGrjulp60YYtV4wfY8VIKcWidjojlLcWrd8Q==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "Apache-2.0",
-      "optional": true,
-      "os": [
-        "linux"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-libvips-linuxmusl-x64": "1.2.4"
-      }
-    },
-    "node_modules/@img/sharp-wasm32": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-wasm32/-/sharp-wasm32-0.34.5.tgz",
-      "integrity": "sha512-OdWTEiVkY2PHwqkbBI8frFxQQFekHaSSkUIJkwzclWZe64O1X4UlUjqqqLaPbUpMOQk6FBu/HtlGXNblIs0huw==",
-      "cpu": [
-        "wasm32"
-      ],
-      "license": "Apache-2.0 AND LGPL-3.0-or-later AND MIT",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "@emnapi/runtime": "^1.7.0"
-      },
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-win32-arm64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-arm64/-/sharp-win32-arm64-0.34.5.tgz",
-      "integrity": "sha512-WQ3AgWCWYSb2yt+IG8mnC6Jdk9Whs7O0gxphblsLvdhSpSTtmu69ZG1Gkb6NuvxsNACwiPV6cNSZNzt0KPsw7g==",
-      "cpu": [
-        "arm64"
-      ],
-      "license": "Apache-2.0 AND LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-win32-ia32": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-ia32/-/sharp-win32-ia32-0.34.5.tgz",
-      "integrity": "sha512-FV9m/7NmeCmSHDD5j4+4pNI8Cp3aW+JvLoXcTUo0IqyjSfAZJ8dIUmijx1qaJsIiU+Hosw6xM5KijAWRJCSgNg==",
-      "cpu": [
-        "ia32"
-      ],
-      "license": "Apache-2.0 AND LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
-    "node_modules/@img/sharp-win32-x64": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/@img/sharp-win32-x64/-/sharp-win32-x64-0.34.5.tgz",
-      "integrity": "sha512-+29YMsqY2/9eFEiW93eqWnuLcWcufowXewwSNIT6UwZdUUCrM3oFjMWH/Z6/TMmb4hlFenmfAVbpWeup2jryCw==",
-      "cpu": [
-        "x64"
-      ],
-      "license": "Apache-2.0 AND LGPL-3.0-or-later",
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "peer": true,
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      }
-    },
     "node_modules/@isaacs/cliui": {
       "version": "8.0.2",
       "resolved": "https://registry.npmjs.org/@isaacs/cliui/-/cliui-8.0.2.tgz",
@@ -2396,9 +2085,9 @@
       }
     },
     "node_modules/@napi-rs/canvas": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas/-/canvas-0.1.86.tgz",
-      "integrity": "sha512-hOkywnrkdFdVpsuaNsZWfEY7kc96eROV2DuMTTvGF15AZfwobzdG2w0eDlU5UBx3Lg/XlWUnqVT5zLUWyo5h6A==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas/-/canvas-0.1.88.tgz",
+      "integrity": "sha512-/p08f93LEbsL5mDZFQ3DBxcPv/I4QG9EDYRRq1WNlCOXVfAHBTHMSVMwxlqG/AtnSfUr9+vgfN7MKiyDo0+Weg==",
       "license": "MIT",
       "optional": true,
       "workspaces": [
@@ -2412,23 +2101,23 @@
         "url": "https://github.com/sponsors/Brooooooklyn"
       },
       "optionalDependencies": {
-        "@napi-rs/canvas-android-arm64": "0.1.86",
-        "@napi-rs/canvas-darwin-arm64": "0.1.86",
-        "@napi-rs/canvas-darwin-x64": "0.1.86",
-        "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.86",
-        "@napi-rs/canvas-linux-arm64-gnu": "0.1.86",
-        "@napi-rs/canvas-linux-arm64-musl": "0.1.86",
-        "@napi-rs/canvas-linux-riscv64-gnu": "0.1.86",
-        "@napi-rs/canvas-linux-x64-gnu": "0.1.86",
-        "@napi-rs/canvas-linux-x64-musl": "0.1.86",
-        "@napi-rs/canvas-win32-arm64-msvc": "0.1.86",
-        "@napi-rs/canvas-win32-x64-msvc": "0.1.86"
+        "@napi-rs/canvas-android-arm64": "0.1.88",
+        "@napi-rs/canvas-darwin-arm64": "0.1.88",
+        "@napi-rs/canvas-darwin-x64": "0.1.88",
+        "@napi-rs/canvas-linux-arm-gnueabihf": "0.1.88",
+        "@napi-rs/canvas-linux-arm64-gnu": "0.1.88",
+        "@napi-rs/canvas-linux-arm64-musl": "0.1.88",
+        "@napi-rs/canvas-linux-riscv64-gnu": "0.1.88",
+        "@napi-rs/canvas-linux-x64-gnu": "0.1.88",
+        "@napi-rs/canvas-linux-x64-musl": "0.1.88",
+        "@napi-rs/canvas-win32-arm64-msvc": "0.1.88",
+        "@napi-rs/canvas-win32-x64-msvc": "0.1.88"
       }
     },
     "node_modules/@napi-rs/canvas-android-arm64": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-android-arm64/-/canvas-android-arm64-0.1.86.tgz",
-      "integrity": "sha512-IjkZFKUr6GzMzzrawJaN3v+yY3Fvpa71e0DcbePfxWelFKnESIir+XUcdAbim29JOd0JE0/hQJdfUCb5t/Fjrw==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-android-arm64/-/canvas-android-arm64-0.1.88.tgz",
+      "integrity": "sha512-KEaClPnZuVxJ8smUWjV1wWFkByBO/D+vy4lN+Dm5DFH514oqwukxKGeck9xcKJhaWJGjfruGmYGiwRe//+/zQQ==",
       "cpu": [
         "arm64"
       ],
@@ -2446,9 +2135,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-darwin-arm64": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-arm64/-/canvas-darwin-arm64-0.1.86.tgz",
-      "integrity": "sha512-PUCxDq0wSSJbtaOqoKj3+t5tyDbtxWumziOTykdn3T839hu6koMaBFpGk9lXpsGaPNgyFpPqjxhtsPljBGnDHg==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-arm64/-/canvas-darwin-arm64-0.1.88.tgz",
+      "integrity": "sha512-Xgywz0dDxOKSgx3eZnK85WgGMmGrQEW7ZLA/E7raZdlEE+xXCozobgqz2ZvYigpB6DJFYkqnwHjqCOTSDGlFdg==",
       "cpu": [
         "arm64"
       ],
@@ -2466,9 +2155,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-darwin-x64": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-x64/-/canvas-darwin-x64-0.1.86.tgz",
-      "integrity": "sha512-rlCFLv4Rrg45qFZq7mysrKnsUbMhwdNg3YPuVfo9u4RkOqm7ooAJvdyDFxiqfSsJJTqupYqa9VQCUt8WKxKhNQ==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-darwin-x64/-/canvas-darwin-x64-0.1.88.tgz",
+      "integrity": "sha512-Yz4wSCIQOUgNucgk+8NFtQxQxZV5NO8VKRl9ePKE6XoNyNVC8JDqtvhh3b3TPqKK8W5p2EQpAr1rjjm0mfBxdg==",
       "cpu": [
         "x64"
       ],
@@ -2486,9 +2175,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm-gnueabihf": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm-gnueabihf/-/canvas-linux-arm-gnueabihf-0.1.86.tgz",
-      "integrity": "sha512-6xWwyMc9BlDBt+9XHN/GzUo3MozHta/2fxQHMb80x0K2zpZuAdDKUYHmYzx9dFWDY3SbPYnx6iRlQl6wxnwS1w==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm-gnueabihf/-/canvas-linux-arm-gnueabihf-0.1.88.tgz",
+      "integrity": "sha512-9gQM2SlTo76hYhxHi2XxWTAqpTOb+JtxMPEIr+H5nAhHhyEtNmTSDRtz93SP7mGd2G3Ojf2oF5tP9OdgtgXyKg==",
       "cpu": [
         "arm"
       ],
@@ -2506,9 +2195,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm64-gnu": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-gnu/-/canvas-linux-arm64-gnu-0.1.86.tgz",
-      "integrity": "sha512-r2OX3w50xHxrToTovOSQWwkVfSq752CUzH9dzlVXyr8UDKFV8dMjfa9hePXvAJhN3NBp4TkHcGx15QCdaCIwnA==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-gnu/-/canvas-linux-arm64-gnu-0.1.88.tgz",
+      "integrity": "sha512-7qgaOBMXuVRk9Fzztzr3BchQKXDxGbY+nwsovD3I/Sx81e+sX0ReEDYHTItNb0Je4NHbAl7D0MKyd4SvUc04sg==",
       "cpu": [
         "arm64"
       ],
@@ -2526,9 +2215,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-arm64-musl": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-musl/-/canvas-linux-arm64-musl-0.1.86.tgz",
-      "integrity": "sha512-jbXuh8zVFUPw6a9SGpgc6EC+fRbGGyP1NFfeQiVqGLs6bN93ROtPLPL6MH9Bp6yt0CXUFallk2vgKdWDbmW+bw==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-arm64-musl/-/canvas-linux-arm64-musl-0.1.88.tgz",
+      "integrity": "sha512-kYyNrUsHLkoGHBc77u4Unh067GrfiCUMbGHC2+OTxbeWfZkPt2o32UOQkhnSswKd9Fko/wSqqGkY956bIUzruA==",
       "cpu": [
         "arm64"
       ],
@@ -2546,9 +2235,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-riscv64-gnu": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-riscv64-gnu/-/canvas-linux-riscv64-gnu-0.1.86.tgz",
-      "integrity": "sha512-9IwHR2qbq2HceM9fgwyL7x37Jy3ptt1uxvikQEuWR0FisIx9QEdt7F3huljCky76aoouF2vSd0R2fHo3ESRoPw==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-riscv64-gnu/-/canvas-linux-riscv64-gnu-0.1.88.tgz",
+      "integrity": "sha512-HVuH7QgzB0yavYdNZDRyAsn/ejoXB0hn8twwFnOqUbCCdkV+REna7RXjSR7+PdfW0qMQ2YYWsLvVBT5iL/mGpw==",
       "cpu": [
         "riscv64"
       ],
@@ -2566,9 +2255,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-x64-gnu": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-gnu/-/canvas-linux-x64-gnu-0.1.86.tgz",
-      "integrity": "sha512-Jor+rhRN6ubix+D2QkNn9XlPPVAYl+2qFrkZ4oZN9UgtqIUZ+n+HljxhlkkDFRaX1mlxXOXPQjxaZg17zDSFcQ==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-gnu/-/canvas-linux-x64-gnu-0.1.88.tgz",
+      "integrity": "sha512-hvcvKIcPEQrvvJtJnwD35B3qk6umFJ8dFIr8bSymfrSMem0EQsfn1ztys8ETIFndTwdNWJKWluvxztA41ivsEw==",
       "cpu": [
         "x64"
       ],
@@ -2586,9 +2275,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-linux-x64-musl": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-musl/-/canvas-linux-x64-musl-0.1.86.tgz",
-      "integrity": "sha512-A28VTy91DbclopSGZ2tIon3p8hcVI1JhnNpDpJ5N9rYlUnVz1WQo4waEMh+FICTZF07O3coxBNZc4Vu4doFw7A==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-linux-x64-musl/-/canvas-linux-x64-musl-0.1.88.tgz",
+      "integrity": "sha512-eSMpGYY2xnZSQ6UxYJ6plDboxq4KeJ4zT5HaVkUnbObNN6DlbJe0Mclh3wifAmquXfrlgTZt6zhHsUgz++AK6g==",
       "cpu": [
         "x64"
       ],
@@ -2606,9 +2295,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-win32-arm64-msvc": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-arm64-msvc/-/canvas-win32-arm64-msvc-0.1.86.tgz",
-      "integrity": "sha512-q6G1YXUt3gBCAS2bcDMCaBL4y20di8eVVBi1XhjUqZSVyZZxxwIuRQHy31NlPJUCMiyNiMuc6zeI0uqgkWwAmA==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-arm64-msvc/-/canvas-win32-arm64-msvc-0.1.88.tgz",
+      "integrity": "sha512-qcIFfEgHrchyYqRrxsCeTQgpJZ/GqHiqPcU/Fvw/ARVlQeDX1VyFH+X+0gCR2tca6UJrq96vnW+5o7buCq+erA==",
       "cpu": [
         "arm64"
       ],
@@ -2626,9 +2315,9 @@
       }
     },
     "node_modules/@napi-rs/canvas-win32-x64-msvc": {
-      "version": "0.1.86",
-      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-x64-msvc/-/canvas-win32-x64-msvc-0.1.86.tgz",
-      "integrity": "sha512-X0g46uRVgnvCM1cOjRXAOSFSG63ktUFIf/TIfbKCUc7QpmYUcHmSP9iR6DGOYfk+SggLsXoJCIhPTotYeZEAmg==",
+      "version": "0.1.88",
+      "resolved": "https://registry.npmjs.org/@napi-rs/canvas-win32-x64-msvc/-/canvas-win32-x64-msvc-0.1.88.tgz",
+      "integrity": "sha512-ROVqbfS4QyZxYkqmaIBBpbz/BQvAR+05FXM5PAtTYVc0uyY8Y4BHJSMdGAaMf6TdIVRsQsiq+FG/dH9XhvWCFQ==",
       "cpu": [
         "x64"
       ],
@@ -2761,10 +2450,23 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@rollup/pluginutils/node_modules/picomatch": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
     "node_modules/@rollup/rollup-android-arm-eabi": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.54.0.tgz",
-      "integrity": "sha512-OywsdRHrFvCdvsewAInDKCNyR3laPA2mc9bRYJ6LBp5IyvF3fvXbbNR0bSzHlZVFtn6E0xw2oZlyjg4rKCVcng==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.55.1.tgz",
+      "integrity": "sha512-9R0DM/ykwfGIlNu6+2U09ga0WXeZ9MRC2Ter8jnz8415VbuIykVuc6bhdrbORFZANDmTDvq26mJrEVTl8TdnDg==",
       "cpu": [
         "arm"
       ],
@@ -2775,9 +2477,9 @@
       ]
     },
     "node_modules/@rollup/rollup-android-arm64": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.54.0.tgz",
-      "integrity": "sha512-Skx39Uv+u7H224Af+bDgNinitlmHyQX1K/atIA32JP3JQw6hVODX5tkbi2zof/E69M1qH2UoN3Xdxgs90mmNYw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.55.1.tgz",
+      "integrity": "sha512-eFZCb1YUqhTysgW3sj/55du5cG57S7UTNtdMjCW7LwVcj3dTTcowCsC8p7uBdzKsZYa8J7IDE8lhMI+HX1vQvg==",
       "cpu": [
         "arm64"
       ],
@@ -2788,9 +2490,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-arm64": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.54.0.tgz",
-      "integrity": "sha512-k43D4qta/+6Fq+nCDhhv9yP2HdeKeP56QrUUTW7E6PhZP1US6NDqpJj4MY0jBHlJivVJD5P8NxrjuobZBJTCRw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.55.1.tgz",
+      "integrity": "sha512-p3grE2PHcQm2e8PSGZdzIhCKbMCw/xi9XvMPErPhwO17vxtvCN5FEA2mSLgmKlCjHGMQTP6phuQTYWUnKewwGg==",
       "cpu": [
         "arm64"
       ],
@@ -2801,9 +2503,9 @@
       ]
     },
     "node_modules/@rollup/rollup-darwin-x64": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.54.0.tgz",
-      "integrity": "sha512-cOo7biqwkpawslEfox5Vs8/qj83M/aZCSSNIWpVzfU2CYHa2G3P1UN5WF01RdTHSgCkri7XOlTdtk17BezlV3A==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.55.1.tgz",
+      "integrity": "sha512-rDUjG25C9qoTm+e02Esi+aqTKSBYwVTaoS1wxcN47/Luqef57Vgp96xNANwt5npq9GDxsH7kXxNkJVEsWEOEaQ==",
       "cpu": [
         "x64"
       ],
@@ -2814,9 +2516,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-arm64": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.54.0.tgz",
-      "integrity": "sha512-miSvuFkmvFbgJ1BevMa4CPCFt5MPGw094knM64W9I0giUIMMmRYcGW/JWZDriaw/k1kOBtsWh1z6nIFV1vPNtA==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.55.1.tgz",
+      "integrity": "sha512-+JiU7Jbp5cdxekIgdte0jfcu5oqw4GCKr6i3PJTlXTCU5H5Fvtkpbs4XJHRmWNXF+hKmn4v7ogI5OQPaupJgOg==",
       "cpu": [
         "arm64"
       ],
@@ -2827,9 +2529,9 @@
       ]
     },
     "node_modules/@rollup/rollup-freebsd-x64": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.54.0.tgz",
-      "integrity": "sha512-KGXIs55+b/ZfZsq9aR026tmr/+7tq6VG6MsnrvF4H8VhwflTIuYh+LFUlIsRdQSgrgmtM3fVATzEAj4hBQlaqQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.55.1.tgz",
+      "integrity": "sha512-V5xC1tOVWtLLmr3YUk2f6EJK4qksksOYiz/TCsFHu/R+woubcLWdC9nZQmwjOAbmExBIVKsm1/wKmEy4z4u4Bw==",
       "cpu": [
         "x64"
       ],
@@ -2840,9 +2542,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.54.0.tgz",
-      "integrity": "sha512-EHMUcDwhtdRGlXZsGSIuXSYwD5kOT9NVnx9sqzYiwAc91wfYOE1g1djOEDseZJKKqtHAHGwnGPQu3kytmfaXLQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.55.1.tgz",
+      "integrity": "sha512-Rn3n+FUk2J5VWx+ywrG/HGPTD9jXNbicRtTM11e/uorplArnXZYsVifnPPqNNP5BsO3roI4n8332ukpY/zN7rQ==",
       "cpu": [
         "arm"
       ],
@@ -2853,9 +2555,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm-musleabihf": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.54.0.tgz",
-      "integrity": "sha512-+pBrqEjaakN2ySv5RVrj/qLytYhPKEUwk+e3SFU5jTLHIcAtqh2rLrd/OkbNuHJpsBgxsD8ccJt5ga/SeG0JmA==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.55.1.tgz",
+      "integrity": "sha512-grPNWydeKtc1aEdrJDWk4opD7nFtQbMmV7769hiAaYyUKCT1faPRm2av8CX1YJsZ4TLAZcg9gTR1KvEzoLjXkg==",
       "cpu": [
         "arm"
       ],
@@ -2866,9 +2568,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-gnu": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.54.0.tgz",
-      "integrity": "sha512-NSqc7rE9wuUaRBsBp5ckQ5CVz5aIRKCwsoa6WMF7G01sX3/qHUw/z4pv+D+ahL1EIKy6Enpcnz1RY8pf7bjwng==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.55.1.tgz",
+      "integrity": "sha512-a59mwd1k6x8tXKcUxSyISiquLwB5pX+fJW9TkWU46lCqD/GRDe9uDN31jrMmVP3feI3mhAdvcCClhV8V5MhJFQ==",
       "cpu": [
         "arm64"
       ],
@@ -2879,9 +2581,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-arm64-musl": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.54.0.tgz",
-      "integrity": "sha512-gr5vDbg3Bakga5kbdpqx81m2n9IX8M6gIMlQQIXiLTNeQW6CucvuInJ91EuCJ/JYvc+rcLLsDFcfAD1K7fMofg==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.55.1.tgz",
+      "integrity": "sha512-puS1MEgWX5GsHSoiAsF0TYrpomdvkaXm0CofIMG5uVkP6IBV+ZO9xhC5YEN49nsgYo1DuuMquF9+7EDBVYu4uA==",
       "cpu": [
         "arm64"
       ],
@@ -2892,9 +2594,22 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-loong64-gnu": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.54.0.tgz",
-      "integrity": "sha512-gsrtB1NA3ZYj2vq0Rzkylo9ylCtW/PhpLEivlgWe0bpgtX5+9j9EZa0wtZiCjgu6zmSeZWyI/e2YRX1URozpIw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.55.1.tgz",
+      "integrity": "sha512-r3Wv40in+lTsULSb6nnoudVbARdOwb2u5fpeoOAZjFLznp6tDU8kd+GTHmJoqZ9lt6/Sys33KdIHUaQihFcu7g==",
+      "cpu": [
+        "loong64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-musl": {
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.55.1.tgz",
+      "integrity": "sha512-MR8c0+UxAlB22Fq4R+aQSPBayvYa3+9DrwG/i1TKQXFYEaoW3B5b/rkSRIypcZDdWjWnpcvxbNaAJDcSbJU3Lw==",
       "cpu": [
         "loong64"
       ],
@@ -2905,9 +2620,22 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-ppc64-gnu": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.54.0.tgz",
-      "integrity": "sha512-y3qNOfTBStmFNq+t4s7Tmc9hW2ENtPg8FeUD/VShI7rKxNW7O4fFeaYbMsd3tpFlIg1Q8IapFgy7Q9i2BqeBvA==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.55.1.tgz",
+      "integrity": "sha512-3KhoECe1BRlSYpMTeVrD4sh2Pw2xgt4jzNSZIIPLFEsnQn9gAnZagW9+VqDqAHgm1Xc77LzJOo2LdigS5qZ+gw==",
+      "cpu": [
+        "ppc64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-musl": {
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.55.1.tgz",
+      "integrity": "sha512-ziR1OuZx0vdYZZ30vueNZTg73alF59DicYrPViG0NEgDVN8/Jl87zkAPu4u6VjZST2llgEUjaiNl9JM6HH1Vdw==",
       "cpu": [
         "ppc64"
       ],
@@ -2918,9 +2646,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-gnu": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.54.0.tgz",
-      "integrity": "sha512-89sepv7h2lIVPsFma8iwmccN7Yjjtgz0Rj/Ou6fEqg3HDhpCa+Et+YSufy27i6b0Wav69Qv4WBNl3Rs6pwhebQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.55.1.tgz",
+      "integrity": "sha512-uW0Y12ih2XJRERZ4jAfKamTyIHVMPQnTZcQjme2HMVDAHY4amf5u414OqNYC+x+LzRdRcnIG1YodLrrtA8xsxw==",
       "cpu": [
         "riscv64"
       ],
@@ -2931,9 +2659,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-riscv64-musl": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.54.0.tgz",
-      "integrity": "sha512-ZcU77ieh0M2Q8Ur7D5X7KvK+UxbXeDHwiOt/CPSBTI1fBmeDMivW0dPkdqkT4rOgDjrDDBUed9x4EgraIKoR2A==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.55.1.tgz",
+      "integrity": "sha512-u9yZ0jUkOED1BFrqu3BwMQoixvGHGZ+JhJNkNKY/hyoEgOwlqKb62qu+7UjbPSHYjiVy8kKJHvXKv5coH4wDeg==",
       "cpu": [
         "riscv64"
       ],
@@ -2944,9 +2672,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-s390x-gnu": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.54.0.tgz",
-      "integrity": "sha512-2AdWy5RdDF5+4YfG/YesGDDtbyJlC9LHmL6rZw6FurBJ5n4vFGupsOBGfwMRjBYH7qRQowT8D/U4LoSvVwOhSQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.55.1.tgz",
+      "integrity": "sha512-/0PenBCmqM4ZUd0190j7J0UsQ/1nsi735iPRakO8iPciE7BQ495Y6msPzaOmvx0/pn+eJVVlZrNrSh4WSYLxNg==",
       "cpu": [
         "s390x"
       ],
@@ -2957,9 +2685,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-gnu": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.54.0.tgz",
-      "integrity": "sha512-WGt5J8Ij/rvyqpFexxk3ffKqqbLf9AqrTBbWDk7ApGUzaIs6V+s2s84kAxklFwmMF/vBNGrVdYgbblCOFFezMQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.55.1.tgz",
+      "integrity": "sha512-a8G4wiQxQG2BAvo+gU6XrReRRqj+pLS2NGXKm8io19goR+K8lw269eTrPkSdDTALwMmJp4th2Uh0D8J9bEV1vg==",
       "cpu": [
         "x64"
       ],
@@ -2970,9 +2698,9 @@
       ]
     },
     "node_modules/@rollup/rollup-linux-x64-musl": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.54.0.tgz",
-      "integrity": "sha512-JzQmb38ATzHjxlPHuTH6tE7ojnMKM2kYNzt44LO/jJi8BpceEC8QuXYA908n8r3CNuG/B3BV8VR3Hi1rYtmPiw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.55.1.tgz",
+      "integrity": "sha512-bD+zjpFrMpP/hqkfEcnjXWHMw5BIghGisOKPj+2NaNDuVT+8Ds4mPf3XcPHuat1tz89WRL+1wbcxKY3WSbiT7w==",
       "cpu": [
         "x64"
       ],
@@ -2982,10 +2710,23 @@
         "linux"
       ]
     },
+    "node_modules/@rollup/rollup-openbsd-x64": {
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.55.1.tgz",
+      "integrity": "sha512-eLXw0dOiqE4QmvikfQ6yjgkg/xDM+MdU9YJuP4ySTibXU0oAvnEWXt7UDJmD4UkYialMfOGFPJnIHSe/kdzPxg==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ]
+    },
     "node_modules/@rollup/rollup-openharmony-arm64": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.54.0.tgz",
-      "integrity": "sha512-huT3fd0iC7jigGh7n3q/+lfPcXxBi+om/Rs3yiFxjvSxbSB6aohDFXbWvlspaqjeOh+hx7DDHS+5Es5qRkWkZg==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.55.1.tgz",
+      "integrity": "sha512-xzm44KgEP11te3S2HCSyYf5zIzWmx3n8HDCc7EE59+lTcswEWNpvMLfd9uJvVX8LCg9QWG67Xt75AuHn4vgsXw==",
       "cpu": [
         "arm64"
       ],
@@ -2996,9 +2737,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-arm64-msvc": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.54.0.tgz",
-      "integrity": "sha512-c2V0W1bsKIKfbLMBu/WGBz6Yci8nJ/ZJdheE0EwB73N3MvHYKiKGs3mVilX4Gs70eGeDaMqEob25Tw2Gb9Nqyw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.55.1.tgz",
+      "integrity": "sha512-yR6Bl3tMC/gBok5cz/Qi0xYnVbIxGx5Fcf/ca0eB6/6JwOY+SRUcJfI0OpeTpPls7f194as62thCt/2BjxYN8g==",
       "cpu": [
         "arm64"
       ],
@@ -3009,9 +2750,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-ia32-msvc": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.54.0.tgz",
-      "integrity": "sha512-woEHgqQqDCkAzrDhvDipnSirm5vxUXtSKDYTVpZG3nUdW/VVB5VdCYA2iReSj/u3yCZzXID4kuKG7OynPnB3WQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.55.1.tgz",
+      "integrity": "sha512-3fZBidchE0eY0oFZBnekYCfg+5wAB0mbpCBuofh5mZuzIU/4jIVkbESmd2dOsFNS78b53CYv3OAtwqkZZmU5nA==",
       "cpu": [
         "ia32"
       ],
@@ -3022,9 +2763,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-gnu": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.54.0.tgz",
-      "integrity": "sha512-dzAc53LOuFvHwbCEOS0rPbXp6SIhAf2txMP5p6mGyOXXw5mWY8NGGbPMPrs4P1WItkfApDathBj/NzMLUZ9rtQ==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.55.1.tgz",
+      "integrity": "sha512-xGGY5pXj69IxKb4yv/POoocPy/qmEGhimy/FoTpTSVju3FYXUQQMFCaZZXJVidsmGxRioZAwpThl/4zX41gRKg==",
       "cpu": [
         "x64"
       ],
@@ -3035,9 +2776,9 @@
       ]
     },
     "node_modules/@rollup/rollup-win32-x64-msvc": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.54.0.tgz",
-      "integrity": "sha512-hYT5d3YNdSh3mbCU1gwQyPgQd3T2ne0A3KG8KSBdav5TiBg6eInVmV+TeR5uHufiIgSFg0XsOWGW5/RhNcSvPg==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.55.1.tgz",
+      "integrity": "sha512-SPEpaL6DX4rmcXtnhdrQYgzQ5W2uW3SCJch88lB2zImhJRhIIK44fkUrgIV/Q8yUNfw5oyZ5vkeQsZLhCb06lw==",
       "cpu": [
         "x64"
       ],
@@ -3139,15 +2880,14 @@
       "resolved": "https://registry.npmjs.org/@sveltejs/acorn-typescript/-/acorn-typescript-1.0.8.tgz",
       "integrity": "sha512-esgN+54+q0NjB0Y/4BomT9samII7jGwNy/2a3wNZbT2A2RpmXsXwUt24LvLhx6jUq2gVk4cWEvcRO6MFQbOfNA==",
       "license": "MIT",
-      "peer": true,
       "peerDependencies": {
         "acorn": "^8.9.0"
       }
     },
     "node_modules/@swc/helpers": {
-      "version": "0.5.17",
-      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.17.tgz",
-      "integrity": "sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A==",
+      "version": "0.5.18",
+      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.18.tgz",
+      "integrity": "sha512-TXTnIcNJQEKwThMMqBXsZ4VGAza6bvN4pa41Rkqoio6QBKMvo+5lexeTMScGCIxtzgQJzElcvIltani+adC5PQ==",
       "license": "Apache-2.0",
       "dependencies": {
         "tslib": "^2.8.0"
@@ -3763,6 +3503,13 @@
         "html2canvas": "*"
       }
     },
+    "node_modules/@types/json-schema": {
+      "version": "7.0.15",
+      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
+      "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/@types/linkify-it": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/@types/linkify-it/-/linkify-it-5.0.0.tgz",
@@ -3774,6 +3521,7 @@
       "resolved": "https://registry.npmjs.org/@types/markdown-it/-/markdown-it-14.1.2.tgz",
       "integrity": "sha512-promo4eFwuiW+TfGxhi+0x3czqTYJkG8qB17ZUJiVF10Xm7NLVRSLUsfRTU/6h1e24VvRnXCx+hG7li58lkzog==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/linkify-it": "^5",
         "@types/mdurl": "^2"
@@ -3804,6 +3552,15 @@
         "undici-types": "~7.16.0"
       }
     },
+    "node_modules/@types/node-forge": {
+      "version": "1.3.14",
+      "resolved": "https://registry.npmjs.org/@types/node-forge/-/node-forge-1.3.14.tgz",
+      "integrity": "sha512-mhVF2BnD4BO+jtOp7z1CdzaK4mbuK0LLQYAvdOLqHTavxFNq4zA1EmYkpnFjP8HOUzedfQkRnp0E2ulSAYSzAw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/node": "*"
+      }
+    },
     "node_modules/@types/pako": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/@types/pako/-/pako-2.0.4.tgz",
@@ -3874,6 +3631,263 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@typescript-eslint/eslint-plugin": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.51.0.tgz",
+      "integrity": "sha512-XtssGWJvypyM2ytBnSnKtHYOGT+4ZwTnBVl36TA4nRO2f4PRNGz5/1OszHzcZCvcBMh+qb7I06uoCmLTRdR9og==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/regexpp": "^4.10.0",
+        "@typescript-eslint/scope-manager": "8.51.0",
+        "@typescript-eslint/type-utils": "8.51.0",
+        "@typescript-eslint/utils": "8.51.0",
+        "@typescript-eslint/visitor-keys": "8.51.0",
+        "ignore": "^7.0.0",
+        "natural-compare": "^1.4.0",
+        "ts-api-utils": "^2.2.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/parser": "^8.51.0",
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/ignore": {
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
+      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/@typescript-eslint/parser": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.51.0.tgz",
+      "integrity": "sha512-3xP4XzzDNQOIqBMWogftkwxhg5oMKApqY0BAflmLZiFYHqyhSOxv/cd/zPQLTcCXr4AkaKb25joocY0BD1WC6A==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@typescript-eslint/scope-manager": "8.51.0",
+        "@typescript-eslint/types": "8.51.0",
+        "@typescript-eslint/typescript-estree": "8.51.0",
+        "@typescript-eslint/visitor-keys": "8.51.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/project-service": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.51.0.tgz",
+      "integrity": "sha512-Luv/GafO07Z7HpiI7qeEW5NW8HUtZI/fo/kE0YbtQEFpJRUuR0ajcWfCE5bnMvL7QQFrmT/odMe8QZww8X2nfQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.51.0",
+        "@typescript-eslint/types": "^8.51.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.51.0.tgz",
+      "integrity": "sha512-JhhJDVwsSx4hiOEQPeajGhCWgBMBwVkxC/Pet53EpBVs7zHHtayKefw1jtPaNRXpI9RA2uocdmpdfE7T+NrizA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.51.0",
+        "@typescript-eslint/visitor-keys": "8.51.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.51.0.tgz",
+      "integrity": "sha512-Qi5bSy/vuHeWyir2C8u/uqGMIlIDu8fuiYWv48ZGlZ/k+PRPHtaAu7erpc7p5bzw2WNNSniuxoMSO4Ar6V9OXw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.51.0.tgz",
+      "integrity": "sha512-0XVtYzxnobc9K0VU7wRWg1yiUrw4oQzexCG2V2IDxxCxhqBMSMbjB+6o91A+Uc0GWtgjCa3Y8bi7hwI0Tu4n5Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.51.0",
+        "@typescript-eslint/typescript-estree": "8.51.0",
+        "@typescript-eslint/utils": "8.51.0",
+        "debug": "^4.3.4",
+        "ts-api-utils": "^2.2.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/types": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.51.0.tgz",
+      "integrity": "sha512-TizAvWYFM6sSscmEakjY3sPqGwxZRSywSsPEiuZF6d5GmGD9Gvlsv0f6N8FvAAA0CD06l3rIcWNbsN1e5F/9Ag==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.51.0.tgz",
+      "integrity": "sha512-1qNjGqFRmlq0VW5iVlcyHBbCjPB7y6SxpBkrbhNWMy/65ZoncXCEPJxkRZL8McrseNH6lFhaxCIaX+vBuFnRng==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.51.0",
+        "@typescript-eslint/tsconfig-utils": "8.51.0",
+        "@typescript-eslint/types": "8.51.0",
+        "@typescript-eslint/visitor-keys": "8.51.0",
+        "debug": "^4.3.4",
+        "minimatch": "^9.0.4",
+        "semver": "^7.6.0",
+        "tinyglobby": "^0.2.15",
+        "ts-api-utils": "^2.2.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/@typescript-eslint/utils": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.51.0.tgz",
+      "integrity": "sha512-11rZYxSe0zabiKaCP2QAwRf/dnmgFgvTmeDTtZvUvXG3UuAdg/GU02NExmmIXzz3vLGgMdtrIosI84jITQOxUA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.7.0",
+        "@typescript-eslint/scope-manager": "8.51.0",
+        "@typescript-eslint/types": "8.51.0",
+        "@typescript-eslint/typescript-estree": "8.51.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
+    "node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.51.0.tgz",
+      "integrity": "sha512-mM/JRQOzhVN1ykejrvwnBRV3+7yTKK8tVANVN3o1O0t0v7o+jqdVu9crPy5Y9dov15TJk/FTIgoUGHrTOVL3Zg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.51.0",
+        "eslint-visitor-keys": "^4.2.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
     "node_modules/@ungap/structured-clone": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.3.0.tgz",
@@ -4021,6 +4035,7 @@
       "integrity": "sha512-hGISOaP18plkzbWEcP/QvtRW1xDXF2+96HbEX6byqQhAUbiS5oH6/9JwW+QsQCIYON2bI6QZBF+2PvOmrRZ9wA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@vitest/utils": "3.2.4",
         "fflate": "^0.8.2",
@@ -4335,6 +4350,7 @@
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "license": "MIT",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -4342,6 +4358,16 @@
         "node": ">=0.4.0"
       }
     },
+    "node_modules/acorn-jsx": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
+      "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      }
+    },
     "node_modules/agent-base": {
       "version": "7.1.4",
       "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
@@ -4352,12 +4378,30 @@
         "node": ">= 14"
       }
     },
+    "node_modules/ajv": {
+      "version": "6.12.6",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
+      "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
     "node_modules/algoliasearch": {
       "version": "5.46.2",
       "resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-5.46.2.tgz",
       "integrity": "sha512-qqAXW9QvKf2tTyhpDA4qXv1IfBwD2eduSW6tUEBFIfCeE9gn9HQ9I5+MaKoenRuHrzk5sQoNh1/iof8mY7uD6Q==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@algolia/abtesting": "1.12.2",
         "@algolia/client-abtesting": "5.46.2",
@@ -4378,6 +4422,22 @@
         "node": ">= 14.0.0"
       }
     },
+    "node_modules/ansi-escapes": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-7.2.0.tgz",
+      "integrity": "sha512-g6LhBsl+GBPRWGWsBtutpzBYuIIdBkLEvad5C/va/74Db018+5TZiyA26cZJAr3Rft5lprVqOIPxf5Vid6tqAw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "environment": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/ansi-regex": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
@@ -4388,13 +4448,15 @@
       }
     },
     "node_modules/ansi-styles": {
-      "version": "5.2.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
-      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
-      "dev": true,
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
       "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
       "engines": {
-        "node": ">=10"
+        "node": ">=8"
       },
       "funding": {
         "url": "https://github.com/chalk/ansi-styles?sponsor=1"
@@ -4413,18 +4475,6 @@
         "node": ">= 8"
       }
     },
-    "node_modules/anymatch/node_modules/picomatch": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
-      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=8.6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/jonschlinkert"
-      }
-    },
     "node_modules/archiver": {
       "version": "7.0.1",
       "resolved": "https://registry.npmjs.org/archiver/-/archiver-7.0.1.tgz",
@@ -4461,48 +4511,6 @@
         "node": ">= 14"
       }
     },
-    "node_modules/archiver-utils/node_modules/glob": {
-      "version": "10.5.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
-      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
-      "license": "ISC",
-      "dependencies": {
-        "foreground-child": "^3.1.0",
-        "jackspeak": "^3.1.2",
-        "minimatch": "^9.0.4",
-        "minipass": "^7.1.2",
-        "package-json-from-dist": "^1.0.0",
-        "path-scurry": "^1.11.1"
-      },
-      "bin": {
-        "glob": "dist/esm/bin.mjs"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/archiver-utils/node_modules/lru-cache": {
-      "version": "10.4.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
-      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
-      "license": "ISC"
-    },
-    "node_modules/archiver-utils/node_modules/path-scurry": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
-      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
-      "license": "BlueOak-1.0.0",
-      "dependencies": {
-        "lru-cache": "^10.2.0",
-        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
-      },
-      "engines": {
-        "node": ">=16 || 14 >=14.18"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
     "node_modules/argparse": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
@@ -4563,9 +4571,9 @@
       }
     },
     "node_modules/ast-v8-to-istanbul": {
-      "version": "0.3.9",
-      "resolved": "https://registry.npmjs.org/ast-v8-to-istanbul/-/ast-v8-to-istanbul-0.3.9.tgz",
-      "integrity": "sha512-dSC6tJeOJxbZrPzPbv5mMd6CMiQ1ugaVXXPRad2fXUSsy1kstFn9XQWemV9VW7Y7kpxgQ/4WMoZfwdH8XSU48w==",
+      "version": "0.3.10",
+      "resolved": "https://registry.npmjs.org/ast-v8-to-istanbul/-/ast-v8-to-istanbul-0.3.10.tgz",
+      "integrity": "sha512-p4K7vMz2ZSk3wN8l5o3y2bJAoZXT3VuJI5OLTATY/01CYWumWvwkUw0SqDBnNq6IiTO3qDa1eSQDibAV8g7XOQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4608,7 +4616,6 @@
       "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
       "integrity": "sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==",
       "license": "Apache-2.0",
-      "peer": true,
       "engines": {
         "node": ">= 0.4"
       }
@@ -4736,12 +4743,14 @@
       "license": "MIT"
     },
     "node_modules/brace-expansion": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
-      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "version": "1.1.12",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz",
+      "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==",
+      "dev": true,
       "license": "MIT",
       "dependencies": {
-        "balanced-match": "^1.0.0"
+        "balanced-match": "^1.0.0",
+        "concat-map": "0.0.1"
       }
     },
     "node_modules/braces": {
@@ -5028,6 +5037,16 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/callsites": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz",
+      "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/canvg": {
       "version": "3.0.11",
       "resolved": "https://registry.npmjs.org/canvg/-/canvg-3.0.11.tgz",
@@ -5093,22 +5112,6 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
-    "node_modules/chalk/node_modules/ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "color-convert": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
     "node_modules/character-entities-html4": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/character-entities-html4/-/character-entities-html4-2.1.0.tgz",
@@ -5132,9 +5135,9 @@
       }
     },
     "node_modules/check-error": {
-      "version": "2.1.1",
-      "resolved": "https://registry.npmjs.org/check-error/-/check-error-2.1.1.tgz",
-      "integrity": "sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==",
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/check-error/-/check-error-2.1.3.tgz",
+      "integrity": "sha512-PAJdDJusoxnwm1VwW07VWwUN1sl7smmC3OKggvndJFadxxDRyFJBX/ggnu/KE4kQAB7a3Dp8f/YXC1FlUprWmA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -5197,6 +5200,18 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/chokidar/node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/cipher-base": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/cipher-base/-/cipher-base-1.0.7.tgz",
@@ -5212,6 +5227,56 @@
         "node": ">= 0.10"
       }
     },
+    "node_modules/cli-cursor": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-5.0.0.tgz",
+      "integrity": "sha512-aCj4O5wKyszjMmDT4tZj93kxyydN/K5zPWSCe6/0AV/AA1pqe5ZBIw0a2ZfPQV7lL5/yb5HsUreJ6UFAF1tEQw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "restore-cursor": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/cli-truncate": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-5.1.1.tgz",
+      "integrity": "sha512-SroPvNHxUnk+vIW/dOSfNqdy1sPEFkrTk6TUtqLCnBlo3N7TNYYkzzN7uSD6+jVjrdO4+p8nH7JzH6cIvUem6A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "slice-ansi": "^7.1.0",
+        "string-width": "^8.0.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/cli-truncate/node_modules/string-width": {
+      "version": "8.1.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-8.1.0.tgz",
+      "integrity": "sha512-Kxl3KJGb/gxkaUMOjRsQ8IrXiGW75O4E3RPjFIINOVH8AMl2SQ/yWdTzWwF3FevIX9LcMAjJW+GRwAlAbTSXdg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "get-east-asian-width": "^1.3.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/clone": {
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/clone/-/clone-2.1.2.tgz",
@@ -5226,7 +5291,6 @@
       "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
       "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
       "license": "MIT",
-      "peer": true,
       "engines": {
         "node": ">=6"
       }
@@ -5249,6 +5313,13 @@
       "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
       "license": "MIT"
     },
+    "node_modules/colorette": {
+      "version": "2.0.20",
+      "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.20.tgz",
+      "integrity": "sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/comma-separated-tokens": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/comma-separated-tokens/-/comma-separated-tokens-2.0.3.tgz",
@@ -5261,10 +5332,14 @@
       }
     },
     "node_modules/commander": {
-      "version": "2.20.3",
-      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
-      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
-      "license": "MIT"
+      "version": "14.0.2",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-14.0.2.tgz",
+      "integrity": "sha512-TywoWNNRbhoD0BXs1P3ZEScW8W5iKrnbithIl0YH+uCmBd0QpPOA8yc82DS3BIE5Ma6FnBVUsJ7wVUDz4dvOWQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      }
     },
     "node_modules/compress-commons": {
       "version": "6.0.2",
@@ -5282,6 +5357,13 @@
         "node": ">= 14"
       }
     },
+    "node_modules/concat-map": {
+      "version": "0.0.1",
+      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
+      "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/confbox": {
       "version": "0.1.8",
       "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.1.8.tgz",
@@ -5509,15 +5591,16 @@
       }
     },
     "node_modules/cssstyle": {
-      "version": "5.3.5",
-      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-5.3.5.tgz",
-      "integrity": "sha512-GlsEptulso7Jg0VaOZ8BXQi3AkYM5BOJKEO/rjMidSCq70FkIC5y0eawrCXeYzxgt3OCf4Ls+eoxN+/05vN0Ag==",
+      "version": "5.3.6",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-5.3.6.tgz",
+      "integrity": "sha512-legscpSpgSAeGEe0TNcai97DKt9Vd9AsAdOL7Uoetb52Ar/8eJm3LIa39qpv8wWzLFlNG4vVvppQM+teaMPj3A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@asamuzakjp/css-color": "^4.1.1",
         "@csstools/css-syntax-patches-for-csstree": "^1.0.21",
-        "css-tree": "^3.1.0"
+        "css-tree": "^3.1.0",
+        "lru-cache": "^11.2.4"
       },
       "engines": {
         "node": ">=20"
@@ -5534,6 +5617,7 @@
       "resolved": "https://registry.npmjs.org/cytoscape/-/cytoscape-3.33.1.tgz",
       "integrity": "sha512-iJc4TwyANnOGR1OmWhsS9ayRS3s+XQ185FmuHObThD+5AeJCakAAbWv8KimMTt08xCCLNgneQwFp+JRJOr9qGQ==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=0.10"
       }
@@ -5943,6 +6027,7 @@
       "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz",
       "integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==",
       "license": "ISC",
+      "peer": true,
       "engines": {
         "node": ">=12"
       }
@@ -6092,6 +6177,13 @@
         "node": ">=6"
       }
     },
+    "node_modules/deep-is": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
+      "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/define-data-property": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz",
@@ -6171,8 +6263,7 @@
       "version": "5.6.1",
       "resolved": "https://registry.npmjs.org/devalue/-/devalue-5.6.1.tgz",
       "integrity": "sha512-jDwizj+IlEZBunHcOuuFVBnIMPAEHvTsJj0BcIp94xYguLRVBcXO853px/MyIJvbVzWdsGvrRweIUWJw8hBP7A==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/devlop": {
       "version": "1.1.0",
@@ -6360,6 +6451,19 @@
         "url": "https://github.com/fb55/entities?sponsor=1"
       }
     },
+    "node_modules/environment": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/environment/-/environment-1.1.0.tgz",
+      "integrity": "sha512-xUtoPkMggbz0MPyPiIWr1Kp4aeWJjDZ6SMvURhimjdZgsRuDplF5/s9hcgGhyXMhs+6vpnuoiZ2kFiu3FMnS8Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/es-define-property": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
@@ -6441,23 +6545,195 @@
         "@esbuild/win32-x64": "0.27.2"
       }
     },
+    "node_modules/escape-string-regexp": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
+      "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/eslint": {
+      "version": "9.39.2",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.39.2.tgz",
+      "integrity": "sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.8.0",
+        "@eslint-community/regexpp": "^4.12.1",
+        "@eslint/config-array": "^0.21.1",
+        "@eslint/config-helpers": "^0.4.2",
+        "@eslint/core": "^0.17.0",
+        "@eslint/eslintrc": "^3.3.1",
+        "@eslint/js": "9.39.2",
+        "@eslint/plugin-kit": "^0.4.1",
+        "@humanfs/node": "^0.16.6",
+        "@humanwhocodes/module-importer": "^1.0.1",
+        "@humanwhocodes/retry": "^0.4.2",
+        "@types/estree": "^1.0.6",
+        "ajv": "^6.12.4",
+        "chalk": "^4.0.0",
+        "cross-spawn": "^7.0.6",
+        "debug": "^4.3.2",
+        "escape-string-regexp": "^4.0.0",
+        "eslint-scope": "^8.4.0",
+        "eslint-visitor-keys": "^4.2.1",
+        "espree": "^10.4.0",
+        "esquery": "^1.5.0",
+        "esutils": "^2.0.2",
+        "fast-deep-equal": "^3.1.3",
+        "file-entry-cache": "^8.0.0",
+        "find-up": "^5.0.0",
+        "glob-parent": "^6.0.2",
+        "ignore": "^5.2.0",
+        "imurmurhash": "^0.1.4",
+        "is-glob": "^4.0.0",
+        "json-stable-stringify-without-jsonify": "^1.0.1",
+        "lodash.merge": "^4.6.2",
+        "minimatch": "^3.1.2",
+        "natural-compare": "^1.4.0",
+        "optionator": "^0.9.3"
+      },
+      "bin": {
+        "eslint": "bin/eslint.js"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      },
+      "peerDependencies": {
+        "jiti": "*"
+      },
+      "peerDependenciesMeta": {
+        "jiti": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-config-prettier": {
+      "version": "10.1.8",
+      "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-10.1.8.tgz",
+      "integrity": "sha512-82GZUjRS0p/jganf6q1rEO25VSoHH0hKPCTrgillPjdI/3bgBhAE1QzHrHTizjpRvy6pGAvKjDJtk2pF9NDq8w==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "eslint-config-prettier": "bin/cli.js"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint-config-prettier"
+      },
+      "peerDependencies": {
+        "eslint": ">=7.0.0"
+      }
+    },
+    "node_modules/eslint-scope": {
+      "version": "8.4.0",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.4.0.tgz",
+      "integrity": "sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "esrecurse": "^4.3.0",
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint-visitor-keys": {
+      "version": "4.2.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz",
+      "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
     "node_modules/esm-env": {
       "version": "1.2.2",
       "resolved": "https://registry.npmjs.org/esm-env/-/esm-env-1.2.2.tgz",
       "integrity": "sha512-Epxrv+Nr/CaL4ZcFGPJIYLWFom+YeV1DqMLHJoEd9SYRxNbaFruBwfEX/kkHUJf55j2+TUbmDcmuilbP1TmXHA==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
+    },
+    "node_modules/espree": {
+      "version": "10.4.0",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-10.4.0.tgz",
+      "integrity": "sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "acorn": "^8.15.0",
+        "acorn-jsx": "^5.3.2",
+        "eslint-visitor-keys": "^4.2.1"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/esquery": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.7.0.tgz",
+      "integrity": "sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "estraverse": "^5.1.0"
+      },
+      "engines": {
+        "node": ">=0.10"
+      }
     },
     "node_modules/esrap": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/esrap/-/esrap-2.2.1.tgz",
       "integrity": "sha512-GiYWG34AN/4CUyaWAgunGt0Rxvr1PTMlGC0vvEov/uOQYWne2bpN03Um+k8jT+q3op33mKouP2zeJ6OlM+qeUg==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@jridgewell/sourcemap-codec": "^1.4.15"
       }
     },
+    "node_modules/esrecurse": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
+      "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/estraverse": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
     "node_modules/estree-walker": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
@@ -6468,6 +6744,16 @@
         "@types/estree": "^1.0.0"
       }
     },
+    "node_modules/esutils": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
+      "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/event-target-shim": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/event-target-shim/-/event-target-shim-5.0.1.tgz",
@@ -6477,6 +6763,13 @@
         "node": ">=6"
       }
     },
+    "node_modules/eventemitter3": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.1.tgz",
+      "integrity": "sha512-GWkBvjiSZK87ELrYOSESUYeVIc9mvLLf/nXalMOS5dYrgZq9o5OVkbZAVM06CVxYsCwH9BDZFPlQTlPA1j4ahA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/events": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
@@ -6528,6 +6821,20 @@
       "integrity": "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==",
       "license": "MIT"
     },
+    "node_modules/fast-json-stable-stringify": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
+      "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/fast-png": {
       "version": "6.4.0",
       "resolved": "https://registry.npmjs.org/fast-png/-/fast-png-6.4.0.tgz",
@@ -6545,29 +6852,25 @@
       "integrity": "sha512-w+eufiZ1WuJYgPXbV/PO3NCMEc3xqylkKHzp8bxp1uW4qaSNQUkwmLLEc3kKsfz8lpV1F8Ht3U1Cm+9Srog2ug==",
       "license": "(MIT AND Zlib)"
     },
-    "node_modules/fdir": {
-      "version": "6.5.0",
-      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
-      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=12.0.0"
-      },
-      "peerDependencies": {
-        "picomatch": "^3 || ^4"
-      },
-      "peerDependenciesMeta": {
-        "picomatch": {
-          "optional": true
-        }
-      }
-    },
     "node_modules/fflate": {
       "version": "0.8.2",
       "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.2.tgz",
       "integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==",
       "license": "MIT"
     },
+    "node_modules/file-entry-cache": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
+      "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flat-cache": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=16.0.0"
+      }
+    },
     "node_modules/fill-range": {
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
@@ -6597,6 +6900,20 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/flat-cache": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz",
+      "integrity": "sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flatted": "^3.2.9",
+        "keyv": "^4.5.4"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
     "node_modules/flatted": {
       "version": "3.3.3",
       "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz",
@@ -6605,13 +6922,34 @@
       "license": "ISC"
     },
     "node_modules/focus-trap": {
-      "version": "7.7.0",
-      "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.7.0.tgz",
-      "integrity": "sha512-DJJDHpEgoSbP8ZE1MNeU2IzCpfFyFdNZZRilqmfH2XiQsPK6PtD8AfJqWzEBudUQB2yHwZc5iq54rjTaGQ+ljw==",
+      "version": "7.7.1",
+      "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-7.7.1.tgz",
+      "integrity": "sha512-Pkp8m55GjxBLnhBoT6OXdMvfRr4TjMAKLvFM566zlIryq5plbhaTmLAJWTGR0EkRwLjEte1lCOG9MxF1ipJrOg==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
-        "tabbable": "^6.3.0"
+        "tabbable": "^6.4.0"
+      }
+    },
+    "node_modules/follow-redirects": {
+      "version": "1.15.6",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.15.6.tgz",
+      "integrity": "sha512-wWN62YITEaOpSK584EZXJafH1AGpO8RVgElfkuXbTOrPX4fIfOyEpW/CsiNd8JdYrAoOvafRTOEnvsO++qCqFA==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/RubenVerborgh"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=4.0"
+      },
+      "peerDependenciesMeta": {
+        "debug": {
+          "optional": true
+        }
       }
     },
     "node_modules/fontkit": {
@@ -6712,6 +7050,19 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/get-east-asian-width": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.4.0.tgz",
+      "integrity": "sha512-QZjmEOC+IT1uk6Rx0sX22V6uHWVwbdbxf1faPqJ1QhLdGgsRGCZoyaQBm/piRdJy/D2um6hM1UP7ZEeQ4EkP+Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/get-intrinsic": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
@@ -6751,16 +7102,74 @@
         "node": ">= 0.4"
       }
     },
-    "node_modules/glob-parent": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+    "node_modules/glob": {
+      "version": "10.5.0",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
+      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
       "license": "ISC",
       "dependencies": {
-        "is-glob": "^4.0.1"
+        "foreground-child": "^3.1.0",
+        "jackspeak": "^3.1.2",
+        "minimatch": "^9.0.4",
+        "minipass": "^7.1.2",
+        "package-json-from-dist": "^1.0.0",
+        "path-scurry": "^1.11.1"
+      },
+      "bin": {
+        "glob": "dist/esm/bin.mjs"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/glob-parent": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
+      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.3"
       },
       "engines": {
-        "node": ">= 6"
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/glob/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/glob/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "license": "ISC",
+      "dependencies": {
+        "brace-expansion": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/globals": {
+      "version": "17.0.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-17.0.0.tgz",
+      "integrity": "sha512-gv5BeD2EssA793rlFWVPMMCqefTlpusw6/2TbAVMy0FzcG8wKJn4O+NqJ4+XWmmwrayJgw5TzrmWjFgmz1XPqw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/gopd": {
@@ -6960,16 +7369,16 @@
       "license": "MIT"
     },
     "node_modules/html-encoding-sniffer": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-4.0.0.tgz",
-      "integrity": "sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==",
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-6.0.0.tgz",
+      "integrity": "sha512-CV9TW3Y3f8/wT0BRFc1/KAVQ3TUHiXmaAb6VW9vtiMFf7SLoMd1PdAc4W3KFOFETBJUb90KatHqlsZMWV+R9Gg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "whatwg-encoding": "^3.1.1"
+        "@exodus/bytes": "^1.6.0"
       },
       "engines": {
-        "node": ">=18"
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
       }
     },
     "node_modules/html-escaper": {
@@ -7038,6 +7447,22 @@
         "node": ">= 14"
       }
     },
+    "node_modules/husky": {
+      "version": "9.1.7",
+      "resolved": "https://registry.npmjs.org/husky/-/husky-9.1.7.tgz",
+      "integrity": "sha512-5gs5ytaNjBrh5Ow3zrvdUUY+0VxIuWVL4i9irt6friV+BqdCfmV11CQTWMiBYWHbXhco+J1kHfTOUkePhCDvMA==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "husky": "bin.js"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/typicode"
+      }
+    },
     "node_modules/i18next": {
       "version": "25.7.3",
       "resolved": "https://registry.npmjs.org/i18next/-/i18next-25.7.3.tgz",
@@ -7125,12 +7550,49 @@
       ],
       "license": "BSD-3-Clause"
     },
+    "node_modules/ignore": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
+      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
     "node_modules/immediate": {
       "version": "3.0.6",
       "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
       "integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==",
       "license": "MIT"
     },
+    "node_modules/import-fresh": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
+      "integrity": "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "parent-module": "^1.0.0",
+        "resolve-from": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/imurmurhash": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
+      "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.8.19"
+      }
+    },
     "node_modules/inherits": {
       "version": "2.0.4",
       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
@@ -7220,12 +7682,19 @@
       }
     },
     "node_modules/is-fullwidth-code-point": {
-      "version": "3.0.0",
-      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
-      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-5.1.0.tgz",
+      "integrity": "sha512-5XHYaSyiqADb4RnZ1Bdad6cPp8Toise4TzEjcOYDHZkTCbKgiUl7WTUCpNWHuxmDt91wnsZBc9xinNzopv3JMQ==",
+      "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "get-east-asian-width": "^1.3.1"
+      },
       "engines": {
-        "node": ">=8"
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
       }
     },
     "node_modules/is-generator-function": {
@@ -7298,7 +7767,6 @@
       "resolved": "https://registry.npmjs.org/is-reference/-/is-reference-3.0.3.tgz",
       "integrity": "sha512-ixkJoqQvAP88E6wLydLGGqCJsrFUnqoH6HnaczB8XmDH1oaWU+xxdptvikTgaEhtZ53Ky6YXiBuUI2WXLMCwjw==",
       "license": "MIT",
-      "peer": true,
       "dependencies": {
         "@types/estree": "^1.0.6"
       }
@@ -7480,22 +7948,36 @@
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
       "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
-      "dev": true,
       "license": "MIT"
     },
-    "node_modules/jsdom": {
-      "version": "27.3.0",
-      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-27.3.0.tgz",
-      "integrity": "sha512-GtldT42B8+jefDUC4yUKAvsaOrH7PDHmZxZXNgF2xMmymjUbRYJvpAybZAKEmXDGTM0mCsz8duOa4vTm5AY2Kg==",
+    "node_modules/js-yaml": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.1.tgz",
+      "integrity": "sha512-qQKT4zQxXl8lLwBtHMWwaTcGfFOZviOJet3Oy/xmGk2gZH677CJM9EvtfdSkgWcATZhj/55JZ0rmy3myCT5lsA==",
       "dev": true,
       "license": "MIT",
+      "dependencies": {
+        "argparse": "^2.0.1"
+      },
+      "bin": {
+        "js-yaml": "bin/js-yaml.js"
+      }
+    },
+    "node_modules/jsdom": {
+      "version": "27.4.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-27.4.0.tgz",
+      "integrity": "sha512-mjzqwWRD9Y1J1KUi7W97Gja1bwOOM5Ug0EZ6UDK3xS7j7mndrkwozHtSblfomlzyB4NepioNt+B2sOSzczVgtQ==",
+      "dev": true,
+      "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@acemir/cssom": "^0.9.28",
         "@asamuzakjp/dom-selector": "^6.7.6",
+        "@exodus/bytes": "^1.6.0",
         "cssstyle": "^5.3.4",
         "data-urls": "^6.0.0",
         "decimal.js": "^10.6.0",
-        "html-encoding-sniffer": "^4.0.0",
+        "html-encoding-sniffer": "^6.0.0",
         "http-proxy-agent": "^7.0.2",
         "https-proxy-agent": "^7.0.6",
         "is-potential-custom-element-name": "^1.0.1",
@@ -7505,7 +7987,6 @@
         "tough-cookie": "^6.0.0",
         "w3c-xmlserializer": "^5.0.0",
         "webidl-conversions": "^8.0.0",
-        "whatwg-encoding": "^3.1.1",
         "whatwg-mimetype": "^4.0.0",
         "whatwg-url": "^15.1.0",
         "ws": "^8.18.3",
@@ -7523,6 +8004,27 @@
         }
       }
     },
+    "node_modules/json-buffer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
+      "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/json-stable-stringify-without-jsonify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
+      "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/jsonfile": {
       "version": "6.2.0",
       "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.0.tgz",
@@ -7541,6 +8043,7 @@
       "resolved": "https://registry.npmjs.org/jspdf/-/jspdf-3.0.4.tgz",
       "integrity": "sha512-dc6oQ8y37rRcHn316s4ngz/nOjayLF/FFxBF4V9zamQKRqXxyiH1zagkCdktdWhtoQId5K20xt1lB90XzkB+hQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/runtime": "^7.28.4",
         "fast-png": "^6.2.0",
@@ -7554,12 +8057,12 @@
       }
     },
     "node_modules/jspdf-autotable": {
-      "version": "5.0.2",
-      "resolved": "https://registry.npmjs.org/jspdf-autotable/-/jspdf-autotable-5.0.2.tgz",
-      "integrity": "sha512-YNKeB7qmx3pxOLcNeoqAv3qTS7KuvVwkFe5AduCawpop3NOkBUtqDToxNc225MlNecxT4kP2Zy3z/y/yvGdXUQ==",
+      "version": "5.0.7",
+      "resolved": "https://registry.npmjs.org/jspdf-autotable/-/jspdf-autotable-5.0.7.tgz",
+      "integrity": "sha512-2wr7H6liNDBYNwt25hMQwXkEWFOEopgKIvR1Eukuw6Zmprm/ZcnmLTQEjW7Xx3FCbD3v7pflLcnMAv/h1jFDQw==",
       "license": "MIT",
       "peerDependencies": {
-        "jspdf": "^2 || ^3"
+        "jspdf": "^2 || ^3 || ^4"
       }
     },
     "node_modules/jszip": {
@@ -7635,6 +8138,16 @@
         "node": ">= 12"
       }
     },
+    "node_modules/keyv": {
+      "version": "4.5.4",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
+      "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "json-buffer": "3.0.1"
+      }
+    },
     "node_modules/khroma": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/khroma/-/khroma-2.1.0.tgz",
@@ -7710,6 +8223,20 @@
         "safe-buffer": "~5.1.0"
       }
     },
+    "node_modules/levn": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
+      "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "prelude-ls": "^1.2.1",
+        "type-check": "~0.4.0"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
     "node_modules/lie": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/lie/-/lie-3.3.0.tgz",
@@ -7996,12 +8523,110 @@
         "uc.micro": "^2.0.0"
       }
     },
+    "node_modules/lint-staged": {
+      "version": "16.2.7",
+      "resolved": "https://registry.npmjs.org/lint-staged/-/lint-staged-16.2.7.tgz",
+      "integrity": "sha512-lDIj4RnYmK7/kXMya+qJsmkRFkGolciXjrsZ6PC25GdTfWOAWetR0ZbsNXRAj1EHHImRSalc+whZFg56F5DVow==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "commander": "^14.0.2",
+        "listr2": "^9.0.5",
+        "micromatch": "^4.0.8",
+        "nano-spawn": "^2.0.0",
+        "pidtree": "^0.6.0",
+        "string-argv": "^0.3.2",
+        "yaml": "^2.8.1"
+      },
+      "bin": {
+        "lint-staged": "bin/lint-staged.js"
+      },
+      "engines": {
+        "node": ">=20.17"
+      },
+      "funding": {
+        "url": "https://opencollective.com/lint-staged"
+      }
+    },
+    "node_modules/listr2": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/listr2/-/listr2-9.0.5.tgz",
+      "integrity": "sha512-ME4Fb83LgEgwNw96RKNvKV4VTLuXfoKudAmm2lP8Kk87KaMK0/Xrx/aAkMWmT8mDb+3MlFDspfbCs7adjRxA2g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cli-truncate": "^5.0.0",
+        "colorette": "^2.0.20",
+        "eventemitter3": "^5.0.1",
+        "log-update": "^6.1.0",
+        "rfdc": "^1.4.1",
+        "wrap-ansi": "^9.0.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/listr2/node_modules/ansi-styles": {
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz",
+      "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/listr2/node_modules/emoji-regex": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz",
+      "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/listr2/node_modules/string-width": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz",
+      "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^10.3.0",
+        "get-east-asian-width": "^1.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/listr2/node_modules/wrap-ansi": {
+      "version": "9.0.2",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.2.tgz",
+      "integrity": "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.1",
+        "string-width": "^7.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/locate-character": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/locate-character/-/locate-character-3.0.0.tgz",
       "integrity": "sha512-SW13ws7BjaeJ6p7Q6CO2nchbYEc3X3J6WrmTTDto7yMPqVSZTUyY5Tjbid+Ab8gLnATtygYtiDIJGQRRn2ZOiA==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/locate-path": {
       "version": "6.0.0",
@@ -8031,14 +8656,94 @@
       "integrity": "sha512-XEawp1t0gxSi9x01glktRZ5HDy0HXqrM0x5pXQM98EaI0NxO6jVM7omDOxsuEo5UIASAnm2bRp1Jt/e0a2XU8Q==",
       "license": "MIT"
     },
+    "node_modules/lodash.merge": {
+      "version": "4.6.2",
+      "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
+      "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/log-update": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/log-update/-/log-update-6.1.0.tgz",
+      "integrity": "sha512-9ie8ItPR6tjY5uYJh8K/Zrv/RMZ5VOlOWvtZdEHYSTFKZfIBPQa9tOAEeAWhd+AnIneLJ22w5fjOYtoutpWq5w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-escapes": "^7.0.0",
+        "cli-cursor": "^5.0.0",
+        "slice-ansi": "^7.1.0",
+        "strip-ansi": "^7.1.0",
+        "wrap-ansi": "^9.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/log-update/node_modules/ansi-styles": {
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz",
+      "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/log-update/node_modules/emoji-regex": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz",
+      "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/log-update/node_modules/string-width": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz",
+      "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^10.3.0",
+        "get-east-asian-width": "^1.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/log-update/node_modules/wrap-ansi": {
+      "version": "9.0.2",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.2.tgz",
+      "integrity": "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.1",
+        "string-width": "^7.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
     "node_modules/loose-envify": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
       "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
-      "dev": true,
       "license": "MIT",
-      "optional": true,
-      "peer": true,
       "dependencies": {
         "js-tokens": "^3.0.0 || ^4.0.0"
       },
@@ -8128,6 +8833,7 @@
       "resolved": "https://registry.npmjs.org/markdown-it/-/markdown-it-14.1.0.tgz",
       "integrity": "sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "argparse": "^2.0.1",
         "entities": "^4.4.0",
@@ -8401,6 +9107,20 @@
       ],
       "license": "MIT"
     },
+    "node_modules/micromatch": {
+      "version": "4.0.8",
+      "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
+      "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "braces": "^3.0.3",
+        "picomatch": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=8.6"
+      }
+    },
     "node_modules/miller-rabin": {
       "version": "4.0.1",
       "resolved": "https://registry.npmjs.org/miller-rabin/-/miller-rabin-4.0.1.tgz",
@@ -8422,6 +9142,19 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/mimic-function": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/mimic-function/-/mimic-function-5.0.1.tgz",
+      "integrity": "sha512-VP79XUPxV2CigYP3jWwAUFSku2aKqBH7uTAapFWCBqutsbmDo96KY5o8uh6U+/YSIn5OxJnXp73beVkpqMIGhA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/minimalistic-assert": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz",
@@ -8437,18 +9170,16 @@
       "license": "MIT"
     },
     "node_modules/minimatch": {
-      "version": "9.0.5",
-      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
-      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
+      "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
+      "dev": true,
       "license": "ISC",
       "dependencies": {
-        "brace-expansion": "^2.0.1"
+        "brace-expansion": "^1.1.7"
       },
       "engines": {
-        "node": ">=16 || 14 >=14.17"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
+        "node": "*"
       }
     },
     "node_modules/minipass": {
@@ -8503,6 +9234,19 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/nano-spawn": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/nano-spawn/-/nano-spawn-2.0.0.tgz",
+      "integrity": "sha512-tacvGzUY5o2D8CBh2rrwxyNojUsZNU2zjNTzKQrkgGJQTbGAfArVWXSKMBokBeeg6C7OLRGUEyoFlYbfeWQIqw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.17"
+      },
+      "funding": {
+        "url": "https://github.com/sindresorhus/nano-spawn?sponsor=1"
+      }
+    },
     "node_modules/nanoid": {
       "version": "3.3.11",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
@@ -8521,6 +9265,13 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/natural-compare": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
+      "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/node-fetch": {
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/node-fetch/-/node-fetch-2.7.0.tgz",
@@ -8563,6 +9314,15 @@
         "webidl-conversions": "^3.0.0"
       }
     },
+    "node_modules/node-forge": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-1.3.3.tgz",
+      "integrity": "sha512-rLvcdSyRCyouf6jcOIPe/BgwG/d7hKjzMKOas33/pHEr6gbq18IK9zV7DiPvzsz0oBJPme6qr6H6kGZuI9/DZg==",
+      "license": "(BSD-3-Clause OR GPL-2.0)",
+      "engines": {
+        "node": ">= 6.13.0"
+      }
+    },
     "node_modules/node-stdlib-browser": {
       "version": "1.3.1",
       "resolved": "https://registry.npmjs.org/node-stdlib-browser/-/node-stdlib-browser-1.3.1.tgz",
@@ -8627,6 +9387,13 @@
         "ieee754": "^1.1.13"
       }
     },
+    "node_modules/node-stdlib-browser/node_modules/punycode": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/node-stdlib-browser/node_modules/readable-stream": {
       "version": "3.6.2",
       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.2.tgz",
@@ -8712,6 +9479,22 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/onetime": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-7.0.0.tgz",
+      "integrity": "sha512-VXJjc87FScF88uafS3JllDgvAm+c/Slfz06lorj2uAY34rlUu0Nt+v8wreiImcrgAjjIHp1rXpTDlLOGw29WwQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mimic-function": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/oniguruma-to-es": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/oniguruma-to-es/-/oniguruma-to-es-3.1.1.tgz",
@@ -8733,6 +9516,24 @@
         "opencollective-postinstall": "index.js"
       }
     },
+    "node_modules/optionator": {
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
+      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "deep-is": "^0.1.3",
+        "fast-levenshtein": "^2.0.6",
+        "levn": "^0.4.1",
+        "prelude-ls": "^1.2.1",
+        "type-check": "^0.4.0",
+        "word-wrap": "^1.2.5"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
     "node_modules/os-browserify": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/os-browserify/-/os-browserify-0.3.0.tgz",
@@ -8808,6 +9609,19 @@
       "integrity": "sha512-5QvjGxYVjxO59MGU2lHVYpRWBBtKHnlIAcSe1uNFCkkptUh63NFRj0FJQm7nR67puEruUci/ZkjmEFrjCAyP4A==",
       "license": "MIT"
     },
+    "node_modules/parent-module": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
+      "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "callsites": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/parse-asn1": {
       "version": "5.1.9",
       "resolved": "https://registry.npmjs.org/parse-asn1/-/parse-asn1-5.1.9.tgz",
@@ -8890,6 +9704,28 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/path-scurry": {
+      "version": "1.11.1",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
+      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "lru-cache": "^10.2.0",
+        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/path-scurry/node_modules/lru-cache": {
+      "version": "10.4.3",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
+      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
+      "license": "ISC"
+    },
     "node_modules/pathe": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
@@ -8924,6 +9760,15 @@
         "node": ">= 0.10"
       }
     },
+    "node_modules/pdf-fontkit": {
+      "version": "1.8.9",
+      "resolved": "https://registry.npmjs.org/pdf-fontkit/-/pdf-fontkit-1.8.9.tgz",
+      "integrity": "sha512-TTq+umfhlFjUuQYOq6dCKT/wLslCrX4zVr5gqrIvrGHfo+vJ3ETapZTb4YLOCErohX7pF+HxlXSZuiToSRhNmA==",
+      "license": "MIT",
+      "dependencies": {
+        "pako": "^1.0.6"
+      }
+    },
     "node_modules/pdf-lib": {
       "version": "1.17.1",
       "resolved": "https://registry.npmjs.org/pdf-lib/-/pdf-lib-1.17.1.tgz",
@@ -8937,15 +9782,15 @@
       }
     },
     "node_modules/pdfjs-dist": {
-      "version": "5.4.449",
-      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-5.4.449.tgz",
-      "integrity": "sha512-CegnUaT0QwAyQMS+7o2POr4wWUNNe8VaKKlcuoRHeYo98cVnqPpwOXNSx6Trl6szH02JrRcsPgletV6GmF3LtQ==",
+      "version": "5.4.530",
+      "resolved": "https://registry.npmjs.org/pdfjs-dist/-/pdfjs-dist-5.4.530.tgz",
+      "integrity": "sha512-r1hWsSIGGmyYUAHR26zSXkxYWLXLMd6AwqcaFYG9YUZ0GBf5GvcjJSeo512tabM4GYFhxhl5pMCmPr7Q72Rq2Q==",
       "license": "Apache-2.0",
       "engines": {
         "node": ">=20.16.0 || >=22.3.0"
       },
       "optionalDependencies": {
-        "@napi-rs/canvas": "^0.1.81"
+        "@napi-rs/canvas": "^0.1.84"
       }
     },
     "node_modules/pdfkit": {
@@ -8982,17 +9827,30 @@
       "license": "ISC"
     },
     "node_modules/picomatch": {
-      "version": "4.0.3",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
-      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
       "license": "MIT",
       "engines": {
-        "node": ">=12"
+        "node": ">=8.6"
       },
       "funding": {
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/pidtree": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/pidtree/-/pidtree-0.6.0.tgz",
+      "integrity": "sha512-eG2dWTVw5bzqGRztnHExczNxt5VGsE6OwTeCG3fdUf9KBsZzO3R5OIIIzWR+iZA0NtZ+RDVdaoE2dK1cn6jH4g==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "pidtree": "bin/pidtree.js"
+      },
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
     "node_modules/pkg-dir": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/pkg-dir/-/pkg-dir-5.0.0.tgz",
@@ -9081,11 +9939,22 @@
       "resolved": "https://registry.npmjs.org/preact/-/preact-10.28.1.tgz",
       "integrity": "sha512-u1/ixq/lVQI0CakKNvLDEcW5zfCjUQfZdK9qqWuIJtsezuyG6pk9TWj75GMuI/EzRSZB/VAE43sNWWZfiy8psw==",
       "license": "MIT",
+      "peer": true,
       "funding": {
         "type": "opencollective",
         "url": "https://opencollective.com/preact"
       }
     },
+    "node_modules/prelude-ls": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
+      "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
     "node_modules/prettier": {
       "version": "3.7.4",
       "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.7.4.tgz",
@@ -9117,6 +9986,19 @@
         "node": "^10.13.0 || ^12.13.0 || ^14.15.0 || >=15.0.0"
       }
     },
+    "node_modules/pretty-format/node_modules/ansi-styles": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-5.2.0.tgz",
+      "integrity": "sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
     "node_modules/process": {
       "version": "0.11.10",
       "resolved": "https://registry.npmjs.org/process/-/process-0.11.10.tgz",
@@ -9166,11 +10048,14 @@
       "license": "MIT"
     },
     "node_modules/punycode": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-      "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==",
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
+      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
       "dev": true,
-      "license": "MIT"
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
     },
     "node_modules/punycode.js": {
       "version": "2.3.1",
@@ -9182,9 +10067,9 @@
       }
     },
     "node_modules/qs": {
-      "version": "6.14.0",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.14.0.tgz",
-      "integrity": "sha512-YWWTjgABSKcvs/nWBi9PycY/JiPJqOD4JA6o9Sej2AtvSGarXxKC3OQSk4pAarbdQlKAh5D4FCQkJNkW+GAn3w==",
+      "version": "6.14.1",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.14.1.tgz",
+      "integrity": "sha512-4EK3+xJl8Ts67nLYNwqw/dsFVnCf+qR7RgXSK9jEEm9unao3njwMDdmsdvoKBKHzxd7tCYz5e5M+SnMjdtXGQQ==",
       "dev": true,
       "license": "BSD-3-Clause",
       "dependencies": {
@@ -9238,26 +10123,30 @@
       }
     },
     "node_modules/react": {
-      "version": "19.2.3",
-      "resolved": "https://registry.npmjs.org/react/-/react-19.2.3.tgz",
-      "integrity": "sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA==",
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
+      "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==",
       "license": "MIT",
       "peer": true,
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      },
       "engines": {
         "node": ">=0.10.0"
       }
     },
     "node_modules/react-dom": {
-      "version": "19.2.3",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.3.tgz",
-      "integrity": "sha512-yELu4WmLPw5Mr/lmeEpox5rw3RETacE++JgHqQzd2dg+YbJuat3jH4ingc+WPZhxaoFzdv9y33G+F7Nl5O0GBg==",
+      "version": "18.3.1",
+      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
+      "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==",
       "license": "MIT",
       "peer": true,
       "dependencies": {
-        "scheduler": "^0.27.0"
+        "loose-envify": "^1.1.0",
+        "scheduler": "^0.23.2"
       },
       "peerDependencies": {
-        "react": "^19.2.3"
+        "react": "^18.3.1"
       }
     },
     "node_modules/react-is": {
@@ -9292,6 +10181,15 @@
         "minimatch": "^5.1.0"
       }
     },
+    "node_modules/readdir-glob/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
     "node_modules/readdir-glob/node_modules/minimatch": {
       "version": "5.1.6",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-5.1.6.tgz",
@@ -9316,18 +10214,6 @@
         "node": ">=8.10.0"
       }
     },
-    "node_modules/readdirp/node_modules/picomatch": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
-      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
-      "license": "MIT",
-      "engines": {
-        "node": ">=8.6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/jonschlinkert"
-      }
-    },
     "node_modules/regenerator-runtime": {
       "version": "0.13.11",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
@@ -9392,6 +10278,33 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/resolve-from": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz",
+      "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/restore-cursor": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-5.1.0.tgz",
+      "integrity": "sha512-oMA2dcrw6u0YfxJQXm342bFKX/E4sG9rbTzO9ptUcR/e8A33cHuvStiYOwH7fszkZlZ1z/ta9AAoPk2F4qIOHA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "onetime": "^7.0.0",
+        "signal-exit": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/restructure": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/restructure/-/restructure-3.0.2.tgz",
@@ -9499,10 +10412,11 @@
       "license": "Unlicense"
     },
     "node_modules/rollup": {
-      "version": "4.54.0",
-      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.54.0.tgz",
-      "integrity": "sha512-3nk8Y3a9Ea8szgKhinMlGMhGMw89mqule3KWczxhIzqudyHdCIOHw8WJlj/r329fACjKLEh13ZSk7oE22kyeIw==",
+      "version": "4.55.1",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.55.1.tgz",
+      "integrity": "sha512-wDv/Ht1BNHB4upNbK74s9usvl7hObDnvVzknxqY/E/O3X6rW1U1rV1aENEfJ54eFZDTNo7zv1f5N4edCluH7+A==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/estree": "1.0.8"
       },
@@ -9514,28 +10428,31 @@
         "npm": ">=8.0.0"
       },
       "optionalDependencies": {
-        "@rollup/rollup-android-arm-eabi": "4.54.0",
-        "@rollup/rollup-android-arm64": "4.54.0",
-        "@rollup/rollup-darwin-arm64": "4.54.0",
-        "@rollup/rollup-darwin-x64": "4.54.0",
-        "@rollup/rollup-freebsd-arm64": "4.54.0",
-        "@rollup/rollup-freebsd-x64": "4.54.0",
-        "@rollup/rollup-linux-arm-gnueabihf": "4.54.0",
-        "@rollup/rollup-linux-arm-musleabihf": "4.54.0",
-        "@rollup/rollup-linux-arm64-gnu": "4.54.0",
-        "@rollup/rollup-linux-arm64-musl": "4.54.0",
-        "@rollup/rollup-linux-loong64-gnu": "4.54.0",
-        "@rollup/rollup-linux-ppc64-gnu": "4.54.0",
-        "@rollup/rollup-linux-riscv64-gnu": "4.54.0",
-        "@rollup/rollup-linux-riscv64-musl": "4.54.0",
-        "@rollup/rollup-linux-s390x-gnu": "4.54.0",
-        "@rollup/rollup-linux-x64-gnu": "4.54.0",
-        "@rollup/rollup-linux-x64-musl": "4.54.0",
-        "@rollup/rollup-openharmony-arm64": "4.54.0",
-        "@rollup/rollup-win32-arm64-msvc": "4.54.0",
-        "@rollup/rollup-win32-ia32-msvc": "4.54.0",
-        "@rollup/rollup-win32-x64-gnu": "4.54.0",
-        "@rollup/rollup-win32-x64-msvc": "4.54.0",
+        "@rollup/rollup-android-arm-eabi": "4.55.1",
+        "@rollup/rollup-android-arm64": "4.55.1",
+        "@rollup/rollup-darwin-arm64": "4.55.1",
+        "@rollup/rollup-darwin-x64": "4.55.1",
+        "@rollup/rollup-freebsd-arm64": "4.55.1",
+        "@rollup/rollup-freebsd-x64": "4.55.1",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.55.1",
+        "@rollup/rollup-linux-arm-musleabihf": "4.55.1",
+        "@rollup/rollup-linux-arm64-gnu": "4.55.1",
+        "@rollup/rollup-linux-arm64-musl": "4.55.1",
+        "@rollup/rollup-linux-loong64-gnu": "4.55.1",
+        "@rollup/rollup-linux-loong64-musl": "4.55.1",
+        "@rollup/rollup-linux-ppc64-gnu": "4.55.1",
+        "@rollup/rollup-linux-ppc64-musl": "4.55.1",
+        "@rollup/rollup-linux-riscv64-gnu": "4.55.1",
+        "@rollup/rollup-linux-riscv64-musl": "4.55.1",
+        "@rollup/rollup-linux-s390x-gnu": "4.55.1",
+        "@rollup/rollup-linux-x64-gnu": "4.55.1",
+        "@rollup/rollup-linux-x64-musl": "4.55.1",
+        "@rollup/rollup-openbsd-x64": "4.55.1",
+        "@rollup/rollup-openharmony-arm64": "4.55.1",
+        "@rollup/rollup-win32-arm64-msvc": "4.55.1",
+        "@rollup/rollup-win32-ia32-msvc": "4.55.1",
+        "@rollup/rollup-win32-x64-gnu": "4.55.1",
+        "@rollup/rollup-win32-x64-msvc": "4.55.1",
         "fsevents": "~2.3.2"
       }
     },
@@ -9615,11 +10532,13 @@
       }
     },
     "node_modules/scheduler": {
-      "version": "0.27.0",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.27.0.tgz",
-      "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==",
+      "version": "0.23.2",
+      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz",
+      "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==",
       "license": "MIT",
-      "peer": true
+      "dependencies": {
+        "loose-envify": "^1.1.0"
+      }
     },
     "node_modules/search-insights": {
       "version": "2.17.3",
@@ -9633,7 +10552,7 @@
       "version": "7.7.3",
       "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.3.tgz",
       "integrity": "sha512-SdsKMrI9TdgjdweUSR9MweHA4EJ8YxHn8DFaDisvhVlUOe4BF1tLD7GAj0lIqWVl+dPb/rExr0Btby5loQm20Q==",
-      "devOptional": true,
+      "dev": true,
       "license": "ISC",
       "bin": {
         "semver": "bin/semver.js"
@@ -9687,52 +10606,6 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
-    "node_modules/sharp": {
-      "version": "0.34.5",
-      "resolved": "https://registry.npmjs.org/sharp/-/sharp-0.34.5.tgz",
-      "integrity": "sha512-Ou9I5Ft9WNcCbXrU9cMgPBcCK8LiwLqcbywW3t4oDV37n1pzpuNLsYiAV8eODnjbtQlSDwZ2cUEeQz4E54Hltg==",
-      "hasInstallScript": true,
-      "license": "Apache-2.0",
-      "optional": true,
-      "peer": true,
-      "dependencies": {
-        "@img/colour": "^1.0.0",
-        "detect-libc": "^2.1.2",
-        "semver": "^7.7.3"
-      },
-      "engines": {
-        "node": "^18.17.0 || ^20.3.0 || >=21.0.0"
-      },
-      "funding": {
-        "url": "https://opencollective.com/libvips"
-      },
-      "optionalDependencies": {
-        "@img/sharp-darwin-arm64": "0.34.5",
-        "@img/sharp-darwin-x64": "0.34.5",
-        "@img/sharp-libvips-darwin-arm64": "1.2.4",
-        "@img/sharp-libvips-darwin-x64": "1.2.4",
-        "@img/sharp-libvips-linux-arm": "1.2.4",
-        "@img/sharp-libvips-linux-arm64": "1.2.4",
-        "@img/sharp-libvips-linux-ppc64": "1.2.4",
-        "@img/sharp-libvips-linux-riscv64": "1.2.4",
-        "@img/sharp-libvips-linux-s390x": "1.2.4",
-        "@img/sharp-libvips-linux-x64": "1.2.4",
-        "@img/sharp-libvips-linuxmusl-arm64": "1.2.4",
-        "@img/sharp-libvips-linuxmusl-x64": "1.2.4",
-        "@img/sharp-linux-arm": "0.34.5",
-        "@img/sharp-linux-arm64": "0.34.5",
-        "@img/sharp-linux-ppc64": "0.34.5",
-        "@img/sharp-linux-riscv64": "0.34.5",
-        "@img/sharp-linux-s390x": "0.34.5",
-        "@img/sharp-linux-x64": "0.34.5",
-        "@img/sharp-linuxmusl-arm64": "0.34.5",
-        "@img/sharp-linuxmusl-x64": "0.34.5",
-        "@img/sharp-wasm32": "0.34.5",
-        "@img/sharp-win32-arm64": "0.34.5",
-        "@img/sharp-win32-ia32": "0.34.5",
-        "@img/sharp-win32-x64": "0.34.5"
-      }
-    },
     "node_modules/shebang-command": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
@@ -9881,11 +10754,42 @@
         "node": ">=18"
       }
     },
+    "node_modules/slice-ansi": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-7.1.2.tgz",
+      "integrity": "sha512-iOBWFgUX7caIZiuutICxVgX1SdxwAVFFKwt1EvMYYec/NWO5meOJ6K5uQxhrYBdQJne4KxiqZc+KptFOWFSI9w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.1",
+        "is-fullwidth-code-point": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/slice-ansi?sponsor=1"
+      }
+    },
+    "node_modules/slice-ansi/node_modules/ansi-styles": {
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz",
+      "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
     "node_modules/sortablejs": {
       "version": "1.15.6",
       "resolved": "https://registry.npmjs.org/sortablejs/-/sortablejs-1.15.6.tgz",
       "integrity": "sha512-aNfiuwMEpfBM/CN6LY0ibyhxPfPbyFeBTYJKCvzkJ2GkUpazIt3H+QIPAMHwqQ7tMKaHz1Qj+rJJCqljnf4p3A==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/source-map": {
       "version": "0.6.1",
@@ -10034,6 +10938,16 @@
         "safe-buffer": "~5.2.0"
       }
     },
+    "node_modules/string-argv": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/string-argv/-/string-argv-0.3.2.tgz",
+      "integrity": "sha512-aqD2Q0144Z+/RqG52NeHEkZauTAUWJO8c6yTftGJKO3Tja5tUgIfmIl6kExvhtxSDP7fXB6DvzkfMpCd/F3G+Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.6.19"
+      }
+    },
     "node_modules/string-width": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-5.1.2.tgz",
@@ -10072,6 +10986,15 @@
       "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
       "license": "MIT"
     },
+    "node_modules/string-width-cjs/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/string-width-cjs/node_modules/strip-ansi": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
@@ -10139,6 +11062,19 @@
         "url": "https://github.com/chalk/ansi-regex?sponsor=1"
       }
     },
+    "node_modules/strip-json-comments": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
+      "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/strip-literal": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/strip-literal/-/strip-literal-3.1.0.tgz",
@@ -10236,7 +11172,6 @@
       "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz",
       "integrity": "sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==",
       "license": "Apache-2.0",
-      "peer": true,
       "engines": {
         "node": ">= 0.4"
       }
@@ -10259,9 +11194,9 @@
       "license": "MIT"
     },
     "node_modules/tabbable": {
-      "version": "6.3.0",
-      "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.3.0.tgz",
-      "integrity": "sha512-EIHvdY5bPLuWForiR/AN2Bxngzpuwn1is4asboytXtpTgsArc+WmSJKVLlhdh71u7jFcryDqB2A8lQvj78MkyQ==",
+      "version": "6.4.0",
+      "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-6.4.0.tgz",
+      "integrity": "sha512-05PUHKSNE8ou2dwIxTngl4EzcnsCDZGJ/iCLtDflR/SHB/ny14rXc+qU5P4mG9JkusiV7EivzY9Mhm55AzAvCg==",
       "dev": true,
       "license": "MIT"
     },
@@ -10300,6 +11235,7 @@
       "resolved": "https://registry.npmjs.org/terser/-/terser-5.44.1.tgz",
       "integrity": "sha512-t/R3R/n0MSwnnazuPpPNVO60LX0SKL45pyl9YlvxIdkH0Of7D5qM2EVe+yASRIlY5pZ73nclYJfNANGWPwFDZw==",
       "license": "BSD-2-Clause",
+      "peer": true,
       "dependencies": {
         "@jridgewell/source-map": "^0.3.3",
         "acorn": "^8.15.0",
@@ -10313,6 +11249,12 @@
         "node": ">=10"
       }
     },
+    "node_modules/terser/node_modules/commander": {
+      "version": "2.20.3",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
+      "integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
+      "license": "MIT"
+    },
     "node_modules/tesseract.js": {
       "version": "6.0.1",
       "resolved": "https://registry.npmjs.org/tesseract.js/-/tesseract.js-6.0.1.tgz",
@@ -10352,46 +11294,27 @@
         "node": ">=18"
       }
     },
-    "node_modules/test-exclude/node_modules/glob": {
-      "version": "10.5.0",
-      "resolved": "https://registry.npmjs.org/glob/-/glob-10.5.0.tgz",
-      "integrity": "sha512-DfXN8DfhJ7NH3Oe7cFmu3NCu1wKbkReJ8TorzSAFbSKrlNaQSKfIzqYqVY8zlbs2NLBbWpRiU52GX2PbaBVNkg==",
+    "node_modules/test-exclude/node_modules/brace-expansion": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-2.0.2.tgz",
+      "integrity": "sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^1.0.0"
+      }
+    },
+    "node_modules/test-exclude/node_modules/minimatch": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
+      "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==",
       "dev": true,
       "license": "ISC",
       "dependencies": {
-        "foreground-child": "^3.1.0",
-        "jackspeak": "^3.1.2",
-        "minimatch": "^9.0.4",
-        "minipass": "^7.1.2",
-        "package-json-from-dist": "^1.0.0",
-        "path-scurry": "^1.11.1"
-      },
-      "bin": {
-        "glob": "dist/esm/bin.mjs"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/isaacs"
-      }
-    },
-    "node_modules/test-exclude/node_modules/lru-cache": {
-      "version": "10.4.3",
-      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-10.4.3.tgz",
-      "integrity": "sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==",
-      "dev": true,
-      "license": "ISC"
-    },
-    "node_modules/test-exclude/node_modules/path-scurry": {
-      "version": "1.11.1",
-      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-1.11.1.tgz",
-      "integrity": "sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==",
-      "dev": true,
-      "license": "BlueOak-1.0.0",
-      "dependencies": {
-        "lru-cache": "^10.2.0",
-        "minipass": "^5.0.0 || ^6.0.2 || ^7.0.0"
+        "brace-expansion": "^2.0.1"
       },
       "engines": {
-        "node": ">=16 || 14 >=14.18"
+        "node": ">=16 || 14 >=14.17"
       },
       "funding": {
         "url": "https://github.com/sponsors/isaacs"
@@ -10458,11 +11381,13 @@
       "license": "MIT"
     },
     "node_modules/tinyexec": {
-      "version": "0.3.2",
-      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-0.3.2.tgz",
-      "integrity": "sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==",
-      "dev": true,
-      "license": "MIT"
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.0.2.tgz",
+      "integrity": "sha512-W/KYk+NFhkmsYpuHq5JykngiOCnxeVL8v8dFnqxSD8qEEdRfXk1SDM6JzNqcERbcGYj9tMrDQBYV9cjgnunFIg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
     },
     "node_modules/tinyglobby": {
       "version": "0.2.15",
@@ -10480,6 +11405,36 @@
         "url": "https://github.com/sponsors/SuperchupuDev"
       }
     },
+    "node_modules/tinyglobby/node_modules/fdir": {
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/tinyglobby/node_modules/picomatch": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "license": "MIT",
+      "peer": true,
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
     "node_modules/tinypool": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/tinypool/-/tinypool-1.1.1.tgz",
@@ -10593,16 +11548,6 @@
         "node": ">=20"
       }
     },
-    "node_modules/tr46/node_modules/punycode": {
-      "version": "2.3.1",
-      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
-      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
-      "dev": true,
-      "license": "MIT",
-      "engines": {
-        "node": ">=6"
-      }
-    },
     "node_modules/trim-lines": {
       "version": "3.0.1",
       "resolved": "https://registry.npmjs.org/trim-lines/-/trim-lines-3.0.1.tgz",
@@ -10614,6 +11559,19 @@
         "url": "https://github.com/sponsors/wooorm"
       }
     },
+    "node_modules/ts-api-utils": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.4.0.tgz",
+      "integrity": "sha512-3TaVTaAv2gTiMB35i3FiGJaRfwb3Pyn/j3m/bfAvGe8FB7CF6u+LMYqYlDh7reQf7UNvoTvdfAqHGmPGOSsPmA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.12"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4"
+      }
+    },
     "node_modules/ts-dedent": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/ts-dedent/-/ts-dedent-2.2.0.tgz",
@@ -10636,6 +11594,19 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/type-check": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
+      "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "prelude-ls": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
     "node_modules/typed-array-buffer": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.3.tgz",
@@ -10657,6 +11628,7 @@
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
       "devOptional": true,
       "license": "Apache-2.0",
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -10665,6 +11637,30 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/typescript-eslint": {
+      "version": "8.51.0",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.51.0.tgz",
+      "integrity": "sha512-jh8ZuM5oEh2PSdyQG9YAEM1TCGuWenLSuSUhf/irbVUNW9O5FhbFVONviN2TgMTBnUmyHv7E56rYnfLZK6TkiA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/eslint-plugin": "8.51.0",
+        "@typescript-eslint/parser": "8.51.0",
+        "@typescript-eslint/typescript-estree": "8.51.0",
+        "@typescript-eslint/utils": "8.51.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0",
+        "typescript": ">=4.8.4 <6.0.0"
+      }
+    },
     "node_modules/uc.micro": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
@@ -10792,6 +11788,16 @@
         "node": ">= 10.0.0"
       }
     },
+    "node_modules/uri-js": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
+      "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "punycode": "^2.1.0"
+      }
+    },
     "node_modules/url": {
       "version": "0.11.4",
       "resolved": "https://registry.npmjs.org/url/-/url-0.11.4.tgz",
@@ -10806,6 +11812,13 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/url/node_modules/punycode": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
+      "integrity": "sha512-jmYNElW7yvO7TV33CjSmvSiE2yco3bV2czu/OzDKdMNVZQWfxCblURLhf+47syQRBntjfLdd/H0egrzIG+oaFQ==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/utif": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/utif/-/utif-3.1.0.tgz",
@@ -10892,6 +11905,7 @@
       "resolved": "https://registry.npmjs.org/vite/-/vite-7.3.0.tgz",
       "integrity": "sha512-dZwN5L1VlUBewiP6H9s2+B3e3Jg96D0vzN+Ry73sOefebhYr9f94wwkMNN/9ouoU8pV1BqA1d1zGk8928cx0rg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.27.0",
         "fdir": "^6.5.0",
@@ -11034,6 +12048,36 @@
         "vite": "^5.0.0 || ^6.0.0 || ^7.0.0"
       }
     },
+    "node_modules/vite/node_modules/fdir": {
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vite/node_modules/picomatch": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "license": "MIT",
+      "peer": true,
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
     "node_modules/vitepress": {
       "version": "1.6.4",
       "resolved": "https://registry.npmjs.org/vitepress/-/vitepress-1.6.4.tgz",
@@ -11526,6 +12570,7 @@
       "integrity": "sha512-o5a9xKjbtuhY6Bi5S3+HvbRERmouabWbyUcpXXUA1u+GNUKoROi9byOJ8M0nHbHYHkYICiMlqxkg1KkYmm25Sw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.21.3",
         "postcss": "^8.4.43",
@@ -11586,6 +12631,7 @@
       "integrity": "sha512-LUCP5ev3GURDysTWiP47wRRUpLKMOfPh+yKTx3kVIEiu5KOMeqzpnYNsKyOoVrULivR8tLcks4+lga33Whn90A==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/chai": "^5.2.2",
         "@vitest/expect": "3.2.4",
@@ -11653,6 +12699,26 @@
         }
       }
     },
+    "node_modules/vitest/node_modules/picomatch": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
+      "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/vitest/node_modules/tinyexec": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-0.3.2.tgz",
+      "integrity": "sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/vm-browserify": {
       "version": "1.1.2",
       "resolved": "https://registry.npmjs.org/vm-browserify/-/vm-browserify-1.1.2.tgz",
@@ -11714,6 +12780,7 @@
       "resolved": "https://registry.npmjs.org/vue/-/vue-3.5.26.tgz",
       "integrity": "sha512-SJ/NTccVyAoNUJmkM9KUqPcYlY+u8OVL1X5EW9RIs3ch5H2uERxyyIUI4MRxVCSOiEcupX9xNGde1tL9ZKpimA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@vue/compiler-dom": "3.5.26",
         "@vue/compiler-sfc": "3.5.26",
@@ -11750,28 +12817,15 @@
       "license": "Apache-2.0"
     },
     "node_modules/webidl-conversions": {
-      "version": "8.0.0",
-      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-8.0.0.tgz",
-      "integrity": "sha512-n4W4YFyz5JzOfQeA8oN7dUYpR+MBP3PIUsn2jLjWXwK5ASUzt0Jc/A5sAUZoCYFJRGF0FBKJ+1JjN43rNdsQzA==",
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-8.0.1.tgz",
+      "integrity": "sha512-BMhLD/Sw+GbJC21C/UgyaZX41nPt8bUTg+jWyDeg7e7YN4xOM05YPSIXceACnXVtqyEw/LMClUQMtMZ+PGGpqQ==",
       "dev": true,
       "license": "BSD-2-Clause",
       "engines": {
         "node": ">=20"
       }
     },
-    "node_modules/whatwg-encoding": {
-      "version": "3.1.1",
-      "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-3.1.1.tgz",
-      "integrity": "sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "iconv-lite": "0.6.3"
-      },
-      "engines": {
-        "node": ">=18"
-      }
-    },
     "node_modules/whatwg-mimetype": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
@@ -11850,6 +12904,16 @@
         "node": ">=8"
       }
     },
+    "node_modules/word-wrap": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
+      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/wrap-ansi": {
       "version": "8.1.0",
       "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-8.1.0.tgz",
@@ -11885,27 +12949,21 @@
         "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
       }
     },
-    "node_modules/wrap-ansi-cjs/node_modules/ansi-styles": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-      "license": "MIT",
-      "dependencies": {
-        "color-convert": "^2.0.1"
-      },
-      "engines": {
-        "node": ">=8"
-      },
-      "funding": {
-        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
-      }
-    },
     "node_modules/wrap-ansi-cjs/node_modules/emoji-regex": {
       "version": "8.0.0",
       "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
       "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
       "license": "MIT"
     },
+    "node_modules/wrap-ansi-cjs/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/wrap-ansi-cjs/node_modules/string-width": {
       "version": "4.2.3",
       "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
@@ -12005,6 +13063,22 @@
         "node": ">=0.4"
       }
     },
+    "node_modules/yaml": {
+      "version": "2.8.2",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.2.tgz",
+      "integrity": "sha512-mplynKqc1C2hTVYxd0PU2xQAc22TI1vShAYGksCCfxbn/dFwnHTNi1bvYsBTkhdUNtGIf5xNOg938rrSSYvS9A==",
+      "devOptional": true,
+      "license": "ISC",
+      "bin": {
+        "yaml": "bin.mjs"
+      },
+      "engines": {
+        "node": ">= 14.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/eemeli"
+      }
+    },
     "node_modules/yocto-queue": {
       "version": "0.1.0",
       "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
@@ -12018,12 +13092,23 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/zgapdfsigner": {
+      "version": "2.7.5",
+      "resolved": "https://registry.npmjs.org/zgapdfsigner/-/zgapdfsigner-2.7.5.tgz",
+      "integrity": "sha512-MXVFjyyhb2RSYf1f+JXFBllH7EVZI4V/wS6nMxXJwtqgve4GplkX7gPkpVoByhKdFRIX8JB4hSP4w65d7gT/zg==",
+      "license": "MIT",
+      "dependencies": {
+        "follow-redirects": "1.15.6",
+        "node-forge": "1.3.1",
+        "pdf-fontkit": "1.8.9",
+        "pdf-lib": "1.17.1"
+      }
+    },
     "node_modules/zimmerframe": {
       "version": "1.1.4",
       "resolved": "https://registry.npmjs.org/zimmerframe/-/zimmerframe-1.1.4.tgz",
       "integrity": "sha512-B58NGBEoc8Y9MWWCQGl/gq9xBCe4IiKM0a2x7GZdQKOW5Exr8S1W24J6OgM1njK8xCRGvAJIL/MxXHf6SkmQKQ==",
-      "license": "MIT",
-      "peer": true
+      "license": "MIT"
     },
     "node_modules/zip-stream": {
       "version": "6.0.1",
@@ -12049,9 +13134,9 @@
       }
     },
     "node_modules/zod": {
-      "version": "4.2.1",
-      "resolved": "https://registry.npmjs.org/zod/-/zod-4.2.1.tgz",
-      "integrity": "sha512-0wZ1IRqGGhMP76gLqz8EyfBXKk0J2qo2+H3fi4mcUP/KtTocoX08nmIAHl1Z2kJIZbZee8KOpBCSNPRgauucjw==",
+      "version": "4.3.5",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-4.3.5.tgz",
+      "integrity": "sha512-k7Nwx6vuWx1IJ9Bjuf4Zt1PEllcwe7cls3VNzm4CQ1/hgtFUK2bRNG3rvnpPUhFjmqJKAKtjV576KnUkHocg/g==",
       "license": "MIT",
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
diff --git a/package.json b/package.json
index 4e8ba5d..3b9ae0a 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "bento-pdf",
   "private": true,
-  "version": "1.15.3",
+  "version": "1.15.4",
   "license": "AGPL-3.0-only",
   "type": "module",
   "scripts": {
@@ -12,6 +12,7 @@
     "build:brotli": "COMPRESSION_MODE=b npm run build",
     "build:original": "COMPRESSION_MODE=o npm run build",
     "build:all": "COMPRESSION_MODE=all npm run build",
+    "build:production": "VITE_USE_CDN=true npm run build:with-docs",
     "preview": "vite preview",
     "obfuscate": "node scripts/build.mjs",
     "test": "vitest",
@@ -30,9 +31,13 @@
     "package": "node scripts/package-dist.js",
     "docs:dev": "vitepress dev docs",
     "docs:build": "vitepress build docs",
-    "docs:preview": "vitepress preview docs"
+    "docs:preview": "vitepress preview docs",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix",
+    "prepare": "husky"
   },
   "devDependencies": {
+    "@eslint/js": "^9.39.2",
     "@testing-library/dom": "^10.4.1",
     "@types/blob-stream": "^0.1.33",
     "@types/html2canvas": "^1.0.0",
@@ -41,9 +46,15 @@
     "@types/utif": "^3.0.6",
     "@vitest/coverage-v8": "^3.2.4",
     "@vitest/ui": "^3.2.4",
+    "eslint": "^9.39.2",
+    "eslint-config-prettier": "^10.1.8",
+    "globals": "^17.0.0",
+    "husky": "^9.1.7",
     "jsdom": "^27.0.1",
+    "lint-staged": "^16.2.7",
     "prettier": "^3.6.2",
     "typescript": "~5.9.3",
+    "typescript-eslint": "^8.51.0",
     "vite": "^7.1.11",
     "vite-plugin-compression": "^0.5.1",
     "vite-plugin-node-polyfills": "^0.24.0",
@@ -53,7 +64,7 @@
   },
   "dependencies": {
     "@bentopdf/gs-wasm": "^0.1.0",
-    "@bentopdf/pymupdf-wasm": "^0.1.9",
+    "@bentopdf/pymupdf-wasm": "^0.1.10",
     "@fontsource/cedarville-cursive": "^5.2.7",
     "@fontsource/dancing-script": "^5.2.8",
     "@fontsource/dm-sans": "^5.2.8",
@@ -67,6 +78,7 @@
     "@phosphor-icons/web": "^2.1.2",
     "@tailwindcss/vite": "^4.1.15",
     "@types/markdown-it": "^14.1.2",
+    "@types/node-forge": "^1.3.14",
     "@types/papaparse": "^5.5.2",
     "archiver": "^7.0.1",
     "blob-stream": "^0.1.3",
@@ -95,6 +107,7 @@
     "markdown-it-task-lists": "^2.1.1",
     "markdown-it-toc-done-right": "^4.2.0",
     "mermaid": "^11.12.2",
+    "node-forge": "^1.3.3",
     "papaparse": "^5.5.3",
     "pdf-lib": "^1.17.1",
     "pdfjs-dist": "^5.4.296",
@@ -106,6 +119,21 @@
     "tiff": "^7.1.2",
     "utif": "^3.1.0",
     "vite-plugin-static-copy": "^3.1.4",
-    "xlsx": "file:vendor/sheetjs/xlsx-0.20.2.tgz"
+    "xlsx": "file:vendor/sheetjs/xlsx-0.20.2.tgz",
+    "zgapdfsigner": "^2.7.5"
+  },
+  "lint-staged": {
+    "*.{js,ts,mjs,cjs}": [
+      "eslint --fix",
+      "prettier --write"
+    ],
+    "*.{json,md,html,css}": [
+      "prettier --write"
+    ]
+  },
+  "overrides": {
+    "node-forge": "^1.3.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   }
 }
diff --git a/pdf-converter.html b/pdf-converter.html
index 3a0a1a7..15f3c65 100644
--- a/pdf-converter.html
+++ b/pdf-converter.html
@@ -4,50 +4,54 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>PDF Converter - Free Online PDF Converter Tools | BentoPDF</title>
-  <meta name="description" content="Convert PDFs to 40+ formats and vice versa. Free online PDF converter - Word, Excel, JPG, PNG, and more. Privacy-first conversion in your browser.">
-  <meta name="keywords" content="pdf converter, word to pdf, excel to pdf, powerpoint to pdf, jpg to pdf, png to pdf, image to pdf, webp to pdf, svg to pdf, heic to pdf, tiff to pdf, bmp to pdf, text to pdf, markdown to pdf, csv to pdf, json to pdf, pdf to word, pdf to excel, pdf to jpg, pdf to png, pdf to text, pdf to markdown, pdf to csv, pdf to json, pdf to svg, pdf to webp, pdf to tiff, pdf to bmp, pdf to greyscale, pdf to pdf/a, pdf to zip, odt to pdf, ods to pdf, odp to pdf, odg to pdf, rtf to pdf, epub to pdf, mobi to pdf, cbz to pdf, fb2 to pdf, psd to pdf, xps to pdf, pages to pdf, pub to pdf, vsd to pdf, wpd to pdf, wps to pdf, xml to pdf">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/pdf-converter">
-  
-  <!-- Open Graph -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/pdf-converter">
-  <meta property="og:title" content="PDF Converter - Free Online PDF Converter Tools | BentoPDF">
-  <meta property="og:description" content="Convert PDFs to 40+ formats and vice versa. Free online PDF converter - Word, Excel, JPG, PNG, and more. Privacy-first conversion in your browser.">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-converter.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:title" content="PDF Converter - Free Online Tools">
-  <meta name="twitter:description" content="Convert PDFs to 40+ formats and vice versa. Free online PDF converter - Word, Excel, JPG, PNG, and more. Privacy-first conversion in your browser.">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-converter.png">
-  <meta name="twitter:site" content="@BentoPDF">
 
-    
-    
+    <!-- Primary Meta Tags -->
+    <title>PDF Converter - Free Online PDF Converter Tools | BentoPDF</title>
+    <meta name="description"
+        content="Convert PDFs to 40+ formats and vice versa. Free online PDF converter - Word, Excel, JPG, PNG, and more. Privacy-first conversion in your browser.">
+    <meta name="keywords"
+        content="pdf converter, word to pdf, excel to pdf, powerpoint to pdf, jpg to pdf, png to pdf, image to pdf, webp to pdf, svg to pdf, heic to pdf, tiff to pdf, bmp to pdf, text to pdf, markdown to pdf, csv to pdf, json to pdf, pdf to word, pdf to excel, pdf to jpg, pdf to png, pdf to text, pdf to markdown, pdf to csv, pdf to json, pdf to svg, pdf to webp, pdf to tiff, pdf to bmp, pdf to greyscale, pdf to pdf/a, pdf to zip, odt to pdf, ods to pdf, odp to pdf, odg to pdf, rtf to pdf, epub to pdf, mobi to pdf, cbz to pdf, fb2 to pdf, psd to pdf, xps to pdf, pages to pdf, pub to pdf, vsd to pdf, wpd to pdf, wps to pdf, xml to pdf">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/pdf-converter">
+
+    <!-- Open Graph -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/pdf-converter">
+    <meta property="og:title" content="PDF Converter - Free Online PDF Converter Tools | BentoPDF">
+    <meta property="og:description"
+        content="Convert PDFs to 40+ formats and vice versa. Free online PDF converter - Word, Excel, JPG, PNG, and more. Privacy-first conversion in your browser.">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-converter.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:title" content="PDF Converter - Free Online Tools">
+    <meta name="twitter:description"
+        content="Convert PDFs to 40+ formats and vice versa. Free online PDF converter - Word, Excel, JPG, PNG, and more. Privacy-first conversion in your browser.">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-converter.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+
+
     <link href="/src/css/styles.css" rel="stylesheet" />
     <script type="module">
         import '@phosphor-icons/web/regular';
     </script>
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -56,7 +60,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -73,7 +77,8 @@
                     <button id="mobile-menu-button" type="button"
                         class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700">
                         <svg id="menu-icon" class="block h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M4 6h16M4 12h16M4 18h16" />
                         </svg>
                     </button>
                 </div>
@@ -93,9 +98,13 @@
     <!-- Hero Section -->
     <section class="container mx-auto px-4 py-12 md:py-16">
         <div class="max-w-4xl mx-auto text-center">
-            <h1 class="text-3xl md:text-5xl font-bold text-white mb-6">PDF Converter - Free Online PDF Conversion Tools</h1>
+            <h1 class="text-3xl md:text-5xl font-bold text-white mb-6">PDF Converter - Free Online PDF Conversion Tools
+            </h1>
             <p class="text-lg md:text-xl text-gray-300 mb-8">
-                Convert your PDFs to and from 40+ different file formats with BentoPDF's comprehensive conversion tools. Transform PDFs to Word, Excel, images, text, and many other formats - or convert files into PDFs. All conversions happen locally in your browser, ensuring complete privacy. No file uploads, no cloud processing, completely free.
+                Convert your PDFs to and from 40+ different file formats with BentoPDF's comprehensive conversion tools.
+                Transform PDFs to Word, Excel, images, text, and many other formats - or convert files into PDFs. All
+                conversions happen locally in your browser, ensuring complete privacy. No file uploads, no cloud
+                processing, completely free.
             </p>
         </div>
     </section>
@@ -103,7 +112,7 @@
     <!-- Tools Grid Section -->
     <section class="container mx-auto px-4 py-8">
         <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">All PDF Converter Tools</h2>
-        
+
         <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4">
             <a href="/src/pages/word-to-pdf.html" class="tool-card">
                 <i class="ph ph-microsoft-word-logo text-4xl text-indigo-400 mb-2"></i>
@@ -346,31 +355,36 @@
     <!-- Why Choose Section -->
     <section class="container mx-auto px-4 py-12">
         <div class="max-w-4xl mx-auto">
-            <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">Why Use BentoPDF PDF Converter Tools?</h2>
-            
+            <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">Why Use BentoPDF PDF Converter Tools?
+            </h2>
+
             <div class="grid md:grid-cols-2 gap-6">
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-shield-check text-5xl text-indigo-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">100% Privacy-First</h3>
-                    <p class="text-gray-400">All operations happen in your browser. Your files never leave your device, never uploaded to servers. Complete privacy guaranteed.</p>
+                    <p class="text-gray-400">All operations happen in your browser. Your files never leave your device,
+                        never uploaded to servers. Complete privacy guaranteed.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-infinity text-5xl text-purple-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">Unlimited & Free</h3>
-                    <p class="text-gray-400">Use all tools as many times as you want, with files of any size. No file limits, no tool limits. Completely free forever.</p>
+                    <p class="text-gray-400">Use all tools as many times as you want, with files of any size. No file
+                        limits, no tool limits. Completely free forever.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-lightning text-5xl text-yellow-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">Lightning Fast</h3>
-                    <p class="text-gray-400">Browser-based processing means instant results. No waiting for uploads or downloads. Works offline after page load.</p>
+                    <p class="text-gray-400">Browser-based processing means instant results. No waiting for uploads or
+                        downloads. Works offline after page load.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-user-minus text-5xl text-red-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">No Signup Required</h3>
-                    <p class="text-gray-400">Start using tools immediately. No account creation, no email, no personal information needed. Just open and use.</p>
+                    <p class="text-gray-400">Start using tools immediately. No account creation, no email, no personal
+                        information needed. Just open and use.</p>
                 </div>
             </div>
         </div>
@@ -380,38 +394,42 @@
     <section class="container mx-auto px-4 py-12">
         <div class="max-w-4xl mx-auto">
             <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-            
+
             <div class="space-y-4">
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Are these pdf converter tools really free?
                         <i class="ph ph-caret-down text-xl"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">Yes! All BentoPDF pdf converter tools are 100% free with no hidden fees, no premium tiers, and no subscription required. Use unlimited tools, unlimited times.</p>
+                    <p class="mt-3 text-gray-400">Yes! All BentoPDF pdf converter tools are 100% free with no hidden
+                        fees, no premium tiers, and no subscription required. Use unlimited tools, unlimited times.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Are my files private and secure?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">Absolutely! All processing happens entirely in your browser. Your files never leave your device, are never uploaded to servers. Complete privacy guaranteed.</p>
+                    <p class="mt-3 text-gray-400">Absolutely! All processing happens entirely in your browser. Your
+                        files never leave your device, are never uploaded to servers. Complete privacy guaranteed.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Is there a file size limit?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">No file size limits! Process files of any size. Browser-based processing means no artificial limitations.</p>
+                    <p class="mt-3 text-gray-400">No file size limits! Process files of any size. Browser-based
+                        processing means no artificial limitations.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Do I need to install software?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">No installation required! All tools are web-based and work directly in your browser. Just open the page and start using - works on any device.</p>
+                    <p class="mt-3 text-gray-400">No installation required! All tools are web-based and work directly in
+                        your browser. Just open the page and start using - works on any device.</p>
                 </details>
             </div>
         </div>
@@ -423,10 +441,10 @@
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
-                    <p class="text-gray-400 text-sm">© 2025 BentoPDF. All rights reserved.</p>
+                    <p class="text-gray-400 text-sm">© 2026 BentoPDF. All rights reserved.</p>
                     <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
                 </div>
 
@@ -451,16 +469,30 @@
                 <div>
                     <h3 class="font-bold text-white mb-4">Follow Us</h3>
                     <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" /></svg>
+                        <a href="https://github.com/alam00000/bentopdf" target="_blank"
+                            class="text-gray-400 hover:text-indigo-400">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path fill-rule="evenodd"
+                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                                    clip-rule="evenodd" />
+                            </svg>
                         </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" /></svg>
+                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank"
+                            class="text-gray-400 hover:text-indigo-400">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path
+                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+                            </svg>
                         </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"><i data-lucide="linkedin"></i></a>
+                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"><i
+                                data-lucide="instagram"></i></a>
+                        <a href="https://www.linkedin.com/company/bentopdf/"
+                            class="text-gray-400 hover:text-indigo-400"><i data-lucide="linkedin"></i></a>
                         <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" /></svg>
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path
+                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+                            </svg>
                         </a>
                     </div>
                 </div>
@@ -472,11 +504,11 @@
     <script type="module" src="/src/version.ts"></script>
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
-    
+
     <!-- Fix BASE_URL for subdirectory deployment -->
     <script type="module">
         const BASE_URL = import.meta.env.BASE_URL;
-        
+
         // Update all links that have literal / placeholder
         document.querySelectorAll('a[href*="$"]').forEach(link => {
             if (link.href.includes('/')) {
@@ -484,7 +516,7 @@
                 link.setAttribute('href', newHref);
             }
         });
-        
+
         // Update all src attributes
         document.querySelectorAll('[src*="$"]').forEach(elem => {
             if (elem.src.includes('/')) {
diff --git a/pdf-editor.html b/pdf-editor.html
index 09ed3d1..a4ccf4a 100644
--- a/pdf-editor.html
+++ b/pdf-editor.html
@@ -4,50 +4,54 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>PDF Editor - Free Online PDF Editor Tools | BentoPDF</title>
-  <meta name="description" content="Edit, modify, and enhance your PDFs with 25+ free online tools. Compress, rotate, crop, add watermarks, page numbers, and more. Privacy-first PDF editing in your browser.">
-  <meta name="keywords" content="pdf editor, edit pdf, compress pdf, rotate pdf, crop pdf, organize pdf, delete pages, add watermark, header & footer, page numbers, background color, text color, invert colors, add blank page, reverse pages, divide pages, remove annotations, remove blank pages, extract pages, extract images, extract tables, n-up pdf, custom rotation, to greyscale">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/pdf-editor">
-  
-  <!-- Open Graph -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/pdf-editor">
-  <meta property="og:title" content="PDF Editor - Free Online PDF Editor Tools | BentoPDF">
-  <meta property="og:description" content="Edit, modify, and enhance your PDFs with 25+ free online tools. Compress, rotate, crop, add watermarks, page numbers, and more. Privacy-first PDF editing in your browser.">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-editor.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:title" content="PDF Editor - Free Online Tools">
-  <meta name="twitter:description" content="Edit, modify, and enhance your PDFs with 25+ free online tools. Compress, rotate, crop, add watermarks, page numbers, and more. Privacy-first PDF editing in your browser.">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-editor.png">
-  <meta name="twitter:site" content="@BentoPDF">
 
-    
-    
+    <!-- Primary Meta Tags -->
+    <title>PDF Editor - Free Online PDF Editor Tools | BentoPDF</title>
+    <meta name="description"
+        content="Edit, modify, and enhance your PDFs with 25+ free online tools. Compress, rotate, crop, add watermarks, page numbers, and more. Privacy-first PDF editing in your browser.">
+    <meta name="keywords"
+        content="pdf editor, edit pdf, compress pdf, rotate pdf, crop pdf, organize pdf, delete pages, add watermark, header & footer, page numbers, background color, text color, invert colors, add blank page, reverse pages, divide pages, remove annotations, remove blank pages, extract pages, extract images, extract tables, n-up pdf, custom rotation, to greyscale">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/pdf-editor">
+
+    <!-- Open Graph -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/pdf-editor">
+    <meta property="og:title" content="PDF Editor - Free Online PDF Editor Tools | BentoPDF">
+    <meta property="og:description"
+        content="Edit, modify, and enhance your PDFs with 25+ free online tools. Compress, rotate, crop, add watermarks, page numbers, and more. Privacy-first PDF editing in your browser.">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-editor.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:title" content="PDF Editor - Free Online Tools">
+    <meta name="twitter:description"
+        content="Edit, modify, and enhance your PDFs with 25+ free online tools. Compress, rotate, crop, add watermarks, page numbers, and more. Privacy-first PDF editing in your browser.">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-editor.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+
+
     <link href="/src/css/styles.css" rel="stylesheet" />
     <script type="module">
         import '@phosphor-icons/web/regular';
     </script>
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -56,7 +60,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -73,7 +77,8 @@
                     <button id="mobile-menu-button" type="button"
                         class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700">
                         <svg id="menu-icon" class="block h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M4 6h16M4 12h16M4 18h16" />
                         </svg>
                     </button>
                 </div>
@@ -95,7 +100,10 @@
         <div class="max-w-4xl mx-auto text-center">
             <h1 class="text-3xl md:text-5xl font-bold text-white mb-6">PDF Editor - Free Online PDF Editing Tools</h1>
             <p class="text-lg md:text-xl text-gray-300 mb-8">
-                Edit and enhance your PDF files with BentoPDF's comprehensive suite of 25+ editing tools. Compress file sizes, rotate pages, crop documents, add watermarks, insert page numbers, change colors, and much more. All editing happens in your browser - your files stay completely private. No signup, no limits, completely free.
+                Edit and enhance your PDF files with BentoPDF's comprehensive suite of 25+ editing tools. Compress file
+                sizes, rotate pages, crop documents, add watermarks, insert page numbers, change colors, and much more.
+                All editing happens in your browser - your files stay completely private. No signup, no limits,
+                completely free.
             </p>
         </div>
     </section>
@@ -103,7 +111,7 @@
     <!-- Tools Grid Section -->
     <section class="container mx-auto px-4 py-8">
         <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">All PDF Editor Tools</h2>
-        
+
         <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4">
             <a href="/src/pages/edit-pdf.html" class="tool-card">
                 <i class="ph ph-pencil-simple text-4xl text-indigo-400 mb-2"></i>
@@ -226,31 +234,36 @@
     <!-- Why Choose Section -->
     <section class="container mx-auto px-4 py-12">
         <div class="max-w-4xl mx-auto">
-            <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">Why Use BentoPDF PDF Editor Tools?</h2>
-            
+            <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">Why Use BentoPDF PDF Editor Tools?
+            </h2>
+
             <div class="grid md:grid-cols-2 gap-6">
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-shield-check text-5xl text-indigo-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">100% Privacy-First</h3>
-                    <p class="text-gray-400">All operations happen in your browser. Your files never leave your device, never uploaded to servers. Complete privacy guaranteed.</p>
+                    <p class="text-gray-400">All operations happen in your browser. Your files never leave your device,
+                        never uploaded to servers. Complete privacy guaranteed.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-infinity text-5xl text-purple-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">Unlimited & Free</h3>
-                    <p class="text-gray-400">Use all tools as many times as you want, with files of any size. No file limits, no tool limits. Completely free forever.</p>
+                    <p class="text-gray-400">Use all tools as many times as you want, with files of any size. No file
+                        limits, no tool limits. Completely free forever.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-lightning text-5xl text-yellow-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">Lightning Fast</h3>
-                    <p class="text-gray-400">Browser-based processing means instant results. No waiting for uploads or downloads. Works offline after page load.</p>
+                    <p class="text-gray-400">Browser-based processing means instant results. No waiting for uploads or
+                        downloads. Works offline after page load.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-user-minus text-5xl text-red-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">No Signup Required</h3>
-                    <p class="text-gray-400">Start using tools immediately. No account creation, no email, no personal information needed. Just open and use.</p>
+                    <p class="text-gray-400">Start using tools immediately. No account creation, no email, no personal
+                        information needed. Just open and use.</p>
                 </div>
             </div>
         </div>
@@ -260,38 +273,42 @@
     <section class="container mx-auto px-4 py-12">
         <div class="max-w-4xl mx-auto">
             <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-            
+
             <div class="space-y-4">
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Are these pdf editor tools really free?
                         <i class="ph ph-caret-down text-xl"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">Yes! All BentoPDF pdf editor tools are 100% free with no hidden fees, no premium tiers, and no subscription required. Use unlimited tools, unlimited times.</p>
+                    <p class="mt-3 text-gray-400">Yes! All BentoPDF pdf editor tools are 100% free with no hidden fees,
+                        no premium tiers, and no subscription required. Use unlimited tools, unlimited times.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Are my files private and secure?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">Absolutely! All processing happens entirely in your browser. Your files never leave your device, are never uploaded to servers. Complete privacy guaranteed.</p>
+                    <p class="mt-3 text-gray-400">Absolutely! All processing happens entirely in your browser. Your
+                        files never leave your device, are never uploaded to servers. Complete privacy guaranteed.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Is there a file size limit?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">No file size limits! Process files of any size. Browser-based processing means no artificial limitations.</p>
+                    <p class="mt-3 text-gray-400">No file size limits! Process files of any size. Browser-based
+                        processing means no artificial limitations.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Do I need to install software?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">No installation required! All tools are web-based and work directly in your browser. Just open the page and start using - works on any device.</p>
+                    <p class="mt-3 text-gray-400">No installation required! All tools are web-based and work directly in
+                        your browser. Just open the page and start using - works on any device.</p>
                 </details>
             </div>
         </div>
@@ -303,10 +320,10 @@
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
-                    <p class="text-gray-400 text-sm">© 2025 BentoPDF. All rights reserved.</p>
+                    <p class="text-gray-400 text-sm">© 2026 BentoPDF. All rights reserved.</p>
                     <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
                 </div>
 
@@ -331,16 +348,30 @@
                 <div>
                     <h3 class="font-bold text-white mb-4">Follow Us</h3>
                     <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" /></svg>
+                        <a href="https://github.com/alam00000/bentopdf" target="_blank"
+                            class="text-gray-400 hover:text-indigo-400">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path fill-rule="evenodd"
+                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                                    clip-rule="evenodd" />
+                            </svg>
                         </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" /></svg>
+                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank"
+                            class="text-gray-400 hover:text-indigo-400">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path
+                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+                            </svg>
                         </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"><i data-lucide="linkedin"></i></a>
+                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"><i
+                                data-lucide="instagram"></i></a>
+                        <a href="https://www.linkedin.com/company/bentopdf/"
+                            class="text-gray-400 hover:text-indigo-400"><i data-lucide="linkedin"></i></a>
                         <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" /></svg>
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path
+                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+                            </svg>
                         </a>
                     </div>
                 </div>
@@ -352,11 +383,11 @@
     <script type="module" src="/src/version.ts"></script>
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
-    
+
     <!-- Fix BASE_URL for subdirectory deployment -->
     <script type="module">
         const BASE_URL = import.meta.env.BASE_URL;
-        
+
         // Update all links that have literal / placeholder
         document.querySelectorAll('a[href*="$"]').forEach(link => {
             if (link.href.includes('/')) {
@@ -364,7 +395,7 @@
                 link.setAttribute('href', newHref);
             }
         });
-        
+
         // Update all src attributes
         document.querySelectorAll('[src*="$"]').forEach(elem => {
             if (elem.src.includes('/')) {
diff --git a/pdf-merge-split.html b/pdf-merge-split.html
index e72b4d3..3135fa2 100644
--- a/pdf-merge-split.html
+++ b/pdf-merge-split.html
@@ -4,50 +4,54 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>PDF Merge & Split - Free Online PDF Merge & Split Tools | BentoPDF</title>
-  <meta name="description" content="Merge multiple PDFs into one or split PDFs into separate files. Organize, combine, divide, and rearrange PDF pages. Free online PDF merge and split tools - no signup required.">
-  <meta name="keywords" content="pdf merge & split, merge pdf, split pdf, organize pdf, extract pages, delete pages, divide pages, add blank page, reverse pages, alternate merge, combine pages, compare pdfs, pdf booklet">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/pdf-merge-split">
-  
-  <!-- Open Graph -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/pdf-merge-split">
-  <meta property="og:title" content="PDF Merge & Split - Free Online PDF Merge & Split Tools | BentoPDF">
-  <meta property="og:description" content="Merge multiple PDFs into one or split PDFs into separate files. Organize, combine, divide, and rearrange PDF pages. Free online PDF merge and split tools - no signup required.">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-merge-split.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:title" content="PDF Merge & Split - Free Online Tools">
-  <meta name="twitter:description" content="Merge multiple PDFs into one or split PDFs into separate files. Organize, combine, divide, and rearrange PDF pages. Free online PDF merge and split tools - no signup required.">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-merge-split.png">
-  <meta name="twitter:site" content="@BentoPDF">
 
-    
-    
+    <!-- Primary Meta Tags -->
+    <title>PDF Merge & Split - Free Online PDF Merge & Split Tools | BentoPDF</title>
+    <meta name="description"
+        content="Merge multiple PDFs into one or split PDFs into separate files. Organize, combine, divide, and rearrange PDF pages. Free online PDF merge and split tools - no signup required.">
+    <meta name="keywords"
+        content="pdf merge & split, merge pdf, split pdf, organize pdf, extract pages, delete pages, divide pages, add blank page, reverse pages, alternate merge, combine pages, compare pdfs, pdf booklet">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/pdf-merge-split">
+
+    <!-- Open Graph -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/pdf-merge-split">
+    <meta property="og:title" content="PDF Merge & Split - Free Online PDF Merge & Split Tools | BentoPDF">
+    <meta property="og:description"
+        content="Merge multiple PDFs into one or split PDFs into separate files. Organize, combine, divide, and rearrange PDF pages. Free online PDF merge and split tools - no signup required.">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-merge-split.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:title" content="PDF Merge & Split - Free Online Tools">
+    <meta name="twitter:description"
+        content="Merge multiple PDFs into one or split PDFs into separate files. Organize, combine, divide, and rearrange PDF pages. Free online PDF merge and split tools - no signup required.">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-merge-split.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+
+
     <link href="/src/css/styles.css" rel="stylesheet" />
     <script type="module">
         import '@phosphor-icons/web/regular';
     </script>
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -56,7 +60,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -73,7 +77,8 @@
                     <button id="mobile-menu-button" type="button"
                         class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700">
                         <svg id="menu-icon" class="block h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M4 6h16M4 12h16M4 18h16" />
                         </svg>
                     </button>
                 </div>
@@ -93,9 +98,13 @@
     <!-- Hero Section -->
     <section class="container mx-auto px-4 py-12 md:py-16">
         <div class="max-w-4xl mx-auto text-center">
-            <h1 class="text-3xl md:text-5xl font-bold text-white mb-6">PDF Merge & Split Tools - Combine & Separate PDFs Free</h1>
+            <h1 class="text-3xl md:text-5xl font-bold text-white mb-6">PDF Merge & Split Tools - Combine & Separate PDFs
+                Free</h1>
             <p class="text-lg md:text-xl text-gray-300 mb-8">
-                Combine multiple PDF files into one document or split large PDFs into smaller files with BentoPDF's merge and split tools. Reorder pages, extract specific sections, alternate merge documents, and organize your PDFs exactly how you need them. Browser-based processing ensures your files stay private. No limits on file count or size.
+                Combine multiple PDF files into one document or split large PDFs into smaller files with BentoPDF's
+                merge and split tools. Reorder pages, extract specific sections, alternate merge documents, and organize
+                your PDFs exactly how you need them. Browser-based processing ensures your files stay private. No limits
+                on file count or size.
             </p>
         </div>
     </section>
@@ -103,7 +112,7 @@
     <!-- Tools Grid Section -->
     <section class="container mx-auto px-4 py-8">
         <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">All PDF Merge & Split Tools</h2>
-        
+
         <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4">
             <a href="/src/pages/merge-pdf.html" class="tool-card">
                 <i class="ph ph-browsers text-4xl text-indigo-400 mb-2"></i>
@@ -171,31 +180,36 @@
     <!-- Why Choose Section -->
     <section class="container mx-auto px-4 py-12">
         <div class="max-w-4xl mx-auto">
-            <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">Why Use BentoPDF PDF Merge & Split Tools?</h2>
-            
+            <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">Why Use BentoPDF PDF Merge & Split
+                Tools?</h2>
+
             <div class="grid md:grid-cols-2 gap-6">
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-shield-check text-5xl text-indigo-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">100% Privacy-First</h3>
-                    <p class="text-gray-400">All operations happen in your browser. Your files never leave your device, never uploaded to servers. Complete privacy guaranteed.</p>
+                    <p class="text-gray-400">All operations happen in your browser. Your files never leave your device,
+                        never uploaded to servers. Complete privacy guaranteed.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-infinity text-5xl text-purple-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">Unlimited & Free</h3>
-                    <p class="text-gray-400">Use all tools as many times as you want, with files of any size. No file limits, no tool limits. Completely free forever.</p>
+                    <p class="text-gray-400">Use all tools as many times as you want, with files of any size. No file
+                        limits, no tool limits. Completely free forever.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-lightning text-5xl text-yellow-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">Lightning Fast</h3>
-                    <p class="text-gray-400">Browser-based processing means instant results. No waiting for uploads or downloads. Works offline after page load.</p>
+                    <p class="text-gray-400">Browser-based processing means instant results. No waiting for uploads or
+                        downloads. Works offline after page load.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-user-minus text-5xl text-red-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">No Signup Required</h3>
-                    <p class="text-gray-400">Start using tools immediately. No account creation, no email, no personal information needed. Just open and use.</p>
+                    <p class="text-gray-400">Start using tools immediately. No account creation, no email, no personal
+                        information needed. Just open and use.</p>
                 </div>
             </div>
         </div>
@@ -205,38 +219,42 @@
     <section class="container mx-auto px-4 py-12">
         <div class="max-w-4xl mx-auto">
             <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-            
+
             <div class="space-y-4">
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Are these pdf merge & split tools really free?
                         <i class="ph ph-caret-down text-xl"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">Yes! All BentoPDF pdf merge & split tools are 100% free with no hidden fees, no premium tiers, and no subscription required. Use unlimited tools, unlimited times.</p>
+                    <p class="mt-3 text-gray-400">Yes! All BentoPDF pdf merge & split tools are 100% free with no hidden
+                        fees, no premium tiers, and no subscription required. Use unlimited tools, unlimited times.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Are my files private and secure?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">Absolutely! All processing happens entirely in your browser. Your files never leave your device, are never uploaded to servers. Complete privacy guaranteed.</p>
+                    <p class="mt-3 text-gray-400">Absolutely! All processing happens entirely in your browser. Your
+                        files never leave your device, are never uploaded to servers. Complete privacy guaranteed.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Is there a file size limit?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">No file size limits! Process files of any size. Browser-based processing means no artificial limitations.</p>
+                    <p class="mt-3 text-gray-400">No file size limits! Process files of any size. Browser-based
+                        processing means no artificial limitations.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Do I need to install software?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">No installation required! All tools are web-based and work directly in your browser. Just open the page and start using - works on any device.</p>
+                    <p class="mt-3 text-gray-400">No installation required! All tools are web-based and work directly in
+                        your browser. Just open the page and start using - works on any device.</p>
                 </details>
             </div>
         </div>
@@ -248,10 +266,10 @@
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
-                    <p class="text-gray-400 text-sm">© 2025 BentoPDF. All rights reserved.</p>
+                    <p class="text-gray-400 text-sm">© 2026 BentoPDF. All rights reserved.</p>
                     <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
                 </div>
 
@@ -276,16 +294,30 @@
                 <div>
                     <h3 class="font-bold text-white mb-4">Follow Us</h3>
                     <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" /></svg>
+                        <a href="https://github.com/alam00000/bentopdf" target="_blank"
+                            class="text-gray-400 hover:text-indigo-400">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path fill-rule="evenodd"
+                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                                    clip-rule="evenodd" />
+                            </svg>
                         </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" /></svg>
+                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank"
+                            class="text-gray-400 hover:text-indigo-400">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path
+                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+                            </svg>
                         </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"><i data-lucide="linkedin"></i></a>
+                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"><i
+                                data-lucide="instagram"></i></a>
+                        <a href="https://www.linkedin.com/company/bentopdf/"
+                            class="text-gray-400 hover:text-indigo-400"><i data-lucide="linkedin"></i></a>
                         <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" /></svg>
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path
+                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+                            </svg>
                         </a>
                     </div>
                 </div>
@@ -297,11 +329,11 @@
     <script type="module" src="/src/version.ts"></script>
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
-    
+
     <!-- Fix BASE_URL for subdirectory deployment -->
     <script type="module">
         const BASE_URL = import.meta.env.BASE_URL;
-        
+
         // Update all links that have literal / placeholder
         document.querySelectorAll('a[href*="$"]').forEach(link => {
             if (link.href.includes('/')) {
@@ -309,7 +341,7 @@
                 link.setAttribute('href', newHref);
             }
         });
-        
+
         // Update all src attributes
         document.querySelectorAll('[src*="$"]').forEach(elem => {
             if (elem.src.includes('/')) {
diff --git a/pdf-security.html b/pdf-security.html
index c25e0bc..5f4e0fa 100644
--- a/pdf-security.html
+++ b/pdf-security.html
@@ -4,50 +4,54 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>PDF Security - Free Online PDF Security Tools | BentoPDF</title>
-  <meta name="description" content="Encrypt, decrypt, sign, and secure your PDFs with free online security tools. Password protection, digital signatures, permissions management. Privacy-first security in your browser.">
-  <meta name="keywords" content="pdf security, encrypt pdf, decrypt pdf, sign pdf, remove restrictions, change permissions, sanitize pdf, flatten pdf, linearize pdf, remove metadata, pdf layers">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/pdf-security">
-  
-  <!-- Open Graph -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/pdf-security">
-  <meta property="og:title" content="PDF Security - Free Online PDF Security Tools | BentoPDF">
-  <meta property="og:description" content="Encrypt, decrypt, sign, and secure your PDFs with free online security tools. Password protection, digital signatures, permissions management. Privacy-first security in your browser.">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-security.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:title" content="PDF Security - Free Online Tools">
-  <meta name="twitter:description" content="Encrypt, decrypt, sign, and secure your PDFs with free online security tools. Password protection, digital signatures, permissions management. Privacy-first security in your browser.">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-security.png">
-  <meta name="twitter:site" content="@BentoPDF">
 
-    
-    
+    <!-- Primary Meta Tags -->
+    <title>PDF Security - Free Online PDF Security Tools | BentoPDF</title>
+    <meta name="description"
+        content="Encrypt, decrypt, sign, and secure your PDFs with free online security tools. Password protection, digital signatures, permissions management. Privacy-first security in your browser.">
+    <meta name="keywords"
+        content="pdf security, encrypt pdf, decrypt pdf, sign pdf, remove restrictions, change permissions, sanitize pdf, flatten pdf, linearize pdf, remove metadata, pdf layers">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/pdf-security">
+
+    <!-- Open Graph -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/pdf-security">
+    <meta property="og:title" content="PDF Security - Free Online PDF Security Tools | BentoPDF">
+    <meta property="og:description"
+        content="Encrypt, decrypt, sign, and secure your PDFs with free online security tools. Password protection, digital signatures, permissions management. Privacy-first security in your browser.">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-security.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:title" content="PDF Security - Free Online Tools">
+    <meta name="twitter:description"
+        content="Encrypt, decrypt, sign, and secure your PDFs with free online security tools. Password protection, digital signatures, permissions management. Privacy-first security in your browser.">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-security.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+
+
     <link href="/src/css/styles.css" rel="stylesheet" />
     <script type="module">
         import '@phosphor-icons/web/regular';
     </script>
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -56,7 +60,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -73,7 +77,8 @@
                     <button id="mobile-menu-button" type="button"
                         class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700">
                         <svg id="menu-icon" class="block h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M4 6h16M4 12h16M4 18h16" />
                         </svg>
                     </button>
                 </div>
@@ -93,9 +98,13 @@
     <!-- Hero Section -->
     <section class="container mx-auto px-4 py-12 md:py-16">
         <div class="max-w-4xl mx-auto text-center">
-            <h1 class="text-3xl md:text-5xl font-bold text-white mb-6">PDF Security Tools - Protect & Secure Your PDFs Free</h1>
+            <h1 class="text-3xl md:text-5xl font-bold text-white mb-6">PDF Security Tools - Protect & Secure Your PDFs
+                Free</h1>
             <p class="text-lg md:text-xl text-gray-300 mb-8">
-                Protect and secure your PDF documents with BentoPDF's comprehensive security tools. Encrypt with passwords, add digital signatures, manage permissions, remove sensitive data, and more. All security operations happen locally in your browser for maximum privacy. No cloud uploads, no data retention - your documents stay completely confidential.
+                Protect and secure your PDF documents with BentoPDF's comprehensive security tools. Encrypt with
+                passwords, add digital signatures, manage permissions, remove sensitive data, and more. All security
+                operations happen locally in your browser for maximum privacy. No cloud uploads, no data retention -
+                your documents stay completely confidential.
             </p>
         </div>
     </section>
@@ -103,7 +112,7 @@
     <!-- Tools Grid Section -->
     <section class="container mx-auto px-4 py-8">
         <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">All PDF Security Tools</h2>
-        
+
         <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4">
             <a href="/src/pages/encrypt-pdf.html" class="tool-card">
                 <i class="ph ph-lock text-4xl text-indigo-400 mb-2"></i>
@@ -161,31 +170,36 @@
     <!-- Why Choose Section -->
     <section class="container mx-auto px-4 py-12">
         <div class="max-w-4xl mx-auto">
-            <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">Why Use BentoPDF PDF Security Tools?</h2>
-            
+            <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">Why Use BentoPDF PDF Security Tools?
+            </h2>
+
             <div class="grid md:grid-cols-2 gap-6">
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-shield-check text-5xl text-indigo-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">100% Privacy-First</h3>
-                    <p class="text-gray-400">All operations happen in your browser. Your files never leave your device, never uploaded to servers. Complete privacy guaranteed.</p>
+                    <p class="text-gray-400">All operations happen in your browser. Your files never leave your device,
+                        never uploaded to servers. Complete privacy guaranteed.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-infinity text-5xl text-purple-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">Unlimited & Free</h3>
-                    <p class="text-gray-400">Use all tools as many times as you want, with files of any size. No file limits, no tool limits. Completely free forever.</p>
+                    <p class="text-gray-400">Use all tools as many times as you want, with files of any size. No file
+                        limits, no tool limits. Completely free forever.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-lightning text-5xl text-yellow-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">Lightning Fast</h3>
-                    <p class="text-gray-400">Browser-based processing means instant results. No waiting for uploads or downloads. Works offline after page load.</p>
+                    <p class="text-gray-400">Browser-based processing means instant results. No waiting for uploads or
+                        downloads. Works offline after page load.</p>
                 </div>
-                
+
                 <div class="bg-gray-800 p-6 rounded-lg border border-gray-700">
                     <i class="ph ph-user-minus text-5xl text-red-400 mb-4"></i>
                     <h3 class="text-xl font-semibold text-white mb-2">No Signup Required</h3>
-                    <p class="text-gray-400">Start using tools immediately. No account creation, no email, no personal information needed. Just open and use.</p>
+                    <p class="text-gray-400">Start using tools immediately. No account creation, no email, no personal
+                        information needed. Just open and use.</p>
                 </div>
             </div>
         </div>
@@ -195,38 +209,42 @@
     <section class="container mx-auto px-4 py-12">
         <div class="max-w-4xl mx-auto">
             <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-            
+
             <div class="space-y-4">
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Are these pdf security tools really free?
                         <i class="ph ph-caret-down text-xl"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">Yes! All BentoPDF pdf security tools are 100% free with no hidden fees, no premium tiers, and no subscription required. Use unlimited tools, unlimited times.</p>
+                    <p class="mt-3 text-gray-400">Yes! All BentoPDF pdf security tools are 100% free with no hidden
+                        fees, no premium tiers, and no subscription required. Use unlimited tools, unlimited times.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Are my files private and secure?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">Absolutely! All processing happens entirely in your browser. Your files never leave your device, are never uploaded to servers. Complete privacy guaranteed.</p>
+                    <p class="mt-3 text-gray-400">Absolutely! All processing happens entirely in your browser. Your
+                        files never leave your device, are never uploaded to servers. Complete privacy guaranteed.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Is there a file size limit?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">No file size limits! Process files of any size. Browser-based processing means no artificial limitations.</p>
+                    <p class="mt-3 text-gray-400">No file size limits! Process files of any size. Browser-based
+                        processing means no artificial limitations.</p>
                 </details>
-                
+
                 <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
                     <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
                         Do I need to install software?
                         <i data-lucide="chevron-down" class="w-5 h-5"></i>
                     </summary>
-                    <p class="mt-3 text-gray-400">No installation required! All tools are web-based and work directly in your browser. Just open the page and start using - works on any device.</p>
+                    <p class="mt-3 text-gray-400">No installation required! All tools are web-based and work directly in
+                        your browser. Just open the page and start using - works on any device.</p>
                 </details>
             </div>
         </div>
@@ -238,10 +256,10 @@
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
-                    <p class="text-gray-400 text-sm">© 2025 BentoPDF. All rights reserved.</p>
+                    <p class="text-gray-400 text-sm">© 2026 BentoPDF. All rights reserved.</p>
                     <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
                 </div>
 
@@ -266,16 +284,30 @@
                 <div>
                     <h3 class="font-bold text-white mb-4">Follow Us</h3>
                     <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd" /></svg>
+                        <a href="https://github.com/alam00000/bentopdf" target="_blank"
+                            class="text-gray-400 hover:text-indigo-400">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path fill-rule="evenodd"
+                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                                    clip-rule="evenodd" />
+                            </svg>
                         </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" /></svg>
+                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank"
+                            class="text-gray-400 hover:text-indigo-400">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path
+                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+                            </svg>
                         </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"><i data-lucide="linkedin"></i></a>
+                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"><i
+                                data-lucide="instagram"></i></a>
+                        <a href="https://www.linkedin.com/company/bentopdf/"
+                            class="text-gray-400 hover:text-indigo-400"><i data-lucide="linkedin"></i></a>
                         <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" /></svg>
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
+                                <path
+                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+                            </svg>
                         </a>
                     </div>
                 </div>
@@ -287,11 +319,11 @@
     <script type="module" src="/src/version.ts"></script>
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
-    
+
     <!-- Fix BASE_URL for subdirectory deployment -->
     <script type="module">
         const BASE_URL = import.meta.env.BASE_URL;
-        
+
         // Update all links that have literal / placeholder
         document.querySelectorAll('a[href*="$"]').forEach(link => {
             if (link.href.includes('/')) {
@@ -299,7 +331,7 @@
                 link.setAttribute('href', newHref);
             }
         });
-        
+
         // Update all src attributes
         document.querySelectorAll('[src*="$"]').forEach(elem => {
             if (elem.src.includes('/')) {
diff --git a/privacy.html b/privacy.html
index abc294d..cd3915f 100644
--- a/privacy.html
+++ b/privacy.html
@@ -6,28 +6,31 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <!-- Primary Meta Tags -->
   <title>Privacy Policy - Your Data Stays Private | BentoPDF</title>
-  <meta name="description" content="BentoPDF privacy policy: All PDF processing happens in your browser. We never see, store, or upload your files. 100% private and secure.">
+  <meta name="description"
+    content="BentoPDF privacy policy: All PDF processing happens in your browser. We never see, store, or upload your files. 100% private and secure.">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/privacy">
-  
+
   <!-- Open Graph -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/privacy">
   <meta property="og:title" content="Privacy Policy - Your Data Stays Private | BentoPDF">
-  <meta property="og:description" content="BentoPDF privacy policy: All PDF processing happens in your browser. We never see, store, or upload your files. 100% private and secure.">
+  <meta property="og:description"
+    content="BentoPDF privacy policy: All PDF processing happens in your browser. We never see, store, or upload your files. 100% private and secure.">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-privacy.png">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="Privacy Policy - Your Data Stays Private | BentoPDF">
-  <meta name="twitter:description" content="BentoPDF privacy policy: All PDF processing happens in your browser. We never see, store, or upload your files. 100% private and secure.">
+  <meta name="twitter:description"
+    content="BentoPDF privacy policy: All PDF processing happens in your browser. We never see, store, or upload your files. 100% private and secure.">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-privacy.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <title>Privacy Policy - Your Data Stays Private | BentoPDF</title>
   <link href="/src/css/styles.css" rel="stylesheet" />
 
@@ -47,7 +50,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="index.html">BentoPDF</a>
           </span>
@@ -227,11 +230,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
diff --git a/public/images/favicon-no-bg.svg b/public/images/favicon-no-bg.svg
new file mode 100644
index 0000000..01d9df7
--- /dev/null
+++ b/public/images/favicon-no-bg.svg
@@ -0,0 +1,7 @@
+<svg width="166" height="166" viewBox="0 0 166 166" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g transform="translate(40, 0)">
+<path d="M56.7848 80.9116L0 25.6211L24.8434 1.43151C26.8037 -0.47717 29.9814 -0.47717 31.9414 1.43151L85.177 53.2662L56.7848 80.9116Z" fill="#A5B4FC"/>
+<path d="M-1.30805e-05 80.7335L21.2939 101.467L42.5878 80.7335L21.2939 60L-1.30805e-05 80.7335Z" fill="#E0E7FF"/>
+<path d="M56.7848 83L81.6279 107.19C83.5881 109.098 83.5881 112.192 81.6279 114.101L28.3925 165.936L0 138.29L56.7848 83Z" fill="#6366F1"/>
+</g>
+</svg>
diff --git a/public/images/favicon.svg b/public/images/favicon.svg
index 18be912..90ddc27 100644
--- a/public/images/favicon.svg
+++ b/public/images/favicon.svg
@@ -1,7 +1,7 @@
 <svg width="166" height="166" viewBox="0 0 166 166" fill="none" xmlns="http://www.w3.org/2000/svg">
-<!-- Background -->
-<rect width="166" height="166" fill="rgb(38, 45, 59)"/>
-<g transform="translate(40, 0)">
+<!-- Circular Background -->
+<circle cx="83" cy="83" r="83" fill="#111827"/>
+<g transform="translate(48, 12) scale(0.85)">
 <path d="M56.7848 80.9116L0 25.6211L24.8434 1.43151C26.8037 -0.47717 29.9814 -0.47717 31.9414 1.43151L85.177 53.2662L56.7848 80.9116Z" fill="#A5B4FC"/>
 <path d="M-1.30805e-05 80.7335L21.2939 101.467L42.5878 80.7335L21.2939 60L-1.30805e-05 80.7335Z" fill="#E0E7FF"/>
 <path d="M56.7848 83L81.6279 107.19C83.5881 109.098 83.5881 112.192 81.6279 114.101L28.3925 165.936L0 138.29L56.7848 83Z" fill="#6366F1"/>
diff --git a/public/locales/de/tools.json b/public/locales/de/tools.json
index 69645d1..11f9630 100644
--- a/public/locales/de/tools.json
+++ b/public/locales/de/tools.json
@@ -488,5 +488,32 @@
         "subtitle": "Text aus PDF-Dateien extrahieren und als Textdatei (.txt) speichern. Unterstützt mehrere Dateien.",
         "note": "Dieses Tool funktioniert NUR mit digital erstellten PDFs. Für gescannte Dokumente oder bildbasierte PDFs verwenden Sie stattdessen unser OCR PDF-Tool.",
         "convertButton": "Text extrahieren"
+    },
+    "digitalSignPdf": {
+        "name": "Digitale PDF-Signatur",
+        "pageTitle": "Digitale PDF-Signatur - Kryptografische Signatur hinzufügen | BentoPDF",
+        "subtitle": "Fügen Sie eine kryptografische digitale Signatur mit X.509-Zertifikaten zu Ihrer PDF hinzu. Unterstützt PKCS#12 (.pfx, .p12) und PEM-Formate. Ihr privater Schlüssel verlässt niemals Ihren Browser.",
+        "certificateSection": "Zertifikat",
+        "uploadCert": "Zertifikat hochladen (.pfx, .p12)",
+        "certPassword": "Zertifikat-Passwort",
+        "certPasswordPlaceholder": "Zertifikat-Passwort eingeben",
+        "certInfo": "Zertifikat-Informationen",
+        "certSubject": "Betreff",
+        "certIssuer": "Aussteller",
+        "certValidity": "Gültig",
+        "signatureDetails": "Signatur-Details (Optional)",
+        "reason": "Grund",
+        "reasonPlaceholder": "z.B. Ich genehmige dieses Dokument",
+        "location": "Ort",
+        "locationPlaceholder": "z.B. Berlin, Deutschland",
+        "contactInfo": "Kontaktdaten",
+        "contactPlaceholder": "z.B. email@beispiel.de",
+        "applySignature": "Digitale Signatur anwenden",
+        "successMessage": "PDF erfolgreich signiert! Die Signatur kann in jedem PDF-Reader überprüft werden."
+    },
+    "validateSignaturePdf": {
+        "name": "PDF-Signatur überprüfen",
+        "pageTitle": "PDF-Signatur überprüfen - Digitale Signaturen verifizieren | BentoPDF",
+        "subtitle": "Überprüfen Sie digitale Signaturen in Ihren PDF-Dateien. Prüfen Sie die Zertifikatsgültigkeit, sehen Sie Unterzeichnerdetails und bestätigen Sie die Dokumentenintegrität. Die gesamte Verarbeitung erfolgt in Ihrem Browser."
     }
 }
\ No newline at end of file
diff --git a/public/locales/en/tools.json b/public/locales/en/tools.json
index 4025b90..c481e60 100644
--- a/public/locales/en/tools.json
+++ b/public/locales/en/tools.json
@@ -488,5 +488,32 @@
         "subtitle": "Extract text from PDF files and save as plain text (.txt). Supports multiple files.",
         "note": "This tool works ONLY with digitally created PDFs. For scanned documents or image-based PDFs, use our OCR PDF tool instead.",
         "convertButton": "Extract Text"
+    },
+    "digitalSignPdf": {
+        "name": "Digital Signature PDF",
+        "pageTitle": "Digital Signature PDF - Add Cryptographic Signature | BentoPDF",
+        "subtitle": "Add a cryptographic digital signature to your PDF using X.509 certificates. Supports PKCS#12 (.pfx, .p12) and PEM formats. Your private key never leaves your browser.",
+        "certificateSection": "Certificate",
+        "uploadCert": "Upload certificate (.pfx, .p12)",
+        "certPassword": "Certificate Password",
+        "certPasswordPlaceholder": "Enter certificate password",
+        "certInfo": "Certificate Information",
+        "certSubject": "Subject",
+        "certIssuer": "Issuer",
+        "certValidity": "Valid",
+        "signatureDetails": "Signature Details (Optional)",
+        "reason": "Reason",
+        "reasonPlaceholder": "e.g., I approve this document",
+        "location": "Location",
+        "locationPlaceholder": "e.g., New York, USA",
+        "contactInfo": "Contact Info",
+        "contactPlaceholder": "e.g., email@example.com",
+        "applySignature": "Apply Digital Signature",
+        "successMessage": "PDF signed successfully! The signature can be verified in any PDF reader."
+    },
+    "validateSignaturePdf": {
+        "name": "Validate PDF Signature",
+        "pageTitle": "Validate PDF Signature - Verify Digital Signatures | BentoPDF",
+        "subtitle": "Verify digital signatures in your PDF files. Check certificate validity, view signer details, and confirm document integrity. All processing happens in your browser."
     }
 }
\ No newline at end of file
diff --git a/public/locales/it/common.json b/public/locales/it/common.json
new file mode 100644
index 0000000..c620102
--- /dev/null
+++ b/public/locales/it/common.json
@@ -0,0 +1,323 @@
+{
+  "nav": {
+    "home": "Home",
+    "about": "Chi Siamo",
+    "contact": "Contatti",
+    "licensing": "Licenze",
+    "allTools": "Tutti gli Strumenti",
+    "openMainMenu": "Apri il Menu Principale",
+    "language": "Lingua"
+  },
+  "donation": {
+    "message": "Love BentoPDF? Help us keep it free and open source!",
+    "button": "Donate"
+  },
+  "hero": {
+    "title": "I",
+    "pdfToolkit": "tuoi attrezzi per i PDF",
+    "builtForPrivacy": "creati per la privacy",
+    "noSignups": "Nessun iscrizione",
+    "unlimitedUse": "Uso illimitato",
+    "worksOffline": "Funziona offline",
+    "startUsing": "Inizia ad usarlo ora"
+  },
+  "usedBy": {
+    "title": "Usato da aziende e persone che lavorano in"
+  },
+  "features": {
+    "title": "Perchè scegliere",
+    "bentoPdf": "BentoPDF?",
+    "noSignup": {
+      "title": "Nessuna Registrazione",
+      "description": "Usa subito, senza account o email."
+    },
+    "noUploads": {
+      "title": "Nessun caricamento",
+      "description": "100% client-side, i tuoi file non lasciano mai il dispositivo."
+    },
+    "foreverFree": {
+      "title": "Sempre Gratis",
+      "description": "Tutti gli strumenti, nessuna prova, nessun paywall."
+    },
+    "noLimits": {
+      "title": "Senza Limiti",
+      "description": "Usalo quanto vuoi, senza limiti nascosti."
+    },
+    "batchProcessing": {
+      "title": "Elaborazione in Batch",
+      "description": "Gestisci un numero illimitato di PDF in un'unica operazione."
+    },
+    "lightningFast": {
+      "title": "Fulmineo",
+      "description": "Elabora i PDF istantaneamente, senza attese o ritardi."
+    }
+  },
+  "tools": {
+    "title": "Inizia con",
+    "toolsLabel": "Strumenti",
+    "subtitle": "Clicca uno strumento per aprire il caricatore di file",
+    "searchPlaceholder": "Cerca uno strumento (es. 'split', 'organize'...)",
+    "backToTools": "Torna agli Strumenti",
+    "firstLoadNotice": "Il primo caricamento richiede un momento mentre scarichiamo il nostro motore di conversione. Dopo di ciò, tutti i caricamenti saranno immediati."
+  },
+  "upload": {
+    "clickToSelect": "Clicca per selezionare un file",
+    "orDragAndDrop": "o trascina e rilascia",
+    "pdfOrImages": "PDF o Immagini",
+    "filesNeverLeave": "I tuoi file non lasciano mai il tuo dispositivo.",
+    "addMore": "Aggiungi altri file",
+    "clearAll": "Svuota tutto"
+  },
+  "loader": {
+    "processing": "Elaborazione..."
+  },
+  "alert": {
+    "title": "Avviso",
+    "ok": "OK"
+  },
+  "preview": {
+    "title": "Anteprima Documento",
+    "downloadAsPdf": "Scarica come PDF",
+    "close": "Chiudi"
+  },
+  "settings": {
+    "title": "Impostazioni",
+    "shortcuts": "Scorciatoie",
+    "preferences": "Preferenze",
+    "displayPreferences": "Preferenze di visualizzazione",
+    "searchShortcuts": "Cerca scorciatoie...",
+    "shortcutsInfo": "Premi e tieni premuti i tasti per impostare una scorciatoia. Le modifiche vengono salvate automaticamente.",
+    "shortcutsWarning": "⚠️ Evita scorciatoie comuni del browser (Cmd/Ctrl+W, Cmd/Ctrl+T, Cmd/Ctrl+N ecc.) poiché potrebbero non funzionare in modo affidabile.",
+    "import": "Importa",
+    "export": "Esporta",
+    "resetToDefaults": "Reimposta ai valori predefiniti",
+    "fullWidthMode": "Modalità a tutta larghezza",
+    "fullWidthDescription": "Usa l'intera larghezza dello schermo per tutti gli strumenti invece di un contenitore centrato",
+    "settingsAutoSaved": "Le impostazioni vengono salvate automaticamente",
+    "clickToSet": "Clicca per impostare",
+    "pressKeys": "Premi tasti...",
+    "warnings": {
+      "alreadyInUse": "Scorciatoia già in uso",
+      "assignedTo": "è già assegnata a:",
+      "chooseDifferent": "Per favore scegli una scorciatoia diversa.",
+      "reserved": "Avviso: scorciatoia riservata",
+      "commonlyUsed": "è comunemente usata per:",
+      "unreliable": "Questa scorciatoia potrebbe non funzionare in modo affidabile o potrebbe avere conflitti con il comportamento del browser/sistema.",
+      "useAnyway": "Vuoi usarla comunque?",
+      "resetTitle": "Reimposta Scorciatoie",
+      "resetMessage": "Sei sicuro di voler reimpostare tutte le scorciatoie ai valori predefiniti?<br><br>Questa azione non può essere annullata.",
+      "importSuccessTitle": "Importazione Riuscita",
+      "importSuccessMessage": "Scorciatoie importate con successo!",
+      "importFailTitle": "Importazione Fallita",
+      "importFailMessage": "Impossibile importare le scorciatoie. Formato file non valido."
+    }
+  },
+  "warning": {
+    "title": "Avviso",
+    "cancel": "Annulla",
+    "proceed": "Procedi"
+  },
+  "compliance": {
+    "title": "I tuoi dati non lasciano mai il tuo dispositivo",
+    "weKeep": "Manteniamo",
+    "yourInfoSafe": "le tue informazioni al sicuro",
+    "byFollowingStandards": "seguendo gli standard di sicurezza globali.",
+    "processingLocal": "Tutte le elaborazioni avvengono localmente sul tuo dispositivo.",
+    "gdpr": {
+      "title": "Conformità GDPR",
+      "description": "Protegge i dati personali e la privacy delle persone all'interno dell'Unione Europea."
+    },
+    "ccpa": {
+      "title": "Conformità CCPA",
+      "description": "Conferisce ai residenti della California diritti su come le loro informazioni personali vengono raccolte, usate e condivise."
+    },
+    "hipaa": {
+      "title": "Conformità HIPAA",
+      "description": "Stabilisce salvaguardie per la gestione delle informazioni sanitarie sensibili nel sistema sanitario degli Stati Uniti."
+    }
+  },
+  "faq": {
+    "title": "Domande Frequenti",
+    "questions": "Domande",
+    "isFree": {
+      "question": "BentoPDF è davvero gratuito?",
+      "answer": "Sì, assolutamente. Tutti gli strumenti su BentoPDF sono gratuiti al 100%, senza limiti di file, senza registrazioni e senza filigrane. Crediamo che tutti debbano poter accedere a strumenti PDF semplici e potenti senza barriere a pagamento."
+    },
+    "areFilesSecure": {
+      "question": "I miei file sono sicuri? Dove vengono elaborati?",
+      "answer": "I tuoi file sono il più sicuri possibile perché non lasciano mai il tuo computer. Tutte le elaborazioni avvengono direttamente nel tuo browser (lato client). Non carichiamo mai i tuoi file su un server, quindi mantieni la privacy completa e il controllo sui tuoi documenti."
+    },
+    "platforms": {
+      "question": "Funziona su Mac, Windows e dispositivi mobili?",
+      "answer": "Sì! Poiché BentoPDF viene eseguito interamente nel tuo browser, funziona su qualsiasi sistema operativo con un browser moderno, inclusi Windows, macOS, Linux, iOS e Android."
+    },
+    "gdprCompliant": {
+      "question": "BentoPDF è conforme al GDPR?",
+      "answer": "Sì. BentoPDF è pienamente conforme al GDPR. Poiché tutte le elaborazioni avvengono localmente nel tuo browser e non raccogliamo né trasmettiamo i tuoi file a server, non abbiamo accesso ai tuoi dati. Questo garantisce che tu abbia sempre il controllo sui tuoi documenti."
+    },
+    "dataStorage": {
+      "question": "Conservate o tracciate i miei file?",
+      "answer": "No. Non conserviamo, tracciamo né registriamo i tuoi file. Tutto ciò che fai su BentoPDF avviene nella memoria del tuo browser e scompare quando chiudi la pagina. Non ci sono upload, né log di cronologia, né server coinvolti."
+    },
+    "different": {
+      "question": "Cosa rende BentoPDF diverso dagli altri strumenti PDF?",
+      "answer": "La maggior parte degli strumenti PDF carica i file su un server per l'elaborazione. BentoPDF non lo fa mai. Utilizziamo tecnologie web moderne e sicure per elaborare i tuoi file direttamente nel browser. Questo significa prestazioni più rapide, maggiore privacy e tranquillità."
+    },
+    "browserBased": {
+      "question": "In che modo l'elaborazione nel browser mi protegge?",
+      "answer": "Eseguendosi interamente nel browser, BentoPDF garantisce che i tuoi file non lascino mai il tuo dispositivo. Questo elimina i rischi di attacchi ai server, violazioni dei dati o accessi non autorizzati. I tuoi file restano sempre tuoi."
+    },
+    "analytics": {
+      "question": "Usate cookie o analytics per tracciarmi?",
+      "answer": "Ci teniamo alla tua privacy. BentoPDF non traccia informazioni personali. Usiamo Simple Analytics solo per visualizzare conteggi di visite anonime. Questo significa che possiamo sapere quante persone visitano il sito, ma non chi sei. Simple Analytics è pienamente conforme al GDPR e rispetta la tua privacy."
+    }
+  },
+  "testimonials": {
+    "title": "Cosa",
+    "users": "i Nostri Utenti",
+    "say": "Dicono"
+  },
+  "support": {
+    "title": "Ti piace il mio lavoro?",
+    "description": "BentoPDF è un progetto nato per passione, creato per offrire una cassetta degli attrezzi PDF gratuita, privata e potente per tutti. Se lo trovi utile, considera di supportarne lo sviluppo. Ogni caffè aiuta!",
+    "buyMeCoffee": "Offrimi un caffè"
+  },
+  "footer": {
+    "copyright": "© 2025 BentoPDF. Tutti i diritti riservati.",
+    "version": "Versione",
+    "company": "Azienda",
+    "aboutUs": "Chi Siamo",
+    "faqLink": "FAQ",
+    "contactUs": "Contattaci",
+    "legal": "Legale",
+    "termsAndConditions": "Termini e Condizioni",
+    "privacyPolicy": "Informativa sulla Privacy",
+    "followUs": "Seguici"
+  },
+  "merge": {
+    "title": "Unisci PDF",
+    "description": "Combina file interi, oppure seleziona pagine specifiche da unire in un nuovo documento.",
+    "fileMode": "Modalità File",
+    "pageMode": "Modalità Pagina",
+    "howItWorks": "Come funziona:",
+    "fileModeInstructions": [
+      "Clicca e trascina l'icona per cambiare l'ordine dei file.",
+      "Nella casella \"Pagine\" per ogni file, puoi specificare intervalli (es., \"1-3, 5\") per unire solo quelle pagine.",
+      "Lascia vuota la casella \"Pagine\" per includere tutte le pagine di quel file."
+    ],
+    "pageModeInstructions": [
+      "Tutte le pagine dei tuoi PDF caricati vengono mostrate qui sotto.",
+      "Trascina e rilascia le miniature delle singole pagine per creare l'ordine esatto che desideri per il nuovo file."
+    ],
+    "mergePdfs": "Unisci PDF"
+  },
+  "common": {
+    "page": "Pagina",
+    "pages": "Pagine",
+    "of": "di",
+    "download": "Scarica",
+    "cancel": "Annulla",
+    "save": "Salva",
+    "delete": "Elimina",
+    "edit": "Modifica",
+    "add": "Aggiungi",
+    "remove": "Rimuovi",
+    "loading": "Caricamento...",
+    "error": "Errore",
+    "success": "Successo",
+    "file": "File",
+    "files": "File"
+  },
+  "about": {
+    "hero": {
+      "title": "Crediamo che gli strumenti PDF debbano essere",
+      "subtitle": "veloci, privati e gratuiti.",
+      "noCompromises": "Nessun compromesso."
+    },
+    "mission": {
+      "title": "La nostra missione",
+      "description": "Fornire la cassetta degli attrezzi per PDF più completa che rispetti la tua privacy e non richieda mai pagamenti. Crediamo che gli strumenti essenziali per i documenti debbano essere accessibili a tutti, ovunque, senza barriere."
+    },
+    "philosophy": {
+      "label": "La nostra filosofia fondamentale",
+      "title": "Prima la privacy. Sempre.",
+      "description": "In un'epoca in cui i dati sono una merce, adottiamo un approccio diverso. Tutte le elaborazioni per gli strumenti BentoPDF avvengono localmente nel tuo browser. Questo significa che i tuoi file non toccano mai i nostri server, non vediamo i tuoi documenti e non tracciamo ciò che fai. I tuoi documenti restano completamente e inequivocabilmente privati. Non è solo una funzionalità; è il nostro fondamento."
+    },
+    "whyBentopdf": {
+      "title": "Perché BentoPDF",
+      "speed": {
+        "title": "Progettato per la velocità",
+        "description": "Nessuna attesa per upload o download verso un server. Elaborando i file direttamente nel browser con tecnologie web moderne come WebAssembly, offriamo velocità impareggiabile per tutti i nostri strumenti."
+      },
+      "free": {
+        "title": "Completamente gratuito",
+        "description": "Niente prove, niente abbonamenti, nessun costo nascosto e nessuna funzione \"premium\" tenuta in ostaggio. Crediamo che potenti strumenti PDF debbano essere un servizio pubblico, non una fonte di profitto."
+      },
+      "noAccount": {
+        "title": "Nessun account richiesto",
+        "description": "Inizia a usare qualsiasi strumento immediatamente. Non abbiamo bisogno della tua email, di una password o di informazioni personali. Il tuo flusso di lavoro deve essere semplice e anonimo."
+      },
+      "openSource": {
+        "title": "Spirito open source",
+        "description": "Costruito con trasparenza. Sfruttiamo librerie open‑source incredibili come PDF-lib e PDF.js, e crediamo nello sforzo della community per rendere strumenti potenti accessibili a tutti."
+      }
+    },
+    "cta": {
+      "title": "Pronto per iniziare?",
+      "description": "Unisciti a migliaia di utenti che si affidano a BentoPDF per le loro esigenze quotidiane sui documenti. Sperimenta la differenza che privacy e prestazioni possono offrire.",
+      "button": "Esplora tutti gli strumenti"
+    },
+    "contact": {
+      "title": "Contattaci",
+      "subtitle": "Ci farebbe piacere sentirti. Che tu abbia una domanda, un feedback o una richiesta di funzionalità, non esitare a contattarci.",
+      "email": "Puoi contattarci direttamente via email a:"
+    },
+    "licensing": {
+      "title": "Licenze per",
+      "subtitle": "Scegli la licenza che si adatta alle tue esigenze."
+    },
+    "multiTool": {
+      "uploadPdfs": "Carica PDF",
+      "upload": "Carica",
+      "addBlankPage": "Aggiungi pagina vuota",
+      "edit": "Modifica:",
+      "undo": "Annulla",
+      "redo": "Ripeti",
+      "reset": "Reimposta",
+      "selection": "Selezione:",
+      "selectAll": "Seleziona tutto",
+      "deselectAll": "Deseleziona tutto",
+      "rotate": "Ruota:",
+      "rotateLeft": "Sinistra",
+      "rotateRight": "Destra",
+      "transform": "Trasforma:",
+      "duplicate": "Duplica",
+      "split": "Dividi",
+      "clear": "Svuota:",
+      "delete": "Elimina",
+      "download": "Scarica:",
+      "downloadSelected": "Scarica selezionati",
+      "exportPdf": "Esporta PDF",
+      "uploadPdfFiles": "Seleziona file PDF",
+      "dragAndDrop": "Trascina e rilascia i file PDF qui, oppure clicca per selezionare",
+      "selectFiles": "Seleziona file",
+      "renderingPages": "Generazione anteprime pagine...",
+      "actions": {
+        "duplicatePage": "Duplica questa pagina",
+        "deletePage": "Elimina questa pagina",
+        "insertPdf": "Inserisci PDF dopo questa pagina",
+        "toggleSplit": "Attiva la divisione dopo questa pagina"
+      },
+      "pleaseWait": "Attendere...",
+      "pagesRendering": "Le pagine sono ancora in fase di generazione. Attendere...",
+      "noPagesSelected": "Nessuna pagina selezionata",
+      "selectOnePage": "Seleziona almeno una pagina da scaricare.",
+      "noPages": "Nessuna pagina",
+      "noPagesToExport": "Non ci sono pagine da esportare.",
+      "renderingTitle": "Generazione anteprime delle pagine",
+      "errorRendering": "Impossibile generare le miniature delle pagine",
+      "error": "Errore",
+      "failedToLoad": "Caricamento fallito"
+    }
+  }
+}
diff --git a/public/locales/it/tools.json b/public/locales/it/tools.json
new file mode 100644
index 0000000..4835327
--- /dev/null
+++ b/public/locales/it/tools.json
@@ -0,0 +1,492 @@
+{
+    "categories": {
+        "popularTools": "Strumenti popolari",
+        "editAnnotate": "Modifica e Annota",
+        "convertToPdf": "Converti in PDF",
+        "convertFromPdf": "Convert da PDF",
+        "organizeManage": "Organizza e Gestisci",
+        "optimizeRepair": "Ottimizza e Ripara",
+        "securePdf": "Proteggi PDF"
+    },
+    "pdfMultiTool": {
+        "name": "PDF Multi Tool",
+        "subtitle": "Unisci, Dividi, Organizza, Elimina, Ruota, Aggiungi Pagine Vuote, Estrai e Duplica in un'interfaccia unificata."
+    },
+    "mergePdf": {
+        "name": "Unisci PDF",
+        "subtitle": "Unisci più PDF in un unico file. Conserva i Segnalibri."
+    },
+    "splitPdf": {
+        "name": "Dividi PDF",
+        "subtitle": "Estrai un insieme di pagine in un nuovo PDF."
+    },
+    "compressPdf": {
+        "name": "Comprimi PDF",
+        "subtitle": "Riduci le dimensioni del tuo PDF.",
+        "algorithmLabel": "Algoritmo di compressione",
+        "condense": "Condensa (Consigliato)",
+        "photon": "Photon (Per PDF con molte foto)",
+        "condenseInfo": "Condensa usa la compressione avanzata: rimuove peso inutile, ottimizza le immagini, riduce i font. Migliore per la maggior parte dei PDF.",
+        "photonInfo": "Photon converte le pagine in immagini. Usalo per PDF con molte foto o scannerizzati.",
+        "photonWarning": "Attenzione: il testo non sarà selezionabile e i link smetteranno di funzionare.",
+        "levelLabel": "Livello di compressione",
+        "light": "Leggero (Preserva qualità)",
+        "balanced": "Bilanciato (Consigliato)",
+        "aggressive": "Aggressivo (File più piccoli)",
+        "extreme": "Estremo (Compressione massima)",
+        "grayscale": "Converti in scala di grigi",
+        "grayscaleHint": "Riduce le dimensioni rimuovendo le informazioni di colore",
+        "customSettings": "Impostazioni personalizzate",
+        "customSettingsHint": "Affina i parametri di compressione:",
+        "outputQuality": "Qualità di output",
+        "resizeImagesTo": "Ridimensiona le immagini a",
+        "onlyProcessAbove": "Elabora solo sopra",
+        "removeMetadata": "Rimuovi metadati",
+        "subsetFonts": "Riduci i font (rimuovi glifi non usati)",
+        "removeThumbnails": "Rimuovi miniature incorporate",
+        "compressButton": "Comprimi PDF"
+    },
+    "pdfEditor": {
+        "name": "Editor PDF",
+        "subtitle": "Annota, evidenzia, redigi, commenta, aggiungi forme/immagini, cerca e visualizza PDF."
+    },
+    "jpgToPdf": {
+        "name": "JPG in PDF",
+        "subtitle": "Crea un PDF da immagini JPG, JPEG e JPEG2000 (JP2/JPX)."
+    },
+    "signPdf": {
+        "name": "Firma PDF",
+        "subtitle": "Disegna, digita o carica la tua firma."
+    },
+    "cropPdf": {
+        "name": "Ritaglia PDF",
+        "subtitle": "Rimuovi i margini di ogni pagina del tuo PDF."
+    },
+    "extractPages": {
+        "name": "Estrai Pagine",
+        "subtitle": "Salva una selezione di pagine come nuovi file."
+    },
+    "duplicateOrganize": {
+        "name": "Duplica e Organizza",
+        "subtitle": "Duplica, riordina e elimina pagine."
+    },
+    "deletePages": {
+        "name": "Elimina Pagine",
+        "subtitle": "Rimuovi pagine specifiche dal tuo documento."
+    },
+    "editBookmarks": {
+        "name": "Modifica Segnalibri",
+        "subtitle": "Aggiungi, modifica, importa, elimina ed estrai segnalibri PDF."
+    },
+    "tableOfContents": {
+        "name": "Indice",
+        "subtitle": "Genera una pagina di indice dai segnalibri del PDF."
+    },
+    "pageNumbers": {
+        "name": "Numeri di Pagina",
+        "subtitle": "Inserisci i numeri di pagina nel tuo documento."
+    },
+    "addWatermark": {
+        "name": "Aggiungi Filigrana",
+        "subtitle": "Applica testo o un'immagine sulle pagine del tuo PDF."
+    },
+    "headerFooter": {
+        "name": "Intestazione e Piè di Pagina",
+        "subtitle": "Aggiungi testo nella parte superiore e inferiore delle pagine."
+    },
+    "invertColors": {
+        "name": "Inverti Colori",
+        "subtitle": "Crea una versione \"modalità scura\" del tuo PDF."
+    },
+    "backgroundColor": {
+        "name": "Colore di Sfondo",
+        "subtitle": "Cambia il colore di sfondo del tuo PDF."
+    },
+    "changeTextColor": {
+        "name": "Cambia Colore Testo",
+        "subtitle": "Cambia il colore del testo nel tuo PDF."
+    },
+    "addStamps": {
+        "name": "Aggiungi Timbri",
+        "subtitle": "Aggiungi timbri immagine al tuo PDF usando la barra degli strumenti di annotazione.",
+        "usernameLabel": "Nome sul timbro",
+        "usernamePlaceholder": "Inserisci il tuo nome (per i timbri)",
+        "usernameHint": "Questo nome apparirà sui timbri che crei."
+    },
+    "removeAnnotations": {
+        "name": "Rimuovi Annotazioni",
+        "subtitle": "Rimuovi commenti, evidenziazioni e link."
+    },
+    "pdfFormFiller": {
+        "name": "Compilatore Moduli PDF",
+        "subtitle": "Compila i moduli direttamente nel browser. Supporta anche i moduli XFA."
+    },
+    "createPdfForm": {
+        "name": "Crea Modulo PDF",
+        "subtitle": "Crea moduli PDF compilabili con campi di testo drag-and-drop."
+    },
+    "removeBlankPages": {
+        "name": "Rimuovi Pagine Vuote",
+        "subtitle": "Rileva e elimina automaticamente le pagine vuote."
+    },
+    "imageToPdf": {
+        "name": "Immagini in PDF",
+        "subtitle": "Converti JPG, PNG, BMP, GIF, TIFF, PNM, PGM, PBM, PPM, PAM, JXR, JPX, JP2, PSD, SVG, HEIC, WebP in PDF."
+    },
+    "pngToPdf": {
+        "name": "PNG in PDF",
+        "subtitle": "Crea un PDF da una o più immagini PNG."
+    },
+    "webpToPdf": {
+        "name": "WebP in PDF",
+        "subtitle": "Crea un PDF da una o più immagini WebP."
+    },
+    "svgToPdf": {
+        "name": "SVG in PDF",
+        "subtitle": "Crea un PDF da una o più immagini SVG."
+    },
+    "bmpToPdf": {
+        "name": "BMP in PDF",
+        "subtitle": "Crea un PDF da una o più immagini BMP."
+    },
+    "heicToPdf": {
+        "name": "HEIC in PDF",
+        "subtitle": "Crea un PDF da una o più immagini HEIC."
+    },
+    "tiffToPdf": {
+        "name": "TIFF in PDF",
+        "subtitle": "Crea un PDF da una o più immagini TIFF."
+    },
+    "textToPdf": {
+        "name": "Testo in PDF",
+        "subtitle": "Converti un file di testo semplice in un PDF."
+    },
+    "jsonToPdf": {
+        "name": "JSON in PDF",
+        "subtitle": "Converti file JSON in formato PDF."
+    },
+    "pdfToJpg": {
+        "name": "PDF in JPG",
+        "subtitle": "Converti ogni pagina del PDF in un'immagine JPG."
+    },
+    "pdfToPng": {
+        "name": "PDF in PNG",
+        "subtitle": "Converti ogni pagina del PDF in un'immagine PNG."
+    },
+    "pdfToWebp": {
+        "name": "PDF in WebP",
+        "subtitle": "Converti ogni pagina del PDF in un'immagine WebP."
+    },
+    "pdfToBmp": {
+        "name": "PDF in BMP",
+        "subtitle": "Converti ogni pagina del PDF in un'immagine BMP."
+    },
+    "pdfToTiff": {
+        "name": "PDF in TIFF",
+        "subtitle": "Converti ogni pagina del PDF in un'immagine TIFF."
+    },
+    "pdfToGreyscale": {
+        "name": "PDF in Scala di Grigi",
+        "subtitle": "Converti tutti i colori in scala di grigi."
+    },
+    "pdfToJson": {
+        "name": "PDF in JSON",
+        "subtitle": "Converti file PDF in formato JSON."
+    },
+    "ocrPdf": {
+        "name": "OCR PDF",
+        "subtitle": "Rendi un PDF ricercabile e copiabile."
+    },
+    "alternateMix": {
+        "name": "Alterna e Riordina Pagine",
+        "subtitle": "Unisci PDF sostituendo le pagine di ogni file. Conserva i segnalibri."
+    },
+    "addAttachments": {
+        "name": "Aggiungi Allegati",
+        "subtitle": "Incorpora uno o più file nel tuo PDF."
+    },
+    "extractAttachments": {
+        "name": "Estrai Allegati",
+        "subtitle": "Estrai tutti i file incorporati dai PDF come archivio ZIP."
+    },
+    "editAttachments": {
+        "name": "Modifica Allegati",
+        "subtitle": "Visualizza o rimuovi gli allegati nel tuo PDF."
+    },
+    "dividePages": {
+        "name": "Dividi Pagine",
+        "subtitle": "Dividi le pagine orizzontalmente o verticalmente."
+    },
+    "addBlankPage": {
+        "name": "Aggiungi Pagina Vuota",
+        "subtitle": "Inserisci una pagina vuota in qualsiasi punto del tuo PDF."
+    },
+    "reversePages": {
+        "name": "Inverti Pagine",
+        "subtitle": "Inverti l'ordine di tutte le pagine del documento."
+    },
+    "rotatePdf": {
+        "name": "Ruota PDF",
+        "subtitle": "Ruota le pagine per multipli di 90 gradi."
+    },
+    "rotateCustom": {
+        "name": "Ruota di Gradi Personalizzati",
+        "subtitle": "Ruota le pagine di un angolo personalizzato."
+    },
+    "nUpPdf": {
+        "name": "N-Up PDF",
+        "subtitle": "Disponi più pagine su un unico foglio."
+    },
+    "combineToSinglePage": {
+        "name": "Combina in Una Pagina",
+        "subtitle": "Unisci tutte le pagine in un'unica pagina continua."
+    },
+    "viewMetadata": {
+        "name": "Visualizza Metadati",
+        "subtitle": "Ispeziona le proprietà nascoste del tuo PDF."
+    },
+    "editMetadata": {
+        "name": "Modifica Metadati",
+        "subtitle": "Modifica autore, titolo e altre proprietà."
+    },
+    "pdfsToZip": {
+        "name": "PDF in ZIP",
+        "subtitle": "Raggruppa più file PDF in un archivio ZIP."
+    },
+    "comparePdfs": {
+        "name": "Confronta PDF",
+        "subtitle": "Confronta due PDF fianco a fianco."
+    },
+    "posterizePdf": {
+        "name": "Posterizza PDF",
+        "subtitle": "Dividi una pagina grande in più pagine più piccole."
+    },
+    "fixPageSize": {
+        "name": "Correggi Dimensione Pagina",
+        "subtitle": "Uniforma tutte le pagine a una dimensione standard."
+    },
+    "linearizePdf": {
+        "name": "Linearizza PDF",
+        "subtitle": "Ottimizza il PDF per una visualizzazione web più veloce."
+    },
+    "pageDimensions": {
+        "name": "Dimensioni Pagina",
+        "subtitle": "Analizza dimensione, orientamento e unità delle pagine."
+    },
+    "removeRestrictions": {
+        "name": "Rimuovi Restrizioni",
+        "subtitle": "Rimuovi la protezione tramite password e le restrizioni di sicurezza associate ai PDF firmati digitalmente."
+    },
+    "repairPdf": {
+        "name": "Ripara PDF",
+        "subtitle": "Recupera i dati da file PDF corrotti o danneggiati."
+    },
+    "encryptPdf": {
+        "name": "Cripta PDF",
+        "subtitle": "Proteggi il tuo PDF aggiungendo una password."
+    },
+    "sanitizePdf": {
+        "name": "Sanitizza PDF",
+        "subtitle": "Rimuovi metadati, annotazioni, script e altro."
+    },
+    "decryptPdf": {
+        "name": "Decrittografa PDF",
+        "subtitle": "Sblocca il PDF rimuovendo la protezione tramite password."
+    },
+    "flattenPdf": {
+        "name": "Appiattisci PDF",
+        "subtitle": "Rendi i campi dei moduli e le annotazioni non modificabili."
+    },
+    "removeMetadata": {
+        "name": "Rimuovi metadati",
+        "subtitle": "Rimuovi i dati nascosti dal tuo PDF."
+    },
+    "changePermissions": {
+        "name": "Modifica permessi",
+        "subtitle": "Imposta o modifica i permessi utente su un PDF."
+    },
+    "odtToPdf": {
+        "name": "ODT in PDF",
+        "subtitle": "Converti file OpenDocument Text in formato PDF. Supporta più file.",
+        "acceptedFormats": "File ODT",
+        "convertButton": "Converti in PDF"
+    },
+    "csvToPdf": {
+        "name": "CSV in PDF",
+        "subtitle": "Converti file di foglio di calcolo CSV in formato PDF. Supporta più file.",
+        "acceptedFormats": "File CSV",
+        "convertButton": "Converti in PDF"
+    },
+    "rtfToPdf": {
+        "name": "RTF in PDF",
+        "subtitle": "Converti documenti Rich Text Format in PDF. Supporta più file.",
+        "acceptedFormats": "File RTF",
+        "convertButton": "Converti in PDF"
+    },
+    "wordToPdf": {
+        "name": "Word in PDF",
+        "subtitle": "Converti documenti Word (DOCX, DOC, ODT, RTF) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File DOCX, DOC, ODT, RTF",
+        "convertButton": "Converti in PDF"
+    },
+    "excelToPdf": {
+        "name": "Excel in PDF",
+        "subtitle": "Converti fogli Excel (XLSX, XLS, ODS, CSV) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File XLSX, XLS, ODS, CSV",
+        "convertButton": "Converti in PDF"
+    },
+    "powerpointToPdf": {
+        "name": "PowerPoint in PDF",
+        "subtitle": "Converti presentazioni PowerPoint (PPTX, PPT, ODP) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File PPTX, PPT, ODP",
+        "convertButton": "Converti in PDF"
+    },
+    "markdownToPdf": {
+        "name": "Markdown in PDF",
+        "subtitle": "Scrivi o incolla Markdown ed esportalo come un PDF ben formattato.",
+        "paneMarkdown": "Markdown",
+        "panePreview": "Anteprima",
+        "btnUpload": "Carica",
+        "btnSyncScroll": "Sincronizza scorrimento",
+        "btnSettings": "Impostazioni",
+        "btnExportPdf": "Esporta PDF",
+        "settingsTitle": "Impostazioni Markdown",
+        "settingsPreset": "Preset",
+        "presetDefault": "Predefinito (simile a GFM)",
+        "presetCommonmark": "CommonMark (rigoroso)",
+        "presetZero": "Minimale (nessuna funzionalità)",
+        "settingsOptions": "Opzioni Markdown",
+        "optAllowHtml": "Consenti tag HTML",
+        "optBreaks": "Converti nuove righe in <br>",
+        "optLinkify": "Converti automaticamente gli URL in link",
+        "optTypographer": "Tipografia (virgolette intelligenti, ecc.)"
+    },
+    "pdfBooklet": {
+        "name": "Opuscolo PDF",
+        "subtitle": "Riorganizza le pagine per la stampa di opuscoli fronte-retro. Piega e pinza per creare un opuscolo.",
+        "howItWorks": "Come funziona:",
+        "step1": "Carica un file PDF.",
+        "step2": "Le pagine saranno riorganizzate in ordine per opuscolo.",
+        "step3": "Stampa fronte-retro, capovolgi sul lato corto, piega e pinza.",
+        "paperSize": "Formato carta",
+        "orientation": "Orientamento",
+        "portrait": "Ritratto",
+        "landscape": "Paesaggio",
+        "pagesPerSheet": "Pagine per foglio",
+        "createBooklet": "Crea opuscolo",
+        "processing": "Elaborazione...",
+        "pageCount": "Il conteggio delle pagine verrà arrotondato ad un multiplo di 4 se necessario."
+    },
+    "xpsToPdf": {
+        "name": "XPS in PDF",
+        "subtitle": "Converti documenti XPS/OXPS in formato PDF. Supporta più file.",
+        "acceptedFormats": "File XPS, OXPS",
+        "convertButton": "Converti in PDF"
+    },
+    "mobiToPdf": {
+        "name": "MOBI in PDF",
+        "subtitle": "Converti e-book MOBI in formato PDF. Supporta più file.",
+        "acceptedFormats": "File MOBI",
+        "convertButton": "Converti in PDF"
+    },
+    "epubToPdf": {
+        "name": "EPUB in PDF",
+        "subtitle": "Converti e-book EPUB in formato PDF. Supporta più file.",
+        "acceptedFormats": "File EPUB",
+        "convertButton": "Converti in PDF"
+    },
+    "fb2ToPdf": {
+        "name": "FB2 in PDF",
+        "subtitle": "Converti e-book FictionBook (FB2) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File FB2",
+        "convertButton": "Converti in PDF"
+    },
+    "cbzToPdf": {
+        "name": "CBZ in PDF",
+        "subtitle": "Converti archivi di fumetti (CBZ/CBR) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File CBZ, CBR",
+        "convertButton": "Converti in PDF"
+    },
+    "wpdToPdf": {
+        "name": "WPD in PDF",
+        "subtitle": "Converti documenti WordPerfect (WPD) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File WPD",
+        "convertButton": "Converti in PDF"
+    },
+    "wpsToPdf": {
+        "name": "WPS in PDF",
+        "subtitle": "Converti documenti WPS Office in formato PDF. Supporta più file.",
+        "acceptedFormats": "File WPS",
+        "convertButton": "Converti in PDF"
+    },
+    "xmlToPdf": {
+        "name": "XML in PDF",
+        "subtitle": "Converti documenti XML in formato PDF. Supporta più file.",
+        "acceptedFormats": "File XML",
+        "convertButton": "Converti in PDF"
+    },
+    "pagesToPdf": {
+        "name": "Pages in PDF",
+        "subtitle": "Converti documenti Apple Pages in formato PDF. Supporta più file.",
+        "acceptedFormats": "File Pages",
+        "convertButton": "Converti in PDF"
+    },
+    "odgToPdf": {
+        "name": "ODG in PDF",
+        "subtitle": "Converti OpenDocument Graphics (ODG) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File ODG",
+        "convertButton": "Converti in PDF"
+    },
+    "odsToPdf": {
+        "name": "ODS in PDF",
+        "subtitle": "Converti fogli OpenDocument (ODS) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File ODS",
+        "convertButton": "Converti in PDF"
+    },
+    "odpToPdf": {
+        "name": "ODP in PDF",
+        "subtitle": "Converti presentazioni OpenDocument (ODP) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File ODP",
+        "convertButton": "Converti in PDF"
+    },
+    "pubToPdf": {
+        "name": "PUB in PDF",
+        "subtitle": "Converti file Microsoft Publisher (PUB) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File PUB",
+        "convertButton": "Converti in PDF"
+    },
+    "vsdToPdf": {
+        "name": "VSD in PDF",
+        "subtitle": "Converti file Microsoft Visio (VSD, VSDX) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File VSD, VSDX",
+        "convertButton": "Converti in PDF"
+    },
+    "psdToPdf": {
+        "name": "PSD in PDF",
+        "subtitle": "Converti file Adobe Photoshop (PSD) in formato PDF. Supporta più file.",
+        "acceptedFormats": "File PSD",
+        "convertButton": "Converti in PDF"
+    },
+    "pdfToSvg": {
+        "name": "PDF in SVG",
+        "subtitle": "Converti ogni pagina di un file PDF in un'immagine vettoriale scalabile (SVG) per qualità perfetta a qualsiasi dimensione."
+    },
+    "extractTables": {
+        "name": "Estrai tabelle PDF",
+        "subtitle": "Estrai le tabelle dai file PDF ed esportale come CSV, JSON o Markdown."
+    },
+    "pdfToCsv": {
+        "name": "PDF in CSV",
+        "subtitle": "Estrai tabelle dai PDF e convertili in formato CSV."
+    },
+    "pdfToExcel": {
+        "name": "PDF in Excel",
+        "subtitle": "Estrai tabelle dai PDF e convertili in Excel (XLSX)."
+    },
+    "pdfToText": {
+        "name": "PDF in Testo",
+        "subtitle": "Estrai il testo dai file PDF e salvalo come testo semplice (.txt). Supporta più file.",
+        "note": "Questo strumento funziona SOLO con PDF creati digitalmente. Per documenti scansionati o basati su immagini, usa invece il nostro strumento OCR PDF.",
+        "convertButton": "Estrai testo"
+    }
+}
\ No newline at end of file
diff --git a/public/locales/vi/tools.json b/public/locales/vi/tools.json
index 86b5571..fe6dff4 100644
--- a/public/locales/vi/tools.json
+++ b/public/locales/vi/tools.json
@@ -488,5 +488,32 @@
         "subtitle": "Trích xuất văn bản từ tệp PDF và lưu dưới dạng tệp văn bản (.txt). Hỗ trợ nhiều tệp.",
         "note": "Công cụ này CHỈ hoạt động với các tệp PDF được tạo kỹ thuật số. Đối với tài liệu quét hoặc PDF dựa trên hình ảnh, hãy sử dụng công cụ OCR PDF của chúng tôi.",
         "convertButton": "Trích xuất văn bản"
+    },
+    "digitalSignPdf": {
+        "name": "Chữ ký số PDF",
+        "pageTitle": "Chữ ký số PDF - Thêm chữ ký mật mã | BentoPDF",
+        "subtitle": "Thêm chữ ký số mật mã vào PDF của bạn bằng chứng chỉ X.509. Hỗ trợ định dạng PKCS#12 (.pfx, .p12) và PEM. Khóa riêng của bạn không bao giờ rời khỏi trình duyệt.",
+        "certificateSection": "Chứng chỉ",
+        "uploadCert": "Tải lên chứng chỉ (.pfx, .p12)",
+        "certPassword": "Mật khẩu chứng chỉ",
+        "certPasswordPlaceholder": "Nhập mật khẩu chứng chỉ",
+        "certInfo": "Thông tin chứng chỉ",
+        "certSubject": "Chủ thể",
+        "certIssuer": "Nhà phát hành",
+        "certValidity": "Hiệu lực",
+        "signatureDetails": "Chi tiết chữ ký (Tùy chọn)",
+        "reason": "Lý do",
+        "reasonPlaceholder": "ví dụ: Tôi phê duyệt tài liệu này",
+        "location": "Địa điểm",
+        "locationPlaceholder": "ví dụ: Hà Nội, Việt Nam",
+        "contactInfo": "Thông tin liên hệ",
+        "contactPlaceholder": "ví dụ: email@example.com",
+        "applySignature": "Áp dụng chữ ký số",
+        "successMessage": "Ký PDF thành công! Chữ ký có thể được xác minh trong bất kỳ trình đọc PDF nào."
+    },
+    "validateSignaturePdf": {
+        "name": "Xác minh chữ ký PDF",
+        "pageTitle": "Xác minh chữ ký PDF - Xác thực chữ ký số | BentoPDF",
+        "subtitle": "Xác minh chữ ký số trong tệp PDF của bạn. Kiểm tra hiệu lực chứng chỉ, xem thông tin người ký và xác nhận tính toàn vẹn tài liệu. Tất cả xử lý diễn ra trong trình duyệt của bạn."
     }
 }
\ No newline at end of file
diff --git a/public/locales/zh/tools.json b/public/locales/zh/tools.json
index f3097e4..832c422 100644
--- a/public/locales/zh/tools.json
+++ b/public/locales/zh/tools.json
@@ -485,5 +485,32 @@
         "subtitle": "从 PDF 文件中提取文本并保存为纯文本文件 (.txt)。支持多个文件。",
         "note": "此工具仅适用于数字创建的 PDF。对于扫描文档或基于图像的 PDF，请使用我们的 OCR PDF 工具。",
         "convertButton": "提取文本"
+    },
+    "digitalSignPdf": {
+        "name": "PDF 数字签名",
+        "pageTitle": "PDF 数字签名 - 添加加密签名 | BentoPDF",
+        "subtitle": "使用 X.509 证书为您的 PDF 添加加密数字签名。支持 PKCS#12 (.pfx, .p12) 和 PEM 格式。您的私钥永远不会离开您的浏览器。",
+        "certificateSection": "证书",
+        "uploadCert": "上传证书 (.pfx, .p12)",
+        "certPassword": "证书密码",
+        "certPasswordPlaceholder": "输入证书密码",
+        "certInfo": "证书信息",
+        "certSubject": "主体",
+        "certIssuer": "颁发者",
+        "certValidity": "有效期",
+        "signatureDetails": "签名详情（可选）",
+        "reason": "原因",
+        "reasonPlaceholder": "例如：我批准此文档",
+        "location": "位置",
+        "locationPlaceholder": "例如：北京，中国",
+        "contactInfo": "联系信息",
+        "contactPlaceholder": "例如：email@example.com",
+        "applySignature": "应用数字签名",
+        "successMessage": "PDF 签名成功！签名可在任何 PDF 阅读器中验证。"
+    },
+    "validateSignaturePdf": {
+        "name": "验证 PDF 签名",
+        "pageTitle": "验证 PDF 签名 - 验证数字签名 | BentoPDF",
+        "subtitle": "验证您的 PDF 文件中的数字签名。检查证书有效性、查看签名者详情并确认文档完整性。所有处理都在您的浏览器中进行。"
     }
 }
\ No newline at end of file
diff --git a/signatures/cla.json b/signatures/cla.json
index 796c35c..95f348e 100644
--- a/signatures/cla.json
+++ b/signatures/cla.json
@@ -207,6 +207,22 @@
       "created_at": "2025-12-30T12:27:08Z",
       "repoId": 1074785178,
       "pullRequestNo": 338
+    },
+    {
+      "name": "raulgcode",
+      "id": 4565524,
+      "comment_id": 3705336389,
+      "created_at": "2026-01-02T13:34:58Z",
+      "repoId": 1074785178,
+      "pullRequestNo": 348
+    },
+    {
+      "name": "immanuelfodor",
+      "id": 21174107,
+      "comment_id": 3706391604,
+      "created_at": "2026-01-02T22:40:55Z",
+      "repoId": 1074785178,
+      "pullRequestNo": 350
     }
   ]
 }
\ No newline at end of file
diff --git a/src/js/config/tools.ts b/src/js/config/tools.ts
index fe62b12..53be816 100644
--- a/src/js/config/tools.ts
+++ b/src/js/config/tools.ts
@@ -720,6 +720,18 @@ export const categories = [
         icon: 'ph-shield-check',
         subtitle: 'Set or change user permissions on a PDF.',
       },
+      {
+        href: import.meta.env.BASE_URL + 'digital-sign-pdf.html',
+        name: 'Digital Signature',
+        icon: 'ph-certificate',
+        subtitle: 'Add a cryptographic digital signature using X.509 certificates.',
+      },
+      {
+        href: import.meta.env.BASE_URL + 'validate-signature-pdf.html',
+        name: 'Validate Signature',
+        icon: 'ph-seal-check',
+        subtitle: 'Verify digital signatures and view certificate details.',
+      },
     ],
   },
 ];
diff --git a/src/js/config/wasm-cdn-config.ts b/src/js/config/wasm-cdn-config.ts
index 823eddf..94b082d 100644
--- a/src/js/config/wasm-cdn-config.ts
+++ b/src/js/config/wasm-cdn-config.ts
@@ -9,12 +9,11 @@ const USE_CDN = import.meta.env.VITE_USE_CDN === 'true';
 import { CDN_URLS, PACKAGE_VERSIONS } from '../const/cdn-version';
 
 const LOCAL_PATHS = {
-    libreoffice: import.meta.env.BASE_URL + 'libreoffice-wasm/',
     ghostscript: import.meta.env.BASE_URL + 'ghostscript-wasm/',
     pymupdf: import.meta.env.BASE_URL + 'pymupdf-wasm/',
 } as const;
 
-export type WasmPackage = 'libreoffice' | 'ghostscript' | 'pymupdf';
+export type WasmPackage = 'ghostscript' | 'pymupdf';
 
 export function getWasmBaseUrl(packageName: WasmPackage): string {
     if (USE_CDN) {
diff --git a/src/js/const/cdn-version.ts b/src/js/const/cdn-version.ts
index 03490a2..c5ec5f4 100644
--- a/src/js/const/cdn-version.ts
+++ b/src/js/const/cdn-version.ts
@@ -1,11 +1,9 @@
 export const PACKAGE_VERSIONS = {
-    libreoffice: '2.3.1', 
-    ghostscript: '0.1.0', 
-    pymupdf: '0.1.9', 
+    ghostscript: '0.1.0',
+    pymupdf: '0.1.9',
 } as const;
 
 export const CDN_URLS = {
-    libreoffice: `https://cdn.jsdelivr.net/npm/@bentopdf/libreoffice-wasm@${PACKAGE_VERSIONS.libreoffice}/assets/`,
     ghostscript: `https://cdn.jsdelivr.net/npm/@bentopdf/gs-wasm@${PACKAGE_VERSIONS.ghostscript}/assets/`,
     pymupdf: `https://cdn.jsdelivr.net/npm/@bentopdf/pymupdf-wasm@${PACKAGE_VERSIONS.pymupdf}/assets/`,
 } as const;
\ No newline at end of file
diff --git a/src/js/handlers/fileHandler.ts b/src/js/handlers/fileHandler.ts
index c1c476b..1622de9 100644
--- a/src/js/handlers/fileHandler.ts
+++ b/src/js/handlers/fileHandler.ts
@@ -170,14 +170,14 @@ async function handleSinglePdfUpload(toolId, file) {
 
           if (rotateAllDecrementBtn) {
             rotateAllDecrementBtn.onclick = () => {
-              let current = parseInt(rotateAllCustomInput.value) || 0;
+              const current = parseInt(rotateAllCustomInput.value) || 0;
               rotateAllCustomInput.value = (current - 1).toString();
             };
           }
 
           if (rotateAllIncrementBtn) {
             rotateAllIncrementBtn.onclick = () => {
-              let current = parseInt(rotateAllCustomInput.value) || 0;
+              const current = parseInt(rotateAllCustomInput.value) || 0;
               rotateAllCustomInput.value = (current + 1).toString();
             };
           }
@@ -262,7 +262,7 @@ async function handleSinglePdfUpload(toolId, file) {
         const infoSection = createSection('Info Dictionary');
         if (info && Object.keys(info).length > 0) {
           for (const key in info) {
-            let value = info[key];
+            const value = info[key];
             let displayValue;
 
             if (value === null || typeof value === 'undefined') {
diff --git a/src/js/i18n/i18n.ts b/src/js/i18n/i18n.ts
index 2793696..e7f5165 100644
--- a/src/js/i18n/i18n.ts
+++ b/src/js/i18n/i18n.ts
@@ -3,7 +3,7 @@ import LanguageDetector from 'i18next-browser-languagedetector';
 import HttpBackend from 'i18next-http-backend';
 
 // Supported languages
-export const supportedLanguages = ['en', 'de', 'es', 'zh', 'vi'] as const;
+export const supportedLanguages = ['en', 'de', 'es', 'zh', 'vi', 'it'] as const;
 export type SupportedLanguage = (typeof supportedLanguages)[number];
 
 export const languageNames: Record<SupportedLanguage, string> = {
@@ -12,11 +12,12 @@ export const languageNames: Record<SupportedLanguage, string> = {
     es: 'Español',
     zh: '中文',
     vi: 'Tiếng Việt',
+    it: 'Italiano',
 };
 
 export const getLanguageFromUrl = (): SupportedLanguage => {
     const path = window.location.pathname;
-    const langMatch = path.match(/^\/(en|de|es|zh|vi)(?:\/|$)/);
+    const langMatch = path.match(/^\/(en|de|es|zh|vi|it)(?:\/|$)/);
     if (langMatch && supportedLanguages.includes(langMatch[1] as SupportedLanguage)) {
         return langMatch[1] as SupportedLanguage;
     }
@@ -72,12 +73,12 @@ export const changeLanguage = (lang: SupportedLanguage): void => {
     const currentLang = getLanguageFromUrl();
 
     let newPath: string;
-    if (currentPath.match(/^\/(en|de|zh|vi)\//)) {
-        newPath = currentPath.replace(/^\/(en|de|zh|vi)\//, `/${lang}/`);
-    } else if (currentPath.match(/^\/(en|de|zh|vi)$/)) {
-        newPath = `/${lang}`;
+    if (currentPath.match(/^\/(en|de|zh|vi|it)\//)) {
+      newPath = currentPath.replace(/^\/(en|de|zh|vi|it)\//, `/${lang}/`);
+    } else if (currentPath.match(/^\/(en|de|zh|vi|it)$/)) {
+      newPath = `/${lang}`;
     } else {
-        newPath = `/${lang}${currentPath}`;
+      newPath = `/${lang}${currentPath}`;
     }
 
     const newUrl = newPath + window.location.search + window.location.hash;
@@ -136,8 +137,8 @@ export const rewriteLinks = (): void => {
             return;
         }
 
-        if (href.match(/^\/(en|de|zh|vi)\//)) {
-            return;
+        if (href.match(/^\/(en|de|zh|vi|it)\//)) {
+          return;
         }
         let newHref: string;
         if (href.startsWith('/')) {
diff --git a/src/js/logic/add-attachments-page.ts b/src/js/logic/add-attachments-page.ts
index 67ecc19..966a64b 100644
--- a/src/js/logic/add-attachments-page.ts
+++ b/src/js/logic/add-attachments-page.ts
@@ -1,3 +1,4 @@
+import { AddAttachmentState } from '@/types';
 import { showLoader, hideLoader, showAlert } from '../ui.js';
 import { downloadFile, formatBytes } from '../utils/helpers.js';
 import { createIcons, icons } from 'lucide';
@@ -5,12 +6,6 @@ import { PDFDocument as PDFLibDocument } from 'pdf-lib';
 
 const worker = new Worker(import.meta.env.BASE_URL + 'workers/add-attachments.worker.js');
 
-interface AddAttachmentState {
-    file: File | null;
-    pdfDoc: PDFLibDocument | null;
-    attachments: File[];
-}
-
 const pageState: AddAttachmentState = {
     file: null,
     pdfDoc: null,
diff --git a/src/js/logic/add-blank-page-page.ts b/src/js/logic/add-blank-page-page.ts
index 2e797d7..ee9387e 100644
--- a/src/js/logic/add-blank-page-page.ts
+++ b/src/js/logic/add-blank-page-page.ts
@@ -2,11 +2,8 @@ import { showLoader, hideLoader, showAlert } from '../ui.js';
 import { downloadFile, formatBytes } from '../utils/helpers.js';
 import { createIcons, icons } from 'lucide';
 import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+import { AddBlankPageState } from '@/types';
 
-interface AddBlankPageState {
-    file: File | null;
-    pdfDoc: PDFLibDocument | null;
-}
 
 const pageState: AddBlankPageState = {
     file: null,
diff --git a/src/js/logic/add-stamps.ts b/src/js/logic/add-stamps.ts
index 27cf6fc..a34c7f5 100644
--- a/src/js/logic/add-stamps.ts
+++ b/src/js/logic/add-stamps.ts
@@ -35,8 +35,7 @@ function resetState() {
     viewerContainer.style.aspectRatio = ''
   }
 
-  // Revert container width only if NOT in full width mode
-  const isFullWidth = localStorage.getItem('fullWidthMode') === 'true'
+  const isFullWidth = localStorage.getItem('fullWidthMode') !== 'false'
   if (toolUploader && !isFullWidth) {
     toolUploader.classList.remove('max-w-6xl')
     toolUploader.classList.add('max-w-2xl')
@@ -56,8 +55,8 @@ function updateFileList() {
   fileListDiv.classList.remove('hidden')
   fileListDiv.innerHTML = ''
 
-  // Expand container width for viewer if NOT in full width mode
-  const isFullWidth = localStorage.getItem('fullWidthMode') === 'true'
+  // Expand container width for viewer if NOT in full width mode (default to true if not set)
+  const isFullWidth = localStorage.getItem('fullWidthMode') !== 'false'
   if (toolUploader && !isFullWidth) {
     toolUploader.classList.remove('max-w-2xl')
     toolUploader.classList.add('max-w-6xl')
diff --git a/src/js/logic/add-watermark-page.ts b/src/js/logic/add-watermark-page.ts
index 50cc5de..7d366c9 100644
--- a/src/js/logic/add-watermark-page.ts
+++ b/src/js/logic/add-watermark-page.ts
@@ -2,13 +2,9 @@ import { createIcons, icons } from 'lucide';
 import { showAlert, showLoader, hideLoader } from '../ui.js';
 import { downloadFile, hexToRgb, formatBytes, readFileAsArrayBuffer } from '../utils/helpers.js';
 import { PDFDocument as PDFLibDocument, rgb, degrees, StandardFonts } from 'pdf-lib';
+import { AddWatermarkState } from '@/types';
 
-interface PageState {
-    file: File | null;
-    pdfDoc: PDFLibDocument | null;
-}
-
-const pageState: PageState = { file: null, pdfDoc: null };
+const pageState: AddWatermarkState = { file: null, pdfDoc: null };
 
 if (document.readyState === 'loading') {
     document.addEventListener('DOMContentLoaded', initializePage);
diff --git a/src/js/logic/alternate-merge-page.ts b/src/js/logic/alternate-merge-page.ts
index c374cbe..712575d 100644
--- a/src/js/logic/alternate-merge-page.ts
+++ b/src/js/logic/alternate-merge-page.ts
@@ -1,14 +1,9 @@
+import { AlternateMergeState } from '@/types';
 import { showLoader, hideLoader, showAlert } from '../ui.js';
 import { downloadFile, formatBytes, getPDFDocument } from '../utils/helpers.js';
 import { createIcons, icons } from 'lucide';
 import Sortable from 'sortablejs';
 
-interface AlternateMergeState {
-    files: File[];
-    pdfBytes: Map<string, ArrayBuffer>;
-    pdfDocs: Map<string, any>;
-}
-
 const pageState: AlternateMergeState = {
     files: [],
     pdfBytes: new Map(),
diff --git a/src/js/logic/background-color-page.ts b/src/js/logic/background-color-page.ts
index 4506636..da08bb9 100644
--- a/src/js/logic/background-color-page.ts
+++ b/src/js/logic/background-color-page.ts
@@ -2,9 +2,9 @@ import { createIcons, icons } from 'lucide';
 import { showAlert, showLoader, hideLoader } from '../ui.js';
 import { downloadFile, hexToRgb, formatBytes } from '../utils/helpers.js';
 import { PDFDocument as PDFLibDocument, rgb } from 'pdf-lib';
+import { BackgroundColorState } from '@/types';
 
-interface PageState { file: File | null; pdfDoc: PDFLibDocument | null; }
-const pageState: PageState = { file: null, pdfDoc: null };
+const pageState: BackgroundColorState = { file: null, pdfDoc: null };
 
 if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', initializePage); }
 else { initializePage(); }
diff --git a/src/js/logic/bookmark-pdf.ts b/src/js/logic/bookmark-pdf.ts
index d2ca899..0b21e99 100644
--- a/src/js/logic/bookmark-pdf.ts
+++ b/src/js/logic/bookmark-pdf.ts
@@ -771,8 +771,8 @@ let searchQuery = '';
 let csvBookmarks = null;
 let jsonBookmarks = null;
 let batchMode = false;
-let selectedBookmarks = new Set();
-let collapsedNodes = new Set();
+const selectedBookmarks = new Set();
+const collapsedNodes = new Set();
 
 const colorClasses = {
   red: 'bg-red-100 border-red-300',
@@ -1126,7 +1126,7 @@ async function renderPage(num, zoom = null, destX = null, destY = null) {
 
   const dpr = window.devicePixelRatio || 1;
 
-  let viewport = page.getViewport({ scale: zoomScale });
+  const viewport = page.getViewport({ scale: zoomScale });
   currentViewport = viewport;
 
   canvas.height = viewport.height * dpr;
diff --git a/src/js/logic/cbz-to-pdf-page.ts b/src/js/logic/cbz-to-pdf-page.ts
index c1886cc..060d40c 100644
--- a/src/js/logic/cbz-to-pdf-page.ts
+++ b/src/js/logic/cbz-to-pdf-page.ts
@@ -4,10 +4,139 @@ import { state } from '../state.js';
 import { createIcons, icons } from 'lucide';
 import { PyMuPDF } from '@bentopdf/pymupdf-wasm';
 import { getWasmBaseUrl } from '../config/wasm-cdn-config.js';
+import JSZip from 'jszip';
+import { PDFDocument } from 'pdf-lib';
 
-const FILETYPE = 'cbz';
 const EXTENSIONS = ['.cbz', '.cbr'];
 const TOOL_NAME = 'CBZ';
+const ALL_IMAGE_EXTENSIONS = ['.jpg', '.jpeg', '.png', '.gif', '.bmp', '.tiff', '.tif', '.webp', '.avif', '.jxl', '.heic', '.heif'];
+
+const IMAGE_SIGNATURES = {
+    jpeg: [0xFF, 0xD8, 0xFF],
+    png: [0x89, 0x50, 0x4E, 0x47],
+    gif: [0x47, 0x49, 0x46],
+    bmp: [0x42, 0x4D],
+    webp: [0x52, 0x49, 0x46, 0x46],
+    avif: [0x00, 0x00, 0x00],
+};
+
+function matchesSignature(data: Uint8Array, signature: number[], offset = 0): boolean {
+    for (let i = 0; i < signature.length; i++) {
+        if (data[offset + i] !== signature[i]) return false;
+    }
+    return true;
+}
+
+function detectImageFormat(data: Uint8Array): 'jpeg' | 'png' | 'gif' | 'bmp' | 'webp' | 'avif' | 'unknown' {
+    if (data.length < 12) return 'unknown';
+    if (matchesSignature(data, IMAGE_SIGNATURES.jpeg)) return 'jpeg';
+    if (matchesSignature(data, IMAGE_SIGNATURES.png)) return 'png';
+    if (matchesSignature(data, IMAGE_SIGNATURES.gif)) return 'gif';
+    if (matchesSignature(data, IMAGE_SIGNATURES.bmp)) return 'bmp';
+    if (matchesSignature(data, IMAGE_SIGNATURES.webp) &&
+        data[8] === 0x57 && data[9] === 0x45 && data[10] === 0x42 && data[11] === 0x50) {
+        return 'webp';
+    }
+    if (data[4] === 0x66 && data[5] === 0x74 && data[6] === 0x79 && data[7] === 0x70) {
+        const brand = String.fromCharCode(data[8], data[9], data[10], data[11]);
+        if (brand === 'avif' || brand === 'avis' || brand === 'mif1' || brand === 'miaf') {
+            return 'avif';
+        }
+    }
+    return 'unknown';
+}
+
+function isCbzFile(filename: string): boolean {
+    return filename.toLowerCase().endsWith('.cbz');
+}
+
+async function convertImageToPng(imageData: ArrayBuffer, filename: string): Promise<Blob> {
+    return new Promise((resolve, reject) => {
+        const blob = new Blob([imageData]);
+        const url = URL.createObjectURL(blob);
+        const img = new Image();
+        img.onload = () => {
+            const canvas = document.createElement('canvas');
+            canvas.width = img.width;
+            canvas.height = img.height;
+            const ctx = canvas.getContext('2d');
+            if (!ctx) {
+                URL.revokeObjectURL(url);
+                reject(new Error('Failed to get canvas context'));
+                return;
+            }
+            ctx.drawImage(img, 0, 0);
+            canvas.toBlob((pngBlob) => {
+                URL.revokeObjectURL(url);
+                if (pngBlob) {
+                    resolve(pngBlob);
+                } else {
+                    reject(new Error(`Failed to convert ${filename} to PNG`));
+                }
+            }, 'image/png');
+        };
+        img.onerror = () => {
+            URL.revokeObjectURL(url);
+            reject(new Error(`Failed to load image: ${filename}`));
+        };
+        img.src = url;
+    });
+}
+
+async function convertCbzToPdf(file: File): Promise<Blob> {
+    const zip = await JSZip.loadAsync(file);
+    const pdfDoc = await PDFDocument.create();
+
+    const imageFiles = Object.keys(zip.files)
+        .filter(name => {
+            if (zip.files[name].dir) return false;
+            const ext = name.toLowerCase().substring(name.lastIndexOf('.'));
+            return ALL_IMAGE_EXTENSIONS.includes(ext);
+        })
+        .sort((a, b) => a.localeCompare(b, undefined, { numeric: true, sensitivity: 'base' }));
+
+    for (const filename of imageFiles) {
+        const zipEntry = zip.files[filename];
+        const imageData = await zipEntry.async('arraybuffer');
+        const dataArray = new Uint8Array(imageData);
+        const actualFormat = detectImageFormat(dataArray);
+
+        let imageBytes: Uint8Array;
+        let embedMethod: 'png' | 'jpg';
+
+        if (actualFormat === 'jpeg') {
+            imageBytes = dataArray;
+            embedMethod = 'jpg';
+        } else if (actualFormat === 'png') {
+            imageBytes = dataArray;
+            embedMethod = 'png';
+        } else {
+            const pngBlob = await convertImageToPng(imageData, filename);
+            imageBytes = new Uint8Array(await pngBlob.arrayBuffer());
+            embedMethod = 'png';
+        }
+
+        const image = embedMethod === 'png'
+            ? await pdfDoc.embedPng(imageBytes)
+            : await pdfDoc.embedJpg(imageBytes);
+        const page = pdfDoc.addPage([image.width, image.height]);
+        page.drawImage(image, {
+            x: 0,
+            y: 0,
+            width: image.width,
+            height: image.height,
+        });
+    }
+
+    const pdfBytes = await pdfDoc.save();
+    return new Blob([pdfBytes.buffer as ArrayBuffer], { type: 'application/pdf' });
+}
+
+async function convertCbrToPdf(file: File): Promise<Blob> {
+    const pymupdf = new PyMuPDF(getWasmBaseUrl('pymupdf'));
+    await pymupdf.load();
+    return await pymupdf.convertToPdf(file, { filetype: 'cbz' });
+}
 
 document.addEventListener('DOMContentLoaded', () => {
     const fileInput = document.getElementById('file-input') as HTMLInputElement;
@@ -86,17 +215,18 @@ document.addEventListener('DOMContentLoaded', () => {
                 return;
             }
 
-            showLoader('Loading engine...');
-            const pymupdf = new PyMuPDF(getWasmBaseUrl('pymupdf'));
-            await pymupdf.load();
-
             if (state.files.length === 1) {
                 const originalFile = state.files[0];
                 showLoader(`Converting ${originalFile.name}...`);
 
-                const pdfBlob = await pymupdf.convertToPdf(originalFile, { filetype: FILETYPE });
-                const fileName = originalFile.name.replace(/\.[^.]+$/, '') + '.pdf';
+                let pdfBlob: Blob;
+                if (isCbzFile(originalFile.name)) {
+                    pdfBlob = await convertCbzToPdf(originalFile);
+                } else {
+                    pdfBlob = await convertCbrToPdf(originalFile);
+                }
 
+                const fileName = originalFile.name.replace(/\.[^.]+$/, '') + '.pdf';
                 downloadFile(pdfBlob, fileName);
                 hideLoader();
 
@@ -108,21 +238,26 @@ document.addEventListener('DOMContentLoaded', () => {
                 );
             } else {
                 showLoader('Converting files...');
-                const JSZip = (await import('jszip')).default;
-                const zip = new JSZip();
+                const outputZip = new JSZip();
 
                 for (let i = 0; i < state.files.length; i++) {
                     const file = state.files[i];
                     showLoader(`Converting ${i + 1}/${state.files.length}: ${file.name}...`);
 
-                    const pdfBlob = await pymupdf.convertToPdf(file, { filetype: FILETYPE });
+                    let pdfBlob: Blob;
+                    if (isCbzFile(file.name)) {
+                        pdfBlob = await convertCbzToPdf(file);
+                    } else {
+                        pdfBlob = await convertCbrToPdf(file);
+                    }
+
                     const baseName = file.name.replace(/\.[^.]+$/, '');
                     const pdfBuffer = await pdfBlob.arrayBuffer();
-                    zip.file(`${baseName}.pdf`, pdfBuffer);
+                    outputZip.file(`${baseName}.pdf`, pdfBuffer);
                 }
 
-                const zipBlob = await zip.generateAsync({ type: 'blob' });
-                downloadFile(zipBlob, `${FILETYPE}-converted.zip`);
+                const zipBlob = await outputZip.generateAsync({ type: 'blob' });
+                downloadFile(zipBlob, 'comic-converted.zip');
 
                 hideLoader();
 
diff --git a/src/js/logic/change-permissions-page.ts b/src/js/logic/change-permissions-page.ts
index d3255be..b22d895 100644
--- a/src/js/logic/change-permissions-page.ts
+++ b/src/js/logic/change-permissions-page.ts
@@ -1,12 +1,9 @@
 import { showAlert } from '../ui.js';
 import { downloadFile, formatBytes, initializeQpdf, readFileAsArrayBuffer } from '../utils/helpers.js';
 import { icons, createIcons } from 'lucide';
+import { ChangePermissionsState } from '@/types';
 
-interface PageState {
-    file: File | null;
-}
-
-const pageState: PageState = {
+const pageState: ChangePermissionsState = {
     file: null,
 };
 
diff --git a/src/js/logic/combine-single-page-page.ts b/src/js/logic/combine-single-page-page.ts
index 5750de9..e6a89df 100644
--- a/src/js/logic/combine-single-page-page.ts
+++ b/src/js/logic/combine-single-page-page.ts
@@ -3,15 +3,11 @@ import { downloadFile, formatBytes, hexToRgb, getPDFDocument } from '../utils/he
 import { createIcons, icons } from 'lucide';
 import { PDFDocument as PDFLibDocument, rgb } from 'pdf-lib';
 import * as pdfjsLib from 'pdfjs-dist';
+import { CombineSinglePageState } from '@/types';
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
 
-interface CombineState {
-    file: File | null;
-    pdfDoc: PDFLibDocument | null;
-}
-
-const pageState: CombineState = {
+const pageState: CombineSinglePageState = {
     file: null,
     pdfDoc: null,
 };
diff --git a/src/js/logic/compare-pdfs-page.ts b/src/js/logic/compare-pdfs-page.ts
index 1eadb23..93cd7dc 100644
--- a/src/js/logic/compare-pdfs-page.ts
+++ b/src/js/logic/compare-pdfs-page.ts
@@ -2,17 +2,10 @@ import { showLoader, hideLoader, showAlert } from '../ui.js';
 import { getPDFDocument } from '../utils/helpers.js';
 import { icons, createIcons } from 'lucide';
 import * as pdfjsLib from 'pdfjs-dist';
+import { CompareState } from '@/types';
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
 
-interface CompareState {
-    pdfDoc1: pdfjsLib.PDFDocumentProxy | null;
-    pdfDoc2: pdfjsLib.PDFDocumentProxy | null;
-    currentPage: number;
-    viewMode: 'overlay' | 'side-by-side';
-    isSyncScroll: boolean;
-}
-
 const pageState: CompareState = {
     pdfDoc1: null,
     pdfDoc2: null,
diff --git a/src/js/logic/crop-pdf-page.ts b/src/js/logic/crop-pdf-page.ts
index 4c2b9f0..b399e04 100644
--- a/src/js/logic/crop-pdf-page.ts
+++ b/src/js/logic/crop-pdf-page.ts
@@ -4,18 +4,10 @@ import { downloadFile, readFileAsArrayBuffer, formatBytes, getPDFDocument } from
 import Cropper from 'cropperjs';
 import * as pdfjsLib from 'pdfjs-dist';
 import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+import { CropperState } from '@/types';
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
 
-interface CropperState {
-    pdfDoc: any;
-    currentPageNum: number;
-    cropper: any;
-    originalPdfBytes: ArrayBuffer | null;
-    pageCrops: Record<number, any>;
-    file: File | null;
-}
-
 const cropperState: CropperState = {
     pdfDoc: null,
     currentPageNum: 1,
diff --git a/src/js/logic/decrypt-pdf-page.ts b/src/js/logic/decrypt-pdf-page.ts
index 344f9fa..af291fd 100644
--- a/src/js/logic/decrypt-pdf-page.ts
+++ b/src/js/logic/decrypt-pdf-page.ts
@@ -1,12 +1,9 @@
 import { showAlert } from '../ui.js';
 import { downloadFile, formatBytes, initializeQpdf, readFileAsArrayBuffer } from '../utils/helpers.js';
 import { icons, createIcons } from 'lucide';
+import { DecryptPdfState } from '@/types';
 
-interface PageState {
-    file: File | null;
-}
-
-const pageState: PageState = {
+const pageState: DecryptPdfState = {
     file: null,
 };
 
diff --git a/src/js/logic/delete-pages-page.ts b/src/js/logic/delete-pages-page.ts
index 852bf6e..04731ad 100644
--- a/src/js/logic/delete-pages-page.ts
+++ b/src/js/logic/delete-pages-page.ts
@@ -3,18 +3,11 @@ import { showAlert, showLoader, hideLoader } from '../ui.js';
 import { readFileAsArrayBuffer, formatBytes, downloadFile, getPDFDocument, parsePageRanges } from '../utils/helpers.js';
 import { PDFDocument } from 'pdf-lib';
 import * as pdfjsLib from 'pdfjs-dist';
+import { DeletePagesState } from '@/types';
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
 
-interface DeleteState {
-    file: File | null;
-    pdfDoc: any;
-    pdfJsDoc: any;
-    totalPages: number;
-    pagesToDelete: Set<number>;
-}
-
-const deleteState: DeleteState = {
+const deleteState: DeletePagesState = {
     file: null,
     pdfDoc: null,
     pdfJsDoc: null,
diff --git a/src/js/logic/digital-sign-pdf-page.ts b/src/js/logic/digital-sign-pdf-page.ts
new file mode 100644
index 0000000..306b22a
--- /dev/null
+++ b/src/js/logic/digital-sign-pdf-page.ts
@@ -0,0 +1,689 @@
+import { createIcons, icons } from 'lucide';
+import { showAlert, showLoader, hideLoader } from '../ui.js';
+import { readFileAsArrayBuffer, formatBytes, downloadFile, getPDFDocument } from '../utils/helpers.js';
+import {
+    signPdf,
+    parsePfxFile,
+    parseCombinedPem,
+    getCertificateInfo,
+} from './digital-sign-pdf.js';
+import { SignatureInfo, VisibleSignatureOptions, DigitalSignState } from '@/types';
+
+const state: DigitalSignState = {
+    pdfFile: null,
+    pdfBytes: null,
+    certFile: null,
+    certData: null,
+    sigImageData: null,
+    sigImageType: null,
+};
+
+function resetState(): void {
+    state.pdfFile = null;
+    state.pdfBytes = null;
+    state.certFile = null;
+    state.certData = null;
+    state.sigImageData = null;
+    state.sigImageType = null;
+
+    const fileDisplayArea = getElement<HTMLDivElement>('file-display-area');
+    if (fileDisplayArea) fileDisplayArea.innerHTML = '';
+
+    const certDisplayArea = getElement<HTMLDivElement>('cert-display-area');
+    if (certDisplayArea) certDisplayArea.innerHTML = '';
+
+    const fileInput = getElement<HTMLInputElement>('file-input');
+    if (fileInput) fileInput.value = '';
+
+    const certInput = getElement<HTMLInputElement>('cert-input');
+    if (certInput) certInput.value = '';
+
+    const sigImageInput = getElement<HTMLInputElement>('sig-image-input');
+    if (sigImageInput) sigImageInput.value = '';
+
+    const sigImagePreview = getElement<HTMLDivElement>('sig-image-preview');
+    if (sigImagePreview) sigImagePreview.classList.add('hidden');
+
+    const certSection = getElement<HTMLDivElement>('certificate-section');
+    if (certSection) certSection.classList.add('hidden');
+
+    hidePasswordSection();
+    hideSignatureOptions();
+    hideCertInfo();
+    updateProcessButton();
+}
+
+function getElement<T extends HTMLElement>(id: string): T | null {
+    return document.getElementById(id) as T | null;
+}
+
+function initializePage(): void {
+    createIcons({ icons });
+
+    const fileInput = getElement<HTMLInputElement>('file-input');
+    const dropZone = getElement<HTMLDivElement>('drop-zone');
+    const certInput = getElement<HTMLInputElement>('cert-input');
+    const certDropZone = getElement<HTMLDivElement>('cert-drop-zone');
+    const certPassword = getElement<HTMLInputElement>('cert-password');
+    const processBtn = getElement<HTMLButtonElement>('process-btn');
+    const backBtn = getElement<HTMLButtonElement>('back-to-tools');
+
+    if (fileInput) {
+        fileInput.addEventListener('change', handlePdfUpload);
+        fileInput.addEventListener('click', () => {
+            fileInput.value = '';
+        });
+    }
+
+    if (dropZone) {
+        dropZone.addEventListener('dragover', (e) => {
+            e.preventDefault();
+            dropZone.classList.add('bg-gray-700');
+        });
+
+        dropZone.addEventListener('dragleave', () => {
+            dropZone.classList.remove('bg-gray-700');
+        });
+
+        dropZone.addEventListener('drop', (e) => {
+            e.preventDefault();
+            dropZone.classList.remove('bg-gray-700');
+            const droppedFiles = e.dataTransfer?.files;
+            if (droppedFiles && droppedFiles.length > 0) {
+                handlePdfFile(droppedFiles[0]);
+            }
+        });
+    }
+
+    if (certInput) {
+        certInput.addEventListener('change', handleCertUpload);
+        certInput.addEventListener('click', () => {
+            certInput.value = '';
+        });
+    }
+
+    if (certDropZone) {
+        certDropZone.addEventListener('dragover', (e) => {
+            e.preventDefault();
+            certDropZone.classList.add('bg-gray-700');
+        });
+
+        certDropZone.addEventListener('dragleave', () => {
+            certDropZone.classList.remove('bg-gray-700');
+        });
+
+        certDropZone.addEventListener('drop', (e) => {
+            e.preventDefault();
+            certDropZone.classList.remove('bg-gray-700');
+            const droppedFiles = e.dataTransfer?.files;
+            if (droppedFiles && droppedFiles.length > 0) {
+                handleCertFile(droppedFiles[0]);
+            }
+        });
+    }
+
+    if (certPassword) {
+        certPassword.addEventListener('input', handlePasswordInput);
+        certPassword.addEventListener('keypress', (e) => {
+            if (e.key === 'Enter') {
+                handlePasswordInput();
+            }
+        });
+    }
+
+    if (processBtn) {
+        processBtn.addEventListener('click', processSignature);
+    }
+
+    if (backBtn) {
+        backBtn.addEventListener('click', () => {
+            window.location.href = import.meta.env.BASE_URL;
+        });
+    }
+
+    const enableVisibleSig = getElement<HTMLInputElement>('enable-visible-sig');
+    const visibleSigOptions = getElement<HTMLDivElement>('visible-sig-options');
+    const sigPage = getElement<HTMLSelectElement>('sig-page');
+    const customPageWrapper = getElement<HTMLDivElement>('custom-page-wrapper');
+    const sigImageInput = getElement<HTMLInputElement>('sig-image-input');
+    const sigImagePreview = getElement<HTMLDivElement>('sig-image-preview');
+    const sigImageThumb = getElement<HTMLImageElement>('sig-image-thumb');
+    const removeSigImage = getElement<HTMLButtonElement>('remove-sig-image');
+    const enableSigText = getElement<HTMLInputElement>('enable-sig-text');
+    const sigTextOptions = getElement<HTMLDivElement>('sig-text-options');
+
+    if (enableVisibleSig && visibleSigOptions) {
+        enableVisibleSig.addEventListener('change', () => {
+            if (enableVisibleSig.checked) {
+                visibleSigOptions.classList.remove('hidden');
+            } else {
+                visibleSigOptions.classList.add('hidden');
+            }
+        });
+    }
+
+    if (sigPage && customPageWrapper) {
+        sigPage.addEventListener('change', () => {
+            if (sigPage.value === 'custom') {
+                customPageWrapper.classList.remove('hidden');
+            } else {
+                customPageWrapper.classList.add('hidden');
+            }
+        });
+    }
+
+    if (sigImageInput) {
+        sigImageInput.addEventListener('change', async (e) => {
+            const input = e.target as HTMLInputElement;
+            if (input.files && input.files.length > 0) {
+                const file = input.files[0];
+                const validTypes = ['image/png', 'image/jpeg', 'image/webp'];
+                if (!validTypes.includes(file.type)) {
+                    showAlert('Invalid Image', 'Please select a PNG, JPG, or WebP image.');
+                    return;
+                }
+                state.sigImageData = await readFileAsArrayBuffer(file) as ArrayBuffer;
+                state.sigImageType = file.type.replace('image/', '') as 'png' | 'jpeg' | 'webp';
+
+                if (sigImageThumb && sigImagePreview) {
+                    const url = URL.createObjectURL(file);
+                    sigImageThumb.src = url;
+                    sigImagePreview.classList.remove('hidden');
+                }
+            }
+        });
+    }
+
+    if (removeSigImage && sigImagePreview) {
+        removeSigImage.addEventListener('click', () => {
+            state.sigImageData = null;
+            state.sigImageType = null;
+            sigImagePreview.classList.add('hidden');
+            if (sigImageInput) sigImageInput.value = '';
+        });
+    }
+
+    if (enableSigText && sigTextOptions) {
+        enableSigText.addEventListener('change', () => {
+            if (enableSigText.checked) {
+                sigTextOptions.classList.remove('hidden');
+            } else {
+                sigTextOptions.classList.add('hidden');
+            }
+        });
+    }
+}
+
+function handlePdfUpload(e: Event): void {
+    const input = e.target as HTMLInputElement;
+    if (input.files && input.files.length > 0) {
+        handlePdfFile(input.files[0]);
+    }
+}
+
+async function handlePdfFile(file: File): Promise<void> {
+    if (file.type !== 'application/pdf' && !file.name.toLowerCase().endsWith('.pdf')) {
+        showAlert('Invalid File', 'Please select a PDF file.');
+        return;
+    }
+
+    state.pdfFile = file;
+    state.pdfBytes = new Uint8Array(await readFileAsArrayBuffer(file) as ArrayBuffer);
+
+    updatePdfDisplay();
+    showCertificateSection();
+}
+
+async function updatePdfDisplay(): Promise<void> {
+    const fileDisplayArea = getElement<HTMLDivElement>('file-display-area');
+
+    if (!fileDisplayArea || !state.pdfFile) return;
+
+    fileDisplayArea.innerHTML = '';
+
+    const fileDiv = document.createElement('div');
+    fileDiv.className = 'flex items-center justify-between bg-gray-700 p-3 rounded-lg';
+
+    const infoContainer = document.createElement('div');
+    infoContainer.className = 'flex flex-col flex-1 min-w-0';
+
+    const nameSpan = document.createElement('div');
+    nameSpan.className = 'truncate font-medium text-gray-200 text-sm mb-1';
+    nameSpan.textContent = state.pdfFile.name;
+
+    const metaSpan = document.createElement('div');
+    metaSpan.className = 'text-xs text-gray-400';
+    metaSpan.textContent = `${formatBytes(state.pdfFile.size)} • Loading pages...`;
+
+    infoContainer.append(nameSpan, metaSpan);
+
+    const removeBtn = document.createElement('button');
+    removeBtn.className = 'ml-4 text-red-400 hover:text-red-300 flex-shrink-0';
+    removeBtn.innerHTML = '<i data-lucide="trash-2" class="w-4 h-4"></i>';
+    removeBtn.onclick = () => {
+        state.pdfFile = null;
+        state.pdfBytes = null;
+        fileDisplayArea.innerHTML = '';
+        hideCertificateSection();
+        updateProcessButton();
+    };
+
+    fileDiv.append(infoContainer, removeBtn);
+    fileDisplayArea.appendChild(fileDiv);
+    createIcons({ icons });
+
+    try {
+        if (state.pdfBytes) {
+            const pdfDoc = await getPDFDocument({ data: state.pdfBytes.slice() }).promise;
+            metaSpan.textContent = `${formatBytes(state.pdfFile.size)} • ${pdfDoc.numPages} pages`;
+        }
+    } catch (error) {
+        console.error('Error loading PDF:', error);
+        metaSpan.textContent = `${formatBytes(state.pdfFile.size)}`;
+    }
+}
+
+function showCertificateSection(): void {
+    const certSection = getElement<HTMLDivElement>('certificate-section');
+    if (certSection) {
+        certSection.classList.remove('hidden');
+    }
+}
+
+function hideCertificateSection(): void {
+    const certSection = getElement<HTMLDivElement>('certificate-section');
+    const signatureOptions = getElement<HTMLDivElement>('signature-options');
+
+    if (certSection) {
+        certSection.classList.add('hidden');
+    }
+    if (signatureOptions) {
+        signatureOptions.classList.add('hidden');
+    }
+
+    state.certFile = null;
+    state.certData = null;
+
+    const certDisplayArea = getElement<HTMLDivElement>('cert-display-area');
+    if (certDisplayArea) {
+        certDisplayArea.innerHTML = '';
+    }
+
+    const certInfo = getElement<HTMLDivElement>('cert-info');
+    if (certInfo) {
+        certInfo.classList.add('hidden');
+    }
+
+    const certPasswordSection = getElement<HTMLDivElement>('cert-password-section');
+    if (certPasswordSection) {
+        certPasswordSection.classList.add('hidden');
+    }
+}
+
+function handleCertUpload(e: Event): void {
+    const input = e.target as HTMLInputElement;
+    if (input.files && input.files.length > 0) {
+        handleCertFile(input.files[0]);
+    }
+}
+
+async function handleCertFile(file: File): Promise<void> {
+    const validExtensions = ['.pfx', '.p12', '.pem'];
+    const hasValidExtension = validExtensions.some(ext =>
+        file.name.toLowerCase().endsWith(ext)
+    );
+
+    if (!hasValidExtension) {
+        showAlert('Invalid Certificate', 'Please select a .pfx, .p12, or .pem certificate file.');
+        return;
+    }
+
+    state.certFile = file;
+    state.certData = null;
+
+    updateCertDisplay();
+
+    const isPemFile = file.name.toLowerCase().endsWith('.pem');
+
+    if (isPemFile) {
+        try {
+            const pemContent = await file.text();
+            const isEncrypted = pemContent.includes('ENCRYPTED');
+
+            if (isEncrypted) {
+                showPasswordSection();
+                updatePasswordLabel('Private Key Password');
+            } else {
+                state.certData = parseCombinedPem(pemContent);
+                updateCertInfo();
+                showSignatureOptions();
+
+                const certStatus = getElement<HTMLDivElement>('cert-status');
+                if (certStatus) {
+                    certStatus.innerHTML = 'Certificate loaded <i data-lucide="check" class="inline w-4 h-4"></i>';
+                    createIcons({ icons });
+                    certStatus.className = 'text-xs text-green-400';
+                }
+            }
+        } catch (error) {
+            const certStatus = getElement<HTMLDivElement>('cert-status');
+            if (certStatus) {
+                certStatus.textContent = 'Failed to parse PEM file';
+                certStatus.className = 'text-xs text-red-400';
+            }
+        }
+    } else {
+        showPasswordSection();
+        updatePasswordLabel('Certificate Password');
+    }
+
+    hideSignatureOptions();
+    updateProcessButton();
+}
+
+function updateCertDisplay(): void {
+    const certDisplayArea = getElement<HTMLDivElement>('cert-display-area');
+
+    if (!certDisplayArea || !state.certFile) return;
+
+    certDisplayArea.innerHTML = '';
+
+    const certDiv = document.createElement('div');
+    certDiv.className = 'flex items-center justify-between bg-gray-700 p-3 rounded-lg';
+
+    const infoContainer = document.createElement('div');
+    infoContainer.className = 'flex flex-col flex-1 min-w-0';
+
+    const nameSpan = document.createElement('div');
+    nameSpan.className = 'truncate font-medium text-gray-200 text-sm mb-1';
+    nameSpan.textContent = state.certFile.name;
+
+    const metaSpan = document.createElement('div');
+    metaSpan.className = 'text-xs text-gray-400';
+    metaSpan.id = 'cert-status';
+    metaSpan.textContent = 'Enter password to unlock';
+
+    infoContainer.append(nameSpan, metaSpan);
+
+    const removeBtn = document.createElement('button');
+    removeBtn.className = 'ml-4 text-red-400 hover:text-red-300 flex-shrink-0';
+    removeBtn.innerHTML = '<i data-lucide="trash-2" class="w-4 h-4"></i>';
+    removeBtn.onclick = () => {
+        state.certFile = null;
+        state.certData = null;
+        certDisplayArea.innerHTML = '';
+        hidePasswordSection();
+        hideCertInfo();
+        hideSignatureOptions();
+        updateProcessButton();
+    };
+
+    certDiv.append(infoContainer, removeBtn);
+    certDisplayArea.appendChild(certDiv);
+    createIcons({ icons });
+}
+
+function showPasswordSection(): void {
+    const certPasswordSection = getElement<HTMLDivElement>('cert-password-section');
+    if (certPasswordSection) {
+        certPasswordSection.classList.remove('hidden');
+    }
+
+    const certPassword = getElement<HTMLInputElement>('cert-password');
+    if (certPassword) {
+        certPassword.value = '';
+        certPassword.focus();
+    }
+}
+
+function updatePasswordLabel(labelText: string): void {
+    const label = document.querySelector('label[for="cert-password"]');
+    if (label) {
+        label.textContent = labelText;
+    }
+}
+
+function hidePasswordSection(): void {
+    const certPasswordSection = getElement<HTMLDivElement>('cert-password-section');
+    if (certPasswordSection) {
+        certPasswordSection.classList.add('hidden');
+    }
+}
+
+function showSignatureOptions(): void {
+    const signatureOptions = getElement<HTMLDivElement>('signature-options');
+    if (signatureOptions) {
+        signatureOptions.classList.remove('hidden');
+    }
+    const visibleSigSection = getElement<HTMLDivElement>('visible-signature-section');
+    if (visibleSigSection) {
+        visibleSigSection.classList.remove('hidden');
+    }
+}
+
+function hideSignatureOptions(): void {
+    const signatureOptions = getElement<HTMLDivElement>('signature-options');
+    if (signatureOptions) {
+        signatureOptions.classList.add('hidden');
+    }
+    const visibleSigSection = getElement<HTMLDivElement>('visible-signature-section');
+    if (visibleSigSection) {
+        visibleSigSection.classList.add('hidden');
+    }
+}
+
+function hideCertInfo(): void {
+    const certInfo = getElement<HTMLDivElement>('cert-info');
+    if (certInfo) {
+        certInfo.classList.add('hidden');
+    }
+}
+
+async function handlePasswordInput(): Promise<void> {
+    const certPassword = getElement<HTMLInputElement>('cert-password');
+    const password = certPassword?.value ?? '';
+
+    if (!state.certFile || !password) {
+        return;
+    }
+
+    try {
+        const isPemFile = state.certFile.name.toLowerCase().endsWith('.pem');
+
+        if (isPemFile) {
+            const pemContent = await state.certFile.text();
+            state.certData = parseCombinedPem(pemContent, password);
+        } else {
+            const certBytes = await readFileAsArrayBuffer(state.certFile) as ArrayBuffer;
+            state.certData = parsePfxFile(certBytes, password);
+        }
+
+        updateCertInfo();
+        showSignatureOptions();
+        updateProcessButton();
+
+        const certStatus = getElement<HTMLDivElement>('cert-status');
+        if (certStatus) {
+            certStatus.innerHTML = 'Certificate unlocked <i data-lucide="check-circle" class="inline w-4 h-4"></i>';
+            createIcons({ icons });
+            certStatus.className = 'text-xs text-green-400';
+        }
+    } catch (error) {
+        state.certData = null;
+        hideSignatureOptions();
+        updateProcessButton();
+
+        const certStatus = getElement<HTMLDivElement>('cert-status');
+        if (certStatus) {
+            const errorMessage = error instanceof Error ? error.message : 'Invalid password or certificate';
+            certStatus.textContent = errorMessage.includes('password')
+                ? 'Incorrect password'
+                : 'Failed to parse certificate';
+            certStatus.className = 'text-xs text-red-400';
+        }
+    }
+}
+
+function updateCertInfo(): void {
+    if (!state.certData) return;
+
+    const certInfo = getElement<HTMLDivElement>('cert-info');
+    const certSubject = getElement<HTMLSpanElement>('cert-subject');
+    const certIssuer = getElement<HTMLSpanElement>('cert-issuer');
+    const certValidity = getElement<HTMLSpanElement>('cert-validity');
+
+    if (!certInfo) return;
+
+    const info = getCertificateInfo(state.certData.certificate);
+
+    if (certSubject) {
+        certSubject.textContent = info.subject;
+    }
+    if (certIssuer) {
+        certIssuer.textContent = info.issuer;
+    }
+    if (certValidity) {
+        const formatDate = (date: Date) => date.toLocaleDateString();
+        certValidity.textContent = `${formatDate(info.validFrom)} - ${formatDate(info.validTo)}`;
+    }
+
+    certInfo.classList.remove('hidden');
+}
+
+function updateProcessButton(): void {
+    const processBtn = getElement<HTMLButtonElement>('process-btn');
+    if (!processBtn) return;
+
+    const canProcess = state.pdfBytes !== null && state.certData !== null;
+
+    if (canProcess) {
+        processBtn.style.display = '';
+    } else {
+        processBtn.style.display = 'none';
+    }
+}
+
+async function processSignature(): Promise<void> {
+    if (!state.pdfBytes || !state.certData) {
+        showAlert('Missing Data', 'Please upload both a PDF and a valid certificate.');
+        return;
+    }
+
+    const reason = getElement<HTMLInputElement>('sign-reason')?.value ?? '';
+    const location = getElement<HTMLInputElement>('sign-location')?.value ?? '';
+    const contactInfo = getElement<HTMLInputElement>('sign-contact')?.value ?? '';
+
+    const signatureInfo: SignatureInfo = {};
+    if (reason) signatureInfo.reason = reason;
+    if (location) signatureInfo.location = location;
+    if (contactInfo) signatureInfo.contactInfo = contactInfo;
+
+    let visibleSignature: VisibleSignatureOptions | undefined;
+
+    const enableVisibleSig = getElement<HTMLInputElement>('enable-visible-sig');
+    if (enableVisibleSig?.checked) {
+        const sigX = parseInt(getElement<HTMLInputElement>('sig-x')?.value ?? '25', 10);
+        const sigY = parseInt(getElement<HTMLInputElement>('sig-y')?.value ?? '700', 10);
+        const sigWidth = parseInt(getElement<HTMLInputElement>('sig-width')?.value ?? '150', 10);
+        const sigHeight = parseInt(getElement<HTMLInputElement>('sig-height')?.value ?? '70', 10);
+
+        const sigPageSelect = getElement<HTMLSelectElement>('sig-page');
+        let sigPage: number | string = 0;
+        let numPages = 1;
+
+        try {
+            const pdfDoc = await getPDFDocument({ data: state.pdfBytes.slice() }).promise;
+            numPages = pdfDoc.numPages;
+        } catch (error) {
+            console.error('Error getting PDF page count:', error);
+        }
+
+        if (sigPageSelect) {
+            if (sigPageSelect.value === 'last') {
+                sigPage = (numPages - 1).toString();
+            } else if (sigPageSelect.value === 'all') {
+                if (numPages === 1) {
+                    sigPage = '0';
+                } else {
+                    sigPage = `0-${numPages - 1}`;
+                }
+            } else if (sigPageSelect.value === 'custom') {
+                sigPage = parseInt(getElement<HTMLInputElement>('sig-custom-page')?.value ?? '1', 10) - 1;
+            } else {
+                sigPage = parseInt(sigPageSelect.value, 10);
+            }
+        }
+
+        const enableSigText = getElement<HTMLInputElement>('enable-sig-text');
+        let sigText = enableSigText?.checked ? getElement<HTMLInputElement>('sig-text')?.value : undefined;
+        const sigTextColor = getElement<HTMLInputElement>('sig-text-color')?.value ?? '#000000';
+        const sigTextSize = parseInt(getElement<HTMLInputElement>('sig-text-size')?.value ?? '12', 10);
+
+        if (!state.sigImageData && !sigText && state.certData) {
+            const certInfo = getCertificateInfo(state.certData.certificate);
+            const date = new Date().toLocaleDateString();
+            sigText = `Digitally signed by ${certInfo.subject}\n${date}`;
+        }
+
+        let finalHeight = sigHeight;
+        if (sigText && !state.sigImageData) {
+            const lineCount = (sigText.match(/\n/g) || []).length + 1;
+            const lineHeightFactor = 1.4;
+            const padding = 16;
+            const calculatedHeight = Math.ceil(lineCount * sigTextSize * lineHeightFactor + padding);
+            finalHeight = Math.max(calculatedHeight, sigHeight);
+        }
+
+        visibleSignature = {
+            enabled: true,
+            x: sigX,
+            y: sigY,
+            width: sigWidth,
+            height: finalHeight,
+            page: sigPage,
+            imageData: state.sigImageData ?? undefined,
+            imageType: state.sigImageType ?? undefined,
+            text: sigText,
+            textColor: sigTextColor,
+            textSize: sigTextSize,
+        };
+    }
+
+    showLoader('Applying digital signature...');
+
+    try {
+        const signedPdfBytes = await signPdf(state.pdfBytes, state.certData, {
+            signatureInfo,
+            visibleSignature,
+        });
+
+        const blob = new Blob([signedPdfBytes.slice().buffer], { type: 'application/pdf' });
+        const originalName = state.pdfFile?.name ?? 'document.pdf';
+        const signedName = originalName.replace(/\.pdf$/i, '_signed.pdf');
+
+        downloadFile(blob, signedName);
+
+        hideLoader();
+        showAlert('Success', 'PDF signed successfully! The signature can be verified in any PDF reader.', 'success', () => { resetState(); });
+    } catch (error) {
+        hideLoader();
+        console.error('Signing error:', error);
+        const errorMessage = error instanceof Error ? error.message : 'Unknown error occurred';
+
+        // Check if this is a CORS/network error from certificate chain fetching
+        if (errorMessage.includes('Failed to fetch') || errorMessage.includes('CORS') || errorMessage.includes('NetworkError')) {
+            showAlert(
+                'Signing Failed',
+                'Failed to fetch certificate chain. This may be due to network issues or the certificate proxy being unavailable. Please check your internet connection and try again. If the issue persists, contact support.'
+            );
+        } else {
+            showAlert('Signing Failed', `Failed to sign PDF: ${errorMessage}`);
+        }
+    }
+}
+
+if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initializePage);
+} else {
+    initializePage();
+}
diff --git a/src/js/logic/digital-sign-pdf.ts b/src/js/logic/digital-sign-pdf.ts
new file mode 100644
index 0000000..a626ed9
--- /dev/null
+++ b/src/js/logic/digital-sign-pdf.ts
@@ -0,0 +1,283 @@
+import { PdfSigner, type SignOption } from 'zgapdfsigner';
+import forge from 'node-forge';
+import { CertificateData, SignPdfOptions } from '@/types';
+
+export function parsePfxFile(pfxBytes: ArrayBuffer, password: string): CertificateData {
+    const pfxAsn1 = forge.asn1.fromDer(forge.util.createBuffer(new Uint8Array(pfxBytes)));
+    const pfx = forge.pkcs12.pkcs12FromAsn1(pfxAsn1, password);
+
+    const certBags = pfx.getBags({ bagType: forge.pki.oids.certBag });
+    const keyBags = pfx.getBags({ bagType: forge.pki.oids.pkcs8ShroudedKeyBag });
+
+    const certBagArray = certBags[forge.pki.oids.certBag];
+    const keyBagArray = keyBags[forge.pki.oids.pkcs8ShroudedKeyBag];
+
+    if (!certBagArray || certBagArray.length === 0) {
+        throw new Error('No certificate found in PFX file');
+    }
+
+    if (!keyBagArray || keyBagArray.length === 0) {
+        throw new Error('No private key found in PFX file');
+    }
+
+    const certificate = certBagArray[0].cert;
+
+    if (!certificate) {
+        throw new Error('Failed to extract certificate from PFX file');
+    }
+
+    return { p12Buffer: pfxBytes, password, certificate };
+}
+
+export function parsePemFiles(
+    certPem: string,
+    keyPem: string,
+    keyPassword?: string
+): CertificateData {
+    const certificate = forge.pki.certificateFromPem(certPem);
+
+    let privateKey: forge.pki.PrivateKey;
+    if (keyPem.includes('ENCRYPTED')) {
+        if (!keyPassword) {
+            throw new Error('Password required for encrypted private key');
+        }
+        privateKey = forge.pki.decryptRsaPrivateKey(keyPem, keyPassword);
+        if (!privateKey) {
+            throw new Error('Failed to decrypt private key');
+        }
+    } else {
+        privateKey = forge.pki.privateKeyFromPem(keyPem);
+    }
+
+    const p12Password = keyPassword || 'temp-password';
+    const p12Asn1 = forge.pkcs12.toPkcs12Asn1(
+        privateKey,
+        [certificate],
+        p12Password,
+        { algorithm: '3des' }
+    );
+    const p12Der = forge.asn1.toDer(p12Asn1).getBytes();
+    const p12Buffer = new Uint8Array(p12Der.length);
+    for (let i = 0; i < p12Der.length; i++) {
+        p12Buffer[i] = p12Der.charCodeAt(i);
+    }
+
+    return { p12Buffer: p12Buffer.buffer, password: p12Password, certificate };
+}
+
+export function parseCombinedPem(pemContent: string, password?: string): CertificateData {
+    const certMatch = pemContent.match(/-----BEGIN CERTIFICATE-----[\s\S]*?-----END CERTIFICATE-----/);
+    const keyMatch = pemContent.match(/-----BEGIN (RSA |EC |ENCRYPTED )?PRIVATE KEY-----[\s\S]*?-----END (RSA |EC |ENCRYPTED )?PRIVATE KEY-----/);
+
+    if (!certMatch) {
+        throw new Error('No certificate found in PEM file');
+    }
+
+    if (!keyMatch) {
+        throw new Error('No private key found in PEM file');
+    }
+
+    return parsePemFiles(certMatch[0], keyMatch[0], password);
+}
+
+/**
+ * CORS Proxy URL for fetching external certificates.
+ * The zgapdfsigner library tries to fetch issuer certificates from external URLs,
+ * but those servers often don't have CORS headers. This proxy adds the necessary
+ * CORS headers to allow the requests from the browser.
+ * 
+ * If you are self-hosting, you MUST deploy your own proxy using cloudflare/cors-proxy-worker.js or any other way of your choice
+ * and set VITE_CORS_PROXY_URL environment variable.
+ * 
+ * If not set, certificates requiring external chain fetching will fail.
+ */
+const CORS_PROXY_URL = import.meta.env.VITE_CORS_PROXY_URL || '';
+
+/**
+ * Shared secret for signing proxy requests (HMAC-SHA256).
+ * 
+ * SECURITY NOTE FOR PRODUCTION:
+ * Client-side secrets are NEVER truly hidden and they can be extracted from
+ * bundled JavaScript. 
+ * 
+ * For production deployments with sensitive requirements, you should:
+ * 1. Use your own backend server to proxy certificate requests
+ * 2. Keep the HMAC secret on your server ONLY (never in frontend code)
+ * 3. Have your frontend call your server, which then calls the CORS proxy
+ * 
+ * This client-side HMAC provides limited protection (deters casual abuse)
+ * but should NOT be considered secure against determined attackers. BentoPDF
+ * accepts this tradeoff because of it's client side architecture.
+ * 
+ * To enable (optional):
+ * 1. Generate a secret: openssl rand -hex 32
+ * 2. Set PROXY_SECRET on your Cloudflare Worker: npx wrangler secret put PROXY_SECRET
+ * 3. Set VITE_CORS_PROXY_SECRET in your build environment (must match PROXY_SECRET)
+ */
+const CORS_PROXY_SECRET = import.meta.env.VITE_CORS_PROXY_SECRET || '';
+
+async function generateProxySignature(url: string, timestamp: number): Promise<string> {
+    const encoder = new TextEncoder();
+    const key = await crypto.subtle.importKey(
+        'raw',
+        encoder.encode(CORS_PROXY_SECRET),
+        { name: 'HMAC', hash: 'SHA-256' },
+        false,
+        ['sign']
+    );
+
+    const message = `${url}${timestamp}`;
+    const signature = await crypto.subtle.sign(
+        'HMAC',
+        key,
+        encoder.encode(message)
+    );
+
+    return Array.from(new Uint8Array(signature))
+        .map(b => b.toString(16).padStart(2, '0'))
+        .join('');
+}
+
+/**
+ * Custom fetch wrapper that routes external certificate requests through a CORS proxy.
+ * The zgapdfsigner library tries to fetch issuer certificates from URLs embedded in the
+ * certificate's AIA extension. When those servers don't have CORS enabled (like www.cert.fnmt.es),
+ * the fetch fails. This wrapper routes such requests through our CORS proxy.
+ * 
+ * If VITE_CORS_PROXY_SECRET is configured, requests include HMAC signatures for anti-spoofing.
+ */
+function createCorsAwareFetch(): {
+    wrappedFetch: typeof fetch;
+    restore: () => void;
+} {
+    const originalFetch = window.fetch.bind(window);
+
+    const wrappedFetch: typeof fetch = async (input, init) => {
+        const url = typeof input === 'string' ? input : input instanceof URL ? input.toString() : input.url;
+
+        const isExternalCertificateUrl = (
+            url.includes('.crt') ||
+            url.includes('.cer') ||
+            url.includes('.pem') ||
+            url.includes('/certs/') ||
+            url.includes('/ocsp') ||
+            url.includes('/crl') ||
+            url.includes('caIssuers')
+        ) && !url.startsWith(window.location.origin);
+
+        if (isExternalCertificateUrl && CORS_PROXY_URL) {
+            let proxyUrl = `${CORS_PROXY_URL}?url=${encodeURIComponent(url)}`;
+
+            if (CORS_PROXY_SECRET) {
+                const timestamp = Date.now();
+                const signature = await generateProxySignature(url, timestamp);
+                proxyUrl += `&t=${timestamp}&sig=${signature}`;
+                console.log(`[CORS Proxy] Routing signed certificate request through proxy: ${url}`);
+            } else {
+                console.log(`[CORS Proxy] Routing certificate request through proxy: ${url}`);
+            }
+
+            return originalFetch(proxyUrl, init);
+        }
+
+        return originalFetch(input, init);
+    };
+
+    window.fetch = wrappedFetch;
+
+    return {
+        wrappedFetch,
+        restore: () => {
+            window.fetch = originalFetch;
+        }
+    };
+}
+
+
+export async function signPdf(
+    pdfBytes: Uint8Array,
+    certificateData: CertificateData,
+    options: SignPdfOptions = {}
+): Promise<Uint8Array> {
+    const signatureInfo = options.signatureInfo ?? {};
+
+    const signOptions: SignOption = {
+        p12cert: certificateData.p12Buffer,
+        pwd: certificateData.password,
+    };
+
+    if (signatureInfo.reason) {
+        signOptions.reason = signatureInfo.reason;
+    }
+
+    if (signatureInfo.location) {
+        signOptions.location = signatureInfo.location;
+    }
+
+    if (signatureInfo.contactInfo) {
+        signOptions.contact = signatureInfo.contactInfo;
+    }
+
+    if (options.visibleSignature?.enabled) {
+        const vs = options.visibleSignature;
+
+        const drawinf = {
+            area: {
+                x: vs.x,
+                y: vs.y,
+                w: vs.width,
+                h: vs.height,
+            },
+            pageidx: vs.page,
+            imgInfo: undefined as { imgData: ArrayBuffer; imgType: string } | undefined,
+            textInfo: undefined as { text: string; size: number; color: string } | undefined,
+        };
+
+        if (vs.imageData && vs.imageType) {
+            drawinf.imgInfo = {
+                imgData: vs.imageData,
+                imgType: vs.imageType,
+            };
+        }
+
+        if (vs.text) {
+            drawinf.textInfo = {
+                text: vs.text,
+                size: vs.textSize ?? 12,
+                color: vs.textColor ?? '#000000',
+            };
+        }
+
+        signOptions.drawinf = drawinf as SignOption['drawinf'];
+    }
+
+    const signer = new PdfSigner(signOptions);
+
+    const { restore } = createCorsAwareFetch();
+
+    try {
+        const signedPdfBytes = await signer.sign(pdfBytes);
+        return new Uint8Array(signedPdfBytes);
+    } finally {
+        restore();
+    }
+}
+
+export function getCertificateInfo(certificate: forge.pki.Certificate): {
+    subject: string;
+    issuer: string;
+    validFrom: Date;
+    validTo: Date;
+    serialNumber: string;
+} {
+    const subjectCN = certificate.subject.getField('CN');
+    const issuerCN = certificate.issuer.getField('CN');
+
+    return {
+        subject: subjectCN?.value as string ?? 'Unknown',
+        issuer: issuerCN?.value as string ?? 'Unknown',
+        validFrom: certificate.validity.notBefore,
+        validTo: certificate.validity.notAfter,
+        serialNumber: certificate.serialNumber,
+    };
+}
diff --git a/src/js/logic/divide-pages-page.ts b/src/js/logic/divide-pages-page.ts
index 1ec3f87..11133cc 100644
--- a/src/js/logic/divide-pages-page.ts
+++ b/src/js/logic/divide-pages-page.ts
@@ -1,14 +1,9 @@
+import { DividePagesState } from '@/types';
 import { showLoader, hideLoader, showAlert } from '../ui.js';
 import { downloadFile, formatBytes, parsePageRanges } from '../utils/helpers.js';
 import { createIcons, icons } from 'lucide';
 import { PDFDocument as PDFLibDocument } from 'pdf-lib';
 
-interface DividePagesState {
-    file: File | null;
-    pdfDoc: PDFLibDocument | null;
-    totalPages: number;
-}
-
 const pageState: DividePagesState = {
     file: null,
     pdfDoc: null,
diff --git a/src/js/logic/edit-attachments-page.ts b/src/js/logic/edit-attachments-page.ts
index 7b1fa75..cbfdf8c 100644
--- a/src/js/logic/edit-attachments-page.ts
+++ b/src/js/logic/edit-attachments-page.ts
@@ -1,22 +1,10 @@
+import { EditAttachmentState, AttachmentInfo } from '@/types';
 import { showLoader, hideLoader, showAlert } from '../ui.js';
 import { downloadFile, formatBytes } from '../utils/helpers.js';
 import { createIcons, icons } from 'lucide';
 
 const worker = new Worker(import.meta.env.BASE_URL + 'workers/edit-attachments.worker.js');
 
-interface AttachmentInfo {
-    index: number;
-    name: string;
-    page: number;
-    data: Uint8Array;
-}
-
-interface EditAttachmentState {
-    file: File | null;
-    allAttachments: AttachmentInfo[];
-    attachmentsToRemove: Set<number>;
-}
-
 const pageState: EditAttachmentState = {
     file: null,
     allAttachments: [],
diff --git a/src/js/logic/edit-metadata-page.ts b/src/js/logic/edit-metadata-page.ts
index f1e0380..5036c54 100644
--- a/src/js/logic/edit-metadata-page.ts
+++ b/src/js/logic/edit-metadata-page.ts
@@ -1,13 +1,9 @@
+import { EditMetadataState } from '@/types';
 import { showLoader, hideLoader, showAlert } from '../ui.js';
 import { downloadFile, formatBytes } from '../utils/helpers.js';
 import { createIcons, icons } from 'lucide';
 import { PDFDocument as PDFLibDocument, PDFName, PDFString } from 'pdf-lib';
 
-interface EditMetadataState {
-    file: File | null;
-    pdfDoc: PDFLibDocument | null;
-}
-
 const pageState: EditMetadataState = {
     file: null,
     pdfDoc: null,
diff --git a/src/js/logic/encrypt-pdf-page.ts b/src/js/logic/encrypt-pdf-page.ts
index d120730..941932a 100644
--- a/src/js/logic/encrypt-pdf-page.ts
+++ b/src/js/logic/encrypt-pdf-page.ts
@@ -1,12 +1,9 @@
 import { showAlert } from '../ui.js';
 import { downloadFile, formatBytes, initializeQpdf, readFileAsArrayBuffer } from '../utils/helpers.js';
 import { icons, createIcons } from 'lucide';
+import { EncryptPdfState } from '@/types';
 
-interface PageState {
-    file: File | null;
-}
-
-const pageState: PageState = {
+const pageState: EncryptPdfState = {
     file: null,
 };
 
diff --git a/src/js/logic/fix-page-size-page.ts b/src/js/logic/fix-page-size-page.ts
index 06e6f3b..76c54d4 100644
--- a/src/js/logic/fix-page-size-page.ts
+++ b/src/js/logic/fix-page-size-page.ts
@@ -2,12 +2,9 @@ import { showAlert } from '../ui.js';
 import { downloadFile, formatBytes, hexToRgb } from '../utils/helpers.js';
 import { PDFDocument as PDFLibDocument, rgb, PageSizes } from 'pdf-lib';
 import { icons, createIcons } from 'lucide';
+import { FixPageSizeState } from '@/types';
 
-interface PageState {
-    file: File | null;
-}
-
-const pageState: PageState = {
+const pageState: FixPageSizeState = {
     file: null,
 };
 
diff --git a/src/js/logic/flatten-pdf-page.ts b/src/js/logic/flatten-pdf-page.ts
index a239226..509e9e3 100644
--- a/src/js/logic/flatten-pdf-page.ts
+++ b/src/js/logic/flatten-pdf-page.ts
@@ -3,12 +3,9 @@ import { downloadFile, formatBytes, readFileAsArrayBuffer } from '../utils/helpe
 import { PDFDocument } from 'pdf-lib';
 import { icons, createIcons } from 'lucide';
 import JSZip from 'jszip';
+import { FlattenPdfState } from '@/types';
 
-interface PageState {
-    files: File[];
-}
-
-const pageState: PageState = {
+const pageState: FlattenPdfState = {
     files: [],
 };
 
diff --git a/src/js/logic/form-creator.ts b/src/js/logic/form-creator.ts
index 729b2d1..a50a33d 100644
--- a/src/js/logic/form-creator.ts
+++ b/src/js/logic/form-creator.ts
@@ -14,8 +14,8 @@ import { FormField, PageData } from '../types/index.js'
 let fields: FormField[] = []
 let selectedField: FormField | null = null
 let fieldCounter = 0
-let existingFieldNames: Set<string> = new Set()
-let existingRadioGroups: Set<string> = new Set()
+const existingFieldNames: Set<string> = new Set()
+const existingRadioGroups: Set<string> = new Set()
 let draggedElement: HTMLElement | null = null
 let offsetX = 0
 let offsetY = 0
@@ -2045,7 +2045,7 @@ async function renderCanvas(): Promise<void> {
     if (!currentPage) return
 
     // Fixed scale for better visibility
-    let scale = 1.333
+    const scale = 1.333
 
     currentScale = scale
 
diff --git a/src/js/logic/form-filler-page.ts b/src/js/logic/form-filler-page.ts
index 1deb9d1..e7c58af 100644
--- a/src/js/logic/form-filler-page.ts
+++ b/src/js/logic/form-filler-page.ts
@@ -85,7 +85,7 @@ function resetState() {
     }
 
     const toolUploader = document.getElementById('tool-uploader');
-    const isFullWidth = localStorage.getItem('fullWidthMode') === 'true';
+    const isFullWidth = localStorage.getItem('fullWidthMode') !== 'false';
     if (toolUploader && !isFullWidth) {
         toolUploader.classList.remove('max-w-6xl');
         toolUploader.classList.add('max-w-2xl');
@@ -139,7 +139,8 @@ async function setupFormViewer() {
     }
 
     const toolUploader = document.getElementById('tool-uploader');
-    const isFullWidth = localStorage.getItem('fullWidthMode') === 'true';
+    // Default to true if not set
+    const isFullWidth = localStorage.getItem('fullWidthMode') !== 'false';
     if (toolUploader && !isFullWidth) {
         toolUploader.classList.remove('max-w-2xl');
         toolUploader.classList.add('max-w-6xl');
diff --git a/src/js/logic/header-footer-page.ts b/src/js/logic/header-footer-page.ts
index 5113af9..c2d0dc3 100644
--- a/src/js/logic/header-footer-page.ts
+++ b/src/js/logic/header-footer-page.ts
@@ -2,9 +2,9 @@ import { createIcons, icons } from 'lucide';
 import { showAlert, showLoader, hideLoader } from '../ui.js';
 import { downloadFile, hexToRgb, formatBytes, parsePageRanges } from '../utils/helpers.js';
 import { PDFDocument as PDFLibDocument, rgb, StandardFonts } from 'pdf-lib';
+import { HeaderFooterState } from '@/types';
 
-interface PageState { file: File | null; pdfDoc: PDFLibDocument | null; }
-const pageState: PageState = { file: null, pdfDoc: null };
+const pageState: HeaderFooterState = { file: null, pdfDoc: null };
 
 if (document.readyState === 'loading') {
     document.addEventListener('DOMContentLoaded', initializePage);
diff --git a/src/js/logic/image-to-pdf-page.ts b/src/js/logic/image-to-pdf-page.ts
index 7f8fea6..3051aca 100644
--- a/src/js/logic/image-to-pdf-page.ts
+++ b/src/js/logic/image-to-pdf-page.ts
@@ -3,6 +3,7 @@ import { showAlert, showLoader, hideLoader } from '../ui.js';
 import { downloadFile, formatBytes } from '../utils/helpers.js';
 import { PyMuPDF } from '@bentopdf/pymupdf-wasm';
 import { getWasmBaseUrl } from '../config/wasm-cdn-config.js';
+import heic2any from 'heic2any';
 
 const SUPPORTED_FORMATS = '.jpg,.jpeg,.png,.bmp,.gif,.tiff,.tif,.pnm,.pgm,.pbm,.ppm,.pam,.jxr,.jpx,.jp2,.psd,.svg,.heic,.heif,.webp';
 const SUPPORTED_FORMATS_DISPLAY = 'JPG, PNG, BMP, GIF, TIFF, PNM, PGM, PBM, PPM, PAM, JXR, JPX, JP2, PSD, SVG, HEIC, WebP';
@@ -172,20 +173,93 @@ async function ensurePyMuPDF(): Promise<PyMuPDF> {
     return pymupdf;
 }
 
+async function preprocessFile(file: File): Promise<File> {
+    const ext = getFileExtension(file.name);
+
+    if (ext === '.heic' || ext === '.heif') {
+        try {
+            const conversionResult = await heic2any({
+                blob: file,
+                toType: 'image/png',
+                quality: 0.9,
+            });
+
+            const blob = Array.isArray(conversionResult) ? conversionResult[0] : conversionResult;
+            return new File([blob], file.name.replace(/\.(heic|heif)$/i, '.png'), { type: 'image/png' });
+        } catch (e) {
+            console.error(`Failed to convert HEIC: ${file.name}`, e);
+            throw new Error(`Failed to process HEIC file: ${file.name}`);
+        }
+    }
+
+    if (ext === '.webp') {
+        try {
+            return await new Promise<File>((resolve, reject) => {
+                const img = new Image();
+                const url = URL.createObjectURL(file);
+
+                img.onload = () => {
+                    const canvas = document.createElement('canvas');
+                    canvas.width = img.width;
+                    canvas.height = img.height;
+                    const ctx = canvas.getContext('2d');
+                    if (!ctx) {
+                        URL.revokeObjectURL(url);
+                        reject(new Error('Canvas context failed'));
+                        return;
+                    }
+                    ctx.drawImage(img, 0, 0);
+                    canvas.toBlob((blob) => {
+                        URL.revokeObjectURL(url);
+                        if (blob) {
+                            resolve(new File([blob], file.name.replace(/\.webp$/i, '.png'), { type: 'image/png' }));
+                        } else {
+                            reject(new Error('Canvas toBlob failed'));
+                        }
+                    }, 'image/png');
+                };
+
+                img.onerror = () => {
+                    URL.revokeObjectURL(url);
+                    reject(new Error('Failed to load WebP image'));
+                };
+
+                img.src = url;
+            });
+        } catch (e) {
+            console.error(`Failed to convert WebP: ${file.name}`, e);
+            throw new Error(`Failed to process WebP file: ${file.name}`);
+        }
+    }
+
+    return file;
+}
+
 async function convertToPdf() {
     if (files.length === 0) {
         showAlert('No Files', 'Please select at least one image file.');
         return;
     }
 
-    showLoader('Loading PyMuPDF engine...');
+    showLoader('Processing images...');
 
     try {
+        const processedFiles: File[] = [];
+        for (const file of files) {
+            try {
+                const processed = await preprocessFile(file);
+                processedFiles.push(processed);
+            } catch (error: any) {
+                console.warn(error);
+                throw error;
+            }
+        }
+
+        showLoader('Loading engine...');
         const mupdf = await ensurePyMuPDF();
 
         showLoader('Converting images to PDF...');
-
-        const pdfBlob = await mupdf.imagesToPdf(files);
+        const pdfBlob = await mupdf.imagesToPdf(processedFiles);
 
         downloadFile(pdfBlob, 'images_to_pdf.pdf');
 
diff --git a/src/js/logic/invert-colors-page.ts b/src/js/logic/invert-colors-page.ts
index 1ae6971..4d27554 100644
--- a/src/js/logic/invert-colors-page.ts
+++ b/src/js/logic/invert-colors-page.ts
@@ -3,11 +3,11 @@ import { showAlert, showLoader, hideLoader } from '../ui.js';
 import { downloadFile, formatBytes, getPDFDocument } from '../utils/helpers.js';
 import { PDFDocument as PDFLibDocument } from 'pdf-lib';
 import * as pdfjsLib from 'pdfjs-dist';
+import { InvertColorsState } from '@/types';
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
 
-interface PageState { file: File | null; pdfDoc: PDFLibDocument | null; }
-const pageState: PageState = { file: null, pdfDoc: null };
+const pageState: InvertColorsState = { file: null, pdfDoc: null };
 
 if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', initializePage); }
 else { initializePage(); }
diff --git a/src/js/logic/jpg-to-pdf-page.ts b/src/js/logic/jpg-to-pdf-page.ts
index 329b84e..40264cd 100644
--- a/src/js/logic/jpg-to-pdf-page.ts
+++ b/src/js/logic/jpg-to-pdf-page.ts
@@ -172,7 +172,7 @@ async function convertToPdf() {
         return;
     }
 
-    showLoader('Loading PyMuPDF engine...');
+    showLoader('Loading engine...');
 
     try {
         const mupdf = await ensurePyMuPDF();
diff --git a/src/js/logic/linearize-pdf-page.ts b/src/js/logic/linearize-pdf-page.ts
index d6d5121..f9db90f 100644
--- a/src/js/logic/linearize-pdf-page.ts
+++ b/src/js/logic/linearize-pdf-page.ts
@@ -2,12 +2,9 @@ import { showAlert } from '../ui.js';
 import { downloadFile, formatBytes, initializeQpdf, readFileAsArrayBuffer } from '../utils/helpers.js';
 import { icons, createIcons } from 'lucide';
 import JSZip from 'jszip';
+import { LinearizePdfState } from '@/types';
 
-interface PageState {
-    files: File[];
-}
-
-const pageState: PageState = {
+const pageState: LinearizePdfState = {
     files: [],
 };
 
diff --git a/src/js/logic/ocr-pdf-page.ts b/src/js/logic/ocr-pdf-page.ts
index 1c62745..bdadf7a 100644
--- a/src/js/logic/ocr-pdf-page.ts
+++ b/src/js/logic/ocr-pdf-page.ts
@@ -7,20 +7,10 @@ import fontkit from '@pdf-lib/fontkit';
 import { icons, createIcons } from 'lucide';
 import * as pdfjsLib from 'pdfjs-dist';
 import { getFontForLanguage } from '../utils/font-loader.js';
+import { OcrWord, OcrState } from '@/types';
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
 
-interface Word {
-    text: string;
-    bbox: { x0: number; y0: number; x1: number; y1: number };
-    confidence: number;
-}
-
-interface OcrState {
-    file: File | null;
-    searchablePdfBytes: Uint8Array | null;
-}
-
 const pageState: OcrState = {
     file: null,
     searchablePdfBytes: null,
@@ -35,10 +25,10 @@ const whitelistPresets: Record<string, string> = {
     forms: 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789 .,()-_/@#:',
 };
 
-function parseHOCR(hocrText: string): Word[] {
+function parseHOCR(hocrText: string): OcrWord[] {
     const parser = new DOMParser();
     const doc = parser.parseFromString(hocrText, 'text/html');
-    const words: Word[] = [];
+    const words: OcrWord[] = [];
 
     const wordElements = doc.querySelectorAll('.ocrx_word');
 
@@ -264,7 +254,7 @@ async function runOCR() {
             if (data.hocr) {
                 const words = parseHOCR(data.hocr);
 
-                words.forEach(function (word: Word) {
+                words.forEach(function (word: OcrWord) {
                     const { x0, y0, x1, y1 } = word.bbox;
                     const text = word.text.replace(/[\u0000-\u001F\u007F-\u009F\u200E\u200F\u202A-\u202E\uFEFF]/g, '');
 
diff --git a/src/js/logic/page-dimensions-page.ts b/src/js/logic/page-dimensions-page.ts
index 9f1c9d0..71458f4 100644
--- a/src/js/logic/page-dimensions-page.ts
+++ b/src/js/logic/page-dimensions-page.ts
@@ -2,13 +2,9 @@ import { showAlert } from '../ui.js';
 import { formatBytes, getStandardPageName, convertPoints } from '../utils/helpers.js';
 import { PDFDocument } from 'pdf-lib';
 import { icons, createIcons } from 'lucide';
+import { PageDimensionsState } from '@/types';
 
-interface PageState {
-    file: File | null;
-    pdfDoc: PDFDocument | null;
-}
-
-const pageState: PageState = {
+const pageState: PageDimensionsState = {
     file: null,
     pdfDoc: null,
 };
diff --git a/src/js/logic/page-numbers-page.ts b/src/js/logic/page-numbers-page.ts
index ae387fe..12f3d53 100644
--- a/src/js/logic/page-numbers-page.ts
+++ b/src/js/logic/page-numbers-page.ts
@@ -162,7 +162,7 @@ async function addPageNumbers() {
             const xOffset = bounds.x || 0;
             const yOffset = bounds.y || 0;
 
-            let pageNumText = format === 'page_x_of_y' ? `${i + 1} / ${totalPages}` : `${i + 1}`;
+            const pageNumText = format === 'page_x_of_y' ? `${i + 1} / ${totalPages}` : `${i + 1}`;
 
             const textWidth = helveticaFont.widthOfTextAtSize(pageNumText, fontSize);
             const textHeight = fontSize;
diff --git a/src/js/logic/pdf-layers-page.ts b/src/js/logic/pdf-layers-page.ts
index fb09545..2975e7a 100644
--- a/src/js/logic/pdf-layers-page.ts
+++ b/src/js/logic/pdf-layers-page.ts
@@ -19,7 +19,7 @@ interface LayerData {
 
 let currentFile: File | null = null;
 let currentDoc: any = null;
-let layersMap = new Map<number, LayerData>();
+const layersMap = new Map<number, LayerData>();
 let nextDisplayOrder = 0;
 
 document.addEventListener('DOMContentLoaded', () => {
@@ -271,7 +271,7 @@ document.addEventListener('DOMContentLoaded', () => {
         }
 
         try {
-            showLoader('Loading PyMuPDF...');
+            showLoader('Loading engine...');
             await pymupdf.load();
 
             showLoader(`Loading layers from ${currentFile.name}...`);
diff --git a/src/js/logic/posterize-page.ts b/src/js/logic/posterize-page.ts
index 52b687f..ffc12d9 100644
--- a/src/js/logic/posterize-page.ts
+++ b/src/js/logic/posterize-page.ts
@@ -3,17 +3,10 @@ import { downloadFile, parsePageRanges, getPDFDocument, formatBytes } from '../u
 import { PDFDocument, PageSizes } from 'pdf-lib';
 import * as pdfjsLib from 'pdfjs-dist';
 import { createIcons, icons } from 'lucide';
+import { PosterizeState } from '@/types';
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
 
-interface PosterizeState {
-    file: File | null;
-    pdfJsDoc: pdfjsLib.PDFDocumentProxy | null;
-    pdfBytes: Uint8Array | null;
-    pageSnapshots: Record<number, ImageData>;
-    currentPage: number;
-}
-
 const pageState: PosterizeState = {
     file: null,
     pdfJsDoc: null,
@@ -143,7 +136,7 @@ async function posterize() {
         const rows = parseInt((document.getElementById('posterize-rows') as HTMLInputElement).value) || 1;
         const cols = parseInt((document.getElementById('posterize-cols') as HTMLInputElement).value) || 1;
         const pageSizeKey = (document.getElementById('output-page-size') as HTMLSelectElement).value as keyof typeof PageSizes;
-        let orientation = (document.getElementById('output-orientation') as HTMLSelectElement).value;
+        const orientation = (document.getElementById('output-orientation') as HTMLSelectElement).value;
         const scalingMode = (document.querySelector('input[name="scaling-mode"]:checked') as HTMLInputElement).value;
         const overlap = parseFloat((document.getElementById('overlap') as HTMLInputElement).value) || 0;
         const overlapUnits = (document.getElementById('overlap-units') as HTMLSelectElement).value;
diff --git a/src/js/logic/prepare-pdf-for-ai-page.ts b/src/js/logic/prepare-pdf-for-ai-page.ts
index 596ecb5..a1981e4 100644
--- a/src/js/logic/prepare-pdf-for-ai-page.ts
+++ b/src/js/logic/prepare-pdf-for-ai-page.ts
@@ -94,7 +94,7 @@ document.addEventListener('DOMContentLoaded', () => {
                 return;
             }
 
-            showLoader('Loading PyMuPDF...');
+            showLoader('Loading engine...');
             await pymupdf.load();
 
             const total = state.files.length;
diff --git a/src/js/logic/psd-to-pdf-page.ts b/src/js/logic/psd-to-pdf-page.ts
index df5e14a..5f25ff8 100644
--- a/src/js/logic/psd-to-pdf-page.ts
+++ b/src/js/logic/psd-to-pdf-page.ts
@@ -82,7 +82,7 @@ document.addEventListener('DOMContentLoaded', () => {
             return;
         }
         try {
-            showLoader('Loading PyMuPDF engine...');
+            showLoader('Loading engine...');
             const mupdf = await ensurePyMuPDF();
 
             if (state.files.length === 1) {
diff --git a/src/js/logic/rasterize-pdf-page.ts b/src/js/logic/rasterize-pdf-page.ts
index 957450b..83f081b 100644
--- a/src/js/logic/rasterize-pdf-page.ts
+++ b/src/js/logic/rasterize-pdf-page.ts
@@ -94,7 +94,7 @@ document.addEventListener('DOMContentLoaded', () => {
                 return;
             }
 
-            showLoader('Loading PyMuPDF...');
+            showLoader('Loading engine...');
             await pymupdf.load();
 
             // Get options from UI
diff --git a/src/js/logic/remove-restrictions-page.ts b/src/js/logic/remove-restrictions-page.ts
index 3cb9176..98404e2 100644
--- a/src/js/logic/remove-restrictions-page.ts
+++ b/src/js/logic/remove-restrictions-page.ts
@@ -1,12 +1,9 @@
 import { showAlert } from '../ui.js';
 import { downloadFile, formatBytes, initializeQpdf, readFileAsArrayBuffer } from '../utils/helpers.js';
 import { icons, createIcons } from 'lucide';
+import { RemoveRestrictionsState } from '@/types';
 
-interface PageState {
-    file: File | null;
-}
-
-const pageState: PageState = {
+const pageState: RemoveRestrictionsState = {
     file: null,
 };
 
diff --git a/src/js/logic/sanitize-pdf-page.ts b/src/js/logic/sanitize-pdf-page.ts
index 09a6339..170a129 100644
--- a/src/js/logic/sanitize-pdf-page.ts
+++ b/src/js/logic/sanitize-pdf-page.ts
@@ -2,13 +2,9 @@ import { showAlert } from '../ui.js';
 import { downloadFile, formatBytes } from '../utils/helpers.js';
 import { PDFDocument, PDFName } from 'pdf-lib';
 import { icons, createIcons } from 'lucide';
+import { SanitizePdfState } from '@/types';
 
-interface PageState {
-    file: File | null;
-    pdfDoc: PDFDocument | null;
-}
-
-const pageState: PageState = {
+const pageState: SanitizePdfState = {
     file: null,
     pdfDoc: null,
 };
diff --git a/src/js/logic/text-color-page.ts b/src/js/logic/text-color-page.ts
index 955a61e..a471ca7 100644
--- a/src/js/logic/text-color-page.ts
+++ b/src/js/logic/text-color-page.ts
@@ -3,11 +3,11 @@ import { showAlert, showLoader, hideLoader } from '../ui.js';
 import { downloadFile, hexToRgb, formatBytes, getPDFDocument, readFileAsArrayBuffer } from '../utils/helpers.js';
 import { PDFDocument as PDFLibDocument } from 'pdf-lib';
 import * as pdfjsLib from 'pdfjs-dist';
+import { TextColorState } from '@/types';
 
 pdfjsLib.GlobalWorkerOptions.workerSrc = new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url).toString();
 
-interface PageState { file: File | null; pdfDoc: PDFLibDocument | null; }
-const pageState: PageState = { file: null, pdfDoc: null };
+const pageState: TextColorState = { file: null, pdfDoc: null };
 
 if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', initializePage); }
 else { initializePage(); }
diff --git a/src/js/logic/validate-signature-pdf-page.ts b/src/js/logic/validate-signature-pdf-page.ts
new file mode 100644
index 0000000..ded88c4
--- /dev/null
+++ b/src/js/logic/validate-signature-pdf-page.ts
@@ -0,0 +1,469 @@
+import { createIcons, icons } from 'lucide';
+import { showAlert, showLoader, hideLoader } from '../ui.js';
+import { readFileAsArrayBuffer, formatBytes } from '../utils/helpers.js';
+import { validatePdfSignatures } from './validate-signature-pdf.js';
+import forge from 'node-forge';
+import { SignatureValidationResult, ValidateSignatureState } from '@/types';
+
+const state: ValidateSignatureState = {
+    pdfFile: null,
+    pdfBytes: null,
+    results: [],
+    trustedCertFile: null,
+    trustedCert: null,
+};
+
+function getElement<T extends HTMLElement>(id: string): T | null {
+    return document.getElementById(id) as T | null;
+}
+
+function resetState(): void {
+    state.pdfFile = null;
+    state.pdfBytes = null;
+    state.results = [];
+
+    const fileDisplayArea = getElement<HTMLDivElement>('file-display-area');
+    if (fileDisplayArea) fileDisplayArea.innerHTML = '';
+
+    const resultsSection = getElement<HTMLDivElement>('results-section');
+    if (resultsSection) resultsSection.classList.add('hidden');
+
+    const resultsContainer = getElement<HTMLDivElement>('results-container');
+    if (resultsContainer) resultsContainer.innerHTML = '';
+
+    const fileInput = getElement<HTMLInputElement>('file-input');
+    if (fileInput) fileInput.value = '';
+
+    const customCertSection = getElement<HTMLDivElement>('custom-cert-section');
+    if (customCertSection) customCertSection.classList.add('hidden');
+}
+
+function resetCertState(): void {
+    state.trustedCertFile = null;
+    state.trustedCert = null;
+
+    const certDisplayArea = getElement<HTMLDivElement>('cert-display-area');
+    if (certDisplayArea) certDisplayArea.innerHTML = '';
+
+    const certInput = getElement<HTMLInputElement>('cert-input');
+    if (certInput) certInput.value = '';
+}
+
+function initializePage(): void {
+    createIcons({ icons });
+
+    const fileInput = getElement<HTMLInputElement>('file-input');
+    const dropZone = getElement<HTMLDivElement>('drop-zone');
+    const backBtn = getElement<HTMLButtonElement>('back-to-tools');
+    const certInput = getElement<HTMLInputElement>('cert-input');
+    const certDropZone = getElement<HTMLDivElement>('cert-drop-zone');
+
+    if (fileInput) {
+        fileInput.addEventListener('change', handlePdfUpload);
+        fileInput.addEventListener('click', () => {
+            fileInput.value = '';
+        });
+    }
+
+    if (dropZone) {
+        dropZone.addEventListener('dragover', (e) => {
+            e.preventDefault();
+            dropZone.classList.add('bg-gray-700');
+        });
+
+        dropZone.addEventListener('dragleave', () => {
+            dropZone.classList.remove('bg-gray-700');
+        });
+
+        dropZone.addEventListener('drop', (e) => {
+            e.preventDefault();
+            dropZone.classList.remove('bg-gray-700');
+            const droppedFiles = e.dataTransfer?.files;
+            if (droppedFiles && droppedFiles.length > 0) {
+                handlePdfFile(droppedFiles[0]);
+            }
+        });
+    }
+
+    if (certInput) {
+        certInput.addEventListener('change', handleCertUpload);
+        certInput.addEventListener('click', () => {
+            certInput.value = '';
+        });
+    }
+
+    if (certDropZone) {
+        certDropZone.addEventListener('dragover', (e) => {
+            e.preventDefault();
+            certDropZone.classList.add('bg-gray-700');
+        });
+
+        certDropZone.addEventListener('dragleave', () => {
+            certDropZone.classList.remove('bg-gray-700');
+        });
+
+        certDropZone.addEventListener('drop', (e) => {
+            e.preventDefault();
+            certDropZone.classList.remove('bg-gray-700');
+            const droppedFiles = e.dataTransfer?.files;
+            if (droppedFiles && droppedFiles.length > 0) {
+                handleCertFile(droppedFiles[0]);
+            }
+        });
+    }
+
+    if (backBtn) {
+        backBtn.addEventListener('click', () => {
+            window.location.href = import.meta.env.BASE_URL;
+        });
+    }
+}
+
+function handlePdfUpload(e: Event): void {
+    const input = e.target as HTMLInputElement;
+    if (input.files && input.files.length > 0) {
+        handlePdfFile(input.files[0]);
+    }
+}
+
+async function handlePdfFile(file: File): Promise<void> {
+    if (file.type !== 'application/pdf' && !file.name.toLowerCase().endsWith('.pdf')) {
+        showAlert('Invalid File', 'Please select a PDF file.');
+        return;
+    }
+
+    resetState();
+    state.pdfFile = file;
+    state.pdfBytes = new Uint8Array(await readFileAsArrayBuffer(file) as ArrayBuffer);
+
+    updatePdfDisplay();
+
+    const customCertSection = getElement<HTMLDivElement>('custom-cert-section');
+    if (customCertSection) customCertSection.classList.remove('hidden');
+    createIcons({ icons });
+
+    await validateSignatures();
+}
+
+function updatePdfDisplay(): void {
+    const fileDisplayArea = getElement<HTMLDivElement>('file-display-area');
+    if (!fileDisplayArea || !state.pdfFile) return;
+
+    fileDisplayArea.innerHTML = '';
+
+    const fileDiv = document.createElement('div');
+    fileDiv.className = 'flex items-center justify-between bg-gray-700 p-3 rounded-lg';
+
+    const infoContainer = document.createElement('div');
+    infoContainer.className = 'flex flex-col flex-1 min-w-0';
+
+    const nameSpan = document.createElement('div');
+    nameSpan.className = 'truncate font-medium text-gray-200 text-sm mb-1';
+    nameSpan.textContent = state.pdfFile.name;
+
+    const metaSpan = document.createElement('div');
+    metaSpan.className = 'text-xs text-gray-400';
+    metaSpan.textContent = formatBytes(state.pdfFile.size);
+
+    infoContainer.append(nameSpan, metaSpan);
+
+    const removeBtn = document.createElement('button');
+    removeBtn.className = 'ml-4 text-red-400 hover:text-red-300 flex-shrink-0';
+    removeBtn.innerHTML = '<i data-lucide="trash-2" class="w-4 h-4"></i>';
+    removeBtn.onclick = () => resetState();
+
+    fileDiv.append(infoContainer, removeBtn);
+    fileDisplayArea.appendChild(fileDiv);
+    createIcons({ icons });
+}
+
+function handleCertUpload(e: Event): void {
+    const input = e.target as HTMLInputElement;
+    if (input.files && input.files.length > 0) {
+        handleCertFile(input.files[0]);
+    }
+}
+
+async function handleCertFile(file: File): Promise<void> {
+    const validExtensions = ['.pem', '.crt', '.cer', '.der'];
+    const hasValidExtension = validExtensions.some(ext => file.name.toLowerCase().endsWith(ext));
+
+    if (!hasValidExtension) {
+        showAlert('Invalid Certificate', 'Please select a .pem, .crt, .cer, or .der certificate file.');
+        return;
+    }
+
+    resetCertState();
+    state.trustedCertFile = file;
+
+    try {
+        const content = await file.text();
+
+        if (content.includes('-----BEGIN CERTIFICATE-----')) {
+            state.trustedCert = forge.pki.certificateFromPem(content);
+        } else {
+            const bytes = new Uint8Array(await readFileAsArrayBuffer(file) as ArrayBuffer);
+            const derString = String.fromCharCode.apply(null, Array.from(bytes));
+            const asn1 = forge.asn1.fromDer(derString);
+            state.trustedCert = forge.pki.certificateFromAsn1(asn1);
+        }
+
+        updateCertDisplay();
+
+        if (state.pdfBytes) {
+            await validateSignatures();
+        }
+    } catch (error) {
+        console.error('Error parsing certificate:', error);
+        showAlert('Invalid Certificate', 'Failed to parse the certificate file.');
+        resetCertState();
+    }
+}
+
+function updateCertDisplay(): void {
+    const certDisplayArea = getElement<HTMLDivElement>('cert-display-area');
+    if (!certDisplayArea || !state.trustedCertFile || !state.trustedCert) return;
+
+    certDisplayArea.innerHTML = '';
+
+    const certDiv = document.createElement('div');
+    certDiv.className = 'flex items-center justify-between bg-gray-700 p-3 rounded-lg';
+
+    const infoContainer = document.createElement('div');
+    infoContainer.className = 'flex flex-col flex-1 min-w-0';
+
+    const nameSpan = document.createElement('div');
+    nameSpan.className = 'truncate font-medium text-gray-200 text-sm mb-1';
+
+    const cn = state.trustedCert.subject.getField('CN');
+    nameSpan.textContent = cn?.value as string || state.trustedCertFile.name;
+
+    const metaSpan = document.createElement('div');
+    metaSpan.className = 'text-xs text-green-400';
+    metaSpan.innerHTML = '<i data-lucide="check-circle" class="inline w-3 h-3 mr-1"></i>Trusted certificate loaded';
+
+    infoContainer.append(nameSpan, metaSpan);
+
+    const removeBtn = document.createElement('button');
+    removeBtn.className = 'ml-4 text-red-400 hover:text-red-300 flex-shrink-0';
+    removeBtn.innerHTML = '<i data-lucide="trash-2" class="w-4 h-4"></i>';
+    removeBtn.onclick = async () => {
+        resetCertState();
+        if (state.pdfBytes) {
+            await validateSignatures();
+        }
+    };
+
+    certDiv.append(infoContainer, removeBtn);
+    certDisplayArea.appendChild(certDiv);
+    createIcons({ icons });
+}
+
+async function validateSignatures(): Promise<void> {
+    if (!state.pdfBytes) return;
+
+    showLoader('Analyzing signatures...');
+
+    try {
+        state.results = await validatePdfSignatures(state.pdfBytes, state.trustedCert ?? undefined);
+        displayResults();
+    } catch (error) {
+        console.error('Validation error:', error);
+        showAlert('Error', 'Failed to validate signatures. The file may be corrupted.');
+    } finally {
+        hideLoader();
+    }
+}
+
+function displayResults(): void {
+    const resultsSection = getElement<HTMLDivElement>('results-section');
+    const resultsContainer = getElement<HTMLDivElement>('results-container');
+
+    if (!resultsSection || !resultsContainer) return;
+
+    resultsContainer.innerHTML = '';
+    resultsSection.classList.remove('hidden');
+
+    if (state.results.length === 0) {
+        resultsContainer.innerHTML = `
+            <div class="bg-gray-700 rounded-lg p-6 text-center border border-gray-600">
+                <i data-lucide="file-x" class="w-12 h-12 mx-auto mb-4 text-gray-400"></i>
+                <h3 class="text-lg font-semibold text-white mb-2">No Signatures Found</h3>
+                <p class="text-gray-400">This PDF does not contain any digital signatures.</p>
+            </div>
+        `;
+        createIcons({ icons });
+        return;
+    }
+
+    const summaryDiv = document.createElement('div');
+    summaryDiv.className = 'mb-4 p-3 bg-gray-700 rounded-lg border border-gray-600';
+
+    const validCount = state.results.filter(r => r.isValid && !r.isExpired).length;
+    const trustVerified = state.trustedCert ? state.results.filter(r => r.isTrusted).length : 0;
+
+    let summaryHtml = `
+        <p class="text-gray-300">
+            <span class="font-semibold text-white">${state.results.length}</span> 
+            signature${state.results.length > 1 ? 's' : ''} found
+            <span class="text-gray-500">•</span>
+            <span class="${validCount === state.results.length ? 'text-green-400' : 'text-yellow-400'}">${validCount} valid</span>
+        </p>
+    `;
+
+    if (state.trustedCert) {
+        summaryHtml += `
+            <p class="text-xs text-gray-400 mt-1">
+                <i data-lucide="shield-check" class="inline w-3 h-3 mr-1"></i>
+                Trust verification: ${trustVerified}/${state.results.length} signatures verified against custom certificate
+            </p>
+        `;
+    }
+
+    summaryDiv.innerHTML = summaryHtml;
+    resultsContainer.appendChild(summaryDiv);
+
+    state.results.forEach((result, index) => {
+        const card = createSignatureCard(result, index);
+        resultsContainer.appendChild(card);
+    });
+
+    createIcons({ icons });
+}
+
+function createSignatureCard(result: SignatureValidationResult, index: number): HTMLElement {
+    const card = document.createElement('div');
+    card.className = 'bg-gray-700 rounded-lg p-4 border border-gray-600 mb-4';
+
+    let statusColor = 'text-green-400';
+    let statusIcon = 'check-circle';
+    let statusText = 'Valid Signature';
+
+    if (!result.isValid) {
+        statusColor = 'text-red-400';
+        statusIcon = 'x-circle';
+        statusText = 'Invalid Signature';
+    } else if (result.isExpired) {
+        statusColor = 'text-yellow-400';
+        statusIcon = 'alert-triangle';
+        statusText = 'Certificate Expired';
+    } else if (result.isSelfSigned) {
+        statusColor = 'text-yellow-400';
+        statusIcon = 'alert-triangle';
+        statusText = 'Self-Signed Certificate';
+    }
+
+    const formatDate = (date: Date) => {
+        if (!date || date.getTime() === 0) return 'Unknown';
+        return date.toLocaleDateString(undefined, {
+            year: 'numeric',
+            month: 'short',
+            day: 'numeric',
+            hour: '2-digit',
+            minute: '2-digit'
+        });
+    };
+
+    let trustBadge = '';
+    if (state.trustedCert) {
+        if (result.isTrusted) {
+            trustBadge = '<span class="text-xs bg-green-900 text-green-300 px-2 py-1 rounded ml-2"><i data-lucide="shield-check" class="inline w-3 h-3 mr-1"></i>Trusted</span>';
+        } else {
+            trustBadge = '<span class="text-xs bg-gray-600 text-gray-300 px-2 py-1 rounded ml-2"><i data-lucide="shield-x" class="inline w-3 h-3 mr-1"></i>Not in trust chain</span>';
+        }
+    }
+
+    card.innerHTML = `
+        <div class="flex items-start justify-between mb-4">
+            <div class="flex items-center gap-3">
+                <i data-lucide="${statusIcon}" class="w-6 h-6 ${statusColor}"></i>
+                <div>
+                    <h3 class="font-semibold text-white">Signature ${index + 1}</h3>
+                    <p class="text-sm ${statusColor}">${statusText}</p>
+                </div>
+            </div>
+            <div class="flex items-center">
+                ${result.coverageStatus === 'full'
+            ? '<span class="text-xs bg-green-900 text-green-300 px-2 py-1 rounded">Full Coverage</span>'
+            : result.coverageStatus === 'partial'
+                ? '<span class="text-xs bg-yellow-900 text-yellow-300 px-2 py-1 rounded">Partial Coverage</span>'
+                : ''
+        }${trustBadge}
+            </div>
+        </div>
+
+        <div class="space-y-3 text-sm">
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                <div>
+                    <p class="text-gray-400">Signed By</p>
+                    <p class="text-white font-medium">${escapeHtml(result.signerName)}</p>
+                    ${result.signerOrg ? `<p class="text-gray-400 text-xs">${escapeHtml(result.signerOrg)}</p>` : ''}
+                    ${result.signerEmail ? `<p class="text-gray-400 text-xs">${escapeHtml(result.signerEmail)}</p>` : ''}
+                </div>
+                <div>
+                    <p class="text-gray-400">Issuer</p>
+                    <p class="text-white font-medium">${escapeHtml(result.issuer)}</p>
+                    ${result.issuerOrg ? `<p class="text-gray-400 text-xs">${escapeHtml(result.issuerOrg)}</p>` : ''}
+                </div>
+            </div>
+
+            ${result.signatureDate ? `
+                <div>
+                    <p class="text-gray-400">Signed On</p>
+                    <p class="text-white">${formatDate(result.signatureDate)}</p>
+                </div>
+            ` : ''}
+
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                <div>
+                    <p class="text-gray-400">Valid From</p>
+                    <p class="text-white">${formatDate(result.validFrom)}</p>
+                </div>
+                <div>
+                    <p class="text-gray-400">Valid Until</p>
+                    <p class="${result.isExpired ? 'text-red-400' : 'text-white'}">${formatDate(result.validTo)}</p>
+                </div>
+            </div>
+
+            ${result.reason ? `
+                <div>
+                    <p class="text-gray-400">Reason</p>
+                    <p class="text-white">${escapeHtml(result.reason)}</p>
+                </div>
+            ` : ''}
+
+            ${result.location ? `
+                <div>
+                    <p class="text-gray-400">Location</p>
+                    <p class="text-white">${escapeHtml(result.location)}</p>
+                </div>
+            ` : ''}
+
+            <details class="mt-2">
+                <summary class="cursor-pointer text-indigo-400 hover:text-indigo-300 text-sm">
+                    Technical Details
+                </summary>
+                <div class="mt-2 p-3 bg-gray-800 rounded text-xs space-y-1">
+                    <p><span class="text-gray-400">Serial Number:</span> <span class="text-gray-300 font-mono">${escapeHtml(result.serialNumber)}</span></p>
+                    <p><span class="text-gray-400">Digest Algorithm:</span> <span class="text-gray-300">${escapeHtml(result.algorithms.digest)}</span></p>
+                    <p><span class="text-gray-400">Signature Algorithm:</span> <span class="text-gray-300">${escapeHtml(result.algorithms.signature)}</span></p>
+                    ${result.errorMessage ? `<p class="text-red-400">Error: ${escapeHtml(result.errorMessage)}</p>` : ''}
+                </div>
+            </details>
+        </div>
+    `;
+
+    return card;
+}
+
+function escapeHtml(str: string): string {
+    const div = document.createElement('div');
+    div.textContent = str;
+    return div.innerHTML;
+}
+
+if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initializePage);
+} else {
+    initializePage();
+}
diff --git a/src/js/logic/validate-signature-pdf.ts b/src/js/logic/validate-signature-pdf.ts
new file mode 100644
index 0000000..59ee5f5
--- /dev/null
+++ b/src/js/logic/validate-signature-pdf.ts
@@ -0,0 +1,238 @@
+import forge from 'node-forge';
+import { ExtractedSignature, SignatureValidationResult } from '@/types';
+
+
+export function extractSignatures(pdfBytes: Uint8Array): ExtractedSignature[] {
+    const signatures: ExtractedSignature[] = [];
+    const pdfString = new TextDecoder('latin1').decode(pdfBytes);
+
+    // Find all signature objects for /Type /Sig
+    const sigRegex = /\/Type\s*\/Sig\b/g;
+    let sigMatch;
+    let sigIndex = 0;
+
+    while ((sigMatch = sigRegex.exec(pdfString)) !== null) {
+        try {
+            const searchStart = Math.max(0, sigMatch.index - 5000);
+            const searchEnd = Math.min(pdfString.length, sigMatch.index + 10000);
+            const context = pdfString.substring(searchStart, searchEnd);
+            const byteRangeMatch = context.match(/\/ByteRange\s*\[\s*(\d+)\s+(\d+)\s+(\d+)\s+(\d+)\s*\]/);
+            if (!byteRangeMatch) continue;
+
+            const byteRange = [
+                parseInt(byteRangeMatch[1], 10),
+                parseInt(byteRangeMatch[2], 10),
+                parseInt(byteRangeMatch[3], 10),
+                parseInt(byteRangeMatch[4], 10),
+            ];
+
+            const contentsMatch = context.match(/\/Contents\s*<([0-9A-Fa-f]+)>/);
+            if (!contentsMatch) continue;
+
+            const hexContents = contentsMatch[1];
+            const contentsBytes = hexToBytes(hexContents);
+
+            const reasonMatch = context.match(/\/Reason\s*\(([^)]*)\)/);
+            const locationMatch = context.match(/\/Location\s*\(([^)]*)\)/);
+            const contactMatch = context.match(/\/ContactInfo\s*\(([^)]*)\)/);
+            const nameMatch = context.match(/\/Name\s*\(([^)]*)\)/);
+            const timeMatch = context.match(/\/M\s*\(D:(\d{4})(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/);
+
+            let signingTime: string | undefined;
+            if (timeMatch) {
+                signingTime = `${timeMatch[1]}-${timeMatch[2]}-${timeMatch[3]}T${timeMatch[4]}:${timeMatch[5]}:${timeMatch[6]}`;
+            }
+
+            signatures.push({
+                index: sigIndex++,
+                contents: contentsBytes,
+                byteRange,
+                reason: reasonMatch ? decodeURIComponent(escape(reasonMatch[1])) : undefined,
+                location: locationMatch ? decodeURIComponent(escape(locationMatch[1])) : undefined,
+                contactInfo: contactMatch ? decodeURIComponent(escape(contactMatch[1])) : undefined,
+                name: nameMatch ? decodeURIComponent(escape(nameMatch[1])) : undefined,
+                signingTime,
+            });
+        } catch (e) {
+            console.warn('Error extracting signature at index', sigIndex, e);
+        }
+    }
+
+    return signatures;
+}
+
+export function validateSignature(
+    signature: ExtractedSignature,
+    pdfBytes: Uint8Array,
+    trustedCert?: forge.pki.Certificate
+): SignatureValidationResult {
+    const result: SignatureValidationResult = {
+        signatureIndex: signature.index,
+        isValid: false,
+        signerName: 'Unknown',
+        issuer: 'Unknown',
+        validFrom: new Date(0),
+        validTo: new Date(0),
+        isExpired: false,
+        isSelfSigned: false,
+        isTrusted: false,
+        algorithms: { digest: 'Unknown', signature: 'Unknown' },
+        serialNumber: '',
+        byteRange: signature.byteRange,
+        coverageStatus: 'unknown',
+        reason: signature.reason,
+        location: signature.location,
+        contactInfo: signature.contactInfo,
+    };
+
+    try {
+        const binaryString = String.fromCharCode.apply(null, Array.from(signature.contents));
+        const asn1 = forge.asn1.fromDer(binaryString);
+        const p7 = forge.pkcs7.messageFromAsn1(asn1) as any;
+
+        if (!p7.certificates || p7.certificates.length === 0) {
+            result.errorMessage = 'No certificates found in signature';
+            return result;
+        }
+
+        const signerCert = p7.certificates[0] as forge.pki.Certificate;
+
+        const subjectCN = signerCert.subject.getField('CN');
+        const subjectO = signerCert.subject.getField('O');
+        const subjectE = signerCert.subject.getField('E') || signerCert.subject.getField('emailAddress');
+        const issuerCN = signerCert.issuer.getField('CN');
+        const issuerO = signerCert.issuer.getField('O');
+
+        result.signerName = (subjectCN?.value as string) ?? 'Unknown';
+        result.signerOrg = subjectO?.value as string | undefined;
+        result.signerEmail = subjectE?.value as string | undefined;
+        result.issuer = (issuerCN?.value as string) ?? 'Unknown';
+        result.issuerOrg = issuerO?.value as string | undefined;
+        result.validFrom = signerCert.validity.notBefore;
+        result.validTo = signerCert.validity.notAfter;
+        result.serialNumber = signerCert.serialNumber;
+
+        const now = new Date();
+        result.isExpired = now > result.validTo || now < result.validFrom;
+
+        result.isSelfSigned = signerCert.isIssuer(signerCert);
+
+        // Check trust against provided certificate
+        if (trustedCert) {
+            try {
+                const isTrustedIssuer = trustedCert.isIssuer(signerCert);
+                const isSameCert = signerCert.serialNumber === trustedCert.serialNumber;
+
+                let chainTrusted = false;
+                for (const cert of p7.certificates) {
+                    if (trustedCert.isIssuer(cert) ||
+                        (cert as forge.pki.Certificate).serialNumber === trustedCert.serialNumber) {
+                        chainTrusted = true;
+                        break;
+                    }
+                }
+
+                result.isTrusted = isTrustedIssuer || isSameCert || chainTrusted;
+            } catch {
+                result.isTrusted = false;
+            }
+        }
+
+        result.algorithms = {
+            digest: getDigestAlgorithmName(signerCert.siginfo?.algorithmOid || ''),
+            signature: getSignatureAlgorithmName(signerCert.signatureOid || ''),
+        };
+
+        // Parse signing time if available in signature
+        if (signature.signingTime) {
+            result.signatureDate = new Date(signature.signingTime);
+        } else {
+            // Try to extract from authenticated attributes
+            try {
+                const signedData = p7 as any;
+                if (signedData.rawCapture?.authenticatedAttributes) {
+                    // Look for signing time attribute
+                    for (const attr of signedData.rawCapture.authenticatedAttributes) {
+                        if (attr.type === forge.pki.oids.signingTime) {
+                            result.signatureDate = attr.value;
+                            break;
+                        }
+                    }
+                }
+            } catch { /* ignore */ }
+        }
+
+        if (signature.byteRange && signature.byteRange.length === 4) {
+            const [start1, len1, start2, len2] = signature.byteRange;
+            const totalCovered = len1 + len2;
+            const expectedEnd = start2 + len2;
+
+            if (expectedEnd === pdfBytes.length) {
+                result.coverageStatus = 'full';
+            } else if (expectedEnd < pdfBytes.length) {
+                result.coverageStatus = 'partial';
+            }
+        }
+
+        result.isValid = true;
+
+    } catch (e) {
+        result.errorMessage = e instanceof Error ? e.message : 'Failed to parse signature';
+    }
+
+    return result;
+}
+
+export async function validatePdfSignatures(
+    pdfBytes: Uint8Array,
+    trustedCert?: forge.pki.Certificate
+): Promise<SignatureValidationResult[]> {
+    const signatures = extractSignatures(pdfBytes);
+    return signatures.map(sig => validateSignature(sig, pdfBytes, trustedCert));
+}
+
+export function countSignatures(pdfBytes: Uint8Array): number {
+    return extractSignatures(pdfBytes).length;
+}
+
+function hexToBytes(hex: string): Uint8Array {
+    const bytes = new Uint8Array(hex.length / 2);
+    for (let i = 0; i < hex.length; i += 2) {
+        bytes[i / 2] = parseInt(hex.substr(i, 2), 16);
+    }
+
+    let actualLength = bytes.length;
+    while (actualLength > 0 && bytes[actualLength - 1] === 0) {
+        actualLength--;
+    }
+
+    return bytes.slice(0, actualLength);
+}
+
+function getDigestAlgorithmName(oid: string): string {
+    const digestAlgorithms: Record<string, string> = {
+        '1.2.840.113549.2.5': 'MD5',
+        '1.3.14.3.2.26': 'SHA-1',
+        '2.16.840.1.101.3.4.2.1': 'SHA-256',
+        '2.16.840.1.101.3.4.2.2': 'SHA-384',
+        '2.16.840.1.101.3.4.2.3': 'SHA-512',
+        '2.16.840.1.101.3.4.2.4': 'SHA-224',
+    };
+    return digestAlgorithms[oid] || oid || 'Unknown';
+}
+
+function getSignatureAlgorithmName(oid: string): string {
+    const signatureAlgorithms: Record<string, string> = {
+        '1.2.840.113549.1.1.1': 'RSA',
+        '1.2.840.113549.1.1.5': 'RSA with SHA-1',
+        '1.2.840.113549.1.1.11': 'RSA with SHA-256',
+        '1.2.840.113549.1.1.12': 'RSA with SHA-384',
+        '1.2.840.113549.1.1.13': 'RSA with SHA-512',
+        '1.2.840.10045.2.1': 'ECDSA',
+        '1.2.840.10045.4.1': 'ECDSA with SHA-1',
+        '1.2.840.10045.4.3.2': 'ECDSA with SHA-256',
+        '1.2.840.10045.4.3.3': 'ECDSA with SHA-384',
+        '1.2.840.10045.4.3.4': 'ECDSA with SHA-512',
+    };
+    return signatureAlgorithms[oid] || oid || 'Unknown';
+}
diff --git a/src/js/logic/view-metadata-page.ts b/src/js/logic/view-metadata-page.ts
index fc00e66..240dcce 100644
--- a/src/js/logic/view-metadata-page.ts
+++ b/src/js/logic/view-metadata-page.ts
@@ -1,11 +1,7 @@
 import { showLoader, hideLoader, showAlert } from '../ui.js';
 import { formatBytes, formatIsoDate, getPDFDocument } from '../utils/helpers.js';
 import { createIcons, icons } from 'lucide';
-
-interface ViewMetadataState {
-    file: File | null;
-    metadata: Record<string, unknown>;
-}
+import { ViewMetadataState } from '@/types';
 
 const pageState: ViewMetadataState = {
     file: null,
diff --git a/src/js/main.ts b/src/js/main.ts
index 15145df..923c27b 100644
--- a/src/js/main.ts
+++ b/src/js/main.ts
@@ -102,7 +102,7 @@ const init = async () => {
                   <span class="text-white font-bold text-lg">BentoPDF</span>
                 </div>
                 <p class="text-gray-400 text-sm">
-                  &copy; 2025 BentoPDF. All rights reserved.
+                  &copy; 2026 BentoPDF. All rights reserved.
                 </p>
                 <p class="text-gray-500 text-xs mt-2">
                   Version <span id="app-version-simple">${APP_VERSION}</span>
@@ -321,30 +321,63 @@ const init = async () => {
     const searchBar = document.getElementById('search-bar');
     const categoryGroups = dom.toolGrid.querySelectorAll('.category-group');
 
+    const searchResultsContainer = document.createElement('div');
+    searchResultsContainer.id = 'search-results';
+    searchResultsContainer.className = 'hidden grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4 md:gap-6 col-span-full';
+    dom.toolGrid.insertBefore(searchResultsContainer, dom.toolGrid.firstChild);
+
     searchBar.addEventListener('input', () => {
       // @ts-expect-error TS(2339) FIXME: Property 'value' does not exist on type 'HTMLEleme... Remove this comment to see the full error message
       const searchTerm = searchBar.value.toLowerCase().trim();
 
+      if (!searchTerm) {
+        searchResultsContainer.classList.add('hidden');
+        searchResultsContainer.innerHTML = '';
+        categoryGroups.forEach((group) => {
+          (group as HTMLElement).style.display = '';
+          const toolCards = group.querySelectorAll('.tool-card');
+          toolCards.forEach((card) => {
+            (card as HTMLElement).style.display = '';
+          });
+        });
+        return;
+      }
+
+      categoryGroups.forEach((group) => {
+        (group as HTMLElement).style.display = 'none';
+      });
+
+      searchResultsContainer.innerHTML = '';
+      searchResultsContainer.classList.remove('hidden');
+
+      const seenToolIds = new Set<string>();
+      const allTools: HTMLElement[] = [];
+
       categoryGroups.forEach((group) => {
         const toolCards = Array.from(group.querySelectorAll('.tool-card'));
 
-        let visibleToolsInCategory = 0;
-
         toolCards.forEach((card) => {
           const toolName = (card.querySelector('h3')?.textContent || '').toLowerCase();
           const toolSubtitle = (card.querySelector('p')?.textContent || '').toLowerCase();
+          const toolHref = (card as HTMLAnchorElement).href || (card as HTMLElement).dataset.toolId || '';
 
-          const isMatch = !searchTerm || toolName.includes(searchTerm) || toolSubtitle.includes(searchTerm);
+          const toolId = toolHref.split('/').pop()?.replace('.html', '') || toolName;
 
-          (card as HTMLElement).style.display = isMatch ? '' : 'none';
+          const isMatch = toolName.includes(searchTerm) || toolSubtitle.includes(searchTerm);
+          const isDuplicate = seenToolIds.has(toolId);
 
-          if (isMatch) {
-            visibleToolsInCategory++;
+          if (isMatch && !isDuplicate) {
+            seenToolIds.add(toolId);
+            allTools.push(card.cloneNode(true) as HTMLElement);
           }
         });
-
-        (group as HTMLElement).style.display = visibleToolsInCategory === 0 ? 'none' : '';
       });
+
+      allTools.forEach((tool) => {
+        searchResultsContainer.appendChild(tool);
+      });
+
+      createIcons({ icons });
     });
 
     window.addEventListener('keydown', function (e) {
@@ -465,8 +498,7 @@ const init = async () => {
   const fullWidthToggle = document.getElementById('full-width-toggle') as HTMLInputElement;
   const toolInterface = document.getElementById('tool-interface');
 
-  // Load saved preference
-  const savedFullWidth = localStorage.getItem('fullWidthMode') === 'true';
+  const savedFullWidth = localStorage.getItem('fullWidthMode') !== 'false';
   if (fullWidthToggle) {
     fullWidthToggle.checked = savedFullWidth;
     applyFullWidthMode(savedFullWidth);
diff --git a/src/js/types/add-blank-page-type.ts b/src/js/types/add-blank-page-type.ts
new file mode 100644
index 0000000..3d2f03c
--- /dev/null
+++ b/src/js/types/add-blank-page-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface AddBlankPageState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+}
\ No newline at end of file
diff --git a/src/js/types/add-watermark-type.ts b/src/js/types/add-watermark-type.ts
new file mode 100644
index 0000000..583d112
--- /dev/null
+++ b/src/js/types/add-watermark-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface AddWatermarkState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+}
\ No newline at end of file
diff --git a/src/js/types/alternate-merge-page-type.ts b/src/js/types/alternate-merge-page-type.ts
new file mode 100644
index 0000000..488ecb7
--- /dev/null
+++ b/src/js/types/alternate-merge-page-type.ts
@@ -0,0 +1,5 @@
+export interface AlternateMergeState {
+    files: File[];
+    pdfBytes: Map<string, ArrayBuffer>;
+    pdfDocs: Map<string, any>;
+}
\ No newline at end of file
diff --git a/src/js/types/attachment-type.ts b/src/js/types/attachment-type.ts
new file mode 100644
index 0000000..a2cc85a
--- /dev/null
+++ b/src/js/types/attachment-type.ts
@@ -0,0 +1,7 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface AddAttachmentState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+    attachments: File[];
+}
\ No newline at end of file
diff --git a/src/js/types/background-color-type.ts b/src/js/types/background-color-type.ts
new file mode 100644
index 0000000..9235ba8
--- /dev/null
+++ b/src/js/types/background-color-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface BackgroundColorState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+}
diff --git a/src/js/types/change-permissions-type.ts b/src/js/types/change-permissions-type.ts
new file mode 100644
index 0000000..5c1a954
--- /dev/null
+++ b/src/js/types/change-permissions-type.ts
@@ -0,0 +1,3 @@
+export interface ChangePermissionsState {
+    file: File | null;
+}
diff --git a/src/js/types/combine-single-page-type.ts b/src/js/types/combine-single-page-type.ts
new file mode 100644
index 0000000..7ea4389
--- /dev/null
+++ b/src/js/types/combine-single-page-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface CombineSinglePageState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+}
diff --git a/src/js/types/compare-pdfs-type.ts b/src/js/types/compare-pdfs-type.ts
new file mode 100644
index 0000000..de54566
--- /dev/null
+++ b/src/js/types/compare-pdfs-type.ts
@@ -0,0 +1,9 @@
+import * as pdfjsLib from 'pdfjs-dist';
+
+export interface CompareState {
+    pdfDoc1: pdfjsLib.PDFDocumentProxy | null;
+    pdfDoc2: pdfjsLib.PDFDocumentProxy | null;
+    currentPage: number;
+    viewMode: 'overlay' | 'side-by-side';
+    isSyncScroll: boolean;
+}
diff --git a/src/js/types/crop-pdf-type.ts b/src/js/types/crop-pdf-type.ts
new file mode 100644
index 0000000..7b8bcf6
--- /dev/null
+++ b/src/js/types/crop-pdf-type.ts
@@ -0,0 +1,8 @@
+export interface CropperState {
+    pdfDoc: any;
+    currentPageNum: number;
+    cropper: any;
+    originalPdfBytes: ArrayBuffer | null;
+    pageCrops: Record<number, any>;
+    file: File | null;
+}
diff --git a/src/js/types/decrypt-pdf-type.ts b/src/js/types/decrypt-pdf-type.ts
new file mode 100644
index 0000000..15ec438
--- /dev/null
+++ b/src/js/types/decrypt-pdf-type.ts
@@ -0,0 +1,3 @@
+export interface DecryptPdfState {
+    file: File | null;
+}
diff --git a/src/js/types/delete-pages-type.ts b/src/js/types/delete-pages-type.ts
new file mode 100644
index 0000000..0f42730
--- /dev/null
+++ b/src/js/types/delete-pages-type.ts
@@ -0,0 +1,7 @@
+export interface DeletePagesState {
+    file: File | null;
+    pdfDoc: any;
+    pdfJsDoc: any;
+    totalPages: number;
+    pagesToDelete: Set<number>;
+}
diff --git a/src/js/types/digital-sign-type.ts b/src/js/types/digital-sign-type.ts
new file mode 100644
index 0000000..84c648e
--- /dev/null
+++ b/src/js/types/digital-sign-type.ts
@@ -0,0 +1,42 @@
+import { forge } from "zgapdfsigner";
+
+export interface SignatureInfo {
+    reason?: string;
+    location?: string;
+    contactInfo?: string;
+    name?: string;
+}
+
+export interface CertificateData {
+    p12Buffer: ArrayBuffer;
+    password: string;
+    certificate: forge.pki.Certificate;
+}
+
+export interface SignPdfOptions {
+    signatureInfo?: SignatureInfo;
+    visibleSignature?: VisibleSignatureOptions;
+}
+
+export interface VisibleSignatureOptions {
+    enabled: boolean;
+    imageData?: ArrayBuffer;
+    imageType?: 'png' | 'jpeg' | 'webp';
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    page: number | string;
+    text?: string;
+    textColor?: string;
+    textSize?: number;
+}
+
+export interface DigitalSignState {
+    pdfFile: File | null;
+    pdfBytes: Uint8Array | null;
+    certFile: File | null;
+    certData: CertificateData | null;
+    sigImageData: ArrayBuffer | null;
+    sigImageType: 'png' | 'jpeg' | 'webp' | null;
+}
\ No newline at end of file
diff --git a/src/js/types/divide-pages-type.ts b/src/js/types/divide-pages-type.ts
new file mode 100644
index 0000000..fc8b72a
--- /dev/null
+++ b/src/js/types/divide-pages-type.ts
@@ -0,0 +1,7 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface DividePagesState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+    totalPages: number;
+}
\ No newline at end of file
diff --git a/src/js/types/edit-attachments-type.ts b/src/js/types/edit-attachments-type.ts
new file mode 100644
index 0000000..0c0f438
--- /dev/null
+++ b/src/js/types/edit-attachments-type.ts
@@ -0,0 +1,12 @@
+export interface AttachmentInfo {
+    index: number;
+    name: string;
+    page: number;
+    data: Uint8Array;
+}
+
+export interface EditAttachmentState {
+    file: File | null;
+    allAttachments: AttachmentInfo[];
+    attachmentsToRemove: Set<number>;
+}
\ No newline at end of file
diff --git a/src/js/types/edit-metadata-type.ts b/src/js/types/edit-metadata-type.ts
new file mode 100644
index 0000000..b62e6c4
--- /dev/null
+++ b/src/js/types/edit-metadata-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface EditMetadataState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+}
\ No newline at end of file
diff --git a/src/js/types/encrypt-pdf-type.ts b/src/js/types/encrypt-pdf-type.ts
new file mode 100644
index 0000000..8acd7a2
--- /dev/null
+++ b/src/js/types/encrypt-pdf-type.ts
@@ -0,0 +1,3 @@
+export interface EncryptPdfState {
+    file: File | null;
+}
diff --git a/src/js/types/extract-attachments-type.ts b/src/js/types/extract-attachments-type.ts
new file mode 100644
index 0000000..a1cbadb
--- /dev/null
+++ b/src/js/types/extract-attachments-type.ts
@@ -0,0 +1,3 @@
+export interface ExtractAttachmentsState {
+    files: File[];
+}
diff --git a/src/js/types/extract-images-type.ts b/src/js/types/extract-images-type.ts
new file mode 100644
index 0000000..a436909
--- /dev/null
+++ b/src/js/types/extract-images-type.ts
@@ -0,0 +1,7 @@
+export interface ExtractedImage {
+    data: Blob;
+    width: number;
+    height: number;
+    pageNumber: number;
+    imageIndex: number;
+}
diff --git a/src/js/types/extract-pages-type.ts b/src/js/types/extract-pages-type.ts
new file mode 100644
index 0000000..9791731
--- /dev/null
+++ b/src/js/types/extract-pages-type.ts
@@ -0,0 +1,5 @@
+export interface ExtractPagesState {
+    file: File | null;
+    pdfBytes: ArrayBuffer | null;
+    totalPages: number;
+}
diff --git a/src/js/types/fix-page-size-type.ts b/src/js/types/fix-page-size-type.ts
new file mode 100644
index 0000000..e286afd
--- /dev/null
+++ b/src/js/types/fix-page-size-type.ts
@@ -0,0 +1,3 @@
+export interface FixPageSizeState {
+    file: File | null;
+}
diff --git a/src/js/types/flatten-pdf-type.ts b/src/js/types/flatten-pdf-type.ts
new file mode 100644
index 0000000..e8815f5
--- /dev/null
+++ b/src/js/types/flatten-pdf-type.ts
@@ -0,0 +1,3 @@
+export interface FlattenPdfState {
+    files: File[];
+}
diff --git a/src/js/types/form-creator.ts b/src/js/types/form-creator-type.ts
similarity index 100%
rename from src/js/types/form-creator.ts
rename to src/js/types/form-creator-type.ts
diff --git a/src/js/types/header-footer-type.ts b/src/js/types/header-footer-type.ts
new file mode 100644
index 0000000..2a9d1b6
--- /dev/null
+++ b/src/js/types/header-footer-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface HeaderFooterState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+}
diff --git a/src/js/types/index.ts b/src/js/types/index.ts
index 1e88b7b..9f73240 100644
--- a/src/js/types/index.ts
+++ b/src/js/types/index.ts
@@ -1,2 +1,48 @@
-export * from './ocr.js';
-export * from './form-creator.js';
+export * from './ocr-type.js';
+export * from './form-creator-type.js';
+export * from './digital-sign-type.js';
+export * from './attachment-type.js';
+export * from './edit-attachments-type.js';
+export * from './edit-metadata-type.js';
+export * from './divide-pages-type.js';
+export * from './alternate-merge-page-type.js';
+export * from './add-blank-page-type.js';
+export * from './compare-pdfs-type.js';
+export * from './fix-page-size-type.js';
+export * from './view-metadata-type.js';
+export * from './header-footer-type.js';
+export * from './encrypt-pdf-type.js';
+export * from './flatten-pdf-type.js';
+export * from './crop-pdf-type.js';
+export * from './background-color-type.js';
+export * from './posterize-type.js';
+export * from './decrypt-pdf-type.js';
+export * from './combine-single-page-type.js';
+export * from './change-permissions-type.js';
+export * from './validate-signature-type.js';
+export * from './remove-restrictions-type.js';
+export * from './page-dimensions-type.js';
+export * from './extract-attachments-type.js';
+export * from './pdf-multi-tool-type.js';
+export * from './ocr-pdf-type.js';
+export * from './delete-pages-type.js';
+export * from './invert-colors-type.js';
+export * from './table-of-contents-type.js';
+export * from './organize-pdf-type.js';
+export * from './merge-pdf-type.js';
+export * from './extract-images-type.js';
+export * from './extract-pages-type.js';
+export * from './pdf-layers-type.js';
+export * from './sanitize-pdf-type.js';
+export * from './reverse-pages-type.js';
+export * from './text-color-type.js';
+export * from './n-up-pdf-type.js';
+export * from './linearize-pdf-type.js';
+export * from './remove-metadata-type.js';
+export * from './rotate-pdf-type.js';
+export * from './pdf-booklet-type.js';
+export * from './page-numbers-type.js';
+export * from './pdf-to-zip-type.js';
+export * from './sign-pdf-type.js';
+export * from './add-watermark-type.js';
+
diff --git a/src/js/types/invert-colors-type.ts b/src/js/types/invert-colors-type.ts
new file mode 100644
index 0000000..cb5abf8
--- /dev/null
+++ b/src/js/types/invert-colors-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface InvertColorsState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+}
diff --git a/src/js/types/linearize-pdf-type.ts b/src/js/types/linearize-pdf-type.ts
new file mode 100644
index 0000000..50a4c02
--- /dev/null
+++ b/src/js/types/linearize-pdf-type.ts
@@ -0,0 +1,3 @@
+export interface LinearizePdfState {
+    files: File[];
+}
diff --git a/src/js/types/merge-pdf-type.ts b/src/js/types/merge-pdf-type.ts
new file mode 100644
index 0000000..2fbfed9
--- /dev/null
+++ b/src/js/types/merge-pdf-type.ts
@@ -0,0 +1,5 @@
+export interface MergeState {
+    files: File[];
+    pdfBytes: Map<string, ArrayBuffer>;
+    pdfDocs: Map<string, any>;
+}
diff --git a/src/js/types/n-up-pdf-type.ts b/src/js/types/n-up-pdf-type.ts
new file mode 100644
index 0000000..c43d1c3
--- /dev/null
+++ b/src/js/types/n-up-pdf-type.ts
@@ -0,0 +1,5 @@
+export interface NUpState {
+    file: File | null;
+    pdfBytes: ArrayBuffer | null;
+    totalPages: number;
+}
diff --git a/src/js/types/ocr-pdf-type.ts b/src/js/types/ocr-pdf-type.ts
new file mode 100644
index 0000000..b1ef7e4
--- /dev/null
+++ b/src/js/types/ocr-pdf-type.ts
@@ -0,0 +1,10 @@
+export interface OcrWord {
+    text: string;
+    bbox: { x0: number; y0: number; x1: number; y1: number };
+    confidence: number;
+}
+
+export interface OcrState {
+    file: File | null;
+    searchablePdfBytes: Uint8Array | null;
+}
diff --git a/src/js/types/ocr.ts b/src/js/types/ocr-type.ts
similarity index 100%
rename from src/js/types/ocr.ts
rename to src/js/types/ocr-type.ts
diff --git a/src/js/types/organize-pdf-type.ts b/src/js/types/organize-pdf-type.ts
new file mode 100644
index 0000000..c12a9bf
--- /dev/null
+++ b/src/js/types/organize-pdf-type.ts
@@ -0,0 +1,6 @@
+export interface OrganizeState {
+    file: File | null;
+    pdfBytes: ArrayBuffer | null;
+    totalPages: number;
+    pageOrder: number[];
+}
diff --git a/src/js/types/page-dimensions-type.ts b/src/js/types/page-dimensions-type.ts
new file mode 100644
index 0000000..9cdccd5
--- /dev/null
+++ b/src/js/types/page-dimensions-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument } from 'pdf-lib';
+
+export interface PageDimensionsState {
+    file: File | null;
+    pdfDoc: PDFDocument | null;
+}
diff --git a/src/js/types/page-numbers-type.ts b/src/js/types/page-numbers-type.ts
new file mode 100644
index 0000000..30fc880
--- /dev/null
+++ b/src/js/types/page-numbers-type.ts
@@ -0,0 +1,3 @@
+export interface PageNumbersState {
+    file: File | null;
+}
diff --git a/src/js/types/pdf-booklet-type.ts b/src/js/types/pdf-booklet-type.ts
new file mode 100644
index 0000000..b2c7fcc
--- /dev/null
+++ b/src/js/types/pdf-booklet-type.ts
@@ -0,0 +1,5 @@
+export interface BookletState {
+    file: File | null;
+    pdfBytes: ArrayBuffer | null;
+    totalPages: number;
+}
diff --git a/src/js/types/pdf-layers-type.ts b/src/js/types/pdf-layers-type.ts
new file mode 100644
index 0000000..82a485d
--- /dev/null
+++ b/src/js/types/pdf-layers-type.ts
@@ -0,0 +1,5 @@
+export interface LayerData {
+    name: string;
+    visible: boolean;
+    locked: boolean;
+}
diff --git a/src/js/types/pdf-multi-tool-type.ts b/src/js/types/pdf-multi-tool-type.ts
new file mode 100644
index 0000000..69580df
--- /dev/null
+++ b/src/js/types/pdf-multi-tool-type.ts
@@ -0,0 +1,10 @@
+export interface MultiToolPageData {
+    id: string;
+    originalPdfId: string;
+    pageIndex: number;
+    thumbnail: string;
+    width: number;
+    height: number;
+    rotation: number;
+    isBlank?: boolean;
+}
diff --git a/src/js/types/pdf-to-zip-type.ts b/src/js/types/pdf-to-zip-type.ts
new file mode 100644
index 0000000..4c4a5de
--- /dev/null
+++ b/src/js/types/pdf-to-zip-type.ts
@@ -0,0 +1,3 @@
+export interface PdfToZipState {
+    files: File[];
+}
diff --git a/src/js/types/posterize-type.ts b/src/js/types/posterize-type.ts
new file mode 100644
index 0000000..031c046
--- /dev/null
+++ b/src/js/types/posterize-type.ts
@@ -0,0 +1,9 @@
+import * as pdfjsLib from 'pdfjs-dist';
+
+export interface PosterizeState {
+    file: File | null;
+    pdfJsDoc: pdfjsLib.PDFDocumentProxy | null;
+    pdfBytes: Uint8Array | null;
+    pageSnapshots: Record<number, ImageData>;
+    currentPage: number;
+}
diff --git a/src/js/types/remove-metadata-type.ts b/src/js/types/remove-metadata-type.ts
new file mode 100644
index 0000000..52dc35a
--- /dev/null
+++ b/src/js/types/remove-metadata-type.ts
@@ -0,0 +1,3 @@
+export interface RemoveMetadataState {
+    file: File | null;
+}
diff --git a/src/js/types/remove-restrictions-type.ts b/src/js/types/remove-restrictions-type.ts
new file mode 100644
index 0000000..772cc00
--- /dev/null
+++ b/src/js/types/remove-restrictions-type.ts
@@ -0,0 +1,3 @@
+export interface RemoveRestrictionsState {
+    file: File | null;
+}
diff --git a/src/js/types/reverse-pages-type.ts b/src/js/types/reverse-pages-type.ts
new file mode 100644
index 0000000..02a7840
--- /dev/null
+++ b/src/js/types/reverse-pages-type.ts
@@ -0,0 +1,5 @@
+export interface ReverseState {
+    file: File | null;
+    pdfBytes: ArrayBuffer | null;
+    totalPages: number;
+}
diff --git a/src/js/types/rotate-pdf-type.ts b/src/js/types/rotate-pdf-type.ts
new file mode 100644
index 0000000..01ec6ed
--- /dev/null
+++ b/src/js/types/rotate-pdf-type.ts
@@ -0,0 +1,6 @@
+export interface RotateState {
+    file: File | null;
+    pdfBytes: ArrayBuffer | null;
+    totalPages: number;
+    pageRotations: Map<number, number>;
+}
diff --git a/src/js/types/sanitize-pdf-type.ts b/src/js/types/sanitize-pdf-type.ts
new file mode 100644
index 0000000..0da485c
--- /dev/null
+++ b/src/js/types/sanitize-pdf-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument } from 'pdf-lib';
+
+export interface SanitizePdfState {
+    file: File | null;
+    pdfDoc: PDFDocument | null;
+}
diff --git a/src/js/types/sign-pdf-type.ts b/src/js/types/sign-pdf-type.ts
new file mode 100644
index 0000000..3085770
--- /dev/null
+++ b/src/js/types/sign-pdf-type.ts
@@ -0,0 +1,5 @@
+export interface SignPdfState {
+    file: File | null;
+    pdfBytes: ArrayBuffer | null;
+    signatureData: string | null;
+}
diff --git a/src/js/types/table-of-contents-type.ts b/src/js/types/table-of-contents-type.ts
new file mode 100644
index 0000000..407ddbd
--- /dev/null
+++ b/src/js/types/table-of-contents-type.ts
@@ -0,0 +1,18 @@
+export interface GenerateTOCMessage {
+    type: 'generateTOC';
+    pdfBytes: ArrayBuffer;
+    title: string;
+    headerColor: string;
+    fontColor: string;
+    fontSize: number;
+}
+
+export interface TOCSuccessResponse {
+    type: 'success';
+    pdfBytes: ArrayBuffer;
+}
+
+export interface TOCErrorResponse {
+    type: 'error';
+    message: string;
+}
diff --git a/src/js/types/text-color-type.ts b/src/js/types/text-color-type.ts
new file mode 100644
index 0000000..fe451b9
--- /dev/null
+++ b/src/js/types/text-color-type.ts
@@ -0,0 +1,6 @@
+import { PDFDocument as PDFLibDocument } from 'pdf-lib';
+
+export interface TextColorState {
+    file: File | null;
+    pdfDoc: PDFLibDocument | null;
+}
diff --git a/src/js/types/validate-signature-type.ts b/src/js/types/validate-signature-type.ts
new file mode 100644
index 0000000..4633848
--- /dev/null
+++ b/src/js/types/validate-signature-type.ts
@@ -0,0 +1,47 @@
+import forge from 'node-forge';
+
+export interface SignatureValidationResult {
+    signatureIndex: number;
+    isValid: boolean;
+    signerName: string;
+    signerOrg?: string;
+    signerEmail?: string;
+    issuer: string;
+    issuerOrg?: string;
+    signatureDate?: Date;
+    validFrom: Date;
+    validTo: Date;
+    isExpired: boolean;
+    isSelfSigned: boolean;
+    isTrusted: boolean;
+    algorithms: {
+        digest: string;
+        signature: string;
+    };
+    serialNumber: string;
+    reason?: string;
+    location?: string;
+    contactInfo?: string;
+    byteRange?: number[];
+    coverageStatus: 'full' | 'partial' | 'unknown';
+    errorMessage?: string;
+}
+
+export interface ExtractedSignature {
+    index: number;
+    contents: Uint8Array;
+    byteRange: number[];
+    reason?: string;
+    location?: string;
+    contactInfo?: string;
+    name?: string;
+    signingTime?: string;
+}
+
+export interface ValidateSignatureState {
+    pdfFile: File | null;
+    pdfBytes: Uint8Array | null;
+    results: SignatureValidationResult[];
+    trustedCertFile: File | null;
+    trustedCert: forge.pki.Certificate | null;
+}
diff --git a/src/js/types/view-metadata-type.ts b/src/js/types/view-metadata-type.ts
new file mode 100644
index 0000000..8da1ce0
--- /dev/null
+++ b/src/js/types/view-metadata-type.ts
@@ -0,0 +1,4 @@
+export interface ViewMetadataState {
+    file: File | null;
+    metadata: Record<string, unknown>;
+}
diff --git a/src/js/ui.ts b/src/js/ui.ts
index b13d10d..427dbdb 100644
--- a/src/js/ui.ts
+++ b/src/js/ui.ts
@@ -306,19 +306,19 @@ export const renderPageThumbnails = async (toolId: any, pdfDoc: any) => {
             // Event Listeners
             decrementBtn.addEventListener('click', (e) => {
                 e.stopPropagation();
-                let current = parseInt(angleInput.value) || 0;
+                const current = parseInt(angleInput.value) || 0;
                 updateRotation(current - 1);
             });
 
             incrementBtn.addEventListener('click', (e) => {
                 e.stopPropagation();
-                let current = parseInt(angleInput.value) || 0;
+                const current = parseInt(angleInput.value) || 0;
                 updateRotation(current + 1);
             });
 
             angleInput.addEventListener('change', (e) => {
                 e.stopPropagation();
-                let val = parseInt((e.target as HTMLInputElement).value) || 0;
+                const val = parseInt((e.target as HTMLInputElement).value) || 0;
                 updateRotation(val);
             });
             angleInput.addEventListener('click', (e) => e.stopPropagation());
@@ -331,7 +331,7 @@ export const renderPageThumbnails = async (toolId: any, pdfDoc: any) => {
             rotateBtn.innerHTML = '<i data-lucide="rotate-cw" class="w-4 h-4"></i>';
             rotateBtn.addEventListener('click', (e) => {
                 e.stopPropagation();
-                let current = parseInt(angleInput.value) || 0;
+                const current = parseInt(angleInput.value) || 0;
                 updateRotation(current + 90);
             });
 
diff --git a/src/js/utils/full-width.ts b/src/js/utils/full-width.ts
index efc5c89..4a07d68 100644
--- a/src/js/utils/full-width.ts
+++ b/src/js/utils/full-width.ts
@@ -2,7 +2,7 @@
 // This script applies the full-width preference from localStorage to page uploaders
 
 export function initFullWidthMode() {
-    const savedFullWidth = localStorage.getItem('fullWidthMode') === 'true';
+    const savedFullWidth = localStorage.getItem('fullWidthMode') !== 'false';
 
     if (savedFullWidth) {
         applyFullWidthMode(true);
diff --git a/src/js/utils/libreoffice-loader.ts b/src/js/utils/libreoffice-loader.ts
index a0083d3..54b5b73 100644
--- a/src/js/utils/libreoffice-loader.ts
+++ b/src/js/utils/libreoffice-loader.ts
@@ -6,7 +6,8 @@
  */
 
 import { WorkerBrowserConverter } from '@matbee/libreoffice-converter/browser';
-import { getWasmBaseUrl } from '../config/wasm-cdn-config.js';
+
+const LIBREOFFICE_LOCAL_PATH = import.meta.env.BASE_URL + 'libreoffice-wasm/';
 
 export interface LoadProgress {
     phase: 'loading' | 'initializing' | 'converting' | 'complete' | 'ready';
@@ -26,8 +27,7 @@ export class LibreOfficeConverter {
     private basePath: string;
 
     constructor(basePath?: string) {
-        // Use CDN if available, otherwise use provided basePath or default local path
-        this.basePath = basePath || getWasmBaseUrl('libreoffice');
+        this.basePath = basePath || LIBREOFFICE_LOCAL_PATH;
     }
 
     async initialize(onProgress?: ProgressCallback): Promise<void> {
diff --git a/src/js/utils/simple-mode-footer.ts b/src/js/utils/simple-mode-footer.ts
index f2a1658..53edb27 100644
--- a/src/js/utils/simple-mode-footer.ts
+++ b/src/js/utils/simple-mode-footer.ts
@@ -19,7 +19,7 @@ if (__SIMPLE_MODE__) {
               <span class="text-white font-bold text-lg">BentoPDF</span>
             </div>
             <p class="text-gray-400 text-sm">
-              &copy; 2025 BentoPDF. All rights reserved.
+              &copy; 2026 BentoPDF. All rights reserved.
             </p>
             <p class="text-gray-500 text-xs mt-2">
               Version <span id="app-version-simple">${APP_VERSION}</span>
diff --git a/src/pages/.backup-related-tools-fix/compress-pdf.html b/src/pages/.backup-related-tools-fix/compress-pdf.html
index 661a839..99e56c6 100644
--- a/src/pages/.backup-related-tools-fix/compress-pdf.html
+++ b/src/pages/.backup-related-tools-fix/compress-pdf.html
@@ -57,7 +57,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -109,7 +109,8 @@
                 <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
             </button>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:compressPdf.name">Compress PDF Free Online - Reduce File Size Fast</h1>
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:compressPdf.name">Compress PDF Free Online -
+                Reduce File Size Fast</h1>
             <p class="text-gray-400 mb-6" data-i18n="tools:compressPdf.subtitle">
                 Reduce file size by choosing the compression method that best suits your document. Supports multiple
                 PDFs.
@@ -263,123 +264,138 @@
         </div>
     </div>
 
-    
-  <!-- How It Works Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
-    <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload PDFs</h3>
-            <p class="text-gray-400">Click or drag and drop one or more PDF files</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Choose Algorithm</h3>
-            <p class="text-gray-400">Select Condense (recommended) or Photon (for photo-heavy PDFs)</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Select Compression Level</h3>
-            <p class="text-gray-400">Pick Light, Balanced, Aggressive, or Extreme compression</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Customize & Compress</h3>
-            <p class="text-gray-400">Optionally enable grayscale or custom settings, then compress</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            5
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your compressed PDFs - up to 90% smaller</p>
-          </div>
-        </div>
-    </div>
-  </section>
 
-  <!-- Related Tools Section -->
-  <section class="max-w-6xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
-    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/split-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/optimize-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Optimize Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online optimize pdf tool</p>
-        </a>
-        <a href="/pdf-to-jpg" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Jpg</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to jpg tool</p>
-        </a>
-        <a href="/reduce-pdf-size" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Reduce Pdf Size</h3>
-          <p class="text-gray-400 text-sm">Free online reduce pdf size tool</p>
-        </a>
-    </div>
-  </section>
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload PDFs</h3>
+                    <p class="text-gray-400">Click or drag and drop one or more PDF files</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Choose Algorithm</h3>
+                    <p class="text-gray-400">Select Condense (recommended) or Photon (for photo-heavy PDFs)</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Select Compression Level</h3>
+                    <p class="text-gray-400">Pick Light, Balanced, Aggressive, or Extreme compression</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    4
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Customize & Compress</h3>
+                    <p class="text-gray-400">Optionally enable grayscale or custom settings, then compress</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    5
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+                    <p class="text-gray-400">Save your compressed PDFs - up to 90% smaller</p>
+                </div>
+            </div>
+        </div>
+    </section>
 
-  <!-- FAQ Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-    <div class="space-y-4">
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          What's the difference between Condense and Photon?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Condense removes dead-weight, optimizes images, and subsets fonts - best for most PDFs. Photon converts pages to images - ideal for photo-heavy/scanned PDFs but makes text non-selectable.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Which compression level should I use?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Balanced (recommended) offers great size reduction with minimal quality loss. Use Light to preserve maximum quality, Aggressive for smaller files, or Extreme for maximum compression.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Are there file size limits?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">No limits! Compress as many PDFs as you need, of any size, completely free.</p>
-      </details>
-    </div>
-  </section>
-  <footer class="mt-16 border-t-2 border-gray-700 py-8">
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/merge-pdf"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+            </a>
+            <a href="/split-pdf"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+            </a>
+            <a href="/optimize-pdf"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Optimize Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online optimize pdf tool</p>
+            </a>
+            <a href="/pdf-to-jpg"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Pdf To Jpg</h3>
+                <p class="text-gray-400 text-sm">Free online pdf to jpg tool</p>
+            </a>
+            <a href="/reduce-pdf-size"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Reduce Pdf Size</h3>
+                <p class="text-gray-400 text-sm">Free online reduce pdf size tool</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    What's the difference between Condense and Photon?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Condense removes dead-weight, optimizes images, and subsets fonts - best
+                    for most PDFs. Photon converts pages to images - ideal for photo-heavy/scanned PDFs but makes text
+                    non-selectable.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Which compression level should I use?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Balanced (recommended) offers great size reduction with minimal quality
+                    loss. Use Light to preserve maximum quality, Aggressive for smaller files, or Extreme for maximum
+                    compression.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Are there file size limits?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No limits! Compress as many PDFs as you need, of any size, completely
+                    free.</p>
+            </details>
+        </div>
+    </section>
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
                     <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
+                        &copy; 2026 BentoPDF. All rights reserved.
                     </p>
                     <p class="text-gray-500 text-xs mt-2">
                         Version <span id="app-version"></span>
diff --git a/src/pages/.backup-related-tools-fix/edit-pdf.html b/src/pages/.backup-related-tools-fix/edit-pdf.html
index 5af98e2..296995a 100644
--- a/src/pages/.backup-related-tools-fix/edit-pdf.html
+++ b/src/pages/.backup-related-tools-fix/edit-pdf.html
@@ -2,195 +2,199 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Edit PDF Online Free - Edit PDF Tool | BentoPDF</title>
   <meta name="title" content="Edit PDF Online Free - Edit PDF Tool | BentoPDF">
-  <meta name="description" content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="edit pdf, pdf editor, modify pdf, change pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/edit-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/edit-pdf">
   <meta property="og:title" content="Edit PDF Online Free - Edit PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-edit-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/edit-pdf">
   <meta name="twitter:title" content="Edit PDF Free">
-  <meta name="twitter:description" content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secu">
+  <meta name="twitter:description"
+    content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secu">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-edit-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Edit PDF">
-  
 
-    <title>PDF Editor - BentoPDF</title>
-    <meta name="description"
-        content="Annotate, highlight, redact, comment, add shapes/images, search, and view PDFs. Free, secure, and runs entirely in your browser.">
-    <link rel="icon" type="image/png" href="/images/favicon.svg" />
-    <link rel="alternate" hreflang="en" href="/en/edit-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/edit-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/edit-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/edit-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    <link rel="icon" href="/favicon.ico" sizes="any" />
+
+  <title>PDF Editor - BentoPDF</title>
+  <meta name="description"
+    content="Annotate, highlight, redact, comment, add shapes/images, search, and view PDFs. Free, secure, and runs entirely in your browser.">
+  <link rel="icon" type="image/png" href="/images/favicon.svg" />
+  <link rel="alternate" hreflang="en" href="/en/edit-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/edit-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/edit-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/edit-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+  <link rel="icon" href="/favicon.ico" sizes="any" />
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-blue-400 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfEditor.name">Edit PDF Free Online - Modify PDFs Securely</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfEditor.subtitle">
-                Annotate, highlight, redact, comment, add shapes/images, search, and view PDFs.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="embed-pdf-wrapper" class="hidden mt-6">
-                <div id="embed-pdf-container" class="w-full h-[75vh] border border-gray-600 rounded-lg"></div>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-blue-400 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfEditor.name">Edit PDF Free Online - Modify PDFs
+        Securely</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfEditor.subtitle">
+        Annotate, highlight, redact, comment, add shapes/images, search, and view PDFs.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="embed-pdf-wrapper" class="hidden mt-6">
+        <div id="embed-pdf-container" class="w-full h-[75vh] border border-gray-600 rounded-lg"></div>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -198,26 +202,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/compress-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/merge-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/rotate-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-        <a href="/delete-pages" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
-        <a href="/add-watermark" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Add Watermark</h3>
-          <p class="text-gray-400 text-sm">Free online add watermark tool</p>
-        </a>
+      <a href="/compress-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/merge-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/rotate-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
+      <a href="/delete-pages"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+        <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+      </a>
+      <a href="/add-watermark"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Add Watermark</h3>
+        <p class="text-gray-400 text-sm">Free online add watermark tool</p>
+      </a>
     </div>
   </section>
 
@@ -230,14 +239,16 @@
           Is edit pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -249,96 +260,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/edit-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/edit-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -360,7 +370,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -389,7 +399,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/.backup-related-tools-fix/excel-to-pdf.html b/src/pages/.backup-related-tools-fix/excel-to-pdf.html
index 85aaa1b..e684e77 100644
--- a/src/pages/.backup-related-tools-fix/excel-to-pdf.html
+++ b/src/pages/.backup-related-tools-fix/excel-to-pdf.html
@@ -2,208 +2,212 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Excel to PDF Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="Excel to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="excel to pdf, xlsx to pdf, spreadsheet to pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/excel-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/excel-to-pdf">
   <meta property="og:title" content="Excel to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-excel-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/excel-to-pdf">
   <meta name="twitter:title" content="Excel to PDF Free">
-  <meta name="twitter:description" content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
+  <meta name="twitter:description"
+    content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-excel-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Excel to PDF">
-  
 
-    <title>Excel to PDF - Convert XLSX, XLS to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Excel spreadsheets (XLSX, XLS, ODS, CSV) to PDF format. Free, secure, and runs entirely in your browser.">
-    <link rel="icon" type="image/png" href="/images/favicon.svg" />
-    <link rel="alternate" hreflang="en" href="/en/excel-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/excel-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/excel-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/excel-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    <link rel="icon" href="/favicon.ico" sizes="any" />
+
+  <title>Excel to PDF - Convert XLSX, XLS to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Excel spreadsheets (XLSX, XLS, ODS, CSV) to PDF format. Free, secure, and runs entirely in your browser.">
+  <link rel="icon" type="image/png" href="/images/favicon.svg" />
+  <link rel="alternate" hreflang="en" href="/en/excel-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/excel-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/excel-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/excel-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+  <link rel="icon" href="/favicon.ico" sizes="any" />
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:excelToPdf.name">Excel to PDF Converter Free - Convert XLSX Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:excelToPdf.subtitle">
-                Convert Excel spreadsheets (XLSX, XLS, ODS, CSV) to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:excelToPdf.acceptedFormats">XLSX, XLS, ODS, CSV
-                        files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".xls,.xlsx,.ods,.csv,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.oasis.opendocument.spreadsheet,text/csv"
-                    multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:excelToPdf.convertButton">Convert
-                    to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:excelToPdf.name">Excel to PDF Converter Free -
+        Convert XLSX Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:excelToPdf.subtitle">
+        Convert Excel spreadsheets (XLSX, XLS, ODS, CSV) to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:excelToPdf.acceptedFormats">XLSX, XLS, ODS, CSV
+            files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".xls,.xlsx,.ods,.csv,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.oasis.opendocument.spreadsheet,text/csv"
+          multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:excelToPdf.convertButton">Convert
+          to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -211,26 +215,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/pdf-to-excel" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Excel</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to excel tool</p>
-        </a>
-        <a href="/word-to-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Word To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online word to pdf tool</p>
-        </a>
-        <a href="/csv-to-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Csv To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online csv to pdf tool</p>
-        </a>
-        <a href="/merge-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
+      <a href="/pdf-to-excel"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Excel</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to excel tool</p>
+      </a>
+      <a href="/word-to-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Word To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online word to pdf tool</p>
+      </a>
+      <a href="/csv-to-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Csv To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online csv to pdf tool</p>
+      </a>
+      <a href="/merge-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -243,14 +252,16 @@
           Is excel to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -262,96 +273,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/excel-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/excel-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -373,7 +383,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -402,7 +412,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/.backup-related-tools-fix/merge-pdf.html b/src/pages/.backup-related-tools-fix/merge-pdf.html
index 76ca77c..3d6f924 100644
--- a/src/pages/.backup-related-tools-fix/merge-pdf.html
+++ b/src/pages/.backup-related-tools-fix/merge-pdf.html
@@ -56,7 +56,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -111,7 +111,8 @@
         <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
       </button>
 
-      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:mergePdf.name">Merge PDF Files Free - Combine PDFs Instantly</h1>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:mergePdf.name">Merge PDF Files Free - Combine PDFs
+        Instantly</h1>
       <p class="text-gray-400 mb-6" data-i18n="tools:mergePdf.subtitle">
         Combine whole files, or select specific pages to merge into a new document.
       </p>
@@ -206,47 +207,51 @@
     </div>
   </div>
 
-  
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload PDFs</h3>
-            <p class="text-gray-400">Select or drag and drop multiple PDF files you want to merge</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Arrange Order</h3>
-            <p class="text-gray-400">Drag files up or down to reorder them in your preferred sequence</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload PDFs</h3>
+          <p class="text-gray-400">Select or drag and drop multiple PDF files you want to merge</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Merge Files</h3>
-            <p class="text-gray-400">Click the merge button to combine all PDFs into a single document</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your merged PDF - all pages combined in the order you chose</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Arrange Order</h3>
+          <p class="text-gray-400">Drag files up or down to reorder them in your preferred sequence</p>
         </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Merge Files</h3>
+          <p class="text-gray-400">Click the merge button to combine all PDFs into a single document</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          4
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your merged PDF - all pages combined in the order you chose</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -254,26 +259,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/split-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/organize-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
-        </a>
-        <a href="/compress-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/rotate-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-        <a href="/delete-pages" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
+      <a href="/split-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/organize-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
+      </a>
+      <a href="/compress-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/rotate-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
+      <a href="/delete-pages"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+        <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+      </a>
     </div>
   </section>
 
@@ -286,21 +296,24 @@
           How many PDFs can I merge at once?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Unlimited! Merge as many PDF files as you need in a single operation. No restrictions on file count or total size.</p>
+        <p class="mt-3 text-gray-400">Unlimited! Merge as many PDF files as you need in a single operation. No
+          restrictions on file count or total size.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Will merging reduce PDF quality?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">No! BentoPDF preserves the original quality of all PDFs when merging. Your documents remain crisp and clear with no quality loss.</p>
+        <p class="mt-3 text-gray-400">No! BentoPDF preserves the original quality of all PDFs when merging. Your
+          documents remain crisp and clear with no quality loss.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Can I reorder pages after selecting files?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! Simply drag and drop files to arrange them in any order before clicking the merge button.</p>
+        <p class="mt-3 text-gray-400">Yes! Simply drag and drop files to arrange them in any order before clicking the
+          merge button.</p>
       </details>
     </div>
   </section>
@@ -309,11 +322,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
diff --git a/src/pages/.backup-related-tools-fix/organize-pdf.html b/src/pages/.backup-related-tools-fix/organize-pdf.html
index 1c263eb..01ed82f 100644
--- a/src/pages/.backup-related-tools-fix/organize-pdf.html
+++ b/src/pages/.backup-related-tools-fix/organize-pdf.html
@@ -2,164 +2,170 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Organize PDF Online Free - Organize PDF Tool | BentoPDF</title>
   <meta name="title" content="Organize PDF Online Free - Organize PDF Tool | BentoPDF">
-  <meta name="description" content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="organize pdf, reorder pages, arrange pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/organize-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/organize-pdf">
   <meta property="og:title" content="Organize PDF Online Free - Organize PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-organize-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/organize-pdf">
   <meta name="twitter:title" content="Organize PDF Free">
-  <meta name="twitter:description" content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-organize-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Organize PDF">
-  
 
-    <title>Duplicate and Organize PDF Pages - BentoPDF</title>
-    <meta name="description" content="Reorder, duplicate, and organize PDF pages. Free and secure.">
-    <link rel="icon" type="image/png" href="/images/favicon.svg" />
-    <link rel="alternate" hreflang="en" href="/en/organize-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/organize-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/organize-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/organize-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    <link rel="icon" href="/favicon.ico" sizes="any" />
+
+  <title>Duplicate and Organize PDF Pages - BentoPDF</title>
+  <meta name="description" content="Reorder, duplicate, and organize PDF pages. Free and secure.">
+  <link rel="icon" type="image/png" href="/images/favicon.svg" />
+  <link rel="alternate" hreflang="en" href="/en/organize-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/organize-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/organize-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/organize-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+  <link rel="icon" href="/favicon.ico" sizes="any" />
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer">Back to Tools</span>
-            </button>
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:duplicateOrganize.name">Organize PDF Pages Free - Reorder PDFs Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:duplicateOrganize.subtitle">
-                Drag pages to reorder them. Use the <i data-lucide="copy-plus"
-                    class="inline-block w-4 h-4 mx-1 align-text-bottom text-green-500"></i> icon to duplicate a page or
-                the <i data-lucide="x-circle" class="inline-block w-4 h-4 mx-1 align-text-bottom text-red-400"></i> icon
-                to
-                delete it.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF Documents</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <!-- File Display -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Page Grid (shown after file upload) -->
-            <div id="page-grid" class="hidden grid grid-cols-3 sm:grid-cols-4 md:grid-cols-6 gap-4 my-6"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6">Save Changes</button>
-        </div>
-    </div>
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
-    </div>
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg"
-                data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
+      </div>
     </div>
+  </nav>
+
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer">Back to Tools</span>
+      </button>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:duplicateOrganize.name">Organize PDF Pages Free -
+        Reorder PDFs Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:duplicateOrganize.subtitle">
+        Drag pages to reorder them. Use the <i data-lucide="copy-plus"
+          class="inline-block w-4 h-4 mx-1 align-text-bottom text-green-500"></i> icon to duplicate a page or
+        the <i data-lucide="x-circle" class="inline-block w-4 h-4 mx-1 align-text-bottom text-red-400"></i> icon
+        to
+        delete it.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF Documents</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
+        </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <!-- File Display -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Page Grid (shown after file upload) -->
+      <div id="page-grid" class="hidden grid grid-cols-3 sm:grid-cols-4 md:grid-cols-6 gap-4 my-6"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6">Save Changes</button>
+    </div>
+  </div>
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg"
+        data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -167,26 +173,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/split-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/rotate-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-        <a href="/delete-pages" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
-        <a href="/extract-pages" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
-          <p class="text-gray-400 text-sm">Free online extract pages tool</p>
-        </a>
+      <a href="/merge-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/split-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/rotate-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
+      <a href="/delete-pages"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+        <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+      </a>
+      <a href="/extract-pages"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
+        <p class="text-gray-400 text-sm">Free online extract pages tool</p>
+      </a>
     </div>
   </section>
 
@@ -199,14 +210,16 @@
           Is organize pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -218,80 +231,79 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/organize-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/organize-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -313,7 +325,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -342,7 +354,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/.backup-related-tools-fix/pdf-to-docx.html b/src/pages/.backup-related-tools-fix/pdf-to-docx.html
index 9270012..3f95541 100644
--- a/src/pages/.backup-related-tools-fix/pdf-to-docx.html
+++ b/src/pages/.backup-related-tools-fix/pdf-to-docx.html
@@ -2,203 +2,207 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>PDF to Word Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="PDF to Word Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to word, pdf to docx, convert pdf to word">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-docx">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-docx">
   <meta property="og:title" content="PDF to Word Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-docx.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-docx">
   <meta name="twitter:title" content="PDF to Word Free">
-  <meta name="twitter:description" content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-docx.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="PDF to Word">
-  
 
-    <title>PDF to DOCX - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF files to editable Word documents (DOCX). Free, secure, and runs entirely in your browser.">
-    <link rel="icon" type="image/png" href="/images/favicon.svg" />
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-docx.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-docx.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    <link rel="icon" href="/favicon.ico" sizes="any" />
+
+  <title>PDF to DOCX - BentoPDF</title>
+  <meta name="description"
+    content="Convert PDF files to editable Word documents (DOCX). Free, secure, and runs entirely in your browser.">
+  <link rel="icon" type="image/png" href="/images/favicon.svg" />
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-docx.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-docx.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+  <link rel="icon" href="/favicon.ico" sizes="any" />
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools">Back to Tools</span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">PDF to Word Converter Free - Convert PDF to DOCX</h1>
-            <p class="text-gray-400 mb-6">
-                Convert PDF files to editable Word documents. Preserves text, formatting, and layout.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span>
-                        <span data-i18n="upload.orDragAndDrop">or drag and drop</span>
-                    </p>
-                    <p class="text-xs text-gray-500">One or more PDF files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6 space-y-6">
-                <button id="process-btn" class="btn-gradient w-full mt-4">Convert to DOCX</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools">Back to Tools</span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">PDF to Word Converter Free - Convert PDF to DOCX</h1>
+      <p class="text-gray-400 mb-6">
+        Convert PDF files to editable Word documents. Preserves text, formatting, and layout.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span>
+            <span data-i18n="upload.orDragAndDrop">or drag and drop</span>
+          </p>
+          <p class="text-xs text-gray-500">One or more PDF files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6 space-y-6">
+        <button id="process-btn" class="btn-gradient w-full mt-4">Convert to DOCX</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -206,26 +210,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/word-to-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Word To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online word to pdf tool</p>
-        </a>
-        <a href="/pdf-to-text" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Text</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to text tool</p>
-        </a>
-        <a href="/pdf-to-excel" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Excel</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to excel tool</p>
-        </a>
-        <a href="/edit-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/extract-pages" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
-          <p class="text-gray-400 text-sm">Free online extract pages tool</p>
-        </a>
+      <a href="/word-to-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Word To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online word to pdf tool</p>
+      </a>
+      <a href="/pdf-to-text"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Text</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to text tool</p>
+      </a>
+      <a href="/pdf-to-excel"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Excel</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to excel tool</p>
+      </a>
+      <a href="/edit-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/extract-pages"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
+        <p class="text-gray-400 text-sm">Free online extract pages tool</p>
+      </a>
     </div>
   </section>
 
@@ -238,14 +247,16 @@
           Is pdf to docx really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -257,96 +268,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-docx-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-docx-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -368,7 +378,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -397,7 +407,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/.backup-related-tools-fix/pdf-to-jpg.html b/src/pages/.backup-related-tools-fix/pdf-to-jpg.html
index 5db96d7..f4a8ff1 100644
--- a/src/pages/.backup-related-tools-fix/pdf-to-jpg.html
+++ b/src/pages/.backup-related-tools-fix/pdf-to-jpg.html
@@ -2,213 +2,217 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>PDF to JPG Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="PDF to JPG Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to jpg, pdf to image, pdf to jpeg, convert pdf to pictures">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-jpg">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-jpg">
   <meta property="og:title" content="PDF to JPG Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-jpg.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-jpg">
   <meta name="twitter:title" content="PDF to JPG Free">
-  <meta name="twitter:description" content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
+  <meta name="twitter:description"
+    content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-jpg.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="PDF to JPG">
-  
 
-    <title>PDF to JPG - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF pages to JPG images. Free, secure, and runs entirely in your browser.">
-    <link rel="icon" type="image/png" href="/images/favicon.svg" />
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-jpg.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-jpg.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-jpg.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-jpg.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    <link rel="icon" href="/favicon.ico" sizes="any" />
+
+  <title>PDF to JPG - BentoPDF</title>
+  <meta name="description" content="Convert PDF pages to JPG images. Free, secure, and runs entirely in your browser.">
+  <link rel="icon" type="image/png" href="/images/favicon.svg" />
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-jpg.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-jpg.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-jpg.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-jpg.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+  <link rel="icon" href="/favicon.ico" sizes="any" />
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToJpg.name">PDF to JPG Converter Free - Convert PDF to Images</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToJpg.subtitle">
-                Convert each page of a PDF file into a high-quality JPG image.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="jpg-quality" class="block mb-2 text-sm font-medium text-gray-300">Image Quality</label>
-                    <div class="flex items-center gap-4">
-                        <input type="range" id="jpg-quality" min="0.1" max="1.0" step="0.01" value="0.9" class="flex-1">
-                        <span id="jpg-quality-value" class="text-white font-medium w-16 text-right">90%</span>
-                    </div>
-                    <p class="mt-1 text-xs text-gray-400">Higher quality = larger file size</p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToJpg.name">PDF to JPG Converter Free - Convert
+        PDF to Images</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToJpg.subtitle">
+        Convert each page of a PDF file into a high-quality JPG image.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="jpg-quality" class="block mb-2 text-sm font-medium text-gray-300">Image Quality</label>
+          <div class="flex items-center gap-4">
+            <input type="range" id="jpg-quality" min="0.1" max="1.0" step="0.01" value="0.9" class="flex-1">
+            <span id="jpg-quality-value" class="text-white font-medium w-16 text-right">90%</span>
+          </div>
+          <p class="mt-1 text-xs text-gray-400">Higher quality = larger file size</p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
-            <p class="text-gray-400">Select the PDF file you want to convert to images</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Choose Quality</h3>
-            <p class="text-gray-400">Select image quality (Low, Medium, High, Maximum)</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
+          <p class="text-gray-400">Select the PDF file you want to convert to images</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Select Pages</h3>
-            <p class="text-gray-400">Convert all pages or choose specific pages to extract</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download Images</h3>
-            <p class="text-gray-400">Save JPG images individually or as a ZIP archive</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Choose Quality</h3>
+          <p class="text-gray-400">Select image quality (Low, Medium, High, Maximum)</p>
         </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Select Pages</h3>
+          <p class="text-gray-400">Convert all pages or choose specific pages to extract</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          4
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download Images</h3>
+          <p class="text-gray-400">Save JPG images individually or as a ZIP archive</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -216,26 +220,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/pdf-to-png" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Png</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to png tool</p>
-        </a>
-        <a href="/compress-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/pdf-to-webp" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Webp</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to webp tool</p>
-        </a>
-        <a href="/extract-images" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Extract Images</h3>
-          <p class="text-gray-400 text-sm">Free online extract images tool</p>
-        </a>
+      <a href="/pdf-to-png"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Png</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to png tool</p>
+      </a>
+      <a href="/compress-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/pdf-to-webp"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Webp</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to webp tool</p>
+      </a>
+      <a href="/extract-images"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Extract Images</h3>
+        <p class="text-gray-400 text-sm">Free online extract images tool</p>
+      </a>
     </div>
   </section>
 
@@ -248,103 +257,105 @@
           What quality should I choose?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Use High or Maximum for print-quality images, Medium for web use, or Low to save disk space. Higher quality produces larger file sizes.</p>
+        <p class="mt-3 text-gray-400">Use High or Maximum for print-quality images, Medium for web use, or Low to save
+          disk space. Higher quality produces larger file sizes.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Can I convert specific pages only?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! You can choose to convert all pages or select specific pages you want as JPG images.</p>
+        <p class="mt-3 text-gray-400">Yes! You can choose to convert all pages or select specific pages you want as JPG
+          images.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are the JPG files compressed?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes, JPG is a compressed format. You control the quality level - higher quality means less compression and larger files.</p>
+        <p class="mt-3 text-gray-400">Yes, JPG is a compressed format. You control the quality level - higher quality
+          means less compression and larger files.</p>
       </details>
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-jpg-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-jpg-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -366,7 +377,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -395,7 +406,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/.backup-related-tools-fix/rotate-pdf.html b/src/pages/.backup-related-tools-fix/rotate-pdf.html
index ec8c1d9..e496a46 100644
--- a/src/pages/.backup-related-tools-fix/rotate-pdf.html
+++ b/src/pages/.backup-related-tools-fix/rotate-pdf.html
@@ -2,218 +2,221 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Rotate PDF Online Free - Rotate PDF Tool | BentoPDF</title>
   <meta name="title" content="Rotate PDF Online Free - Rotate PDF Tool | BentoPDF">
-  <meta name="description" content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="rotate pdf, turn pdf, flip pdf pages">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/rotate-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/rotate-pdf">
   <meta property="og:title" content="Rotate PDF Online Free - Rotate PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-rotate-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/rotate-pdf">
   <meta name="twitter:title" content="Rotate PDF Free">
-  <meta name="twitter:description" content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
+  <meta name="twitter:description"
+    content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-rotate-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Rotate PDF">
-  
 
-    <title>Rotate PDF - BentoPDF</title>
-    <meta name="description"
-        content="Rotate PDF pages by 90, 180, or 270 degrees. Rotate individual pages or all pages at once. Free, secure, and runs entirely in your browser.">
-    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-    <link rel="icon" type="image/png" href="/images/favicon.png" />
-    <link rel="apple-touch-icon" href="/images/favicon.png" />
-    <link rel="icon" href="/favicon.ico" sizes="any" />
-    <link rel="alternate" hreflang="en" href="/en/rotate-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/rotate-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/rotate-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/rotate-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Rotate PDF - BentoPDF</title>
+  <meta name="description"
+    content="Rotate PDF pages by 90, 180, or 270 degrees. Rotate individual pages or all pages at once. Free, secure, and runs entirely in your browser.">
+  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+  <link rel="icon" type="image/png" href="/images/favicon.png" />
+  <link rel="apple-touch-icon" href="/images/favicon.png" />
+  <link rel="icon" href="/favicon.ico" sizes="any" />
+  <link rel="alternate" hreflang="en" href="/en/rotate-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/rotate-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/rotate-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/rotate-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:rotatePdf.name">Rotate PDF Pages Free - Turn PDFs Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:rotatePdf.subtitle">
-                Rotate individual pages or all pages at once. Click on page thumbnails to rotate them.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <!-- Batch Actions -->
-                <div class="bg-gray-900 rounded-lg border border-gray-700 p-4 mb-4">
-                    <h3 class="text-center text-sm font-semibold text-white mb-4 uppercase tracking-wider">Batch Actions
-                    </h3>
-                    <div class="flex justify-center items-center">
-                        <!-- Rotate by 90 Degrees -->
-                        <div class="flex gap-2">
-                            <button id="rotate-all-left"
-                                class="flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm border border-gray-600">
-                                <i data-lucide="rotate-ccw" class="w-4 h-4"></i> Left
-                            </button>
-                            <button id="rotate-all-right"
-                                class="flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm border border-gray-600">
-                                <i data-lucide="rotate-cw" class="w-4 h-4"></i> Right
-                            </button>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Page Thumbnails -->
-                <div id="page-thumbnails"
-                    class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4 mb-4">
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Apply Rotations</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:rotatePdf.name">Rotate PDF Pages Free - Turn PDFs
+        Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:rotatePdf.subtitle">
+        Rotate individual pages or all pages at once. Click on page thumbnails to rotate them.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <!-- Batch Actions -->
+        <div class="bg-gray-900 rounded-lg border border-gray-700 p-4 mb-4">
+          <h3 class="text-center text-sm font-semibold text-white mb-4 uppercase tracking-wider">Batch Actions
+          </h3>
+          <div class="flex justify-center items-center">
+            <!-- Rotate by 90 Degrees -->
+            <div class="flex gap-2">
+              <button id="rotate-all-left"
+                class="flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm border border-gray-600">
+                <i data-lucide="rotate-ccw" class="w-4 h-4"></i> Left
+              </button>
+              <button id="rotate-all-right"
+                class="flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm border border-gray-600">
+                <i data-lucide="rotate-cw" class="w-4 h-4"></i> Right
+              </button>
+            </div>
+          </div>
+        </div>
+
+        <!-- Page Thumbnails -->
+        <div id="page-thumbnails" class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4 mb-4">
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Apply Rotations</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -221,26 +224,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/split-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/organize-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
-        </a>
-        <a href="/compress-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/delete-pages" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
+      <a href="/merge-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/split-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/organize-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
+      </a>
+      <a href="/compress-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/delete-pages"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+        <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+      </a>
     </div>
   </section>
 
@@ -253,14 +261,16 @@
           Is rotate pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -272,73 +282,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/rotate-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/rotate-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -360,7 +369,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -389,7 +398,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/.backup-related-tools-fix/split-pdf.html b/src/pages/.backup-related-tools-fix/split-pdf.html
index bb9dc28..be22d73 100644
--- a/src/pages/.backup-related-tools-fix/split-pdf.html
+++ b/src/pages/.backup-related-tools-fix/split-pdf.html
@@ -4,41 +4,44 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>Split PDF Online Free - Split PDF Tool | BentoPDF</title>
-  <meta name="title" content="Split PDF Online Free - Split PDF Tool | BentoPDF">
-  <meta name="description" content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta name="keywords" content="split pdf, divide pdf, extract pages, separate pdf">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/split-pdf">
-  
-  <!-- Open Graph / Facebook / LinkedIn -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/split-pdf">
-  <meta property="og:title" content="Split PDF Online Free - Split PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-split-pdf.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:url" content="https://www.bentopdf.com/split-pdf">
-  <meta name="twitter:title" content="Split PDF Free">
-  <meta name="twitter:description" content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & se">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-split-pdf.png">
-  <meta name="twitter:site" content="@BentoPDF">
-  
-  <!-- Mobile Web App -->
-  <meta name="mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-title" content="Split PDF">
-  
+
+    <!-- Primary Meta Tags -->
+    <title>Split PDF Online Free - Split PDF Tool | BentoPDF</title>
+    <meta name="title" content="Split PDF Online Free - Split PDF Tool | BentoPDF">
+    <meta name="description"
+        content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta name="keywords" content="split pdf, divide pdf, extract pages, separate pdf">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/split-pdf">
+
+    <!-- Open Graph / Facebook / LinkedIn -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/split-pdf">
+    <meta property="og:title" content="Split PDF Online Free - Split PDF Tool | BentoPDF">
+    <meta property="og:description"
+        content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-split-pdf.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="https://www.bentopdf.com/split-pdf">
+    <meta name="twitter:title" content="Split PDF Free">
+    <meta name="twitter:description"
+        content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & se">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-split-pdf.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+    <!-- Mobile Web App -->
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Split PDF">
+
 
     <title>Split PDF - BentoPDF</title>
     <meta name="description"
@@ -57,7 +60,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -114,7 +117,8 @@
                 <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
             </button>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:splitPdf.name">Split PDF Online Free - Extract Pages Easily</h1>
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:splitPdf.name">Split PDF Online Free -
+                Extract Pages Easily</h1>
             <p class="text-gray-400 mb-6" data-i18n="tools:splitPdf.subtitle">
                 Extract pages from a PDF using various methods.
             </p>
@@ -281,114 +285,126 @@
         </div>
     </div>
 
-    
-  <!-- How It Works Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
-    <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
-            <p class="text-gray-400">Select the PDF file you want to split or extract pages from</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Choose Split Method</h3>
-            <p class="text-gray-400">Select specific pages, page ranges, or split into individual pages</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Preview & Select</h3>
-            <p class="text-gray-400">View page thumbnails and select exactly which pages you want</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Split & Download</h3>
-            <p class="text-gray-400">Download extracted pages as separate PDFs or as a ZIP file</p>
-          </div>
-        </div>
-    </div>
-  </section>
 
-  <!-- Related Tools Section -->
-  <section class="max-w-6xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
-    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/extract-pages" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
-          <p class="text-gray-400 text-sm">Free online extract pages tool</p>
-        </a>
-        <a href="/organize-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
-        </a>
-        <a href="/compress-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/delete-pages" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
-    </div>
-  </section>
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
+                    <p class="text-gray-400">Select the PDF file you want to split or extract pages from</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Choose Split Method</h3>
+                    <p class="text-gray-400">Select specific pages, page ranges, or split into individual pages</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Preview & Select</h3>
+                    <p class="text-gray-400">View page thumbnails and select exactly which pages you want</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    4
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Split & Download</h3>
+                    <p class="text-gray-400">Download extracted pages as separate PDFs or as a ZIP file</p>
+                </div>
+            </div>
+        </div>
+    </section>
 
-  <!-- FAQ Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-    <div class="space-y-4">
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Can I extract specific page ranges?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Yes! You can extract any specific pages or page ranges from your PDF. Select exactly which pages you need or split into individual files.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Will split PDFs lose quality?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">No! Split PDFs maintain the exact same quality as the original document. No compression or quality loss occurs.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Can I split multiple PDFs at once?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Yes, process multiple PDFs in batches for efficient document management.</p>
-      </details>
-    </div>
-  </section>
-  <footer class="mt-16 border-t-2 border-gray-700 py-8">
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/merge-pdf"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+            </a>
+            <a href="/extract-pages"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
+                <p class="text-gray-400 text-sm">Free online extract pages tool</p>
+            </a>
+            <a href="/organize-pdf"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
+            </a>
+            <a href="/compress-pdf"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+            </a>
+            <a href="/delete-pages"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+                <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Can I extract specific page ranges?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes! You can extract any specific pages or page ranges from your PDF.
+                    Select exactly which pages you need or split into individual files.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Will split PDFs lose quality?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No! Split PDFs maintain the exact same quality as the original document.
+                    No compression or quality loss occurs.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Can I split multiple PDFs at once?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes, process multiple PDFs in batches for efficient document management.
+                </p>
+            </details>
+        </div>
+    </section>
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
                     <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
+                        &copy; 2026 BentoPDF. All rights reserved.
                     </p>
                     <p class="text-gray-500 text-xs mt-2">
                         Version <span id="app-version"></span>
@@ -471,8 +487,8 @@
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
 
-  <!-- JSON-LD Structured Data -->
-  <script type="application/ld+json">
+    <!-- JSON-LD Structured Data -->
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "SoftwareApplication",
@@ -491,8 +507,8 @@
     }
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "HowTo",
@@ -520,8 +536,8 @@
     ]
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "BreadcrumbList",
diff --git a/src/pages/.backup-related-tools-fix/word-to-pdf.html b/src/pages/.backup-related-tools-fix/word-to-pdf.html
index fdbf351..04a11b6 100644
--- a/src/pages/.backup-related-tools-fix/word-to-pdf.html
+++ b/src/pages/.backup-related-tools-fix/word-to-pdf.html
@@ -2,225 +2,230 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Word to PDF Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="Word to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="word to pdf, docx to pdf, convert word, doc to pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/word-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/word-to-pdf">
   <meta property="og:title" content="Word to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-word-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/word-to-pdf">
   <meta name="twitter:title" content="Word to PDF Free">
-  <meta name="twitter:description" content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-word-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Word to PDF">
-  
 
-    <title>Word to PDF - Convert DOCX, DOC to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Word documents (DOCX, DOC, ODT, RTF) to PDF format. Free, secure, and runs entirely in your browser.">
-    <link rel="icon" type="image/png" href="/images/favicon.svg" />
-    <link rel="alternate" hreflang="en" href="/en/word-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/word-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/word-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/word-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    <link rel="icon" href="/favicon.ico" sizes="any" />
+
+  <title>Word to PDF - Convert DOCX, DOC to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Word documents (DOCX, DOC, ODT, RTF) to PDF format. Free, secure, and runs entirely in your browser.">
+  <link rel="icon" type="image/png" href="/images/favicon.svg" />
+  <link rel="alternate" hreflang="en" href="/en/word-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/word-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/word-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/word-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+  <link rel="icon" href="/favicon.ico" sizes="any" />
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:wordToPdf.name">Word to PDF Converter Free Online - Convert DOCX Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:wordToPdf.subtitle">
-                Convert Word documents (DOCX, DOC, ODT, RTF) to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:wordToPdf.acceptedFormats">DOCX, DOC, ODT, RTF
-                        files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".doc,.docx,.odt,.rtf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.oasis.opendocument.text,text/rtf,application/rtf"
-                    multiple>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-4">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:wordToPdf.convertButton">Convert
-                    to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:wordToPdf.name">Word to PDF Converter Free Online
+        - Convert DOCX Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:wordToPdf.subtitle">
+        Convert Word documents (DOCX, DOC, ODT, RTF) to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:wordToPdf.acceptedFormats">DOCX, DOC, ODT, RTF
+            files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".doc,.docx,.odt,.rtf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.oasis.opendocument.text,text/rtf,application/rtf"
+          multiple>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-4">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:wordToPdf.convertButton">Convert
+          to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload Word Files</h3>
-            <p class="text-gray-400">Select or drag DOCX or DOC files you want to convert</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Auto Convert</h3>
-            <p class="text-gray-400">Conversion starts automatically, processing in your browser</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload Word Files</h3>
+          <p class="text-gray-400">Select or drag DOCX or DOC files you want to convert</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Preview Results</h3>
-            <p class="text-gray-400">See your converted PDF with preserved formatting</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download PDFs</h3>
-            <p class="text-gray-400">Save your PDF files - formatting perfectly preserved</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Auto Convert</h3>
+          <p class="text-gray-400">Conversion starts automatically, processing in your browser</p>
         </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Preview Results</h3>
+          <p class="text-gray-400">See your converted PDF with preserved formatting</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          4
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download PDFs</h3>
+          <p class="text-gray-400">Save your PDF files - formatting perfectly preserved</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -228,26 +233,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/pdf-to-docx" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Docx</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to docx tool</p>
-        </a>
-        <a href="/excel-to-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Excel To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online excel to pdf tool</p>
-        </a>
-        <a href="/powerpoint-to-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Powerpoint To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online powerpoint to pdf tool</p>
-        </a>
-        <a href="/txt-to-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Txt To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online txt to pdf tool</p>
-        </a>
-        <a href="/merge-pdf" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
+      <a href="/pdf-to-docx"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Docx</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to docx tool</p>
+      </a>
+      <a href="/excel-to-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Excel To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online excel to pdf tool</p>
+      </a>
+      <a href="/powerpoint-to-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Powerpoint To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online powerpoint to pdf tool</p>
+      </a>
+      <a href="/txt-to-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Txt To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online txt to pdf tool</p>
+      </a>
+      <a href="/merge-pdf"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -267,108 +277,109 @@
           Will formatting be preserved?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! Fonts, images, tables, headers, footers, and all formatting are preserved exactly as they appear in Word.</p>
+        <p class="mt-3 text-gray-400">Yes! Fonts, images, tables, headers, footers, and all formatting are preserved
+          exactly as they appear in Word.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Can I convert password-protected Word files?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">You'll need to unlock password-protected files first before converting them to PDF.</p>
+        <p class="mt-3 text-gray-400">You'll need to unlock password-protected files first before converting them to
+          PDF.</p>
       </details>
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/word-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/word-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -390,7 +401,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -419,7 +430,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/add-attachments.html b/src/pages/add-attachments.html
index 46240dc..ebe615a 100644
--- a/src/pages/add-attachments.html
+++ b/src/pages/add-attachments.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Add Attachments Online Free - Add Attachments Tool | BentoPDF</title>
   <meta name="title" content="Add Attachments Online Free - Add Attachments Tool | BentoPDF">
-  <meta name="description" content="★ Add Attachments online free - Add attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Add Attachments online free - Add attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="add attachments, add attachments, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/add-attachments">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/add-attachments">
   <meta property="og:title" content="Add Attachments Online Free - Add Attachments Tool | BentoPDF">
-  <meta property="og:description" content="★ Add Attachments online free - Add attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Add Attachments online free - Add attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-add-attachments.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/add-attachments">
   <meta name="twitter:title" content="Add Attachments Free">
-  <meta name="twitter:description" content="★ Add Attachments online free - Add attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ Add Attachments online free - Add attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-add-attachments.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Add Attachments">
-  
 
-    <title>Add Attachments to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Add file attachments to your PDF documents. Embed files at document or page level. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/add-attachments.html" />
-    <link rel="alternate" hreflang="de" href="/de/add-attachments.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/add-attachments.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/add-attachments.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Add Attachments to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Add file attachments to your PDF documents. Embed files at document or page level. Free, secure, and runs entirely in your browser.">
+
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/add-attachments.html" />
+  <link rel="alternate" hreflang="de" href="/de/add-attachments.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/add-attachments.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/add-attachments.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,180 +68,181 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:addAttachments.name">Add Attachments Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:addAttachments.subtitle">
-                Upload a PDF, then add files to embed as attachments.
-            </p>
-
-            <!-- PDF Upload -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Attachment Options (hidden until PDF loaded) -->
-            <div id="tool-options" class="hidden mt-6">
-                <h2 class="text-lg font-semibold text-white mb-3">Select Files to Attach</h2>
-
-                <div id="attachment-drop-zone"
-                    class="relative flex flex-col items-center justify-center w-full h-32 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300 mb-4">
-                    <div class="flex flex-col items-center justify-center">
-                        <i data-lucide="paperclip" class="w-8 h-8 mb-2 text-gray-400"></i>
-                        <p class="text-sm text-gray-400">Click or drop files to attach</p>
-                        <p class="text-xs text-gray-500">Any file type</p>
-                    </div>
-                    <input id="attachment-files-input" type="file"
-                        class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" multiple>
-                </div>
-
-                <div id="attachment-file-list" class="space-y-2"></div>
-
-                <!-- Attachment Level Options (hidden until attachments added) -->
-                <div id="attachment-level-options" class="hidden mt-4">
-                    <h3 class="text-md font-medium text-white mb-2">Attachment Level</h3>
-                    <div class="flex gap-4 mb-3">
-                        <label class="flex items-center gap-2 text-gray-300">
-                            <input type="radio" name="attachment-level" value="document" checked
-                                class="accent-indigo-500">
-                            <span>Document Level</span>
-                        </label>
-                        <label class="flex items-center gap-2 text-gray-300">
-                            <input type="radio" name="attachment-level" value="page" class="accent-indigo-500">
-                            <span>Page Level</span>
-                        </label>
-                    </div>
-
-                    <div id="page-range-wrapper" class="hidden mb-4">
-                        <label for="attachment-page-range" class="text-sm text-gray-400 block mb-1">
-                            Page Range (e.g., 1,3,5-7) - Total: <span id="attachment-total-pages">0</span> pages
-                        </label>
-                        <input type="text" id="attachment-page-range" placeholder="1,3,5-7"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg px-3 py-2 text-sm">
-                    </div>
-                </div>
-
-                <button id="process-btn" class="hidden btn-gradient w-full mt-4">Add Attachments</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:addAttachments.name">Add Attachments Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:addAttachments.subtitle">
+        Upload a PDF, then add files to embed as attachments.
+      </p>
+
+      <!-- PDF Upload -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Attachment Options (hidden until PDF loaded) -->
+      <div id="tool-options" class="hidden mt-6">
+        <h2 class="text-lg font-semibold text-white mb-3">Select Files to Attach</h2>
+
+        <div id="attachment-drop-zone"
+          class="relative flex flex-col items-center justify-center w-full h-32 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300 mb-4">
+          <div class="flex flex-col items-center justify-center">
+            <i data-lucide="paperclip" class="w-8 h-8 mb-2 text-gray-400"></i>
+            <p class="text-sm text-gray-400">Click or drop files to attach</p>
+            <p class="text-xs text-gray-500">Any file type</p>
+          </div>
+          <input id="attachment-files-input" type="file"
+            class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" multiple>
+        </div>
+
+        <div id="attachment-file-list" class="space-y-2"></div>
+
+        <!-- Attachment Level Options (hidden until attachments added) -->
+        <div id="attachment-level-options" class="hidden mt-4">
+          <h3 class="text-md font-medium text-white mb-2">Attachment Level</h3>
+          <div class="flex gap-4 mb-3">
+            <label class="flex items-center gap-2 text-gray-300">
+              <input type="radio" name="attachment-level" value="document" checked class="accent-indigo-500">
+              <span>Document Level</span>
+            </label>
+            <label class="flex items-center gap-2 text-gray-300">
+              <input type="radio" name="attachment-level" value="page" class="accent-indigo-500">
+              <span>Page Level</span>
+            </label>
+          </div>
+
+          <div id="page-range-wrapper" class="hidden mb-4">
+            <label for="attachment-page-range" class="text-sm text-gray-400 block mb-1">
+              Page Range (e.g., 1,3,5-7) - Total: <span id="attachment-total-pages">0</span> pages
+            </label>
+            <input type="text" id="attachment-page-range" placeholder="1,3,5-7"
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg px-3 py-2 text-sm">
+          </div>
+        </div>
+
+        <button id="process-btn" class="hidden btn-gradient w-full mt-4">Add Attachments</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -246,26 +250,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -278,14 +287,16 @@
           Is add attachments really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -297,74 +308,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/add-attachments-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/add-attachments-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -386,7 +396,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -415,7 +425,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/add-blank-page.html b/src/pages/add-blank-page.html
index a2dfb3b..a460815 100644
--- a/src/pages/add-blank-page.html
+++ b/src/pages/add-blank-page.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Add Blank Page Online Free - Add Blank Page Tool | BentoPDF</title>
   <meta name="title" content="Add Blank Page Online Free - Add Blank Page Tool | BentoPDF">
-  <meta name="description" content="★ Add Blank Page online free - Add blank page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Add Blank Page online free - Add blank page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="add blank page, add blank page, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/add-blank-page">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/add-blank-page">
   <meta property="og:title" content="Add Blank Page Online Free - Add Blank Page Tool | BentoPDF">
-  <meta property="og:description" content="★ Add Blank Page online free - Add blank page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Add Blank Page online free - Add blank page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-add-blank-page.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/add-blank-page">
   <meta name="twitter:title" content="Add Blank Page Free">
-  <meta name="twitter:description" content="★ Add Blank Page online free - Add blank page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
+  <meta name="twitter:description"
+    content="★ Add Blank Page online free - Add blank page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-add-blank-page.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Add Blank Page">
-  
 
-    <title>Add Blank Page - BentoPDF</title>
-    <meta name="description"
-        content="Insert blank pages anywhere in your PDF document. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/add-blank-page.html" />
-    <link rel="alternate" hreflang="de" href="/de/add-blank-page.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/add-blank-page.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/add-blank-page.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Add Blank Page - BentoPDF</title>
+  <meta name="description"
+    content="Insert blank pages anywhere in your PDF document. Free, secure, and runs entirely in your browser.">
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/add-blank-page.html" />
+  <link rel="alternate" hreflang="de" href="/de/add-blank-page.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/add-blank-page.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/add-blank-page.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,173 +68,174 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:addBlankPage.name">Add Blank Page Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:addBlankPage.subtitle">
-                Insert one or more blank pages at any position in your PDF document.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
-                    <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
-                    <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
-                        <li>Specify the position where blank pages should be inserted.</li>
-                        <li>Position 0 inserts at the beginning, position equal to page count inserts at the end.</li>
-                        <li>Blank pages will match the size of the first page in your document.</li>
-                    </ul>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-                    <div>
-                        <label for="page-position" class="block mb-2 text-sm font-medium text-gray-300">Insert after
-                            page</label>
-                        <input type="number" id="page-position" min="0" value="0"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5"
-                            placeholder="0">
-                        <p id="page-position-hint" class="text-xs text-gray-500 mt-1">Enter 0 to insert at the
-                            beginning.</p>
-                    </div>
-                    <div>
-                        <label for="page-count" class="block mb-2 text-sm font-medium text-gray-300">Number of blank
-                            pages</label>
-                        <input type="number" id="page-count" min="1" value="1"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5"
-                            placeholder="1">
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Add Blank Pages</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:addBlankPage.name">Add Blank Page Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:addBlankPage.subtitle">
+        Insert one or more blank pages at any position in your PDF document.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
+          <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
+          <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
+            <li>Specify the position where blank pages should be inserted.</li>
+            <li>Position 0 inserts at the beginning, position equal to page count inserts at the end.</li>
+            <li>Blank pages will match the size of the first page in your document.</li>
+          </ul>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
+          <div>
+            <label for="page-position" class="block mb-2 text-sm font-medium text-gray-300">Insert after
+              page</label>
+            <input type="number" id="page-position" min="0" value="0"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5"
+              placeholder="0">
+            <p id="page-position-hint" class="text-xs text-gray-500 mt-1">Enter 0 to insert at the
+              beginning.</p>
+          </div>
+          <div>
+            <label for="page-count" class="block mb-2 text-sm font-medium text-gray-300">Number of blank
+              pages</label>
+            <input type="number" id="page-count" min="1" value="1"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5"
+              placeholder="1">
+          </div>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Add Blank Pages</button>
+      </div>
+
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -239,26 +243,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -271,14 +280,16 @@
           Is add blank page really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -290,77 +301,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/add-blank-page-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/add-blank-page-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -382,7 +392,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -411,7 +421,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/add-stamps.html b/src/pages/add-stamps.html
index 17a161e..011d2d4 100644
--- a/src/pages/add-stamps.html
+++ b/src/pages/add-stamps.html
@@ -4,47 +4,50 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+
   <!-- Primary Meta Tags -->
   <title>Add Stamps Online Free - Add Stamps Tool | BentoPDF</title>
   <meta name="title" content="Add Stamps Online Free - Add Stamps Tool | BentoPDF">
-  <meta name="description" content="★ Add Stamps online free - Add stamps PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Add Stamps online free - Add stamps PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="add stamps, add stamps, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/add-stamps">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/add-stamps">
   <meta property="og:title" content="Add Stamps Online Free - Add Stamps Tool | BentoPDF">
-  <meta property="og:description" content="★ Add Stamps online free - Add stamps PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Add Stamps online free - Add stamps PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-add-stamps.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/add-stamps">
   <meta name="twitter:title" content="Add Stamps Free">
-  <meta name="twitter:description" content="★ Add Stamps online free - Add stamps PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Add Stamps online free - Add stamps PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-add-stamps.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Add Stamps">
-  
+
 
   <title>Add Stamps - BentoPDF</title>
-  
-  
-  
-  
+
+
+
+
   <link rel="alternate" hreflang="en" href="/en/add-stamps.html" />
   <link rel="alternate" hreflang="de" href="/de/add-stamps.html" />
   <link rel="alternate" hreflang="vi" href="/vi/add-stamps.html" />
@@ -67,7 +70,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -120,7 +123,8 @@
         <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
       </button>
 
-      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:addStamps.name">Add Stamps Free Online - Fast & Secure</h1>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:addStamps.name">Add Stamps Free Online - Fast &
+        Secure</h1>
       <p class="text-gray-400 mb-6" data-i18n="tools:addStamps.subtitle">
         Upload a PDF, add image stamps using the toolbar, and then save the stamped PDF.
       </p>
@@ -169,38 +173,41 @@
     </div>
   </div>
 
-  
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -208,26 +215,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -240,14 +252,16 @@
           Is add stamps really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -263,11 +277,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
@@ -369,7 +383,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -398,7 +412,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/add-watermark.html b/src/pages/add-watermark.html
index 38694f1..0765bb7 100644
--- a/src/pages/add-watermark.html
+++ b/src/pages/add-watermark.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Add Watermark Online Free - Add Watermark Tool | BentoPDF</title>
   <meta name="title" content="Add Watermark Online Free - Add Watermark Tool | BentoPDF">
-  <meta name="description" content="★ Add Watermark online free - Add watermark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Add Watermark online free - Add watermark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="add watermark, add watermark, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/add-watermark">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/add-watermark">
   <meta property="og:title" content="Add Watermark Online Free - Add Watermark Tool | BentoPDF">
-  <meta property="og:description" content="★ Add Watermark online free - Add watermark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Add Watermark online free - Add watermark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-add-watermark.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/add-watermark">
   <meta name="twitter:title" content="Add Watermark Free">
-  <meta name="twitter:description" content="★ Add Watermark online free - Add watermark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Add Watermark online free - Add watermark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-add-watermark.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Add Watermark">
-  
 
-    <title>Add Watermark - BentoPDF</title>
-    <meta name="description"
-        content="Add text or image watermarks to your PDF documents. Customize opacity with rotation. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/add-watermark.html" />
-    <link rel="alternate" hreflang="de" href="/de/add-watermark.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/add-watermark.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/add-watermark.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Add Watermark - BentoPDF</title>
+  <meta name="description"
+    content="Add text or image watermarks to your PDF documents. Customize opacity with rotation. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/add-watermark.html" />
+  <link rel="alternate" hreflang="de" href="/de/add-watermark.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/add-watermark.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/add-watermark.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,220 +66,220 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:addWatermark.name">Add Watermark to PDF Free - Protect PDFs</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:addWatermark.subtitle">
-                Add text or image watermarks to your PDF documents with customizable opacity and rotation.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-4">
-                <div class="flex gap-4 mb-4">
-                    <label class="flex items-center gap-2 cursor-pointer">
-                        <input type="radio" name="watermark-type" value="text" checked
-                            class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                        <span class="text-sm font-medium text-gray-300">Text Watermark</span>
-                    </label>
-                    <label class="flex items-center gap-2 cursor-pointer">
-                        <input type="radio" name="watermark-type" value="image"
-                            class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                        <span class="text-sm font-medium text-gray-300">Image Watermark</span>
-                    </label>
-                </div>
-
-                <div id="text-watermark-options">
-                    <div class="space-y-4">
-                        <div>
-                            <label for="watermark-text" class="block mb-2 text-sm font-medium text-gray-300">Watermark
-                                Text</label>
-                            <input type="text" id="watermark-text" placeholder="CONFIDENTIAL"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        </div>
-                        <div class="grid grid-cols-2 gap-4">
-                            <div>
-                                <label for="font-size" class="block mb-2 text-sm font-medium text-gray-300">Font
-                                    Size</label>
-                                <input type="number" id="font-size" value="72" min="10" max="200"
-                                    class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                            </div>
-                            <div>
-                                <label for="text-color"
-                                    class="block mb-2 text-sm font-medium text-gray-300">Color</label>
-                                <input type="color" id="text-color" value="#888888"
-                                    class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
-                            </div>
-                        </div>
-                        <div class="grid grid-cols-2 gap-4">
-                            <div>
-                                <label for="opacity-text" class="block mb-2 text-sm font-medium text-gray-300">Opacity:
-                                    <span id="opacity-value-text">0.3</span></label>
-                                <input type="range" id="opacity-text" min="0.1" max="1" step="0.1" value="0.3"
-                                    class="w-full h-2 bg-gray-700 rounded-lg cursor-pointer">
-                            </div>
-                            <div>
-                                <label for="angle-text" class="block mb-2 text-sm font-medium text-gray-300">Angle:
-                                    <span id="angle-value-text">-45</span>°</label>
-                                <input type="range" id="angle-text" min="-90" max="90" step="5" value="-45"
-                                    class="w-full h-2 bg-gray-700 rounded-lg cursor-pointer">
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <div id="image-watermark-options" class="hidden">
-                    <div class="space-y-4">
-                        <div>
-                            <label for="image-watermark-input"
-                                class="block mb-2 text-sm font-medium text-gray-300">Watermark Image (PNG/JPG)</label>
-                            <input type="file" id="image-watermark-input" accept="image/png, image/jpeg"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-indigo-600 file:text-white hover:file:bg-indigo-700">
-                        </div>
-                        <div class="grid grid-cols-2 gap-4">
-                            <div>
-                                <label for="opacity-image" class="block mb-2 text-sm font-medium text-gray-300">Opacity:
-                                    <span id="opacity-value-image">0.3</span></label>
-                                <input type="range" id="opacity-image" min="0.1" max="1" step="0.1" value="0.3"
-                                    class="w-full h-2 bg-gray-700 rounded-lg cursor-pointer">
-                            </div>
-                            <div>
-                                <label for="angle-image" class="block mb-2 text-sm font-medium text-gray-300">Angle:
-                                    <span id="angle-value-image">0</span>°</label>
-                                <input type="range" id="angle-image" min="-90" max="90" step="5" value="0"
-                                    class="w-full h-2 bg-gray-700 rounded-lg cursor-pointer">
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Add Watermark</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:addWatermark.name">Add Watermark to PDF Free -
+        Protect PDFs</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:addWatermark.subtitle">
+        Add text or image watermarks to your PDF documents with customizable opacity and rotation.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-4">
+        <div class="flex gap-4 mb-4">
+          <label class="flex items-center gap-2 cursor-pointer">
+            <input type="radio" name="watermark-type" value="text" checked
+              class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+            <span class="text-sm font-medium text-gray-300">Text Watermark</span>
+          </label>
+          <label class="flex items-center gap-2 cursor-pointer">
+            <input type="radio" name="watermark-type" value="image"
+              class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+            <span class="text-sm font-medium text-gray-300">Image Watermark</span>
+          </label>
+        </div>
+
+        <div id="text-watermark-options">
+          <div class="space-y-4">
+            <div>
+              <label for="watermark-text" class="block mb-2 text-sm font-medium text-gray-300">Watermark
+                Text</label>
+              <input type="text" id="watermark-text" placeholder="CONFIDENTIAL"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            </div>
+            <div class="grid grid-cols-2 gap-4">
+              <div>
+                <label for="font-size" class="block mb-2 text-sm font-medium text-gray-300">Font
+                  Size</label>
+                <input type="number" id="font-size" value="72" min="10" max="200"
+                  class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+              </div>
+              <div>
+                <label for="text-color" class="block mb-2 text-sm font-medium text-gray-300">Color</label>
+                <input type="color" id="text-color" value="#888888"
+                  class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
+              </div>
+            </div>
+            <div class="grid grid-cols-2 gap-4">
+              <div>
+                <label for="opacity-text" class="block mb-2 text-sm font-medium text-gray-300">Opacity:
+                  <span id="opacity-value-text">0.3</span></label>
+                <input type="range" id="opacity-text" min="0.1" max="1" step="0.1" value="0.3"
+                  class="w-full h-2 bg-gray-700 rounded-lg cursor-pointer">
+              </div>
+              <div>
+                <label for="angle-text" class="block mb-2 text-sm font-medium text-gray-300">Angle:
+                  <span id="angle-value-text">-45</span>°</label>
+                <input type="range" id="angle-text" min="-90" max="90" step="5" value="-45"
+                  class="w-full h-2 bg-gray-700 rounded-lg cursor-pointer">
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <div id="image-watermark-options" class="hidden">
+          <div class="space-y-4">
+            <div>
+              <label for="image-watermark-input" class="block mb-2 text-sm font-medium text-gray-300">Watermark Image
+                (PNG/JPG)</label>
+              <input type="file" id="image-watermark-input" accept="image/png, image/jpeg"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-semibold file:bg-indigo-600 file:text-white hover:file:bg-indigo-700">
+            </div>
+            <div class="grid grid-cols-2 gap-4">
+              <div>
+                <label for="opacity-image" class="block mb-2 text-sm font-medium text-gray-300">Opacity:
+                  <span id="opacity-value-image">0.3</span></label>
+                <input type="range" id="opacity-image" min="0.1" max="1" step="0.1" value="0.3"
+                  class="w-full h-2 bg-gray-700 rounded-lg cursor-pointer">
+              </div>
+              <div>
+                <label for="angle-image" class="block mb-2 text-sm font-medium text-gray-300">Angle:
+                  <span id="angle-value-image">0</span>°</label>
+                <input type="range" id="angle-image" min="-90" max="90" step="5" value="0"
+                  class="w-full h-2 bg-gray-700 rounded-lg cursor-pointer">
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Add Watermark</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -284,26 +287,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -316,14 +324,16 @@
           Is add watermark really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -335,77 +345,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/add-watermark-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/add-watermark-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -427,7 +436,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -456,7 +465,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/alternate-merge.html b/src/pages/alternate-merge.html
index b25671d..c9ca0f4 100644
--- a/src/pages/alternate-merge.html
+++ b/src/pages/alternate-merge.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Alternate Merge Online Free - Alternate Merge Tool | BentoPDF</title>
   <meta name="title" content="Alternate Merge Online Free - Alternate Merge Tool | BentoPDF">
-  <meta name="description" content="★ Alternate Merge online free - Alternate merge PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Alternate Merge online free - Alternate merge PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="alternate merge, alternate merge, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/alternate-merge">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/alternate-merge">
   <meta property="og:title" content="Alternate Merge Online Free - Alternate Merge Tool | BentoPDF">
-  <meta property="og:description" content="★ Alternate Merge online free - Alternate merge PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Alternate Merge online free - Alternate merge PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-alternate-merge.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/alternate-merge">
   <meta name="twitter:title" content="Alternate Merge Free">
-  <meta name="twitter:description" content="★ Alternate Merge online free - Alternate merge PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ Alternate Merge online free - Alternate merge PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-alternate-merge.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Alternate Merge">
-  
 
-    <title>Alternate & Mix PDF Pages - BentoPDF</title>
-    <meta name="description"
-        content="Alternate and mix pages from multiple PDF files. Interleave PDF pages in any order. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/alternate-merge.html" />
-    <link rel="alternate" hreflang="de" href="/de/alternate-merge.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/alternate-merge.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/alternate-merge.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Alternate & Mix PDF Pages - BentoPDF</title>
+  <meta name="description"
+    content="Alternate and mix pages from multiple PDF files. Interleave PDF pages in any order. Free, secure, and runs entirely in your browser.">
+
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/alternate-merge.html" />
+  <link rel="alternate" hreflang="de" href="/de/alternate-merge.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/alternate-merge.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/alternate-merge.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,146 +68,148 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:alternateMix.name">Alternate Merge Free Online - Combine PDFs Instantly</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:alternateMix.subtitle">
-                Upload multiple PDFs and interleave their pages. Drag to reorder the files, then mix their pages
-                alternately.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">Multiple PDF files (at least 2)</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <h2 class="text-lg font-semibold text-white mb-4">Files Order</h2>
-                <p class="text-sm text-gray-400 mb-3">Drag to reorder. Pages will be interleaved in this order.</p>
-
-                <ul id="file-list" class="space-y-2 mb-4"></ul>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Mix Pages</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:alternateMix.name">Alternate Merge Free Online -
+        Combine PDFs Instantly</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:alternateMix.subtitle">
+        Upload multiple PDFs and interleave their pages. Drag to reorder the files, then mix their pages
+        alternately.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">Multiple PDF files (at least 2)</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <h2 class="text-lg font-semibold text-white mb-4">Files Order</h2>
+        <p class="text-sm text-gray-400 mb-3">Drag to reorder. Pages will be interleaved in this order.</p>
+
+        <ul id="file-list" class="space-y-2 mb-4"></ul>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Mix Pages</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -212,26 +217,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -244,14 +254,16 @@
           Is alternate merge really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -263,74 +275,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/alternate-merge-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/alternate-merge-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -352,7 +363,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -381,7 +392,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/background-color.html b/src/pages/background-color.html
index 93ab620..8202854 100644
--- a/src/pages/background-color.html
+++ b/src/pages/background-color.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Background Color Online Free - Background Color Tool | BentoPDF</title>
   <meta name="title" content="Background Color Online Free - Background Color Tool | BentoPDF">
-  <meta name="description" content="★ Background Color online free - Background color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Background Color online free - Background color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="background color, background color, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/background-color">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/background-color">
   <meta property="og:title" content="Background Color Online Free - Background Color Tool | BentoPDF">
-  <meta property="og:description" content="★ Background Color online free - Background color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Background Color online free - Background color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-background-color.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/background-color">
   <meta name="twitter:title" content="Background Color Free">
-  <meta name="twitter:description" content="★ Background Color online free - Background color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
+  <meta name="twitter:description"
+    content="★ Background Color online free - Background color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-background-color.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Background Color">
-  
 
-    <title>Change Background Color - BentoPDF</title>
-    <meta name="description"
-        content="Change the background color of your PDF documents. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/background-color.html" />
-    <link rel="alternate" hreflang="de" href="/de/background-color.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/background-color.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/background-color.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Change Background Color - BentoPDF</title>
+  <meta name="description"
+    content="Change the background color of your PDF documents. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/background-color.html" />
+  <link rel="alternate" hreflang="de" href="/de/background-color.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/background-color.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/background-color.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,149 +66,150 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:backgroundColor.name">Background Color Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:backgroundColor.subtitle">
-                Add or change the background color of all pages in your PDF document.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-4">
-                <div>
-                    <label for="background-color" class="block mb-2 text-sm font-medium text-gray-300">Background
-                        Color</label>
-                    <input type="color" id="background-color" value="#FFFFCC"
-                        class="w-full h-12 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
-                </div>
-                <button id="process-btn" class="btn-gradient w-full mt-4">Change Background Color</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:backgroundColor.name">Background Color Free Online
+        - Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:backgroundColor.subtitle">
+        Add or change the background color of all pages in your PDF document.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-4">
+        <div>
+          <label for="background-color" class="block mb-2 text-sm font-medium text-gray-300">Background
+            Color</label>
+          <input type="color" id="background-color" value="#FFFFCC"
+            class="w-full h-12 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
+        </div>
+        <button id="process-btn" class="btn-gradient w-full mt-4">Change Background Color</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -213,26 +217,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -245,14 +254,16 @@
           Is background color really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -264,77 +275,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/background-color-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/background-color-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -356,7 +366,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -385,7 +395,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/bmp-to-pdf.html b/src/pages/bmp-to-pdf.html
index 39a8d88..4b33889 100644
--- a/src/pages/bmp-to-pdf.html
+++ b/src/pages/bmp-to-pdf.html
@@ -2,53 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Bmp To Pdf Online Free - Bmp To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Bmp To Pdf Online Free - Bmp To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Bmp To Pdf online free - Bmp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Bmp To Pdf online free - Bmp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="bmp to pdf, bmp to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/bmp-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/bmp-to-pdf">
   <meta property="og:title" content="Bmp To Pdf Online Free - Bmp To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Bmp To Pdf online free - Bmp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Bmp To Pdf online free - Bmp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-bmp-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/bmp-to-pdf">
   <meta name="twitter:title" content="Bmp To Pdf Free">
-  <meta name="twitter:description" content="★ Bmp To Pdf online free - Bmp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Bmp To Pdf online free - Bmp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-bmp-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Bmp To Pdf">
-  
 
-    <title>BMP to PDF - BentoPDF</title>
-    <meta name="description" content="Convert BMP images to PDF. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/bmp-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/bmp-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/bmp-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/bmp-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>BMP to PDF - BentoPDF</title>
+  <meta name="description" content="Convert BMP images to PDF. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/bmp-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/bmp-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/bmp-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/bmp-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -62,152 +65,154 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:bmpToPdf.name">Bmp To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:bmpToPdf.subtitle">
-                Convert one or more BMP images into a single PDF file.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">BMP images</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="image/bmp,.bmp" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6">Convert to PDF</button>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:bmpToPdf.name">Bmp To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:bmpToPdf.subtitle">
+        Convert one or more BMP images into a single PDF file.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">BMP images</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="image/bmp,.bmp" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6">Convert to PDF</button>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -215,26 +220,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -247,14 +257,16 @@
           Is bmp to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -266,84 +278,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/bmp-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/bmp-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -365,7 +376,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -394,7 +405,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/bookmark.html b/src/pages/bookmark.html
index 8a66553..15c74cc 100644
--- a/src/pages/bookmark.html
+++ b/src/pages/bookmark.html
@@ -4,47 +4,50 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+
   <!-- Primary Meta Tags -->
   <title>Bookmark Online Free - Bookmark Tool | BentoPDF</title>
   <meta name="title" content="Bookmark Online Free - Bookmark Tool | BentoPDF">
-  <meta name="description" content="★ Bookmark online free - Bookmark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Bookmark online free - Bookmark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="bookmark, bookmark, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/bookmark">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/bookmark">
   <meta property="og:title" content="Bookmark Online Free - Bookmark Tool | BentoPDF">
-  <meta property="og:description" content="★ Bookmark online free - Bookmark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Bookmark online free - Bookmark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-bookmark.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/bookmark">
   <meta name="twitter:title" content="Bookmark Free">
-  <meta name="twitter:description" content="★ Bookmark online free - Bookmark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
+  <meta name="twitter:description"
+    content="★ Bookmark online free - Bookmark PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-bookmark.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Bookmark">
-  
+
 
   <title>Advanced PDF Bookmark Tool - BentoPDF</title>
-  
-  
-  
-  
+
+
+
+
   <link rel="alternate" hreflang="en" href="/en/bookmark.html" />
   <link rel="alternate" hreflang="de" href="/de/bookmark.html" />
   <link rel="alternate" hreflang="vi" href="/vi/bookmark.html" />
@@ -68,7 +71,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -121,7 +124,8 @@
         <i data-lucide="arrow-left" class="cursor-pointer"></i>
         <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
       </button>
-      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:editBookmarks.name">Bookmark Free Online - Fast & Secure</h1>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:editBookmarks.name">Bookmark Free Online - Fast &
+        Secure</h1>
       <p class="text-gray-400 mb-6" data-i18n="tools:editBookmarks.subtitle">
         Add, edit, import, delete and extract PDF bookmarks.
       </p>
@@ -465,38 +469,41 @@
 
   <div id="modal-container"></div>
 
-  
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -504,26 +511,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -536,14 +548,16 @@
           Is bookmark really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -559,11 +573,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
@@ -665,7 +679,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -694,7 +708,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/cbz-to-pdf.html b/src/pages/cbz-to-pdf.html
index 9a723af..87965fc 100644
--- a/src/pages/cbz-to-pdf.html
+++ b/src/pages/cbz-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Cbz To Pdf Online Free - Cbz To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Cbz To Pdf Online Free - Cbz To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Cbz To Pdf online free - Cbz to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Cbz To Pdf online free - Cbz to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="cbz to pdf, cbz to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/cbz-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/cbz-to-pdf">
   <meta property="og:title" content="Cbz To Pdf Online Free - Cbz To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Cbz To Pdf online free - Cbz to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Cbz To Pdf online free - Cbz to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-cbz-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/cbz-to-pdf">
   <meta name="twitter:title" content="Cbz To Pdf Free">
-  <meta name="twitter:description" content="★ Cbz To Pdf online free - Cbz to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Cbz To Pdf online free - Cbz to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-cbz-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Cbz To Pdf">
-  
 
-    <title>CBZ to PDF - Convert XPS/OCBZ to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert XPS and OXPS documents to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/cbz-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/cbz-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/cbz-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/cbz-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>CBZ to PDF - Convert XPS/OCBZ to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert XPS and OXPS documents to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/cbz-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/cbz-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/cbz-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/cbz-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,154 +66,155 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:cbzToPdf.name">Cbz To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:cbzToPdf.subtitle">
-                Convert comic book archives (CBZ/CBR) to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:cbzToPdf.acceptedFormats">CBZ, CBR files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".cbz,.cbr,application/x-cbz,application/x-cbr,application/vnd.comicbook+zip,application/vnd.comicbook-rar"
-                    multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6"
-                data-i18n="tools:cbzToPdf.convertButton">Convert to PDF</button>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:cbzToPdf.name">Cbz To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:cbzToPdf.subtitle">
+        Convert comic book archives (CBZ/CBR) to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:cbzToPdf.acceptedFormats">CBZ, CBR files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".cbz,.cbr,application/x-cbz,application/x-cbr,application/vnd.comicbook+zip,application/vnd.comicbook-rar"
+          multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6" data-i18n="tools:cbzToPdf.convertButton">Convert
+        to PDF</button>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -218,26 +222,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -250,14 +259,16 @@
           Is cbz to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -269,96 +280,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/cbz-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/cbz-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -380,7 +390,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -409,7 +419,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/change-permissions.html b/src/pages/change-permissions.html
index 17752f8..855da42 100644
--- a/src/pages/change-permissions.html
+++ b/src/pages/change-permissions.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Change Permissions Online Free - Change Permissions Tool | BentoPDF</title>
   <meta name="title" content="Change Permissions Online Free - Change Permissions Tool | BentoPDF">
-  <meta name="description" content="★ Change Permissions online free - Change permissions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Change Permissions online free - Change permissions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="change permissions, change permissions, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/change-permissions">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/change-permissions">
   <meta property="og:title" content="Change Permissions Online Free - Change Permissions Tool | BentoPDF">
-  <meta property="og:description" content="★ Change Permissions online free - Change permissions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Change Permissions online free - Change permissions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-change-permissions.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/change-permissions">
   <meta name="twitter:title" content="Change Permissions Free">
-  <meta name="twitter:description" content="★ Change Permissions online free - Change permissions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works ">
+  <meta name="twitter:description"
+    content="★ Change Permissions online free - Change permissions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-change-permissions.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Change Permissions">
-  
 
-    <title>Change PDF Permissions - Manage PDF Security - BentoPDF</title>
-    <meta name="description"
-        content="Change PDF permissions and passwords. Set or modify user permissions, encryption, and access controls. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/change-permissions.html" />
-    <link rel="alternate" hreflang="de" href="/de/change-permissions.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/change-permissions.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/change-permissions.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Change PDF Permissions - Manage PDF Security - BentoPDF</title>
+  <meta name="description"
+    content="Change PDF permissions and passwords. Set or modify user permissions, encryption, and access controls. Free, secure, and runs entirely in your browser.">
+
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/change-permissions.html" />
+  <link rel="alternate" hreflang="de" href="/de/change-permissions.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/change-permissions.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/change-permissions.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,202 +68,204 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:changePermissions.name">Change Permissions Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:changePermissions.subtitle">
-                Set or change user permissions on a PDF. Modify passwords and access controls.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6 space-y-4">
-                <div>
-                    <label for="current-password" class="block mb-2 text-sm font-medium text-gray-300">Current Password
-                        (if encrypted)</label>
-                    <input type="password" id="current-password" placeholder="Enter current password"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                </div>
-
-                <div>
-                    <label for="new-user-password" class="block mb-2 text-sm font-medium text-gray-300">New User
-                        Password</label>
-                    <input type="password" id="new-user-password" placeholder="Password to open PDF"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                </div>
-
-                <div>
-                    <label for="new-owner-password" class="block mb-2 text-sm font-medium text-gray-300">New Owner
-                        Password</label>
-                    <input type="password" id="new-owner-password" placeholder="Password for permissions"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    <p class="text-xs text-gray-500 mt-1">Leave both passwords empty to decrypt the PDF.</p>
-                </div>
-
-                <div class="p-4 bg-gray-900 rounded-lg border border-gray-700">
-                    <h3 class="text-sm font-semibold text-white mb-3">Permissions (requires owner password)</h3>
-                    <div class="space-y-2">
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="allow-printing" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Allow Printing</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="allow-copying" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Allow Copying Text</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="allow-modifying" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Allow Modifying</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="allow-annotating" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Allow Annotating</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="allow-filling-forms" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Allow Filling Forms</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="allow-document-assembly" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Allow Document Assembly</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="allow-page-extraction" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Allow Page Extraction</span>
-                        </label>
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Change Permissions</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:changePermissions.name">Change Permissions Free
+        Online - Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:changePermissions.subtitle">
+        Set or change user permissions on a PDF. Modify passwords and access controls.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6 space-y-4">
+        <div>
+          <label for="current-password" class="block mb-2 text-sm font-medium text-gray-300">Current Password
+            (if encrypted)</label>
+          <input type="password" id="current-password" placeholder="Enter current password"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+        </div>
+
+        <div>
+          <label for="new-user-password" class="block mb-2 text-sm font-medium text-gray-300">New User
+            Password</label>
+          <input type="password" id="new-user-password" placeholder="Password to open PDF"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+        </div>
+
+        <div>
+          <label for="new-owner-password" class="block mb-2 text-sm font-medium text-gray-300">New Owner
+            Password</label>
+          <input type="password" id="new-owner-password" placeholder="Password for permissions"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          <p class="text-xs text-gray-500 mt-1">Leave both passwords empty to decrypt the PDF.</p>
+        </div>
+
+        <div class="p-4 bg-gray-900 rounded-lg border border-gray-700">
+          <h3 class="text-sm font-semibold text-white mb-3">Permissions (requires owner password)</h3>
+          <div class="space-y-2">
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="allow-printing" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Allow Printing</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="allow-copying" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Allow Copying Text</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="allow-modifying" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Allow Modifying</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="allow-annotating" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Allow Annotating</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="allow-filling-forms" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Allow Filling Forms</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="allow-document-assembly" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Allow Document Assembly</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="allow-page-extraction" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Allow Page Extraction</span>
+            </label>
+          </div>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Change Permissions</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -268,26 +273,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -300,14 +310,16 @@
           Is change permissions really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -319,74 +331,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/change-permissions-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/change-permissions-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -408,7 +419,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -437,7 +448,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/combine-single-page.html b/src/pages/combine-single-page.html
index e4fe41a..f857163 100644
--- a/src/pages/combine-single-page.html
+++ b/src/pages/combine-single-page.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Combine Single Page Online Free - Combine Single Page Tool | BentoPDF</title>
   <meta name="title" content="Combine Single Page Online Free - Combine Single Page Tool | BentoPDF">
-  <meta name="description" content="★ Combine Single Page online free - Combine single page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Combine Single Page online free - Combine single page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="combine single page, combine single page, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/combine-single-page">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/combine-single-page">
   <meta property="og:title" content="Combine Single Page Online Free - Combine Single Page Tool | BentoPDF">
-  <meta property="og:description" content="★ Combine Single Page online free - Combine single page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Combine Single Page online free - Combine single page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-combine-single-page.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/combine-single-page">
   <meta name="twitter:title" content="Combine Single Page Free">
-  <meta name="twitter:description" content="★ Combine Single Page online free - Combine single page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Work">
+  <meta name="twitter:description"
+    content="★ Combine Single Page online free - Combine single page PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Work">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-combine-single-page.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Combine Single Page">
-  
 
-    <title>Combine to Single Page - BentoPDF</title>
-    <meta name="description"
-        content="Combine all PDF pages into one continuous page. Stack pages horizontally or vertically. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/combine-single-page.html" />
-    <link rel="alternate" hreflang="de" href="/de/combine-single-page.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/combine-single-page.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/combine-single-page.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Combine to Single Page - BentoPDF</title>
+  <meta name="description"
+    content="Combine all PDF pages into one continuous page. Stack pages horizontally or vertically. Free, secure, and runs entirely in your browser.">
+
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/combine-single-page.html" />
+  <link rel="alternate" hreflang="de" href="/de/combine-single-page.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/combine-single-page.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/combine-single-page.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,190 +68,191 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:combineToSinglePage.name">Combine Single Page Free Online - Combine PDFs Instantly</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:combineToSinglePage.subtitle">
-                Merge all pages of your PDF into one continuous page, either horizontally or vertically.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-                    <div>
-                        <label for="combine-orientation" class="block mb-2 text-sm font-medium text-gray-300">Layout
-                            Direction</label>
-                        <select id="combine-orientation"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                            <option value="vertical" selected>Vertical (Top to Bottom)</option>
-                            <option value="horizontal">Horizontal (Left to Right)</option>
-                        </select>
-                    </div>
-                    <div>
-                        <label for="page-spacing" class="block mb-2 text-sm font-medium text-gray-300">Spacing
-                            (pixels)</label>
-                        <input type="number" id="page-spacing" min="0" value="0"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                    </div>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-                    <div>
-                        <label for="background-color" class="block mb-2 text-sm font-medium text-gray-300">Background
-                            Color</label>
-                        <input type="color" id="background-color" value="#FFFFFF"
-                            class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
-                    </div>
-                    <div class="flex items-end">
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="add-separator"
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-600">
-                            <span class="text-sm text-gray-300">Add Separator Lines</span>
-                        </label>
-                    </div>
-                </div>
-
-                <div id="separator-options" class="hidden grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-                    <div>
-                        <label for="separator-thickness" class="block mb-2 text-sm font-medium text-gray-300">Separator
-                            Thickness</label>
-                        <input type="number" id="separator-thickness" min="0.5" step="0.5" value="0.5"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                    </div>
-                    <div>
-                        <label for="separator-color" class="block mb-2 text-sm font-medium text-gray-300">Separator
-                            Color</label>
-                        <input type="color" id="separator-color" value="#000000"
-                            class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Combine Pages</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:combineToSinglePage.name">Combine Single Page Free
+        Online - Combine PDFs Instantly</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:combineToSinglePage.subtitle">
+        Merge all pages of your PDF into one continuous page, either horizontally or vertically.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
+          <div>
+            <label for="combine-orientation" class="block mb-2 text-sm font-medium text-gray-300">Layout
+              Direction</label>
+            <select id="combine-orientation"
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+              <option value="vertical" selected>Vertical (Top to Bottom)</option>
+              <option value="horizontal">Horizontal (Left to Right)</option>
+            </select>
+          </div>
+          <div>
+            <label for="page-spacing" class="block mb-2 text-sm font-medium text-gray-300">Spacing
+              (pixels)</label>
+            <input type="number" id="page-spacing" min="0" value="0"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+          </div>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
+          <div>
+            <label for="background-color" class="block mb-2 text-sm font-medium text-gray-300">Background
+              Color</label>
+            <input type="color" id="background-color" value="#FFFFFF"
+              class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
+          </div>
+          <div class="flex items-end">
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="add-separator"
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-600">
+              <span class="text-sm text-gray-300">Add Separator Lines</span>
+            </label>
+          </div>
+        </div>
+
+        <div id="separator-options" class="hidden grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
+          <div>
+            <label for="separator-thickness" class="block mb-2 text-sm font-medium text-gray-300">Separator
+              Thickness</label>
+            <input type="number" id="separator-thickness" min="0.5" step="0.5" value="0.5"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+          </div>
+          <div>
+            <label for="separator-color" class="block mb-2 text-sm font-medium text-gray-300">Separator
+              Color</label>
+            <input type="color" id="separator-color" value="#000000"
+              class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
+          </div>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Combine Pages</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -256,26 +260,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -288,14 +297,16 @@
           Is combine single page really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -307,73 +318,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/combine-single-page-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/combine-single-page-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -395,7 +405,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -424,7 +434,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/compare-pdfs.html b/src/pages/compare-pdfs.html
index 11adea6..afda203 100644
--- a/src/pages/compare-pdfs.html
+++ b/src/pages/compare-pdfs.html
@@ -2,86 +2,89 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Compare Pdfs Online Free - Compare Pdfs Tool | BentoPDF</title>
   <meta name="title" content="Compare Pdfs Online Free - Compare Pdfs Tool | BentoPDF">
-  <meta name="description" content="★ Compare Pdfs online free - Compare pdfs PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Compare Pdfs online free - Compare pdfs PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="compare pdfs, compare pdfs, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/compare-pdfs">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/compare-pdfs">
   <meta property="og:title" content="Compare Pdfs Online Free - Compare Pdfs Tool | BentoPDF">
-  <meta property="og:description" content="★ Compare Pdfs online free - Compare pdfs PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Compare Pdfs online free - Compare pdfs PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-compare-pdfs.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/compare-pdfs">
   <meta name="twitter:title" content="Compare Pdfs Free">
-  <meta name="twitter:description" content="★ Compare Pdfs online free - Compare pdfs PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
+  <meta name="twitter:description"
+    content="★ Compare Pdfs online free - Compare pdfs PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-compare-pdfs.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Compare Pdfs">
-  
 
-    <title>Compare PDFs - BentoPDF</title>
-    <meta name="description"
-        content="Compare two PDF files side by side or with overlay. See differences between PDF versions. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/compare-pdfs.html" />
-    <link rel="alternate" hreflang="de" href="/de/compare-pdfs.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/compare-pdfs.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/compare-pdfs.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    <style>
-        .compare-viewer-wrapper.overlay-mode {
-            position: relative;
-        }
 
-        .compare-viewer-wrapper.overlay-mode #panel-1,
-        .compare-viewer-wrapper.overlay-mode #panel-2 {
-            position: absolute;
-            top: 0;
-            left: 0;
-            width: 100%;
-            height: 100%;
-        }
+  <title>Compare PDFs - BentoPDF</title>
+  <meta name="description"
+    content="Compare two PDF files side by side or with overlay. See differences between PDF versions. Free, secure, and runs entirely in your browser.">
 
-        .compare-viewer-wrapper.overlay-mode #panel-2 {
-            pointer-events: none;
-        }
 
-        .compare-viewer-wrapper.side-by-side-mode {
-            display: flex;
-            gap: 1rem;
-        }
 
-        .compare-viewer-wrapper.side-by-side-mode #panel-1,
-        .compare-viewer-wrapper.side-by-side-mode #panel-2 {
-            flex: 1;
-            overflow: auto;
-            max-height: 70vh;
-        }
-    </style>
+
+  <link rel="alternate" hreflang="en" href="/en/compare-pdfs.html" />
+  <link rel="alternate" hreflang="de" href="/de/compare-pdfs.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/compare-pdfs.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/compare-pdfs.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+  <style>
+    .compare-viewer-wrapper.overlay-mode {
+      position: relative;
+    }
+
+    .compare-viewer-wrapper.overlay-mode #panel-1,
+    .compare-viewer-wrapper.overlay-mode #panel-2 {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+    }
+
+    .compare-viewer-wrapper.overlay-mode #panel-2 {
+      pointer-events: none;
+    }
+
+    .compare-viewer-wrapper.side-by-side-mode {
+      display: flex;
+      gap: 1rem;
+    }
+
+    .compare-viewer-wrapper.side-by-side-mode #panel-1,
+    .compare-viewer-wrapper.side-by-side-mode #panel-2 {
+      flex: 1;
+      overflow: auto;
+      max-height: 70vh;
+    }
+  </style>
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -95,208 +98,208 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-5xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:comparePdfs.name">Compare Pdfs Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:comparePdfs.subtitle">
-                Upload two PDF files to compare them side by side or with overlay mode.
-            </p>
-
-            <!-- File Upload Areas -->
-            <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
-                <div id="drop-zone-1"
-                    class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                    <div id="file-display-1" class="flex flex-col items-center justify-center">
-                        <i data-lucide="file-text" class="w-8 h-8 mb-2 text-gray-400"></i>
-                        <p class="text-sm text-gray-400">First PDF</p>
-                        <p class="text-xs text-gray-500">Click or drop</p>
-                    </div>
-                    <input id="file-input-1" type="file"
-                        class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" accept="application/pdf">
-                </div>
-                <div id="drop-zone-2"
-                    class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                    <div id="file-display-2" class="flex flex-col items-center justify-center">
-                        <i data-lucide="file-text" class="w-8 h-8 mb-2 text-gray-400"></i>
-                        <p class="text-sm text-gray-400">Second PDF</p>
-                        <p class="text-xs text-gray-500">Click or drop</p>
-                    </div>
-                    <input id="file-input-2" type="file"
-                        class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" accept="application/pdf">
-                </div>
-            </div>
-
-            <!-- Compare Viewer (hidden until both files loaded) -->
-            <div id="compare-viewer" class="hidden">
-                <!-- Unified Toolbar -->
-                <div
-                    class="flex flex-wrap items-center justify-center gap-4 mb-4 p-3 bg-gray-900 rounded-lg border border-gray-700">
-                    <!-- Page Navigation -->
-                    <button id="prev-page-compare"
-                        class="btn p-2 rounded-full bg-gray-700 hover:bg-gray-600 disabled:opacity-50" disabled>
-                        <i data-lucide="chevron-left"></i>
-                    </button>
-                    <span class="text-white font-medium">
-                        Page <span id="current-page-display-compare">1</span> of <span
-                            id="total-pages-display-compare">1</span>
-                    </span>
-                    <button id="next-page-compare"
-                        class="btn p-2 rounded-full bg-gray-700 hover:bg-gray-600 disabled:opacity-50" disabled>
-                        <i data-lucide="chevron-right"></i>
-                    </button>
-
-                    <!-- Divider -->
-                    <div class="border-l border-gray-600 h-6 mx-2 hidden sm:block"></div>
-
-                    <!-- View Mode Buttons -->
-                    <div class="bg-gray-700 p-1 rounded-md flex gap-1">
-                        <button id="view-mode-overlay"
-                            class="btn bg-indigo-600 px-3 py-1 rounded text-sm font-semibold">Overlay</button>
-                        <button id="view-mode-side"
-                            class="btn px-3 py-1 rounded text-sm font-semibold">Side-by-Side</button>
-                    </div>
-
-                    <!-- Divider -->
-                    <div class="border-l border-gray-600 h-6 mx-2 hidden sm:block"></div>
-
-                    <!-- Overlay Controls -->
-                    <div id="overlay-controls" class="flex items-center gap-2">
-                        <button id="flicker-btn"
-                            class="btn bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded-md text-sm font-semibold">Flicker</button>
-                        <label for="opacity-slider" class="text-sm font-medium text-gray-300">Opacity:</label>
-                        <input type="range" id="opacity-slider" min="0" max="1" step="0.05" value="0.5"
-                            class="w-24 accent-indigo-500">
-                    </div>
-
-                    <!-- Side-by-side Controls (hidden initially) -->
-                    <div id="side-by-side-controls" class="hidden flex items-center gap-2">
-                        <label class="flex items-center gap-2 text-sm font-medium text-gray-300 cursor-pointer">
-                            <input type="checkbox" id="sync-scroll-toggle" checked
-                                class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                            Sync Scrolling
-                        </label>
-                    </div>
-                </div>
-
-                <!-- Viewer Wrapper -->
-                <div id="compare-viewer-wrapper"
-                    class="compare-viewer-wrapper overlay-mode bg-gray-900 rounded-lg border border-gray-700 min-h-[400px] relative">
-                    <div id="panel-1" class="overflow-auto">
-                        <canvas id="canvas-compare-1" class="block mx-auto"></canvas>
-                    </div>
-                    <div id="panel-2" class="overflow-auto">
-                        <canvas id="canvas-compare-2" class="block mx-auto" style="opacity: 0.5;"></canvas>
-                    </div>
-                </div>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-5xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:comparePdfs.name">Compare Pdfs Free Online - Fast
+        & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:comparePdfs.subtitle">
+        Upload two PDF files to compare them side by side or with overlay mode.
+      </p>
+
+      <!-- File Upload Areas -->
+      <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
+        <div id="drop-zone-1"
+          class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+          <div id="file-display-1" class="flex flex-col items-center justify-center">
+            <i data-lucide="file-text" class="w-8 h-8 mb-2 text-gray-400"></i>
+            <p class="text-sm text-gray-400">First PDF</p>
+            <p class="text-xs text-gray-500">Click or drop</p>
+          </div>
+          <input id="file-input-1" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+            accept="application/pdf">
         </div>
-    </div>
+        <div id="drop-zone-2"
+          class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+          <div id="file-display-2" class="flex flex-col items-center justify-center">
+            <i data-lucide="file-text" class="w-8 h-8 mb-2 text-gray-400"></i>
+            <p class="text-sm text-gray-400">Second PDF</p>
+            <p class="text-xs text-gray-500">Click or drop</p>
+          </div>
+          <input id="file-input-2" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+            accept="application/pdf">
+        </div>
+      </div>
+
+      <!-- Compare Viewer (hidden until both files loaded) -->
+      <div id="compare-viewer" class="hidden">
+        <!-- Unified Toolbar -->
+        <div
+          class="flex flex-wrap items-center justify-center gap-4 mb-4 p-3 bg-gray-900 rounded-lg border border-gray-700">
+          <!-- Page Navigation -->
+          <button id="prev-page-compare" class="btn p-2 rounded-full bg-gray-700 hover:bg-gray-600 disabled:opacity-50"
+            disabled>
+            <i data-lucide="chevron-left"></i>
+          </button>
+          <span class="text-white font-medium">
+            Page <span id="current-page-display-compare">1</span> of <span id="total-pages-display-compare">1</span>
+          </span>
+          <button id="next-page-compare" class="btn p-2 rounded-full bg-gray-700 hover:bg-gray-600 disabled:opacity-50"
+            disabled>
+            <i data-lucide="chevron-right"></i>
+          </button>
+
+          <!-- Divider -->
+          <div class="border-l border-gray-600 h-6 mx-2 hidden sm:block"></div>
+
+          <!-- View Mode Buttons -->
+          <div class="bg-gray-700 p-1 rounded-md flex gap-1">
+            <button id="view-mode-overlay"
+              class="btn bg-indigo-600 px-3 py-1 rounded text-sm font-semibold">Overlay</button>
+            <button id="view-mode-side" class="btn px-3 py-1 rounded text-sm font-semibold">Side-by-Side</button>
+          </div>
+
+          <!-- Divider -->
+          <div class="border-l border-gray-600 h-6 mx-2 hidden sm:block"></div>
+
+          <!-- Overlay Controls -->
+          <div id="overlay-controls" class="flex items-center gap-2">
+            <button id="flicker-btn"
+              class="btn bg-gray-700 hover:bg-gray-600 px-3 py-1 rounded-md text-sm font-semibold">Flicker</button>
+            <label for="opacity-slider" class="text-sm font-medium text-gray-300">Opacity:</label>
+            <input type="range" id="opacity-slider" min="0" max="1" step="0.05" value="0.5"
+              class="w-24 accent-indigo-500">
+          </div>
+
+          <!-- Side-by-side Controls (hidden initially) -->
+          <div id="side-by-side-controls" class="hidden flex items-center gap-2">
+            <label class="flex items-center gap-2 text-sm font-medium text-gray-300 cursor-pointer">
+              <input type="checkbox" id="sync-scroll-toggle" checked
+                class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+              Sync Scrolling
+            </label>
+          </div>
+        </div>
+
+        <!-- Viewer Wrapper -->
+        <div id="compare-viewer-wrapper"
+          class="compare-viewer-wrapper overlay-mode bg-gray-900 rounded-lg border border-gray-700 min-h-[400px] relative">
+          <div id="panel-1" class="overflow-auto">
+            <canvas id="canvas-compare-1" class="block mx-auto"></canvas>
+          </div>
+          <div id="panel-2" class="overflow-auto">
+            <canvas id="canvas-compare-2" class="block mx-auto" style="opacity: 0.5;"></canvas>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -304,26 +307,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -336,14 +344,16 @@
           Is compare pdfs really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -355,74 +365,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/compare-pdfs-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/compare-pdfs-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -444,7 +453,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -473,7 +482,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/compress-pdf.html b/src/pages/compress-pdf.html
index 01f700c..55e0872 100644
--- a/src/pages/compress-pdf.html
+++ b/src/pages/compress-pdf.html
@@ -43,23 +43,23 @@
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="apple-mobile-web-app-title" content="Compress PDF">
 
-    
+
     <link rel="alternate" hreflang="en" href="/en/compress-pdf.html" />
     <link rel="alternate" hreflang="de" href="/de/compress-pdf.html" />
     <link rel="alternate" hreflang="vi" href="/vi/compress-pdf.html" />
     <link rel="alternate" hreflang="x-default" href="/en/compress-pdf.html" />
     <link href="/src/css/styles.css" rel="stylesheet" />
-    
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
+
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -67,7 +67,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -119,7 +119,8 @@
                 <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
             </button>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:compressPdf.name">Compress PDF Free Online - Reduce File Size Fast</h1>
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:compressPdf.name">Compress PDF Free Online -
+                Reduce File Size Fast</h1>
             <p class="text-gray-400 mb-6" data-i18n="tools:compressPdf.subtitle">
                 Reduce file size by choosing the compression method that best suits your document. Supports multiple
                 PDFs.
@@ -273,115 +274,128 @@
         </div>
     </div>
 
-    
-  <!-- How It Works Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
-    <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload PDFs</h3>
-            <p class="text-gray-400">Click or drag and drop one or more PDF files</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Choose Algorithm</h3>
-            <p class="text-gray-400">Select Condense (recommended) or Photon (for photo-heavy PDFs)</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Select Compression Level</h3>
-            <p class="text-gray-400">Pick Light, Balanced, Aggressive, or Extreme compression</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Customize & Compress</h3>
-            <p class="text-gray-400">Optionally enable grayscale or custom settings, then compress</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            5
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your compressed PDFs - up to 90% smaller</p>
-          </div>
-        </div>
-    </div>
-  </section>
 
-  <!-- Related Tools Section -->
-  <section class="max-w-6xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
-    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/pdf-to-jpg.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Jpg</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to jpg tool</p>
-        </a>
-    </div>
-  </section>
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload PDFs</h3>
+                    <p class="text-gray-400">Click or drag and drop one or more PDF files</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Choose Algorithm</h3>
+                    <p class="text-gray-400">Select Condense (recommended) or Photon (for photo-heavy PDFs)</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Select Compression Level</h3>
+                    <p class="text-gray-400">Pick Light, Balanced, Aggressive, or Extreme compression</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    4
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Customize & Compress</h3>
+                    <p class="text-gray-400">Optionally enable grayscale or custom settings, then compress</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    5
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+                    <p class="text-gray-400">Save your compressed PDFs - up to 90% smaller</p>
+                </div>
+            </div>
+        </div>
+    </section>
 
-  <!-- FAQ Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-    <div class="space-y-4">
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          What's the difference between Condense and Photon?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Condense removes dead-weight, optimizes images, and subsets fonts - best for most PDFs. Photon converts pages to images - ideal for photo-heavy/scanned PDFs but makes text non-selectable.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Which compression level should I use?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Balanced (recommended) offers great size reduction with minimal quality loss. Use Light to preserve maximum quality, Aggressive for smaller files, or Extreme for maximum compression.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Are there file size limits?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">No limits! Compress as many PDFs as you need, of any size, completely free.</p>
-      </details>
-    </div>
-  </section>
-  <footer class="mt-16 border-t-2 border-gray-700 py-8">
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/merge-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+            </a>
+            <a href="/split-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+            </a>
+            <a href="/pdf-to-jpg.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Pdf To Jpg</h3>
+                <p class="text-gray-400 text-sm">Free online pdf to jpg tool</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    What's the difference between Condense and Photon?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Condense removes dead-weight, optimizes images, and subsets fonts - best
+                    for most PDFs. Photon converts pages to images - ideal for photo-heavy/scanned PDFs but makes text
+                    non-selectable.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Which compression level should I use?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Balanced (recommended) offers great size reduction with minimal quality
+                    loss. Use Light to preserve maximum quality, Aggressive for smaller files, or Extreme for maximum
+                    compression.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Are there file size limits?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No limits! Compress as many PDFs as you need, of any size, completely
+                    free.</p>
+            </details>
+        </div>
+    </section>
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
                     <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
+                        &copy; 2026 BentoPDF. All rights reserved.
                     </p>
                     <p class="text-gray-500 text-xs mt-2">
                         Version <span id="app-version"></span>
diff --git a/src/pages/crop-pdf.html b/src/pages/crop-pdf.html
index 381932c..d6bce78 100644
--- a/src/pages/crop-pdf.html
+++ b/src/pages/crop-pdf.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Crop Pdf Online Free - Crop Pdf Tool | BentoPDF</title>
   <meta name="title" content="Crop Pdf Online Free - Crop Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Crop Pdf online free - Crop pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Crop Pdf online free - Crop pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="crop pdf, crop pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/crop-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/crop-pdf">
   <meta property="og:title" content="Crop Pdf Online Free - Crop Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Crop Pdf online free - Crop pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Crop Pdf online free - Crop pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-crop-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/crop-pdf">
   <meta name="twitter:title" content="Crop Pdf Free">
-  <meta name="twitter:description" content="★ Crop Pdf online free - Crop pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
+  <meta name="twitter:description"
+    content="★ Crop Pdf online free - Crop pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-crop-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Crop Pdf">
-  
 
-    <title>Crop PDF - BentoPDF</title>
-    <meta name="description"
-        content="Crop PDF pages visually with precision. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/crop-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/crop-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/crop-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/crop-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
-    <link href="../../node_modules/cropperjs/dist/cropper.min.css" rel="stylesheet" />
+
+  <title>Crop PDF - BentoPDF</title>
+  <meta name="description"
+    content="Crop PDF pages visually with precision. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/crop-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/crop-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/crop-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/crop-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <link href="../../node_modules/cropperjs/dist/cropper.min.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,185 +67,185 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
-        </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:cropPdf.name">Crop Pdf Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:cropPdf.subtitle">
-                Upload a PDF to visually crop one or more pages. This tool offers a live preview and two distinct
-                cropping modes.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF Documents</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <!-- File Display -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
 
-        <!-- Cropper Editor (shown after file upload) -->
-        <div id="cropper-editor" class="hidden w-full max-w-6xl mt-6">
-            <!-- Page Navigation and Controls -->
-            <div
-                class="flex flex-col md:flex-row items-center justify-between gap-4 mb-4 p-3 bg-gray-800 rounded-lg border border-gray-700">
-                <div id="page-nav" class="flex items-center gap-2">
-                    <button id="prev-page" class="btn p-2 rounded-full bg-gray-700 hover:bg-gray-600"
-                        title="Previous Page" disabled>
-                        <i data-lucide="chevron-left" class="w-5 h-5"></i>
-                    </button>
-                    <span id="page-info" class="text-white font-medium px-2">Page 1 of 1</span>
-                    <button id="next-page" class="btn p-2 rounded-full bg-gray-700 hover:bg-gray-600" title="Next Page"
-                        disabled>
-                        <i data-lucide="chevron-right" class="w-5 h-5"></i>
-                    </button>
-                </div>
-
-                <div class="flex flex-col md:flex-row gap-4">
-                    <label class="flex items-center gap-2 text-sm font-medium text-gray-300 cursor-pointer">
-                        <input type="checkbox" id="destructive-crop-toggle"
-                            class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                        Flattening Crop (converts pages to images)
-                    </label>
-                    <label class="flex items-center gap-2 text-sm font-medium text-gray-300 cursor-pointer">
-                        <input type="checkbox" id="apply-to-all-toggle"
-                            class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                        Apply to all pages
-                    </label>
-                </div>
-            </div>
-
-            <!-- Cropper Container -->
-            <div id="cropper-container"
-                class="w-full relative overflow-hidden flex items-center justify-center bg-gray-900 rounded-lg border border-gray-600 min-h-[500px]">
-            </div>
-
-            <!-- Options -->
-
-            <button id="crop-button" class="btn-gradient w-full mt-6" disabled>Crop & Download</button>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
+    </div>
+  </nav>
+
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:cropPdf.name">Crop Pdf Free Online - Fast & Secure
+      </h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:cropPdf.subtitle">
+        Upload a PDF to visually crop one or more pages. This tool offers a live preview and two distinct
+        cropping modes.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF Documents</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <!-- File Display -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
     </div>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+    <!-- Cropper Editor (shown after file upload) -->
+    <div id="cropper-editor" class="hidden w-full max-w-6xl mt-6">
+      <!-- Page Navigation and Controls -->
+      <div
+        class="flex flex-col md:flex-row items-center justify-between gap-4 mb-4 p-3 bg-gray-800 rounded-lg border border-gray-700">
+        <div id="page-nav" class="flex items-center gap-2">
+          <button id="prev-page" class="btn p-2 rounded-full bg-gray-700 hover:bg-gray-600" title="Previous Page"
+            disabled>
+            <i data-lucide="chevron-left" class="w-5 h-5"></i>
+          </button>
+          <span id="page-info" class="text-white font-medium px-2">Page 1 of 1</span>
+          <button id="next-page" class="btn p-2 rounded-full bg-gray-700 hover:bg-gray-600" title="Next Page" disabled>
+            <i data-lucide="chevron-right" class="w-5 h-5"></i>
+          </button>
         </div>
-    </div>
 
-    
+        <div class="flex flex-col md:flex-row gap-4">
+          <label class="flex items-center gap-2 text-sm font-medium text-gray-300 cursor-pointer">
+            <input type="checkbox" id="destructive-crop-toggle"
+              class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+            Flattening Crop (converts pages to images)
+          </label>
+          <label class="flex items-center gap-2 text-sm font-medium text-gray-300 cursor-pointer">
+            <input type="checkbox" id="apply-to-all-toggle"
+              class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+            Apply to all pages
+          </label>
+        </div>
+      </div>
+
+      <!-- Cropper Container -->
+      <div id="cropper-container"
+        class="w-full relative overflow-hidden flex items-center justify-center bg-gray-900 rounded-lg border border-gray-600 min-h-[500px]">
+      </div>
+
+      <!-- Options -->
+
+      <button id="crop-button" class="btn-gradient w-full mt-6" disabled>Crop & Download</button>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -250,26 +253,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -282,14 +290,16 @@
           Is crop pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -301,84 +311,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/crop-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/crop-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -400,7 +409,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -429,7 +438,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/csv-to-pdf.html b/src/pages/csv-to-pdf.html
index 4874004..f28106e 100644
--- a/src/pages/csv-to-pdf.html
+++ b/src/pages/csv-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Csv To Pdf Online Free - Csv To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Csv To Pdf Online Free - Csv To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Csv To Pdf online free - Csv to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Csv To Pdf online free - Csv to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="csv to pdf, csv to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/csv-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/csv-to-pdf">
   <meta property="og:title" content="Csv To Pdf Online Free - Csv To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Csv To Pdf online free - Csv to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Csv To Pdf online free - Csv to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-csv-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/csv-to-pdf">
   <meta name="twitter:title" content="Csv To Pdf Free">
-  <meta name="twitter:description" content="★ Csv To Pdf online free - Csv to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Csv To Pdf online free - Csv to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-csv-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Csv To Pdf">
-  
 
-    <title>CSV to PDF - Convert Spreadsheets to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert CSV (Comma-Separated Values) spreadsheet files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/csv-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/csv-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/csv-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/csv-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>CSV to PDF - Convert Spreadsheets to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert CSV (Comma-Separated Values) spreadsheet files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/csv-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/csv-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/csv-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/csv-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,154 +66,155 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">Csv To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6">
-                Convert CSV (Comma-Separated Values) spreadsheet files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">One or more CSV files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".csv,text/csv" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Convert to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">Csv To Pdf Converter Free Online - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6">
+        Convert CSV (Comma-Separated Values) spreadsheet files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">One or more CSV files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".csv,text/csv" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Convert to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -218,26 +222,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -250,14 +259,16 @@
           Is csv to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -269,96 +280,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/csv-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/csv-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -380,7 +390,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -409,7 +419,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/decrypt-pdf.html b/src/pages/decrypt-pdf.html
index 6779443..e13b8c7 100644
--- a/src/pages/decrypt-pdf.html
+++ b/src/pages/decrypt-pdf.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Decrypt PDF Online Free - Decrypt PDF Tool | BentoPDF</title>
   <meta name="title" content="Decrypt PDF Online Free - Decrypt PDF Tool | BentoPDF">
-  <meta name="description" content="★ Decrypt PDF online free - Decrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Decrypt PDF online free - Decrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="decrypt pdf, remove password, unlock pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/decrypt-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/decrypt-pdf">
   <meta property="og:title" content="Decrypt PDF Online Free - Decrypt PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Decrypt PDF online free - Decrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Decrypt PDF online free - Decrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-decrypt-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/decrypt-pdf">
   <meta name="twitter:title" content="Decrypt PDF Free">
-  <meta name="twitter:description" content="★ Decrypt PDF online free - Decrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast ">
+  <meta name="twitter:description"
+    content="★ Decrypt PDF online free - Decrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-decrypt-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Decrypt PDF">
-  
 
-    <title>Decrypt PDF - Unlock Password-Protected PDFs - BentoPDF</title>
-    <meta name="description"
-        content="Unlock password-protected PDF files. Remove encryption and password protection from your PDFs. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/decrypt-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/decrypt-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/decrypt-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/decrypt-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Decrypt PDF - Unlock Password-Protected PDFs - BentoPDF</title>
+  <meta name="description"
+    content="Unlock password-protected PDF files. Remove encryption and password protection from your PDFs. Free, secure, and runs entirely in your browser.">
+
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/decrypt-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/decrypt-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/decrypt-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/decrypt-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,147 +68,149 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:decryptPdf.name">Decrypt PDF Free - Remove Password Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:decryptPdf.subtitle">
-                Unlock password-protected PDF files by removing encryption.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6 space-y-4">
-                <div>
-                    <label for="password-input" class="block mb-2 text-sm font-medium text-gray-300">PDF
-                        Password</label>
-                    <input type="password" id="password-input" placeholder="Enter the PDF password"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    <p class="text-xs text-gray-500 mt-1">Enter the password used to protect this PDF.</p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Decrypt PDF</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:decryptPdf.name">Decrypt PDF Free - Remove
+        Password Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:decryptPdf.subtitle">
+        Unlock password-protected PDF files by removing encryption.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6 space-y-4">
+        <div>
+          <label for="password-input" class="block mb-2 text-sm font-medium text-gray-300">PDF
+            Password</label>
+          <input type="password" id="password-input" placeholder="Enter the PDF password"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          <p class="text-xs text-gray-500 mt-1">Enter the password used to protect this PDF.</p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Decrypt PDF</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -213,26 +218,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -245,14 +255,16 @@
           Is decrypt pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -264,74 +276,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/decrypt-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/decrypt-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -353,7 +364,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -382,7 +393,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/delete-pages.html b/src/pages/delete-pages.html
index ff4f6d4..98d50fb 100644
--- a/src/pages/delete-pages.html
+++ b/src/pages/delete-pages.html
@@ -2,53 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Delete Pages Online Free - Delete Pages Tool | BentoPDF</title>
   <meta name="title" content="Delete Pages Online Free - Delete Pages Tool | BentoPDF">
-  <meta name="description" content="★ Delete Pages online free - Delete pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Delete Pages online free - Delete pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="delete pages, delete pages, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/delete-pages">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/delete-pages">
   <meta property="og:title" content="Delete Pages Online Free - Delete Pages Tool | BentoPDF">
-  <meta property="og:description" content="★ Delete Pages online free - Delete pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Delete Pages online free - Delete pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-delete-pages.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/delete-pages">
   <meta name="twitter:title" content="Delete Pages Free">
-  <meta name="twitter:description" content="★ Delete Pages online free - Delete pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
+  <meta name="twitter:description"
+    content="★ Delete Pages online free - Delete pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-delete-pages.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Delete Pages">
-  
 
-    <title>Delete PDF Pages - BentoPDF</title>
-    <meta name="description" content="Remove specific pages from your PDF file. Free and secure.">
-    
-    <link rel="alternate" hreflang="en" href="/en/delete-pages.html" />
-    <link rel="alternate" hreflang="de" href="/de/delete-pages.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/delete-pages.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/delete-pages.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Delete PDF Pages - BentoPDF</title>
+  <meta name="description" content="Remove specific pages from your PDF file. Free and secure.">
+
+  <link rel="alternate" hreflang="en" href="/en/delete-pages.html" />
+  <link rel="alternate" hreflang="de" href="/de/delete-pages.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/delete-pages.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/delete-pages.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -62,108 +65,111 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
         </div>
-    </nav>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
+        </div>
+      </div>
+    </div>
+  </nav>
 
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer">Back to Tools</span>
-            </button>
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:deletePages.name">Delete PDF Pages Free - Remove Pages Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:deletePages.subtitle">Remove specific pages or ranges of
-                pages from your PDF file.</p>
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF Documents</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-            <div id="delete-options" class="hidden mt-6">
-                <p class="mb-2 font-medium text-white">Total Pages: <span id="total-pages"></span></p>
-                <label for="pages-to-delete" class="block mb-2 text-sm font-medium text-gray-300">Enter pages to delete
-                    (e.g., 2, 4-6, 9):</label>
-                <input type="text" id="pages-to-delete"
-                    class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 mb-4"
-                    placeholder="e.g., 2, 4-6, 9">
-                <div id="delete-pages-preview" class="grid grid-cols-3 sm:grid-cols-4 md:grid-cols-6 gap-4 my-6"></div>
-                <button id="process-btn" class="btn-gradient w-full">Delete Pages & Download</button>
-            </div>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer">Back to Tools</span>
+      </button>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:deletePages.name">Delete PDF Pages Free - Remove
+        Pages Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:deletePages.subtitle">Remove specific pages or ranges of
+        pages from your PDF file.</p>
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF Documents</p>
         </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+      <div id="delete-options" class="hidden mt-6">
+        <p class="mb-2 font-medium text-white">Total Pages: <span id="total-pages"></span></p>
+        <label for="pages-to-delete" class="block mb-2 text-sm font-medium text-gray-300">Enter pages to delete
+          (e.g., 2, 4-6, 9):</label>
+        <input type="text" id="pages-to-delete"
+          class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 mb-4"
+          placeholder="e.g., 2, 4-6, 9">
+        <div id="delete-pages-preview" class="grid grid-cols-3 sm:grid-cols-4 md:grid-cols-6 gap-4 my-6"></div>
+        <button id="process-btn" class="btn-gradient w-full">Delete Pages & Download</button>
+      </div>
     </div>
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+  </div>
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
     </div>
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg"
-                data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
-        </div>
+  </div>
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg"
+        data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
     </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -171,26 +177,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -203,14 +214,16 @@
           Is delete pages really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -222,80 +235,79 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/delete-pages-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/delete-pages-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -317,7 +329,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -346,7 +358,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/digital-sign-pdf.html b/src/pages/digital-sign-pdf.html
new file mode 100644
index 0000000..3018af1
--- /dev/null
+++ b/src/pages/digital-sign-pdf.html
@@ -0,0 +1,607 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+    <title>Digital Signature PDF Online Free - Add Cryptographic Signature | BentoPDF</title>
+    <meta name="title" content="Digital Signature PDF Online Free - Add Cryptographic Signature | BentoPDF">
+    <meta name="description"
+        content="★ Add digital signature to PDF online free ★ Use X.509 certificates ★ PKCS#7 signatures ★ No signup ★ Privacy-first ★ Works in browser">
+    <meta name="keywords"
+        content="digital signature pdf, pkcs7 signature, x509 certificate, sign pdf certificate, cryptographic signature">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
+
+    <link rel="canonical" href="https://www.bentopdf.com/digital-sign-pdf">
+
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/digital-sign-pdf">
+    <meta property="og:title" content="Digital Signature PDF Online Free - Add Cryptographic Signature | BentoPDF">
+    <meta property="og:description"
+        content="★ Add digital signature to PDF online free ★ Use X.509 certificates ★ PKCS#7 signatures ★ No signup ★ Privacy-first ★ Works in browser">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-digital-sign-pdf.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="https://www.bentopdf.com/digital-sign-pdf">
+    <meta name="twitter:title" content="Digital Signature PDF Free">
+    <meta name="twitter:description"
+        content="★ Add digital signature to PDF online free ★ Use X.509 certificates ★ PKCS#7 signatures ★ Privacy-first">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-digital-sign-pdf.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Digital Sign PDF">
+
+    <link rel="alternate" hreflang="en" href="/en/digital-sign-pdf.html" />
+    <link rel="alternate" hreflang="de" href="/de/digital-sign-pdf.html" />
+    <link rel="alternate" hreflang="vi" href="/vi/digital-sign-pdf.html" />
+    <link rel="alternate" hreflang="x-default" href="/en/digital-sign-pdf.html" />
+    <link href="/src/css/styles.css" rel="stylesheet" />
+
+    <link rel="manifest" href="/site.webmanifest" />
+
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
+</head>
+
+<body class="antialiased bg-gray-900">
+    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+        <div class="container mx-auto px-4">
+            <div class="flex justify-between items-center h-16">
+                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <span class="text-white font-bold text-xl ml-2">
+                        <a href="/">BentoPDF</a>
+                    </span>
+                </div>
+
+                <div class="hidden md:flex items-center space-x-8 text-white">
+                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+                    <a href="/about.html" class="nav-link">About</a>
+                    <a href="/contact.html" class="nav-link">Contact</a>
+                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
+                </div>
+
+                <div class="md:hidden flex items-center">
+                    <button id="mobile-menu-button" type="button"
+                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+                        aria-controls="mobile-menu" aria-expanded="false">
+                        <span class="sr-only">Open main menu</span>
+                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M4 6h16M4 12h16M4 18h16" />
+                        </svg>
+                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M6 18L18 6M6 6l12 12" />
+                        </svg>
+                    </button>
+                </div>
+            </div>
+        </div>
+
+        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+                <a href="/about.html" class="mobile-nav-link">About</a>
+                <a href="/contact.html" class="mobile-nav-link">Contact</a>
+                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+            </div>
+        </div>
+    </nav>
+
+    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+        <div id="tool-uploader"
+            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+            <button id="back-to-tools"
+                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+                <i data-lucide="arrow-left" class="cursor-pointer"></i>
+                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+            </button>
+
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:digitalSignPdf.name">Digital Signature PDF
+            </h1>
+            <p class="text-gray-400 mb-4" data-i18n="tools:digitalSignPdf.subtitle">
+                Add a cryptographic digital signature to your PDF using X.509 certificates. Supports PKCS#12 (.pfx,
+                .p12) and PEM formats. Your private key never leaves your browser.
+            </p>
+
+            <div class="bg-blue-900/30 border border-blue-700 rounded-lg p-3 mb-6 flex items-start gap-3">
+                <i data-lucide="wifi" class="w-5 h-5 text-blue-400 flex-shrink-0 mt-0.5"></i>
+                <div class="text-sm">
+                    <p class="text-blue-300 font-medium">Internet connection required</p>
+                    <p class="text-blue-400/80 mt-1">Signing may need to fetch certificate chain information from your
+                        certificate issuer's server to validate the signature.</p>
+                </div>
+            </div>
+
+            <div id="drop-zone"
+                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+                <div class="flex flex-col items-center justify-center pt-5 pb-6">
+                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
+                            data-i18n="upload.clickToSelect">Click to
+                            select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+                    <p class="text-xs text-gray-500">PDF Documents</p>
+                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+                        device.</p>
+                </div>
+                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+                    accept="application/pdf">
+            </div>
+
+            <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+            <div id="certificate-section" class="hidden mt-6 space-y-4">
+                <h2 class="text-lg font-semibold text-white">Certificate</h2>
+
+                <div id="cert-drop-zone"
+                    class="relative flex flex-col items-center justify-center w-full h-32 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+                    <div class="flex flex-col items-center justify-center py-4">
+                        <i data-lucide="key" class="w-8 h-8 mb-2 text-gray-400"></i>
+                        <p class="text-sm text-gray-400">Upload certificate (.pfx, .p12, .pem)</p>
+                    </div>
+                    <input id="cert-input" type="file"
+                        class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" accept=".pfx,.p12,.pem">
+                </div>
+
+                <div id="cert-display-area" class="space-y-2"></div>
+
+                <div id="cert-password-section" class="hidden">
+                    <label for="cert-password" class="block text-sm font-medium text-gray-300 mb-2">Certificate
+                        Password</label>
+                    <input type="password" id="cert-password"
+                        class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent"
+                        placeholder="Enter certificate password">
+                </div>
+
+                <div id="cert-info" class="hidden bg-gray-700 rounded-lg p-4">
+                    <h3 class="text-sm font-semibold text-white mb-2">Certificate Information</h3>
+                    <div class="text-sm text-gray-300 space-y-1">
+                        <p><span class="text-gray-400">Subject:</span> <span id="cert-subject">-</span></p>
+                        <p><span class="text-gray-400">Issuer:</span> <span id="cert-issuer">-</span></p>
+                        <p><span class="text-gray-400">Valid:</span> <span id="cert-validity">-</span></p>
+                    </div>
+                </div>
+            </div>
+
+            <div id="signature-options" class="hidden mt-6 space-y-4">
+                <h2 class="text-lg font-semibold text-white">Signature Details (Optional)</h2>
+
+                <div>
+                    <label for="sign-reason" class="block text-sm font-medium text-gray-300 mb-2">Reason</label>
+                    <input type="text" id="sign-reason"
+                        class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent"
+                        placeholder="e.g., I approve this document">
+                </div>
+
+                <div>
+                    <label for="sign-location" class="block text-sm font-medium text-gray-300 mb-2">Location</label>
+                    <input type="text" id="sign-location"
+                        class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent"
+                        placeholder="e.g., New York, USA">
+                </div>
+
+                <div>
+                    <label for="sign-contact" class="block text-sm font-medium text-gray-300 mb-2">Contact Info</label>
+                    <input type="text" id="sign-contact"
+                        class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent"
+                        placeholder="e.g., email@example.com">
+                </div>
+            </div>
+
+            <div id="visible-signature-section" class="hidden mt-6 space-y-4">
+                <div class="flex items-center justify-between">
+                    <h2 class="text-lg font-semibold text-white">Visible Signature</h2>
+                    <label class="relative inline-flex items-center cursor-pointer">
+                        <input type="checkbox" id="enable-visible-sig" class="sr-only peer">
+                        <div
+                            class="w-11 h-6 bg-gray-600 peer-focus:outline-none peer-focus:ring-2 peer-focus:ring-indigo-500 rounded-full peer peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-indigo-600">
+                        </div>
+                    </label>
+                </div>
+                <p class="text-xs text-gray-500">When enabled, a visible signature box appears on the PDF. You can
+                    upload an image/logo or add text. If neither is provided, the signer's name from the certificate
+                    will be shown automatically.</p>
+
+                <div id="visible-sig-options" class="hidden space-y-4">
+                    <div>
+                        <label class="block text-sm font-medium text-gray-300 mb-2">Signature Image/Logo
+                            (Optional)</label>
+                        <div id="sig-image-drop-zone"
+                            class="relative flex flex-col items-center justify-center w-full h-24 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+                            <div class="flex flex-col items-center justify-center py-2">
+                                <i data-lucide="image" class="w-6 h-6 mb-1 text-gray-400"></i>
+                                <p class="text-xs text-gray-400">Upload image (PNG, JPG, WebP)</p>
+                            </div>
+                            <input id="sig-image-input" type="file"
+                                class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+                                accept="image/png,image/jpeg,image/webp">
+                        </div>
+                        <div id="sig-image-preview" class="hidden mt-2 flex items-center gap-2">
+                            <img id="sig-image-thumb" class="h-12 w-auto rounded border border-gray-600"
+                                alt="Signature preview">
+                            <button id="remove-sig-image"
+                                class="text-red-400 hover:text-red-300 text-sm">Remove</button>
+                        </div>
+                    </div>
+
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label for="sig-page" class="block text-sm font-medium text-gray-300 mb-2">Page</label>
+                            <select id="sig-page"
+                                class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent">
+                                <option value="0">First page</option>
+                                <option value="last">Last page</option>
+                                <option value="all">All pages</option>
+                                <option value="custom">Custom page #</option>
+                            </select>
+                        </div>
+                        <div id="custom-page-wrapper" class="hidden">
+                            <label for="sig-custom-page" class="block text-sm font-medium text-gray-300 mb-2">Page
+                                #</label>
+                            <input type="number" id="sig-custom-page" min="1" value="1"
+                                class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent">
+                        </div>
+                    </div>
+
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label for="sig-x" class="block text-sm font-medium text-gray-300 mb-2">X Position
+                                (left)</label>
+                            <input type="number" id="sig-x" min="0" value="25"
+                                class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent">
+                        </div>
+                        <div>
+                            <label for="sig-y" class="block text-sm font-medium text-gray-300 mb-2">Y Position
+                                (top)</label>
+                            <input type="number" id="sig-y" min="0" value="700"
+                                class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent">
+                        </div>
+                    </div>
+
+                    <div class="grid grid-cols-2 gap-4">
+                        <div>
+                            <label for="sig-width" class="block text-sm font-medium text-gray-300 mb-2">Width</label>
+                            <input type="number" id="sig-width" min="20" value="150"
+                                class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent">
+                        </div>
+                        <div>
+                            <label for="sig-height" class="block text-sm font-medium text-gray-300 mb-2">Height</label>
+                            <input type="number" id="sig-height" min="20" value="70"
+                                class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent">
+                        </div>
+                    </div>
+
+                    <div class="border-t border-gray-700 pt-4">
+                        <label class="flex items-center gap-2 cursor-pointer">
+                            <input type="checkbox" id="enable-sig-text"
+                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+                            <span class="text-sm font-medium text-gray-300">Add text overlay</span>
+                        </label>
+                    </div>
+
+                    <div id="sig-text-options" class="hidden space-y-4">
+                        <div>
+                            <label for="sig-text" class="block text-sm font-medium text-gray-300 mb-2">Text</label>
+                            <input type="text" id="sig-text"
+                                class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent"
+                                placeholder="e.g., Digitally signed by John Doe">
+                        </div>
+                        <div class="grid grid-cols-2 gap-4">
+                            <div>
+                                <label for="sig-text-color" class="block text-sm font-medium text-gray-300 mb-2">Text
+                                    Color</label>
+                                <input type="color" id="sig-text-color" value="#000000"
+                                    class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
+                            </div>
+                            <div>
+                                <label for="sig-text-size" class="block text-sm font-medium text-gray-300 mb-2">Font
+                                    Size</label>
+                                <input type="number" id="sig-text-size" min="6" max="72" value="12"
+                                    class="w-full px-4 py-2 bg-gray-700 border border-gray-600 rounded-lg text-white focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:border-transparent">
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <button id="process-btn" class="btn-gradient w-full mt-6" style="display: none;">
+                Apply Digital Signature
+            </button>
+        </div>
+    </div>
+
+    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+            <div class="solid-spinner"></div>
+            <p id="loader-text" class="text-white text-lg font-medium">
+                Processing...
+            </p>
+        </div>
+    </div>
+
+    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">
+                Alert</h3>
+            <p id="alert-message" class="text-gray-300 mb-6"></p>
+            <button id="alert-ok"
+                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+                OK
+            </button>
+        </div>
+    </div>
+
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
+                    <p class="text-gray-400">Select the PDF document you want to sign</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload Certificate</h3>
+                    <p class="text-gray-400">Provide your .pfx or .p12 certificate file and password</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Sign & Download</h3>
+                    <p class="text-gray-400">Apply the digital signature and download your signed PDF</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/encrypt-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Encrypt PDF</h3>
+                <p class="text-gray-400 text-sm">Password protect your PDF</p>
+            </a>
+            <a href="/decrypt-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Decrypt PDF</h3>
+                <p class="text-gray-400 text-sm">Remove PDF password</p>
+            </a>
+            <a href="/flatten-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Flatten PDF</h3>
+                <p class="text-gray-400 text-sm">Make annotations permanent</p>
+            </a>
+            <a href="/sanitize-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Sanitize PDF</h3>
+                <p class="text-gray-400 text-sm">Remove hidden data</p>
+            </a>
+            <a href="/change-permissions.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Change Permissions</h3>
+                <p class="text-gray-400 text-sm">Set PDF permissions</p>
+            </a>
+        </div>
+    </section>
+
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    What is a digital signature?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">A digital signature is a cryptographic mechanism that verifies the
+                    authenticity and integrity of a document. Unlike a drawn signature, it uses public key cryptography
+                    (X.509 certificates) to prove the signer's identity.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    What certificate formats are supported?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">We support PKCS#12 format certificates (.pfx, .p12) which contain both
+                    your certificate and private key in a single encrypted file. These are commonly issued by
+                    certificate authorities.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is my private key safe?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes! All processing happens entirely in your browser. Your certificate,
+                    private key, and PDF files never leave your device or get uploaded to any server.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Will the signature be valid in PDF readers?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes, the tool creates standard PKCS#7 detached signatures that are
+                    recognized by all major PDF viewers. For full validation, use a certificate
+                    from a trusted Certificate Authority.</p>
+            </details>
+        </div>
+    </section>
+
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
+        <div class="container mx-auto px-4">
+            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+                <div class="mb-8 md:mb-0">
+                    <div class="flex items-center justify-center md:justify-start mb-4">
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <span class="text-xl font-bold text-white">BentoPDF</span>
+                    </div>
+                    <p class="text-gray-400 text-sm">
+                        &copy; 2026 BentoPDF. All rights reserved.
+                    </p>
+                    <p class="text-gray-500 text-xs mt-2">
+                        Version <span id="app-version"></span>
+                    </p>
+                </div>
+
+                <div>
+                    <h3 class="font-bold text-white mb-4">Company</h3>
+                    <ul class="space-y-2 text-gray-400">
+                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+                    </ul>
+                </div>
+
+                <div>
+                    <h3 class="font-bold text-white mb-4">Legal</h3>
+                    <ul class="space-y-2 text-gray-400">
+                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+                    </ul>
+                </div>
+
+                <div>
+                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
+                    <div class="flex justify-center md:justify-start space-x-4">
+                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                                <path fill-rule="evenodd"
+                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                                    clip-rule="evenodd" />
+                            </svg>
+                        </a>
+                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+                            class="text-gray-400 hover:text-indigo-400" title="Discord">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                                <path
+                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+                            </svg>
+                        </a>
+                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+                            title="Instagram">
+                            <i data-lucide="instagram"></i>
+                        </a>
+                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+                            title="LinkedIn">
+                            <i data-lucide="linkedin"></i>
+                        </a>
+                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
+                            title="X (Twitter)">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                                <path
+                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+                            </svg>
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </footer>
+
+    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+    <script type="module" src="/src/js/utils/full-width.ts"></script>
+    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+    <script type="module" src="/src/version.ts"></script>
+    <script type="module" src="/src/js/logic/digital-sign-pdf-page.ts"></script>
+    <script type="module" src="/src/js/mobileMenu.ts"></script>
+    <script type="module" src="/src/js/main.ts"></script>
+
+    <script type="application/ld+json">
+  {
+    "@context": "https://schema.org",
+    "@type": "SoftwareApplication",
+    "name": "Digital Signature PDF - BentoPDF",
+    "applicationCategory": "PDF Tool",
+    "operatingSystem": "Any - Web Browser",
+    "offers": {
+      "@type": "Offer",
+      "price": "0",
+      "priceCurrency": "USD"
+    },
+    "aggregateRating": {
+      "@type": "AggregateRating",
+      "ratingValue": "4.9",
+      "ratingCount": "2150"
+    }
+  }
+  </script>
+
+    <script type="application/ld+json">
+  {
+    "@context": "https://schema.org",
+    "@type": "HowTo",
+    "name": "How to add digital signature to PDF",
+    "description": "Learn how to add a cryptographic digital signature to PDF using BentoPDF",
+    "step": [
+      {
+        "@type": "HowToStep",
+        "position": 1,
+        "name": "Upload PDF",
+        "text": "Select the PDF document you want to sign"
+      },
+      {
+        "@type": "HowToStep",
+        "position": 2,
+        "name": "Upload Certificate",
+        "text": "Provide your .pfx or .p12 certificate file and password"
+      },
+      {
+        "@type": "HowToStep",
+        "position": 3,
+        "name": "Sign & Download",
+        "text": "Apply the digital signature and download your signed PDF"
+      }
+    ]
+  }
+  </script>
+
+    <script type="application/ld+json">
+  {
+    "@context": "https://schema.org",
+    "@type": "BreadcrumbList",
+    "itemListElement": [
+      {
+        "@type": "ListItem",
+        "position": 1,
+        "name": "Home",
+        "item": "https://www.bentopdf.com"
+      },
+      {
+        "@type": "ListItem",
+        "position": 2,
+        "name": "Digital Signature PDF",
+        "item": "https://www.bentopdf.com/digital-sign-pdf"
+      }
+    ]
+  }
+  </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/src/pages/divide-pages.html b/src/pages/divide-pages.html
index 26b8df8..520c5cf 100644
--- a/src/pages/divide-pages.html
+++ b/src/pages/divide-pages.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Divide Pages Online Free - Divide Pages Tool | BentoPDF</title>
   <meta name="title" content="Divide Pages Online Free - Divide Pages Tool | BentoPDF">
-  <meta name="description" content="★ Divide Pages online free - Divide pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Divide Pages online free - Divide pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="divide pages, divide pages, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/divide-pages">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/divide-pages">
   <meta property="og:title" content="Divide Pages Online Free - Divide Pages Tool | BentoPDF">
-  <meta property="og:description" content="★ Divide Pages online free - Divide pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Divide Pages online free - Divide pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-divide-pages.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/divide-pages">
   <meta name="twitter:title" content="Divide Pages Free">
-  <meta name="twitter:description" content="★ Divide Pages online free - Divide pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
+  <meta name="twitter:description"
+    content="★ Divide Pages online free - Divide pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-divide-pages.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Divide Pages">
-  
 
-    <title>Divide PDF Pages - BentoPDF</title>
-    <meta name="description"
-        content="Split each page of your PDF horizontally or vertically into two pages. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/divide-pages.html" />
-    <link rel="alternate" hreflang="de" href="/de/divide-pages.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/divide-pages.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/divide-pages.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Divide PDF Pages - BentoPDF</title>
+  <meta name="description"
+    content="Split each page of your PDF horizontally or vertically into two pages. Free, secure, and runs entirely in your browser.">
+
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/divide-pages.html" />
+  <link rel="alternate" hreflang="de" href="/de/divide-pages.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/divide-pages.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/divide-pages.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,169 +68,169 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:dividePages.name">Divide Pages Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:dividePages.subtitle">
-                Split each page of your PDF horizontally or vertically, turning one page into two.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
-                    <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
-                    <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
-                        <li><strong>Vertical:</strong> Split each page into left and right halves.</li>
-                        <li><strong>Horizontal:</strong> Split each page into top and bottom halves.</li>
-                        <li>Specify which pages to divide. Other pages will be kept as-is.</li>
-                        <li>Leave blank or use "all" to divide all pages.</li>
-                    </ul>
-                </div>
-
-                <div class="mb-4">
-                    <label for="page-range" class="block mb-2 text-sm font-medium text-gray-300">Pages to Divide</label>
-                    <input type="text" id="page-range"
-                        class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5"
-                        placeholder="e.g. 1-5, 8, 11-13 (leave blank for all pages)">
-                    <p class="mt-1 text-xs text-gray-400">Enter page numbers separated by commas or ranges with hyphens.
-                    </p>
-                </div>
-
-                <div class="mb-4">
-                    <label for="split-type" class="block mb-2 text-sm font-medium text-gray-300">Split Direction</label>
-                    <select id="split-type"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="vertical">Vertical (Left & Right)</option>
-                        <option value="horizontal">Horizontal (Top & Bottom)</option>
-                    </select>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Divide Pages</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:dividePages.name">Divide Pages Free Online - Fast
+        & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:dividePages.subtitle">
+        Split each page of your PDF horizontally or vertically, turning one page into two.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
+          <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
+          <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
+            <li><strong>Vertical:</strong> Split each page into left and right halves.</li>
+            <li><strong>Horizontal:</strong> Split each page into top and bottom halves.</li>
+            <li>Specify which pages to divide. Other pages will be kept as-is.</li>
+            <li>Leave blank or use "all" to divide all pages.</li>
+          </ul>
+        </div>
+
+        <div class="mb-4">
+          <label for="page-range" class="block mb-2 text-sm font-medium text-gray-300">Pages to Divide</label>
+          <input type="text" id="page-range"
+            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5"
+            placeholder="e.g. 1-5, 8, 11-13 (leave blank for all pages)">
+          <p class="mt-1 text-xs text-gray-400">Enter page numbers separated by commas or ranges with hyphens.
+          </p>
+        </div>
+
+        <div class="mb-4">
+          <label for="split-type" class="block mb-2 text-sm font-medium text-gray-300">Split Direction</label>
+          <select id="split-type" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="vertical">Vertical (Left & Right)</option>
+            <option value="horizontal">Horizontal (Top & Bottom)</option>
+          </select>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Divide Pages</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -235,26 +238,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -267,14 +275,16 @@
           Is divide pages really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -286,73 +296,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/divide-pages-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/divide-pages-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -374,7 +383,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -403,7 +412,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/edit-attachments.html b/src/pages/edit-attachments.html
index c02c044..06e3e69 100644
--- a/src/pages/edit-attachments.html
+++ b/src/pages/edit-attachments.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Edit Attachments Online Free - Edit Attachments Tool | BentoPDF</title>
   <meta name="title" content="Edit Attachments Online Free - Edit Attachments Tool | BentoPDF">
-  <meta name="description" content="★ Edit Attachments online free - Edit attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Edit Attachments online free - Edit attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="edit attachments, edit attachments, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/edit-attachments">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/edit-attachments">
   <meta property="og:title" content="Edit Attachments Online Free - Edit Attachments Tool | BentoPDF">
-  <meta property="og:description" content="★ Edit Attachments online free - Edit attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Edit Attachments online free - Edit attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-edit-attachments.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/edit-attachments">
   <meta name="twitter:title" content="Edit Attachments Free">
-  <meta name="twitter:description" content="★ Edit Attachments online free - Edit attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
+  <meta name="twitter:description"
+    content="★ Edit Attachments online free - Edit attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-edit-attachments.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Edit Attachments">
-  
 
-    <title>Edit Attachments - BentoPDF</title>
-    <meta name="description"
-        content="View and remove attachments from your PDF documents. Manage embedded files easily. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/edit-attachments.html" />
-    <link rel="alternate" hreflang="de" href="/de/edit-attachments.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/edit-attachments.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/edit-attachments.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Edit Attachments - BentoPDF</title>
+  <meta name="description"
+    content="View and remove attachments from your PDF documents. Manage embedded files easily. Free, secure, and runs entirely in your browser.">
+
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/edit-attachments.html" />
+  <link rel="alternate" hreflang="de" href="/de/edit-attachments.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/edit-attachments.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/edit-attachments.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,141 +68,143 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:editAttachments.name">Edit Attachments Free Online - Edit PDFs Securely</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:editAttachments.subtitle">
-                Upload a PDF to view and remove its embedded attachments.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <h2 class="text-lg font-semibold text-white mb-3">Attachments</h2>
-                <div id="attachments-list" class="space-y-2"></div>
-                <button id="process-btn" class="hidden btn-gradient w-full mt-4">Save Changes</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:editAttachments.name">Edit Attachments Free Online
+        - Edit PDFs Securely</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:editAttachments.subtitle">
+        Upload a PDF to view and remove its embedded attachments.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <h2 class="text-lg font-semibold text-white mb-3">Attachments</h2>
+        <div id="attachments-list" class="space-y-2"></div>
+        <button id="process-btn" class="hidden btn-gradient w-full mt-4">Save Changes</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -207,26 +212,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -239,14 +249,16 @@
           Is edit attachments really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -258,74 +270,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/edit-attachments-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/edit-attachments-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -347,7 +358,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -376,7 +387,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/edit-metadata.html b/src/pages/edit-metadata.html
index 4f42e7d..e44ac6b 100644
--- a/src/pages/edit-metadata.html
+++ b/src/pages/edit-metadata.html
@@ -2,56 +2,59 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Edit Metadata Online Free - Edit Metadata Tool | BentoPDF</title>
   <meta name="title" content="Edit Metadata Online Free - Edit Metadata Tool | BentoPDF">
-  <meta name="description" content="★ Edit Metadata online free - Edit metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Edit Metadata online free - Edit metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="edit metadata, edit metadata, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/edit-metadata">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/edit-metadata">
   <meta property="og:title" content="Edit Metadata Online Free - Edit Metadata Tool | BentoPDF">
-  <meta property="og:description" content="★ Edit Metadata online free - Edit metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Edit Metadata online free - Edit metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-edit-metadata.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/edit-metadata">
   <meta name="twitter:title" content="Edit Metadata Free">
-  <meta name="twitter:description" content="★ Edit Metadata online free - Edit metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Edit Metadata online free - Edit metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-edit-metadata.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Edit Metadata">
-  
 
-    <title>Edit PDF Metadata - BentoPDF</title>
-    <meta name="description"
-        content="Edit PDF metadata including title, author, subject, keywords, and custom fields. Free, secure, and runs entirely in your browser.">
-    
-    
-    
-    
-    <link rel="alternate" hreflang="en" href="/en/edit-metadata.html" />
-    <link rel="alternate" hreflang="de" href="/de/edit-metadata.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/edit-metadata.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/edit-metadata.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Edit PDF Metadata - BentoPDF</title>
+  <meta name="description"
+    content="Edit PDF metadata including title, author, subject, keywords, and custom fields. Free, secure, and runs entirely in your browser.">
+
+
+
+
+  <link rel="alternate" hreflang="en" href="/en/edit-metadata.html" />
+  <link rel="alternate" hreflang="de" href="/de/edit-metadata.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/edit-metadata.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/edit-metadata.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,202 +68,202 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:editMetadata.name">Edit Metadata Free Online - Edit PDFs Securely</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:editMetadata.subtitle">
-                Edit metadata fields in your PDF document including title, author, subject, and keywords.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <h2 class="text-lg font-semibold text-white mb-4">Edit Metadata</h2>
-
-                <div class="space-y-4">
-                    <div>
-                        <label for="meta-title" class="block mb-2 text-sm font-medium text-gray-300">Title</label>
-                        <input type="text" id="meta-title"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                    </div>
-                    <div>
-                        <label for="meta-author" class="block mb-2 text-sm font-medium text-gray-300">Author</label>
-                        <input type="text" id="meta-author"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                    </div>
-                    <div>
-                        <label for="meta-subject" class="block mb-2 text-sm font-medium text-gray-300">Subject</label>
-                        <input type="text" id="meta-subject"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                    </div>
-                    <div>
-                        <label for="meta-keywords" class="block mb-2 text-sm font-medium text-gray-300">Keywords
-                            (comma-separated)</label>
-                        <input type="text" id="meta-keywords"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                    </div>
-                    <div>
-                        <label for="meta-creator" class="block mb-2 text-sm font-medium text-gray-300">Creator</label>
-                        <input type="text" id="meta-creator"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                    </div>
-                    <div>
-                        <label for="meta-producer" class="block mb-2 text-sm font-medium text-gray-300">Producer</label>
-                        <input type="text" id="meta-producer"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                    </div>
-                    <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                        <div>
-                            <label for="meta-creation-date"
-                                class="block mb-2 text-sm font-medium text-gray-300">Creation Date</label>
-                            <input type="datetime-local" id="meta-creation-date"
-                                class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                        </div>
-                        <div>
-                            <label for="meta-mod-date" class="block mb-2 text-sm font-medium text-gray-300">Modification
-                                Date</label>
-                            <input type="datetime-local" id="meta-mod-date"
-                                class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Custom Fields Section -->
-                <div class="mt-6">
-                    <h3 class="text-md font-semibold text-white mb-2">Custom Fields</h3>
-                    <p class="text-xs text-gray-400 mb-3">Note: Custom fields are not supported by all PDF readers.</p>
-                    <div id="custom-fields-container" class="space-y-3"></div>
-                    <button id="add-custom-field" type="button"
-                        class="flex items-center gap-2 mt-3 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm">
-                        <i data-lucide="plus" class="w-4 h-4"></i> Add Custom Field
-                    </button>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-6">Save Metadata</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:editMetadata.name">Edit Metadata Free Online -
+        Edit PDFs Securely</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:editMetadata.subtitle">
+        Edit metadata fields in your PDF document including title, author, subject, and keywords.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <h2 class="text-lg font-semibold text-white mb-4">Edit Metadata</h2>
+
+        <div class="space-y-4">
+          <div>
+            <label for="meta-title" class="block mb-2 text-sm font-medium text-gray-300">Title</label>
+            <input type="text" id="meta-title"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+          </div>
+          <div>
+            <label for="meta-author" class="block mb-2 text-sm font-medium text-gray-300">Author</label>
+            <input type="text" id="meta-author"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+          </div>
+          <div>
+            <label for="meta-subject" class="block mb-2 text-sm font-medium text-gray-300">Subject</label>
+            <input type="text" id="meta-subject"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+          </div>
+          <div>
+            <label for="meta-keywords" class="block mb-2 text-sm font-medium text-gray-300">Keywords
+              (comma-separated)</label>
+            <input type="text" id="meta-keywords"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+          </div>
+          <div>
+            <label for="meta-creator" class="block mb-2 text-sm font-medium text-gray-300">Creator</label>
+            <input type="text" id="meta-creator"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+          </div>
+          <div>
+            <label for="meta-producer" class="block mb-2 text-sm font-medium text-gray-300">Producer</label>
+            <input type="text" id="meta-producer"
+              class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+          </div>
+          <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+            <div>
+              <label for="meta-creation-date" class="block mb-2 text-sm font-medium text-gray-300">Creation Date</label>
+              <input type="datetime-local" id="meta-creation-date"
+                class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+            </div>
+            <div>
+              <label for="meta-mod-date" class="block mb-2 text-sm font-medium text-gray-300">Modification
+                Date</label>
+              <input type="datetime-local" id="meta-mod-date"
+                class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg focus:ring-indigo-500 focus:border-indigo-500 block w-full p-2.5">
+            </div>
+          </div>
+        </div>
+
+        <!-- Custom Fields Section -->
+        <div class="mt-6">
+          <h3 class="text-md font-semibold text-white mb-2">Custom Fields</h3>
+          <p class="text-xs text-gray-400 mb-3">Note: Custom fields are not supported by all PDF readers.</p>
+          <div id="custom-fields-container" class="space-y-3"></div>
+          <button id="add-custom-field" type="button"
+            class="flex items-center gap-2 mt-3 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm">
+            <i data-lucide="plus" class="w-4 h-4"></i> Add Custom Field
+          </button>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-6">Save Metadata</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -268,26 +271,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -300,14 +308,16 @@
           Is edit metadata really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -319,73 +329,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/edit-metadata-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/edit-metadata-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -407,7 +416,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -436,7 +445,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/edit-pdf.html b/src/pages/edit-pdf.html
index ad91dac..e698568 100644
--- a/src/pages/edit-pdf.html
+++ b/src/pages/edit-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Edit PDF Online Free - Edit PDF Tool | BentoPDF</title>
   <meta name="title" content="Edit PDF Online Free - Edit PDF Tool | BentoPDF">
-  <meta name="description" content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="edit pdf, pdf editor, modify pdf, change pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/edit-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/edit-pdf">
   <meta property="og:title" content="Edit PDF Online Free - Edit PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-edit-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/edit-pdf">
   <meta name="twitter:title" content="Edit PDF Free">
-  <meta name="twitter:description" content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secu">
+  <meta name="twitter:description"
+    content="★ Edit PDF online free - Edit PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secu">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-edit-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Edit PDF">
-  
 
-    <title>PDF Editor - BentoPDF</title>
-    <meta name="description"
-        content="Annotate, highlight, redact, comment, add shapes/images, search, and view PDFs. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/edit-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/edit-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/edit-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/edit-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF Editor - BentoPDF</title>
+  <meta name="description"
+    content="Annotate, highlight, redact, comment, add shapes/images, search, and view PDFs. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/edit-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/edit-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/edit-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/edit-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,144 +66,145 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-blue-400 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfEditor.name">Edit PDF Free Online - Modify PDFs Securely</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfEditor.subtitle">
-                Annotate, highlight, redact, comment, add shapes/images, search, and view PDFs.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="embed-pdf-wrapper" class="hidden mt-6">
-                <div id="embed-pdf-container" class="w-full h-[75vh] border border-gray-600 rounded-lg"></div>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-blue-400 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfEditor.name">Edit PDF Free Online - Modify PDFs
+        Securely</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfEditor.subtitle">
+        Annotate, highlight, redact, comment, add shapes/images, search, and view PDFs.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="embed-pdf-wrapper" class="hidden mt-6">
+        <div id="embed-pdf-container" class="w-full h-[75vh] border border-gray-600 rounded-lg"></div>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -208,26 +212,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-        <a href="/delete-pages.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
-        <a href="/add-watermark.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Add Watermark</h3>
-          <p class="text-gray-400 text-sm">Free online add watermark tool</p>
-        </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
+      <a href="/delete-pages.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+        <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+      </a>
+      <a href="/add-watermark.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Add Watermark</h3>
+        <p class="text-gray-400 text-sm">Free online add watermark tool</p>
+      </a>
     </div>
   </section>
 
@@ -240,14 +249,16 @@
           Is edit pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -259,96 +270,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/edit-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/edit-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -370,7 +380,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -399,7 +409,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/encrypt-pdf.html b/src/pages/encrypt-pdf.html
index 6d9aa09..96cb493 100644
--- a/src/pages/encrypt-pdf.html
+++ b/src/pages/encrypt-pdf.html
@@ -2,53 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Encrypt PDF Online Free - Encrypt PDF Tool | BentoPDF</title>
   <meta name="title" content="Encrypt PDF Online Free - Encrypt PDF Tool | BentoPDF">
-  <meta name="description" content="★ Encrypt PDF online free - Encrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Encrypt PDF online free - Encrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="encrypt pdf, password protect pdf, secure pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/encrypt-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/encrypt-pdf">
   <meta property="og:title" content="Encrypt PDF Online Free - Encrypt PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Encrypt PDF online free - Encrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Encrypt PDF online free - Encrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-encrypt-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/encrypt-pdf">
   <meta name="twitter:title" content="Encrypt PDF Free">
-  <meta name="twitter:description" content="★ Encrypt PDF online free - Encrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast ">
+  <meta name="twitter:description"
+    content="★ Encrypt PDF online free - Encrypt PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-encrypt-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Encrypt PDF">
-  
 
-    <title>Encrypt PDF - Password Protect Your PDFs - BentoPDF</title>
-    <meta name="description"
-        content="Encrypt PDF files with 256-bit AES encryption. Add password protection and set usage restrictions. Free, secure, and runs entirely in your browser.">
- 
-    <link rel="alternate" hreflang="en" href="/en/encrypt-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/encrypt-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/encrypt-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/encrypt-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Encrypt PDF - Password Protect Your PDFs - BentoPDF</title>
+  <meta name="description"
+    content="Encrypt PDF files with 256-bit AES encryption. Add password protection and set usage restrictions. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/encrypt-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/encrypt-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/encrypt-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/encrypt-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -62,167 +65,168 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:encryptPdf.name">Encrypt PDF Free - Password Protect PDFs</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:encryptPdf.subtitle">
-                Protect your PDF with 256-bit AES encryption. Add password protection and set usage restrictions.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6 space-y-4">
-                <div>
-                    <label for="user-password-input" class="block mb-2 text-sm font-medium text-gray-300">User Password
-                        (Required)</label>
-                    <input type="password" id="user-password-input" placeholder="Enter password to open PDF"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    <p class="text-xs text-gray-500 mt-1">This password will be required to open the PDF.</p>
-                </div>
-
-                <div>
-                    <label for="owner-password-input" class="block mb-2 text-sm font-medium text-gray-300">Owner
-                        Password (Optional)</label>
-                    <input type="password" id="owner-password-input"
-                        placeholder="Enter password for permissions (optional)"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    <p class="text-xs text-gray-500 mt-1">If provided, usage restrictions will be applied. Leave empty
-                        for no restrictions.</p>
-                </div>
-
-                <div class="p-4 bg-gray-900 rounded-lg border border-gray-700">
-                    <h3 class="text-sm font-semibold text-white mb-2">Encryption Details:</h3>
-                    <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
-                        <li>256-bit AES encryption (highest security)</li>
-                        <li>User password required to open PDF</li>
-                        <li>Owner password enables usage restrictions</li>
-                        <li>Without owner password: no restrictions applied</li>
-                    </ul>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Encrypt PDF</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:encryptPdf.name">Encrypt PDF Free - Password
+        Protect PDFs</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:encryptPdf.subtitle">
+        Protect your PDF with 256-bit AES encryption. Add password protection and set usage restrictions.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6 space-y-4">
+        <div>
+          <label for="user-password-input" class="block mb-2 text-sm font-medium text-gray-300">User Password
+            (Required)</label>
+          <input type="password" id="user-password-input" placeholder="Enter password to open PDF"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          <p class="text-xs text-gray-500 mt-1">This password will be required to open the PDF.</p>
+        </div>
+
+        <div>
+          <label for="owner-password-input" class="block mb-2 text-sm font-medium text-gray-300">Owner
+            Password (Optional)</label>
+          <input type="password" id="owner-password-input" placeholder="Enter password for permissions (optional)"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          <p class="text-xs text-gray-500 mt-1">If provided, usage restrictions will be applied. Leave empty
+            for no restrictions.</p>
+        </div>
+
+        <div class="p-4 bg-gray-900 rounded-lg border border-gray-700">
+          <h3 class="text-sm font-semibold text-white mb-2">Encryption Details:</h3>
+          <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
+            <li>256-bit AES encryption (highest security)</li>
+            <li>User password required to open PDF</li>
+            <li>Owner password enables usage restrictions</li>
+            <li>Without owner password: no restrictions applied</li>
+          </ul>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Encrypt PDF</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -230,26 +234,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -262,14 +271,16 @@
           Is encrypt pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -281,74 +292,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/encrypt-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/encrypt-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -370,7 +380,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -399,7 +409,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/epub-to-pdf.html b/src/pages/epub-to-pdf.html
index 9d3f3ee..c45a315 100644
--- a/src/pages/epub-to-pdf.html
+++ b/src/pages/epub-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Epub To Pdf Online Free - Epub To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Epub To Pdf Online Free - Epub To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Epub To Pdf online free - Epub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Epub To Pdf online free - Epub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="epub to pdf, epub to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/epub-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/epub-to-pdf">
   <meta property="og:title" content="Epub To Pdf Online Free - Epub To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Epub To Pdf online free - Epub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Epub To Pdf online free - Epub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-epub-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/epub-to-pdf">
   <meta name="twitter:title" content="Epub To Pdf Free">
-  <meta name="twitter:description" content="★ Epub To Pdf online free - Epub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Epub To Pdf online free - Epub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-epub-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Epub To Pdf">
-  
 
-    <title>EPUB to PDF - Convert EPUB to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert EPUB e-books to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/epub-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/epub-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/epub-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/epub-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>EPUB to PDF - Convert EPUB to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert EPUB e-books to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/epub-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/epub-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/epub-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/epub-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,155 +66,156 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:epubToPdf.name">Epub To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:epubToPdf.subtitle">
-                Convert EPUB e-books to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:epubToPdf.acceptedFormats">EPUB files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".epub,application/epub+zip" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:epubToPdf.convertButton">Convert
-                    to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:epubToPdf.name">Epub To Pdf Converter Free Online
+        - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:epubToPdf.subtitle">
+        Convert EPUB e-books to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:epubToPdf.acceptedFormats">EPUB files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".epub,application/epub+zip" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:epubToPdf.convertButton">Convert
+          to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -219,26 +223,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -251,14 +260,16 @@
           Is epub to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -270,96 +281,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/epub-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/epub-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -381,7 +391,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -410,7 +420,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/excel-to-pdf.html b/src/pages/excel-to-pdf.html
index da75e78..85d57ed 100644
--- a/src/pages/excel-to-pdf.html
+++ b/src/pages/excel-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Excel to PDF Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="Excel to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="excel to pdf, xlsx to pdf, spreadsheet to pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/excel-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/excel-to-pdf">
   <meta property="og:title" content="Excel to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-excel-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/excel-to-pdf">
   <meta name="twitter:title" content="Excel to PDF Free">
-  <meta name="twitter:description" content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
+  <meta name="twitter:description"
+    content="★ Excel to PDF online free - Convert Excel to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-excel-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Excel to PDF">
-  
 
-    <title>Excel to PDF - Convert XLSX, XLS to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Excel spreadsheets (XLSX, XLS, ODS, CSV) to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/excel-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/excel-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/excel-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/excel-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Excel to PDF - Convert XLSX, XLS to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Excel spreadsheets (XLSX, XLS, ODS, CSV) to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/excel-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/excel-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/excel-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/excel-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,157 +66,158 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:excelToPdf.name">Excel to PDF Converter Free - Convert XLSX Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:excelToPdf.subtitle">
-                Convert Excel spreadsheets (XLSX, XLS, ODS, CSV) to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:excelToPdf.acceptedFormats">XLSX, XLS, ODS, CSV
-                        files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".xls,.xlsx,.ods,.csv,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.oasis.opendocument.spreadsheet,text/csv"
-                    multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:excelToPdf.convertButton">Convert
-                    to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:excelToPdf.name">Excel to PDF Converter Free -
+        Convert XLSX Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:excelToPdf.subtitle">
+        Convert Excel spreadsheets (XLSX, XLS, ODS, CSV) to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:excelToPdf.acceptedFormats">XLSX, XLS, ODS, CSV
+            files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".xls,.xlsx,.ods,.csv,application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.oasis.opendocument.spreadsheet,text/csv"
+          multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:excelToPdf.convertButton">Convert
+          to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -221,26 +225,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/pdf-to-excel.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Excel</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to excel tool</p>
-        </a>
-        <a href="/word-to-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Word To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online word to pdf tool</p>
-        </a>
-        <a href="/csv-to-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Csv To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online csv to pdf tool</p>
-        </a>
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
+      <a href="/pdf-to-excel.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Excel</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to excel tool</p>
+      </a>
+      <a href="/word-to-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Word To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online word to pdf tool</p>
+      </a>
+      <a href="/csv-to-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Csv To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online csv to pdf tool</p>
+      </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -253,14 +262,16 @@
           Is excel to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -272,96 +283,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/excel-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/excel-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -383,7 +393,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -412,7 +422,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/extract-attachments.html b/src/pages/extract-attachments.html
index 1aa7214..5944dd8 100644
--- a/src/pages/extract-attachments.html
+++ b/src/pages/extract-attachments.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Extract Attachments Online Free - Extract Attachments Tool | BentoPDF</title>
   <meta name="title" content="Extract Attachments Online Free - Extract Attachments Tool | BentoPDF">
-  <meta name="description" content="★ Extract Attachments online free - Extract attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Extract Attachments online free - Extract attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="extract attachments, extract attachments, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/extract-attachments">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/extract-attachments">
   <meta property="og:title" content="Extract Attachments Online Free - Extract Attachments Tool | BentoPDF">
-  <meta property="og:description" content="★ Extract Attachments online free - Extract attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Extract Attachments online free - Extract attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-extract-attachments.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/extract-attachments">
   <meta name="twitter:title" content="Extract Attachments Free">
-  <meta name="twitter:description" content="★ Extract Attachments online free - Extract attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Work">
+  <meta name="twitter:description"
+    content="★ Extract Attachments online free - Extract attachments PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Work">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-extract-attachments.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Extract Attachments">
-  
 
-    <title>Extract Attachments from PDF - BentoPDF</title>
-    <meta name="description"
-        content="Extract all embedded attachments from your PDF documents. Download attachments as a ZIP file. Free, secure, and runs entirely in your browser.">  
-    <link rel="alternate" hreflang="en" href="/en/extract-attachments.html" />
-    <link rel="alternate" hreflang="de" href="/de/extract-attachments.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/extract-attachments.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/extract-attachments.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Extract Attachments from PDF - BentoPDF</title>
+  <meta name="description"
+    content="Extract all embedded attachments from your PDF documents. Download attachments as a ZIP file. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/extract-attachments.html" />
+  <link rel="alternate" hreflang="de" href="/de/extract-attachments.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/extract-attachments.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/extract-attachments.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,141 +64,143 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:extractAttachments.name">Extract Attachments Free Online - Extract PDF Content</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:extractAttachments.subtitle">
-                Upload PDF files to extract all embedded attachments. Files will be downloaded as a ZIP archive.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDFs</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">Multiple PDF files supported</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div id="status-message" class="hidden mt-4 p-3 rounded-lg text-sm"></div>
-                <button id="process-btn" class="btn-gradient w-full mt-4">Extract Attachments</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:extractAttachments.name">Extract Attachments Free
+        Online - Extract PDF Content</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:extractAttachments.subtitle">
+        Upload PDF files to extract all embedded attachments. Files will be downloaded as a ZIP archive.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDFs</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">Multiple PDF files supported</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div id="status-message" class="hidden mt-4 p-3 rounded-lg text-sm"></div>
+        <button id="process-btn" class="btn-gradient w-full mt-4">Extract Attachments</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -203,26 +208,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -235,14 +245,16 @@
           Is extract attachments really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -254,74 +266,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/extract-attachments-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/extract-attachments-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -343,7 +354,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -372,7 +383,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/extract-images.html b/src/pages/extract-images.html
index 82b6909..3ee2c93 100644
--- a/src/pages/extract-images.html
+++ b/src/pages/extract-images.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Extract Images Online Free - Extract Images Tool | BentoPDF</title>
   <meta name="title" content="Extract Images Online Free - Extract Images Tool | BentoPDF">
-  <meta name="description" content="★ Extract Images online free - Extract images PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Extract Images online free - Extract images PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="extract images, extract images, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/extract-images">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/extract-images">
   <meta property="og:title" content="Extract Images Online Free - Extract Images Tool | BentoPDF">
-  <meta property="og:description" content="★ Extract Images online free - Extract images PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Extract Images online free - Extract images PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-extract-images.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/extract-images">
   <meta name="twitter:title" content="Extract Images Free">
-  <meta name="twitter:description" content="★ Extract Images online free - Extract images PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
+  <meta name="twitter:description"
+    content="★ Extract Images online free - Extract images PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-extract-images.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Extract Images">
-  
 
-    <title>Extract Images from PDF - BentoPDF</title>
-    <meta name="description"
-        content="Extract all images from PDF files. Download individual images or all as a ZIP. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/extract-images.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/extract-images.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Extract Images from PDF - BentoPDF</title>
+  <meta name="description"
+    content="Extract all images from PDF files. Download individual images or all as a ZIP. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/extract-images.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/extract-images.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,162 +64,163 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer">Back to Tools</span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">Extract Images Free Online - Extract PDF Content</h1>
-            <p class="text-gray-400 mb-6">
-                Extract all embedded images from PDF files. Download individually or as a ZIP archive.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span>
-                        or drag and drop
-                    </p>
-                    <p class="text-xs text-gray-500">One or more PDF files</p>
-                    <p class="text-xs text-gray-500">Your files never leave your device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span>Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span>Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="extract-options" class="hidden mt-6 space-y-6">
-                <button id="process-btn" class="btn-gradient w-full mt-4">Extract Images</button>
-            </div>
-
-            <div id="images-container" class="hidden mt-8">
-                <div class="flex justify-between items-center mb-4">
-                    <h2 class="text-xl font-bold text-white">Extracted Images</h2>
-                    <button id="download-all-btn"
-                        class="btn bg-green-600 hover:bg-green-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                        <i data-lucide="download"></i> <span>Download All (ZIP)</span>
-                    </button>
-                </div>
-                <div id="images-grid" class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4"></div>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer">Back to Tools</span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">Extract Images Free Online - Extract PDF Content</h1>
+      <p class="text-gray-400 mb-6">
+        Extract all embedded images from PDF files. Download individually or as a ZIP archive.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span>
+            or drag and drop
+          </p>
+          <p class="text-xs text-gray-500">One or more PDF files</p>
+          <p class="text-xs text-gray-500">Your files never leave your device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span>Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span>Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="extract-options" class="hidden mt-6 space-y-6">
+        <button id="process-btn" class="btn-gradient w-full mt-4">Extract Images</button>
+      </div>
+
+      <div id="images-container" class="hidden mt-8">
+        <div class="flex justify-between items-center mb-4">
+          <h2 class="text-xl font-bold text-white">Extracted Images</h2>
+          <button id="download-all-btn"
+            class="btn bg-green-600 hover:bg-green-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+            <i data-lucide="download"></i> <span>Download All (ZIP)</span>
+          </button>
+        </div>
+        <div id="images-grid" class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4"></div>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -224,26 +228,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -256,14 +265,16 @@
           Is extract images really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -275,77 +286,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/extract-images-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/extract-images-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -367,7 +377,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -396,7 +406,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/extract-pages.html b/src/pages/extract-pages.html
index 0ce6dab..e8c194f 100644
--- a/src/pages/extract-pages.html
+++ b/src/pages/extract-pages.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Extract Pages Online Free - Extract Pages Tool | BentoPDF</title>
   <meta name="title" content="Extract Pages Online Free - Extract Pages Tool | BentoPDF">
-  <meta name="description" content="★ Extract Pages online free - Extract pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Extract Pages online free - Extract pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="extract pages, extract pages, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/extract-pages">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/extract-pages">
   <meta property="og:title" content="Extract Pages Online Free - Extract Pages Tool | BentoPDF">
-  <meta property="og:description" content="★ Extract Pages online free - Extract pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Extract Pages online free - Extract pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-extract-pages.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/extract-pages">
   <meta name="twitter:title" content="Extract Pages Free">
-  <meta name="twitter:description" content="★ Extract Pages online free - Extract pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Extract Pages online free - Extract pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-extract-pages.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Extract Pages">
-  
 
-    <title>Extract PDF Pages - BentoPDF</title>
-    <meta name="description"
-        content="Extract specific pages from a PDF into separate files. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/extract-pages.html" />
-    <link rel="alternate" hreflang="de" href="/de/extract-pages.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/extract-pages.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/extract-pages.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Extract PDF Pages - BentoPDF</title>
+  <meta name="description"
+    content="Extract specific pages from a PDF into separate files. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/extract-pages.html" />
+  <link rel="alternate" hreflang="de" href="/de/extract-pages.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/extract-pages.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/extract-pages.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,154 +66,155 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
 
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:extractPages.name">Extract PDF Pages Free - Copy Pages Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:extractPages.subtitle">
-                Extract specific pages from a PDF into separate files. Your files will download in a ZIP archive.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF Documents</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <!-- File Display -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Extract Options (shown after file upload) -->
-            <div id="extract-options" class="hidden mt-6">
-                <p class="mb-2 font-medium text-white">Total Pages: <span id="total-pages"></span></p>
-                <label for="pages-to-extract" class="block mb-2 text-sm font-medium text-gray-300">Enter pages to
-                    extract (e.g., 2, 4-6, 9):</label>
-                <input type="text" id="pages-to-extract"
-                    class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 mb-6"
-                    placeholder="e.g., 2, 4-6, 9">
-                <button id="process-btn" class="btn-gradient w-full">Extract & Download ZIP</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:extractPages.name">Extract PDF Pages Free - Copy
+        Pages Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:extractPages.subtitle">
+        Extract specific pages from a PDF into separate files. Your files will download in a ZIP archive.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF Documents</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <!-- File Display -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Extract Options (shown after file upload) -->
+      <div id="extract-options" class="hidden mt-6">
+        <p class="mb-2 font-medium text-white">Total Pages: <span id="total-pages"></span></p>
+        <label for="pages-to-extract" class="block mb-2 text-sm font-medium text-gray-300">Enter pages to
+          extract (e.g., 2, 4-6, 9):</label>
+        <input type="text" id="pages-to-extract"
+          class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 mb-6"
+          placeholder="e.g., 2, 4-6, 9">
+        <button id="process-btn" class="btn-gradient w-full">Extract & Download ZIP</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -218,26 +222,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -250,14 +259,16 @@
           Is extract pages really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -269,84 +280,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/extract-pages-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/extract-pages-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -368,7 +378,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -397,7 +407,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/extract-tables.html b/src/pages/extract-tables.html
index f36ba39..fd1fd66 100644
--- a/src/pages/extract-tables.html
+++ b/src/pages/extract-tables.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Extract Tables Online Free - Extract Tables Tool | BentoPDF</title>
   <meta name="title" content="Extract Tables Online Free - Extract Tables Tool | BentoPDF">
-  <meta name="description" content="★ Extract Tables online free - Extract tables PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Extract Tables online free - Extract tables PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="extract tables, extract tables, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/extract-tables">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/extract-tables">
   <meta property="og:title" content="Extract Tables Online Free - Extract Tables Tool | BentoPDF">
-  <meta property="og:description" content="★ Extract Tables online free - Extract tables PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Extract Tables online free - Extract tables PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-extract-tables.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/extract-tables">
   <meta name="twitter:title" content="Extract Tables Free">
-  <meta name="twitter:description" content="★ Extract Tables online free - Extract tables PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
+  <meta name="twitter:description"
+    content="★ Extract Tables online free - Extract tables PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-extract-tables.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Extract Tables">
-  
 
-    <title>Extract PDF Tables - BentoPDF</title>
-    <meta name="description"
-        content="Extract tables from PDF files and export as CSV, JSON, or Markdown. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/extract-tables.html" />
-    <link rel="alternate" hreflang="de" href="/de/extract-tables.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/extract-tables.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/extract-tables.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/extract-tables.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Extract PDF Tables - BentoPDF</title>
+  <meta name="description"
+    content="Extract tables from PDF files and export as CSV, JSON, or Markdown. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/extract-tables.html" />
+  <link rel="alternate" hreflang="de" href="/de/extract-tables.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/extract-tables.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/extract-tables.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/extract-tables.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,155 +67,156 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:extractTables.name">Extract Tables Free Online - Extract PDF Content</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:extractTables.subtitle">
-                Extract tables from PDF files and export as CSV, JSON, or Markdown.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-4">
-                <div>
-                    <label class="block mb-2 text-sm font-medium text-gray-300">Export Format</label>
-                    <div class="flex gap-3 flex-wrap">
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="radio" name="export-format" value="csv" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">CSV</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="radio" name="export-format" value="json"
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">JSON</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="radio" name="export-format" value="markdown"
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Markdown</span>
-                        </label>
-                    </div>
-                </div>
-                <button id="process-btn" class="btn-gradient w-full">Extract Tables</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:extractTables.name">Extract Tables Free Online -
+        Extract PDF Content</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:extractTables.subtitle">
+        Extract tables from PDF files and export as CSV, JSON, or Markdown.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-4">
+        <div>
+          <label class="block mb-2 text-sm font-medium text-gray-300">Export Format</label>
+          <div class="flex gap-3 flex-wrap">
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="radio" name="export-format" value="csv" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">CSV</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="radio" name="export-format" value="json"
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">JSON</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="radio" name="export-format" value="markdown"
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Markdown</span>
+            </label>
+          </div>
+        </div>
+        <button id="process-btn" class="btn-gradient w-full">Extract Tables</button>
+      </div>
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -220,26 +224,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -252,14 +261,16 @@
           Is extract tables really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -271,73 +282,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/extract-tables-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/extract-tables-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -359,7 +369,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -388,7 +398,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/fb2-to-pdf.html b/src/pages/fb2-to-pdf.html
index cf2c667..5883542 100644
--- a/src/pages/fb2-to-pdf.html
+++ b/src/pages/fb2-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Fb2 To Pdf Online Free - Fb2 To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Fb2 To Pdf Online Free - Fb2 To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Fb2 To Pdf online free - Fb2 to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Fb2 To Pdf online free - Fb2 to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="fb2 to pdf, fb2 to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/fb2-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/fb2-to-pdf">
   <meta property="og:title" content="Fb2 To Pdf Online Free - Fb2 To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Fb2 To Pdf online free - Fb2 to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Fb2 To Pdf online free - Fb2 to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-fb2-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/fb2-to-pdf">
   <meta name="twitter:title" content="Fb2 To Pdf Free">
-  <meta name="twitter:description" content="★ Fb2 To Pdf online free - Fb2 to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Fb2 To Pdf online free - Fb2 to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-fb2-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Fb2 To Pdf">
-  
 
-    <title>FB2 to PDF - Convert XPS/OFB2 to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert XPS and OXPS documents to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/fb2-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/fb2-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/fb2-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/fb2-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>FB2 to PDF - Convert XPS/OFB2 to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert XPS and OXPS documents to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/fb2-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/fb2-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/fb2-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/fb2-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,153 +66,154 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:fb2ToPdf.name">Fb2 To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:fb2ToPdf.subtitle">
-                Convert FictionBook (FB2) e-books to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:fb2ToPdf.acceptedFormats">FB2 files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".fb2,application/x-fictionbook+xml,text/xml" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6"
-                data-i18n="tools:fb2ToPdf.convertButton">Convert to PDF</button>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:fb2ToPdf.name">Fb2 To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:fb2ToPdf.subtitle">
+        Convert FictionBook (FB2) e-books to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:fb2ToPdf.acceptedFormats">FB2 files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".fb2,application/x-fictionbook+xml,text/xml" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6" data-i18n="tools:fb2ToPdf.convertButton">Convert
+        to PDF</button>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -217,26 +221,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -249,14 +258,16 @@
           Is fb2 to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -268,96 +279,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/fb2-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/fb2-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -379,7 +389,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -408,7 +418,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/fix-page-size.html b/src/pages/fix-page-size.html
index 3cd54a8..fb209b9 100644
--- a/src/pages/fix-page-size.html
+++ b/src/pages/fix-page-size.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Fix Page Size Online Free - Fix Page Size Tool | BentoPDF</title>
   <meta name="title" content="Fix Page Size Online Free - Fix Page Size Tool | BentoPDF">
-  <meta name="description" content="★ Fix Page Size online free - Fix page size PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Fix Page Size online free - Fix page size PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="fix page size, fix page size, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/fix-page-size">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/fix-page-size">
   <meta property="og:title" content="Fix Page Size Online Free - Fix Page Size Tool | BentoPDF">
-  <meta property="og:description" content="★ Fix Page Size online free - Fix page size PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Fix Page Size online free - Fix page size PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-fix-page-size.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/fix-page-size">
   <meta name="twitter:title" content="Fix Page Size Free">
-  <meta name="twitter:description" content="★ Fix Page Size online free - Fix page size PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Fix Page Size online free - Fix page size PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-fix-page-size.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Fix Page Size">
-  
 
-    <title>Fix Page Size - Standardize PDF Pages - BentoPDF</title>
-    <meta name="description"
-        content="Standardize all pages in your PDF to a uniform size. Choose from standard sizes or set custom dimensions. Free, secure, and runs entirely in your browser.">  
-    <link rel="alternate" hreflang="en" href="/en/fix-page-size.html" />
-    <link rel="alternate" hreflang="de" href="/de/fix-page-size.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/fix-page-size.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/fix-page-size.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Fix Page Size - Standardize PDF Pages - BentoPDF</title>
+  <meta name="description"
+    content="Standardize all pages in your PDF to a uniform size. Choose from standard sizes or set custom dimensions. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/fix-page-size.html" />
+  <link rel="alternate" hreflang="de" href="/de/fix-page-size.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/fix-page-size.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/fix-page-size.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,229 +64,228 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:fixPageSize.name">Fix Page Size Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:fixPageSize.subtitle">
-                Standardize all pages in your PDF to a uniform size. Choose from standard sizes or set custom
-                dimensions.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Fix Page Size Options -->
-            <div id="tool-options" class="hidden mt-6 space-y-4">
-                <!-- Target Size -->
-                <div>
-                    <label for="target-size" class="block mb-2 text-sm font-medium text-gray-300">Target Page
-                        Size</label>
-                    <select id="target-size"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="A4">A4 (210 × 297 mm)</option>
-                        <option value="Letter">Letter (8.5 × 11 in)</option>
-                        <option value="Legal">Legal (8.5 × 14 in)</option>
-                        <option value="A3">A3 (297 × 420 mm)</option>
-                        <option value="A5">A5 (148 × 210 mm)</option>
-                        <option value="Tabloid">Tabloid (11 × 17 in)</option>
-                        <option value="Custom">Custom...</option>
-                    </select>
-                </div>
-
-                <!-- Custom Size (hidden by default) -->
-                <div id="custom-size-wrapper" class="hidden space-y-3">
-                    <div class="grid grid-cols-2 gap-3">
-                        <div>
-                            <label for="custom-width" class="block mb-1 text-xs font-medium text-gray-400">Width</label>
-                            <input type="number" id="custom-width" step="0.01" min="0.1" value="8.5"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm">
-                        </div>
-                        <div>
-                            <label for="custom-height"
-                                class="block mb-1 text-xs font-medium text-gray-400">Height</label>
-                            <input type="number" id="custom-height" step="0.01" min="0.1" value="11"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm">
-                        </div>
-                    </div>
-                    <div>
-                        <label for="custom-units" class="block mb-1 text-xs font-medium text-gray-400">Units</label>
-                        <select id="custom-units"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm">
-                            <option value="in">Inches</option>
-                            <option value="mm">Millimeters</option>
-                        </select>
-                    </div>
-                </div>
-
-                <!-- Orientation -->
-                <div>
-                    <label for="orientation" class="block mb-2 text-sm font-medium text-gray-300">Orientation</label>
-                    <select id="orientation"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="auto">Auto (Keep Original)</option>
-                        <option value="portrait">Portrait</option>
-                        <option value="landscape">Landscape</option>
-                    </select>
-                </div>
-
-                <!-- Scaling Mode -->
-                <div>
-                    <label class="block mb-2 text-sm font-medium text-gray-300">Content Scaling</label>
-                    <div class="flex gap-4 p-2 rounded-lg bg-gray-900">
-                        <label
-                            class="flex-1 flex items-center gap-2 p-3 rounded-md hover:bg-gray-700 cursor-pointer has-[:checked]:bg-indigo-600">
-                            <input type="radio" name="scaling-mode" value="fit" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                            <div>
-                                <span class="font-semibold text-white">Fit</span>
-                                <p class="text-xs text-gray-400">Preserves all content, may add margins.</p>
-                            </div>
-                        </label>
-                        <label
-                            class="flex-1 flex items-center gap-2 p-3 rounded-md hover:bg-gray-700 cursor-pointer has-[:checked]:bg-indigo-600">
-                            <input type="radio" name="scaling-mode" value="fill"
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                            <div>
-                                <span class="font-semibold text-white">Fill (Crop)</span>
-                                <p class="text-xs text-gray-400">Fills the page, may crop content.</p>
-                            </div>
-                        </label>
-                    </div>
-                </div>
-
-                <!-- Background Color -->
-                <div>
-                    <label for="background-color" class="block mb-2 text-sm font-medium text-gray-300">Background
-                        Color</label>
-                    <div class="flex items-center gap-3">
-                        <input type="color" id="background-color" value="#ffffff"
-                            class="h-10 w-20 rounded border border-gray-600 bg-gray-700 cursor-pointer">
-                        <span class="text-sm text-gray-400">Color for margins/padding</span>
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Fix Page Size</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:fixPageSize.name">Fix Page Size Free Online - Fast
+        & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:fixPageSize.subtitle">
+        Standardize all pages in your PDF to a uniform size. Choose from standard sizes or set custom
+        dimensions.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Fix Page Size Options -->
+      <div id="tool-options" class="hidden mt-6 space-y-4">
+        <!-- Target Size -->
+        <div>
+          <label for="target-size" class="block mb-2 text-sm font-medium text-gray-300">Target Page
+            Size</label>
+          <select id="target-size" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="A4">A4 (210 × 297 mm)</option>
+            <option value="Letter">Letter (8.5 × 11 in)</option>
+            <option value="Legal">Legal (8.5 × 14 in)</option>
+            <option value="A3">A3 (297 × 420 mm)</option>
+            <option value="A5">A5 (148 × 210 mm)</option>
+            <option value="Tabloid">Tabloid (11 × 17 in)</option>
+            <option value="Custom">Custom...</option>
+          </select>
+        </div>
+
+        <!-- Custom Size (hidden by default) -->
+        <div id="custom-size-wrapper" class="hidden space-y-3">
+          <div class="grid grid-cols-2 gap-3">
+            <div>
+              <label for="custom-width" class="block mb-1 text-xs font-medium text-gray-400">Width</label>
+              <input type="number" id="custom-width" step="0.01" min="0.1" value="8.5"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm">
+            </div>
+            <div>
+              <label for="custom-height" class="block mb-1 text-xs font-medium text-gray-400">Height</label>
+              <input type="number" id="custom-height" step="0.01" min="0.1" value="11"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm">
+            </div>
+          </div>
+          <div>
+            <label for="custom-units" class="block mb-1 text-xs font-medium text-gray-400">Units</label>
+            <select id="custom-units"
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm">
+              <option value="in">Inches</option>
+              <option value="mm">Millimeters</option>
+            </select>
+          </div>
+        </div>
+
+        <!-- Orientation -->
+        <div>
+          <label for="orientation" class="block mb-2 text-sm font-medium text-gray-300">Orientation</label>
+          <select id="orientation" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="auto">Auto (Keep Original)</option>
+            <option value="portrait">Portrait</option>
+            <option value="landscape">Landscape</option>
+          </select>
+        </div>
+
+        <!-- Scaling Mode -->
+        <div>
+          <label class="block mb-2 text-sm font-medium text-gray-300">Content Scaling</label>
+          <div class="flex gap-4 p-2 rounded-lg bg-gray-900">
+            <label
+              class="flex-1 flex items-center gap-2 p-3 rounded-md hover:bg-gray-700 cursor-pointer has-[:checked]:bg-indigo-600">
+              <input type="radio" name="scaling-mode" value="fit" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+              <div>
+                <span class="font-semibold text-white">Fit</span>
+                <p class="text-xs text-gray-400">Preserves all content, may add margins.</p>
+              </div>
+            </label>
+            <label
+              class="flex-1 flex items-center gap-2 p-3 rounded-md hover:bg-gray-700 cursor-pointer has-[:checked]:bg-indigo-600">
+              <input type="radio" name="scaling-mode" value="fill"
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+              <div>
+                <span class="font-semibold text-white">Fill (Crop)</span>
+                <p class="text-xs text-gray-400">Fills the page, may crop content.</p>
+              </div>
+            </label>
+          </div>
+        </div>
+
+        <!-- Background Color -->
+        <div>
+          <label for="background-color" class="block mb-2 text-sm font-medium text-gray-300">Background
+            Color</label>
+          <div class="flex items-center gap-3">
+            <input type="color" id="background-color" value="#ffffff"
+              class="h-10 w-20 rounded border border-gray-600 bg-gray-700 cursor-pointer">
+            <span class="text-sm text-gray-400">Color for margins/padding</span>
+          </div>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Fix Page Size</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -291,26 +293,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -323,14 +330,16 @@
           Is fix page size really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -342,74 +351,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/fix-page-size-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/fix-page-size-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -431,7 +439,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -460,7 +468,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/flatten-pdf.html b/src/pages/flatten-pdf.html
index fac5708..13b5e4d 100644
--- a/src/pages/flatten-pdf.html
+++ b/src/pages/flatten-pdf.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Flatten Pdf Online Free - Flatten Pdf Tool | BentoPDF</title>
   <meta name="title" content="Flatten Pdf Online Free - Flatten Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Flatten Pdf online free - Flatten pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Flatten Pdf online free - Flatten pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="flatten pdf, flatten pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/flatten-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/flatten-pdf">
   <meta property="og:title" content="Flatten Pdf Online Free - Flatten Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Flatten Pdf online free - Flatten pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Flatten Pdf online free - Flatten pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-flatten-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/flatten-pdf">
   <meta name="twitter:title" content="Flatten Pdf Free">
-  <meta name="twitter:description" content="★ Flatten Pdf online free - Flatten pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Flatten Pdf online free - Flatten pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-flatten-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Flatten Pdf">
-  
 
-    <title>Flatten PDF - Make Forms Non-Editable - BentoPDF</title>
-    <meta name="description"
-        content="Flatten PDF forms and annotations to make them non-editable. Convert interactive PDFs to static documents. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/flatten-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/flatten-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/flatten-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/flatten-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Flatten PDF - Make Forms Non-Editable - BentoPDF</title>
+  <meta name="description"
+    content="Flatten PDF forms and annotations to make them non-editable. Convert interactive PDFs to static documents. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/flatten-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/flatten-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/flatten-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/flatten-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,161 +64,163 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:flattenPdf.name">Flatten Pdf Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:flattenPdf.subtitle">
-                Make form fields and annotations non-editable by flattening them into the PDF.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDFs</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">Single or multiple PDF files supported</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <!-- Control buttons for multi-file uploads -->
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="p-4 bg-gray-900 rounded-lg border border-gray-700 mb-4">
-                    <h3 class="text-sm font-semibold text-white mb-2">What will be flattened:</h3>
-                    <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
-                        <li>Form fields (text fields, checkboxes, radio buttons, etc.)</li>
-                        <li>Annotations and comments</li>
-                        <li>Interactive elements</li>
-                    </ul>
-                    <p class="text-xs text-gray-500 mt-2">Note: Flattened content cannot be edited or filled out.</p>
-                </div>
-                <button id="process-btn" class="btn-gradient w-full">Flatten PDF(s)</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:flattenPdf.name">Flatten Pdf Free Online - Fast &
+        Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:flattenPdf.subtitle">
+        Make form fields and annotations non-editable by flattening them into the PDF.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDFs</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">Single or multiple PDF files supported</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <!-- Control buttons for multi-file uploads -->
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="p-4 bg-gray-900 rounded-lg border border-gray-700 mb-4">
+          <h3 class="text-sm font-semibold text-white mb-2">What will be flattened:</h3>
+          <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
+            <li>Form fields (text fields, checkboxes, radio buttons, etc.)</li>
+            <li>Annotations and comments</li>
+            <li>Interactive elements</li>
+          </ul>
+          <p class="text-xs text-gray-500 mt-2">Note: Flattened content cannot be edited or filled out.</p>
+        </div>
+        <button id="process-btn" class="btn-gradient w-full">Flatten PDF(s)</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -223,26 +228,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -255,14 +265,16 @@
           Is flatten pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -274,74 +286,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/flatten-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/flatten-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -363,7 +374,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -392,7 +403,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/form-creator.html b/src/pages/form-creator.html
index a800004..ff1e981 100644
--- a/src/pages/form-creator.html
+++ b/src/pages/form-creator.html
@@ -4,41 +4,44 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>Form Creator Online Free - Form Creator Tool | BentoPDF</title>
-  <meta name="title" content="Form Creator Online Free - Form Creator Tool | BentoPDF">
-  <meta name="description" content="★ Form Creator online free - Form creator PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta name="keywords" content="form creator, form creator, online pdf">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/form-creator">
-  
-  <!-- Open Graph / Facebook / LinkedIn -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/form-creator">
-  <meta property="og:title" content="Form Creator Online Free - Form Creator Tool | BentoPDF">
-  <meta property="og:description" content="★ Form Creator online free - Form creator PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-form-creator.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:url" content="https://www.bentopdf.com/form-creator">
-  <meta name="twitter:title" content="Form Creator Free">
-  <meta name="twitter:description" content="★ Form Creator online free - Form creator PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-form-creator.png">
-  <meta name="twitter:site" content="@BentoPDF">
-  
-  <!-- Mobile Web App -->
-  <meta name="mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-title" content="Form Creator">
-  
+
+    <!-- Primary Meta Tags -->
+    <title>Form Creator Online Free - Form Creator Tool | BentoPDF</title>
+    <meta name="title" content="Form Creator Online Free - Form Creator Tool | BentoPDF">
+    <meta name="description"
+        content="★ Form Creator online free - Form creator PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta name="keywords" content="form creator, form creator, online pdf">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/form-creator">
+
+    <!-- Open Graph / Facebook / LinkedIn -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/form-creator">
+    <meta property="og:title" content="Form Creator Online Free - Form Creator Tool | BentoPDF">
+    <meta property="og:description"
+        content="★ Form Creator online free - Form creator PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-form-creator.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="https://www.bentopdf.com/form-creator">
+    <meta name="twitter:title" content="Form Creator Free">
+    <meta name="twitter:description"
+        content="★ Form Creator online free - Form creator PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-form-creator.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+    <!-- Mobile Web App -->
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Form Creator">
+
 
     <title>Create PDF Form - BentoPDF</title>
     <link rel="alternate" hreflang="en" href="/en/form-creator.html" />
@@ -47,15 +50,15 @@
     <link rel="alternate" hreflang="x-default" href="/en/form-creator.html" />
     <link href="/src/css/styles.css" rel="stylesheet" />
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -63,7 +66,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -121,7 +124,8 @@
                 <span class="cursor-pointer">Back to Tools</span>
             </button>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:createPdfForm.name">Form Creator Free Online - Fast & Secure</h1>
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:createPdfForm.name">Form Creator Free Online
+                - Fast & Secure</h1>
             <p class="text-gray-400 mb-6" data-i18n="tools:createPdfForm.subtitle">
                 Upload an existing PDF or create a blank PDF to start adding form fields.
             </p>
@@ -371,105 +375,116 @@
         </div>
     </div>
 
-    
-  <!-- How It Works Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
-    <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
-        </div>
-    </div>
-  </section>
 
-  <!-- Related Tools Section -->
-  <section class="max-w-6xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
-    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-    </div>
-  </section>
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+                    <p class="text-gray-400">Click or drag and drop your file to begin</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+                    <p class="text-gray-400">Click the process button to start</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+                    <p class="text-gray-400">Save your processed file instantly</p>
+                </div>
+            </div>
+        </div>
+    </section>
 
-  <!-- FAQ Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-    <div class="space-y-4">
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Is form creator really free?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Are my files private and secure?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Is there a file size limit?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">No! Process files of any size, as many times as you want, completely free.</p>
-      </details>
-    </div>
-  </section>
-  <footer class="mt-16 border-t-2 border-gray-700 py-8">
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/merge-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+            </a>
+            <a href="/compress-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+            </a>
+            <a href="/split-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+            </a>
+            <a href="/edit-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+            </a>
+            <a href="/rotate-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is form creator really free?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and
+                    unlimited file processing.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Are my files private and secure?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave
+                    your device, ensuring complete privacy.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is there a file size limit?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No! Process files of any size, as many times as you want, completely free.
+                </p>
+            </details>
+        </div>
+    </section>
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
                     <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
+                        &copy; 2026 BentoPDF. All rights reserved.
                     </p>
                     <p class="text-gray-500 text-xs mt-2">
                         Version <span id="app-version"></span>
@@ -567,8 +582,8 @@
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
 
-  <!-- JSON-LD Structured Data -->
-  <script type="application/ld+json">
+    <!-- JSON-LD Structured Data -->
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "SoftwareApplication",
@@ -587,8 +602,8 @@
     }
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "HowTo",
@@ -616,8 +631,8 @@
     ]
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "BreadcrumbList",
diff --git a/src/pages/form-filler.html b/src/pages/form-filler.html
index 7735aa5..b40eead 100644
--- a/src/pages/form-filler.html
+++ b/src/pages/form-filler.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Form Filler Online Free - Form Filler Tool | BentoPDF</title>
   <meta name="title" content="Form Filler Online Free - Form Filler Tool | BentoPDF">
-  <meta name="description" content="★ Form Filler online free - Form filler PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Form Filler online free - Form filler PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="form filler, form filler, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/form-filler">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/form-filler">
   <meta property="og:title" content="Form Filler Online Free - Form Filler Tool | BentoPDF">
-  <meta property="og:description" content="★ Form Filler online free - Form filler PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Form Filler online free - Form filler PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-form-filler.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/form-filler">
   <meta name="twitter:title" content="Form Filler Free">
-  <meta name="twitter:description" content="★ Form Filler online free - Form filler PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Form Filler online free - Form filler PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-form-filler.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Form Filler">
-  
 
-    <title>PDF Form Filler - BentoPDF</title>
-    <meta name="description"
-        content="Fill PDF forms directly in your browser. Supports both standard AcroForms and legacy XFA forms. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/form-filler.html" />
-    <link rel="alternate" hreflang="de" href="/de/form-filler.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/form-filler.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/form-filler.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF Form Filler - BentoPDF</title>
+  <meta name="description"
+    content="Fill PDF forms directly in your browser. Supports both standard AcroForms and legacy XFA forms. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/form-filler.html" />
+  <link rel="alternate" hreflang="de" href="/de/form-filler.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/form-filler.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/form-filler.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,158 +66,159 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfFormFiller.name">Form Filler Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-4">
-                Upload a PDF with form fields. Fill them directly in the viewer below, then click the button to save and
-                download the filled form. Also supports XFA forms.
-            </p>
-
-            <div class="mb-6 p-3 bg-blue-900/20 border border-blue-700/50 rounded-lg">
-                <p class="text-sm text-blue-300">
-                    <strong>Note on XFA Forms:</strong> XFA (XML Forms Architecture) is a legacy format that's only
-                    supported by certain PDF viewers like BentoPDF and Firefox. If you open an XFA PDF in other software
-                    and see blank pages or no form fields, it means that viewer doesn't support XFA. To view and fill
-                    XFA
-                    forms properly, use Firefox or BentoPDF's Form Filler.
-                </p>
-            </div>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file with form fields</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="form-filler-options" class="hidden mt-6">
-                <div id="pdf-viewer-container"
-                    class="relative w-full overflow-auto bg-gray-900 rounded-lg border border-gray-600 min-h-[600px]">
-                    <!-- PDF.js viewer iframe will be loaded here -->
-                </div>
-                <button id="process-btn" class="btn-gradient w-full mt-4">Save & Download Filled Form</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfFormFiller.name">Form Filler Free Online - Fast
+        & Secure</h1>
+      <p class="text-gray-400 mb-4">
+        Upload a PDF with form fields. Fill them directly in the viewer below, then click the button to save and
+        download the filled form. Also supports XFA forms.
+      </p>
+
+      <div class="mb-6 p-3 bg-blue-900/20 border border-blue-700/50 rounded-lg">
+        <p class="text-sm text-blue-300">
+          <strong>Note on XFA Forms:</strong> XFA (XML Forms Architecture) is a legacy format that's only
+          supported by certain PDF viewers like BentoPDF and Firefox. If you open an XFA PDF in other software
+          and see blank pages or no form fields, it means that viewer doesn't support XFA. To view and fill
+          XFA
+          forms properly, use Firefox or BentoPDF's Form Filler.
+        </p>
+      </div>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file with form fields</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="form-filler-options" class="hidden mt-6">
+        <div id="pdf-viewer-container"
+          class="relative w-full overflow-auto bg-gray-900 rounded-lg border border-gray-600 min-h-[600px]">
+          <!-- PDF.js viewer iframe will be loaded here -->
+        </div>
+        <button id="process-btn" class="btn-gradient w-full mt-4">Save & Download Filled Form</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -222,26 +226,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -254,14 +263,16 @@
           Is form filler really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -273,77 +284,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/form-filler-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/form-filler-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -365,7 +375,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -394,7 +404,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/header-footer.html b/src/pages/header-footer.html
index 6887299..89e7b9f 100644
--- a/src/pages/header-footer.html
+++ b/src/pages/header-footer.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Header Footer Online Free - Header Footer Tool | BentoPDF</title>
   <meta name="title" content="Header Footer Online Free - Header Footer Tool | BentoPDF">
-  <meta name="description" content="★ Header Footer online free - Header footer PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Header Footer online free - Header footer PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="header footer, header footer, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/header-footer">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/header-footer">
   <meta property="og:title" content="Header Footer Online Free - Header Footer Tool | BentoPDF">
-  <meta property="og:description" content="★ Header Footer online free - Header footer PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Header Footer online free - Header footer PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-header-footer.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/header-footer">
   <meta name="twitter:title" content="Header Footer Free">
-  <meta name="twitter:description" content="★ Header Footer online free - Header footer PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Header Footer online free - Header footer PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-header-footer.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Header Footer">
-  
 
-    <title>Add Header & Footer - BentoPDF</title>
-    <meta name="description"
-        content="Add headers and footers to your PDF documents with dynamic page numbers. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/header-footer.html" />
-    <link rel="alternate" hreflang="de" href="/de/header-footer.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/header-footer.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/header-footer.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Add Header & Footer - BentoPDF</title>
+  <meta name="description"
+    content="Add headers and footers to your PDF documents with dynamic page numbers. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/header-footer.html" />
+  <link rel="alternate" hreflang="de" href="/de/header-footer.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/header-footer.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/header-footer.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,210 +66,211 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:headerFooter.name">Header Footer Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:headerFooter.subtitle">
-                Add customizable headers and footers to your PDF documents with dynamic page numbers.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-6">
-                <div class="bg-gray-900/50 border border-gray-700 rounded-lg p-4">
-                    <h3 class="text-sm font-semibold text-gray-300 mb-4">Formatting Options</h3>
-                    <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-4">
-                        <div>
-                            <label for="page-range" class="block mb-2 text-sm font-medium text-gray-300">Page Range
-                                (optional)</label>
-                            <input type="text" id="page-range" placeholder="e.g., 1-3, 5"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                            <p class="text-xs text-gray-400 mt-1">Total pages: <span id="total-pages">0</span></p>
-                        </div>
-                        <div>
-                            <label for="font-size" class="block mb-2 text-sm font-medium text-gray-300">Font
-                                Size</label>
-                            <input type="number" id="font-size" value="10" min="6" max="24"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        </div>
-                        <div>
-                            <label for="font-color" class="block mb-2 text-sm font-medium text-gray-300">Font
-                                Color</label>
-                            <input type="color" id="font-color" value="#000000"
-                                class="w-full h-[42px] bg-gray-700 border border-gray-600 rounded-lg p-1 cursor-pointer">
-                        </div>
-                    </div>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
-                    <div>
-                        <label for="header-left" class="block mb-2 text-sm font-medium text-gray-300">Header
-                            Left</label>
-                        <input type="text" id="header-left" placeholder=""
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    </div>
-                    <div>
-                        <label for="header-center" class="block mb-2 text-sm font-medium text-gray-300">Header
-                            Center</label>
-                        <input type="text" id="header-center" placeholder=""
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    </div>
-                    <div>
-                        <label for="header-right" class="block mb-2 text-sm font-medium text-gray-300">Header
-                            Right</label>
-                        <input type="text" id="header-right" placeholder=""
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    </div>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
-                    <div>
-                        <label for="footer-left" class="block mb-2 text-sm font-medium text-gray-300">Footer
-                            Left</label>
-                        <input type="text" id="footer-left" placeholder=""
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    </div>
-                    <div>
-                        <label for="footer-center" class="block mb-2 text-sm font-medium text-gray-300">Footer
-                            Center</label>
-                        <input type="text" id="footer-center" placeholder=""
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    </div>
-                    <div>
-                        <label for="footer-right" class="block mb-2 text-sm font-medium text-gray-300">Footer
-                            Right</label>
-                        <input type="text" id="footer-right" placeholder=""
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Add Header & Footer</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:headerFooter.name">Header Footer Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:headerFooter.subtitle">
+        Add customizable headers and footers to your PDF documents with dynamic page numbers.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-6">
+        <div class="bg-gray-900/50 border border-gray-700 rounded-lg p-4">
+          <h3 class="text-sm font-semibold text-gray-300 mb-4">Formatting Options</h3>
+          <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-4">
+            <div>
+              <label for="page-range" class="block mb-2 text-sm font-medium text-gray-300">Page Range
+                (optional)</label>
+              <input type="text" id="page-range" placeholder="e.g., 1-3, 5"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+              <p class="text-xs text-gray-400 mt-1">Total pages: <span id="total-pages">0</span></p>
+            </div>
+            <div>
+              <label for="font-size" class="block mb-2 text-sm font-medium text-gray-300">Font
+                Size</label>
+              <input type="number" id="font-size" value="10" min="6" max="24"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            </div>
+            <div>
+              <label for="font-color" class="block mb-2 text-sm font-medium text-gray-300">Font
+                Color</label>
+              <input type="color" id="font-color" value="#000000"
+                class="w-full h-[42px] bg-gray-700 border border-gray-600 rounded-lg p-1 cursor-pointer">
+            </div>
+          </div>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+          <div>
+            <label for="header-left" class="block mb-2 text-sm font-medium text-gray-300">Header
+              Left</label>
+            <input type="text" id="header-left" placeholder=""
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          </div>
+          <div>
+            <label for="header-center" class="block mb-2 text-sm font-medium text-gray-300">Header
+              Center</label>
+            <input type="text" id="header-center" placeholder=""
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          </div>
+          <div>
+            <label for="header-right" class="block mb-2 text-sm font-medium text-gray-300">Header
+              Right</label>
+            <input type="text" id="header-right" placeholder=""
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          </div>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+          <div>
+            <label for="footer-left" class="block mb-2 text-sm font-medium text-gray-300">Footer
+              Left</label>
+            <input type="text" id="footer-left" placeholder=""
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          </div>
+          <div>
+            <label for="footer-center" class="block mb-2 text-sm font-medium text-gray-300">Footer
+              Center</label>
+            <input type="text" id="footer-center" placeholder=""
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          </div>
+          <div>
+            <label for="footer-right" class="block mb-2 text-sm font-medium text-gray-300">Footer
+              Right</label>
+            <input type="text" id="footer-right" placeholder=""
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          </div>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Add Header & Footer</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -274,26 +278,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -306,14 +315,16 @@
           Is header footer really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -325,77 +336,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/header-footer-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/header-footer-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -417,7 +427,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -446,7 +456,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/heic-to-pdf.html b/src/pages/heic-to-pdf.html
index cbe961e..d97ffbf 100644
--- a/src/pages/heic-to-pdf.html
+++ b/src/pages/heic-to-pdf.html
@@ -2,53 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Heic To Pdf Online Free - Heic To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Heic To Pdf Online Free - Heic To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Heic To Pdf online free - Heic to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Heic To Pdf online free - Heic to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="heic to pdf, heic to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/heic-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/heic-to-pdf">
   <meta property="og:title" content="Heic To Pdf Online Free - Heic To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Heic To Pdf online free - Heic to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Heic To Pdf online free - Heic to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-heic-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/heic-to-pdf">
   <meta name="twitter:title" content="Heic To Pdf Free">
-  <meta name="twitter:description" content="★ Heic To Pdf online free - Heic to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Heic To Pdf online free - Heic to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-heic-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Heic To Pdf">
-  
 
-    <title>HEIC to PDF - BentoPDF</title>
-    <meta name="description" content="Convert HEIC images to PDF. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/heic-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/heic-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/heic-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/heic-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>HEIC to PDF - BentoPDF</title>
+  <meta name="description" content="Convert HEIC images to PDF. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/heic-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/heic-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/heic-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/heic-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -62,152 +65,154 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:heicToPdf.name">Heic To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:heicToPdf.subtitle">
-                Convert one or more HEIC (High Efficiency) images from your iPhone or camera into a single PDF file.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">HEIC/HEIF images</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".heic,.heif" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6">Convert to PDF</button>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:heicToPdf.name">Heic To Pdf Converter Free Online
+        - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:heicToPdf.subtitle">
+        Convert one or more HEIC (High Efficiency) images from your iPhone or camera into a single PDF file.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">HEIC/HEIF images</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".heic,.heif" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6">Convert to PDF</button>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -215,26 +220,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -247,14 +257,16 @@
           Is heic to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -266,84 +278,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/heic-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/heic-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -365,7 +376,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -394,7 +405,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/image-to-pdf.html b/src/pages/image-to-pdf.html
index 140b5c6..fba28f1 100644
--- a/src/pages/image-to-pdf.html
+++ b/src/pages/image-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Image To Pdf Online Free - Image To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Image To Pdf Online Free - Image To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Image To Pdf online free - Image to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Image To Pdf online free - Image to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="image to pdf, image to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/image-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/image-to-pdf">
   <meta property="og:title" content="Image To Pdf Online Free - Image To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Image To Pdf online free - Image to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Image To Pdf online free - Image to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-image-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/image-to-pdf">
   <meta name="twitter:title" content="Image To Pdf Free">
-  <meta name="twitter:description" content="★ Image To Pdf online free - Image to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
+  <meta name="twitter:description"
+    content="★ Image To Pdf online free - Image to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-image-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Image To Pdf">
-  
 
-    <title>Images to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert images (JPG, PNG, BMP, GIF, TIFF, PNM, PGM, PBM, PPM, PAM, JXR, JP2, PSD, SVG, HEIC, WebP) to PDF. Free, secure, runs in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/image-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/image-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/image-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/image-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Images to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert images (JPG, PNG, BMP, GIF, TIFF, PNM, PGM, PBM, PPM, PAM, JXR, JP2, PSD, SVG, HEIC, WebP) to PDF. Free, secure, runs in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/image-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/image-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/image-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/image-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,160 +66,159 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <!-- Copy navigation from jpg-to-pdf.html -->
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <!-- Copy navigation from jpg-to-pdf.html -->
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:imageToPdf.name">Image To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:imageToPdf.subtitle">Convert one or more images into a single
-                PDF file.</p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p id="supported-formats" class="text-xs text-gray-500">JPG, PNG, BMP, GIF, TIFF, PNM, PGM, PBM,
-                        PPM, PAM, JXR, JPX, JP2, PSD, SVG, HEIC, WebP</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    multiple
-                    accept=".jpg,.jpeg,.png,.bmp,.gif,.tiff,.tif,.pnm,.pgm,.pbm,.ppm,.pam,.jxr,.jpx,.jp2,.psd,.svg,.heic,.heif,.webp">
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="jpg-to-pdf-options" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300">PDF
-                        Quality</label>
-                    <select id="jpg-pdf-quality"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="high">High Quality (Larger file)</option>
-                        <option value="medium" selected>Medium Quality (Balanced)</option>
-                        <option value="low">Low Quality (Smaller file)</option>
-                    </select>
-                    <p class="mt-1 text-xs text-gray-400">Controls image compression when embedding into PDF</p>
-                </div>
-                <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
-                data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:imageToPdf.name">Image To Pdf Converter Free
+        Online - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:imageToPdf.subtitle">Convert one or more images into a single
+        PDF file.</p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p id="supported-formats" class="text-xs text-gray-500">JPG, PNG, BMP, GIF, TIFF, PNM, PGM, PBM,
+            PPM, PAM, JXR, JPX, JP2, PSD, SVG, HEIC, WebP</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" multiple
+          accept=".jpg,.jpeg,.png,.bmp,.gif,.tiff,.tif,.pnm,.pgm,.pbm,.ppm,.pam,.jxr,.jpx,.jp2,.psd,.svg,.heic,.heif,.webp">
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="jpg-to-pdf-options" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300">PDF
+            Quality</label>
+          <select id="jpg-pdf-quality" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="high">High Quality (Larger file)</option>
+            <option value="medium" selected>Medium Quality (Balanced)</option>
+            <option value="low">Low Quality (Smaller file)</option>
+          </select>
+          <p class="mt-1 text-xs text-gray-400">Controls image compression when embedding into PDF</p>
+        </div>
+        <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
+      </div>
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
+        data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -224,26 +226,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -256,14 +263,16 @@
           Is image to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -275,77 +284,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/image-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/image-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -367,7 +375,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -396,7 +404,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/invert-colors.html b/src/pages/invert-colors.html
index cfc327d..4a9bbbd 100644
--- a/src/pages/invert-colors.html
+++ b/src/pages/invert-colors.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Invert Colors Online Free - Invert Colors Tool | BentoPDF</title>
   <meta name="title" content="Invert Colors Online Free - Invert Colors Tool | BentoPDF">
-  <meta name="description" content="★ Invert Colors online free - Invert colors PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Invert Colors online free - Invert colors PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="invert colors, invert colors, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/invert-colors">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/invert-colors">
   <meta property="og:title" content="Invert Colors Online Free - Invert Colors Tool | BentoPDF">
-  <meta property="og:description" content="★ Invert Colors online free - Invert colors PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Invert Colors online free - Invert colors PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-invert-colors.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/invert-colors">
   <meta name="twitter:title" content="Invert Colors Free">
-  <meta name="twitter:description" content="★ Invert Colors online free - Invert colors PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Invert Colors online free - Invert colors PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-invert-colors.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Invert Colors">
-  
 
-    <title>Invert PDF Colors - BentoPDF</title>
-    <meta name="description"
-        content="Invert colors in your PDF documents. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/invert-colors.html" />
-    <link rel="alternate" hreflang="de" href="/de/invert-colors.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/invert-colors.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/invert-colors.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Invert PDF Colors - BentoPDF</title>
+  <meta name="description"
+    content="Invert colors in your PDF documents. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/invert-colors.html" />
+  <link rel="alternate" hreflang="de" href="/de/invert-colors.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/invert-colors.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/invert-colors.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,144 +66,145 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:invertColors.name">Invert Colors Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:invertColors.subtitle">
-                Invert all colors in your PDF document, creating a negative image effect.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-4">
-                <p class="text-gray-400 text-sm">Click the button below to invert all colors in your PDF.</p>
-                <button id="process-btn" class="btn-gradient w-full mt-4">Invert Colors</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:invertColors.name">Invert Colors Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:invertColors.subtitle">
+        Invert all colors in your PDF document, creating a negative image effect.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-4">
+        <p class="text-gray-400 text-sm">Click the button below to invert all colors in your PDF.</p>
+        <button id="process-btn" class="btn-gradient w-full mt-4">Invert Colors</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -208,26 +212,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -240,14 +249,16 @@
           Is invert colors really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -259,77 +270,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/invert-colors-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/invert-colors-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -351,7 +361,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -380,7 +390,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/jpg-to-pdf.html b/src/pages/jpg-to-pdf.html
index 2cd605f..3c86c38 100644
--- a/src/pages/jpg-to-pdf.html
+++ b/src/pages/jpg-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>JPG to PDF Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="JPG to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ JPG to PDF online free - Convert JPG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ JPG to PDF online free - Convert JPG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="jpg to pdf, jpeg to pdf, image to pdf, picture to pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/jpg-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/jpg-to-pdf">
   <meta property="og:title" content="JPG to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ JPG to PDF online free - Convert JPG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ JPG to PDF online free - Convert JPG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-jpg-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/jpg-to-pdf">
   <meta name="twitter:title" content="JPG to PDF Free">
-  <meta name="twitter:description" content="★ JPG to PDF online free - Convert JPG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
+  <meta name="twitter:description"
+    content="★ JPG to PDF online free - Convert JPG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-jpg-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="JPG to PDF">
-  
 
-    <title>JPG to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert one or more JPG images into a single PDF file. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/jpg-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/jpg-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/jpg-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/jpg-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>JPG to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert one or more JPG images into a single PDF file. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/jpg-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/jpg-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/jpg-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/jpg-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,173 +66,173 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:jpgToPdf.name">JPG to PDF Converter Free - Convert Images Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:jpgToPdf.subtitle">
-                Create a PDF from JPG, JPEG, and JPEG2000 (JP2/JPX) images.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">JPG, JPEG, JP2, JPX Images</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    multiple accept="image/jpeg, image/jpg, image/jp2, .jp2, .jpx, .jpeg, .jpg">
-            </div>
-
-            <!-- Control buttons -->
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <!-- File List -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Options -->
-            <div id="jpg-to-pdf-options" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300"> PDF Quality
-                    </label>
-                    <select id="jpg-pdf-quality"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="high"> High Quality (Larger file) </option>
-                        <option value="medium" selected> Medium Quality (Balanced) </option>
-                        <option value="low"> Low Quality (Smaller file) </option>
-                    </select>
-                    <p class="mt-1 text-xs text-gray-400"> Controls image compression when embedding into PDF </p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:jpgToPdf.name">JPG to PDF Converter Free - Convert
+        Images Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:jpgToPdf.subtitle">
+        Create a PDF from JPG, JPEG, and JPEG2000 (JP2/JPX) images.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">JPG, JPEG, JP2, JPX Images</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" multiple
+          accept="image/jpeg, image/jpg, image/jp2, .jp2, .jpx, .jpeg, .jpg">
+      </div>
+
+      <!-- Control buttons -->
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <!-- File List -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Options -->
+      <div id="jpg-to-pdf-options" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300"> PDF Quality
+          </label>
+          <select id="jpg-pdf-quality" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="high"> High Quality (Larger file) </option>
+            <option value="medium" selected> Medium Quality (Balanced) </option>
+            <option value="low"> Low Quality (Smaller file) </option>
+          </select>
+          <p class="mt-1 text-xs text-gray-400"> Controls image compression when embedding into PDF </p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -237,26 +240,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -269,14 +277,16 @@
           Is jpg to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -288,96 +298,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/jpg-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/jpg-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -399,7 +408,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -428,7 +437,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/json-to-pdf.html b/src/pages/json-to-pdf.html
index fecde35..f2701da 100644
--- a/src/pages/json-to-pdf.html
+++ b/src/pages/json-to-pdf.html
@@ -4,41 +4,44 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+
   <!-- Primary Meta Tags -->
   <title>Json To Pdf Online Free - Json To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Json To Pdf Online Free - Json To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Json To Pdf online free - Json to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Json To Pdf online free - Json to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="json to pdf, json to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/json-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/json-to-pdf">
   <meta property="og:title" content="Json To Pdf Online Free - Json To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Json To Pdf online free - Json to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Json To Pdf online free - Json to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-json-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/json-to-pdf">
   <meta name="twitter:title" content="Json To Pdf Free">
-  <meta name="twitter:description" content="★ Json To Pdf online free - Json to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Json To Pdf online free - Json to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-json-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Json To Pdf">
-  
+
 
   <title>JSON to PDF Converter - BentoPDF</title>
   <link rel="alternate" hreflang="en" href="/en/json-to-pdf.html" />
@@ -63,7 +66,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -115,7 +118,8 @@
         <i data-lucide="arrow-left" class="cursor-pointer"></i>
         <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
       </button>
-      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:jsonToPdf.name">Json To Pdf Converter Free Online - Convert Files Fast</h1>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:jsonToPdf.name">Json To Pdf Converter Free Online
+        - Convert Files Fast</h1>
       <p class="text-gray-400 mb-6" data-i18n="tools:jsonToPdf.subtitle">
         Upload multiple JSON files to convert them all to PDF format. Files will be downloaded as a ZIP archive.
       </p>
@@ -155,38 +159,41 @@
     </div>
   </div>
 
-  
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -194,26 +201,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -226,14 +238,16 @@
           Is json to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -249,11 +263,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
@@ -355,7 +369,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -384,7 +398,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/linearize-pdf.html b/src/pages/linearize-pdf.html
index 3354cfc..a13a332 100644
--- a/src/pages/linearize-pdf.html
+++ b/src/pages/linearize-pdf.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Linearize Pdf Online Free - Linearize Pdf Tool | BentoPDF</title>
   <meta name="title" content="Linearize Pdf Online Free - Linearize Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Linearize Pdf online free - Linearize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Linearize Pdf online free - Linearize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="linearize pdf, linearize pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/linearize-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/linearize-pdf">
   <meta property="og:title" content="Linearize Pdf Online Free - Linearize Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Linearize Pdf online free - Linearize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Linearize Pdf online free - Linearize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-linearize-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/linearize-pdf">
   <meta name="twitter:title" content="Linearize Pdf Free">
-  <meta name="twitter:description" content="★ Linearize Pdf online free - Linearize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Linearize Pdf online free - Linearize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-linearize-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Linearize Pdf">
-  
 
-    <title>Linearize PDF - Optimize for Web Viewing - BentoPDF</title>
-    <meta name="description"
-        content="Linearize PDF files for fast web viewing. Optimize PDFs to load progressively in browsers. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/linearize-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/linearize-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/linearize-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/linearize-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Linearize PDF - Optimize for Web Viewing - BentoPDF</title>
+  <meta name="description"
+    content="Linearize PDF files for fast web viewing. Optimize PDFs to load progressively in browsers. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/linearize-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/linearize-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/linearize-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/linearize-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,161 +64,163 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:linearizePdf.name">Linearize Pdf Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:linearizePdf.subtitle">
-                Optimize PDF files for fast web viewing. Linearized PDFs load progressively in browsers.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDFs</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">Single or multiple PDF files supported</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <!-- Control buttons for multi-file uploads -->
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="p-4 bg-gray-900 rounded-lg border border-gray-700 mb-4">
-                    <h3 class="text-sm font-semibold text-white mb-2">What is linearization?</h3>
-                    <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
-                        <li>Optimizes PDF structure for web viewing</li>
-                        <li>Enables progressive loading (first page displays faster)</li>
-                        <li>Improves user experience for online PDFs</li>
-                        <li>Also known as "Fast Web View" or "Optimized"</li>
-                    </ul>
-                </div>
-                <button id="process-btn" class="btn-gradient w-full">Linearize PDF(s)</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:linearizePdf.name">Linearize Pdf Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:linearizePdf.subtitle">
+        Optimize PDF files for fast web viewing. Linearized PDFs load progressively in browsers.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDFs</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">Single or multiple PDF files supported</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <!-- Control buttons for multi-file uploads -->
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="p-4 bg-gray-900 rounded-lg border border-gray-700 mb-4">
+          <h3 class="text-sm font-semibold text-white mb-2">What is linearization?</h3>
+          <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
+            <li>Optimizes PDF structure for web viewing</li>
+            <li>Enables progressive loading (first page displays faster)</li>
+            <li>Improves user experience for online PDFs</li>
+            <li>Also known as "Fast Web View" or "Optimized"</li>
+          </ul>
+        </div>
+        <button id="process-btn" class="btn-gradient w-full">Linearize PDF(s)</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -223,26 +228,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -255,14 +265,16 @@
           Is linearize pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -274,74 +286,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/linearize-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/linearize-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -363,7 +374,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -392,7 +403,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/markdown-to-pdf.html b/src/pages/markdown-to-pdf.html
index 4bbb9f5..201943d 100644
--- a/src/pages/markdown-to-pdf.html
+++ b/src/pages/markdown-to-pdf.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Markdown To Pdf Online Free - Markdown To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Markdown To Pdf Online Free - Markdown To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Markdown To Pdf online free - Markdown to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Markdown To Pdf online free - Markdown to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="markdown to pdf, markdown to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/markdown-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/markdown-to-pdf">
   <meta property="og:title" content="Markdown To Pdf Online Free - Markdown To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Markdown To Pdf online free - Markdown to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Markdown To Pdf online free - Markdown to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-markdown-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/markdown-to-pdf">
   <meta name="twitter:title" content="Markdown To Pdf Free">
-  <meta name="twitter:description" content="★ Markdown To Pdf online free - Markdown to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ Markdown To Pdf online free - Markdown to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-markdown-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Markdown To Pdf">
-  
 
-    <title>Markdown to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Markdown to PDF with live preview. Free, secure, and runs entirely in your browser." />
-    
-    <link rel="alternate" hreflang="en" href="/en/markdown-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/markdown-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/markdown-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/markdown-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    <link href="/src/css/markdown-editor.css" rel="stylesheet" />
-    
+
+  <title>Markdown to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Markdown to PDF with live preview. Free, secure, and runs entirely in your browser." />
+
+  <link rel="alternate" hreflang="en" href="/en/markdown-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/markdown-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/markdown-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/markdown-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+  <link href="/src/css/markdown-editor.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,106 +67,107 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
 
-    <div class="min-h-screen py-8 px-4">
-        <div class="max-w-7xl mx-auto">
-            <div class="bg-gray-800 rounded-xl shadow-xl p-6 border border-gray-700">
-                <button id="back-to-tools"
-                    class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                    <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                    <span class="cursor-pointer" data-i18n="tools.backToTools">Back to Tools</span>
-                </button>
-
-                <h1 class="text-2xl font-bold text-white mb-2">Markdown To Pdf Converter Free Online - Convert Files Fast</h1>
-                <p class="text-gray-400 mb-6">
-                    Write markdown with live preview. Supports syntax highlighting, tables, emoji, and more. Print to
-                    save as PDF.
-                </p>
-
-                <!-- Editor container -->
-                <div id="markdown-editor-container"></div>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
+    </div>
+  </nav>
+
+  <div class="min-h-screen py-8 px-4">
+    <div class="max-w-7xl mx-auto">
+      <div class="bg-gray-800 rounded-xl shadow-xl p-6 border border-gray-700">
+        <button id="back-to-tools"
+          class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+          <i data-lucide="arrow-left" class="cursor-pointer"></i>
+          <span class="cursor-pointer" data-i18n="tools.backToTools">Back to Tools</span>
+        </button>
+
+        <h1 class="text-2xl font-bold text-white mb-2">Markdown To Pdf Converter Free Online - Convert Files Fast</h1>
+        <p class="text-gray-400 mb-6">
+          Write markdown with live preview. Supports syntax highlighting, tables, emoji, and more. Print to
+          save as PDF.
+        </p>
+
+        <!-- Editor container -->
+        <div id="markdown-editor-container"></div>
+      </div>
+    </div>
+  </div>
+
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -171,26 +175,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -203,14 +212,16 @@
           Is markdown to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -222,85 +233,84 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
 
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/markdown-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/markdown-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -322,7 +332,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -351,7 +361,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/merge-pdf.html b/src/pages/merge-pdf.html
index acb5e09..2e45973 100644
--- a/src/pages/merge-pdf.html
+++ b/src/pages/merge-pdf.html
@@ -42,13 +42,13 @@
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Merge PDF">
 
-  
+
   <link rel="alternate" hreflang="en" href="/en/merge-pdf.html" />
   <link rel="alternate" hreflang="de" href="/de/merge-pdf.html" />
   <link rel="alternate" hreflang="vi" href="/vi/merge-pdf.html" />
   <link rel="alternate" hreflang="x-default" href="/en/merge-pdf.html" />
   <link href="/src/css/styles.css" rel="stylesheet" />
-  
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -66,7 +66,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -121,7 +121,8 @@
         <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
       </button>
 
-      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:mergePdf.name">Merge PDF Files Free - Combine PDFs Instantly</h1>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:mergePdf.name">Merge PDF Files Free - Combine PDFs
+        Instantly</h1>
       <p class="text-gray-400 mb-6" data-i18n="tools:mergePdf.subtitle">
         Combine whole files, or select specific pages to merge into a new document.
       </p>
@@ -216,47 +217,51 @@
     </div>
   </div>
 
-  
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload PDFs</h3>
-            <p class="text-gray-400">Select or drag and drop multiple PDF files you want to merge</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Arrange Order</h3>
-            <p class="text-gray-400">Drag files up or down to reorder them in your preferred sequence</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload PDFs</h3>
+          <p class="text-gray-400">Select or drag and drop multiple PDF files you want to merge</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Merge Files</h3>
-            <p class="text-gray-400">Click the merge button to combine all PDFs into a single document</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your merged PDF - all pages combined in the order you chose</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Arrange Order</h3>
+          <p class="text-gray-400">Drag files up or down to reorder them in your preferred sequence</p>
         </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Merge Files</h3>
+          <p class="text-gray-400">Click the merge button to combine all PDFs into a single document</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          4
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your merged PDF - all pages combined in the order you chose</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -264,26 +269,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/organize-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-        <a href="/delete-pages.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/organize-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
+      <a href="/delete-pages.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+        <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+      </a>
     </div>
   </section>
 
@@ -296,21 +306,24 @@
           How many PDFs can I merge at once?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Unlimited! Merge as many PDF files as you need in a single operation. No restrictions on file count or total size.</p>
+        <p class="mt-3 text-gray-400">Unlimited! Merge as many PDF files as you need in a single operation. No
+          restrictions on file count or total size.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Will merging reduce PDF quality?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">No! BentoPDF preserves the original quality of all PDFs when merging. Your documents remain crisp and clear with no quality loss.</p>
+        <p class="mt-3 text-gray-400">No! BentoPDF preserves the original quality of all PDFs when merging. Your
+          documents remain crisp and clear with no quality loss.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Can I reorder pages after selecting files?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! Simply drag and drop files to arrange them in any order before clicking the merge button.</p>
+        <p class="mt-3 text-gray-400">Yes! Simply drag and drop files to arrange them in any order before clicking the
+          merge button.</p>
       </details>
     </div>
   </section>
@@ -319,11 +332,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
diff --git a/src/pages/mobi-to-pdf.html b/src/pages/mobi-to-pdf.html
index 559614d..061eb70 100644
--- a/src/pages/mobi-to-pdf.html
+++ b/src/pages/mobi-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Mobi To Pdf Online Free - Mobi To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Mobi To Pdf Online Free - Mobi To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Mobi To Pdf online free - Mobi to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Mobi To Pdf online free - Mobi to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="mobi to pdf, mobi to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/mobi-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/mobi-to-pdf">
   <meta property="og:title" content="Mobi To Pdf Online Free - Mobi To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Mobi To Pdf online free - Mobi to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Mobi To Pdf online free - Mobi to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-mobi-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/mobi-to-pdf">
   <meta name="twitter:title" content="Mobi To Pdf Free">
-  <meta name="twitter:description" content="★ Mobi To Pdf online free - Mobi to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Mobi To Pdf online free - Mobi to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-mobi-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Mobi To Pdf">
-  
 
-    <title>MOBI to PDF - Convert XPS/OMOBI to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert XPS and OXPS documents to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/mobi-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/mobi-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/mobi-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/mobi-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>MOBI to PDF - Convert XPS/OMOBI to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert XPS and OXPS documents to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/mobi-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/mobi-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/mobi-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/mobi-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,153 +66,154 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:mobiToPdf.name">Mobi To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:mobiToPdf.subtitle">
-                Convert MOBI e-books to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:mobiToPdf.acceptedFormats">MOBI files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".mobi,application/x-mobipocket-ebook" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6"
-                data-i18n="tools:mobiToPdf.convertButton">Convert to PDF</button>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:mobiToPdf.name">Mobi To Pdf Converter Free Online
+        - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:mobiToPdf.subtitle">
+        Convert MOBI e-books to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:mobiToPdf.acceptedFormats">MOBI files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".mobi,application/x-mobipocket-ebook" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6" data-i18n="tools:mobiToPdf.convertButton">Convert
+        to PDF</button>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -217,26 +221,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -249,14 +258,16 @@
           Is mobi to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -268,96 +279,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/mobi-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/mobi-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -379,7 +389,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -408,7 +418,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/n-up-pdf.html b/src/pages/n-up-pdf.html
index aed2a9d..f9a4c8a 100644
--- a/src/pages/n-up-pdf.html
+++ b/src/pages/n-up-pdf.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>N Up Pdf Online Free - N Up Pdf Tool | BentoPDF</title>
   <meta name="title" content="N Up Pdf Online Free - N Up Pdf Tool | BentoPDF">
-  <meta name="description" content="★ N Up Pdf online free - N up pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ N Up Pdf online free - N up pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="n up pdf, n up pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/n-up-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/n-up-pdf">
   <meta property="og:title" content="N Up Pdf Online Free - N Up Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ N Up Pdf online free - N up pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ N Up Pdf online free - N up pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-n-up-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/n-up-pdf">
   <meta name="twitter:title" content="N Up Pdf Free">
-  <meta name="twitter:description" content="★ N Up Pdf online free - N up pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
+  <meta name="twitter:description"
+    content="★ N Up Pdf online free - N up pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-n-up-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="N Up Pdf">
-  
 
-    <title>N-Up PDF - BentoPDF</title>
-    <meta name="description"
-        content="Arrange multiple PDF pages onto a single sheet. Create 2-up, 4-up, 9-up layouts. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/n-up-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/n-up-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/n-up-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/n-up-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>N-Up PDF - BentoPDF</title>
+  <meta name="description"
+    content="Arrange multiple PDF pages onto a single sheet. Create 2-up, 4-up, 9-up layouts. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/n-up-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/n-up-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/n-up-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/n-up-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,209 +64,207 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:nUpPdf.name">N Up Pdf Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:nUpPdf.subtitle">
-                Arrange multiple pages onto a single sheet. Perfect for printing handouts or saving paper.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
-                    <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
-                    <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
-                        <li>Choose how many pages to fit on each sheet (2, 4, 9, or 16).</li>
-                        <li>Select output page size and orientation.</li>
-                        <li>Optionally add margins and borders around each page.</li>
-                    </ul>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-                    <div>
-                        <label for="pages-per-sheet" class="block mb-2 text-sm font-medium text-gray-300">Pages per
-                            Sheet</label>
-                        <select id="pages-per-sheet"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                            <option value="2">2-up (1x2)</option>
-                            <option value="4" selected>4-up (2x2)</option>
-                            <option value="9">9-up (3x3)</option>
-                            <option value="16">16-up (4x4)</option>
-                        </select>
-                    </div>
-                    <div>
-                        <label for="output-page-size" class="block mb-2 text-sm font-medium text-gray-300">Output Page
-                            Size</label>
-                        <select id="output-page-size"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                            <option value="Letter" selected>Letter (8.5" x 11")</option>
-                            <option value="A4">A4</option>
-                            <option value="Legal">Legal</option>
-                            <option value="A3">A3</option>
-                        </select>
-                    </div>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-                    <div>
-                        <label for="output-orientation"
-                            class="block mb-2 text-sm font-medium text-gray-300">Orientation</label>
-                        <select id="output-orientation"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                            <option value="auto" selected>Auto</option>
-                            <option value="portrait">Portrait</option>
-                            <option value="landscape">Landscape</option>
-                        </select>
-                    </div>
-                    <div class="flex items-end gap-4">
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="add-margins"
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-600">
-                            <span class="text-sm text-gray-300">Add Margins</span>
-                        </label>
-                    </div>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
-                    <label class="flex items-center gap-2 cursor-pointer">
-                        <input type="checkbox" id="add-border"
-                            class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-600">
-                        <span class="text-sm text-gray-300">Add Border</span>
-                    </label>
-                    <div id="border-color-wrapper" class="hidden">
-                        <label for="border-color" class="block mb-2 text-sm font-medium text-gray-300">Border
-                            Color</label>
-                        <input type="color" id="border-color" value="#000000"
-                            class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Create N-Up PDF</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:nUpPdf.name">N Up Pdf Free Online - Fast & Secure
+      </h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:nUpPdf.subtitle">
+        Arrange multiple pages onto a single sheet. Perfect for printing handouts or saving paper.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
+          <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
+          <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
+            <li>Choose how many pages to fit on each sheet (2, 4, 9, or 16).</li>
+            <li>Select output page size and orientation.</li>
+            <li>Optionally add margins and borders around each page.</li>
+          </ul>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
+          <div>
+            <label for="pages-per-sheet" class="block mb-2 text-sm font-medium text-gray-300">Pages per
+              Sheet</label>
+            <select id="pages-per-sheet" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+              <option value="2">2-up (1x2)</option>
+              <option value="4" selected>4-up (2x2)</option>
+              <option value="9">9-up (3x3)</option>
+              <option value="16">16-up (4x4)</option>
+            </select>
+          </div>
+          <div>
+            <label for="output-page-size" class="block mb-2 text-sm font-medium text-gray-300">Output Page
+              Size</label>
+            <select id="output-page-size" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+              <option value="Letter" selected>Letter (8.5" x 11")</option>
+              <option value="A4">A4</option>
+              <option value="Legal">Legal</option>
+              <option value="A3">A3</option>
+            </select>
+          </div>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
+          <div>
+            <label for="output-orientation" class="block mb-2 text-sm font-medium text-gray-300">Orientation</label>
+            <select id="output-orientation"
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+              <option value="auto" selected>Auto</option>
+              <option value="portrait">Portrait</option>
+              <option value="landscape">Landscape</option>
+            </select>
+          </div>
+          <div class="flex items-end gap-4">
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="add-margins"
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-600">
+              <span class="text-sm text-gray-300">Add Margins</span>
+            </label>
+          </div>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
+          <label class="flex items-center gap-2 cursor-pointer">
+            <input type="checkbox" id="add-border"
+              class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-600">
+            <span class="text-sm text-gray-300">Add Border</span>
+          </label>
+          <div id="border-color-wrapper" class="hidden">
+            <label for="border-color" class="block mb-2 text-sm font-medium text-gray-300">Border
+              Color</label>
+            <input type="color" id="border-color" value="#000000"
+              class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
+          </div>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Create N-Up PDF</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -271,26 +272,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -303,14 +309,16 @@
           Is n up pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -322,73 +330,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/n-up-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/n-up-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -410,7 +417,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -439,7 +446,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/ocr-pdf.html b/src/pages/ocr-pdf.html
index 34c6f10..39af466 100644
--- a/src/pages/ocr-pdf.html
+++ b/src/pages/ocr-pdf.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>OCR PDF Online Free - OCR PDF Tool | BentoPDF</title>
   <meta name="title" content="OCR PDF Online Free - OCR PDF Tool | BentoPDF">
-  <meta name="description" content="★ OCR PDF online free - OCR PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ OCR PDF online free - OCR PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="ocr pdf, pdf ocr, scan to text, pdf text recognition">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/ocr-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/ocr-pdf">
   <meta property="og:title" content="OCR PDF Online Free - OCR PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ OCR PDF online free - OCR PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ OCR PDF online free - OCR PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-ocr-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/ocr-pdf">
   <meta name="twitter:title" content="OCR PDF Free">
-  <meta name="twitter:description" content="★ OCR PDF online free - OCR PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="twitter:description"
+    content="★ OCR PDF online free - OCR PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-ocr-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="OCR PDF">
-  
 
-    <title>OCR PDF - Make PDF Searchable - BentoPDF</title>
-    <meta name="description"
-        content="Convert scanned PDFs into searchable documents using OCR. Extract text from images and create searchable PDFs. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/ocr-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/ocr-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/ocr-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/ocr-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>OCR PDF - Make PDF Searchable - BentoPDF</title>
+  <meta name="description"
+    content="Convert scanned PDFs into searchable documents using OCR. Extract text from images and create searchable PDFs. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/ocr-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/ocr-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/ocr-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/ocr-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,262 +64,261 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:ocrPdf.name">OCR PDF Free Online - Extract Text from Scans</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:ocrPdf.subtitle">
-                Convert scanned PDFs into searchable documents. Select one or more languages present in your file for
-                the best results.
-            </p>
-
-            <!-- How it works info box -->
-            <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-6">
-                <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
-                <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
-                    <li><strong class="text-white">Extract Text:</strong> Uses Tesseract OCR to recognize text from
-                        scanned images or PDFs.</li>
-                    <li><strong class="text-white">Searchable Output:</strong> Creates a new PDF with an invisible text
-                        layer, making your document fully searchable while preserving the original appearance.</li>
-                    <li><strong class="text-white">Character Filtering:</strong> Use whitelists to filter out unwanted
-                        characters and improve accuracy for specific document types (invoices, forms, etc.).</li>
-                    <li><strong class="text-white">Multi-language Support:</strong> Select multiple languages for
-                        documents containing mixed language content.</li>
-                </ul>
-            </div>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- OCR Options -->
-            <div id="tool-options" class="hidden mt-6 space-y-4">
-                <div>
-                    <label class="block mb-2 text-sm font-medium text-gray-300">Languages in Document</label>
-                    <div class="relative">
-                        <input type="text" id="lang-search"
-                            class="w-full bg-gray-900 border border-gray-600 text-white rounded-lg p-2.5 mb-2"
-                            placeholder="Search for languages...">
-                        <div id="lang-list"
-                            class="max-h-48 overflow-y-auto border border-gray-600 rounded-lg p-2 bg-gray-900">
-                            <!-- Language checkboxes will be populated by JS -->
-                        </div>
-                    </div>
-                    <p class="text-xs text-gray-500 mt-1">Selected: <span id="selected-langs-display"
-                            class="font-semibold">None</span></p>
-                </div>
-
-                <!-- Advanced settings -->
-                <details class="bg-gray-900 border border-gray-700 rounded-lg p-3">
-                    <summary class="text-sm font-medium text-gray-300 cursor-pointer flex items-center justify-between">
-                        <span>Advanced Settings (Recommended to improve accuracy)</span>
-                        <i data-lucide="chevron-down" class="w-4 h-4 transition-transform details-icon"></i>
-                    </summary>
-                    <div class="mt-4 space-y-4">
-                        <!-- Resolution -->
-                        <div>
-                            <label for="ocr-resolution"
-                                class="block mb-1 text-xs font-medium text-gray-400">Resolution</label>
-                            <select id="ocr-resolution"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm">
-                                <option value="2.0">Standard (192 DPI)</option>
-                                <option value="3.0" selected>High (288 DPI)</option>
-                                <option value="4.0">Ultra (384 DPI)</option>
-                            </select>
-                        </div>
-                        <!-- Binarization -->
-                        <label class="flex items-center gap-2 text-sm text-gray-300 cursor-pointer">
-                            <input type="checkbox" id="ocr-binarize"
-                                class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600">
-                            Binarize Image (Enhance Contrast for Clean Scans)
-                        </label>
-                        <!-- Whitelist Presets -->
-                        <div>
-                            <label for="whitelist-preset" class="block mb-1 text-xs font-medium text-gray-400">Character
-                                Whitelist Preset</label>
-                            <select id="whitelist-preset"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm mb-2">
-                                <option value="">None (All characters)</option>
-                                <option value="alphanumeric">Alphanumeric + Basic Punctuation</option>
-                                <option value="numbers-currency">Numbers + Currency Symbols</option>
-                                <option value="letters-only">Letters Only (A-Z, a-z)</option>
-                                <option value="numbers-only">Numbers Only (0-9)</option>
-                                <option value="invoice">Invoice/Receipt (Numbers, $, ., -, /)</option>
-                                <option value="forms">Forms (Alphanumeric + Common Symbols)</option>
-                                <option value="custom">Custom...</option>
-                            </select>
-                            <p class="text-xs text-gray-500 mt-1">Only these characters will be recognized. Leave empty
-                                for all characters.</p>
-                        </div>
-                        <!-- Whitelist Input -->
-                        <div>
-                            <label for="ocr-whitelist" class="block mb-1 text-xs font-medium text-gray-400">Character
-                                Whitelist (Optional)</label>
-                            <input type="text" id="ocr-whitelist"
-                                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm"
-                                placeholder="e.g., abcdefghijklmnopqrstuvwxyz0123456789$.,">
-                            <p class="text-xs text-gray-500 mt-1">Only these characters will be recognized. Leave empty
-                                for all characters.</p>
-                        </div>
-                    </div>
-                </details>
-
-                <button id="process-btn" class="btn-gradient w-full disabled:opacity-50" disabled>Start OCR</button>
-            </div>
-
-            <!-- Progress Section -->
-            <div id="ocr-progress" class="hidden mt-6 p-4 bg-gray-900 border border-gray-700 rounded-lg">
-                <p id="progress-status" class="text-white mb-2">Initializing...</p>
-                <div class="w-full bg-gray-700 rounded-full h-4">
-                    <div id="progress-bar" class="bg-indigo-600 h-4 rounded-full transition-all duration-300"
-                        style="width: 0%"></div>
-                </div>
-                <pre id="progress-log"
-                    class="mt-4 text-xs text-gray-400 max-h-32 overflow-y-auto bg-black p-2 rounded-md"></pre>
-            </div>
-
-            <!-- Results Section -->
-            <div id="ocr-results" class="hidden mt-6">
-                <h3 class="text-xl font-bold text-white mb-2">OCR Complete</h3>
-                <p class="mb-4 text-gray-400">Your searchable PDF is ready. You can also copy or download the extracted
-                    text below.</p>
-                <div class="relative">
-                    <textarea id="ocr-text-output" rows="10"
-                        class="w-full bg-gray-900 border border-gray-600 text-gray-300 rounded-lg p-2.5 font-sans"
-                        readonly></textarea>
-                    <button id="copy-text-btn"
-                        class="absolute top-2 right-2 bg-gray-700 hover:bg-gray-600 p-2 rounded-md"
-                        title="Copy to Clipboard">
-                        <i data-lucide="clipboard-copy" class="w-4 h-4 text-gray-300"></i>
-                    </button>
-                </div>
-                <div class="grid grid-cols-1 sm:grid-cols-2 gap-4 mt-4">
-                    <button id="download-txt-btn"
-                        class="w-full bg-gray-700 text-white font-semibold py-3 rounded-lg hover:bg-gray-600">Download
-                        as .txt</button>
-                    <button id="download-searchable-pdf"
-                        class="w-full bg-green-600 text-white font-semibold py-3 rounded-lg hover:bg-green-700">Download
-                        Searchable PDF</button>
-                </div>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:ocrPdf.name">OCR PDF Free Online - Extract Text
+        from Scans</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:ocrPdf.subtitle">
+        Convert scanned PDFs into searchable documents. Select one or more languages present in your file for
+        the best results.
+      </p>
+
+      <!-- How it works info box -->
+      <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-6">
+        <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
+        <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
+          <li><strong class="text-white">Extract Text:</strong> Uses Tesseract OCR to recognize text from
+            scanned images or PDFs.</li>
+          <li><strong class="text-white">Searchable Output:</strong> Creates a new PDF with an invisible text
+            layer, making your document fully searchable while preserving the original appearance.</li>
+          <li><strong class="text-white">Character Filtering:</strong> Use whitelists to filter out unwanted
+            characters and improve accuracy for specific document types (invoices, forms, etc.).</li>
+          <li><strong class="text-white">Multi-language Support:</strong> Select multiple languages for
+            documents containing mixed language content.</li>
+        </ul>
+      </div>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- OCR Options -->
+      <div id="tool-options" class="hidden mt-6 space-y-4">
+        <div>
+          <label class="block mb-2 text-sm font-medium text-gray-300">Languages in Document</label>
+          <div class="relative">
+            <input type="text" id="lang-search"
+              class="w-full bg-gray-900 border border-gray-600 text-white rounded-lg p-2.5 mb-2"
+              placeholder="Search for languages...">
+            <div id="lang-list" class="max-h-48 overflow-y-auto border border-gray-600 rounded-lg p-2 bg-gray-900">
+              <!-- Language checkboxes will be populated by JS -->
+            </div>
+          </div>
+          <p class="text-xs text-gray-500 mt-1">Selected: <span id="selected-langs-display"
+              class="font-semibold">None</span></p>
+        </div>
+
+        <!-- Advanced settings -->
+        <details class="bg-gray-900 border border-gray-700 rounded-lg p-3">
+          <summary class="text-sm font-medium text-gray-300 cursor-pointer flex items-center justify-between">
+            <span>Advanced Settings (Recommended to improve accuracy)</span>
+            <i data-lucide="chevron-down" class="w-4 h-4 transition-transform details-icon"></i>
+          </summary>
+          <div class="mt-4 space-y-4">
+            <!-- Resolution -->
+            <div>
+              <label for="ocr-resolution" class="block mb-1 text-xs font-medium text-gray-400">Resolution</label>
+              <select id="ocr-resolution"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm">
+                <option value="2.0">Standard (192 DPI)</option>
+                <option value="3.0" selected>High (288 DPI)</option>
+                <option value="4.0">Ultra (384 DPI)</option>
+              </select>
+            </div>
+            <!-- Binarization -->
+            <label class="flex items-center gap-2 text-sm text-gray-300 cursor-pointer">
+              <input type="checkbox" id="ocr-binarize"
+                class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600">
+              Binarize Image (Enhance Contrast for Clean Scans)
+            </label>
+            <!-- Whitelist Presets -->
+            <div>
+              <label for="whitelist-preset" class="block mb-1 text-xs font-medium text-gray-400">Character
+                Whitelist Preset</label>
+              <select id="whitelist-preset"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm mb-2">
+                <option value="">None (All characters)</option>
+                <option value="alphanumeric">Alphanumeric + Basic Punctuation</option>
+                <option value="numbers-currency">Numbers + Currency Symbols</option>
+                <option value="letters-only">Letters Only (A-Z, a-z)</option>
+                <option value="numbers-only">Numbers Only (0-9)</option>
+                <option value="invoice">Invoice/Receipt (Numbers, $, ., -, /)</option>
+                <option value="forms">Forms (Alphanumeric + Common Symbols)</option>
+                <option value="custom">Custom...</option>
+              </select>
+              <p class="text-xs text-gray-500 mt-1">Only these characters will be recognized. Leave empty
+                for all characters.</p>
+            </div>
+            <!-- Whitelist Input -->
+            <div>
+              <label for="ocr-whitelist" class="block mb-1 text-xs font-medium text-gray-400">Character
+                Whitelist (Optional)</label>
+              <input type="text" id="ocr-whitelist"
+                class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2 text-sm"
+                placeholder="e.g., abcdefghijklmnopqrstuvwxyz0123456789$.,">
+              <p class="text-xs text-gray-500 mt-1">Only these characters will be recognized. Leave empty
+                for all characters.</p>
+            </div>
+          </div>
+        </details>
+
+        <button id="process-btn" class="btn-gradient w-full disabled:opacity-50" disabled>Start OCR</button>
+      </div>
+
+      <!-- Progress Section -->
+      <div id="ocr-progress" class="hidden mt-6 p-4 bg-gray-900 border border-gray-700 rounded-lg">
+        <p id="progress-status" class="text-white mb-2">Initializing...</p>
+        <div class="w-full bg-gray-700 rounded-full h-4">
+          <div id="progress-bar" class="bg-indigo-600 h-4 rounded-full transition-all duration-300" style="width: 0%">
+          </div>
+        </div>
+        <pre id="progress-log"
+          class="mt-4 text-xs text-gray-400 max-h-32 overflow-y-auto bg-black p-2 rounded-md"></pre>
+      </div>
+
+      <!-- Results Section -->
+      <div id="ocr-results" class="hidden mt-6">
+        <h3 class="text-xl font-bold text-white mb-2">OCR Complete</h3>
+        <p class="mb-4 text-gray-400">Your searchable PDF is ready. You can also copy or download the extracted
+          text below.</p>
+        <div class="relative">
+          <textarea id="ocr-text-output" rows="10"
+            class="w-full bg-gray-900 border border-gray-600 text-gray-300 rounded-lg p-2.5 font-sans"
+            readonly></textarea>
+          <button id="copy-text-btn" class="absolute top-2 right-2 bg-gray-700 hover:bg-gray-600 p-2 rounded-md"
+            title="Copy to Clipboard">
+            <i data-lucide="clipboard-copy" class="w-4 h-4 text-gray-300"></i>
+          </button>
+        </div>
+        <div class="grid grid-cols-1 sm:grid-cols-2 gap-4 mt-4">
+          <button id="download-txt-btn"
+            class="w-full bg-gray-700 text-white font-semibold py-3 rounded-lg hover:bg-gray-600">Download
+            as .txt</button>
+          <button id="download-searchable-pdf"
+            class="w-full bg-green-600 text-white font-semibold py-3 rounded-lg hover:bg-green-700">Download
+            Searchable PDF</button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -324,26 +326,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -356,14 +363,16 @@
           Is ocr pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -375,74 +384,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/ocr-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/ocr-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -464,7 +472,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -493,7 +501,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/odg-to-pdf.html b/src/pages/odg-to-pdf.html
index 3cf815e..369b170 100644
--- a/src/pages/odg-to-pdf.html
+++ b/src/pages/odg-to-pdf.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Odg To Pdf Online Free - Odg To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Odg To Pdf Online Free - Odg To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Odg To Pdf online free - Odg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Odg To Pdf online free - Odg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="odg to pdf, odg to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/odg-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/odg-to-pdf">
   <meta property="og:title" content="Odg To Pdf Online Free - Odg To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Odg To Pdf online free - Odg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Odg To Pdf online free - Odg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-odg-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/odg-to-pdf">
   <meta name="twitter:title" content="Odg To Pdf Free">
-  <meta name="twitter:description" content="★ Odg To Pdf online free - Odg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Odg To Pdf online free - Odg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-odg-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Odg To Pdf">
-  
 
-    <title>ODG to PDF - Convert OpenDocument Graphics to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert OpenDocument Graphics (ODG) files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/odg-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/odg-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/odg-to-pdf.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/odg-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/odg-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>ODG to PDF - Convert OpenDocument Graphics to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert OpenDocument Graphics (ODG) files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/odg-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/odg-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/odg-to-pdf.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/odg-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/odg-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,163 +67,165 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:odgToPdf.name">Odg To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:odgToPdf.subtitle">
-                Convert OpenDocument Graphics (ODG) files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:odgToPdf.acceptedFormats">ODG files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".odg" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:odgToPdf.convertButton">Convert to PDF</span>
-                </button>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:odgToPdf.name">Odg To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:odgToPdf.subtitle">
+        Convert OpenDocument Graphics (ODG) files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:odgToPdf.acceptedFormats">ODG files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".odg" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:odgToPdf.convertButton">Convert to PDF</span>
+        </button>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -228,26 +233,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -260,14 +270,16 @@
           Is odg to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -279,84 +291,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/odg-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/odg-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -378,7 +389,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -407,7 +418,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/odp-to-pdf.html b/src/pages/odp-to-pdf.html
index 2285b7e..4fe33f0 100644
--- a/src/pages/odp-to-pdf.html
+++ b/src/pages/odp-to-pdf.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Odp To Pdf Online Free - Odp To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Odp To Pdf Online Free - Odp To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Odp To Pdf online free - Odp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Odp To Pdf online free - Odp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="odp to pdf, odp to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/odp-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/odp-to-pdf">
   <meta property="og:title" content="Odp To Pdf Online Free - Odp To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Odp To Pdf online free - Odp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Odp To Pdf online free - Odp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-odp-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/odp-to-pdf">
   <meta name="twitter:title" content="Odp To Pdf Free">
-  <meta name="twitter:description" content="★ Odp To Pdf online free - Odp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Odp To Pdf online free - Odp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-odp-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Odp To Pdf">
-  
 
-    <title>ODP to PDF - Convert OpenDocument Presentation to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert OpenDocument Presentation (ODP) files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/odp-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/odp-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/odp-to-pdf.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/odp-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/odp-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>ODP to PDF - Convert OpenDocument Presentation to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert OpenDocument Presentation (ODP) files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/odp-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/odp-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/odp-to-pdf.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/odp-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/odp-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,163 +67,165 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:odpToPdf.name">Odp To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:odpToPdf.subtitle">
-                Convert OpenDocument Presentation (ODP) files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:odpToPdf.acceptedFormats">ODP files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".odp" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:odpToPdf.convertButton">Convert to PDF</span>
-                </button>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:odpToPdf.name">Odp To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:odpToPdf.subtitle">
+        Convert OpenDocument Presentation (ODP) files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:odpToPdf.acceptedFormats">ODP files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".odp" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:odpToPdf.convertButton">Convert to PDF</span>
+        </button>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -228,26 +233,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -260,14 +270,16 @@
           Is odp to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -279,84 +291,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/odp-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/odp-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -378,7 +389,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -407,7 +418,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/ods-to-pdf.html b/src/pages/ods-to-pdf.html
index 3b176ca..bb06391 100644
--- a/src/pages/ods-to-pdf.html
+++ b/src/pages/ods-to-pdf.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Ods To Pdf Online Free - Ods To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Ods To Pdf Online Free - Ods To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Ods To Pdf online free - Ods to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Ods To Pdf online free - Ods to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="ods to pdf, ods to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/ods-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/ods-to-pdf">
   <meta property="og:title" content="Ods To Pdf Online Free - Ods To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Ods To Pdf online free - Ods to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Ods To Pdf online free - Ods to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-ods-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/ods-to-pdf">
   <meta name="twitter:title" content="Ods To Pdf Free">
-  <meta name="twitter:description" content="★ Ods To Pdf online free - Ods to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Ods To Pdf online free - Ods to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-ods-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Ods To Pdf">
-  
 
-    <title>ODS to PDF - Convert OpenDocument Spreadsheet to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert OpenDocument Spreadsheet (ODS) files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/ods-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/ods-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/ods-to-pdf.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/ods-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/ods-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>ODS to PDF - Convert OpenDocument Spreadsheet to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert OpenDocument Spreadsheet (ODS) files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/ods-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/ods-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/ods-to-pdf.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/ods-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/ods-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,163 +67,165 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:odsToPdf.name">Ods To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:odsToPdf.subtitle">
-                Convert OpenDocument Spreadsheet (ODS) files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:odsToPdf.acceptedFormats">ODS files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".ods" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:odsToPdf.convertButton">Convert to PDF</span>
-                </button>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:odsToPdf.name">Ods To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:odsToPdf.subtitle">
+        Convert OpenDocument Spreadsheet (ODS) files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:odsToPdf.acceptedFormats">ODS files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".ods" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:odsToPdf.convertButton">Convert to PDF</span>
+        </button>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -228,26 +233,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -260,14 +270,16 @@
           Is ods to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -279,84 +291,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/ods-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/ods-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -378,7 +389,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -407,7 +418,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/odt-to-pdf.html b/src/pages/odt-to-pdf.html
index 658c884..7c0c3e6 100644
--- a/src/pages/odt-to-pdf.html
+++ b/src/pages/odt-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Odt To Pdf Online Free - Odt To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Odt To Pdf Online Free - Odt To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Odt To Pdf online free - Odt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Odt To Pdf online free - Odt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="odt to pdf, odt to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/odt-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/odt-to-pdf">
   <meta property="og:title" content="Odt To Pdf Online Free - Odt To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Odt To Pdf online free - Odt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Odt To Pdf online free - Odt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-odt-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/odt-to-pdf">
   <meta name="twitter:title" content="Odt To Pdf Free">
-  <meta name="twitter:description" content="★ Odt To Pdf online free - Odt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Odt To Pdf online free - Odt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-odt-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Odt To Pdf">
-  
 
-    <title>ODT to PDF - Convert OpenDocument Text to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert ODT (OpenDocument Text) files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/odt-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/odt-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/odt-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/odt-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>ODT to PDF - Convert OpenDocument Text to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert ODT (OpenDocument Text) files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/odt-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/odt-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/odt-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/odt-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,154 +66,155 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">Odt To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6">
-                Convert OpenDocument Text (.odt) files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">One or more ODT files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".odt,application/vnd.oasis.opendocument.text" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Convert to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">Odt To Pdf Converter Free Online - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6">
+        Convert OpenDocument Text (.odt) files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">One or more ODT files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".odt,application/vnd.oasis.opendocument.text" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Convert to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -218,26 +222,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -250,14 +259,16 @@
           Is odt to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -269,96 +280,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/odt-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/odt-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -380,7 +390,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -409,7 +419,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/organize-pdf.html b/src/pages/organize-pdf.html
index dc0846e..de0e6e4 100644
--- a/src/pages/organize-pdf.html
+++ b/src/pages/organize-pdf.html
@@ -2,53 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Organize PDF Online Free - Organize PDF Tool | BentoPDF</title>
   <meta name="title" content="Organize PDF Online Free - Organize PDF Tool | BentoPDF">
-  <meta name="description" content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="organize pdf, reorder pages, arrange pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/organize-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/organize-pdf">
   <meta property="og:title" content="Organize PDF Online Free - Organize PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-organize-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/organize-pdf">
   <meta name="twitter:title" content="Organize PDF Free">
-  <meta name="twitter:description" content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Organize PDF online free - Organize PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-organize-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Organize PDF">
-  
 
-    <title>Duplicate and Organize PDF Pages - BentoPDF</title>
-    <meta name="description" content="Reorder, duplicate, and organize PDF pages. Free and secure.">
-    
-    <link rel="alternate" hreflang="en" href="/en/organize-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/organize-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/organize-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/organize-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Duplicate and Organize PDF Pages - BentoPDF</title>
+  <meta name="description" content="Reorder, duplicate, and organize PDF pages. Free and secure.">
+
+  <link rel="alternate" hreflang="en" href="/en/organize-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/organize-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/organize-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/organize-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -62,114 +65,117 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer">Back to Tools</span>
-            </button>
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:duplicateOrganize.name">Organize PDF Pages Free - Reorder PDFs Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:duplicateOrganize.subtitle">
-                Drag pages to reorder them. Use the <i data-lucide="copy-plus"
-                    class="inline-block w-4 h-4 mx-1 align-text-bottom text-green-500"></i> icon to duplicate a page or
-                the <i data-lucide="x-circle" class="inline-block w-4 h-4 mx-1 align-text-bottom text-red-400"></i> icon
-                to
-                delete it.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF Documents</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <!-- File Display -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Page Grid (shown after file upload) -->
-            <div id="page-grid" class="hidden grid grid-cols-3 sm:grid-cols-4 md:grid-cols-6 gap-4 my-6"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6">Save Changes</button>
-        </div>
-    </div>
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
-    </div>
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg"
-                data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
+      </div>
     </div>
+  </nav>
+
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer">Back to Tools</span>
+      </button>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:duplicateOrganize.name">Organize PDF Pages Free -
+        Reorder PDFs Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:duplicateOrganize.subtitle">
+        Drag pages to reorder them. Use the <i data-lucide="copy-plus"
+          class="inline-block w-4 h-4 mx-1 align-text-bottom text-green-500"></i> icon to duplicate a page or
+        the <i data-lucide="x-circle" class="inline-block w-4 h-4 mx-1 align-text-bottom text-red-400"></i> icon
+        to
+        delete it.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF Documents</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
+        </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <!-- File Display -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Page Grid (shown after file upload) -->
+      <div id="page-grid" class="hidden grid grid-cols-3 sm:grid-cols-4 md:grid-cols-6 gap-4 my-6"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6">Save Changes</button>
+    </div>
+  </div>
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg"
+        data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -177,26 +183,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-        <a href="/delete-pages.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
-        <a href="/extract-pages.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
-          <p class="text-gray-400 text-sm">Free online extract pages tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
+      <a href="/delete-pages.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+        <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+      </a>
+      <a href="/extract-pages.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
+        <p class="text-gray-400 text-sm">Free online extract pages tool</p>
+      </a>
     </div>
   </section>
 
@@ -209,14 +220,16 @@
           Is organize pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -228,80 +241,79 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/organize-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/organize-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -323,7 +335,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -352,7 +364,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/page-dimensions.html b/src/pages/page-dimensions.html
index b26aa45..b04ea60 100644
--- a/src/pages/page-dimensions.html
+++ b/src/pages/page-dimensions.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Page Dimensions Online Free - Page Dimensions Tool | BentoPDF</title>
   <meta name="title" content="Page Dimensions Online Free - Page Dimensions Tool | BentoPDF">
-  <meta name="description" content="★ Page Dimensions online free - Page dimensions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Page Dimensions online free - Page dimensions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="page dimensions, page dimensions, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/page-dimensions">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/page-dimensions">
   <meta property="og:title" content="Page Dimensions Online Free - Page Dimensions Tool | BentoPDF">
-  <meta property="og:description" content="★ Page Dimensions online free - Page dimensions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Page Dimensions online free - Page dimensions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-page-dimensions.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/page-dimensions">
   <meta name="twitter:title" content="Page Dimensions Free">
-  <meta name="twitter:description" content="★ Page Dimensions online free - Page dimensions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ Page Dimensions online free - Page dimensions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-page-dimensions.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Page Dimensions">
-  
 
-    <title>Page Dimensions - Analyze PDF Page Sizes - BentoPDF</title>
-    <meta name="description"
-        content="Analyze PDF page dimensions and sizes. View detailed information about each page including dimensions, orientation, and aspect ratio. Export to CSV. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/page-dimensions.html" />
-    <link rel="alternate" hreflang="de" href="/de/page-dimensions.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/page-dimensions.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/page-dimensions.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Page Dimensions - Analyze PDF Page Sizes - BentoPDF</title>
+  <meta name="description"
+    content="Analyze PDF page dimensions and sizes. View detailed information about each page including dimensions, orientation, and aspect ratio. Export to CSV. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/page-dimensions.html" />
+  <link rel="alternate" hreflang="de" href="/de/page-dimensions.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/page-dimensions.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/page-dimensions.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,166 +64,167 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pageDimensions.name">Page Dimensions Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pageDimensions.subtitle">
-                Analyze PDF page dimensions and sizes. View detailed information about each page.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="dimensions-results" class="hidden mt-6">
-                <div id="dimensions-summary" class="mb-6"></div>
-
-                <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-4">
-                    <div class="flex items-center gap-2">
-                        <label for="units-select" class="text-sm font-medium text-gray-300">Units:</label>
-                        <select id="units-select"
-                            class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg p-2">
-                            <option value="pt">Points (pt)</option>
-                            <option value="in">Inches (in)</option>
-                            <option value="mm">Millimeters (mm)</option>
-                            <option value="px">Pixels (px)</option>
-                        </select>
-                    </div>
-                    <button id="export-csv-btn"
-                        class="flex items-center gap-2 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors">
-                        <i data-lucide="download" class="w-4 h-4"></i>
-                        <span>Export to CSV</span>
-                    </button>
-                </div>
-
-                <div class="overflow-x-auto rounded-lg border border-gray-700">
-                    <table class="w-full text-sm text-left">
-                        <thead class="text-xs uppercase bg-gray-900 text-gray-400">
-                            <tr>
-                                <th class="px-4 py-3">Page #</th>
-                                <th class="px-4 py-3">Dimensions</th>
-                                <th class="px-4 py-3">Standard Size</th>
-                                <th class="px-4 py-3">Orientation</th>
-                                <th class="px-4 py-3">Aspect Ratio</th>
-                                <th class="px-4 py-3">Area</th>
-                                <th class="px-4 py-3">Rotation</th>
-                            </tr>
-                        </thead>
-                        <tbody id="dimensions-table-body" class="bg-gray-800 divide-y divide-gray-700">
-                        </tbody>
-                    </table>
-                </div>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
+
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pageDimensions.name">Page Dimensions Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pageDimensions.subtitle">
+        Analyze PDF page dimensions and sizes. View detailed information about each page.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
+        </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="dimensions-results" class="hidden mt-6">
+        <div id="dimensions-summary" class="mb-6"></div>
+
+        <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-4">
+          <div class="flex items-center gap-2">
+            <label for="units-select" class="text-sm font-medium text-gray-300">Units:</label>
+            <select id="units-select" class="bg-gray-700 border border-gray-600 text-white text-sm rounded-lg p-2">
+              <option value="pt">Points (pt)</option>
+              <option value="in">Inches (in)</option>
+              <option value="mm">Millimeters (mm)</option>
+              <option value="px">Pixels (px)</option>
+            </select>
+          </div>
+          <button id="export-csv-btn"
+            class="flex items-center gap-2 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors">
+            <i data-lucide="download" class="w-4 h-4"></i>
+            <span>Export to CSV</span>
+          </button>
+        </div>
+
+        <div class="overflow-x-auto rounded-lg border border-gray-700">
+          <table class="w-full text-sm text-left">
+            <thead class="text-xs uppercase bg-gray-900 text-gray-400">
+              <tr>
+                <th class="px-4 py-3">Page #</th>
+                <th class="px-4 py-3">Dimensions</th>
+                <th class="px-4 py-3">Standard Size</th>
+                <th class="px-4 py-3">Orientation</th>
+                <th class="px-4 py-3">Aspect Ratio</th>
+                <th class="px-4 py-3">Area</th>
+                <th class="px-4 py-3">Rotation</th>
+              </tr>
+            </thead>
+            <tbody id="dimensions-table-body" class="bg-gray-800 divide-y divide-gray-700">
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -228,26 +232,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -260,14 +269,16 @@
           Is page dimensions really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -279,74 +290,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/page-dimensions-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/page-dimensions-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -368,7 +378,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -397,7 +407,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/page-numbers.html b/src/pages/page-numbers.html
index 9973e49..5b18e4d 100644
--- a/src/pages/page-numbers.html
+++ b/src/pages/page-numbers.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Page Numbers Online Free - Page Numbers Tool | BentoPDF</title>
   <meta name="title" content="Page Numbers Online Free - Page Numbers Tool | BentoPDF">
-  <meta name="description" content="★ Page Numbers online free - Page numbers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Page Numbers online free - Page numbers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="page numbers, page numbers, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/page-numbers">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/page-numbers">
   <meta property="og:title" content="Page Numbers Online Free - Page Numbers Tool | BentoPDF">
-  <meta property="og:description" content="★ Page Numbers online free - Page numbers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Page Numbers online free - Page numbers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-page-numbers.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/page-numbers">
   <meta name="twitter:title" content="Page Numbers Free">
-  <meta name="twitter:description" content="★ Page Numbers online free - Page numbers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
+  <meta name="twitter:description"
+    content="★ Page Numbers online free - Page numbers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-page-numbers.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Page Numbers">
-  
 
-    <title>Add Page Numbers - BentoPDF</title>
-    <meta name="description"
-        content="Add page numbers to your PDF documents. Choose position, format, font size and color. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/page-numbers.html" />
-    <link rel="alternate" hreflang="de" href="/de/page-numbers.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/page-numbers.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/page-numbers.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Add Page Numbers - BentoPDF</title>
+  <meta name="description"
+    content="Add page numbers to your PDF documents. Choose position, format, font size and color. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/page-numbers.html" />
+  <link rel="alternate" hreflang="de" href="/de/page-numbers.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/page-numbers.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/page-numbers.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,181 +66,182 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pageNumbers.name">Page Numbers Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pageNumbers.subtitle">
-                Add page numbers to your PDF documents with customizable position, format, and styling.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-4">
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                    <div>
-                        <label for="position" class="block mb-2 text-sm font-medium text-gray-300">Position</label>
-                        <select id="position"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
-                            <option value="bottom-center">Bottom Center</option>
-                            <option value="bottom-left">Bottom Left</option>
-                            <option value="bottom-right">Bottom Right</option>
-                            <option value="top-center">Top Center</option>
-                            <option value="top-left">Top Left</option>
-                            <option value="top-right">Top Right</option>
-                        </select>
-                    </div>
-
-                    <div>
-                        <label for="number-format" class="block mb-2 text-sm font-medium text-gray-300">Format</label>
-                        <select id="number-format"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
-                            <option value="page_only">1, 2, 3...</option>
-                            <option value="page_x_of_y">1 / 5, 2 / 5...</option>
-                        </select>
-                    </div>
-                </div>
-
-                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
-                    <div>
-                        <label for="font-size" class="block mb-2 text-sm font-medium text-gray-300">Font Size</label>
-                        <input type="number" id="font-size" value="12" min="6" max="72"
-                            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
-                    </div>
-
-                    <div>
-                        <label for="text-color" class="block mb-2 text-sm font-medium text-gray-300">Color</label>
-                        <input type="color" id="text-color" value="#000000"
-                            class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Add Page Numbers</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pageNumbers.name">Page Numbers Free Online - Fast
+        & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pageNumbers.subtitle">
+        Add page numbers to your PDF documents with customizable position, format, and styling.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-4">
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+          <div>
+            <label for="position" class="block mb-2 text-sm font-medium text-gray-300">Position</label>
+            <select id="position"
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
+              <option value="bottom-center">Bottom Center</option>
+              <option value="bottom-left">Bottom Left</option>
+              <option value="bottom-right">Bottom Right</option>
+              <option value="top-center">Top Center</option>
+              <option value="top-left">Top Left</option>
+              <option value="top-right">Top Right</option>
+            </select>
+          </div>
+
+          <div>
+            <label for="number-format" class="block mb-2 text-sm font-medium text-gray-300">Format</label>
+            <select id="number-format"
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
+              <option value="page_only">1, 2, 3...</option>
+              <option value="page_x_of_y">1 / 5, 2 / 5...</option>
+            </select>
+          </div>
+        </div>
+
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+          <div>
+            <label for="font-size" class="block mb-2 text-sm font-medium text-gray-300">Font Size</label>
+            <input type="number" id="font-size" value="12" min="6" max="72"
+              class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
+          </div>
+
+          <div>
+            <label for="text-color" class="block mb-2 text-sm font-medium text-gray-300">Color</label>
+            <input type="color" id="text-color" value="#000000"
+              class="w-full h-10 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
+          </div>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Add Page Numbers</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -245,26 +249,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -277,14 +286,16 @@
           Is page numbers really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -296,77 +307,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/page-numbers-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/page-numbers-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -388,7 +398,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -417,7 +427,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pages-to-pdf.html b/src/pages/pages-to-pdf.html
index 2b27ca4..d6d63af 100644
--- a/src/pages/pages-to-pdf.html
+++ b/src/pages/pages-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pages To Pdf Online Free - Pages To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Pages To Pdf Online Free - Pages To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Pages To Pdf online free - Pages to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pages To Pdf online free - Pages to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pages to pdf, pages to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pages-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pages-to-pdf">
   <meta property="og:title" content="Pages To Pdf Online Free - Pages To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Pages To Pdf online free - Pages to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pages To Pdf online free - Pages to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pages-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pages-to-pdf">
   <meta name="twitter:title" content="Pages To Pdf Free">
-  <meta name="twitter:description" content="★ Pages To Pdf online free - Pages to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
+  <meta name="twitter:description"
+    content="★ Pages To Pdf online free - Pages to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pages-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pages To Pdf">
-  
 
-    <title>Pages to PDF - Convert WordPerfect to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Apple Pages documents to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pages-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/pages-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pages-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pages-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Pages to PDF - Convert WordPerfect to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Apple Pages documents to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pages-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/pages-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pages-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pages-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,163 +66,165 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pagesToPdf.name">Pages To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pagesToPdf.subtitle">
-                Convert Apple Pages documents to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:pagesToPdf.acceptedFormats">Pages files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".pages" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:pagesToPdf.convertButton">Convert to PDF</span>
-                </button>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pagesToPdf.name">Pages To Pdf Converter Free
+        Online - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pagesToPdf.subtitle">
+        Convert Apple Pages documents to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:pagesToPdf.acceptedFormats">Pages files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".pages" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:pagesToPdf.convertButton">Convert to PDF</span>
+        </button>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -227,26 +232,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -259,14 +269,16 @@
           Is pages to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -278,84 +290,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pages-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pages-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -377,7 +388,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -406,7 +417,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-booklet.html b/src/pages/pdf-booklet.html
index 799b2e6..55262c1 100644
--- a/src/pages/pdf-booklet.html
+++ b/src/pages/pdf-booklet.html
@@ -4,41 +4,44 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>Pdf Booklet Online Free - Pdf Booklet Tool | BentoPDF</title>
-  <meta name="title" content="Pdf Booklet Online Free - Pdf Booklet Tool | BentoPDF">
-  <meta name="description" content="★ Pdf Booklet online free - Pdf booklet PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta name="keywords" content="pdf booklet, pdf booklet, online pdf">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/pdf-booklet">
-  
-  <!-- Open Graph / Facebook / LinkedIn -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/pdf-booklet">
-  <meta property="og:title" content="Pdf Booklet Online Free - Pdf Booklet Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf Booklet online free - Pdf booklet PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-booklet.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:url" content="https://www.bentopdf.com/pdf-booklet">
-  <meta name="twitter:title" content="Pdf Booklet Free">
-  <meta name="twitter:description" content="★ Pdf Booklet online free - Pdf booklet PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-booklet.png">
-  <meta name="twitter:site" content="@BentoPDF">
-  
-  <!-- Mobile Web App -->
-  <meta name="mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-title" content="Pdf Booklet">
-  
+
+    <!-- Primary Meta Tags -->
+    <title>Pdf Booklet Online Free - Pdf Booklet Tool | BentoPDF</title>
+    <meta name="title" content="Pdf Booklet Online Free - Pdf Booklet Tool | BentoPDF">
+    <meta name="description"
+        content="★ Pdf Booklet online free - Pdf booklet PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta name="keywords" content="pdf booklet, pdf booklet, online pdf">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/pdf-booklet">
+
+    <!-- Open Graph / Facebook / LinkedIn -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/pdf-booklet">
+    <meta property="og:title" content="Pdf Booklet Online Free - Pdf Booklet Tool | BentoPDF">
+    <meta property="og:description"
+        content="★ Pdf Booklet online free - Pdf booklet PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-booklet.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="https://www.bentopdf.com/pdf-booklet">
+    <meta name="twitter:title" content="Pdf Booklet Free">
+    <meta name="twitter:description"
+        content="★ Pdf Booklet online free - Pdf booklet PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-booklet.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+    <!-- Mobile Web App -->
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Pdf Booklet">
+
 
     <title>PDF Booklet - BentoPDF</title>
     <meta name="description"
@@ -50,15 +53,15 @@
     <link rel="alternate" hreflang="x-default" href="/en/pdf-booklet.html" />
     <link href="/src/css/styles.css" rel="stylesheet" />
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -66,7 +69,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -115,7 +118,8 @@
                 <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
             </button>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfBooklet.name">Pdf Booklet Free Online - Fast & Secure</h1>
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfBooklet.name">Pdf Booklet Free Online -
+                Fast & Secure</h1>
             <p class="text-gray-400 mb-6" data-i18n="tools:pdfBooklet.subtitle">
                 Rearrange pages for double-sided booklet printing. Fold and staple to create a booklet.
             </p>
@@ -309,104 +313,115 @@
         </div>
     </div>
 
-    
-  <!-- How It Works Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
-    <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
-        </div>
-    </div>
-  </section>
 
-  <!-- Related Tools Section -->
-  <section class="max-w-6xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
-    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-    </div>
-  </section>
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+                    <p class="text-gray-400">Click or drag and drop your file to begin</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+                    <p class="text-gray-400">Click the process button to start</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+                    <p class="text-gray-400">Save your processed file instantly</p>
+                </div>
+            </div>
+        </div>
+    </section>
 
-  <!-- FAQ Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-    <div class="space-y-4">
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Is pdf booklet really free?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Are my files private and secure?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Is there a file size limit?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">No! Process files of any size, as many times as you want, completely free.</p>
-      </details>
-    </div>
-  </section>
-  <footer class="mt-16 border-t-2 border-gray-700 py-8">
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/merge-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+            </a>
+            <a href="/compress-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+            </a>
+            <a href="/split-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+            </a>
+            <a href="/edit-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+            </a>
+            <a href="/rotate-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is pdf booklet really free?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and
+                    unlimited file processing.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Are my files private and secure?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave
+                    your device, ensuring complete privacy.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is there a file size limit?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No! Process files of any size, as many times as you want, completely free.
+                </p>
+            </details>
+        </div>
+    </section>
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
+                    <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
                     <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
                 </div>
                 <div>
@@ -467,8 +482,8 @@
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
 
-  <!-- JSON-LD Structured Data -->
-  <script type="application/ld+json">
+    <!-- JSON-LD Structured Data -->
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "SoftwareApplication",
@@ -487,8 +502,8 @@
     }
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "HowTo",
@@ -516,8 +531,8 @@
     ]
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "BreadcrumbList",
diff --git a/src/pages/pdf-layers.html b/src/pages/pdf-layers.html
index 02c8878..01aa41b 100644
--- a/src/pages/pdf-layers.html
+++ b/src/pages/pdf-layers.html
@@ -4,48 +4,51 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>Pdf Layers Online Free - Pdf Layers Tool | BentoPDF</title>
-  <meta name="title" content="Pdf Layers Online Free - Pdf Layers Tool | BentoPDF">
-  <meta name="description" content="★ Pdf Layers online free - Pdf layers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta name="keywords" content="pdf layers, pdf layers, online pdf">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/pdf-layers">
-  
-  <!-- Open Graph / Facebook / LinkedIn -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/pdf-layers">
-  <meta property="og:title" content="Pdf Layers Online Free - Pdf Layers Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf Layers online free - Pdf layers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-layers.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:url" content="https://www.bentopdf.com/pdf-layers">
-  <meta name="twitter:title" content="Pdf Layers Free">
-  <meta name="twitter:description" content="★ Pdf Layers online free - Pdf layers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-layers.png">
-  <meta name="twitter:site" content="@BentoPDF">
-  
-  <!-- Mobile Web App -->
-  <meta name="mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-title" content="Pdf Layers">
-  
+
+    <!-- Primary Meta Tags -->
+    <title>Pdf Layers Online Free - Pdf Layers Tool | BentoPDF</title>
+    <meta name="title" content="Pdf Layers Online Free - Pdf Layers Tool | BentoPDF">
+    <meta name="description"
+        content="★ Pdf Layers online free - Pdf layers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta name="keywords" content="pdf layers, pdf layers, online pdf">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/pdf-layers">
+
+    <!-- Open Graph / Facebook / LinkedIn -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/pdf-layers">
+    <meta property="og:title" content="Pdf Layers Online Free - Pdf Layers Tool | BentoPDF">
+    <meta property="og:description"
+        content="★ Pdf Layers online free - Pdf layers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-layers.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="https://www.bentopdf.com/pdf-layers">
+    <meta name="twitter:title" content="Pdf Layers Free">
+    <meta name="twitter:description"
+        content="★ Pdf Layers online free - Pdf layers PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-layers.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+    <!-- Mobile Web App -->
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Pdf Layers">
+
 
     <title>PDF Layers - Manage OCG Layers - BentoPDF</title>
     <meta name="description"
         content="View, toggle, add, and delete Optional Content Groups (OCG) in your PDF files. Free, secure, and runs entirely in your browser.">
-    
+
     <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
     <style>
         .layers-container {
             background: #374151;
@@ -165,15 +168,15 @@
         }
     </style>
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -181,7 +184,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -313,105 +316,116 @@
         </div>
     </div>
 
-    
-  <!-- How It Works Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
-    <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
-        </div>
-    </div>
-  </section>
 
-  <!-- Related Tools Section -->
-  <section class="max-w-6xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
-    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-    </div>
-  </section>
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+                    <p class="text-gray-400">Click or drag and drop your file to begin</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+                    <p class="text-gray-400">Click the process button to start</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+                    <p class="text-gray-400">Save your processed file instantly</p>
+                </div>
+            </div>
+        </div>
+    </section>
 
-  <!-- FAQ Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-    <div class="space-y-4">
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Is pdf layers really free?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Are my files private and secure?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Is there a file size limit?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">No! Process files of any size, as many times as you want, completely free.</p>
-      </details>
-    </div>
-  </section>
-  <footer class="mt-16 border-t-2 border-gray-700 py-8">
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/merge-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+            </a>
+            <a href="/compress-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+            </a>
+            <a href="/split-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+            </a>
+            <a href="/edit-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+            </a>
+            <a href="/rotate-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is pdf layers really free?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and
+                    unlimited file processing.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Are my files private and secure?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave
+                    your device, ensuring complete privacy.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is there a file size limit?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No! Process files of any size, as many times as you want, completely free.
+                </p>
+            </details>
+        </div>
+    </section>
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
                     <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
+                        &copy; 2026 BentoPDF. All rights reserved.
                     </p>
                     <p class="text-gray-500 text-xs mt-2">
                         Version <span id="app-version"></span>
@@ -482,8 +496,8 @@
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
 
-  <!-- JSON-LD Structured Data -->
-  <script type="application/ld+json">
+    <!-- JSON-LD Structured Data -->
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "SoftwareApplication",
@@ -502,8 +516,8 @@
     }
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "HowTo",
@@ -531,8 +545,8 @@
     ]
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "BreadcrumbList",
diff --git a/src/pages/pdf-multi-tool.html b/src/pages/pdf-multi-tool.html
index b8f7cfd..af8b73b 100644
--- a/src/pages/pdf-multi-tool.html
+++ b/src/pages/pdf-multi-tool.html
@@ -94,7 +94,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
diff --git a/src/pages/pdf-to-bmp.html b/src/pages/pdf-to-bmp.html
index e97574d..ab85330 100644
--- a/src/pages/pdf-to-bmp.html
+++ b/src/pages/pdf-to-bmp.html
@@ -2,54 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Bmp Online Free - Pdf To Bmp Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Bmp Online Free - Pdf To Bmp Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Bmp online free - Pdf to bmp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Bmp online free - Pdf to bmp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to bmp, pdf to bmp, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-bmp">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-bmp">
   <meta property="og:title" content="Pdf To Bmp Online Free - Pdf To Bmp Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Bmp online free - Pdf to bmp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Bmp online free - Pdf to bmp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-bmp.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-bmp">
   <meta name="twitter:title" content="Pdf To Bmp Free">
-  <meta name="twitter:description" content="★ Pdf To Bmp online free - Pdf to bmp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Pdf To Bmp online free - Pdf to bmp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-bmp.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Bmp">
-  
 
-    <title>PDF to BMP - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF pages to BMP images. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-bmp.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-bmp.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-bmp.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-bmp.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to BMP - BentoPDF</title>
+  <meta name="description" content="Convert PDF pages to BMP images. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-bmp.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-bmp.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-bmp.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-bmp.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,144 +65,145 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToBmp.name">Pdf To Bmp Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToBmp.subtitle">
-                Convert each page of a PDF file into a BMP image.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToBmp.name">Pdf To Bmp Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToBmp.subtitle">
+        Convert each page of a PDF file into a BMP image.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -208,26 +211,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -240,14 +248,16 @@
           Is pdf to bmp really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -259,84 +269,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-bmp-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-bmp-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -358,7 +367,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -387,7 +396,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-csv.html b/src/pages/pdf-to-csv.html
index 63f020b..59547aa 100644
--- a/src/pages/pdf-to-csv.html
+++ b/src/pages/pdf-to-csv.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Csv Online Free - Pdf To Csv Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Csv Online Free - Pdf To Csv Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Csv online free - Pdf to csv PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Csv online free - Pdf to csv PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to csv, pdf to csv, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-csv">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-csv">
   <meta property="og:title" content="Pdf To Csv Online Free - Pdf To Csv Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Csv online free - Pdf to csv PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Csv online free - Pdf to csv PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-csv.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-csv">
   <meta name="twitter:title" content="Pdf To Csv Free">
-  <meta name="twitter:description" content="★ Pdf To Csv online free - Pdf to csv PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Pdf To Csv online free - Pdf to csv PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-csv.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Csv">
-  
 
-    <title>PDF to CSV - BentoPDF</title>
-    <meta name="description"
-        content="Extract tables from PDF files and convert to CSV format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-csv.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-csv.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-csv.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/pdf-to-csv.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-csv.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to CSV - BentoPDF</title>
+  <meta name="description"
+    content="Extract tables from PDF files and convert to CSV format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-csv.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-csv.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-csv.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/pdf-to-csv.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-csv.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,124 +67,125 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToCsv.name">Pdf To Csv Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToCsv.subtitle">Extract tables from PDF and convert to CSV
-                format.</p>
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-            <div id="options-panel" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Convert to CSV</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+  </nav>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToCsv.name">Pdf To Csv Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToCsv.subtitle">Extract tables from PDF and convert to CSV
+        format.</p>
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+      <div id="options-panel" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Convert to CSV</button>
+      </div>
     </div>
-    
+  </div>
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+    </div>
+  </div>
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -189,26 +193,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -221,14 +230,16 @@
           Is pdf to csv really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -240,69 +251,69 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub"><svg class="w-6 h-6"
-                                fill="currentColor" viewBox="0 0 24 24">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg></a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord"><svg class="w-6 h-6"
-                                fill="currentColor" viewBox="0 0 24 24">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg></a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X"><svg
-                                class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg></a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-csv-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub"><svg class="w-6 h-6" fill="currentColor"
+                viewBox="0 0 24 24">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg></a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord"><svg class="w-6 h-6" fill="currentColor"
+                viewBox="0 0 24 24">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg></a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X"><svg class="w-6 h-6"
+                fill="currentColor" viewBox="0 0 24 24">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg></a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-csv-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -324,7 +335,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -353,7 +364,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-docx.html b/src/pages/pdf-to-docx.html
index 7b42f8c..b7305cd 100644
--- a/src/pages/pdf-to-docx.html
+++ b/src/pages/pdf-to-docx.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>PDF to Word Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="PDF to Word Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to word, pdf to docx, convert pdf to word">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-docx">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-docx">
   <meta property="og:title" content="PDF to Word Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-docx.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-docx">
   <meta name="twitter:title" content="PDF to Word Free">
-  <meta name="twitter:description" content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ PDF to Word online free - Convert PDF to Word PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-docx.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="PDF to Word">
-  
 
-    <title>PDF to DOCX - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF files to editable Word documents (DOCX). Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-docx.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-docx.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to DOCX - BentoPDF</title>
+  <meta name="description"
+    content="Convert PDF files to editable Word documents (DOCX). Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-docx.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-docx.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,154 +64,155 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools">Back to Tools</span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">PDF to Word Converter Free - Convert PDF to DOCX</h1>
-            <p class="text-gray-400 mb-6">
-                Convert PDF files to editable Word documents. Preserves text, formatting, and layout.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span>
-                        <span data-i18n="upload.orDragAndDrop">or drag and drop</span>
-                    </p>
-                    <p class="text-xs text-gray-500">One or more PDF files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6 space-y-6">
-                <button id="process-btn" class="btn-gradient w-full mt-4">Convert to DOCX</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools">Back to Tools</span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">PDF to Word Converter Free - Convert PDF to DOCX</h1>
+      <p class="text-gray-400 mb-6">
+        Convert PDF files to editable Word documents. Preserves text, formatting, and layout.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span>
+            <span data-i18n="upload.orDragAndDrop">or drag and drop</span>
+          </p>
+          <p class="text-xs text-gray-500">One or more PDF files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6 space-y-6">
+        <button id="process-btn" class="btn-gradient w-full mt-4">Convert to DOCX</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -216,26 +220,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/word-to-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Word To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online word to pdf tool</p>
-        </a>
-        <a href="/pdf-to-text.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Text</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to text tool</p>
-        </a>
-        <a href="/pdf-to-excel.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Excel</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to excel tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/extract-pages.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
-          <p class="text-gray-400 text-sm">Free online extract pages tool</p>
-        </a>
+      <a href="/word-to-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Word To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online word to pdf tool</p>
+      </a>
+      <a href="/pdf-to-text.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Text</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to text tool</p>
+      </a>
+      <a href="/pdf-to-excel.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Excel</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to excel tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/extract-pages.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
+        <p class="text-gray-400 text-sm">Free online extract pages tool</p>
+      </a>
     </div>
   </section>
 
@@ -248,14 +257,16 @@
           Is pdf to docx really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -267,96 +278,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-docx-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-docx-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -378,7 +388,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -407,7 +417,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-excel.html b/src/pages/pdf-to-excel.html
index fdd4826..84b6802 100644
--- a/src/pages/pdf-to-excel.html
+++ b/src/pages/pdf-to-excel.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>PDF to Excel Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="PDF to Excel Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ PDF to Excel online free - Convert PDF to Excel PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ PDF to Excel online free - Convert PDF to Excel PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to excel, pdf to xlsx, convert pdf to spreadsheet">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-excel">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-excel">
   <meta property="og:title" content="PDF to Excel Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ PDF to Excel online free - Convert PDF to Excel PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ PDF to Excel online free - Convert PDF to Excel PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-excel.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-excel">
   <meta name="twitter:title" content="PDF to Excel Free">
-  <meta name="twitter:description" content="★ PDF to Excel online free - Convert PDF to Excel PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
+  <meta name="twitter:description"
+    content="★ PDF to Excel online free - Convert PDF to Excel PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-excel.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="PDF to Excel">
-  
 
-    <title>PDF to Excel - BentoPDF</title>
-    <meta name="description"
-        content="Extract tables from PDF files and convert to Excel (XLSX) format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-excel.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-excel.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-excel.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/pdf-to-excel.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-excel.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to Excel - BentoPDF</title>
+  <meta name="description"
+    content="Extract tables from PDF files and convert to Excel (XLSX) format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-excel.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-excel.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-excel.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/pdf-to-excel.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-excel.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,124 +67,125 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToExcel.name">PDF to Excel Converter Free - Extract Tables</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToExcel.subtitle">Extract tables from PDF and convert to
-                Excel (XLSX) format.</p>
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-            <div id="options-panel" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Convert to Excel</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+  </nav>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToExcel.name">PDF to Excel Converter Free -
+        Extract Tables</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToExcel.subtitle">Extract tables from PDF and convert to
+        Excel (XLSX) format.</p>
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+      <div id="options-panel" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Convert to Excel</button>
+      </div>
     </div>
-    
+  </div>
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+    </div>
+  </div>
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -189,26 +193,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -221,14 +230,16 @@
           Is pdf to excel really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -240,69 +251,69 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub"><svg class="w-6 h-6"
-                                fill="currentColor" viewBox="0 0 24 24">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg></a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord"><svg class="w-6 h-6"
-                                fill="currentColor" viewBox="0 0 24 24">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg></a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X"><svg
-                                class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg></a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-excel-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub"><svg class="w-6 h-6" fill="currentColor"
+                viewBox="0 0 24 24">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg></a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord"><svg class="w-6 h-6" fill="currentColor"
+                viewBox="0 0 24 24">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg></a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X"><svg class="w-6 h-6"
+                fill="currentColor" viewBox="0 0 24 24">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg></a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-excel-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -324,7 +335,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -353,7 +364,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-greyscale.html b/src/pages/pdf-to-greyscale.html
index 9a1b53d..7dee532 100644
--- a/src/pages/pdf-to-greyscale.html
+++ b/src/pages/pdf-to-greyscale.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Greyscale Online Free - Pdf To Greyscale Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Greyscale Online Free - Pdf To Greyscale Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Greyscale online free - Pdf to greyscale PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Greyscale online free - Pdf to greyscale PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to greyscale, pdf to greyscale, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-greyscale">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-greyscale">
   <meta property="og:title" content="Pdf To Greyscale Online Free - Pdf To Greyscale Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Greyscale online free - Pdf to greyscale PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Greyscale online free - Pdf to greyscale PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-greyscale.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-greyscale">
   <meta name="twitter:title" content="Pdf To Greyscale Free">
-  <meta name="twitter:description" content="★ Pdf To Greyscale online free - Pdf to greyscale PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
+  <meta name="twitter:description"
+    content="★ Pdf To Greyscale online free - Pdf to greyscale PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in b">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-greyscale.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Greyscale">
-  
 
-    <title>PDF to Greyscale - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF colors to greyscale/black and white. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-greyscale.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-greyscale.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-greyscale.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-greyscale.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to Greyscale - BentoPDF</title>
+  <meta name="description"
+    content="Convert PDF colors to greyscale/black and white. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-greyscale.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-greyscale.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-greyscale.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-greyscale.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,144 +66,145 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToGreyscale.name">Pdf To Greyscale Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToGreyscale.subtitle">
-                Convert all colors in a PDF to black and white.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Convert to Greyscale</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToGreyscale.name">Pdf To Greyscale Converter
+        Free Online - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToGreyscale.subtitle">
+        Convert all colors in a PDF to black and white.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Convert to Greyscale</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -208,26 +212,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -240,14 +249,16 @@
           Is pdf to greyscale really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -259,84 +270,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-greyscale-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-greyscale-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -358,7 +368,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -387,7 +397,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-jpg.html b/src/pages/pdf-to-jpg.html
index 92c9771..407a8d2 100644
--- a/src/pages/pdf-to-jpg.html
+++ b/src/pages/pdf-to-jpg.html
@@ -2,54 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>PDF to JPG Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="PDF to JPG Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to jpg, pdf to image, pdf to jpeg, convert pdf to pictures">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-jpg">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-jpg">
   <meta property="og:title" content="PDF to JPG Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-jpg.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-jpg">
   <meta name="twitter:title" content="PDF to JPG Free">
-  <meta name="twitter:description" content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
+  <meta name="twitter:description"
+    content="★ PDF to JPG online free - Convert PDF to JPG PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-jpg.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="PDF to JPG">
-  
 
-    <title>PDF to JPG - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF pages to JPG images. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-jpg.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-jpg.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-jpg.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-jpg.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to JPG - BentoPDF</title>
+  <meta name="description" content="Convert PDF pages to JPG images. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-jpg.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-jpg.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-jpg.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-jpg.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,162 +65,164 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToJpg.name">PDF to JPG Converter Free - Convert PDF to Images</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToJpg.subtitle">
-                Convert each page of a PDF file into a high-quality JPG image.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="jpg-quality" class="block mb-2 text-sm font-medium text-gray-300">Image Quality</label>
-                    <div class="flex items-center gap-4">
-                        <input type="range" id="jpg-quality" min="0.1" max="1.0" step="0.01" value="0.9" class="flex-1">
-                        <span id="jpg-quality-value" class="text-white font-medium w-16 text-right">90%</span>
-                    </div>
-                    <p class="mt-1 text-xs text-gray-400">Higher quality = larger file size</p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToJpg.name">PDF to JPG Converter Free - Convert
+        PDF to Images</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToJpg.subtitle">
+        Convert each page of a PDF file into a high-quality JPG image.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="jpg-quality" class="block mb-2 text-sm font-medium text-gray-300">Image Quality</label>
+          <div class="flex items-center gap-4">
+            <input type="range" id="jpg-quality" min="0.1" max="1.0" step="0.01" value="0.9" class="flex-1">
+            <span id="jpg-quality-value" class="text-white font-medium w-16 text-right">90%</span>
+          </div>
+          <p class="mt-1 text-xs text-gray-400">Higher quality = larger file size</p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
-            <p class="text-gray-400">Select the PDF file you want to convert to images</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Choose Quality</h3>
-            <p class="text-gray-400">Select image quality (Low, Medium, High, Maximum)</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
+          <p class="text-gray-400">Select the PDF file you want to convert to images</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Select Pages</h3>
-            <p class="text-gray-400">Convert all pages or choose specific pages to extract</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download Images</h3>
-            <p class="text-gray-400">Save JPG images individually or as a ZIP archive</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Choose Quality</h3>
+          <p class="text-gray-400">Select image quality (Low, Medium, High, Maximum)</p>
         </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Select Pages</h3>
+          <p class="text-gray-400">Convert all pages or choose specific pages to extract</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          4
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download Images</h3>
+          <p class="text-gray-400">Save JPG images individually or as a ZIP archive</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -226,26 +230,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/pdf-to-png.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Png</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to png tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/pdf-to-webp.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Webp</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to webp tool</p>
-        </a>
-        <a href="/extract-images.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Extract Images</h3>
-          <p class="text-gray-400 text-sm">Free online extract images tool</p>
-        </a>
+      <a href="/pdf-to-png.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Png</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to png tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/pdf-to-webp.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Webp</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to webp tool</p>
+      </a>
+      <a href="/extract-images.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Extract Images</h3>
+        <p class="text-gray-400 text-sm">Free online extract images tool</p>
+      </a>
     </div>
   </section>
 
@@ -258,103 +267,105 @@
           What quality should I choose?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Use High or Maximum for print-quality images, Medium for web use, or Low to save disk space. Higher quality produces larger file sizes.</p>
+        <p class="mt-3 text-gray-400">Use High or Maximum for print-quality images, Medium for web use, or Low to save
+          disk space. Higher quality produces larger file sizes.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Can I convert specific pages only?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! You can choose to convert all pages or select specific pages you want as JPG images.</p>
+        <p class="mt-3 text-gray-400">Yes! You can choose to convert all pages or select specific pages you want as JPG
+          images.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are the JPG files compressed?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes, JPG is a compressed format. You control the quality level - higher quality means less compression and larger files.</p>
+        <p class="mt-3 text-gray-400">Yes, JPG is a compressed format. You control the quality level - higher quality
+          means less compression and larger files.</p>
       </details>
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-jpg-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-jpg-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -376,7 +387,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -405,7 +416,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-json.html b/src/pages/pdf-to-json.html
index 0f36f22..a8bf160 100644
--- a/src/pages/pdf-to-json.html
+++ b/src/pages/pdf-to-json.html
@@ -4,44 +4,47 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Json Online Free - Pdf To Json Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Json Online Free - Pdf To Json Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Json online free - Pdf to json PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Json online free - Pdf to json PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to json, pdf to json, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-json">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-json">
   <meta property="og:title" content="Pdf To Json Online Free - Pdf To Json Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Json online free - Pdf to json PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Json online free - Pdf to json PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-json.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-json">
   <meta name="twitter:title" content="Pdf To Json Free">
-  <meta name="twitter:description" content="★ Pdf To Json online free - Pdf to json PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Pdf To Json online free - Pdf to json PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-json.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Json">
-  
+
 
   <title>PDF to JSON Converter - BentoPDF</title>
-  
+
   <link rel="alternate" hreflang="en" href="/en/pdf-to-json.html" />
   <link rel="alternate" hreflang="de" href="/de/pdf-to-json.html" />
   <link rel="alternate" hreflang="vi" href="/vi/pdf-to-json.html" />
@@ -64,7 +67,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -116,7 +119,8 @@
         <i data-lucide="arrow-left" class="cursor-pointer"></i>
         <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
       </button>
-      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToJson.name">Pdf To Json Converter Free Online - Convert Files Fast</h1>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToJson.name">Pdf To Json Converter Free Online
+        - Convert Files Fast</h1>
       <p class="text-gray-400 mb-6" data-i18n="tools:pdfToJson.subtitle">
         Upload multiple PDF files to convert them all to JSON format. Files will be downloaded as a ZIP archive.
       </p>
@@ -150,38 +154,41 @@
     </div>
   </div>
 
-  
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -189,26 +196,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -221,14 +233,16 @@
           Is pdf to json really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -244,11 +258,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
@@ -350,7 +364,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -379,7 +393,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-markdown.html b/src/pages/pdf-to-markdown.html
index 562385a..19c4cf7 100644
--- a/src/pages/pdf-to-markdown.html
+++ b/src/pages/pdf-to-markdown.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Markdown Online Free - Pdf To Markdown Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Markdown Online Free - Pdf To Markdown Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Markdown online free - Pdf to markdown PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Markdown online free - Pdf to markdown PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to markdown, pdf to markdown, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-markdown">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-markdown">
   <meta property="og:title" content="Pdf To Markdown Online Free - Pdf To Markdown Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Markdown online free - Pdf to markdown PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Markdown online free - Pdf to markdown PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-markdown.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-markdown">
   <meta name="twitter:title" content="Pdf To Markdown Free">
-  <meta name="twitter:description" content="★ Pdf To Markdown online free - Pdf to markdown PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ Pdf To Markdown online free - Pdf to markdown PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-markdown.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Markdown">
-  
 
-    <title>PDF to Markdown - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF files to Markdown format. Extract text with optional embedded images. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-markdown.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-markdown.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to Markdown - BentoPDF</title>
+  <meta name="description"
+    content="Convert PDF files to Markdown format. Extract text with optional embedded images. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-markdown.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-markdown.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,156 +64,157 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer">Back to Tools</span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">Pdf To Markdown Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6">
-                Convert PDF files to Markdown format. Preserves text structure with optional image embedding.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span>
-                        or drag and drop
-                    </p>
-                    <p class="text-xs text-gray-500">One or more PDF files</p>
-                    <p class="text-xs text-gray-500">Your files never leave your device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span>Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span>Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6 space-y-6">
-                <div class="flex items-center gap-3">
-                    <input type="checkbox" id="include-images"
-                        class="w-4 h-4 rounded bg-gray-700 border-gray-600 text-indigo-600 focus:ring-indigo-500">
-                    <label for="include-images" class="text-sm text-gray-300">Include images as base64</label>
-                </div>
-                <button id="process-btn" class="btn-gradient w-full mt-4">Convert to Markdown</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer">Back to Tools</span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">Pdf To Markdown Converter Free Online - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6">
+        Convert PDF files to Markdown format. Preserves text structure with optional image embedding.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span>
+            or drag and drop
+          </p>
+          <p class="text-xs text-gray-500">One or more PDF files</p>
+          <p class="text-xs text-gray-500">Your files never leave your device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span>Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span>Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6 space-y-6">
+        <div class="flex items-center gap-3">
+          <input type="checkbox" id="include-images"
+            class="w-4 h-4 rounded bg-gray-700 border-gray-600 text-indigo-600 focus:ring-indigo-500">
+          <label for="include-images" class="text-sm text-gray-300">Include images as base64</label>
+        </div>
+        <button id="process-btn" class="btn-gradient w-full mt-4">Convert to Markdown</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -218,26 +222,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -250,14 +259,16 @@
           Is pdf to markdown really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -269,55 +280,55 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nickvidal/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <i data-lucide="github"></i>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <i data-lucide="message-circle"></i>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-markdown-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nickvidal/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <i data-lucide="github"></i>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <i data-lucide="message-circle"></i>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-markdown-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -339,7 +350,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -368,7 +379,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-pdfa.html b/src/pages/pdf-to-pdfa.html
index 213cf0a..5bd483a 100644
--- a/src/pages/pdf-to-pdfa.html
+++ b/src/pages/pdf-to-pdfa.html
@@ -2,50 +2,53 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Pdfa Online Free - Pdf To Pdfa Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Pdfa Online Free - Pdf To Pdfa Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Pdfa online free - Pdf to pdfa PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Pdfa online free - Pdf to pdfa PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to pdfa, pdf to pdfa, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-pdfa">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-pdfa">
   <meta property="og:title" content="Pdf To Pdfa Online Free - Pdf To Pdfa Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Pdfa online free - Pdf to pdfa PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Pdfa online free - Pdf to pdfa PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-pdfa.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-pdfa">
   <meta name="twitter:title" content="Pdf To Pdfa Free">
-  <meta name="twitter:description" content="★ Pdf To Pdfa online free - Pdf to pdfa PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Pdf To Pdfa online free - Pdf to pdfa PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-pdfa.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Pdfa">
-  
 
-    <title>PDF to PDF/A - Convert PDF for Long-term Archiving - BentoPDF</title>
-    <meta name="description"
-        content="Convert standard PDF files to PDF/A format (PDF/A-1b, PDF/A-2b, PDF/A-3b) for long-term preservation and archiving using Ghostscript directly in your browser.">
-    
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to PDF/A - Convert PDF for Long-term Archiving - BentoPDF</title>
+  <meta name="description"
+    content="Convert standard PDF files to PDF/A format (PDF/A-1b, PDF/A-2b, PDF/A-3b) for long-term preservation and archiving using Ghostscript directly in your browser.">
+
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -59,166 +62,167 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">Pdf To Pdfa Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6">
-                Convert your PDF documents to PDF/A format for long-term archiving and preservation.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">One or more PDF files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-container" class="hidden mt-6 space-y-6">
-                <div>
-                    <label class="block mb-2 text-sm font-medium text-gray-300">PDF/A Version</label>
-                    <select id="pdfa-level"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
-                        <option value="PDF/A-1b">PDF/A-1b (Strict, no transparency)</option>
-                        <option value="PDF/A-2b" selected>PDF/A-2b (Recommended, allows transparency)</option>
-                        <option value="PDF/A-3b">PDF/A-3b (Modern, allows attachments)</option>
-                    </select>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Convert to PDF/A</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Converting...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">Pdf To Pdfa Converter Free Online - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6">
+        Convert your PDF documents to PDF/A format for long-term archiving and preservation.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">One or more PDF files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-container" class="hidden mt-6 space-y-6">
+        <div>
+          <label class="block mb-2 text-sm font-medium text-gray-300">PDF/A Version</label>
+          <select id="pdfa-level"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
+            <option value="PDF/A-1b">PDF/A-1b (Strict, no transparency)</option>
+            <option value="PDF/A-2b" selected>PDF/A-2b (Recommended, allows transparency)</option>
+            <option value="PDF/A-3b">PDF/A-3b (Modern, allows attachments)</option>
+          </select>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Convert to PDF/A</button>
+      </div>
+
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Converting...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -226,26 +230,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -258,14 +267,16 @@
           Is pdf to pdfa really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -277,84 +288,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-pdfa-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-pdfa-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -376,7 +386,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -405,7 +415,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-png.html b/src/pages/pdf-to-png.html
index 4775964..9a8b5d7 100644
--- a/src/pages/pdf-to-png.html
+++ b/src/pages/pdf-to-png.html
@@ -2,54 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Png Online Free - Pdf To Png Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Png Online Free - Pdf To Png Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Png online free - Pdf to png PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Png online free - Pdf to png PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to png, pdf to png, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-png">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-png">
   <meta property="og:title" content="Pdf To Png Online Free - Pdf To Png Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Png online free - Pdf to png PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Png online free - Pdf to png PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-png.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-png">
   <meta name="twitter:title" content="Pdf To Png Free">
-  <meta name="twitter:description" content="★ Pdf To Png online free - Pdf to png PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Pdf To Png online free - Pdf to png PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-png.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Png">
-  
 
-    <title>PDF to PNG - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF pages to PNG images. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-png.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-png.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-png.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-png.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to PNG - BentoPDF</title>
+  <meta name="description" content="Convert PDF pages to PNG images. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-png.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-png.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-png.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-png.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,153 +65,154 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToPng.name">PDF to PNG Converter Free - High Quality Images</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToPng.subtitle">
-                Convert each page of a PDF file into a high-quality PNG image with transparency support.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="png-scale" class="block mb-2 text-sm font-medium text-gray-300">Image Scale</label>
-                    <div class="flex items-center gap-4">
-                        <input type="range" id="png-scale" min="1.0" max="3.0" step="0.1" value="2.0" class="flex-1">
-                        <span id="png-scale-value" class="text-white font-medium w-16 text-right">2.0x</span>
-                    </div>
-                    <p class="mt-1 text-xs text-gray-400">Higher scale = better quality but larger file size</p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToPng.name">PDF to PNG Converter Free - High
+        Quality Images</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToPng.subtitle">
+        Convert each page of a PDF file into a high-quality PNG image with transparency support.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="png-scale" class="block mb-2 text-sm font-medium text-gray-300">Image Scale</label>
+          <div class="flex items-center gap-4">
+            <input type="range" id="png-scale" min="1.0" max="3.0" step="0.1" value="2.0" class="flex-1">
+            <span id="png-scale-value" class="text-white font-medium w-16 text-right">2.0x</span>
+          </div>
+          <p class="mt-1 text-xs text-gray-400">Higher scale = better quality but larger file size</p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -217,26 +220,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -249,14 +257,16 @@
           Is pdf to png really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -268,84 +278,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-png-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-png-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -367,7 +376,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -396,7 +405,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-svg.html b/src/pages/pdf-to-svg.html
index bc2753a..a73f27b 100644
--- a/src/pages/pdf-to-svg.html
+++ b/src/pages/pdf-to-svg.html
@@ -2,54 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Svg Online Free - Pdf To Svg Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Svg Online Free - Pdf To Svg Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Svg online free - Pdf to svg PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Svg online free - Pdf to svg PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to svg, pdf to svg, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-svg">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-svg">
   <meta property="og:title" content="Pdf To Svg Online Free - Pdf To Svg Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Svg online free - Pdf to svg PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Svg online free - Pdf to svg PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-svg.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-svg">
   <meta name="twitter:title" content="Pdf To Svg Free">
-  <meta name="twitter:description" content="★ Pdf To Svg online free - Pdf to svg PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Pdf To Svg online free - Pdf to svg PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-svg.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Svg">
-  
 
-    <title>PDF to SVG - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF pages to SVG images. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-svg.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-svg.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-svg.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-svg.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to SVG - BentoPDF</title>
+  <meta name="description" content="Convert PDF pages to SVG images. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-svg.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-svg.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-svg.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-svg.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,155 +65,156 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToSvg.name">Pdf To Svg Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToSvg.subtitle">
-                Convert each page of a PDF file into a scalable vector graphic (SVG) for perfect quality at any size.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Convert to SVG</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToSvg.name">Pdf To Svg Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToSvg.subtitle">
+        Convert each page of a PDF file into a scalable vector graphic (SVG) for perfect quality at any size.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Convert to SVG</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -219,26 +222,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -251,14 +259,16 @@
           Is pdf to svg really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -270,84 +280,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-svg-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-svg-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -369,7 +378,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -398,7 +407,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-text.html b/src/pages/pdf-to-text.html
index a5e8463..989484c 100644
--- a/src/pages/pdf-to-text.html
+++ b/src/pages/pdf-to-text.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Text Online Free - Pdf To Text Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Text Online Free - Pdf To Text Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Text online free - Pdf to text PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Text online free - Pdf to text PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to text, pdf to text, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-text">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-text">
   <meta property="og:title" content="Pdf To Text Online Free - Pdf To Text Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Text online free - Pdf to text PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Text online free - Pdf to text PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-text.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-text">
   <meta name="twitter:title" content="Pdf To Text Free">
-  <meta name="twitter:description" content="★ Pdf To Text online free - Pdf to text PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Pdf To Text online free - Pdf to text PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-text.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Text">
-  
 
-    <title>PDF to Text - Extract Text from PDF Files - BentoPDF</title>
-    <meta name="description"
-        content="Extract text from PDF files and save as plain text (.txt). Free, secure, and runs entirely in your browser." />
-    <meta name="keywords"
-        content="PDF to text, extract text from PDF, PDF text extractor, convert PDF to TXT, free PDF tool" />
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-text.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-text.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-text.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/pdf-to-text.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-text.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>PDF to Text - Extract Text from PDF Files - BentoPDF</title>
+  <meta name="description"
+    content="Extract text from PDF files and save as plain text (.txt). Free, secure, and runs entirely in your browser." />
+  <meta name="keywords"
+    content="PDF to text, extract text from PDF, PDF text extractor, convert PDF to TXT, free PDF tool" />
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-text.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-text.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-text.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/pdf-to-text.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-text.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,160 +67,162 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
+        </div>
+      </div>
+    </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
+    </div>
+  </nav>
 
-    <div class="min-h-screen flex items-center justify-center p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToText.name">PDF to Text Converter Free - Extract Text Online</h1>
-            <p class="text-gray-400 mb-4" data-i18n="tools:pdfToText.subtitle">
-                Extract all text from PDF files and save as plain text (.txt). Supports multiple files.
+  <div class="min-h-screen flex items-center justify-center p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToText.name">PDF to Text Converter Free -
+        Extract Text Online</h1>
+      <p class="text-gray-400 mb-4" data-i18n="tools:pdfToText.subtitle">
+        Extract all text from PDF files and save as plain text (.txt). Supports multiple files.
+      </p>
+      <div class="bg-amber-900/30 border border-amber-700/50 rounded-lg p-3 mb-6">
+        <p class="text-amber-200 text-sm">
+          <strong>Note:</strong> This tool works ONLY with digitally created PDFs. For scanned documents or
+          image-based PDFs, use our <a href="/ocr-pdf.html" class="text-indigo-400 hover:text-indigo-300 underline">OCR
+            PDF tool</a> instead.
+        </p>
+      </div>
+
+      <div class="upload-section mb-6">
+        <div id="drop-zone"
+          class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+          <div class="flex flex-col items-center justify-center pt-5 pb-6">
+            <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+            <p class="mb-2 text-sm text-gray-300">
+              <span class="font-semibold" data-i18n="upload.clickToSelect">Click to select files</span>
+              <span data-i18n="upload.orDragAndDrop">or drag and drop</span>
             </p>
-            <div class="bg-amber-900/30 border border-amber-700/50 rounded-lg p-3 mb-6">
-                <p class="text-amber-200 text-sm">
-                    <strong>Note:</strong> This tool works ONLY with digitally created PDFs. For scanned documents or
-                    image-based PDFs, use our <a href="/ocr-pdf.html"
-                        class="text-indigo-400 hover:text-indigo-300 underline">OCR PDF tool</a> instead.
-                </p>
-            </div>
-
-            <div class="upload-section mb-6">
-                <div id="drop-zone"
-                    class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                    <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                        <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                        <p class="mb-2 text-sm text-gray-300">
-                            <span class="font-semibold" data-i18n="upload.clickToSelect">Click to select files</span>
-                            <span data-i18n="upload.orDragAndDrop">or drag and drop</span>
-                        </p>
-                        <p class="text-xs text-gray-500">PDF files</p>
-                        <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                            device.</p>
-                    </div>
-                    <input type="file" id="file-input" accept="application/pdf" multiple
-                        class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" />
-                </div>
-
-                <div id="file-controls" class="hidden mt-4 flex gap-3">
-                    <button id="add-more-btn"
-                        class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                        <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                    </button>
-                    <button id="clear-files-btn"
-                        class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                        <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                    </button>
-                </div>
-
-                <div id="file-display-area" class="mt-4 space-y-2"></div>
-            </div>
-
-            <div id="extract-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:pdfToText.convertButton">Extract Text</span>
-                </button>
-            </div>
-
-            <div id="status-message" class="mt-4 hidden p-3 rounded-lg text-sm"></div>
+            <p class="text-xs text-gray-500">PDF files</p>
+            <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+              device.</p>
+          </div>
+          <input type="file" id="file-input" accept="application/pdf" multiple
+            class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" />
         </div>
-    </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing">Processing...</p>
+        <div id="file-controls" class="hidden mt-4 flex gap-3">
+          <button id="add-more-btn"
+            class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+            <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+          </button>
+          <button id="clear-files-btn"
+            class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+            <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+          </button>
         </div>
-    </div>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
-                data-i18n="alert.ok">OK</button>
-        </div>
-    </div>
+        <div id="file-display-area" class="mt-4 space-y-2"></div>
+      </div>
+
+      <div id="extract-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:pdfToText.convertButton">Extract Text</span>
+        </button>
+      </div>
+
+      <div id="status-message" class="mt-4 hidden p-3 rounded-lg text-sm"></div>
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
+        data-i18n="alert.ok">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -225,26 +230,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -257,14 +267,16 @@
           Is pdf to text really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -276,73 +288,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/logic/pdf-to-text-page.ts"></script>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/logic/pdf-to-text-page.ts"></script>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -364,7 +375,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -393,7 +404,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-tiff.html b/src/pages/pdf-to-tiff.html
index 22488f5..0146068 100644
--- a/src/pages/pdf-to-tiff.html
+++ b/src/pages/pdf-to-tiff.html
@@ -2,54 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Tiff Online Free - Pdf To Tiff Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Tiff Online Free - Pdf To Tiff Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Tiff online free - Pdf to tiff PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Tiff online free - Pdf to tiff PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to tiff, pdf to tiff, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-tiff">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-tiff">
   <meta property="og:title" content="Pdf To Tiff Online Free - Pdf To Tiff Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Tiff online free - Pdf to tiff PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Tiff online free - Pdf to tiff PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-tiff.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-tiff">
   <meta name="twitter:title" content="Pdf To Tiff Free">
-  <meta name="twitter:description" content="★ Pdf To Tiff online free - Pdf to tiff PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Pdf To Tiff online free - Pdf to tiff PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-tiff.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Tiff">
-  
 
-    <title>PDF to TIFF - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF pages to TIFF images. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-tiff.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-tiff.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-tiff.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-tiff.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to TIFF - BentoPDF</title>
+  <meta name="description" content="Convert PDF pages to TIFF images. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-tiff.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-tiff.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-tiff.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-tiff.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,127 +65,128 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i><span class="cursor-pointer"
-                    data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToTiff.name">Pdf To Tiff Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToTiff.subtitle">Convert each page of a PDF file into a
-                TIFF image.</p>
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-            <div id="options-panel" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
-                data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+  </nav>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i><span class="cursor-pointer"
+          data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToTiff.name">Pdf To Tiff Converter Free Online
+        - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToTiff.subtitle">Convert each page of a PDF file into a
+        TIFF image.</p>
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+      <div id="options-panel" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
+      </div>
     </div>
-    
+  </div>
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
+        data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+    </div>
+  </div>
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -191,26 +194,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -223,14 +231,16 @@
           Is pdf to tiff really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -242,70 +252,69 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub"><svg class="w-6 h-6"
-                                fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg></a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord"><svg class="w-6 h-6"
-                                fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg></a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)"><svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"
-                                aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg></a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-tiff-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub"><svg class="w-6 h-6" fill="currentColor"
+                viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg></a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord"><svg class="w-6 h-6" fill="currentColor"
+                viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg></a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)"><svg
+                class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg></a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-tiff-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -327,7 +336,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -356,7 +365,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-webp.html b/src/pages/pdf-to-webp.html
index ef7af2b..95cdaf2 100644
--- a/src/pages/pdf-to-webp.html
+++ b/src/pages/pdf-to-webp.html
@@ -2,54 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Webp Online Free - Pdf To Webp Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Webp Online Free - Pdf To Webp Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Webp online free - Pdf to webp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Webp online free - Pdf to webp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to webp, pdf to webp, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-webp">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-webp">
   <meta property="og:title" content="Pdf To Webp Online Free - Pdf To Webp Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Webp online free - Pdf to webp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Webp online free - Pdf to webp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-webp.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-webp">
   <meta name="twitter:title" content="Pdf To Webp Free">
-  <meta name="twitter:description" content="★ Pdf To Webp online free - Pdf to webp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Pdf To Webp online free - Pdf to webp PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-webp.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Webp">
-  
 
-    <title>PDF to WebP - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF pages to WebP images. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-webp.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-webp.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-webp.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-webp.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PDF to WebP - BentoPDF</title>
+  <meta name="description" content="Convert PDF pages to WebP images. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-webp.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-webp.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-webp.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-webp.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,154 +65,154 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToWebp.name">Pdf To Webp Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfToWebp.subtitle">
-                Convert each page of a PDF file into a modern WebP image format with smaller file sizes.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="webp-quality" class="block mb-2 text-sm font-medium text-gray-300">Image Quality</label>
-                    <div class="flex items-center gap-4">
-                        <input type="range" id="webp-quality" min="0.1" max="1.0" step="0.01" value="0.85"
-                            class="flex-1">
-                        <span id="webp-quality-value" class="text-white font-medium w-16 text-right">85%</span>
-                    </div>
-                    <p class="mt-1 text-xs text-gray-400">Higher quality = larger file size</p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfToWebp.name">Pdf To Webp Converter Free Online
+        - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfToWebp.subtitle">
+        Convert each page of a PDF file into a modern WebP image format with smaller file sizes.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="webp-quality" class="block mb-2 text-sm font-medium text-gray-300">Image Quality</label>
+          <div class="flex items-center gap-4">
+            <input type="range" id="webp-quality" min="0.1" max="1.0" step="0.01" value="0.85" class="flex-1">
+            <span id="webp-quality-value" class="text-white font-medium w-16 text-right">85%</span>
+          </div>
+          <p class="mt-1 text-xs text-gray-400">Higher quality = larger file size</p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Download All as ZIP</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -218,26 +220,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -250,14 +257,16 @@
           Is pdf to webp really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -269,84 +278,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-webp-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-webp-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -368,7 +376,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -397,7 +405,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pdf-to-zip.html b/src/pages/pdf-to-zip.html
index 39ae4d4..c4226d5 100644
--- a/src/pages/pdf-to-zip.html
+++ b/src/pages/pdf-to-zip.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pdf To Zip Online Free - Pdf To Zip Tool | BentoPDF</title>
   <meta name="title" content="Pdf To Zip Online Free - Pdf To Zip Tool | BentoPDF">
-  <meta name="description" content="★ Pdf To Zip online free - Pdf to zip PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pdf To Zip online free - Pdf to zip PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pdf to zip, pdf to zip, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pdf-to-zip">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pdf-to-zip">
   <meta property="og:title" content="Pdf To Zip Online Free - Pdf To Zip Tool | BentoPDF">
-  <meta property="og:description" content="★ Pdf To Zip online free - Pdf to zip PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pdf To Zip online free - Pdf to zip PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pdf-to-zip.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pdf-to-zip">
   <meta name="twitter:title" content="Pdf To Zip Free">
-  <meta name="twitter:description" content="★ Pdf To Zip online free - Pdf to zip PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Pdf To Zip online free - Pdf to zip PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pdf-to-zip.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pdf To Zip">
-  
 
-    <title>PDFs to ZIP - BentoPDF</title>
-    <meta name="description"
-        content="Package multiple PDF files into a single ZIP archive. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/pdf-to-zip.html" />
-    <link rel="alternate" hreflang="de" href="/de/pdf-to-zip.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pdf-to-zip.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pdf-to-zip.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>PDFs to ZIP - BentoPDF</title>
+  <meta name="description"
+    content="Package multiple PDF files into a single ZIP archive. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/pdf-to-zip.html" />
+  <link rel="alternate" hreflang="de" href="/de/pdf-to-zip.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pdf-to-zip.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pdf-to-zip.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,148 +64,150 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfsToZip.name">Pdf To Zip Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pdfsToZip.subtitle">
-                Package multiple PDF files into a single ZIP archive for easy sharing and storage.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">Multiple PDF files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
-                    <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
-                    <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
-                        <li>All selected PDF files will be packaged into a single ZIP archive.</li>
-                        <li>File names will be preserved in the archive.</li>
-                    </ul>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Create ZIP Archive</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pdfsToZip.name">Pdf To Zip Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pdfsToZip.subtitle">
+        Package multiple PDF files into a single ZIP archive for easy sharing and storage.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">Multiple PDF files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
+          <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
+          <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
+            <li>All selected PDF files will be packaged into a single ZIP archive.</li>
+            <li>File names will be preserved in the archive.</li>
+          </ul>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Create ZIP Archive</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -210,26 +215,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -242,14 +252,16 @@
           Is pdf to zip really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -261,73 +273,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pdf-to-zip-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pdf-to-zip-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -349,7 +360,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -378,7 +389,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/png-to-pdf.html b/src/pages/png-to-pdf.html
index 148eff3..f33ab44 100644
--- a/src/pages/png-to-pdf.html
+++ b/src/pages/png-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>PNG to PDF Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="PNG to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ PNG to PDF online free - Convert PNG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ PNG to PDF online free - Convert PNG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="png to pdf, image to pdf, convert png">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/png-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/png-to-pdf">
   <meta property="og:title" content="PNG to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ PNG to PDF online free - Convert PNG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ PNG to PDF online free - Convert PNG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-png-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/png-to-pdf">
   <meta name="twitter:title" content="PNG to PDF Free">
-  <meta name="twitter:description" content="★ PNG to PDF online free - Convert PNG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
+  <meta name="twitter:description"
+    content="★ PNG to PDF online free - Convert PNG to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in brows">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-png-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="PNG to PDF">
-  
 
-    <title>PNG to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert one or more PNG images into a single PDF file. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/png-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/png-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/png-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/png-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PNG to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert one or more PNG images into a single PDF file. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/png-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/png-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/png-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/png-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,173 +66,173 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pngToPdf.name">PNG to PDF Converter Free - Convert Images Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pngToPdf.subtitle">
-                Convert one or more PNG images into a single PDF file.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PNG Images</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    multiple accept="image/png">
-            </div>
-
-            <!-- Control buttons -->
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <!-- File List -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Options -->
-            <div id="jpg-to-pdf-options" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300"> PDF Quality
-                    </label>
-                    <select id="jpg-pdf-quality"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="high"> High Quality (Larger file) </option>
-                        <option value="medium" selected> Medium Quality (Balanced) </option>
-                        <option value="low"> Low Quality (Smaller file) </option>
-                    </select>
-                    <p class="mt-1 text-xs text-gray-400"> Controls image compression when embedding into PDF </p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pngToPdf.name">PNG to PDF Converter Free - Convert
+        Images Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pngToPdf.subtitle">
+        Convert one or more PNG images into a single PDF file.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PNG Images</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" multiple
+          accept="image/png">
+      </div>
+
+      <!-- Control buttons -->
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <!-- File List -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Options -->
+      <div id="jpg-to-pdf-options" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300"> PDF Quality
+          </label>
+          <select id="jpg-pdf-quality" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="high"> High Quality (Larger file) </option>
+            <option value="medium" selected> Medium Quality (Balanced) </option>
+            <option value="low"> Low Quality (Smaller file) </option>
+          </select>
+          <p class="mt-1 text-xs text-gray-400"> Controls image compression when embedding into PDF </p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -237,26 +240,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -269,14 +277,16 @@
           Is png to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -288,96 +298,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/png-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/png-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -399,7 +408,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -428,7 +437,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/posterize-pdf.html b/src/pages/posterize-pdf.html
index 418c1cd..ecfe096 100644
--- a/src/pages/posterize-pdf.html
+++ b/src/pages/posterize-pdf.html
@@ -4,41 +4,44 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>Posterize Pdf Online Free - Posterize Pdf Tool | BentoPDF</title>
-  <meta name="title" content="Posterize Pdf Online Free - Posterize Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Posterize Pdf online free - Posterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta name="keywords" content="posterize pdf, posterize pdf, online pdf">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/posterize-pdf">
-  
-  <!-- Open Graph / Facebook / LinkedIn -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/posterize-pdf">
-  <meta property="og:title" content="Posterize Pdf Online Free - Posterize Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Posterize Pdf online free - Posterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-posterize-pdf.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:url" content="https://www.bentopdf.com/posterize-pdf">
-  <meta name="twitter:title" content="Posterize Pdf Free">
-  <meta name="twitter:description" content="★ Posterize Pdf online free - Posterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-posterize-pdf.png">
-  <meta name="twitter:site" content="@BentoPDF">
-  
-  <!-- Mobile Web App -->
-  <meta name="mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-title" content="Posterize Pdf">
-  
+
+    <!-- Primary Meta Tags -->
+    <title>Posterize Pdf Online Free - Posterize Pdf Tool | BentoPDF</title>
+    <meta name="title" content="Posterize Pdf Online Free - Posterize Pdf Tool | BentoPDF">
+    <meta name="description"
+        content="★ Posterize Pdf online free - Posterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta name="keywords" content="posterize pdf, posterize pdf, online pdf">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/posterize-pdf">
+
+    <!-- Open Graph / Facebook / LinkedIn -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/posterize-pdf">
+    <meta property="og:title" content="Posterize Pdf Online Free - Posterize Pdf Tool | BentoPDF">
+    <meta property="og:description"
+        content="★ Posterize Pdf online free - Posterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-posterize-pdf.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="https://www.bentopdf.com/posterize-pdf">
+    <meta name="twitter:title" content="Posterize Pdf Free">
+    <meta name="twitter:description"
+        content="★ Posterize Pdf online free - Posterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-posterize-pdf.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+    <!-- Mobile Web App -->
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Posterize Pdf">
+
 
     <title>Posterize PDF - Split Pages for Poster Printing - BentoPDF</title>
     <meta name="description"
@@ -49,15 +52,15 @@
     <link rel="alternate" hreflang="x-default" href="/en/posterize-pdf.html" />
     <link href="/src/css/styles.css" rel="stylesheet" />
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -65,7 +68,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -114,7 +117,8 @@
                 <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
             </button>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:posterizePdf.name">Posterize Pdf Free Online - Fast & Secure</h1>
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:posterizePdf.name">Posterize Pdf Free Online
+                - Fast & Secure</h1>
             <p class="text-gray-400 mb-6" data-i18n="tools:posterizePdf.subtitle">
                 Split pages into multiple smaller sheets to print as a poster. Navigate the preview and see the grid
                 update based on your settings.
@@ -289,104 +293,115 @@
         </div>
     </div>
 
-    
-  <!-- How It Works Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
-    <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
-        </div>
-    </div>
-  </section>
 
-  <!-- Related Tools Section -->
-  <section class="max-w-6xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
-    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
-    </div>
-  </section>
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+                    <p class="text-gray-400">Click or drag and drop your file to begin</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+                    <p class="text-gray-400">Click the process button to start</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+                    <p class="text-gray-400">Save your processed file instantly</p>
+                </div>
+            </div>
+        </div>
+    </section>
 
-  <!-- FAQ Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-    <div class="space-y-4">
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Is posterize pdf really free?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Are my files private and secure?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Is there a file size limit?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">No! Process files of any size, as many times as you want, completely free.</p>
-      </details>
-    </div>
-  </section>
-  <footer class="mt-16 border-t-2 border-gray-700 py-8">
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/merge-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+            </a>
+            <a href="/compress-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+            </a>
+            <a href="/split-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+            </a>
+            <a href="/edit-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+            </a>
+            <a href="/rotate-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is posterize pdf really free?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and
+                    unlimited file processing.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Are my files private and secure?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave
+                    your device, ensuring complete privacy.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is there a file size limit?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No! Process files of any size, as many times as you want, completely free.
+                </p>
+            </details>
+        </div>
+    </section>
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
+                    <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
                     <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
                 </div>
                 <div>
@@ -448,8 +463,8 @@
 
     <script type="module" src="/src/js/main.ts"></script>
 
-  <!-- JSON-LD Structured Data -->
-  <script type="application/ld+json">
+    <!-- JSON-LD Structured Data -->
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "SoftwareApplication",
@@ -468,8 +483,8 @@
     }
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "HowTo",
@@ -497,8 +512,8 @@
     ]
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "BreadcrumbList",
diff --git a/src/pages/powerpoint-to-pdf.html b/src/pages/powerpoint-to-pdf.html
index 9378093..c37115f 100644
--- a/src/pages/powerpoint-to-pdf.html
+++ b/src/pages/powerpoint-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>PowerPoint to PDF Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="PowerPoint to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ PowerPoint to PDF online free - Convert PowerPoint to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ PowerPoint to PDF online free - Convert PowerPoint to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="powerpoint to pdf, ppt to pdf, presentation to pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/powerpoint-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/powerpoint-to-pdf">
   <meta property="og:title" content="PowerPoint to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ PowerPoint to PDF online free - Convert PowerPoint to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secu">
+  <meta property="og:description"
+    content="★ PowerPoint to PDF online free - Convert PowerPoint to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secu">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-powerpoint-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/powerpoint-to-pdf">
   <meta name="twitter:title" content="PowerPoint to PDF Free">
-  <meta name="twitter:description" content="★ PowerPoint to PDF online free - Convert PowerPoint to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ ">
+  <meta name="twitter:description"
+    content="★ PowerPoint to PDF online free - Convert PowerPoint to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-powerpoint-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="PowerPoint to PDF">
-  
 
-    <title>PowerPoint to PDF - Convert PPTX, PPT to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert PowerPoint presentations (PPTX, PPT, ODP) to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/powerpoint-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/powerpoint-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/powerpoint-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/powerpoint-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PowerPoint to PDF - Convert PPTX, PPT to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert PowerPoint presentations (PPTX, PPT, ODP) to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/powerpoint-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/powerpoint-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/powerpoint-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/powerpoint-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,157 +66,158 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:powerpointToPdf.name">PowerPoint to PDF Converter - Convert PPT Free</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:powerpointToPdf.subtitle">
-                Convert PowerPoint presentations (PPTX, PPT, ODP) to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:powerpointToPdf.acceptedFormats">PPTX, PPT, ODP
-                        files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".ppt,.pptx,.odp,application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation,application/vnd.oasis.opendocument.presentation"
-                    multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full"
-                    data-i18n="tools:powerpointToPdf.convertButton">Convert to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:powerpointToPdf.name">PowerPoint to PDF Converter
+        - Convert PPT Free</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:powerpointToPdf.subtitle">
+        Convert PowerPoint presentations (PPTX, PPT, ODP) to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:powerpointToPdf.acceptedFormats">PPTX, PPT, ODP
+            files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".ppt,.pptx,.odp,application/vnd.ms-powerpoint,application/vnd.openxmlformats-officedocument.presentationml.presentation,application/vnd.oasis.opendocument.presentation"
+          multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:powerpointToPdf.convertButton">Convert to
+          PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -221,26 +225,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -253,14 +262,16 @@
           Is powerpoint to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -272,96 +283,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/powerpoint-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/powerpoint-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -383,7 +393,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -412,7 +422,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/prepare-pdf-for-ai.html b/src/pages/prepare-pdf-for-ai.html
index e430a29..21a092b 100644
--- a/src/pages/prepare-pdf-for-ai.html
+++ b/src/pages/prepare-pdf-for-ai.html
@@ -2,50 +2,53 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Prepare Pdf For Ai Online Free - Prepare Pdf For Ai Tool | BentoPDF</title>
   <meta name="title" content="Prepare Pdf For Ai Online Free - Prepare Pdf For Ai Tool | BentoPDF">
-  <meta name="description" content="★ Prepare Pdf For Ai online free - Prepare pdf for ai PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Prepare Pdf For Ai online free - Prepare pdf for ai PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="prepare pdf for ai, prepare pdf for ai, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/prepare-pdf-for-ai">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/prepare-pdf-for-ai">
   <meta property="og:title" content="Prepare Pdf For Ai Online Free - Prepare Pdf For Ai Tool | BentoPDF">
-  <meta property="og:description" content="★ Prepare Pdf For Ai online free - Prepare pdf for ai PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Prepare Pdf For Ai online free - Prepare pdf for ai PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-prepare-pdf-for-ai.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/prepare-pdf-for-ai">
   <meta name="twitter:title" content="Prepare Pdf For Ai Free">
-  <meta name="twitter:description" content="★ Prepare Pdf For Ai online free - Prepare pdf for ai PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works ">
+  <meta name="twitter:description"
+    content="★ Prepare Pdf For Ai online free - Prepare pdf for ai PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-prepare-pdf-for-ai.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Prepare Pdf For Ai">
-  
 
-    <title>Prepare PDF for AI - Extract for LLM/RAG - BentoPDF</title>
-    <meta name="description"
-        content="Extract PDF content as AI-ready JSON for LlamaIndex, LangChain, and other LLM frameworks. Free, secure, and runs entirely in your browser.">
-    
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Prepare PDF for AI - Extract for LLM/RAG - BentoPDF</title>
+  <meta name="description"
+    content="Extract PDF content as AI-ready JSON for LlamaIndex, LangChain, and other LLM frameworks. Free, secure, and runs entirely in your browser.">
+
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -59,165 +62,166 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer">Back to Tools</span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">Prepare Pdf For Ai Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6">
-                Extract PDF content as LlamaIndex-compatible JSON documents. Perfect for RAG pipelines, LangChain, and
-                other LLM frameworks.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> or
-                        drag and drop</p>
-                    <p class="text-xs text-gray-500">One or more PDF files</p>
-                    <p class="text-xs text-gray-500">Your files never leave your device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span>Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span>Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="extract-options" class="hidden mt-6 space-y-6">
-                <div class="bg-gray-700 rounded-lg p-4 text-sm text-gray-300">
-                    <p class="font-medium text-white mb-2">Output Format:</p>
-                    <p>Each PDF will be extracted as a JSON file containing an array of LlamaIndex Document objects
-                        with:</p>
-                    <ul class="list-disc list-inside mt-2 space-y-1 text-gray-400">
-                        <li><code class="text-indigo-400">text</code> - Extracted text content per page</li>
-                        <li><code class="text-indigo-400">metadata</code> - Page number, headings, and document info
-                        </li>
-                        <li><code class="text-indigo-400">extra_info</code> - Additional context for RAG systems</li>
-                    </ul>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Extract for AI</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer">Back to Tools</span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">Prepare Pdf For Ai Free Online - Fast & Secure</h1>
+      <p class="text-gray-400 mb-6">
+        Extract PDF content as LlamaIndex-compatible JSON documents. Perfect for RAG pipelines, LangChain, and
+        other LLM frameworks.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> or
+            drag and drop</p>
+          <p class="text-xs text-gray-500">One or more PDF files</p>
+          <p class="text-xs text-gray-500">Your files never leave your device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span>Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span>Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="extract-options" class="hidden mt-6 space-y-6">
+        <div class="bg-gray-700 rounded-lg p-4 text-sm text-gray-300">
+          <p class="font-medium text-white mb-2">Output Format:</p>
+          <p>Each PDF will be extracted as a JSON file containing an array of LlamaIndex Document objects
+            with:</p>
+          <ul class="list-disc list-inside mt-2 space-y-1 text-gray-400">
+            <li><code class="text-indigo-400">text</code> - Extracted text content per page</li>
+            <li><code class="text-indigo-400">metadata</code> - Page number, headings, and document info
+            </li>
+            <li><code class="text-indigo-400">extra_info</code> - Additional context for RAG systems</li>
+          </ul>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Extract for AI</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -225,26 +229,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -257,14 +266,16 @@
           Is prepare pdf for ai really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -276,84 +287,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/prepare-pdf-for-ai-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/prepare-pdf-for-ai-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -375,7 +385,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -404,7 +414,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/psd-to-pdf.html b/src/pages/psd-to-pdf.html
index 468eaed..c0f8269 100644
--- a/src/pages/psd-to-pdf.html
+++ b/src/pages/psd-to-pdf.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Psd To Pdf Online Free - Psd To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Psd To Pdf Online Free - Psd To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Psd To Pdf online free - Psd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Psd To Pdf online free - Psd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="psd to pdf, psd to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/psd-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/psd-to-pdf">
   <meta property="og:title" content="Psd To Pdf Online Free - Psd To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Psd To Pdf online free - Psd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Psd To Pdf online free - Psd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-psd-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/psd-to-pdf">
   <meta name="twitter:title" content="Psd To Pdf Free">
-  <meta name="twitter:description" content="★ Psd To Pdf online free - Psd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Psd To Pdf online free - Psd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-psd-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Psd To Pdf">
-  
 
-    <title>PSD to PDF - Convert Photoshop Files to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Adobe Photoshop (PSD) files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/psd-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/psd-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/psd-to-pdf.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/psd-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/psd-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PSD to PDF - Convert Photoshop Files to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Adobe Photoshop (PSD) files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/psd-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/psd-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/psd-to-pdf.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/psd-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/psd-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,145 +67,147 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:psdToPdf.name">Psd To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:psdToPdf.subtitle">
-                Convert Adobe Photoshop (PSD) files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:psdToPdf.acceptedFormats">PSD files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".psd" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="btn-gradient w-full mt-6 hidden">
-                <span data-i18n="tools:psdToPdf.convertButton">Convert to PDF</span>
-            </button>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:psdToPdf.name">Psd To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:psdToPdf.subtitle">
+        Convert Adobe Photoshop (PSD) files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:psdToPdf.acceptedFormats">PSD files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".psd" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="btn-gradient w-full mt-6 hidden">
+        <span data-i18n="tools:psdToPdf.convertButton">Convert to PDF</span>
+      </button>
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -210,26 +215,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -242,14 +252,16 @@
           Is psd to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -261,73 +273,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/psd-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/psd-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -349,7 +360,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -378,7 +389,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/pub-to-pdf.html b/src/pages/pub-to-pdf.html
index 2ced985..6daed1a 100644
--- a/src/pages/pub-to-pdf.html
+++ b/src/pages/pub-to-pdf.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Pub To Pdf Online Free - Pub To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Pub To Pdf Online Free - Pub To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Pub To Pdf online free - Pub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Pub To Pdf online free - Pub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="pub to pdf, pub to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/pub-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/pub-to-pdf">
   <meta property="og:title" content="Pub To Pdf Online Free - Pub To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Pub To Pdf online free - Pub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Pub To Pdf online free - Pub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-pub-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/pub-to-pdf">
   <meta name="twitter:title" content="Pub To Pdf Free">
-  <meta name="twitter:description" content="★ Pub To Pdf online free - Pub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Pub To Pdf online free - Pub to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-pub-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Pub To Pdf">
-  
 
-    <title>PUB to PDF - Convert Microsoft Publisher to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Microsoft Publisher (PUB) files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/pub-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/pub-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/pub-to-pdf.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/pub-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/pub-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>PUB to PDF - Convert Microsoft Publisher to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Microsoft Publisher (PUB) files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/pub-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/pub-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/pub-to-pdf.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/pub-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/pub-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,155 +67,157 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pubToPdf.name">Pub To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:pubToPdf.subtitle">
-                Convert Microsoft Publisher (PUB) files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:pubToPdf.acceptedFormats">PUB files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".pub" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:pubToPdf.convertButton">Convert to PDF</span>
-                </button>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:pubToPdf.name">Pub To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:pubToPdf.subtitle">
+        Convert Microsoft Publisher (PUB) files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:pubToPdf.acceptedFormats">PUB files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".pub" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:pubToPdf.convertButton">Convert to PDF</span>
+        </button>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -220,26 +225,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -252,14 +262,16 @@
           Is pub to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -271,73 +283,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/pub-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/pub-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -359,7 +370,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -388,7 +399,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/rasterize-pdf.html b/src/pages/rasterize-pdf.html
index 47ee1b3..8679d2b 100644
--- a/src/pages/rasterize-pdf.html
+++ b/src/pages/rasterize-pdf.html
@@ -2,50 +2,53 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Rasterize Pdf Online Free - Rasterize Pdf Tool | BentoPDF</title>
   <meta name="title" content="Rasterize Pdf Online Free - Rasterize Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Rasterize Pdf online free - Rasterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Rasterize Pdf online free - Rasterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="rasterize pdf, rasterize pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/rasterize-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/rasterize-pdf">
   <meta property="og:title" content="Rasterize Pdf Online Free - Rasterize Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Rasterize Pdf online free - Rasterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Rasterize Pdf online free - Rasterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-rasterize-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/rasterize-pdf">
   <meta name="twitter:title" content="Rasterize Pdf Free">
-  <meta name="twitter:description" content="★ Rasterize Pdf online free - Rasterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Rasterize Pdf online free - Rasterize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-rasterize-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Rasterize Pdf">
-  
 
-    <title>Rasterize PDF - Convert to Image-Based PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert PDF to image-based PDF. Flatten layers, remove selectable text. Free, secure, and runs entirely in your browser.">
-    
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Rasterize PDF - Convert to Image-Based PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert PDF to image-based PDF. Flatten layers, remove selectable text. Free, secure, and runs entirely in your browser.">
+
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -59,183 +62,184 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer">Back to Tools</span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">Rasterize Pdf Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6">
-                Convert vector graphics and text to images. Useful for flattening layers, removing selectable text, or
-                creating print-ready files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> or
-                        drag and drop</p>
-                    <p class="text-xs text-gray-500">One or more PDF files</p>
-                    <p class="text-xs text-gray-500">Your files never leave your device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span>Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span>Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="rasterize-options" class="hidden mt-6 space-y-6">
-                <div>
-                    <label for="rasterize-dpi" class="block mb-2 text-sm font-medium text-gray-300">DPI
-                        (Resolution)</label>
-                    <select id="rasterize-dpi"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
-                        <option value="72">72 (Screen)</option>
-                        <option value="150" selected>150 (Default)</option>
-                        <option value="200">200 (Good)</option>
-                        <option value="300">300 (Print)</option>
-                        <option value="600">600 (High Quality)</option>
-                    </select>
-                </div>
-
-                <div>
-                    <label for="rasterize-format" class="block mb-2 text-sm font-medium text-gray-300">Image
-                        Format</label>
-                    <select id="rasterize-format"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
-                        <option value="png" selected>PNG (Lossless)</option>
-                        <option value="jpeg">JPEG (Smaller file size)</option>
-                    </select>
-                </div>
-
-                <div class="flex items-center">
-                    <input type="checkbox" id="rasterize-grayscale"
-                        class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                    <label for="rasterize-grayscale" class="ml-2 text-sm font-medium text-gray-300">Convert to
-                        Grayscale</label>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Rasterize PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer">Back to Tools</span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">Rasterize Pdf Free Online - Fast & Secure</h1>
+      <p class="text-gray-400 mb-6">
+        Convert vector graphics and text to images. Useful for flattening layers, removing selectable text, or
+        creating print-ready files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> or
+            drag and drop</p>
+          <p class="text-xs text-gray-500">One or more PDF files</p>
+          <p class="text-xs text-gray-500">Your files never leave your device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span>Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span>Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="rasterize-options" class="hidden mt-6 space-y-6">
+        <div>
+          <label for="rasterize-dpi" class="block mb-2 text-sm font-medium text-gray-300">DPI
+            (Resolution)</label>
+          <select id="rasterize-dpi"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
+            <option value="72">72 (Screen)</option>
+            <option value="150" selected>150 (Default)</option>
+            <option value="200">200 (Good)</option>
+            <option value="300">300 (Print)</option>
+            <option value="600">600 (High Quality)</option>
+          </select>
+        </div>
+
+        <div>
+          <label for="rasterize-format" class="block mb-2 text-sm font-medium text-gray-300">Image
+            Format</label>
+          <select id="rasterize-format"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5 focus:ring-indigo-500 focus:border-indigo-500">
+            <option value="png" selected>PNG (Lossless)</option>
+            <option value="jpeg">JPEG (Smaller file size)</option>
+          </select>
+        </div>
+
+        <div class="flex items-center">
+          <input type="checkbox" id="rasterize-grayscale"
+            class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+          <label for="rasterize-grayscale" class="ml-2 text-sm font-medium text-gray-300">Convert to
+            Grayscale</label>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Rasterize PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -243,26 +247,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -275,14 +284,16 @@
           Is rasterize pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -294,84 +305,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/rasterize-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/rasterize-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -393,7 +403,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -422,7 +432,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/remove-annotations.html b/src/pages/remove-annotations.html
index cf18d93..7bcb990 100644
--- a/src/pages/remove-annotations.html
+++ b/src/pages/remove-annotations.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Remove Annotations Online Free - Remove Annotations Tool | BentoPDF</title>
   <meta name="title" content="Remove Annotations Online Free - Remove Annotations Tool | BentoPDF">
-  <meta name="description" content="★ Remove Annotations online free - Remove annotations PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Remove Annotations online free - Remove annotations PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="remove annotations, remove annotations, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/remove-annotations">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/remove-annotations">
   <meta property="og:title" content="Remove Annotations Online Free - Remove Annotations Tool | BentoPDF">
-  <meta property="og:description" content="★ Remove Annotations online free - Remove annotations PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Remove Annotations online free - Remove annotations PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-remove-annotations.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/remove-annotations">
   <meta name="twitter:title" content="Remove Annotations Free">
-  <meta name="twitter:description" content="★ Remove Annotations online free - Remove annotations PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works ">
+  <meta name="twitter:description"
+    content="★ Remove Annotations online free - Remove annotations PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-remove-annotations.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Remove Annotations">
-  
 
-    <title>Remove Annotations - BentoPDF</title>
-    <meta name="description"
-        content="Remove all annotations, comments, and markup from your PDF documents. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/remove-annotations.html" />
-    <link rel="alternate" hreflang="de" href="/de/remove-annotations.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/remove-annotations.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/remove-annotations.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Remove Annotations - BentoPDF</title>
+  <meta name="description"
+    content="Remove all annotations, comments, and markup from your PDF documents. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/remove-annotations.html" />
+  <link rel="alternate" hreflang="de" href="/de/remove-annotations.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/remove-annotations.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/remove-annotations.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,144 +66,145 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:removeAnnotations.name">Remove Annotations Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:removeAnnotations.subtitle">
-                Remove all comments, highlights, and markup from your PDF document.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-4">
-                <p class="text-gray-400 text-sm">Click the button below to remove all annotations from your PDF.</p>
-                <button id="process-btn" class="btn-gradient w-full mt-4">Remove Annotations</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:removeAnnotations.name">Remove Annotations Free
+        Online - Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:removeAnnotations.subtitle">
+        Remove all comments, highlights, and markup from your PDF document.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-4">
+        <p class="text-gray-400 text-sm">Click the button below to remove all annotations from your PDF.</p>
+        <button id="process-btn" class="btn-gradient w-full mt-4">Remove Annotations</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -208,26 +212,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -240,14 +249,16 @@
           Is remove annotations really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -259,77 +270,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/remove-annotations-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/remove-annotations-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -351,7 +361,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -380,7 +390,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/remove-blank-pages.html b/src/pages/remove-blank-pages.html
index 4406337..4865a87 100644
--- a/src/pages/remove-blank-pages.html
+++ b/src/pages/remove-blank-pages.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Remove Blank Pages Online Free - Remove Blank Pages Tool | BentoPDF</title>
   <meta name="title" content="Remove Blank Pages Online Free - Remove Blank Pages Tool | BentoPDF">
-  <meta name="description" content="★ Remove Blank Pages online free - Remove blank pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Remove Blank Pages online free - Remove blank pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="remove blank pages, remove blank pages, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/remove-blank-pages">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/remove-blank-pages">
   <meta property="og:title" content="Remove Blank Pages Online Free - Remove Blank Pages Tool | BentoPDF">
-  <meta property="og:description" content="★ Remove Blank Pages online free - Remove blank pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Remove Blank Pages online free - Remove blank pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-remove-blank-pages.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/remove-blank-pages">
   <meta name="twitter:title" content="Remove Blank Pages Free">
-  <meta name="twitter:description" content="★ Remove Blank Pages online free - Remove blank pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works ">
+  <meta name="twitter:description"
+    content="★ Remove Blank Pages online free - Remove blank pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-remove-blank-pages.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Remove Blank Pages">
-  
 
-    <title>Remove Blank Pages - BentoPDF</title>
-    <meta name="description"
-        content="Automatically detect and remove blank pages from your PDF documents. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/remove-blank-pages.html" />
-    <link rel="alternate" hreflang="de" href="/de/remove-blank-pages.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/remove-blank-pages.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/remove-blank-pages.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Remove Blank Pages - BentoPDF</title>
+  <meta name="description"
+    content="Automatically detect and remove blank pages from your PDF documents. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/remove-blank-pages.html" />
+  <link rel="alternate" hreflang="de" href="/de/remove-blank-pages.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/remove-blank-pages.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/remove-blank-pages.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,161 +66,162 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:removeBlankPages.name">Remove Blank Pages Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:removeBlankPages.subtitle">
-                Automatically detect and remove all blank pages from your PDF document.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-4">
-                <div>
-                    <label for="sensitivity-slider" class="block mb-2 text-sm font-medium text-gray-300">
-                        Sensitivity: <span id="sensitivity-value">80</span>%
-                    </label>
-                    <input type="range" id="sensitivity-slider" min="0" max="100" value="80" step="5"
-                        class="w-full h-2 bg-gray-700 rounded-lg appearance-none cursor-pointer">
-                    <p class="text-xs text-gray-400 mt-1">Higher values detect more pages as blank</p>
-                </div>
-                <button id="detect-btn" class="btn-gradient w-full mt-4">Detect Blank Pages</button>
-            </div>
-
-            <!-- Preview of detected blank pages -->
-            <div id="preview-panel" class="hidden mt-6">
-                <h3 class="text-lg font-semibold text-white mb-3">Detected Blank Pages</h3>
-                <p id="preview-info" class="text-gray-400 text-sm mb-4"></p>
-                <div id="blank-pages-preview"
-                    class="grid grid-cols-3 md:grid-cols-4 gap-3 max-h-64 overflow-y-auto p-2 bg-gray-900 rounded-lg border border-gray-700">
-                </div>
-                <button id="process-btn" class="btn-gradient w-full mt-4">Remove Selected Blank Pages</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:removeBlankPages.name">Remove Blank Pages Free
+        Online - Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:removeBlankPages.subtitle">
+        Automatically detect and remove all blank pages from your PDF document.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-4">
+        <div>
+          <label for="sensitivity-slider" class="block mb-2 text-sm font-medium text-gray-300">
+            Sensitivity: <span id="sensitivity-value">80</span>%
+          </label>
+          <input type="range" id="sensitivity-slider" min="0" max="100" value="80" step="5"
+            class="w-full h-2 bg-gray-700 rounded-lg appearance-none cursor-pointer">
+          <p class="text-xs text-gray-400 mt-1">Higher values detect more pages as blank</p>
+        </div>
+        <button id="detect-btn" class="btn-gradient w-full mt-4">Detect Blank Pages</button>
+      </div>
+
+      <!-- Preview of detected blank pages -->
+      <div id="preview-panel" class="hidden mt-6">
+        <h3 class="text-lg font-semibold text-white mb-3">Detected Blank Pages</h3>
+        <p id="preview-info" class="text-gray-400 text-sm mb-4"></p>
+        <div id="blank-pages-preview"
+          class="grid grid-cols-3 md:grid-cols-4 gap-3 max-h-64 overflow-y-auto p-2 bg-gray-900 rounded-lg border border-gray-700">
+        </div>
+        <button id="process-btn" class="btn-gradient w-full mt-4">Remove Selected Blank Pages</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -225,26 +229,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -257,14 +266,16 @@
           Is remove blank pages really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -276,77 +287,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/remove-blank-pages-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/remove-blank-pages-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -368,7 +378,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -397,7 +407,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/remove-metadata.html b/src/pages/remove-metadata.html
index 267c083..5630794 100644
--- a/src/pages/remove-metadata.html
+++ b/src/pages/remove-metadata.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Remove Metadata Online Free - Remove Metadata Tool | BentoPDF</title>
   <meta name="title" content="Remove Metadata Online Free - Remove Metadata Tool | BentoPDF">
-  <meta name="description" content="★ Remove Metadata online free - Remove metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Remove Metadata online free - Remove metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="remove metadata, remove metadata, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/remove-metadata">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/remove-metadata">
   <meta property="og:title" content="Remove Metadata Online Free - Remove Metadata Tool | BentoPDF">
-  <meta property="og:description" content="★ Remove Metadata online free - Remove metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Remove Metadata online free - Remove metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-remove-metadata.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/remove-metadata">
   <meta name="twitter:title" content="Remove Metadata Free">
-  <meta name="twitter:description" content="★ Remove Metadata online free - Remove metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ Remove Metadata online free - Remove metadata PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-remove-metadata.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Remove Metadata">
-  
 
-    <title>Remove Metadata - Strip Hidden Data from PDF - BentoPDF</title>
-    <meta name="description"
-        content="Remove all metadata from your PDF files. Strip hidden data including author, title, creation date, and more. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/remove-metadata.html" />
-    <link rel="alternate" hreflang="de" href="/de/remove-metadata.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/remove-metadata.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/remove-metadata.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Remove Metadata - Strip Hidden Data from PDF - BentoPDF</title>
+  <meta name="description"
+    content="Remove all metadata from your PDF files. Strip hidden data including author, title, creation date, and more. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/remove-metadata.html" />
+  <link rel="alternate" hreflang="de" href="/de/remove-metadata.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/remove-metadata.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/remove-metadata.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,150 +64,152 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:removeMetadata.name">Remove Metadata Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:removeMetadata.subtitle">
-                Strip all hidden data from your PDF including author, title, creation date, and XMP metadata.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="p-4 bg-gray-900 rounded-lg border border-gray-700 mb-4">
-                    <h3 class="text-sm font-semibold text-white mb-2">What will be removed:</h3>
-                    <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
-                        <li>Title, Author, Subject, Keywords</li>
-                        <li>Creator and Producer information</li>
-                        <li>Creation and Modification dates</li>
-                        <li>XMP Metadata streams</li>
-                        <li>Document IDs</li>
-                        <li>PieceInfo (private application data)</li>
-                    </ul>
-                </div>
-                <button id="process-btn" class="btn-gradient w-full">Remove All Metadata</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:removeMetadata.name">Remove Metadata Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:removeMetadata.subtitle">
+        Strip all hidden data from your PDF including author, title, creation date, and XMP metadata.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="p-4 bg-gray-900 rounded-lg border border-gray-700 mb-4">
+          <h3 class="text-sm font-semibold text-white mb-2">What will be removed:</h3>
+          <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
+            <li>Title, Author, Subject, Keywords</li>
+            <li>Creator and Producer information</li>
+            <li>Creation and Modification dates</li>
+            <li>XMP Metadata streams</li>
+            <li>Document IDs</li>
+            <li>PieceInfo (private application data)</li>
+          </ul>
+        </div>
+        <button id="process-btn" class="btn-gradient w-full">Remove All Metadata</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -212,26 +217,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -244,14 +254,16 @@
           Is remove metadata really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -263,74 +275,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/remove-metadata-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/remove-metadata-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -352,7 +363,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -381,7 +392,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/remove-restrictions.html b/src/pages/remove-restrictions.html
index 9177303..36c6026 100644
--- a/src/pages/remove-restrictions.html
+++ b/src/pages/remove-restrictions.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Remove Restrictions Online Free - Remove Restrictions Tool | BentoPDF</title>
   <meta name="title" content="Remove Restrictions Online Free - Remove Restrictions Tool | BentoPDF">
-  <meta name="description" content="★ Remove Restrictions online free - Remove restrictions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Remove Restrictions online free - Remove restrictions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="remove restrictions, remove restrictions, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/remove-restrictions">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/remove-restrictions">
   <meta property="og:title" content="Remove Restrictions Online Free - Remove Restrictions Tool | BentoPDF">
-  <meta property="og:description" content="★ Remove Restrictions online free - Remove restrictions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Remove Restrictions online free - Remove restrictions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-remove-restrictions.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/remove-restrictions">
   <meta name="twitter:title" content="Remove Restrictions Free">
-  <meta name="twitter:description" content="★ Remove Restrictions online free - Remove restrictions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Work">
+  <meta name="twitter:description"
+    content="★ Remove Restrictions online free - Remove restrictions PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Work">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-remove-restrictions.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Remove Restrictions">
-  
 
-    <title>Remove PDF Restrictions - Unlock Editing and Printing - BentoPDF</title>
-    <meta name="description"
-        content="Remove restrictions from PDF files. Unlock editing, printing, and copying permissions. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/remove-restrictions.html" />
-    <link rel="alternate" hreflang="de" href="/de/remove-restrictions.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/remove-restrictions.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/remove-restrictions.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Remove PDF Restrictions - Unlock Editing and Printing - BentoPDF</title>
+  <meta name="description"
+    content="Remove restrictions from PDF files. Unlock editing, printing, and copying permissions. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/remove-restrictions.html" />
+  <link rel="alternate" hreflang="de" href="/de/remove-restrictions.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/remove-restrictions.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/remove-restrictions.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,159 +64,161 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:removeRestrictions.name">Remove Restrictions Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:removeRestrictions.subtitle">
-                Remove password protection and security restrictions from PDF files. Make PDFs fully editable and
-                printable.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6 space-y-4">
-                <div>
-                    <label for="owner-password-remove" class="block mb-2 text-sm font-medium text-gray-300">Owner
-                        Password (Optional)</label>
-                    <input type="password" id="owner-password-remove" placeholder="Enter owner password if required"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                    <p class="text-xs text-gray-500 mt-1">Leave empty if the PDF has no owner password.</p>
-                </div>
-
-                <div class="p-4 bg-gray-900 rounded-lg border border-gray-700">
-                    <h3 class="text-sm font-semibold text-white mb-2">What will be removed:</h3>
-                    <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
-                        <li>Password protection</li>
-                        <li>Printing restrictions</li>
-                        <li>Editing restrictions</li>
-                        <li>Copying restrictions</li>
-                        <li>All other security limitations</li>
-                    </ul>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Remove Restrictions</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:removeRestrictions.name">Remove Restrictions Free
+        Online - Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:removeRestrictions.subtitle">
+        Remove password protection and security restrictions from PDF files. Make PDFs fully editable and
+        printable.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6 space-y-4">
+        <div>
+          <label for="owner-password-remove" class="block mb-2 text-sm font-medium text-gray-300">Owner
+            Password (Optional)</label>
+          <input type="password" id="owner-password-remove" placeholder="Enter owner password if required"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+          <p class="text-xs text-gray-500 mt-1">Leave empty if the PDF has no owner password.</p>
+        </div>
+
+        <div class="p-4 bg-gray-900 rounded-lg border border-gray-700">
+          <h3 class="text-sm font-semibold text-white mb-2">What will be removed:</h3>
+          <ul class="text-xs text-gray-400 space-y-1 list-disc list-inside">
+            <li>Password protection</li>
+            <li>Printing restrictions</li>
+            <li>Editing restrictions</li>
+            <li>Copying restrictions</li>
+            <li>All other security limitations</li>
+          </ul>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full">Remove Restrictions</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -221,26 +226,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -253,14 +263,16 @@
           Is remove restrictions really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -272,74 +284,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/remove-restrictions-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/remove-restrictions-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -361,7 +372,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -390,7 +401,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/repair-pdf.html b/src/pages/repair-pdf.html
index 7b5ff69..b60b1e8 100644
--- a/src/pages/repair-pdf.html
+++ b/src/pages/repair-pdf.html
@@ -4,50 +4,53 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+
   <!-- Primary Meta Tags -->
   <title>Repair Pdf Online Free - Repair Pdf Tool | BentoPDF</title>
   <meta name="title" content="Repair Pdf Online Free - Repair Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Repair Pdf online free - Repair pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Repair Pdf online free - Repair pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="repair pdf, repair pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/repair-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/repair-pdf">
   <meta property="og:title" content="Repair Pdf Online Free - Repair Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Repair Pdf online free - Repair pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Repair Pdf online free - Repair pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-repair-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/repair-pdf">
   <meta name="twitter:title" content="Repair Pdf Free">
-  <meta name="twitter:description" content="★ Repair Pdf online free - Repair pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Repair Pdf online free - Repair pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-repair-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Repair Pdf">
-  
+
 
   <title>Repair PDF - BentoPDF</title>
-  
+
   <link rel="alternate" hreflang="en" href="/en/repair-pdf.html" />
   <link rel="alternate" hreflang="de" href="/de/repair-pdf.html" />
   <link rel="alternate" hreflang="vi" href="/vi/repair-pdf.html" />
   <link rel="alternate" hreflang="x-default" href="/en/repair-pdf.html" />
   <link href="/src/css/styles.css" rel="stylesheet" />
-  
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -65,7 +68,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -119,7 +122,8 @@
         <i data-lucide="arrow-left" class="cursor-pointer"></i>
         <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
       </button>
-      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:repairPdf.name">Repair Pdf Free Online - Fast & Secure</h1>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:repairPdf.name">Repair Pdf Free Online - Fast &
+        Secure</h1>
       <p class="text-gray-400 mb-6" data-i18n="tools:repairPdf.subtitle">
         Recover data from corrupted or damaged PDF files.
       </p>
@@ -180,38 +184,41 @@
     </div>
   </div>
 
-  
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -219,26 +226,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -251,14 +263,16 @@
           Is repair pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -274,11 +288,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
@@ -380,7 +394,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -409,7 +423,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/reverse-pages.html b/src/pages/reverse-pages.html
index 8f74017..85262b9 100644
--- a/src/pages/reverse-pages.html
+++ b/src/pages/reverse-pages.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Reverse Pages Online Free - Reverse Pages Tool | BentoPDF</title>
   <meta name="title" content="Reverse Pages Online Free - Reverse Pages Tool | BentoPDF">
-  <meta name="description" content="★ Reverse Pages online free - Reverse pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Reverse Pages online free - Reverse pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="reverse pages, reverse pages, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/reverse-pages">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/reverse-pages">
   <meta property="og:title" content="Reverse Pages Online Free - Reverse Pages Tool | BentoPDF">
-  <meta property="og:description" content="★ Reverse Pages online free - Reverse pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Reverse Pages online free - Reverse pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-reverse-pages.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/reverse-pages">
   <meta name="twitter:title" content="Reverse Pages Free">
-  <meta name="twitter:description" content="★ Reverse Pages online free - Reverse pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Reverse Pages online free - Reverse pages PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-reverse-pages.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Reverse Pages">
-  
 
-    <title>Reverse PDF Pages - BentoPDF</title>
-    <meta name="description"
-        content="Reverse the page order of your PDF document. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/reverse-pages.html" />
-    <link rel="alternate" hreflang="de" href="/de/reverse-pages.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/reverse-pages.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/reverse-pages.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Reverse PDF Pages - BentoPDF</title>
+  <meta name="description"
+    content="Reverse the page order of your PDF document. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/reverse-pages.html" />
+  <link rel="alternate" hreflang="de" href="/de/reverse-pages.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/reverse-pages.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/reverse-pages.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,159 +64,161 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <!-- Desktop Navigation -->
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <!-- Mobile Hamburger Button -->
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <!-- Hamburger Icon -->
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <!-- Close Icon -->
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <!-- Mobile Menu Dropdown -->
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <!-- Desktop Navigation -->
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:reversePages.name">Reverse Pages Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:reversePages.subtitle">
-                Flip the order of all pages in your PDF document. The last page becomes the first, and so on.
-            </p>
-
-            <!-- Drop Zone for PDF Upload -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF files (one or more)</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf" multiple>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
-                    <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
-                    <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
-                        <li>All pages will be reversed (first becomes last, last becomes first).</li>
-                        <li>If you upload multiple PDFs, each will be reversed and downloaded as a ZIP file.</li>
-                    </ul>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Reverse Pages</button>
-            </div>
 
+        <!-- Mobile Hamburger Button -->
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <!-- Hamburger Icon -->
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <!-- Close Icon -->
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <!-- Mobile Menu Dropdown -->
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:reversePages.name">Reverse Pages Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:reversePages.subtitle">
+        Flip the order of all pages in your PDF document. The last page becomes the first, and so on.
+      </p>
+
+      <!-- Drop Zone for PDF Upload -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF files (one or more)</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf" multiple>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <div class="p-3 bg-gray-900 rounded-lg border border-gray-700 mb-4">
+          <p class="text-sm text-gray-300"><strong class="text-white">How it works:</strong></p>
+          <ul class="list-disc list-inside text-xs text-gray-400 mt-1 space-y-1">
+            <li>All pages will be reversed (first becomes last, last becomes first).</li>
+            <li>If you upload multiple PDFs, each will be reversed and downloaded as a ZIP file.</li>
+          </ul>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Reverse Pages</button>
+      </div>
+
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -221,26 +226,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -253,14 +263,16 @@
           Is reverse pages really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -272,96 +284,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/reverse-pages-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/reverse-pages-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -383,7 +394,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -412,7 +423,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/rotate-custom.html b/src/pages/rotate-custom.html
index 29cc715..170ed74 100644
--- a/src/pages/rotate-custom.html
+++ b/src/pages/rotate-custom.html
@@ -2,48 +2,51 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Rotate Custom Online Free - Rotate Custom Tool | BentoPDF</title>
   <meta name="title" content="Rotate Custom Online Free - Rotate Custom Tool | BentoPDF">
-  <meta name="description" content="★ Rotate Custom online free - Rotate custom PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Rotate Custom online free - Rotate custom PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="rotate custom, rotate custom, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/rotate-custom">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/rotate-custom">
   <meta property="og:title" content="Rotate Custom Online Free - Rotate Custom Tool | BentoPDF">
-  <meta property="og:description" content="★ Rotate Custom online free - Rotate custom PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Rotate Custom online free - Rotate custom PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-rotate-custom.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/rotate-custom">
   <meta name="twitter:title" content="Rotate Custom Free">
-  <meta name="twitter:description" content="★ Rotate Custom online free - Rotate custom PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
+  <meta name="twitter:description"
+    content="★ Rotate Custom online free - Rotate custom PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-rotate-custom.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Rotate Custom">
-  
 
-    <title>Rotate PDF by Custom Degrees - BentoPDF</title>
-    <meta name="description"
-        content="Rotate PDF pages by any custom angle. Rotate individual pages or all pages at once. Free, secure, and runs entirely in your browser.">
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Rotate PDF by Custom Degrees - BentoPDF</title>
+  <meta name="description"
+    content="Rotate PDF pages by any custom angle. Rotate individual pages or all pages at once. Free, secure, and runs entirely in your browser.">
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -57,168 +60,169 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:rotateCustom.name">Rotate Custom Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:rotateCustom.subtitle">
-                Rotate pages by any custom angle. Enter degrees (positive = counter-clockwise, negative = clockwise).
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select a file</span>
-                        <span>or drag and drop</span>
-                    </p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500">Your files never leave your device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <!-- Batch Actions -->
-                <div class="bg-gray-900 rounded-lg border border-gray-700 p-4 mb-4">
-                    <h3 class="text-center text-sm font-semibold text-white mb-4 uppercase tracking-wider">Batch
-                        Rotation
-                    </h3>
-                    <div class="flex justify-center items-center">
-                        <div class="flex items-center gap-2">
-                            <button id="batch-decrement"
-                                class="w-10 h-10 flex items-center justify-center bg-gray-700 hover:bg-gray-600 text-white rounded-lg border border-gray-600">
-                                −
-                            </button>
-                            <input id="batch-custom-angle" type="number" value="0"
-                                class="w-20 h-10 text-center bg-gray-700 border border-gray-600 text-white rounded-lg">
-                            <button id="batch-increment"
-                                class="w-10 h-10 flex items-center justify-center bg-gray-700 hover:bg-gray-600 text-white rounded-lg border border-gray-600">
-                                +
-                            </button>
-                            <button id="batch-apply"
-                                class="px-4 h-10 bg-indigo-600 hover:bg-indigo-700 text-white rounded-lg text-sm font-medium">
-                                Apply to All
-                            </button>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Page Thumbnails -->
-                <div id="page-thumbnails"
-                    class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4 mb-4">
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Apply Rotations</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:rotateCustom.name">Rotate Custom Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:rotateCustom.subtitle">
+        Rotate pages by any custom angle. Enter degrees (positive = counter-clockwise, negative = clockwise).
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select a file</span>
+            <span>or drag and drop</span>
+          </p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500">Your files never leave your device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <!-- Batch Actions -->
+        <div class="bg-gray-900 rounded-lg border border-gray-700 p-4 mb-4">
+          <h3 class="text-center text-sm font-semibold text-white mb-4 uppercase tracking-wider">Batch
+            Rotation
+          </h3>
+          <div class="flex justify-center items-center">
+            <div class="flex items-center gap-2">
+              <button id="batch-decrement"
+                class="w-10 h-10 flex items-center justify-center bg-gray-700 hover:bg-gray-600 text-white rounded-lg border border-gray-600">
+                −
+              </button>
+              <input id="batch-custom-angle" type="number" value="0"
+                class="w-20 h-10 text-center bg-gray-700 border border-gray-600 text-white rounded-lg">
+              <button id="batch-increment"
+                class="w-10 h-10 flex items-center justify-center bg-gray-700 hover:bg-gray-600 text-white rounded-lg border border-gray-600">
+                +
+              </button>
+              <button id="batch-apply"
+                class="px-4 h-10 bg-indigo-600 hover:bg-indigo-700 text-white rounded-lg text-sm font-medium">
+                Apply to All
+              </button>
+            </div>
+          </div>
+        </div>
+
+        <!-- Page Thumbnails -->
+        <div id="page-thumbnails" class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4 mb-4">
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Apply Rotations</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -226,26 +230,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -258,14 +267,16 @@
           Is rotate custom really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -277,73 +288,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/rotate-custom-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/rotate-custom-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -365,7 +375,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -394,7 +404,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/rotate-pdf.html b/src/pages/rotate-pdf.html
index 645389d..9a3814e 100644
--- a/src/pages/rotate-pdf.html
+++ b/src/pages/rotate-pdf.html
@@ -2,53 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Rotate PDF Online Free - Rotate PDF Tool | BentoPDF</title>
   <meta name="title" content="Rotate PDF Online Free - Rotate PDF Tool | BentoPDF">
-  <meta name="description" content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="rotate pdf, turn pdf, flip pdf pages">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/rotate-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/rotate-pdf">
   <meta property="og:title" content="Rotate PDF Online Free - Rotate PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-rotate-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/rotate-pdf">
   <meta name="twitter:title" content="Rotate PDF Free">
-  <meta name="twitter:description" content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
+  <meta name="twitter:description"
+    content="★ Rotate PDF online free - Rotate PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & ">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-rotate-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Rotate PDF">
-  
 
-    <title>Rotate PDF - BentoPDF</title>
-    <meta name="description"
-        content="Rotate PDF pages by 90, 180, or 270 degrees. Rotate individual pages or all pages at once. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/rotate-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/rotate-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/rotate-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/rotate-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Rotate PDF - BentoPDF</title>
+  <meta name="description"
+    content="Rotate PDF pages by 90, 180, or 270 degrees. Rotate individual pages or all pages at once. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/rotate-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/rotate-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/rotate-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/rotate-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -62,165 +65,165 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:rotatePdf.name">Rotate PDF Pages Free - Turn PDFs Online</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:rotatePdf.subtitle">
-                Rotate individual pages or all pages at once. Click on page thumbnails to rotate them.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">A single PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6">
-                <!-- Batch Actions -->
-                <div class="bg-gray-900 rounded-lg border border-gray-700 p-4 mb-4">
-                    <h3 class="text-center text-sm font-semibold text-white mb-4 uppercase tracking-wider">Batch Actions
-                    </h3>
-                    <div class="flex justify-center items-center">
-                        <!-- Rotate by 90 Degrees -->
-                        <div class="flex gap-2">
-                            <button id="rotate-all-left"
-                                class="flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm border border-gray-600">
-                                <i data-lucide="rotate-ccw" class="w-4 h-4"></i> Left
-                            </button>
-                            <button id="rotate-all-right"
-                                class="flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm border border-gray-600">
-                                <i data-lucide="rotate-cw" class="w-4 h-4"></i> Right
-                            </button>
-                        </div>
-                    </div>
-                </div>
-
-                <!-- Page Thumbnails -->
-                <div id="page-thumbnails"
-                    class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4 mb-4">
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-4">Apply Rotations</button>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-4xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:rotatePdf.name">Rotate PDF Pages Free - Turn PDFs
+        Online</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:rotatePdf.subtitle">
+        Rotate individual pages or all pages at once. Click on page thumbnails to rotate them.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">A single PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6">
+        <!-- Batch Actions -->
+        <div class="bg-gray-900 rounded-lg border border-gray-700 p-4 mb-4">
+          <h3 class="text-center text-sm font-semibold text-white mb-4 uppercase tracking-wider">Batch Actions
+          </h3>
+          <div class="flex justify-center items-center">
+            <!-- Rotate by 90 Degrees -->
+            <div class="flex gap-2">
+              <button id="rotate-all-left"
+                class="flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm border border-gray-600">
+                <i data-lucide="rotate-ccw" class="w-4 h-4"></i> Left
+              </button>
+              <button id="rotate-all-right"
+                class="flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-600 text-white rounded-lg text-sm border border-gray-600">
+                <i data-lucide="rotate-cw" class="w-4 h-4"></i> Right
+              </button>
+            </div>
+          </div>
+        </div>
+
+        <!-- Page Thumbnails -->
+        <div id="page-thumbnails" class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4 mb-4">
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-4">Apply Rotations</button>
+      </div>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -228,26 +231,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/organize-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/delete-pages.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/organize-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/delete-pages.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+        <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+      </a>
     </div>
   </section>
 
@@ -260,14 +268,16 @@
           Is rotate pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -279,73 +289,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/rotate-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/rotate-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -367,7 +376,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -396,7 +405,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/rtf-to-pdf.html b/src/pages/rtf-to-pdf.html
index 10e3995..6b3618b 100644
--- a/src/pages/rtf-to-pdf.html
+++ b/src/pages/rtf-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Rtf To Pdf Online Free - Rtf To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Rtf To Pdf Online Free - Rtf To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Rtf To Pdf online free - Rtf to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Rtf To Pdf online free - Rtf to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="rtf to pdf, rtf to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/rtf-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/rtf-to-pdf">
   <meta property="og:title" content="Rtf To Pdf Online Free - Rtf To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Rtf To Pdf online free - Rtf to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Rtf To Pdf online free - Rtf to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-rtf-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/rtf-to-pdf">
   <meta name="twitter:title" content="Rtf To Pdf Free">
-  <meta name="twitter:description" content="★ Rtf To Pdf online free - Rtf to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Rtf To Pdf online free - Rtf to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-rtf-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Rtf To Pdf">
-  
 
-    <title>RTF to PDF - Convert Rich Text Format to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert RTF (Rich Text Format) document files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/rtf-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/rtf-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/rtf-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/rtf-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>RTF to PDF - Convert Rich Text Format to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert RTF (Rich Text Format) document files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/rtf-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/rtf-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/rtf-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/rtf-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,154 +66,155 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2">Rtf To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6">
-                Convert RTF (Rich Text Format) document files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">One or more RTF files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".rtf,text/rtf,application/rtf" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">Convert to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2">Rtf To Pdf Converter Free Online - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6">
+        Convert RTF (Rich Text Format) document files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">One or more RTF files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".rtf,text/rtf,application/rtf" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">Convert to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -218,26 +222,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -250,14 +259,16 @@
           Is rtf to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -269,96 +280,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/rtf-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/rtf-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -380,7 +390,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -409,7 +419,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/sanitize-pdf.html b/src/pages/sanitize-pdf.html
index 7abc1d0..272caf7 100644
--- a/src/pages/sanitize-pdf.html
+++ b/src/pages/sanitize-pdf.html
@@ -2,52 +2,55 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Sanitize Pdf Online Free - Sanitize Pdf Tool | BentoPDF</title>
   <meta name="title" content="Sanitize Pdf Online Free - Sanitize Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Sanitize Pdf online free - Sanitize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Sanitize Pdf online free - Sanitize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="sanitize pdf, sanitize pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/sanitize-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/sanitize-pdf">
   <meta property="og:title" content="Sanitize Pdf Online Free - Sanitize Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Sanitize Pdf online free - Sanitize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Sanitize Pdf online free - Sanitize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-sanitize-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/sanitize-pdf">
   <meta name="twitter:title" content="Sanitize Pdf Free">
-  <meta name="twitter:description" content="★ Sanitize Pdf online free - Sanitize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
+  <meta name="twitter:description"
+    content="★ Sanitize Pdf online free - Sanitize pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-sanitize-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Sanitize Pdf">
-  
 
-    <title>Sanitize PDF - Remove Sensitive Content - BentoPDF</title>
-    <meta name="description"
-        content="Sanitize PDF files by removing sensitive content. Remove metadata, JavaScript, embedded files, and more. Free, secure, and runs entirely in your browser.">
-    <link rel="alternate" hreflang="en" href="/en/sanitize-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/sanitize-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/sanitize-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/sanitize-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
+
+  <title>Sanitize PDF - Remove Sensitive Content - BentoPDF</title>
+  <meta name="description"
+    content="Sanitize PDF files by removing sensitive content. Remove metadata, JavaScript, embedded files, and more. Free, secure, and runs entirely in your browser.">
+  <link rel="alternate" hreflang="en" href="/en/sanitize-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/sanitize-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/sanitize-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/sanitize-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -61,204 +64,206 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
+        </div>
+      </div>
+    </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
+    </div>
+  </nav>
 
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:sanitizePdf.name">Sanitize Pdf Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:sanitizePdf.subtitle">
-                Remove sensitive content from PDF files. Clean metadata, JavaScript, embedded files, and more.
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:sanitizePdf.name">Sanitize Pdf Free Online - Fast
+        & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:sanitizePdf.subtitle">
+        Remove sensitive content from PDF files. Clean metadata, JavaScript, embedded files, and more.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
+        </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="tool-options" class="hidden mt-6 space-y-4">
+        <div class="p-4 bg-gray-900 rounded-lg border border-gray-700">
+          <h3 class="text-sm font-semibold text-white mb-3">Sanitization Optionst:</h3>
+          <div class="space-y-2">
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="flatten-forms" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Flatten Forms</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-metadata" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove Metadata</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-annotations" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove Annotations</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-javascript" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove JavaScript</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-embedded-files" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove Embedded Files</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-layers" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove Layers (OCG)</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-links" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove Links</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-structure-tree" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove Structure Tree</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-markinfo" checked
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove MarkInfo</span>
+            </label>
+            <label class="flex items-center gap-2 cursor-pointer">
+              <input type="checkbox" id="remove-fonts"
+                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
+              <span class="text-sm text-gray-300">Remove Embedded Fonts</span>
+            </label>
+          </div>
+        </div>
+
+        <div class="p-4 bg-yellow-900/20 border border-yellow-500/30 rounded-lg">
+          <div class="flex items-start gap-2">
+            <i data-lucide="alert-triangle" class="w-5 h-5 text-yellow-400 mt-0.5 flex-shrink-0"></i>
+            <p class="text-xs text-gray-300">
+              Sanitization removes sensitive content permanently. Some options may affect PDF rendering.
             </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select PDF</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="tool-options" class="hidden mt-6 space-y-4">
-                <div class="p-4 bg-gray-900 rounded-lg border border-gray-700">
-                    <h3 class="text-sm font-semibold text-white mb-3">Sanitization Optionst:</h3>
-                    <div class="space-y-2">
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="flatten-forms" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Flatten Forms</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-metadata" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove Metadata</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-annotations" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove Annotations</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-javascript" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove JavaScript</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-embedded-files" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove Embedded Files</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-layers" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove Layers (OCG)</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-links" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove Links</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-structure-tree" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove Structure Tree</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-markinfo" checked
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove MarkInfo</span>
-                        </label>
-                        <label class="flex items-center gap-2 cursor-pointer">
-                            <input type="checkbox" id="remove-fonts"
-                                class="w-4 h-4 text-indigo-600 bg-gray-700 border-gray-600 rounded focus:ring-indigo-500">
-                            <span class="text-sm text-gray-300">Remove Embedded Fonts</span>
-                        </label>
-                    </div>
-                </div>
-
-                <div class="p-4 bg-yellow-900/20 border border-yellow-500/30 rounded-lg">
-                    <div class="flex items-start gap-2">
-                        <i data-lucide="alert-triangle" class="w-5 h-5 text-yellow-400 mt-0.5 flex-shrink-0"></i>
-                        <p class="text-xs text-gray-300">
-                            Sanitization removes sensitive content permanently. Some options may affect PDF rendering.
-                        </p>
-                    </div>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full">Sanitize PDF</button>
-            </div>
+          </div>
         </div>
-    </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+        <button id="process-btn" class="btn-gradient w-full">Sanitize PDF</button>
+      </div>
     </div>
+  </div>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
-        </div>
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
     </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -266,26 +271,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -298,14 +308,16 @@
           Is sanitize pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -317,74 +329,73 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/sanitize-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/BentoPDF" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/sanitize-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
 
-    <script type="module" src="/src/js/main.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -406,7 +417,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -435,7 +446,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/sign-pdf.html b/src/pages/sign-pdf.html
index c7bf016..1b4b43b 100644
--- a/src/pages/sign-pdf.html
+++ b/src/pages/sign-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Sign PDF Online Free - Sign PDF Tool | BentoPDF</title>
   <meta name="title" content="Sign PDF Online Free - Sign PDF Tool | BentoPDF">
-  <meta name="description" content="★ Sign PDF online free - Sign PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Sign PDF online free - Sign PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="sign pdf, digital signature, pdf signature">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/sign-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/sign-pdf">
   <meta property="og:title" content="Sign PDF Online Free - Sign PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Sign PDF online free - Sign PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Sign PDF online free - Sign PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-sign-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/sign-pdf">
   <meta name="twitter:title" content="Sign PDF Free">
-  <meta name="twitter:description" content="★ Sign PDF online free - Sign PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secu">
+  <meta name="twitter:description"
+    content="★ Sign PDF online free - Sign PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secu">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-sign-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Sign PDF">
-  
 
-    <title>Sign PDF - BentoPDF</title>
-    <meta name="description"
-        content="Sign PDF documents digitally using your signature. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/sign-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/sign-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/sign-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/sign-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Sign PDF - BentoPDF</title>
+  <meta name="description"
+    content="Sign PDF documents digitally using your signature. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/sign-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/sign-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/sign-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/sign-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,164 +66,164 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
-        </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:signPdf.name">Sign PDF Free Online - Add Digital Signature</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:signPdf.subtitle">
-                Upload a PDF to sign it using the built-in PDF.js viewer. Look for the <strong>signature / pen
-                    tool</strong> in the toolbar to add your signature.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF Documents</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <!-- File Display -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
 
-        <!-- Signature Editor (shown after file upload) -->
-        <div id="signature-editor" class="hidden w-full max-w-6xl mt-6">
-            <div id="canvas-container-sign"
-                class="relative w-full overflow-auto bg-gray-900 rounded-lg border border-gray-600"
-                style="height: 85vh;">
-                <!-- PDF.js viewer iframe will be loaded here -->
-            </div>
-
-            <div class="mt-4 flex items-center gap-2">
-                <label class="flex items-center gap-2 text-sm font-medium text-gray-300 cursor-pointer">
-                    <input type="checkbox" id="flatten-signature-toggle"
-                        class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
-                    Flatten PDF (use the Save button below)
-                </label>
-            </div>
-
-            <button id="process-btn" class="btn-gradient w-full mt-4" style="display:none;">Save & Download Signed
-                PDF</button>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
+    </div>
+  </nav>
+
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:signPdf.name">Sign PDF Free Online - Add Digital
+        Signature</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:signPdf.subtitle">
+        Upload a PDF to sign it using the built-in PDF.js viewer. Look for the <strong>signature / pen
+          tool</strong> in the toolbar to add your signature.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF Documents</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <!-- File Display -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
     </div>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
-        </div>
-    </div>
+    <!-- Signature Editor (shown after file upload) -->
+    <div id="signature-editor" class="hidden w-full max-w-6xl mt-6">
+      <div id="canvas-container-sign"
+        class="relative w-full overflow-auto bg-gray-900 rounded-lg border border-gray-600" style="height: 85vh;">
+        <!-- PDF.js viewer iframe will be loaded here -->
+      </div>
+
+      <div class="mt-4 flex items-center gap-2">
+        <label class="flex items-center gap-2 text-sm font-medium text-gray-300 cursor-pointer">
+          <input type="checkbox" id="flatten-signature-toggle"
+            class="w-4 h-4 rounded text-indigo-600 bg-gray-700 border-gray-600 focus:ring-indigo-500">
+          Flatten PDF (use the Save button below)
+        </label>
+      </div>
+
+      <button id="process-btn" class="btn-gradient w-full mt-4" style="display:none;">Save & Download Signed
+        PDF</button>
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -228,26 +231,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -260,14 +268,16 @@
           Is sign pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -279,84 +289,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/sign-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/sign-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -378,7 +387,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -407,7 +416,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/split-pdf.html b/src/pages/split-pdf.html
index 0e867b0..5f35147 100644
--- a/src/pages/split-pdf.html
+++ b/src/pages/split-pdf.html
@@ -4,62 +4,65 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
-  <!-- Primary Meta Tags -->
-  <title>Split PDF Online Free - Split PDF Tool | BentoPDF</title>
-  <meta name="title" content="Split PDF Online Free - Split PDF Tool | BentoPDF">
-  <meta name="description" content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta name="keywords" content="split pdf, divide pdf, extract pages, separate pdf">
-  <meta name="author" content="BentoPDF">
-  <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
-  <!-- Canonical URL -->
-  <link rel="canonical" href="https://www.bentopdf.com/split-pdf">
-  
-  <!-- Open Graph / Facebook / LinkedIn -->
-  <meta property="og:type" content="website">
-  <meta property="og:url" content="https://www.bentopdf.com/split-pdf">
-  <meta property="og:title" content="Split PDF Online Free - Split PDF Tool | BentoPDF">
-  <meta property="og:description" content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
-  <meta property="og:image" content="https://www.bentopdf.com/images/og-split-pdf.png">
-  <meta property="og:image:width" content="1200">
-  <meta property="og:image:height" content="630">
-  <meta property="og:site_name" content="BentoPDF">
-  
-  <!-- Twitter Card -->
-  <meta name="twitter:card" content="summary_large_image">
-  <meta name="twitter:url" content="https://www.bentopdf.com/split-pdf">
-  <meta name="twitter:title" content="Split PDF Free">
-  <meta name="twitter:description" content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & se">
-  <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-split-pdf.png">
-  <meta name="twitter:site" content="@BentoPDF">
-  
-  <!-- Mobile Web App -->
-  <meta name="mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-title" content="Split PDF">
-  
+
+    <!-- Primary Meta Tags -->
+    <title>Split PDF Online Free - Split PDF Tool | BentoPDF</title>
+    <meta name="title" content="Split PDF Online Free - Split PDF Tool | BentoPDF">
+    <meta name="description"
+        content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta name="keywords" content="split pdf, divide pdf, extract pages, separate pdf">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
+
+    <!-- Canonical URL -->
+    <link rel="canonical" href="https://www.bentopdf.com/split-pdf">
+
+    <!-- Open Graph / Facebook / LinkedIn -->
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/split-pdf">
+    <meta property="og:title" content="Split PDF Online Free - Split PDF Tool | BentoPDF">
+    <meta property="og:description"
+        content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-split-pdf.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <!-- Twitter Card -->
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="https://www.bentopdf.com/split-pdf">
+    <meta name="twitter:title" content="Split PDF Free">
+    <meta name="twitter:description"
+        content="★ Split PDF online free - Split PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & se">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-split-pdf.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+    <!-- Mobile Web App -->
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Split PDF">
+
 
     <title>Split PDF - BentoPDF</title>
     <meta name="description"
         content="Extract pages from a PDF using various methods. Free, secure, and runs entirely in your browser.">
-    
+
     <link rel="alternate" hreflang="en" href="/en/split-pdf.html" />
     <link rel="alternate" hreflang="de" href="/de/split-pdf.html" />
     <link rel="alternate" hreflang="vi" href="/vi/split-pdf.html" />
     <link rel="alternate" hreflang="x-default" href="/en/split-pdf.html" />
     <link href="/src/css/styles.css" rel="stylesheet" />
-    
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
+
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -67,7 +70,7 @@
         <div class="container mx-auto px-4">
             <div class="flex justify-between items-center h-16">
                 <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
                     <span class="text-white font-bold text-xl ml-2">
                         <a href="/">BentoPDF</a>
                     </span>
@@ -124,7 +127,8 @@
                 <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
             </button>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:splitPdf.name">Split PDF Online Free - Extract Pages Easily</h1>
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:splitPdf.name">Split PDF Online Free -
+                Extract Pages Easily</h1>
             <p class="text-gray-400 mb-6" data-i18n="tools:splitPdf.subtitle">
                 Extract pages from a PDF using various methods.
             </p>
@@ -291,114 +295,126 @@
         </div>
     </div>
 
-    
-  <!-- How It Works Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
-    <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
-            <p class="text-gray-400">Select the PDF file you want to split or extract pages from</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Choose Split Method</h3>
-            <p class="text-gray-400">Select specific pages, page ranges, or split into individual pages</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Preview & Select</h3>
-            <p class="text-gray-400">View page thumbnails and select exactly which pages you want</p>
-          </div>
-        </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Split & Download</h3>
-            <p class="text-gray-400">Download extracted pages as separate PDFs or as a ZIP file</p>
-          </div>
-        </div>
-    </div>
-  </section>
 
-  <!-- Related Tools Section -->
-  <section class="max-w-6xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
-    <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/extract-pages.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
-          <p class="text-gray-400 text-sm">Free online extract pages tool</p>
-        </a>
-        <a href="/organize-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/delete-pages.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
-          <p class="text-gray-400 text-sm">Free online delete pages tool</p>
-        </a>
-    </div>
-  </section>
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload PDF</h3>
+                    <p class="text-gray-400">Select the PDF file you want to split or extract pages from</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Choose Split Method</h3>
+                    <p class="text-gray-400">Select specific pages, page ranges, or split into individual pages</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Preview & Select</h3>
+                    <p class="text-gray-400">View page thumbnails and select exactly which pages you want</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    4
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Split & Download</h3>
+                    <p class="text-gray-400">Download extracted pages as separate PDFs or as a ZIP file</p>
+                </div>
+            </div>
+        </div>
+    </section>
 
-  <!-- FAQ Section -->
-  <section class="max-w-4xl mx-auto px-4 py-12">
-    <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
-    <div class="space-y-4">
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Can I extract specific page ranges?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Yes! You can extract any specific pages or page ranges from your PDF. Select exactly which pages you need or split into individual files.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Will split PDFs lose quality?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">No! Split PDFs maintain the exact same quality as the original document. No compression or quality loss occurs.</p>
-      </details>
-      <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
-        <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
-          Can I split multiple PDFs at once?
-          <i data-lucide="chevron-down" class="w-5 h-5"></i>
-        </summary>
-        <p class="mt-3 text-gray-400">Yes, process multiple PDFs in batches for efficient document management.</p>
-      </details>
-    </div>
-  </section>
-  <footer class="mt-16 border-t-2 border-gray-700 py-8">
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/merge-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+            </a>
+            <a href="/extract-pages.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Extract Pages</h3>
+                <p class="text-gray-400 text-sm">Free online extract pages tool</p>
+            </a>
+            <a href="/organize-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Organize Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online organize pdf tool</p>
+            </a>
+            <a href="/compress-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+                <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+            </a>
+            <a href="/delete-pages.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Delete Pages</h3>
+                <p class="text-gray-400 text-sm">Free online delete pages tool</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Can I extract specific page ranges?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes! You can extract any specific pages or page ranges from your PDF.
+                    Select exactly which pages you need or split into individual files.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Will split PDFs lose quality?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No! Split PDFs maintain the exact same quality as the original document.
+                    No compression or quality loss occurs.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Can I split multiple PDFs at once?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">Yes, process multiple PDFs in batches for efficient document management.
+                </p>
+            </details>
+        </div>
+    </section>
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4">
             <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
                 <div class="mb-8 md:mb-0">
                     <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
                         <span class="text-xl font-bold text-white">BentoPDF</span>
                     </div>
                     <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
+                        &copy; 2026 BentoPDF. All rights reserved.
                     </p>
                     <p class="text-gray-500 text-xs mt-2">
                         Version <span id="app-version"></span>
@@ -481,8 +497,8 @@
     <script type="module" src="/src/js/mobileMenu.ts"></script>
     <script type="module" src="/src/js/main.ts"></script>
 
-  <!-- JSON-LD Structured Data -->
-  <script type="application/ld+json">
+    <!-- JSON-LD Structured Data -->
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "SoftwareApplication",
@@ -501,8 +517,8 @@
     }
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "HowTo",
@@ -530,8 +546,8 @@
     ]
   }
   </script>
-  
-  <script type="application/ld+json">
+
+    <script type="application/ld+json">
   {
     "@context": "https://schema.org",
     "@type": "BreadcrumbList",
diff --git a/src/pages/svg-to-pdf.html b/src/pages/svg-to-pdf.html
index 9b6f9da..0674ca9 100644
--- a/src/pages/svg-to-pdf.html
+++ b/src/pages/svg-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Svg To Pdf Online Free - Svg To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Svg To Pdf Online Free - Svg To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Svg To Pdf online free - Svg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Svg To Pdf online free - Svg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="svg to pdf, svg to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/svg-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/svg-to-pdf">
   <meta property="og:title" content="Svg To Pdf Online Free - Svg To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Svg To Pdf online free - Svg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Svg To Pdf online free - Svg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-svg-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/svg-to-pdf">
   <meta name="twitter:title" content="Svg To Pdf Free">
-  <meta name="twitter:description" content="★ Svg To Pdf online free - Svg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Svg To Pdf online free - Svg to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-svg-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Svg To Pdf">
-  
 
-    <title>SVG to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert one or more SVG graphics into a single PDF file. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/svg-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/svg-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/svg-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/svg-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>SVG to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert one or more SVG graphics into a single PDF file. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/svg-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/svg-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/svg-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/svg-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,173 +66,173 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:svgToPdf.name">Svg To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:svgToPdf.subtitle">
-                Convert one or more SVG graphics into a single PDF file.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">SVG Graphics</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    multiple accept="image/svg+xml,.svg">
-            </div>
-
-            <!-- Control buttons -->
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <!-- File List -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Options -->
-            <div id="jpg-to-pdf-options" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300"> PDF Quality
-                    </label>
-                    <select id="jpg-pdf-quality"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="high"> High Quality (Larger file) </option>
-                        <option value="medium" selected> Medium Quality (Balanced) </option>
-                        <option value="low"> Low Quality (Smaller file) </option>
-                    </select>
-                    <p class="mt-1 text-xs text-gray-400"> Controls image compression when embedding into PDF </p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:svgToPdf.name">Svg To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:svgToPdf.subtitle">
+        Convert one or more SVG graphics into a single PDF file.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">SVG Graphics</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" multiple
+          accept="image/svg+xml,.svg">
+      </div>
+
+      <!-- Control buttons -->
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <!-- File List -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Options -->
+      <div id="jpg-to-pdf-options" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300"> PDF Quality
+          </label>
+          <select id="jpg-pdf-quality" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="high"> High Quality (Larger file) </option>
+            <option value="medium" selected> Medium Quality (Balanced) </option>
+            <option value="low"> Low Quality (Smaller file) </option>
+          </select>
+          <p class="mt-1 text-xs text-gray-400"> Controls image compression when embedding into PDF </p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -237,26 +240,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -269,14 +277,16 @@
           Is svg to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -288,96 +298,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/svg-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/svg-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -399,7 +408,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -428,7 +437,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/table-of-contents.html b/src/pages/table-of-contents.html
index e0d60e5..ac72bfe 100644
--- a/src/pages/table-of-contents.html
+++ b/src/pages/table-of-contents.html
@@ -4,47 +4,50 @@
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+
   <!-- Primary Meta Tags -->
   <title>Table Of Contents Online Free - Table Of Contents Tool | BentoPDF</title>
   <meta name="title" content="Table Of Contents Online Free - Table Of Contents Tool | BentoPDF">
-  <meta name="description" content="★ Table Of Contents online free - Table of contents PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Table Of Contents online free - Table of contents PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="table of contents, table of contents, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/table-of-contents">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/table-of-contents">
   <meta property="og:title" content="Table Of Contents Online Free - Table Of Contents Tool | BentoPDF">
-  <meta property="og:description" content="★ Table Of Contents online free - Table of contents PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Table Of Contents online free - Table of contents PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-table-of-contents.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/table-of-contents">
   <meta name="twitter:title" content="Table Of Contents Free">
-  <meta name="twitter:description" content="★ Table Of Contents online free - Table of contents PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in">
+  <meta name="twitter:description"
+    content="★ Table Of Contents online free - Table of contents PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-table-of-contents.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Table Of Contents">
-  
+
 
   <title>Generate Table of Contents - BentoPDF</title>
-  
-  
-  
-  
+
+
+
+
   <link rel="alternate" hreflang="en" href="/en/table-of-contents.html" />
   <link rel="alternate" hreflang="de" href="/de/table-of-contents.html" />
   <link rel="alternate" hreflang="vi" href="/vi/table-of-contents.html" />
@@ -67,7 +70,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -121,7 +124,8 @@
         <i data-lucide="arrow-left" class="cursor-pointer"></i>
         <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
       </button>
-      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:tableOfContents.name">Table Of Contents Free Online - Fast & Secure</h1>
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:tableOfContents.name">Table Of Contents Free
+        Online - Fast & Secure</h1>
       <p class="text-gray-400 mb-6" data-i18n="tools:tableOfContents.subtitle">
         Upload a PDF with bookmarks to generate a table of contents page
       </p>
@@ -222,38 +226,41 @@
     </div>
   </div>
 
-  
+
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -261,26 +268,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -293,14 +305,16 @@
           Is table of contents really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -316,11 +330,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
@@ -421,7 +435,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -450,7 +464,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/text-color.html b/src/pages/text-color.html
index f9b32c4..8d45a9b 100644
--- a/src/pages/text-color.html
+++ b/src/pages/text-color.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Text Color Online Free - Text Color Tool | BentoPDF</title>
   <meta name="title" content="Text Color Online Free - Text Color Tool | BentoPDF">
-  <meta name="description" content="★ Text Color online free - Text color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Text Color online free - Text color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="text color, text color, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/text-color">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/text-color">
   <meta property="og:title" content="Text Color Online Free - Text Color Tool | BentoPDF">
-  <meta property="og:description" content="★ Text Color online free - Text color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Text Color online free - Text color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-text-color.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/text-color">
   <meta name="twitter:title" content="Text Color Free">
-  <meta name="twitter:description" content="★ Text Color online free - Text color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Text Color online free - Text color PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-text-color.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Text Color">
-  
 
-    <title>Change Text Color - BentoPDF</title>
-    <meta name="description"
-        content="Change the text color of your PDF documents. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/text-color.html" />
-    <link rel="alternate" hreflang="de" href="/de/text-color.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/text-color.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/text-color.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Change Text Color - BentoPDF</title>
+  <meta name="description"
+    content="Change the text color of your PDF documents. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/text-color.html" />
+  <link rel="alternate" hreflang="de" href="/de/text-color.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/text-color.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/text-color.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,149 +66,150 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:changeTextColor.name">Text Color Free Online - Fast & Secure</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:changeTextColor.subtitle">
-                Change the color of dark text in your PDF document. Note: This converts pages to images.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">PDF file</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="application/pdf">
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="options-panel" class="hidden mt-6 space-y-4">
-                <div>
-                    <label for="text-color-input" class="block mb-2 text-sm font-medium text-gray-300">New Text
-                        Color</label>
-                    <input type="color" id="text-color-input" value="#0000FF"
-                        class="w-full h-12 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
-                </div>
-                <button id="process-btn" class="btn-gradient w-full mt-4">Change Text Color</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:changeTextColor.name">Text Color Free Online -
+        Fast & Secure</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:changeTextColor.subtitle">
+        Change the color of dark text in your PDF document. Note: This converts pages to images.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">PDF file</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="application/pdf">
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="options-panel" class="hidden mt-6 space-y-4">
+        <div>
+          <label for="text-color-input" class="block mb-2 text-sm font-medium text-gray-300">New Text
+            Color</label>
+          <input type="color" id="text-color-input" value="#0000FF"
+            class="w-full h-12 bg-gray-700 border border-gray-600 rounded-lg cursor-pointer">
+        </div>
+        <button id="process-btn" class="btn-gradient w-full mt-4">Change Text Color</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -213,26 +217,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -245,14 +254,16 @@
           Is text color really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -264,77 +275,76 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/text-color-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/nicholaschen09/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/text-color-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -356,7 +366,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -385,7 +395,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/tiff-to-pdf.html b/src/pages/tiff-to-pdf.html
index b8d2d4e..96834dc 100644
--- a/src/pages/tiff-to-pdf.html
+++ b/src/pages/tiff-to-pdf.html
@@ -2,53 +2,56 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Tiff To Pdf Online Free - Tiff To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Tiff To Pdf Online Free - Tiff To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Tiff To Pdf online free - Tiff to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Tiff To Pdf online free - Tiff to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="tiff to pdf, tiff to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/tiff-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/tiff-to-pdf">
   <meta property="og:title" content="Tiff To Pdf Online Free - Tiff To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Tiff To Pdf online free - Tiff to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Tiff To Pdf online free - Tiff to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-tiff-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/tiff-to-pdf">
   <meta name="twitter:title" content="Tiff To Pdf Free">
-  <meta name="twitter:description" content="★ Tiff To Pdf online free - Tiff to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Tiff To Pdf online free - Tiff to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-tiff-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Tiff To Pdf">
-  
 
-    <title>TIFF to PDF - BentoPDF</title>
-    <meta name="description" content="Convert TIFF images to PDF. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/tiff-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/tiff-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/tiff-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/tiff-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>TIFF to PDF - BentoPDF</title>
+  <meta name="description" content="Convert TIFF images to PDF. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/tiff-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/tiff-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/tiff-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/tiff-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -62,152 +65,154 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:tiffToPdf.name">Tiff To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:tiffToPdf.subtitle">
-                Convert one or more single or multi-page TIFF images into a single PDF file.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">TIFF images</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept="image/tiff,.tiff,.tif" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6">Convert to PDF</button>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:tiffToPdf.name">Tiff To Pdf Converter Free Online
+        - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:tiffToPdf.subtitle">
+        Convert one or more single or multi-page TIFF images into a single PDF file.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">TIFF images</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept="image/tiff,.tiff,.tif" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6">Convert to PDF</button>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -215,26 +220,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -247,14 +257,16 @@
           Is tiff to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -266,84 +278,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/tiff-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/tiff-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -365,7 +376,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -394,7 +405,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/txt-to-pdf.html b/src/pages/txt-to-pdf.html
index 172162f..a2ac001 100644
--- a/src/pages/txt-to-pdf.html
+++ b/src/pages/txt-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Txt To Pdf Online Free - Txt To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Txt To Pdf Online Free - Txt To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Txt To Pdf online free - Txt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Txt To Pdf online free - Txt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="txt to pdf, txt to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/txt-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/txt-to-pdf">
   <meta property="og:title" content="Txt To Pdf Online Free - Txt To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Txt To Pdf online free - Txt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Txt To Pdf online free - Txt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-txt-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/txt-to-pdf">
   <meta name="twitter:title" content="Txt To Pdf Free">
-  <meta name="twitter:description" content="★ Txt To Pdf online free - Txt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Txt To Pdf online free - Txt to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-txt-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Txt To Pdf">
-  
 
-    <title>Text to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert text files or typed text to PDF format with custom formatting. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/txt-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/txt-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/txt-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/txt-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Text to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert text files or typed text to PDF format with custom formatting. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/txt-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/txt-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/txt-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/txt-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,246 +66,245 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2"><a href="/">BentoPDF</a></span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
+        </div>
+      </div>
+    </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
+    </div>
+  </nav>
 
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i><span class="cursor-pointer"> Back to Tools
-                </span>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i><span class="cursor-pointer"> Back to Tools
+        </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:textToPdf.name">Txt To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:textToPdf.subtitle">Upload one or more text files, or
+        type/paste text below to convert to PDF with
+        custom formatting.</p>
+
+      <!-- Mode Toggle -->
+      <div class="mb-4">
+        <div class="flex gap-2 p-1 rounded-lg bg-gray-900 border border-gray-700 mb-4">
+          <button id="txt-mode-upload-btn"
+            class="flex-1 btn bg-indigo-600 text-white font-semibold py-2 rounded-md">Upload Files</button>
+          <button id="txt-mode-text-btn" class="flex-1 btn bg-gray-700 text-gray-300 font-semibold py-2 rounded-md">Type
+            Text</button>
+        </div>
+
+        <!-- Upload Panel -->
+        <div id="txt-upload-panel">
+          <div id="drop-zone"
+            class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+            <div class="flex flex-col items-center justify-center pt-5 pb-6">
+              <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+              <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select
+                  file(s)</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+              <p class="text-xs text-gray-500">Text files (.txt)</p>
+              <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave
+                your device.</p>
+            </div>
+            <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+              multiple accept="text/plain,.txt">
+          </div>
+
+          <div id="file-controls" class="hidden mt-4 flex gap-3">
+            <button id="add-more-btn"
+              class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+              <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
             </button>
+            <button id="clear-files-btn"
+              class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+              <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+            </button>
+          </div>
 
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:textToPdf.name">Txt To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:textToPdf.subtitle">Upload one or more text files, or
-                type/paste text below to convert to PDF with
-                custom formatting.</p>
-
-            <!-- Mode Toggle -->
-            <div class="mb-4">
-                <div class="flex gap-2 p-1 rounded-lg bg-gray-900 border border-gray-700 mb-4">
-                    <button id="txt-mode-upload-btn"
-                        class="flex-1 btn bg-indigo-600 text-white font-semibold py-2 rounded-md">Upload Files</button>
-                    <button id="txt-mode-text-btn"
-                        class="flex-1 btn bg-gray-700 text-gray-300 font-semibold py-2 rounded-md">Type Text</button>
-                </div>
-
-                <!-- Upload Panel -->
-                <div id="txt-upload-panel">
-                    <div id="drop-zone"
-                        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                        <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                            <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                            <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select
-                                    file(s)</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                            <p class="text-xs text-gray-500">Text files (.txt)</p>
-                            <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave
-                                your device.</p>
-                        </div>
-                        <input id="file-input" type="file"
-                            class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" multiple
-                            accept="text/plain,.txt">
-                    </div>
-
-                    <div id="file-controls" class="hidden mt-4 flex gap-3">
-                        <button id="add-more-btn"
-                            class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                            <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                        </button>
-                        <button id="clear-files-btn"
-                            class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                            <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                        </button>
-                    </div>
-
-                    <div id="file-display-area" class="mt-4 space-y-2"></div>
-                </div>
-
-                <!-- Type Text Panel -->
-                <div id="txt-text-panel" class="hidden">
-                    <textarea id="text-input" rows="12"
-                        class="w-full bg-gray-900 border border-gray-600 text-gray-300 rounded-lg p-2.5 font-sans"
-                        placeholder="Start typing here..."></textarea>
-                </div>
-            </div>
-
-            <!-- Formatting Options -->
-            <div class="mt-6 grid grid-cols-2 md:grid-cols-4 gap-4">
-                <div>
-                    <label for="font-family" class="block mb-2 text-sm font-medium text-gray-300">Font Family</label>
-                    <select id="font-family"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="helv" selected>Helvetica (Sans-serif)</option>
-                        <option value="tiro">Tiro (Serif)</option>
-                        <option value="cour">Courier (Monospace)</option>
-                        <option value="times">Times (Serif)</option>
-                    </select>
-                </div>
-                <div>
-                    <label for="font-size" class="block mb-2 text-sm font-medium text-gray-300">Font Size</label>
-                    <input type="number" id="font-size" value="12" min="6" max="72"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                </div>
-                <div>
-                    <label for="text-color" class="block mb-2 text-sm font-medium text-gray-300">Text Color</label>
-                    <input type="color" id="text-color" value="#000000"
-                        class="w-full h-[42px] bg-gray-700 border border-gray-600 rounded-lg p-1 cursor-pointer">
-                </div>
-                <div>
-                    <label for="page-size" class="block mb-2 text-sm font-medium text-gray-300">Page Size</label>
-                    <select id="page-size"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <optgroup label="ISO A Series">
-                            <option value="A0">A0 (841 × 1189 mm)</option>
-                            <option value="A1">A1 (594 × 841 mm)</option>
-                            <option value="A2">A2 (420 × 594 mm)</option>
-                            <option value="A3">A3 (297 × 420 mm)</option>
-                            <option value="A4" selected>A4 (210 × 297 mm)</option>
-                            <option value="A5">A5 (148 × 210 mm)</option>
-                            <option value="A6">A6 (105 × 148 mm)</option>
-                            <option value="A7">A7 (74 × 105 mm)</option>
-                            <option value="A8">A8 (52 × 74 mm)</option>
-                            <option value="A9">A9 (37 × 52 mm)</option>
-                            <option value="A10">A10 (26 × 37 mm)</option>
-                        </optgroup>
-                        <optgroup label="ISO B Series">
-                            <option value="B0">B0 (1000 × 1414 mm)</option>
-                            <option value="B1">B1 (707 × 1000 mm)</option>
-                            <option value="B2">B2 (500 × 707 mm)</option>
-                            <option value="B3">B3 (353 × 500 mm)</option>
-                            <option value="B4">B4 (250 × 353 mm)</option>
-                            <option value="B5">B5 (176 × 250 mm)</option>
-                            <option value="B6">B6 (125 × 176 mm)</option>
-                            <option value="B7">B7 (88 × 125 mm)</option>
-                            <option value="B8">B8 (62 × 88 mm)</option>
-                            <option value="B9">B9 (44 × 62 mm)</option>
-                            <option value="B10">B10 (31 × 44 mm)</option>
-                        </optgroup>
-                        <optgroup label="ISO C Series (Envelopes)">
-                            <option value="C0">C0 (917 × 1297 mm)</option>
-                            <option value="C1">C1 (648 × 917 mm)</option>
-                            <option value="C2">C2 (458 × 648 mm)</option>
-                            <option value="C3">C3 (324 × 458 mm)</option>
-                            <option value="C4">C4 (229 × 324 mm)</option>
-                            <option value="C5">C5 (162 × 229 mm)</option>
-                            <option value="C6">C6 (114 × 162 mm)</option>
-                            <option value="C7">C7 (81 × 114 mm)</option>
-                            <option value="C8">C8 (57 × 81 mm)</option>
-                            <option value="C9">C9 (40 × 57 mm)</option>
-                            <option value="C10">C10 (28 × 40 mm)</option>
-                        </optgroup>
-                        <optgroup label="North American">
-                            <option value="Letter">Letter (8.5 × 11 in)</option>
-                            <option value="Legal">Legal (8.5 × 14 in)</option>
-                            <option value="Tabloid">Tabloid (11 × 17 in)</option>
-                            <option value="Ledger">Ledger (17 × 11 in)</option>
-                            <option value="11x17">11×17 (11 × 17 in)</option>
-                        </optgroup>
-                    </select>
-                </div>
-            </div>
-
-            <p class="text-xs text-gray-500 mt-3">
-                <i data-lucide="info" class="inline w-3 h-3"></i>
-                RTL languages (Arabic, Urdu, Persian, etc.) are automatically detected and text direction is adjusted.
-            </p>
-
-            <button id="process-btn" class="btn-gradient w-full mt-6">Create PDF</button>
+          <div id="file-display-area" class="mt-4 space-y-2"></div>
         </div>
-    </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
-                data-i18n="loader.processing">Processing...</p>
+        <!-- Type Text Panel -->
+        <div id="txt-text-panel" class="hidden">
+          <textarea id="text-input" rows="12"
+            class="w-full bg-gray-900 border border-gray-600 text-gray-300 rounded-lg p-2.5 font-sans"
+            placeholder="Start typing here..."></textarea>
         </div>
-    </div>
+      </div>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
-                data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+      <!-- Formatting Options -->
+      <div class="mt-6 grid grid-cols-2 md:grid-cols-4 gap-4">
+        <div>
+          <label for="font-family" class="block mb-2 text-sm font-medium text-gray-300">Font Family</label>
+          <select id="font-family" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="helv" selected>Helvetica (Sans-serif)</option>
+            <option value="tiro">Tiro (Serif)</option>
+            <option value="cour">Courier (Monospace)</option>
+            <option value="times">Times (Serif)</option>
+          </select>
         </div>
-    </div>
+        <div>
+          <label for="font-size" class="block mb-2 text-sm font-medium text-gray-300">Font Size</label>
+          <input type="number" id="font-size" value="12" min="6" max="72"
+            class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+        </div>
+        <div>
+          <label for="text-color" class="block mb-2 text-sm font-medium text-gray-300">Text Color</label>
+          <input type="color" id="text-color" value="#000000"
+            class="w-full h-[42px] bg-gray-700 border border-gray-600 rounded-lg p-1 cursor-pointer">
+        </div>
+        <div>
+          <label for="page-size" class="block mb-2 text-sm font-medium text-gray-300">Page Size</label>
+          <select id="page-size" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <optgroup label="ISO A Series">
+              <option value="A0">A0 (841 × 1189 mm)</option>
+              <option value="A1">A1 (594 × 841 mm)</option>
+              <option value="A2">A2 (420 × 594 mm)</option>
+              <option value="A3">A3 (297 × 420 mm)</option>
+              <option value="A4" selected>A4 (210 × 297 mm)</option>
+              <option value="A5">A5 (148 × 210 mm)</option>
+              <option value="A6">A6 (105 × 148 mm)</option>
+              <option value="A7">A7 (74 × 105 mm)</option>
+              <option value="A8">A8 (52 × 74 mm)</option>
+              <option value="A9">A9 (37 × 52 mm)</option>
+              <option value="A10">A10 (26 × 37 mm)</option>
+            </optgroup>
+            <optgroup label="ISO B Series">
+              <option value="B0">B0 (1000 × 1414 mm)</option>
+              <option value="B1">B1 (707 × 1000 mm)</option>
+              <option value="B2">B2 (500 × 707 mm)</option>
+              <option value="B3">B3 (353 × 500 mm)</option>
+              <option value="B4">B4 (250 × 353 mm)</option>
+              <option value="B5">B5 (176 × 250 mm)</option>
+              <option value="B6">B6 (125 × 176 mm)</option>
+              <option value="B7">B7 (88 × 125 mm)</option>
+              <option value="B8">B8 (62 × 88 mm)</option>
+              <option value="B9">B9 (44 × 62 mm)</option>
+              <option value="B10">B10 (31 × 44 mm)</option>
+            </optgroup>
+            <optgroup label="ISO C Series (Envelopes)">
+              <option value="C0">C0 (917 × 1297 mm)</option>
+              <option value="C1">C1 (648 × 917 mm)</option>
+              <option value="C2">C2 (458 × 648 mm)</option>
+              <option value="C3">C3 (324 × 458 mm)</option>
+              <option value="C4">C4 (229 × 324 mm)</option>
+              <option value="C5">C5 (162 × 229 mm)</option>
+              <option value="C6">C6 (114 × 162 mm)</option>
+              <option value="C7">C7 (81 × 114 mm)</option>
+              <option value="C8">C8 (57 × 81 mm)</option>
+              <option value="C9">C9 (40 × 57 mm)</option>
+              <option value="C10">C10 (28 × 40 mm)</option>
+            </optgroup>
+            <optgroup label="North American">
+              <option value="Letter">Letter (8.5 × 11 in)</option>
+              <option value="Legal">Legal (8.5 × 14 in)</option>
+              <option value="Tabloid">Tabloid (11 × 17 in)</option>
+              <option value="Ledger">Ledger (17 × 11 in)</option>
+              <option value="11x17">11×17 (11 × 17 in)</option>
+            </optgroup>
+          </select>
+        </div>
+      </div>
+
+      <p class="text-xs text-gray-500 mt-3">
+        <i data-lucide="info" class="inline w-3 h-3"></i>
+        RTL languages (Arabic, Urdu, Persian, etc.) are automatically detected and text direction is adjusted.
+      </p>
+
+      <button id="process-btn" class="btn-gradient w-full mt-6">Create PDF</button>
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium" data-i18n="loader.processing"
+        data-i18n="loader.processing">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200"
+        data-i18n="alert.ok" data-i18n="alert.ok">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -310,26 +312,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -342,14 +349,16 @@
           Is txt to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -361,70 +370,69 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub"><svg class="w-6 h-6"
-                                fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg></a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord"><svg class="w-6 h-6"
-                                fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg></a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)"><svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24"
-                                aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg></a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/txt-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub"><svg class="w-6 h-6" fill="currentColor"
+                viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg></a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord"><svg class="w-6 h-6" fill="currentColor"
+                viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg></a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)"><svg
+                class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg></a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/txt-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -446,7 +454,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -475,7 +483,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/validate-signature-pdf.html b/src/pages/validate-signature-pdf.html
new file mode 100644
index 0000000..ec1abcc
--- /dev/null
+++ b/src/pages/validate-signature-pdf.html
@@ -0,0 +1,413 @@
+<!doctype html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+    <title>Validate PDF Signature Online Free - Verify Digital Signatures | BentoPDF</title>
+    <meta name="title" content="Validate PDF Signature Online Free - Verify Digital Signatures | BentoPDF">
+    <meta name="description"
+        content="★ Verify PDF digital signatures online free ★ Check certificate validity ★ View signer details ★ No signup ★ Privacy-first ★ Works in browser">
+    <meta name="keywords"
+        content="validate pdf signature, verify digital signature, check pdf certificate, signature verification, pdf security">
+    <meta name="author" content="BentoPDF">
+    <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
+
+    <link rel="canonical" href="https://www.bentopdf.com/validate-signature-pdf">
+
+    <meta property="og:type" content="website">
+    <meta property="og:url" content="https://www.bentopdf.com/validate-signature-pdf">
+    <meta property="og:title" content="Validate PDF Signature Online Free - Verify Digital Signatures | BentoPDF">
+    <meta property="og:description"
+        content="★ Verify PDF digital signatures online free ★ Check certificate validity ★ View signer details ★ Privacy-first">
+    <meta property="og:image" content="https://www.bentopdf.com/images/og-validate-signature-pdf.png">
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="630">
+    <meta property="og:site_name" content="BentoPDF">
+
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:url" content="https://www.bentopdf.com/validate-signature-pdf">
+    <meta name="twitter:title" content="Validate PDF Signature Free">
+    <meta name="twitter:description"
+        content="★ Verify PDF digital signatures online free ★ Check certificate validity ★ Privacy-first">
+    <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-validate-signature-pdf.png">
+    <meta name="twitter:site" content="@BentoPDF">
+
+    <meta name="mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-capable" content="yes">
+    <meta name="apple-mobile-web-app-title" content="Validate Signature">
+
+    <link rel="alternate" hreflang="en" href="/en/validate-signature-pdf.html" />
+    <link rel="alternate" hreflang="de" href="/de/validate-signature-pdf.html" />
+    <link rel="alternate" hreflang="vi" href="/vi/validate-signature-pdf.html" />
+    <link rel="alternate" hreflang="x-default" href="/en/validate-signature-pdf.html" />
+    <link href="/src/css/styles.css" rel="stylesheet" />
+
+    <link rel="manifest" href="/site.webmanifest" />
+
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
+</head>
+
+<body class="antialiased bg-gray-900">
+    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+        <div class="container mx-auto px-4">
+            <div class="flex justify-between items-center h-16">
+                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+                    <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+                    <span class="text-white font-bold text-xl ml-2">
+                        <a href="/">BentoPDF</a>
+                    </span>
+                </div>
+
+                <div class="hidden md:flex items-center space-x-8 text-white">
+                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+                    <a href="/about.html" class="nav-link">About</a>
+                    <a href="/contact.html" class="nav-link">Contact</a>
+                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
+                </div>
+
+                <div class="md:hidden flex items-center">
+                    <button id="mobile-menu-button" type="button"
+                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+                        aria-controls="mobile-menu" aria-expanded="false">
+                        <span class="sr-only">Open main menu</span>
+                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M4 6h16M4 12h16M4 18h16" />
+                        </svg>
+                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+                                d="M6 18L18 6M6 6l12 12" />
+                        </svg>
+                    </button>
+                </div>
+            </div>
+        </div>
+
+        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+                <a href="/about.html" class="mobile-nav-link">About</a>
+                <a href="/contact.html" class="mobile-nav-link">Contact</a>
+                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+            </div>
+        </div>
+    </nav>
+
+    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+        <div id="tool-uploader"
+            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+            <button id="back-to-tools"
+                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+                <i data-lucide="arrow-left" class="cursor-pointer"></i>
+                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+            </button>
+
+            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:validateSignaturePdf.name">Validate PDF
+                Signature
+            </h1>
+            <p class="text-gray-400 mb-6" data-i18n="tools:validateSignaturePdf.subtitle">
+                Verify digital signatures in your PDF files. Check certificate validity, view signer details, and
+                confirm document integrity. All processing happens in your browser.
+            </p>
+
+            <div id="drop-zone"
+                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+                <div class="flex flex-col items-center justify-center pt-5 pb-6">
+                    <i data-lucide="cloud-upload" class="w-10 h-10 mb-3 text-gray-400"></i>
+                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
+                            data-i18n="upload.clickToSelect">Click to
+                            select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+                    <p class="text-xs text-gray-500">PDF Documents</p>
+                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+                        device.</p>
+                </div>
+                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+                    accept="application/pdf">
+            </div>
+
+            <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+            <div id="custom-cert-section" class="hidden mt-6 space-y-3">
+                <div class="flex items-center justify-between">
+                    <h2 class="text-sm font-semibold text-gray-300">Custom Certificate File X.509 (Optional)</h2>
+                </div>
+                <p class="text-xs text-gray-500">Upload a trusted X.509 certificate to validate against a custom trust
+                    source.</p>
+                <div id="cert-drop-zone"
+                    class="relative flex flex-col items-center justify-center w-full h-24 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+                    <div class="flex flex-col items-center justify-center py-2">
+                        <i data-lucide="shield" class="w-6 h-6 mb-1 text-gray-400"></i>
+                        <p class="text-xs text-gray-400">Upload certificate (.pem, .crt, .cer)</p>
+                    </div>
+                    <input id="cert-input" type="file"
+                        class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+                        accept=".pem,.crt,.cer,.der">
+                </div>
+                <div id="cert-display-area" class="space-y-2"></div>
+            </div>
+
+            <div id="results-section" class="hidden mt-6">
+                <h2 class="text-lg font-semibold text-white mb-4">Signature Validation Results</h2>
+                <div id="results-container"></div>
+            </div>
+        </div>
+    </div>
+
+    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+            <div class="solid-spinner"></div>
+            <p id="loader-text" class="text-white text-lg font-medium">
+                Processing...
+            </p>
+        </div>
+    </div>
+
+    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+            <p id="alert-message" class="text-gray-300 mb-6"></p>
+            <button id="alert-ok"
+                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+                OK
+            </button>
+        </div>
+    </div>
+
+    <!-- How It Works Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
+        <div class="space-y-6">
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    1
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Upload Your PDF</h3>
+                    <p class="text-gray-400">Select a digitally signed PDF file from your device</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    2
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">Automatic Analysis</h3>
+                    <p class="text-gray-400">The tool extracts and parses all digital signatures in the document</p>
+                </div>
+            </div>
+            <div class="flex items-start gap-4">
+                <div
+                    class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+                    3
+                </div>
+                <div class="flex-1">
+                    <h3 class="text-lg font-semibold text-white mb-1">View Results</h3>
+                    <p class="text-gray-400">See signer information, certificate validity, and signature status</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Related Tools Section -->
+    <section class="max-w-6xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
+        <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
+            <a href="/digital-sign-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Digital Signature</h3>
+                <p class="text-gray-400 text-sm">Add cryptographic signature</p>
+            </a>
+            <a href="/encrypt-pdf.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">Encrypt PDF</h3>
+                <p class="text-gray-400 text-sm">Password protect PDF</p>
+            </a>
+            <a href="/view-metadata.html"
+                class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+                <h3 class="text-white font-semibold mb-1">View Metadata</h3>
+                <p class="text-gray-400 text-sm">Inspect PDF properties</p>
+            </a>
+        </div>
+    </section>
+
+    <!-- FAQ Section -->
+    <section class="max-w-4xl mx-auto px-4 py-12">
+        <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Frequently Asked Questions</h2>
+        <div class="space-y-4">
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    What types of signatures can be validated?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">This tool validates PKCS#7 digital signatures created with X.509
+                    certificates, the standard format used by most PDF signing tools and certificate authorities.</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    What does "Self-Signed Certificate" mean?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">A self-signed certificate is one where the issuer and subject are the
+                    same. While the signature is technically valid, it means the certificate wasn't issued by a trusted
+                    Certificate Authority (CA).</p>
+            </details>
+            <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
+                <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
+                    Is my PDF uploaded to a server?
+                    <i data-lucide="chevron-down" class="w-5 h-5"></i>
+                </summary>
+                <p class="mt-3 text-gray-400">No, all processing happens entirely in your browser. Your PDF files never
+                    leave your device, ensuring complete privacy and security.</p>
+            </details>
+        </div>
+    </section>
+
+    <footer class="mt-16 border-t-2 border-gray-700 py-8">
+        <div class="container mx-auto px-4">
+            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+                <div class="mb-8 md:mb-0">
+                    <div class="flex items-center justify-center md:justify-start mb-4">
+                        <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+                        <span class="text-xl font-bold text-white">BentoPDF</span>
+                    </div>
+                    <p class="text-gray-400 text-sm">
+                        &copy; 2026 BentoPDF. All rights reserved.
+                    </p>
+                    <p class="text-gray-500 text-xs mt-2">
+                        Version <span id="app-version"></span>
+                    </p>
+                </div>
+
+                <div>
+                    <h3 class="font-bold text-white mb-4">Company</h3>
+                    <ul class="space-y-2 text-gray-400">
+                        <li>
+                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+                        </li>
+                        <li>
+                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+                        </li>
+                        <li>
+                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+                        </li>
+                    </ul>
+                </div>
+
+                <div>
+                    <h3 class="font-bold text-white mb-4">Legal</h3>
+                    <ul class="space-y-2 text-gray-400">
+                        <li>
+                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+                        </li>
+                        <li>
+                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+                        </li>
+                        <li>
+                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+                        </li>
+                    </ul>
+                </div>
+
+                <div>
+                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
+                    <div class="flex justify-center md:justify-start space-x-4">
+                        <a href="https://github.com/AlamLabs/bentopdf" target="_blank" rel="noopener noreferrer"
+                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                                <path fill-rule="evenodd"
+                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                                    clip-rule="evenodd" />
+                            </svg>
+                        </a>
+                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+                            class="text-gray-400 hover:text-indigo-400" title="Discord">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                                <path
+                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+                            </svg>
+                        </a>
+                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+                            title="Instagram">
+                            <i data-lucide="instagram"></i>
+                        </a>
+                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+                            title="LinkedIn">
+                            <i data-lucide="linkedin"></i>
+                        </a>
+                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
+                            title="X (Twitter)">
+                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                                <path
+                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+                            </svg>
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </footer>
+
+    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+    <script type="module" src="/src/js/utils/full-width.ts"></script>
+    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+    <script type="module" src="/src/version.ts"></script>
+    <script type="module" src="/src/js/logic/validate-signature-pdf-page.ts"></script>
+    <script type="module" src="/src/js/mobileMenu.ts"></script>
+    <script type="module" src="/src/js/main.ts"></script>
+
+    <!-- JSON-LD Structured Data -->
+    <script type="application/ld+json">
+    {
+      "@context": "https://schema.org",
+      "@type": "SoftwareApplication",
+      "name": "Validate PDF Signature - BentoPDF",
+      "applicationCategory": "PDF Signature Verification Tool",
+      "operatingSystem": "Any - Web Browser",
+      "offers": {
+        "@type": "Offer",
+        "price": "0",
+        "priceCurrency": "USD"
+      },
+      "featureList": [
+        "Verify PDF digital signatures",
+        "View certificate details",
+        "Check signature validity",
+        "Extract signer information",
+        "Client-side processing"
+      ]
+    }
+    </script>
+
+    <script type="application/ld+json">
+    {
+      "@context": "https://schema.org",
+      "@type": "BreadcrumbList",
+      "itemListElement": [
+        {
+          "@type": "ListItem",
+          "position": 1,
+          "name": "Home",
+          "item": "https://www.bentopdf.com"
+        },
+        {
+          "@type": "ListItem",
+          "position": 2,
+          "name": "Validate PDF Signature",
+          "item": "https://www.bentopdf.com/validate-signature-pdf"
+        }
+      ]
+    }
+    </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/src/pages/view-metadata.html b/src/pages/view-metadata.html
index 08bcdb2..5ec0bc9 100644
--- a/src/pages/view-metadata.html
+++ b/src/pages/view-metadata.html
@@ -69,7 +69,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="/">BentoPDF</a>
           </span>
@@ -276,10 +276,10 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
-          <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
           <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
         <div>
diff --git a/src/pages/vsd-to-pdf.html b/src/pages/vsd-to-pdf.html
index de0b661..693164d 100644
--- a/src/pages/vsd-to-pdf.html
+++ b/src/pages/vsd-to-pdf.html
@@ -2,55 +2,58 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Vsd To Pdf Online Free - Vsd To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Vsd To Pdf Online Free - Vsd To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Vsd To Pdf online free - Vsd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Vsd To Pdf online free - Vsd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="vsd to pdf, vsd to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/vsd-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/vsd-to-pdf">
   <meta property="og:title" content="Vsd To Pdf Online Free - Vsd To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Vsd To Pdf online free - Vsd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Vsd To Pdf online free - Vsd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-vsd-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/vsd-to-pdf">
   <meta name="twitter:title" content="Vsd To Pdf Free">
-  <meta name="twitter:description" content="★ Vsd To Pdf online free - Vsd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Vsd To Pdf online free - Vsd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-vsd-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Vsd To Pdf">
-  
 
-    <title>VSD to PDF - Convert Microsoft Publisher to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Microsoft Visio (VSD, VSDX) files to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/vsd-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/vsd-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/vsd-to-pdf.html" />
-    <link rel="alternate" hreflang="zh" href="/zh/vsd-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/vsd-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>VSD to PDF - Convert Microsoft Publisher to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Microsoft Visio (VSD, VSDX) files to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/vsd-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/vsd-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/vsd-to-pdf.html" />
+  <link rel="alternate" hreflang="zh" href="/zh/vsd-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/vsd-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -64,155 +67,157 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:vsdToPdf.name">Vsd To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:vsdToPdf.subtitle">
-                Convert Microsoft Visio (VSD, VSDX) files to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:vsdToPdf.acceptedFormats">VSD, VSDX files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".vsd,.vsdx" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:vsdToPdf.convertButton">Convert to PDF</span>
-                </button>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
-
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:vsdToPdf.name">Vsd To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:vsdToPdf.subtitle">
+        Convert Microsoft Visio (VSD, VSDX) files to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:vsdToPdf.acceptedFormats">VSD, VSDX files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".vsd,.vsdx" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:vsdToPdf.convertButton">Convert to PDF</span>
+        </button>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">Processing...</p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">OK</button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -220,26 +225,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -252,14 +262,16 @@
           Is vsd to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -271,73 +283,72 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">&copy; 2025 BentoPDF. All rights reserved.</p>
-                    <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram"><i data-lucide="instagram"></i></a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn"><i data-lucide="linkedin"></i></a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">&copy; 2026 BentoPDF. All rights reserved.</p>
+          <p class="text-gray-500 text-xs mt-2">Version <span id="app-version"></span></p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/vsd-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram"><i data-lucide="instagram"></i></a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn"><i data-lucide="linkedin"></i></a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/vsd-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -359,7 +370,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -388,7 +399,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/webp-to-pdf.html b/src/pages/webp-to-pdf.html
index 1a1095b..68d4e76 100644
--- a/src/pages/webp-to-pdf.html
+++ b/src/pages/webp-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Webp To Pdf Online Free - Webp To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Webp To Pdf Online Free - Webp To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Webp To Pdf online free - Webp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Webp To Pdf online free - Webp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="webp to pdf, webp to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/webp-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/webp-to-pdf">
   <meta property="og:title" content="Webp To Pdf Online Free - Webp To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Webp To Pdf online free - Webp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Webp To Pdf online free - Webp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-webp-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/webp-to-pdf">
   <meta name="twitter:title" content="Webp To Pdf Free">
-  <meta name="twitter:description" content="★ Webp To Pdf online free - Webp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
+  <meta name="twitter:description"
+    content="★ Webp To Pdf online free - Webp to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ F">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-webp-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Webp To Pdf">
-  
 
-    <title>WebP to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert one or more WebP images into a single PDF file. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/webp-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/webp-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/webp-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/webp-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>WebP to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert one or more WebP images into a single PDF file. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/webp-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/webp-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/webp-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/webp-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,173 +66,173 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
-                    <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
-                <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link" data-i18n="nav.about">About</a>
+          <a href="/contact.html" class="nav-link" data-i18n="nav.contact">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:webpToPdf.name">Webp To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:webpToPdf.subtitle">
-                Convert one or more WebP images into a single PDF file.
-            </p>
-
-            <!-- Drop Zone -->
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select a file</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500">WebP Images</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    multiple accept="image/webp">
-            </div>
-
-            <!-- Control buttons -->
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <!-- File List -->
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <!-- Options -->
-            <div id="jpg-to-pdf-options" class="hidden mt-6">
-                <div class="mb-4">
-                    <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300"> PDF Quality
-                    </label>
-                    <select id="jpg-pdf-quality"
-                        class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
-                        <option value="high"> High Quality (Larger file) </option>
-                        <option value="medium" selected> Medium Quality (Balanced) </option>
-                        <option value="low"> Low Quality (Smaller file) </option>
-                    </select>
-                    <p class="mt-1 text-xs text-gray-400"> Controls image compression when embedding into PDF </p>
-                </div>
-
-                <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <!-- Loader Modal -->
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link" data-i18n="nav.about">About</a>
+        <a href="/contact.html" class="mobile-nav-link" data-i18n="nav.contact">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <!-- Alert Modal -->
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title"
-                data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:webpToPdf.name">Webp To Pdf Converter Free Online
+        - Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:webpToPdf.subtitle">
+        Convert one or more WebP images into a single PDF file.
+      </p>
+
+      <!-- Drop Zone -->
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select a file</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500">WebP Images</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer" multiple
+          accept="image/webp">
+      </div>
+
+      <!-- Control buttons -->
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <!-- File List -->
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <!-- Options -->
+      <div id="jpg-to-pdf-options" class="hidden mt-6">
+        <div class="mb-4">
+          <label for="jpg-pdf-quality" class="block mb-2 text-sm font-medium text-gray-300"> PDF Quality
+          </label>
+          <select id="jpg-pdf-quality" class="w-full bg-gray-700 border border-gray-600 text-white rounded-lg p-2.5">
+            <option value="high"> High Quality (Larger file) </option>
+            <option value="medium" selected> Medium Quality (Balanced) </option>
+            <option value="low"> Low Quality (Smaller file) </option>
+          </select>
+          <p class="mt-1 text-xs text-gray-400"> Controls image compression when embedding into PDF </p>
+        </div>
+
+        <button id="process-btn" class="btn-gradient w-full mt-6">Convert to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <!-- Loader Modal -->
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <!-- Alert Modal -->
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title" data-i18n="alert.title">
+        Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -237,26 +240,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -269,14 +277,16 @@
           Is webp to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -288,96 +298,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/webp-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/webp-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -399,7 +408,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -428,7 +437,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/word-to-pdf.html b/src/pages/word-to-pdf.html
index a17758b..1ca9859 100644
--- a/src/pages/word-to-pdf.html
+++ b/src/pages/word-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Word to PDF Converter Free Online - Convert Files | BentoPDF</title>
   <meta name="title" content="Word to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta name="description" content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="word to pdf, docx to pdf, convert word, doc to pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/word-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/word-to-pdf">
   <meta property="og:title" content="Word to PDF Converter Free Online - Convert Files | BentoPDF">
-  <meta property="og:description" content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-word-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/word-to-pdf">
   <meta name="twitter:title" content="Word to PDF Free">
-  <meta name="twitter:description" content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
+  <meta name="twitter:description"
+    content="★ Word to PDF online free - Convert Word to PDF PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in bro">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-word-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Word to PDF">
-  
 
-    <title>Word to PDF - Convert DOCX, DOC to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert Word documents (DOCX, DOC, ODT, RTF) to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/word-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/word-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/word-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/word-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>Word to PDF - Convert DOCX, DOC to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert Word documents (DOCX, DOC, ODT, RTF) to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/word-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/word-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/word-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/word-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,174 +66,176 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:wordToPdf.name">Word to PDF Converter Free Online - Convert DOCX Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:wordToPdf.subtitle">
-                Convert Word documents (DOCX, DOC, ODT, RTF) to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:wordToPdf.acceptedFormats">DOCX, DOC, ODT, RTF
-                        files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".doc,.docx,.odt,.rtf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.oasis.opendocument.text,text/rtf,application/rtf"
-                    multiple>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-4">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:wordToPdf.convertButton">Convert
-                    to PDF</button>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:wordToPdf.name">Word to PDF Converter Free Online
+        - Convert DOCX Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:wordToPdf.subtitle">
+        Convert Word documents (DOCX, DOC, ODT, RTF) to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:wordToPdf.acceptedFormats">DOCX, DOC, ODT, RTF
+            files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".doc,.docx,.odt,.rtf,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.oasis.opendocument.text,text/rtf,application/rtf"
+          multiple>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-4">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full" data-i18n="tools:wordToPdf.convertButton">Convert
+          to PDF</button>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload Word Files</h3>
-            <p class="text-gray-400">Select or drag DOCX or DOC files you want to convert</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Auto Convert</h3>
-            <p class="text-gray-400">Conversion starts automatically, processing in your browser</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload Word Files</h3>
+          <p class="text-gray-400">Select or drag DOCX or DOC files you want to convert</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Preview Results</h3>
-            <p class="text-gray-400">See your converted PDF with preserved formatting</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            4
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download PDFs</h3>
-            <p class="text-gray-400">Save your PDF files - formatting perfectly preserved</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Auto Convert</h3>
+          <p class="text-gray-400">Conversion starts automatically, processing in your browser</p>
         </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Preview Results</h3>
+          <p class="text-gray-400">See your converted PDF with preserved formatting</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          4
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download PDFs</h3>
+          <p class="text-gray-400">Save your PDF files - formatting perfectly preserved</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -238,26 +243,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/pdf-to-docx.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Pdf To Docx</h3>
-          <p class="text-gray-400 text-sm">Free online pdf to docx tool</p>
-        </a>
-        <a href="/excel-to-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Excel To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online excel to pdf tool</p>
-        </a>
-        <a href="/powerpoint-to-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Powerpoint To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online powerpoint to pdf tool</p>
-        </a>
-        <a href="/txt-to-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Txt To Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online txt to pdf tool</p>
-        </a>
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
+      <a href="/pdf-to-docx.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Pdf To Docx</h3>
+        <p class="text-gray-400 text-sm">Free online pdf to docx tool</p>
+      </a>
+      <a href="/excel-to-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Excel To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online excel to pdf tool</p>
+      </a>
+      <a href="/powerpoint-to-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Powerpoint To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online powerpoint to pdf tool</p>
+      </a>
+      <a href="/txt-to-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Txt To Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online txt to pdf tool</p>
+      </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -277,108 +287,109 @@
           Will formatting be preserved?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! Fonts, images, tables, headers, footers, and all formatting are preserved exactly as they appear in Word.</p>
+        <p class="mt-3 text-gray-400">Yes! Fonts, images, tables, headers, footers, and all formatting are preserved
+          exactly as they appear in Word.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Can I convert password-protected Word files?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">You'll need to unlock password-protected files first before converting them to PDF.</p>
+        <p class="mt-3 text-gray-400">You'll need to unlock password-protected files first before converting them to
+          PDF.</p>
       </details>
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/word-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/word-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -400,7 +411,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -429,7 +440,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/wpd-to-pdf.html b/src/pages/wpd-to-pdf.html
index 37ed30f..9ab7925 100644
--- a/src/pages/wpd-to-pdf.html
+++ b/src/pages/wpd-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Wpd To Pdf Online Free - Wpd To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Wpd To Pdf Online Free - Wpd To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Wpd To Pdf online free - Wpd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Wpd To Pdf online free - Wpd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="wpd to pdf, wpd to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/wpd-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/wpd-to-pdf">
   <meta property="og:title" content="Wpd To Pdf Online Free - Wpd To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Wpd To Pdf online free - Wpd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Wpd To Pdf online free - Wpd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-wpd-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/wpd-to-pdf">
   <meta name="twitter:title" content="Wpd To Pdf Free">
-  <meta name="twitter:description" content="★ Wpd To Pdf online free - Wpd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Wpd To Pdf online free - Wpd to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-wpd-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Wpd To Pdf">
-  
 
-    <title>WPD to PDF - Convert WordPerfect to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert WordPerfect documents (WPD) to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/wpd-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/wpd-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/wpd-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/wpd-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>WPD to PDF - Convert WordPerfect to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert WordPerfect documents (WPD) to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/wpd-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/wpd-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/wpd-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/wpd-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,163 +66,165 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:wpdToPdf.name">Wpd To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:wpdToPdf.subtitle">
-                Convert WordPerfect documents (WPD) to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:wpdToPdf.acceptedFormats">WPD files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".wpd" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:wpdToPdf.convertButton">Convert to PDF</span>
-                </button>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:wpdToPdf.name">Wpd To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:wpdToPdf.subtitle">
+        Convert WordPerfect documents (WPD) to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:wpdToPdf.acceptedFormats">WPD files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".wpd" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:wpdToPdf.convertButton">Convert to PDF</span>
+        </button>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -227,26 +232,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -259,14 +269,16 @@
           Is wpd to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -278,84 +290,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/wpd-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/wpd-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -377,7 +388,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -406,7 +417,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/wps-to-pdf.html b/src/pages/wps-to-pdf.html
index 8ed46f4..342aaac 100644
--- a/src/pages/wps-to-pdf.html
+++ b/src/pages/wps-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Wps To Pdf Online Free - Wps To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Wps To Pdf Online Free - Wps To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Wps To Pdf online free - Wps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Wps To Pdf online free - Wps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="wps to pdf, wps to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/wps-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/wps-to-pdf">
   <meta property="og:title" content="Wps To Pdf Online Free - Wps To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Wps To Pdf online free - Wps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Wps To Pdf online free - Wps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-wps-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/wps-to-pdf">
   <meta name="twitter:title" content="Wps To Pdf Free">
-  <meta name="twitter:description" content="★ Wps To Pdf online free - Wps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Wps To Pdf online free - Wps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-wps-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Wps To Pdf">
-  
 
-    <title>WPS to PDF - Convert WPS Office to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert WPS Office documents (WPS) to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/wps-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/wps-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/wps-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/wps-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>WPS to PDF - Convert WPS Office to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert WPS Office documents (WPS) to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/wps-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/wps-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/wps-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/wps-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,163 +66,165 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:wpsToPdf.name">Wps To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:wpsToPdf.subtitle">
-                Convert WPS Office documents (WPS) to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:wpsToPdf.acceptedFormats">WPS files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".wps" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <div id="convert-options" class="hidden mt-6">
-                <button id="process-btn" class="btn-gradient w-full">
-                    <span data-i18n="tools:wpsToPdf.convertButton">Convert to PDF</span>
-                </button>
-            </div>
-
-            <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
-                <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
-                <p data-i18n="tools.firstLoadNotice">
-                    First load takes a moment as we download our conversion engine. After that, all loads will be
-                    instant.
-                </p>
-            </div>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:wpsToPdf.name">Wps To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:wpsToPdf.subtitle">
+        Convert WPS Office documents (WPS) to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:wpsToPdf.acceptedFormats">WPS files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".wps" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <div id="convert-options" class="hidden mt-6">
+        <button id="process-btn" class="btn-gradient w-full">
+          <span data-i18n="tools:wpsToPdf.convertButton">Convert to PDF</span>
+        </button>
+      </div>
+
+      <div class="flex items-center gap-2 text-gray-500 text-xs mt-6">
+        <i data-lucide="info" class="w-4 h-4 flex-shrink-0"></i>
+        <p data-i18n="tools.firstLoadNotice">
+          First load takes a moment as we download our conversion engine. After that, all loads will be
+          instant.
+        </p>
+      </div>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -227,26 +232,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -259,14 +269,16 @@
           Is wps to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -278,84 +290,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/wps-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/wps-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -377,7 +388,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -406,7 +417,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/xml-to-pdf.html b/src/pages/xml-to-pdf.html
index df1271a..0e7d7ed 100644
--- a/src/pages/xml-to-pdf.html
+++ b/src/pages/xml-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Xml To Pdf Online Free - Xml To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Xml To Pdf Online Free - Xml To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Xml To Pdf online free - Xml to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Xml To Pdf online free - Xml to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="xml to pdf, xml to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/xml-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/xml-to-pdf">
   <meta property="og:title" content="Xml To Pdf Online Free - Xml To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Xml To Pdf online free - Xml to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Xml To Pdf online free - Xml to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-xml-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/xml-to-pdf">
   <meta name="twitter:title" content="Xml To Pdf Free">
-  <meta name="twitter:description" content="★ Xml To Pdf online free - Xml to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Xml To Pdf online free - Xml to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-xml-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Xml To Pdf">
-  
 
-    <title>XML to PDF - Convert WordPerfect to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert XML documents to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/xml-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/xml-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/xml-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/xml-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>XML to PDF - Convert WordPerfect to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert XML documents to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/xml-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/xml-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/xml-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/xml-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,153 +66,155 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:xmlToPdf.name">Xml To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:xmlToPdf.subtitle">
-                Convert XML documents to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:xmlToPdf.acceptedFormats">XML files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".xml" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="btn-gradient w-full mt-6 hidden">
-                <span data-i18n="tools:xmlToPdf.convertButton">Convert to PDF</span>
-            </button>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:xmlToPdf.name">Xml To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:xmlToPdf.subtitle">
+        Convert XML documents to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold">Click to select files</span> <span
+              data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:xmlToPdf.acceptedFormats">XML files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".xml" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="trash-2"></i> <span data-i18n="upload.clearFiles">Clear Files</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="btn-gradient w-full mt-6 hidden">
+        <span data-i18n="tools:xmlToPdf.convertButton">Convert to PDF</span>
+      </button>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -217,26 +222,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -249,14 +259,16 @@
           Is xml to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -268,84 +280,83 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
-                        <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
-                        <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
-                        <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
-                        <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/xml-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/about.html" class="hover:text-indigo-400">About Us</a></li>
+            <li><a href="/faq.html" class="hover:text-indigo-400">FAQ</a></li>
+            <li><a href="/contact.html" class="hover:text-indigo-400">Contact Us</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li><a href="/licensing.html" class="hover:text-indigo-400">Licensing</a></li>
+            <li><a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a></li>
+            <li><a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a></li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/xml-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -367,7 +378,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -396,7 +407,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/pages/xps-to-pdf.html b/src/pages/xps-to-pdf.html
index 55cf3c9..cea16dd 100644
--- a/src/pages/xps-to-pdf.html
+++ b/src/pages/xps-to-pdf.html
@@ -2,54 +2,57 @@
 <html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
   <!-- Primary Meta Tags -->
   <title>Xps To Pdf Online Free - Xps To Pdf Tool | BentoPDF</title>
   <meta name="title" content="Xps To Pdf Online Free - Xps To Pdf Tool | BentoPDF">
-  <meta name="description" content="★ Xps To Pdf online free - Xps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta name="description"
+    content="★ Xps To Pdf online free - Xps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta name="keywords" content="xps to pdf, xps to pdf, online pdf">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/xps-to-pdf">
-  
+
   <!-- Open Graph / Facebook / LinkedIn -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/xps-to-pdf">
   <meta property="og:title" content="Xps To Pdf Online Free - Xps To Pdf Tool | BentoPDF">
-  <meta property="og:description" content="★ Xps To Pdf online free - Xps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
+  <meta property="og:description"
+    content="★ Xps To Pdf online free - Xps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fast & secure">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-xps-to-pdf.png">
   <meta property="og:image:width" content="1200">
   <meta property="og:image:height" content="630">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:url" content="https://www.bentopdf.com/xps-to-pdf">
   <meta name="twitter:title" content="Xps To Pdf Free">
-  <meta name="twitter:description" content="★ Xps To Pdf online free - Xps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
+  <meta name="twitter:description"
+    content="★ Xps To Pdf online free - Xps to pdf PDFs easily ★ No signup ★ Unlimited files ★ Privacy-first ★ Works in browser ★ Fas">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-xps-to-pdf.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <!-- Mobile Web App -->
   <meta name="mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="apple-mobile-web-app-title" content="Xps To Pdf">
-  
 
-    <title>XPS to PDF - Convert XPS/OXPS to PDF - BentoPDF</title>
-    <meta name="description"
-        content="Convert XPS and OXPS documents to PDF format. Free, secure, and runs entirely in your browser.">
-    
-    <link rel="alternate" hreflang="en" href="/en/xps-to-pdf.html" />
-    <link rel="alternate" hreflang="de" href="/de/xps-to-pdf.html" />
-    <link rel="alternate" hreflang="vi" href="/vi/xps-to-pdf.html" />
-    <link rel="alternate" hreflang="x-default" href="/en/xps-to-pdf.html" />
-    <link href="/src/css/styles.css" rel="stylesheet" />
-    
+
+  <title>XPS to PDF - Convert XPS/OXPS to PDF - BentoPDF</title>
+  <meta name="description"
+    content="Convert XPS and OXPS documents to PDF format. Free, secure, and runs entirely in your browser.">
+
+  <link rel="alternate" hreflang="en" href="/en/xps-to-pdf.html" />
+  <link rel="alternate" hreflang="de" href="/de/xps-to-pdf.html" />
+  <link rel="alternate" hreflang="vi" href="/vi/xps-to-pdf.html" />
+  <link rel="alternate" hreflang="x-default" href="/en/xps-to-pdf.html" />
+  <link href="/src/css/styles.css" rel="stylesheet" />
+
 
   <!-- Web App Manifest -->
   <link rel="manifest" href="/site.webmanifest" />
@@ -63,153 +66,154 @@
 </head>
 
 <body class="antialiased bg-gray-900">
-    <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
-        <div class="container mx-auto px-4">
-            <div class="flex justify-between items-center h-16">
-                <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-                    <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
-                    <span class="text-white font-bold text-xl ml-2">
-                        <a href="/">BentoPDF</a>
-                    </span>
-                </div>
-
-                <div class="hidden md:flex items-center space-x-8 text-white">
-                    <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
-                    <a href="/about.html" class="nav-link">About</a>
-                    <a href="/contact.html" class="nav-link">Contact</a>
-                    <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
-                </div>
-
-                <div class="md:hidden flex items-center">
-                    <button id="mobile-menu-button" type="button"
-                        class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
-                        aria-controls="mobile-menu" aria-expanded="false">
-                        <span class="sr-only">Open main menu</span>
-                        <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M4 6h16M4 12h16M4 18h16" />
-                        </svg>
-                        <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
-                            viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
-                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-                                d="M6 18L18 6M6 6l12 12" />
-                        </svg>
-                    </button>
-                </div>
-            </div>
+  <nav class="bg-gray-800 border-b border-gray-700 sticky top-0 z-30">
+    <div class="container mx-auto px-4">
+      <div class="flex justify-between items-center h-16">
+        <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <span class="text-white font-bold text-xl ml-2">
+            <a href="/">BentoPDF</a>
+          </span>
         </div>
 
-        <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
-            <div class="px-2 pt-2 pb-3 space-y-1 text-center">
-                <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
-                <a href="/about.html" class="mobile-nav-link">About</a>
-                <a href="/contact.html" class="mobile-nav-link">Contact</a>
-                <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
-            </div>
+        <div class="hidden md:flex items-center space-x-8 text-white">
+          <a href="/" class="nav-link" data-i18n="nav.home">Home</a>
+          <a href="/about.html" class="nav-link">About</a>
+          <a href="/contact.html" class="nav-link">Contact</a>
+          <a href="/" class="nav-link" data-i18n="nav.allTools">All Tools</a>
         </div>
-    </nav>
-
-    <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
-        <div id="tool-uploader"
-            class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
-            <button id="back-to-tools"
-                class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
-                <i data-lucide="arrow-left" class="cursor-pointer"></i>
-                <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
-            </button>
-
-            <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:xpsToPdf.name">Xps To Pdf Converter Free Online - Convert Files Fast</h1>
-            <p class="text-gray-400 mb-6" data-i18n="tools:xpsToPdf.subtitle">
-                Convert XPS/OXPS documents to PDF format. Supports multiple files.
-            </p>
-
-            <div id="drop-zone"
-                class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
-                <div class="flex flex-col items-center justify-center pt-5 pb-6">
-                    <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
-                    <p class="mb-2 text-sm text-gray-400"><span class="font-semibold"
-                            data-i18n="upload.clickToSelect">Click to select files</span> <span
-                            data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
-                    <p class="text-xs text-gray-500" data-i18n="tools:xpsToPdf.acceptedFormats">XPS, OXPS files</p>
-                    <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
-                        device.</p>
-                </div>
-                <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
-                    accept=".xps,.oxps,application/vnd.ms-xpsdocument,application/oxps" multiple>
-            </div>
-
-            <div id="file-controls" class="hidden mt-4 flex gap-3">
-                <button id="add-more-btn"
-                    class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
-                </button>
-                <button id="clear-files-btn"
-                    class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
-                    <i data-lucide="x"></i> <span data-i18n="upload.clearAll">Clear All</span>
-                </button>
-            </div>
-
-            <div id="file-display-area" class="mt-4 space-y-2"></div>
-
-            <button id="process-btn" class="hidden btn-gradient w-full mt-6"
-                data-i18n="tools:xpsToPdf.convertButton">Convert to PDF</button>
 
+        <div class="md:hidden flex items-center">
+          <button id="mobile-menu-button" type="button"
+            class="inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-white hover:bg-gray-700 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-500 transition-colors"
+            aria-controls="mobile-menu" aria-expanded="false">
+            <span class="sr-only">Open main menu</span>
+            <svg id="menu-icon" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
+              stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16" />
+            </svg>
+            <svg id="close-icon" class="hidden h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none"
+              viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
+              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+            </svg>
+          </button>
         </div>
+      </div>
     </div>
 
-    <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
-        <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
-            <div class="solid-spinner"></div>
-            <p id="loader-text" class="text-white text-lg font-medium">
-                Processing...
-            </p>
-        </div>
+    <div id="mobile-menu" class="hidden md:hidden bg-gray-800 border-t border-gray-700">
+      <div class="px-2 pt-2 pb-3 space-y-1 text-center">
+        <a href="/" class="mobile-nav-link" data-i18n="nav.home">Home</a>
+        <a href="/about.html" class="mobile-nav-link">About</a>
+        <a href="/contact.html" class="mobile-nav-link">Contact</a>
+        <a href="/" class="mobile-nav-link" data-i18n="nav.allTools">All Tools</a>
+      </div>
     </div>
+  </nav>
 
-    <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
-        <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
-            <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
-            <p id="alert-message" class="text-gray-300 mb-6"></p>
-            <button id="alert-ok"
-                class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
-                OK
-            </button>
+  <div id="uploader" class="min-h-screen flex flex-col items-center justify-start py-12 p-4 bg-gray-900">
+    <div id="tool-uploader"
+      class="bg-gray-800 rounded-xl shadow-xl px-4 py-8 md:p-8 max-w-2xl w-full text-gray-200 border border-gray-700">
+      <button id="back-to-tools"
+        class="flex items-center gap-2 text-indigo-400 hover:text-indigo-300 mb-6 font-semibold">
+        <i data-lucide="arrow-left" class="cursor-pointer"></i>
+        <span class="cursor-pointer" data-i18n="tools.backToTools"> Back to Tools </span>
+      </button>
+
+      <h1 class="text-2xl font-bold text-white mb-2" data-i18n="tools:xpsToPdf.name">Xps To Pdf Converter Free Online -
+        Convert Files Fast</h1>
+      <p class="text-gray-400 mb-6" data-i18n="tools:xpsToPdf.subtitle">
+        Convert XPS/OXPS documents to PDF format. Supports multiple files.
+      </p>
+
+      <div id="drop-zone"
+        class="relative flex flex-col items-center justify-center w-full h-48 md:h-64 border-2 border-dashed border-gray-600 rounded-xl cursor-pointer bg-gray-900 hover:bg-gray-700 transition-colors duration-300">
+        <div class="flex flex-col items-center justify-center pt-5 pb-6">
+          <i data-lucide="upload-cloud" class="w-10 h-10 mb-3 text-gray-400"></i>
+          <p class="mb-2 text-sm text-gray-400"><span class="font-semibold" data-i18n="upload.clickToSelect">Click to
+              select files</span> <span data-i18n="upload.orDragAndDrop">or drag and drop</span></p>
+          <p class="text-xs text-gray-500" data-i18n="tools:xpsToPdf.acceptedFormats">XPS, OXPS files</p>
+          <p class="text-xs text-gray-500" data-i18n="upload.filesNeverLeave">Your files never leave your
+            device.</p>
         </div>
-    </div>
+        <input id="file-input" type="file" class="absolute top-0 left-0 w-full h-full opacity-0 cursor-pointer"
+          accept=".xps,.oxps,application/vnd.ms-xpsdocument,application/oxps" multiple>
+      </div>
+
+      <div id="file-controls" class="hidden mt-4 flex gap-3">
+        <button id="add-more-btn"
+          class="btn bg-indigo-600 hover:bg-indigo-700 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="plus"></i> <span data-i18n="upload.addMore">Add More Files</span>
+        </button>
+        <button id="clear-files-btn"
+          class="btn bg-gray-700 hover:bg-gray-600 text-white font-semibold px-4 py-2 rounded-lg flex items-center gap-2">
+          <i data-lucide="x"></i> <span data-i18n="upload.clearAll">Clear All</span>
+        </button>
+      </div>
+
+      <div id="file-display-area" class="mt-4 space-y-2"></div>
+
+      <button id="process-btn" class="hidden btn-gradient w-full mt-6" data-i18n="tools:xpsToPdf.convertButton">Convert
+        to PDF</button>
+
+    </div>
+  </div>
+
+  <div id="loader-modal" class="hidden fixed inset-0 bg-black bg-opacity-75 flex items-center justify-center z-50">
+    <div class="bg-gray-800 p-8 rounded-lg flex flex-col items-center gap-4 border border-gray-700 shadow-xl">
+      <div class="solid-spinner"></div>
+      <p id="loader-text" class="text-white text-lg font-medium">
+        Processing...
+      </p>
+    </div>
+  </div>
+
+  <div id="alert-modal" class="fixed inset-0 bg-gray-900 bg-opacity-90 flex items-center justify-center z-50 hidden">
+    <div class="bg-gray-800 rounded-lg shadow-xl p-6 max-w-sm w-full border border-gray-700">
+      <h3 id="alert-title" class="text-xl font-bold text-white mb-2" data-i18n="alert.title">Alert</h3>
+      <p id="alert-message" class="text-gray-300 mb-6"></p>
+      <button id="alert-ok"
+        class="w-full bg-indigo-600 hover:bg-indigo-700 text-white font-semibold py-2 px-4 rounded-lg transition-colors duration-200">
+        OK
+      </button>
+    </div>
+  </div>
+
 
-    
   <!-- How It Works Section -->
   <section class="max-w-4xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-8 text-center">How It Works</h2>
     <div class="space-y-6">
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            1
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
-            <p class="text-gray-400">Click or drag and drop your file to begin</p>
-          </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          1
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            2
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
-            <p class="text-gray-400">Click the process button to start</p>
-          </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Upload File</h3>
+          <p class="text-gray-400">Click or drag and drop your file to begin</p>
         </div>
-        <div class="flex items-start gap-4">
-          <div class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
-            3
-          </div>
-          <div class="flex-1">
-            <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
-            <p class="text-gray-400">Save your processed file instantly</p>
-          </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          2
         </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Process</h3>
+          <p class="text-gray-400">Click the process button to start</p>
+        </div>
+      </div>
+      <div class="flex items-start gap-4">
+        <div
+          class="flex-shrink-0 w-10 h-10 bg-indigo-600 rounded-full flex items-center justify-center text-white font-bold">
+          3
+        </div>
+        <div class="flex-1">
+          <h3 class="text-lg font-semibold text-white mb-1">Download</h3>
+          <p class="text-gray-400">Save your processed file instantly</p>
+        </div>
+      </div>
     </div>
   </section>
 
@@ -217,26 +221,31 @@
   <section class="max-w-6xl mx-auto px-4 py-12">
     <h2 class="text-2xl md:text-3xl font-bold text-white mb-6 text-center">Related PDF Tools</h2>
     <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">
-        <a href="/merge-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
-        </a>
-        <a href="/compress-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
-        </a>
-        <a href="/split-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online split pdf tool</p>
-        </a>
-        <a href="/edit-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
-        </a>
-        <a href="/rotate-pdf.html" class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
-          <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
-          <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
-        </a>
+      <a href="/merge-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Merge Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online merge pdf tool</p>
+      </a>
+      <a href="/compress-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Compress Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online compress pdf tool</p>
+      </a>
+      <a href="/split-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Split Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online split pdf tool</p>
+      </a>
+      <a href="/edit-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Edit Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online edit pdf tool</p>
+      </a>
+      <a href="/rotate-pdf.html"
+        class="block bg-gray-800 p-4 rounded-lg hover:bg-gray-700 transition-colors border border-gray-700">
+        <h3 class="text-white font-semibold mb-1">Rotate Pdf</h3>
+        <p class="text-gray-400 text-sm">Free online rotate pdf tool</p>
+      </a>
     </div>
   </section>
 
@@ -249,14 +258,16 @@
           Is xps to pdf really free?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited file processing.</p>
+        <p class="mt-3 text-gray-400">Yes! BentoPDF is 100% free with no hidden fees, no signup required, and unlimited
+          file processing.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
           Are my files private and secure?
           <i data-lucide="chevron-down" class="w-5 h-5"></i>
         </summary>
-        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your device, ensuring complete privacy.</p>
+        <p class="mt-3 text-gray-400">Absolutely! All processing happens in your browser. Your files never leave your
+          device, ensuring complete privacy.</p>
       </details>
       <details class="bg-gray-800 p-5 rounded-lg border border-gray-700">
         <summary class="cursor-pointer font-semibold text-white flex items-center justify-between">
@@ -268,96 +279,95 @@
     </div>
   </section>
   <footer class="mt-16 border-t-2 border-gray-700 py-8">
-        <div class="container mx-auto px-4">
-            <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
-                <div class="mb-8 md:mb-0">
-                    <div class="flex items-center justify-center md:justify-start mb-4">
-                        <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
-                        <span class="text-xl font-bold text-white">BentoPDF</span>
-                    </div>
-                    <p class="text-gray-400 text-sm">
-                        &copy; 2025 BentoPDF. All rights reserved.
-                    </p>
-                    <p class="text-gray-500 text-xs mt-2">
-                        Version <span id="app-version"></span>
-                    </p>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Company</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/about.html" class="hover:text-indigo-400">About Us</a>
-                        </li>
-                        <li>
-                            <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
-                        </li>
-                        <li>
-                            <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Legal</h3>
-                    <ul class="space-y-2 text-gray-400">
-                        <li>
-                            <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
-                        </li>
-                        <li>
-                            <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
-                        </li>
-                        <li>
-                            <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
-                        </li>
-                    </ul>
-                </div>
-
-                <div>
-                    <h3 class="font-bold text-white mb-4">Follow Us</h3>
-                    <div class="flex justify-center md:justify-start space-x-4">
-                        <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="GitHub">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path fill-rule="evenodd"
-                                    d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
-                                    clip-rule="evenodd" />
-                            </svg>
-                        </a>
-                        <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
-                            class="text-gray-400 hover:text-indigo-400" title="Discord">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
-                            </svg>
-                        </a>
-                        <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="Instagram">
-                            <i data-lucide="instagram"></i>
-                        </a>
-                        <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
-                            title="LinkedIn">
-                            <i data-lucide="linkedin"></i>
-                        </a>
-                        <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400"
-                            title="X (Twitter)">
-                            <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
-                                <path
-                                    d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
-                            </svg>
-                        </a>
-                    </div>
-                </div>
-            </div>
+    <div class="container mx-auto px-4">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
+        <div class="mb-8 md:mb-0">
+          <div class="flex items-center justify-center md:justify-start mb-4">
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <span class="text-xl font-bold text-white">BentoPDF</span>
+          </div>
+          <p class="text-gray-400 text-sm">
+            &copy; 2026 BentoPDF. All rights reserved.
+          </p>
+          <p class="text-gray-500 text-xs mt-2">
+            Version <span id="app-version"></span>
+          </p>
         </div>
-    </footer>
-    <script type="module" src="/src/js/utils/lucide-init.ts"></script>
-    <script type="module" src="/src/js/utils/full-width.ts"></script>
-    <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
-    <script type="module" src="/src/version.ts"></script>
-    <script type="module" src="/src/js/logic/xps-to-pdf-page.ts"></script>
-    <script type="module" src="/src/js/mobileMenu.ts"></script>
-    <script type="module" src="/src/js/main.ts"></script>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Company</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/about.html" class="hover:text-indigo-400">About Us</a>
+            </li>
+            <li>
+              <a href="/faq.html" class="hover:text-indigo-400">FAQ</a>
+            </li>
+            <li>
+              <a href="/contact.html" class="hover:text-indigo-400">Contact Us</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Legal</h3>
+          <ul class="space-y-2 text-gray-400">
+            <li>
+              <a href="/licensing.html" class="hover:text-indigo-400">Licensing</a>
+            </li>
+            <li>
+              <a href="/terms.html" class="hover:text-indigo-400">Terms and Conditions</a>
+            </li>
+            <li>
+              <a href="/privacy.html" class="hover:text-indigo-400">Privacy Policy</a>
+            </li>
+          </ul>
+        </div>
+
+        <div>
+          <h3 class="font-bold text-white mb-4">Follow Us</h3>
+          <div class="flex justify-center md:justify-start space-x-4">
+            <a href="https://github.com/alam00000/bentopdf" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="GitHub">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path fill-rule="evenodd"
+                  d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z"
+                  clip-rule="evenodd" />
+              </svg>
+            </a>
+            <a href="https://discord.gg/Bgq3Ay3f2w" target="_blank" rel="noopener noreferrer"
+              class="text-gray-400 hover:text-indigo-400" title="Discord">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M20.317 4.37a19.791 19.791 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.27 18.27 0 0 0-5.487 0a12.64 12.64 0 0 0-.617-1.25a.077.077 0 0 0-.079-.037A19.736 19.736 0 0 0 3.677 4.37a.07.07 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.082.082 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.078.078 0 0 0 .084-.028a14.09 14.09 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13.107 13.107 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10.2 10.2 0 0 0 .372-.292a.074.074 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.074.074 0 0 1 .078.01c.12.098.246.198.373.292a.077.077 0 0 1-.006.127a12.299 12.299 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.076.076 0 0 0 .084.028a19.839 19.839 0 0 0 6.002-3.03a.077.077 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.061.061 0 0 0-.031-.03zM8.02 15.33c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418zm7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418z" />
+              </svg>
+            </a>
+            <a href="https://www.instagram.com/thebentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="Instagram">
+              <i data-lucide="instagram"></i>
+            </a>
+            <a href="https://www.linkedin.com/company/bentopdf/" class="text-gray-400 hover:text-indigo-400"
+              title="LinkedIn">
+              <i data-lucide="linkedin"></i>
+            </a>
+            <a href="https://x.com/BentoPDF" class="text-gray-400 hover:text-indigo-400" title="X (Twitter)">
+              <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                <path
+                  d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+      </div>
+    </div>
+  </footer>
+  <script type="module" src="/src/js/utils/lucide-init.ts"></script>
+  <script type="module" src="/src/js/utils/full-width.ts"></script>
+  <script type="module" src="/src/js/utils/simple-mode-footer.ts"></script>
+  <script type="module" src="/src/version.ts"></script>
+  <script type="module" src="/src/js/logic/xps-to-pdf-page.ts"></script>
+  <script type="module" src="/src/js/mobileMenu.ts"></script>
+  <script type="module" src="/src/js/main.ts"></script>
 
   <!-- JSON-LD Structured Data -->
   <script type="application/ld+json">
@@ -379,7 +389,7 @@
     }
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
@@ -408,7 +418,7 @@
     ]
   }
   </script>
-  
+
   <script type="application/ld+json">
   {
     "@context": "https://schema.org",
diff --git a/src/types/coherentpdf.global.d.ts b/src/types/coherentpdf.global.d.ts
index 9843a54..734ea4d 100644
--- a/src/types/coherentpdf.global.d.ts
+++ b/src/types/coherentpdf.global.d.ts
@@ -5,7 +5,7 @@
  * They describe APIs provided by the CoherentPDF library (cpdf.js) but are original
  * work created for type safety and integration.
  *
- * Copyright © 2025 BentoPDF
+ * Copyright © 2026 BentoPDF
  * Licensed under the GNU Affero General Public License v3.0 or later (AGPLv3+).
  */
 declare global {
diff --git a/terms.html b/terms.html
index 01e0289..65c0ae8 100644
--- a/terms.html
+++ b/terms.html
@@ -6,28 +6,31 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <!-- Primary Meta Tags -->
   <title>Terms and Conditions - Service Agreement | BentoPDF</title>
-  <meta name="description" content="BentoPDF terms of service. Free, client-side PDF tools with no file uploads. Read our terms and conditions.">
+  <meta name="description"
+    content="BentoPDF terms of service. Free, client-side PDF tools with no file uploads. Read our terms and conditions.">
   <meta name="author" content="BentoPDF">
   <meta name="robots" content="index, follow">
-  
+
   <!-- Canonical URL -->
   <link rel="canonical" href="https://www.bentopdf.com/terms">
-  
+
   <!-- Open Graph -->
   <meta property="og:type" content="website">
   <meta property="og:url" content="https://www.bentopdf.com/terms">
   <meta property="og:title" content="Terms and Conditions - Service Agreement | BentoPDF">
-  <meta property="og:description" content="BentoPDF terms of service. Free, client-side PDF tools with no file uploads. Read our terms and conditions.">
+  <meta property="og:description"
+    content="BentoPDF terms of service. Free, client-side PDF tools with no file uploads. Read our terms and conditions.">
   <meta property="og:image" content="https://www.bentopdf.com/images/og-terms.png">
   <meta property="og:site_name" content="BentoPDF">
-  
+
   <!-- Twitter Card -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:title" content="Terms and Conditions - Service Agreement | BentoPDF">
-  <meta name="twitter:description" content="BentoPDF terms of service. Free, client-side PDF tools with no file uploads. Read our terms and conditions.">
+  <meta name="twitter:description"
+    content="BentoPDF terms of service. Free, client-side PDF tools with no file uploads. Read our terms and conditions.">
   <meta name="twitter:image" content="https://www.bentopdf.com/images/twitter-terms.png">
   <meta name="twitter:site" content="@BentoPDF">
-  
+
   <title>Terms and Conditions - Service Agreement | BentoPDF</title>
   <link href="/src/css/styles.css" rel="stylesheet" />
 
@@ -47,7 +50,7 @@
     <div class="container mx-auto px-4">
       <div class="flex justify-between items-center h-16">
         <div class="flex-shrink-0 flex items-center cursor-pointer" id="home-logo">
-          <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-8 w-8" />
+          <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-8 w-8" />
           <span class="text-white font-bold text-xl ml-2">
             <a href="index.html">BentoPDF</a>
           </span>
@@ -213,6 +216,49 @@
           If you have any questions about these Terms, please contact us at
           <a href="mailto:contact@bentopdf.com">contact@bentopdf.com</a>.
         </p>
+
+        <h2>10. Commercial License Terms</h2>
+        <p>
+          By purchasing a commercial license for BentoPDF, you acknowledge and agree to the following:
+        </p>
+        <ul>
+          <li>
+            <strong>License Agreement:</strong> You have read and understood the
+            <a href="/licensing.html" class="text-indigo-400 hover:underline">Licensing Page</a>
+            in its entirety before making your purchase.
+          </li>
+          <li>
+            <strong>Nature of License:</strong> You are purchasing a commercial license for
+            BentoPDF's open-source code, which grants you the right to use the software in
+            closed-source and proprietary environments without the obligations of the AGPL-3.0 license.
+          </li>
+          <li>
+            <strong>No License Key:</strong> BentoPDF does not use license keys. Upon purchase,
+            you receive a ZIP archive containing the complete source code and binaries, identical
+            to the publicly available open-source repository.
+          </li>
+          <li>
+            <strong>No Refunds Policy:</strong> <strong class="text-red-400">Under no circumstances
+              shall a refund be made after purchase.</strong> All sales are final. By completing a
+            purchase, you acknowledge that you have evaluated the software (which is freely available
+            on GitHub) and are satisfied with its functionality.
+          </li>
+          <li>
+            <strong>Third-Party Components:</strong> The commercial license does not grant rights
+            to use AGPL-licensed third-party components (such as CPDF, PyMuPDF, and Ghostscript)
+            in a closed-source manner. You must comply with the AGPL v3 terms for these components
+            or obtain separate commercial licenses from their respective vendors.
+          </li>
+          <li>
+            <strong>Unlimited Usage:</strong> The license permits use on an unrestricted, unlimited
+            number of devices, servers, and user machines within your organization. There are no
+            per-user, per-machine, or per-seat limitations.
+          </li>
+        </ul>
+        <p>
+          For complete licensing details, please visit our
+          <a href="/licensing.html" class="text-indigo-400 hover:underline">Licensing Page</a>.
+        </p>
       </div>
     </section>
   </div>
@@ -222,11 +268,11 @@
       <div class="grid grid-cols-1 md:grid-cols-4 gap-8 text-center md:text-left">
         <div class="mb-8 md:mb-0">
           <div class="flex items-center justify-center md:justify-start mb-4">
-            <img src="/images/favicon.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
+            <img src="/images/favicon-no-bg.svg" alt="Bento PDF Logo" class="h-10 w-10 mr-3" />
             <span class="text-xl font-bold text-white">BentoPDF</span>
           </div>
           <p class="text-gray-400 text-sm">
-            &copy; 2025 BentoPDF. All rights reserved.
+            &copy; 2026 BentoPDF. All rights reserved.
           </p>
           <p class="text-gray-500 text-xs mt-2">
             Version <span id="app-version"></span>
diff --git a/tools.html b/tools.html
index d711214..1e3048b 100644
--- a/tools.html
+++ b/tools.html
@@ -23,21 +23,21 @@
     <meta property="og:image:width" content="1200">
     <meta property="og:image:height" content="630">
 
-    
+
     <link href="/src/css/styles.css" rel="stylesheet" />
     <script type="module">
         import '@phosphor-icons/web/regular';
     </script>
 
-  <!-- Web App Manifest -->
-  <link rel="manifest" href="/site.webmanifest" />
+    <!-- Web App Manifest -->
+    <link rel="manifest" href="/site.webmanifest" />
 
-  <!-- Favicons -->
-  <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
-  <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
-  <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
-  <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
-  <link rel="icon" href="/favicon.ico" sizes="32x32" />
+    <!-- Favicons -->
+    <link rel="icon" type="image/svg+xml" href="/images/favicon.svg" />
+    <link rel="icon" type="image/png" sizes="192x192" href="/images/favicon-192x192.png" />
+    <link rel="icon" type="image/png" sizes="512x512" href="/images/favicon-512x512.png" />
+    <link rel="apple-touch-icon" sizes="180x180" href="/images/apple-touch-icon.png" />
+    <link rel="icon" href="/favicon.ico" sizes="32x32" />
 </head>
 
 <body class="antialiased bg-gray-900">
@@ -131,7 +131,7 @@
     <!-- Footer -->
     <footer class="mt-16 border-t-2 border-gray-700 py-8">
         <div class="container mx-auto px-4 text-center text-gray-400">
-            <p>&copy; 2025 BentoPDF. All rights reserved.</p>
+            <p>&copy; 2026 BentoPDF. All rights reserved.</p>
         </div>
     </footer>
 
diff --git a/tsconfig.json b/tsconfig.json
index d01a318..47ac032 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -6,14 +6,12 @@
 //     "lib": ["ES2022", "DOM", "DOM.Iterable"],
 //     "types": ["vite/client"],
 //     "skipLibCheck": true,
-
 //     /* Bundler mode */
 //     "moduleResolution": "bundler",
 //     "allowImportingTsExtensions": true,
 //     "verbatimModuleSyntax": true,
 //     "moduleDetection": "force",
 //     "noEmit": true,
-
 //     /* Linting */
 //     "strict": true,
 //     "noUnusedLocals": true,
@@ -24,14 +22,20 @@
 //   },
 //   "include": ["src"]
 // }
-
 {
   "compilerOptions": {
     "target": "ES2022",
     "module": "ESNext",
-    "lib": ["ES2022", "DOM", "DOM.Iterable", "WebWorker"],
-    "types": ["vite/client", "vitest/globals"], // Added vitest/globals
-
+    "lib": [
+      "ES2022",
+      "DOM",
+      "DOM.Iterable",
+      "WebWorker"
+    ],
+    "types": [
+      "vite/client",
+      "vitest/globals"
+    ], // Added vitest/globals
     /* Easier module handling for Vite */
     "moduleResolution": "bundler",
     "allowJs": true,
@@ -39,29 +43,37 @@
     "skipLibCheck": true,
     "noEmit": true,
     "allowImportingTsExtensions": true,
-
     /* Disable strict checks for now */
     "strict": false,
     "noUnusedLocals": false,
     "noUnusedParameters": false,
     "noFallthroughCasesInSwitch": false,
     "noUncheckedSideEffectImports": false,
-
     /* Fix for ArrayBuffer type issues */
     "noImplicitAny": false,
-
     /* Quality-of-life options */
     "isolatedModules": true,
     "esModuleInterop": true,
     "forceConsistentCasingInFileNames": true,
     "resolveJsonModule": true,
-
     /* Path aliases (optional but helpful) */
     "baseUrl": ".",
     "paths": {
-      "@/*": ["./src/*"]
+      "@/*": [
+        "./src/*"
+      ],
+      "@/types": [
+        "./src/js/types/index.ts"
+      ]
     }
   },
-  "include": ["src", "src/**/*.ts", "public/workers"], // Updated to include all TS files
-  "exclude": ["node_modules", "dist"]
-}
+  "include": [
+    "src",
+    "src/**/*.ts",
+    "public/workers"
+  ], // Updated to include all TS files
+  "exclude": [
+    "node_modules",
+    "dist"
+  ]
+}
\ No newline at end of file
diff --git a/vite.config.ts b/vite.config.ts
index 4029d5c..389f281 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -14,7 +14,7 @@ function pagesRewritePlugin(): Plugin {
       server.middlewares.use((req, res, next) => {
         const url = req.url?.split('?')[0] || '';
 
-        const langMatch = url.match(/^\/(en|de|es|zh|vi)(\/.*)?$/);
+        const langMatch = url.match(/^\/(en|de|es|zh|vi|it)(\/.*)?$/);
         if (langMatch) {
           const lang = langMatch[1];
           const restOfPath = langMatch[2] || '/';
@@ -352,7 +352,7 @@ export default defineConfig(({ mode }) => {
           'pdf-to-csv': resolve(__dirname, 'src/pages/pdf-to-csv.html'),
           'pdf-to-excel': resolve(__dirname, 'src/pages/pdf-to-excel.html'),
           'pdf-to-text': resolve(__dirname, 'src/pages/pdf-to-text.html'),
-
+          'digital-sign-pdf': resolve(__dirname, 'src/pages/digital-sign-pdf.html'),
         },
       },
     },