feat: landing page redesign

- New hero headline "Turn any video into a watch party" with animated
  gradient highlight, sharper subtitle and quiet trust line under the CTAs
- Changelog badge redesigned as the koala's speech bubble (version and
  release date baked in at build time, no version.json fetch anymore)
- Light/dark theme toggle in the header (dark default, pre-paint via
  lang-init, full light theme across sections)
- Use cases and "Why KoalaSync" merged into one section with the three
  strongest feature tiles; question-mark koala moved to the FAQ
- FAQ and self-hosting setup collapsed by default via shared
  section-collapse component (hash deep links auto-open them)
- Compat/juggler section more compact
- og:image switched to the 1280x640 repository OpenGraph card (landing
  and join page), generated during build
- "watch party" keyword added to meta title/description in all 15 locales
- All em-dashes removed from user-facing copy

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

website/build.cjs

@@ -117,6 +117,18 @@ async function compile() {
     }
     console.log('  ✓ Favicons/touch icons successfully synced to website/assets/');
 
+    // Social link preview image (og:image / twitter:image), same artwork as the
+    // GitHub repository OpenGraph card. PNG kept for maximum scraper support.
+    const ogSrc = path.join(websiteDir, '..', 'assets', 'StoreAssets', 'RepositoryOpenGraph.png');
+    if (fs.existsSync(ogSrc)) {
+        await sharp(ogSrc)
+            .png({ quality: 80, palette: true })
+            .toFile(path.join(targetAssetsDir, 'og-image.png'));
+        console.log('  ✓ og-image.png generated from RepositoryOpenGraph.png');
+    } else {
+        console.warn(`  ⚠️ Warning: ${ogSrc} not found. Skipping og-image generation.`);
+    }
+
     // ── 1. Minify CSS/JS (must happen first so hashes go into HTML) ──
     console.log('Minifying CSS/JS...');
     const styleRaw = fs.readFileSync(path.join(websiteDir, 'style.css'), 'utf8');
@@ -174,6 +186,7 @@ async function compile() {
         let compiled = templateContent;
         compiled = compiled.replace(/\{\{ASSET_PATH\}\}/g, assetPath);
         compiled = compiled.replace(/\{\{VERSION\}\}/g, buildVersion);
+        compiled = compiled.replace(/\{\{VERSION_DATE\}\}/g, versionJson.date || '');
         const langPrefix = lang === 'en' ? '' : `${lang}/`;
         compiled = compiled.replace(/\{\{LANG_PREFIX\}\}/g, langPrefix);
         languages.forEach(l => {