diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx
index bb8d8ae..f8adba4 100644
--- a/src/pages/Index.tsx
+++ b/src/pages/Index.tsx
@@ -77,15 +77,15 @@ export default function IndexPage() {
       {/* ── FEATURED HERO ── */}
       <section className="py-24 pb-0">
         <div className="mx-auto max-w-7xl px-6 pt-8">
-          <Link to={`/article/\${featuredArticle.slug}`} className="group block animate-fade-in">
+          <Link to={`/article/${featuredArticle.slug}`} className="group block animate-fade-in">
             <div className="relative overflow-hidden rounded-3xl hover:shadow-2xl transition-all duration-500">
-              <div className={`aspect-[21/9] bg-gradient-to-br \${featuredArticle.gradient}`}>
+              <div className={`aspect-[21/9] bg-gradient-to-br ${featuredArticle.gradient}`}>
                 <div className="absolute inset-0" style={{ backgroundImage: "radial-gradient(circle at 25% 25%, rgba(255,255,255,0.15) 1px, transparent 1px)", backgroundSize: "20px 20px" }} />
                 <div className="absolute top-1/4 left-1/4 w-64 h-64 rounded-full bg-white/10 blur-3xl" />
                 <div className="absolute bottom-1/3 right-1/4 w-48 h-48 rounded-full bg-white/10 blur-3xl" />
               </div>
               <div className="absolute inset-0 bg-gradient-to-t from-black/80 via-black/30 to-black/10" />
-              <Badge className={`absolute top-6 left-6 border-0 z-10 \${categoryColors[featuredArticle.category] || "bg-emerald-100 text-emerald-700"}`}>
+              <Badge className={`absolute top-6 left-6 border-0 z-10 ${categoryColors[featuredArticle.category] || "bg-emerald-100 text-emerald-700"}`}>
                 {featuredArticle.category}
               </Badge>
               <div className="absolute bottom-0 left-0 right-0 p-8 sm:p-12">
@@ -133,12 +133,12 @@ export default function IndexPage() {
             <div className="lg:col-span-3">
               <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 stagger">
                 {latestArticles.map((article) => (
-                  <Link to={`/article/\${article.slug}`} key={article.id} className="group">
+                  <Link to={`/article/${article.slug}`} key={article.id} className="group">
                     <Card className="overflow-hidden border-0 shadow-sm hover:shadow-xl hover:-translate-y-1 transition-all duration-300 bg-white">
-                      <div className={`relative aspect-video bg-gradient-to-br \${article.gradient}`}>
+                      <div className={`relative aspect-video bg-gradient-to-br ${article.gradient}`}>
                         <div className="absolute inset-0" style={{ backgroundImage: "radial-gradient(circle at 25% 25%, rgba(255,255,255,0.15) 1px, transparent 1px)", backgroundSize: "20px 20px" }} />
                         <div className="absolute top-1/3 left-1/4 w-24 h-24 rounded-full bg-white/10 blur-2xl" />
-                        <Badge className={`absolute top-3 left-3 border-0 text-xs \${categoryColors[article.category] || "bg-emerald-100 text-emerald-700"}`}>
+                        <Badge className={`absolute top-3 left-3 border-0 text-xs ${categoryColors[article.category] || "bg-emerald-100 text-emerald-700"}`}>
                           {article.category}
                         </Badge>
                       </div>
@@ -187,7 +187,7 @@ export default function IndexPage() {
                   <ul className="space-y-3">
                     {categories.map((cat) => (
                       <li key={cat.name}>
-                        <Link to={`/category/\${cat.name.toLowerCase()}`} className="flex items-center justify-between text-sm text-stone-600 hover:text-emerald-600 transition-colors">
+                        <Link to={`/category/${cat.name.toLowerCase()}`} className="flex items-center justify-between text-sm text-stone-600 hover:text-emerald-600 transition-colors">
                           <span>{cat.name}</span>
                           <Badge variant="secondary" className="bg-stone-100 text-stone-500 text-xs">{cat.count}</Badge>
                         </Link>
@@ -255,7 +255,7 @@ export default function IndexPage() {
                   <ul className="space-y-4">
                     {latestArticles.slice(0, 3).map((article, i) => (
                       <li key={article.id}>
-                        <Link to={`/article/\${article.slug}`} className="flex gap-3 group">
+                        <Link to={`/article/${article.slug}`} className="flex gap-3 group">
                           <span className="text-2xl font-bold text-stone-200">0{i + 1}</span>
                           <div>
                             <p className="text-sm font-medium text-stone-800 group-hover:text-emerald-600 transition-colors line-clamp-2">{article.title}</p>