tiny fix landing arrows

Author: clara7227

app/globals.css

@@ -541,8 +541,8 @@ main {
 .arrows::after {
   content: '';
   position: absolute;
-  width: 100%;
-  height: 100%;
+  width: 75%;
+  height: 75%;
   border-left: calc(var(--size) / 3) solid rgba(0, 0, 0, var(--peakopacity));
   border-bottom: calc(var(--size) / 3) solid rgba(0, 0, 0, var(--peakopacity));
   transform: rotate(-45deg);

components/core/Banner.jsx

@@ -29,7 +29,7 @@ Banner.displayName = "Banner";
 const BannerContent = React.forwardRef(({ className, ...props }, ref) => (
   <div
     ref={ref}
-    className={cn("h-fit py-12 px-8 xs:px-10 md:pl-20 xl:pl-40 w-full md:w-2/3 2xl:w-1/2 z-10 ", className)}
+    className={cn("h-fit pt-4 pb-12 md:pt-12 px-8 xs:px-10 md:pl-20 xl:pl-40 w-full md:w-2/3 2xl:w-1/2 z-10 ", className)}
     {...props}
   />
 ));
@@ -48,8 +48,8 @@ BannerLogo.displayName = "BannerLogo";
 
 const BannerTitle = React.forwardRef(({ className, ...props }, ref) => (
   // NO CAMBIAR H1 por Heading, está puesto así para SEO
-  <Heading level="h2"
-    className={cn("text-snow  mb-6 font-medium", className)}
+  <Heading level="h3"
+    className={cn("text-snow !mb-2 md:mb-6 font-medium", className)}
     {...props}
   />
 ));

components/ui/Heading.jsx

@@ -77,12 +77,12 @@ const Heading = ({ level = "h1", children, className = "" }) => {
   const sizeClasses = {
     h1: "text-36 sm:text-40 mb-6 font-medium",
     h2: "text-32 sm:text-36 mb-4 font-medium",
-    h3: "text-28 sm:text-32 mb-4 font-medium",
+    h3: "text-28 sm:text-32 mb-4 font-medium 3xl:text-40",
     h4: "text-24 sm:text-24 mb-2 font-medium",
     h5: "text-20 sm:text-20 mb-2 font-medium",
     h6: "text-base font-medium uppercase mb-2",
     "title-sm": "text-base sm:text-20 font-normal mb-2 leading-snug",
-    subtitle: "text-20 xl:text-24 mb-2 font-light max-w-[50ch] md:max-w-[70ch] 2xl:max-w-[75ch]",
+    subtitle: "text-20 md:text-16 2xl:text-24 mb-2 font-light max-w-[50ch] md:max-w-[70ch] 2xl:max-w-[75ch]",
   }[level] || "";
 
   return (