v1.0.0 updating issue fix

Profice WebSite/style/tech-onepager.css

@@ -2376,34 +2376,56 @@
     }
 }
 
-/* Non-16:9 wide screens and landscape tablets (1024-1366px) */
-@media (max-width: 1366px) and (min-width: 1025px) {
+/* Common laptop resolutions (1366x768, 1440x900) */
+@media (max-width: 1440px) and (min-width: 1025px) {
     .hero-container {
         max-width: 1100px;
-        gap: 40px;
+        gap: 30px;
     }
     
     .hero-right {
-        height: 420px;
+        height: 360px;
+        max-width: 520px;
+        overflow: hidden;
+        position: relative;
+    }
+    
+    .system-graphic {
+        max-width: 100%;
+        height: 100%;
+        transform: scale(0.8);
+        transform-origin: center center;
+        overflow: hidden;
     }
     
     .hero-headline {
-        font-size: clamp(2rem, 3.5vw, 3rem);
+        font-size: clamp(2rem, 3.2vw, 2.8rem);
     }
     
     .hero-subline,
     .hero-proof {
-        font-size: 1.1rem;
+        font-size: 1rem;
     }
     
     .node {
-        min-width: 80px;
-        padding: 8px;
+        min-width: 65px;
+        padding: 5px;
+        font-size: 0.8rem;
     }
     
     .central-node {
-        min-width: 130px;
-        max-width: 150px;
+        min-width: 100px;
+        max-width: 120px;
+        font-size: 0.85rem;
+    }
+    
+    .node-icon {
+        width: 22px !important;
+        height: 22px !important;
+    }
+    
+    .node-metrics {
+        font-size: 0.7rem;
     }
 }
 
@@ -2427,7 +2449,7 @@
 @media (max-width: 1024px) {
     .hero-container {
         grid-template-columns: 1fr;
-        gap: 40px;
+        gap: 30px;
         text-align: center;
     }
     
@@ -2436,16 +2458,21 @@
     }
     
     .hero-right {
-        height: 380px;
+        height: 350px;
         order: -1;
-        max-width: 600px;
+        max-width: 500px;
         margin: 0 auto;
         width: 100%;
+        overflow: hidden;
+        position: relative;
     }
     
     .system-graphic {
         max-width: 100%;
-        overflow: visible;
+        height: 100%;
+        transform: scale(0.75);
+        transform-origin: center center;
+        overflow: hidden;
     }
     
     .system-details {
@@ -2509,9 +2536,7 @@
         font-size: 1.6rem;
     }
     
-    .systeme-grid {
-        grid-template-columns: 1fr;
-    }
+    /* Keep systeme-grid layout consistent across all devices - no layout changes needed */
     
     .results-grid {
         grid-template-columns: 1fr;
@@ -2587,41 +2612,7 @@
         font-size: 0.7rem;
     }
     
-    /* Compact circular layout for mobile - adjusted spacing */
-    .phone-node {
-        top: 2%;
-        left: 50%;
-        transform: translateX(-50%);
-    }
-    
-    .chat-node {
-        top: 20%;
-        right: 2%;
-        left: auto;
-        transform: none;
-    }
-    
-    .crm-node {
-        bottom: 20%;
-        right: 2%;
-        top: auto;
-        left: auto;
-        transform: none;
-    }
-    
-    .ticket-node {
-        bottom: 2%;
-        left: 50%;
-        top: auto;
-        transform: translateX(-50%);
-    }
-    
-    .team-node {
-        top: 20%;
-        left: 2%;
-        right: auto;
-        transform: none;
-    }
+    /* Keep consistent grid layout - no absolute positioning needed */
 }
 
 /* Extra small screens */