fix(footer): extend isometric grid across section

src/components/FooterSection.module.css

@@ -1,4 +1,6 @@
 .footerSection {
+  --footer-grid-line: rgba(21, 87, 166, 0.1);
+
   position: relative;
   isolation: isolate;
   width: 100%;
@@ -12,3 +14,50 @@
   justify-content: flex-start;
   background-color: var(--bg-page, #ffffff);
 }
+
+.footerSection::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 50%;
+  width: 100vw;
+  transform: translateX(-50%);
+  z-index: 0;
+  opacity: 0.6;
+  pointer-events: none;
+  background-image:
+    repeating-linear-gradient(
+      26.565deg,
+      transparent 0 35px,
+      var(--footer-grid-line) 35px 36px
+    ),
+    repeating-linear-gradient(
+      153.435deg,
+      transparent 0 35px,
+      var(--footer-grid-line) 35px 36px
+    );
+  -webkit-mask-image: linear-gradient(
+    to bottom,
+    transparent 0%,
+    #000 18%,
+    #000 80%,
+    transparent 100%
+  );
+  mask-image: linear-gradient(
+    to bottom,
+    transparent 0%,
+    #000 18%,
+    #000 80%,
+    transparent 100%
+  );
+}
+
+.footerSection > * {
+  position: relative;
+  z-index: 1;
+}
+
+:global([data-theme='dark']) .footerSection {
+  --footer-grid-line: rgba(130, 181, 255, 0.09);
+}

src/components/IsometricFooter/IsometricScene.tsx

@@ -13,59 +13,6 @@ import {
   TelegramIcon,
 } from './IsoElements';
 
-/**
- * Faint Isometric Background Grid
- * Fine architectural diamond grid lines covering the ground (slope 0.5, 2:1 isometric)
- */
-function IsometricBackgroundGrid() {
-  const lines = [];
-  const spacing = 40;
-  const yStart = 150;
-  const yEnd = 500;
-
-  // Axis 1: / lines (slope 0.5, dx = 2 * dy)
-  for (let c = -600; c <= 1600; c += spacing * 2) {
-    const x1 = c;
-    const y1 = yStart;
-    const x2 = c + (yEnd - yStart) * 2;
-    const y2 = yEnd;
-    lines.push(
-      <line
-        key={`a1-${c}`}
-        x1={x1}
-        y1={y1}
-        x2={x2}
-        y2={y2}
-        stroke="var(--border-default, #D9E2EF)"
-        strokeWidth={1}
-        opacity={0.65}
-      />
-    );
-  }
-
-  // Axis 2: \ lines (slope -0.5, dx = -2 * dy)
-  for (let c = -400; c <= 1800; c += spacing * 2) {
-    const x1 = c;
-    const y1 = yStart;
-    const x2 = c - (yEnd - yStart) * 2;
-    const y2 = yEnd;
-    lines.push(
-      <line
-        key={`a2-${c}`}
-        x1={x1}
-        y1={y1}
-        x2={x2}
-        y2={y2}
-        stroke="var(--border-default, #D9E2EF)"
-        strokeWidth={1}
-        opacity={0.65}
-      />
-    );
-  }
-
-  return <g className="iso-ground-grid">{lines}</g>;
-}
-
 /**
  * Architectural Stepped Terraces:
  * 5 ground steps on the floor along the 2:1 isometric grid,
@@ -323,22 +270,19 @@ export default function IsometricScene({
       role="img"
       aria-label="Interactive 3D isometric footer scene"
     >
-      {/* 1. Faint Isometric Ground Grid */}
-      <IsometricBackgroundGrid />
-
-      {/* 2. Solid 3D Architectural Stepped Terraces */}
+      {/* 1. Solid 3D Architectural Stepped Terraces */}
       <SteppedTerraces />
 
-      {/* 3. Glowing Royal Blue Circuit Conduits */}
+      {/* 2. Glowing Royal Blue Circuit Conduits */}
       <CircuitConduits activePost={activePost} />
 
-      {/* 4. Left Mountain Cluster */}
+      {/* 3. Left Mountain Cluster */}
       <MountainCluster x={80} y={250} scale={0.92} />
 
-      {/* 5. Right Mountain Cluster (mirrored) */}
+      {/* 4. Right Mountain Cluster (mirrored) */}
       <MountainCluster x={1120} y={250} flip={true} scale={0.92} />
 
-      {/* 6. Pine Trees on the floor along ground line */}
+      {/* 5. Pine Trees on the floor along ground line */}
       <PineTree x={335} y={425} scale={0.84} dark={true} />
       <PineTree x={395} y={422} scale={0.96} dark={false} />
       <PineTree x={490} y={422} scale={0.92} />
@@ -346,7 +290,7 @@ export default function IsometricScene({
       <PineTree x={865} y={425} scale={0.84} dark={true} />
       <PineTree x={965} y={422} scale={0.92} />
 
-      {/* 7. Central Workstation Illustrations resting flush on the large platform */}
+      {/* 6. Central Workstation Illustrations resting flush on the large platform */}
       <g className="central-workstation">
         {/* Prominent Monitor Display resting on left elevated step */}
         <IsoMonitorDisplay x={534} y={285} />
@@ -356,7 +300,7 @@ export default function IsometricScene({
         <IsoPCTower x={642} y={290} size={20} height={40} />
       </g>
 
-      {/* 8. The 4 Interactive Isometric Signposts rotated in 3D */}
+      {/* 7. The 4 Interactive Isometric Signposts rotated in 3D */}
       <IsoSignpost
         id="phone"
         x={280}