From af8b30e51dc53c2fd19486a19148c322570cfab9 Mon Sep 17 00:00:00 2001
From: neo <neo@example.com>
Date: Sun, 21 Jun 2026 21:14:09 +0500
Subject: [PATCH] hero-v2: fix KPI cards positioning, boost sweep visibility

- .hero now overflow:hidden, kpi-cards absolute fill
- .kpi-card pointer-events:auto (was none)
- Sweep gradient 3x brighter
- Responsive: position-static cards on mobile
---
 hero-v2.html | 29 ++++++++++++++++++-----------
 1 file changed, 18 insertions(+), 11 deletions(-)

diff --git a/hero-v2.html b/hero-v2.html
index 5c284bb..8a50855 100644
--- a/hero-v2.html
+++ b/hero-v2.html
@@ -78,11 +78,11 @@ body {
     background: linear-gradient(
         90deg,
         transparent 0%,
-        transparent 35%,
-        rgba(255,255,255,0.008) 47%,
-        rgba(34,197,94,0.03) 50%,
-        rgba(255,255,255,0.006) 53%,
-        transparent 65%,
+        transparent 32%,
+        rgba(255,255,255,0.025) 44%,
+        rgba(34,197,94,0.06) 50%,
+        rgba(255,255,255,0.02) 56%,
+        transparent 68%,
         transparent 100%
     );
     background-size: 200% 100%;
@@ -99,15 +99,20 @@ body {
     min-height: 100vh; display: flex; flex-direction: column;
     align-items: center; justify-content: center;
     padding: 120px 24px 80px;
+    overflow: hidden;
 }
 
 /* ============================================================
    KPI CARDS — floating on sides
    ============================================================ */
-.kpi-cards { position: relative; z-index: 20; }
+.kpi-cards {
+    position: absolute; top: 0; left: 0; right: 0; bottom: 0;
+    z-index: 20; pointer-events: none;
+}
 
 .kpi-card {
     position: absolute;
+    pointer-events: auto;
     background: rgba(22,22,24,0.85);
     backdrop-filter: blur(12px);
     border: 1px solid rgba(255,255,255,0.08);
@@ -242,16 +247,18 @@ body {
    RESPONSIVE
    ============================================================ */
 @media (max-width: 1024px) {
-    .kpi-card {
-        position: static; transform: none;
-        width: 100%; max-width: 320px; margin: 0 auto 12px;
-    }
-    .kpi-card.left, .kpi-card.right { left: auto; }
     .kpi-cards {
+        position: relative; top: auto; left: auto; right: auto; bottom: auto;
         display: grid; grid-template-columns: 1fr 1fr;
         gap: 12px; width: 100%; max-width: 660px;
         margin: 0 auto 32px;
+        pointer-events: auto;
     }
+    .kpi-card {
+        position: static; transform: none;
+        width: 100%;
+    }
+    .kpi-card.left, .kpi-card.right { left: auto; }
     .hero { padding-top: 160px; }
     .hero-glow { width: 500px; height: 500px; }
 }