Gradient p

src/components/GlobeAppDemo.tsx

@@ -2,7 +2,7 @@ import React from "react";
 
 export default function GlobeAppDemo() {
   return (
-    <div className="text-black md:mt-20">
+    <div className="text-black md:mt-14">
       <div>
         <img src={"/images/AppDemo.webp"} alt="Preview of TrustAuthX app" />
       </div>

src/components/GlobeCanvas.tsx

@@ -37,11 +37,11 @@ export function GlobeCanvas({ children }: PropsWithChildren) {
         devicePixelRatio: 2,
         width: width * 2,
         height: width,
-        scale: 0.9,
+        scale: 0.85,
         phi: 0,
         theta: 0.2,
         dark: 1.1,
-        offset: [2100.66, 1800.0],
+        offset: [2100.66, 2600.0],
         diffuse: 3,
         mapSamples: 16000,
         mapBrightness: 1.8,
@@ -82,7 +82,7 @@ export function GlobeCanvas({ children }: PropsWithChildren) {
     >
       {children}
       <div
-        className="absolute bg-black text-white md:top-[-30rem] "
+        className="absolute bg-black text-white md:top-[-43rem] "
         style={{
           width: "100%",
           aspectRatio: 1,

src/components/GradientPlatform.tsx

@@ -1,9 +1,6 @@
 import ArrowIcon from "./ArrowIcon";
 import AnimatedGradient from "./gradients/AnimatedGradient";
 import React from "react";
-import { useMediaQuery } from "@mantine/hooks";
-
-import Image from "next/image";
 import { GradientPlatformImage } from "./GradientPlatformImage";
 
 export default function GradientPlatform() {
@@ -39,7 +36,7 @@ export default function GradientPlatform() {
             <GradientPlatformImage />
           </div>
         </div>
-        <div className="md:hidden">
+        <div className="hidden md:block">
           <AnimatedGradient />{" "}
         </div>
       </div>

src/components/Landing.tsx

@@ -6,7 +6,7 @@ import GlobeAppDemo from "./GlobeAppDemo";
 export function Landing() {
   return (
     <GlobeCanvas>
-      <div className="absolute top-16 z-[900] md:top-20  ">
+      <div className=" absolute top-16 z-[900] md:top-20  ">
         <div className="flex flex-col gap-6 p-8 md:gap-10 md:p-20">
           <h1 className="text-left text-2xl font-extrabold leading-none text-white mix-blend-exclusion md:text-[4.3rem]">
             TrustAuthX <br />