diff --git a/components/home/HeroIllustration.tsx b/components/home/HeroIllustration.tsx
index 987a59e2..38b5c07b 100644
--- a/components/home/HeroIllustration.tsx
+++ b/components/home/HeroIllustration.tsx
@@ -127,6 +127,7 @@ export default function HeroIllustration() {
   const viewBox = isMobile ? '400 0 1000 1100' : '-400 -200 1800 1100';
   const scale = isMobile ? 1.44 : 1;
   const opacity = isMobile ? 0.6 : 0.85;
+  const strokeMultiplier = isMobile ? 2.5 : 1;
 
   return (
     <div className="absolute inset-0 z-0 overflow-visible bg-primary w-full h-full">
@@ -184,7 +185,7 @@ export default function HeroIllustration() {
                   x2={end.x}
                   y2={end.y}
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                 />
               );
             })}
@@ -199,14 +200,14 @@ export default function HeroIllustration() {
                   x2={end.x}
                   y2={end.y}
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                 />
               );
             })}
           </g>
 
           {/* POWER LINES */}
-          <g stroke="white" strokeWidth="2" strokeOpacity="0.2">
+          <g stroke="white" strokeWidth={2 * strokeMultiplier} strokeOpacity="0.2">
             {POWER_LINES.map((line, i) => {
               const from = gridToScreen(line.from.col, line.from.row);
               const to = gridToScreen(line.to.col, line.to.row);
@@ -230,7 +231,7 @@ export default function HeroIllustration() {
                   x2={to.x}
                   y2={to.y}
                   stroke="url(#energy-pulse)"
-                  strokeWidth="3"
+                  strokeWidth={3 * strokeMultiplier}
                   strokeLinecap="round"
                   style={{
                     strokeDasharray: `${length * 0.2} ${length * 0.8}`,
@@ -252,7 +253,7 @@ export default function HeroIllustration() {
                   fill="white"
                   fillOpacity="0.05"
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                   strokeOpacity="0.2"
                 />
                 <path
@@ -260,7 +261,7 @@ export default function HeroIllustration() {
                   fill="white"
                   fillOpacity="0.1"
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                   strokeOpacity="0.3"
                 />
                 <circle
@@ -285,7 +286,7 @@ export default function HeroIllustration() {
                   x2="0"
                   y2="-60"
                   stroke="white"
-                  strokeWidth="2"
+                  strokeWidth={2 * strokeMultiplier}
                   strokeOpacity="0.3"
                 />
                 <g transform="translate(0, -60)">
@@ -303,7 +304,7 @@ export default function HeroIllustration() {
                         x2="0"
                         y2="-30"
                         stroke="white"
-                        strokeWidth="1.5"
+                        strokeWidth={1.5 * strokeMultiplier}
                         strokeOpacity="0.4"
                         transform={`rotate(${angle})`}
                       />
@@ -325,7 +326,7 @@ export default function HeroIllustration() {
                   fill="white"
                   fillOpacity="0.05"
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                   strokeOpacity="0.2"
                 />
                 <path
@@ -337,7 +338,7 @@ export default function HeroIllustration() {
                   fill="white"
                   fillOpacity="0.08"
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                   strokeOpacity="0.3"
                 />
               </g>
@@ -352,7 +353,7 @@ export default function HeroIllustration() {
                 <path
                   d="M -6 0 L -3 -45 M 6 0 L 3 -45"
                   stroke="white"
-                  strokeWidth="1.5"
+                  strokeWidth={1.5 * strokeMultiplier}
                   strokeOpacity="0.3"
                 />
                 <line
@@ -361,7 +362,7 @@ export default function HeroIllustration() {
                   x2="12"
                   y2="-40"
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                   strokeOpacity="0.2"
                 />
               </g>
@@ -380,7 +381,7 @@ export default function HeroIllustration() {
                   fill="white"
                   fillOpacity="0.08"
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                   strokeOpacity="0.2"
                 />
                 <path
@@ -388,7 +389,7 @@ export default function HeroIllustration() {
                   fill="white"
                   fillOpacity="0.05"
                   stroke="white"
-                  strokeWidth="1"
+                  strokeWidth={1 * strokeMultiplier}
                   strokeOpacity="0.15"
                 />
               </g>