Website: Features page, smart quotes, copy pass

Huge update, now it's not just AI-gen shite

- Add `/features` page with detailed descriptions for each feature, sourced from CLAUDE.md files and code
- Add "Private LLM included" feature box after "Live full-disk index" with `sparkles.svg` icon
- Make all feature boxes clickable, linking to `/features#slug`
- Add smart quote auto-conversion: `remark-smartypants` for markdown, custom Astro integration for .astro pages
- Fix roadmap mobile layout (CSS grid so checkbox + title share a row)
- Align pricing card CTAs with `flex-col` + `mt-auto`
- Rewrite website copy to match writing style guide (casual tone, contractions, active voice, no corporate speak)
- Sync FAQ ld+json structured data with visible FAQ text
- Update footer: personal branding with social links, drop "All rights reserved"
- Update nav/footer links from `/#features` to `/features`

Author: vdavid

apps/website/astro.config.mjs

@@ -2,13 +2,15 @@
 import { defineConfig } from 'astro/config'
 import tailwindcss from '@tailwindcss/vite'
 import rehypeExternalLinks from 'rehype-external-links'
+import remarkSmartypants from 'remark-smartypants'
 import sitemap from '@astrojs/sitemap'
+import { smartQuotesIntegration } from './src/plugins/smart-quotes.mjs'
 
 // https://astro.build/config
 export default defineConfig({
     site: 'https://getcmdr.com',
     output: 'static',
-    integrations: [sitemap()],
+    integrations: [sitemap(), smartQuotesIntegration()],
     server: {
         port: parseInt(process.env.PORT || '4321'),
     },
@@ -20,6 +22,8 @@ export default defineConfig({
             },
             defaultColor: false,
         },
+        // @ts-expect-error remark-smartypants types use generic Node, Astro expects Root
+        remarkPlugins: [remarkSmartypants],
         rehypePlugins: [[rehypeExternalLinks, { target: '_blank', rel: ['noopener', 'noreferrer'] }]],
     },
     vite: {

apps/website/package.json

@@ -25,6 +25,7 @@
         "astro": "^5.18.0",
         "marked": "^17.0.4",
         "rehype-external-links": "3.0.0",
+        "remark-smartypants": "^3.0.2",
         "satori": "0.19.2",
         "sharp": "^0.34.5",
         "tailwindcss": "^4.2.1"

apps/website/public/icons/sparkles.svg

@@ -11,9 +11,9 @@ import NewsletterInlineWrapper from './NewsletterInlineWrapper.astro'
     </div>
 
     <div class="relative mx-auto max-w-4xl text-center">
-        <h2 class="mb-4 text-3xl font-bold md:text-4xl lg:text-5xl">Ready to try Cmdr?</h2>
+        <h2 class="mb-4 text-3xl font-bold md:text-4xl lg:text-5xl">Get Cmdr now!</h2>
         <p class="mb-10 text-lg text-[var(--color-text-secondary)]">
-            Free forever for personal use. No signup required.
+            Free forever for personal use. No signup, no account needed.
         </p>
 
         <!-- Download card -->

apps/website/src/components/Download.astro

@@ -1,43 +1,55 @@
 ---
 const shipped = [
     {
+        slug: 'full-disk-index',
         icon: '/icons/database.svg',
         title: 'Live full-disk index',
         description:
             'Indexes your entire drive once in about 4 minutes. Then stays current forever, even across restarts.',
     },
     {
+        slug: 'private-llm',
+        icon: '/icons/sparkles.svg',
+        title: 'Private LLM included',
+        description:
+            'Comes with an on-device model for free, private use. Bring your own OpenAI/Anthropic/etc. API key for smarter results.',
+    },
+    {
+        slug: 'speed',
         icon: '/icons/rocket.svg',
-        title: 'Blazing fast',
+        title: 'Really, really fast',
         description:
-            'Built in Rust. Opens a 100k-file folder in 4 seconds with icons, sizes, and dates. Try that in Finder.',
+            'Built in Rust. Opens a 100k-file folder in 4 seconds with icons, sizes, and dates, cold. In 1 second when warm.',
     },
     {
+        slug: 'keyboard-first',
         icon: '/icons/keyboard.svg',
         title: 'Keyboard-first',
-        description: 'Navigate, select, copy, move. All without touching your mouse. Two panes, tabs, command palette.',
+        description: 'Kb-first navigate, select, copy, move, rename; menus, tabs, settings; command palette. But works with a mouse, too.',
     },
 ]
 
 const upcoming = [
     {
+        slug: 'smart-search',
         icon: '/icons/search.svg',
         title: 'Smart search',
         description:
-            'Find files by describing them: "that PDF contract from last month" or "screenshots with error messages."',
+            'Find files by saying: "that PDF contract from last month" or "all my node_modules folders"',
         badge: 'Works but early stage',
     },
     {
+        slug: 'ai-rename',
         icon: '/icons/brain.svg',
         title: 'Natural language rename',
-        description:
-            'Type "make these lowercase and add date prefix" and watch it happen. No regex, no scripts, just words.',
+        description: 'Commands like "make these files lowercase and add date prefix". No regex, no scripts.',
         badge: 'Coming soon',
     },
     {
+        slug: 'ai-batch',
         icon: '/icons/zap.svg',
-        title: 'AI batch operations',
-        description: 'Organize hundreds of files with a single command. "Sort these into folders by project name."',
+        title: 'AI file organization',
+        description: 'Say "Clean up my Downloads folder" to get a list of move/delete suggestions you can approve/reject.',
         badge: 'Coming soon',
     },
 ]
@@ -51,19 +63,22 @@ const upcoming = [
                 Built for <span class="gradient-text">power users</span>
             </h2>
             <p class="mx-auto max-w-2xl text-lg text-[var(--color-text-secondary)]">
-                Fast, keyboard-driven, and getting smarter.
+                Fast, keyboard-driven, and getting smarter every week.
             </p>
         </div>
 
         <!-- Shipped features -->
-        <div class="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
+        <div class="grid gap-6 md:grid-cols-2">
             {
                 shipped.map((feature) => (
-                    <div class="group relative rounded-2xl border border-[var(--color-border)] bg-[var(--color-surface)] p-8 transition-all duration-300 hover:border-[var(--color-accent)]/30 hover:bg-[var(--color-surface-elevated)]">
+                    <a
+                        href={`/features#${feature.slug}`}
+                        class="group relative block rounded-2xl border border-[var(--color-border)] bg-[var(--color-surface)] p-8 no-underline transition-all duration-300 hover:border-[var(--color-accent)]/30 hover:bg-[var(--color-surface-elevated)]"
+                    >
                         <img src={feature.icon} alt="" class="mb-4 size-10" />
                         <h3 class="mb-2 text-xl font-semibold">{feature.title}</h3>
                         <p class="text-[var(--color-text-secondary)]">{feature.description}</p>
-                    </div>
+                    </a>
                 ))
             }
         </div>
@@ -77,20 +92,19 @@ const upcoming = [
         <div class="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
             {
                 upcoming.map((feature) => (
-                    <div class="group relative rounded-2xl border border-[var(--color-accent)]/30 bg-gradient-to-br from-[var(--color-surface)] to-[var(--color-accent)]/5 p-8 transition-all duration-300 hover:border-[var(--color-accent)]/50">
+                    <a
+                        href={`/features#${feature.slug}`}
+                        class="group relative block rounded-2xl border border-[var(--color-accent)]/30 bg-gradient-to-br from-[var(--color-surface)] to-[var(--color-accent)]/5 p-8 no-underline transition-all duration-300 hover:border-[var(--color-accent)]/50"
+                    >
                         {feature.badge && (
-                            <a
-                                href="/roadmap"
-                                class="absolute top-4 right-4 rounded-full bg-[var(--color-accent)]/20 px-2.5 py-1 text-xs font-medium text-[var(--color-accent-text)] transition-colors hover:bg-[var(--color-accent)]/30"
-                                aria-label={`${feature.badge} — view roadmap`}
-                            >
+                            <span class="absolute top-4 right-4 rounded-full bg-[var(--color-accent)]/20 px-2.5 py-1 text-xs font-medium text-[var(--color-accent-text)]">
                                 {feature.badge}
-                            </a>
+                            </span>
                         )}
                         <img src={feature.icon} alt="" class="mb-4 size-10" />
                         <h3 class="mb-2 text-xl font-semibold">{feature.title}</h3>
                         <p class="text-[var(--color-text-secondary)]">{feature.description}</p>
-                    </div>
+                    </a>
                 ))
             }
         </div>

apps/website/src/components/Features.astro

@@ -22,7 +22,7 @@ const currentYear = new Date().getFullYear()
                 <ul class="space-y-2 text-sm">
                     <li>
                         <a
-                            href="/#features"
+                            href="/features"
                             class="text-[var(--color-text-secondary)] underline decoration-[var(--color-border)] underline-offset-2 transition-colors hover:text-[var(--color-text-primary)] hover:decoration-[var(--color-text-tertiary)]"
                         >
                             Features
@@ -124,7 +124,7 @@ const currentYear = new Date().getFullYear()
         >
             <div>
                 <p class="font-semibold text-[var(--color-text-primary)]">Stay in the loop</p>
-                <p class="text-sm text-[var(--color-text-secondary)]">Product updates and Cmdr news. No spam, ever.</p>
+                <p class="text-sm text-[var(--color-text-secondary)]">Product updates and news. No spam, ever.</p>
             </div>
             <div class="w-full md:w-auto md:min-w-[320px]">
                 <NewsletterForm variant="inline" />
@@ -133,12 +133,16 @@ const currentYear = new Date().getFullYear()
 
         <!-- Bottom bar -->
         <div
-            class="flex flex-col items-center justify-between gap-4 border-t border-[var(--color-border-subtle)] pt-8 md:flex-row"
+            class="flex flex-wrap items-center justify-center gap-x-1 border-t border-[var(--color-border-subtle)] pt-8 text-sm text-[var(--color-text-tertiary)]"
         >
-            <p class="text-sm text-[var(--color-text-tertiary)]">
-                © {currentYear} Rymdskottkärra AB. All rights reserved.
-            </p>
-            <p class="text-sm text-[var(--color-text-tertiary)]">Made with ❤️ in Sweden</p>
+            <span>© {currentYear} David Veszelovszki ·</span>
+            <a href="https://veszelovszki.com" target="_blank" rel="noopener noreferrer" class="underline decoration-[var(--color-border)] underline-offset-2 transition-colors hover:text-[var(--color-text-primary)] hover:decoration-[var(--color-text-tertiary)]">veszelovszki.com</a>
+            <span>·</span>
+            <a href="https://github.com/vdavid" target="_blank" rel="noopener noreferrer" class="underline decoration-[var(--color-border)] underline-offset-2 transition-colors hover:text-[var(--color-text-primary)] hover:decoration-[var(--color-text-tertiary)]">GitHub</a>
+            <span>·</span>
+            <a href="https://x.com/vdavid" target="_blank" rel="noopener noreferrer" class="underline decoration-[var(--color-border)] underline-offset-2 transition-colors hover:text-[var(--color-text-primary)] hover:decoration-[var(--color-text-tertiary)]">X</a>
+            <span>·</span>
+            <a href="https://www.linkedin.com/in/veszelovszki/" target="_blank" rel="noopener noreferrer" class="underline decoration-[var(--color-border)] underline-offset-2 transition-colors hover:text-[var(--color-text-primary)] hover:decoration-[var(--color-text-tertiary)]">LinkedIn</a>
         </div>
     </div>
 </footer>

apps/website/src/components/Footer.astro

@@ -4,7 +4,7 @@ import NewsletterForm from './NewsletterForm.astro'
 import ThemeToggle from './ThemeToggle.astro'
 
 const navLinks = [
-    { href: '/#features', label: 'Features' },
+    { href: '/features', label: 'Features' },
     { href: '/pricing', label: 'Pricing' },
     { href: '/blog', label: 'Blog' },
     { href: '/changelog', label: 'Changelog' },

apps/website/src/components/Header.astro

@@ -26,16 +26,16 @@ import DownloadButton from './DownloadButton.astro'
 
         <!-- Headline - Steps 2 & 3 -->
         <h1 class="mb-6 text-3xl font-bold leading-tight tracking-tight md:text-4xl lg:text-6xl">
-            <span class="animate-blur-in stagger-2 inline-block">Every folder sized.</span>
-            <span class="animate-blur-in stagger-3 inline-block gradient-text">Every file found.</span>
+            <span class="animate-blur-in stagger-2 inline-block">Finally, a file manager</span>
+            <span class="animate-blur-in stagger-3 inline-block gradient-text">from 2026</span>
         </h1>
 
         <!-- Subheadline - Step 4 -->
         <p
             class="animate-blur-in stagger-4 mb-10 max-w-xl text-lg leading-relaxed text-[var(--color-text-secondary)] md:text-xl"
         >
-            Indexes your entire drive in minutes. Directory sizes everywhere, instant search, keyboard-driven
-            everything. Built in Rust, free for personal use.
+            Indexes your whole drive in minutes. Folder sizes everywhere, instant search, keyboard-driven everything.
+            Built in Rust, free for personal use.
         </p>
 
         <!-- CTA Buttons - Steps 5 & 6 -->

apps/website/src/components/Hero.astro

@@ -8,31 +8,4 @@
             >a dev</a
         > who's used two-pane file managers for 35 years and couldn't find a good one on Mac.
     </p>
-
-    <div class="mx-auto mt-6 flex max-w-xl flex-wrap items-center justify-center gap-x-8 gap-y-3 text-sm">
-        <a
-            href="https://gitstrata.com/github.com/vdavid/cmdr"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="text-[var(--color-text-tertiary)] transition-colors hover:text-[var(--color-accent-text)]"
-        >
-            <span class="font-semibold text-[var(--color-text-secondary)]">180k</span> lines of code
-        </a>
-        <a
-            href="https://gitstrata.com/github.com/vdavid/cmdr"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="text-[var(--color-text-tertiary)] transition-colors hover:text-[var(--color-accent-text)]"
-        >
-            <span class="font-semibold text-[var(--color-text-secondary)]">1,000</span> commits in 12 weeks
-        </a>
-        <a
-            href="https://github.com/vdavid/cmdr"
-            target="_blank"
-            rel="noopener noreferrer"
-            class="text-[var(--color-text-tertiary)] transition-colors hover:text-[var(--color-accent-text)]"
-        >
-            <span class="font-semibold text-[var(--color-text-secondary)]">100%</span> source-available
-        </a>
-    </div>
 </section>

apps/website/src/components/Story.astro

@@ -15,7 +15,7 @@ const testimonials = [
 <section class="relative px-6 py-32">
     <div class="mx-auto max-w-6xl">
         <div class="mb-16 text-center">
-            <h2 class="mb-4 text-3xl font-bold md:text-4xl lg:text-5xl">Notes from the builder</h2>
+            <h2 class="mb-4 text-3xl font-bold md:text-4xl lg:text-5xl">Notes from the dev</h2>
         </div>
 
         <div class="grid gap-6 md:grid-cols-3">