diff --git a/app/components/layouts/ArcticNewOneCursor.vue b/app/components/layouts/ArcticNewOneCursor.vue
index 1d9ba7f..f7817e4 100644
--- a/app/components/layouts/ArcticNewOneCursor.vue
+++ b/app/components/layouts/ArcticNewOneCursor.vue
@@ -257,9 +257,11 @@ onBeforeUnmount(() => {
 <template>
   <Teleport to="body">
     <div aria-hidden="true">
-      <div ref="dotRef" class="custom-cursor-dot" />
-      <div ref="horizontalLineRef" class="custom-cursor-line custom-cursor-line-x" />
-      <div ref="verticalLineRef" class="custom-cursor-line custom-cursor-line-y" />
+      <div class="custom-cursor-blend-group">
+        <div ref="horizontalLineRef" class="custom-cursor-line custom-cursor-line-x" />
+        <div ref="verticalLineRef" class="custom-cursor-line custom-cursor-line-y" />
+        <div ref="dotRef" class="custom-cursor-dot" />
+      </div>
       <div ref="pillRef" class="custom-cursor-pill">
         <div ref="pillTextRef" class="custom-cursor-pill-text">Read more</div>
       </div>
@@ -268,6 +270,17 @@ onBeforeUnmount(() => {
 </template>
 
 <style scoped>
+.custom-cursor-blend-group {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  pointer-events: none;
+  z-index: 2147483646;
+  mix-blend-mode: difference;
+}
+
 .custom-cursor-dot,
 .custom-cursor-line,
 .custom-cursor-pill,
@@ -278,15 +291,14 @@ onBeforeUnmount(() => {
 
 .custom-cursor-dot,
 .custom-cursor-line {
-  position: fixed;
+  position: absolute;
   left: 0;
   top: 0;
   pointer-events: none;
-  mix-blend-mode: difference;
 }
 
 .custom-cursor-dot {
-  z-index: 2147483647;
+  z-index: 2;
   width: 24px;
   height: 24px;
   border-radius: 999px;
@@ -294,7 +306,7 @@ onBeforeUnmount(() => {
 }
 
 .custom-cursor-line {
-  z-index: 2147483646;
+  z-index: 1;
   background: #888;
 }