From 9ee0d678c9e4a8dfacba39cfc0dbfe044cedd5a9 Mon Sep 17 00:00:00 2001
From: sasha-astiadi <sasha@incubaid.com>
Date: Wed, 17 Sep 2025 14:28:40 +0200
Subject: [PATCH] ok

---
 src/components/WorldMap.tsx | 30 +++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/components/WorldMap.tsx b/src/components/WorldMap.tsx
index 051c44e..760f2b9 100644
--- a/src/components/WorldMap.tsx
+++ b/src/components/WorldMap.tsx
@@ -2,11 +2,11 @@
 
 import { Globe } from "@/components/ui/globe"
 import { motion } from "framer-motion"
-import { H2, P, CT } from "./Texts"
+import { H2, P, CT, CP } from "./Texts"
 
 export function WorldMap() {
   return (
-    <div className="relative h-screen w-full overflow-hidden -top-20 flex flex-col">
+    <div className="relative min-h-screen w-full overflow-hidden -top-20 flex flex-col">
       {/* Background video */}
       <video
         autoPlay
@@ -33,46 +33,46 @@ export function WorldMap() {
         </div>
 
         {/* Bottom Layout: Globe + Cards */}
-        <div className="mt-8 flex flex-1 flex-col lg:flex-row items-center lg:items-stretch gap-12">
+        <div className="mt-8 flex flex-1 flex-col lg:flex-row items-center lg:items-stretch gap-8">
           {/* Globe Left Column */}
-          <div className="flex-1 flex items-center justify-center top-32 -left-24">
-            <div className="relative w-[450px] h-[450px] md:w-[550px] md:h-[550px]">
-              <Globe className="absolute inset-0 w-full h-full" />
+          <div className="flex-1 flex items-center justify-center">
+            <div className="relative w-[450px] h-[450px] md:w-[600px] md:h-[600px]">
+              <Globe className="absolute inset-0 w-full h-full -top-20 -left-32" />
             </div>
           </div>
 
           {/* Cards Right Column */}
           <div className="flex flex-col justify-center gap-6 max-w-xs w-full">
-            <motion.div className="rounded-2xl bg-white/5 backdrop-blur-md border border-white/10 p-4 shadow-md">
+            <motion.div className="rounded-2xl bg-white/5 backdrop-blur-md border border-white/10 p-4 shadow-md -top-20 right-20">
               <CT color="light" className="uppercase tracking-wide">CORES</CT>
               <H2 color="light" className="mt-2 text-3xl font-bold">54,958</H2>
-              <P color="light" className="mt-2 text-sm">
+              <CP color="light" className="mt-2 text-sm">
                 Total Central Processing Unit Cores available on the grid.
-              </P>
+              </CP>
             </motion.div>
 
             <motion.div className="rounded-2xl bg-white/5 backdrop-blur-md border border-white/10 p-4 shadow-md">
               <CT color="light" className="uppercase tracking-wide">NODES</CT>
               <H2 color="light" className="mt-2 text-3xl font-bold">54,958</H2>
-              <P color="light" className="mt-2 text-sm">
+              <CP color="light" className="mt-2 text-sm">
                 Total number of nodes on the grid.
-              </P>
+              </CP>
             </motion.div>
 
             <motion.div className="rounded-2xl bg-white/5 backdrop-blur-md border border-white/10 p-4 shadow-md">
               <CT color="light" className="uppercase tracking-wide">SSD CAPACITY</CT>
               <H2 color="light" className="mt-2 text-3xl font-bold">54,958</H2>
-              <P color="light" className="mt-2 text-sm">
+              <CP color="light" className="mt-2 text-sm">
                 Total amount of storage (SSD, HDD, & RAM) on the grid.
-              </P>
+              </CP>
             </motion.div>
 
             <motion.div className="rounded-2xl bg-white/5 backdrop-blur-md border border-white/10 p-4 shadow-md">
               <CT color="light" className="uppercase tracking-wide">COUNTRIES</CT>
               <H2 color="light" className="mt-2 text-3xl font-bold">51</H2>
-              <P color="light" className="mt-2 text-sm">
+              <CP color="light" className="mt-2 text-sm">
                 Total number of countries with active nodes.
-              </P>
+              </CP>
             </motion.div>
           </div>
         </div>