feat: add per-platform SEO landing pages (/youtube-downloader, etc.)

Create a dedicated, dynamically-routed page for each of 15 curated
platforms (YouTube, TikTok, Instagram, Facebook, X, Reddit, Pinterest,
Vimeo, SoundCloud, Twitch, Dailymotion, LinkedIn, Tumblr, VK, Snapchat)
under /[locale]/[slug], with a tailored hero, an example URL matched
to the platform, a unique "about" paragraph, and a mix of
platform-specific and shared FAQ items, all translated across
en/fr/es/it. Unknown slugs 404.

Kept the scope to a curated list rather than all 1380 yt-dlp
extractors to avoid thin/duplicate "doorway page" content that search
engines penalize.

The homepage's platform badges and the "+1000 sites" links now point
to these pages, extracted the FAQ accordion markup into a shared
FaqAccordion component reused by both the homepage FAQ and the new
platform pages.

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

src/components/SubmitForm.tsx

@@ -19,7 +19,7 @@ function Spinner() {
 const selectClass =
   'rounded-lg border border-gray-200 dark:border-slate-700 bg-white dark:bg-slate-900 px-2 py-1 text-gray-900 dark:text-gray-50 text-sm outline-none focus:ring-2 focus:ring-violet-500'
 
-export function SubmitForm() {
+export function SubmitForm({ examplePlaceholder }: { examplePlaceholder?: string } = {}) {
   const t = useTranslations('home')
   const router = useRouter()
   const [url, setUrl] = useState('')
@@ -75,7 +75,7 @@ export function SubmitForm() {
             value={url}
             onChange={(e) => setUrl(e.target.value)}
             required
-            placeholder="https://www.youtube.com/watch?v=..."
+            placeholder={examplePlaceholder ?? 'https://www.youtube.com/watch?v=...'}
             className="flex-1 px-4 py-3 bg-transparent text-sm outline-none placeholder:text-gray-400 dark:placeholder:text-slate-500"
           />
           <button