Remove glow shadow, update hero text

Author: davidmoltin

src/components/homepage/CTA.tsx

@@ -3,10 +3,10 @@ import React from "react";
 export default function CTA() {
   return (
     <div className="p-12 md:p-24 text-center dark:bg-black/40 bg-[#A6EBCA]/20 backdrop-blur">
-      <h2 className="font-manrope dark:text-white tracking-tight font-semibold text-[3rem]">
+      <h2 className="font-manrope dark:text-white tracking-tight font-semibold text-[3rem] mb-10">
         Get started now!
       </h2>
-      <a href="https://useast.cm.elasticpath.com/free-trial" className="dark:!bg-[#1FEC90] !bg-black dark:shadow-[0px_0px_28px_0px_#1FEC90] text-lg py-1.5 px-6 dark:text-black text-white border-0 font-semibold bg-transparent !rounded-full transition-all duration-500 hover:!bg-[#61DEA6] hover:dark:!bg-transparent hover:dark:!text-white hover:dark:ring-2 hover:dark:ring-[#1FEC90] hover:!text-black hover:!no-underline">
+      <a href="https://useast.cm.elasticpath.com/free-trial" className="dark:!bg-[#1FEC90] !bg-black text-lg py-4 px-6 dark:text-black text-white border-0 font-semibold bg-transparent !rounded-full transition-all duration-500 hover:!bg-[#61DEA6] hover:dark:!bg-transparent hover:dark:!text-white hover:dark:ring-2 hover:dark:ring-[#1FEC90] hover:!text-black hover:!no-underline">
         Start Free Trial
       </a>
     </div>

src/components/homepage/CommerceApps/CommerceApps.tsx

@@ -14,7 +14,7 @@ const Trigger = ({ name }: { name: string }) => {
   return (
     <TabsTrigger
       value={name}
-      className="data-[state='active']:dark:bg-[#1FEC90] data-[state='active']:bg-[#61DEA6] data-[state='active']:shadow-lg dark:data-[state='active']:shadow-[0px_0px_28px_0px_#1FEC90] data-[state='active']:text-black border-0 bg-transparent !rounded-full transition-all duration-500 text-xl py-1 px-6"
+      className="data-[state='active']:dark:bg-[#1FEC90] data-[state='active']:bg-[#61DEA6] data-[state='active']:text-black border-0 bg-transparent !rounded-full transition-all duration-500 text-xl py-1 px-6"
     >
       {name}
     </TabsTrigger>
@@ -62,6 +62,7 @@ function Tab({
         <div className="flex text-black gap-8 mt-8">
           <a
             href={linkItems[0]}
+            target="_blank"
             className="bg-transparent tracking-tight rounded-full ring-2 ring-gray-300 py-3 px-8 hover:ring-green-500 transition-all text-black border-0 text-base font-semibold hover:no-underline"
           >
             Watch Demo
@@ -121,7 +122,7 @@ export default function CommerceApps() {
       />
 
       <div className="flex flex-col items-center justify-between dark:text-white">
-        <h2 className="mb-14 text-4xl md:text-[4rem] font-semibold tracking-tight dark:drop-shadow-md">
+        <h2 className="mb-14 text-4xl md:text-[4rem] font-semibold tracking-tight">
           Elastic Path Composable Commerce
         </h2>
         <Tabs defaultValue="Merchandise">
@@ -150,8 +151,7 @@ export default function CommerceApps() {
                 "Improve Customer Experience",
               ]}
               linkItems={[
-                "https://www.elasticpath.com/demo-library",
-                "/docs/api/pxm/products/products",
+                "https://www.elasticpath.com/demo-library?feedStatic33365=filter191470-%3Emerchandisers.89457",
               ]}
             />
 

src/components/homepage/CommerceApps/CommerceAppsMobile.tsx

@@ -37,7 +37,7 @@ function Tab({
     <BrowserOnly>
       {() => (
         <div className="relative w-full">
-          <div className="dark:bg-white/20 bg-white mx-auto p-6 my-2 rounded-lg shadow-lg hover:shadow-xl dark:ring-0 ring-1 ring-gray-200">
+          <div className="dark:bg-white/20 bg-white mx-auto p-6 my-2 rounded-lg dark:ring-0 ring-1 ring-gray-200">
             <div
               className="dark:text-white text-black flex items-center text-left"
               onClick={toggleOpen}
@@ -85,6 +85,7 @@ function Tab({
                 <div className="flex gap-4 mt-8 justify-center">
                   <a
                     href={linkItems[0]}
+                    target="_blank"
                     className="bg-transparent tracking-tight rounded-full ring-2 ring-gray-300 py-1.5 px-4 hover:ring-green-500 transition-all dark:text-white/90 text-black border-0 text-sm font-semibold hover:no-underline"
                   >
                     Watch a demo
@@ -109,7 +110,7 @@ export default function CommerceAppsMobile() {
   return (
     <section className="px-6 py-6 mx-auto w-full text-center leading-tight tracking-tight">
       <div className="flex flex-col items-center justify-between dark:text-white">
-        <h2 className="mb-8 text-5xl md:text-[4rem] font-semibold tracking-tight dark:drop-shadow-md">
+        <h2 className="mb-8 text-5xl md:text-[4rem] font-semibold tracking-tight">
           Elastic Path Composable Commerce
         </h2>
         <div className="flex flex-col my-6 w-full">

src/components/homepage/HeroSection.tsx

@@ -13,38 +13,39 @@ export default function HeroSection() {
         <div className="px-3 py-1 text-sm ring-1 ring-gray-300 dark:ring-white/50 rounded-3xl shadow-sm dark:shadow-[0px_0px_28px_0px_#0b3168]">
           <span className="mr-2">💡</span>
           <span className="text-black dark:text-white font-semibold mr-4 hidden md:inline">
-            Note from our CTO:
+            Start your free trial!
           </span>{" "}
           <a
             className="text-gray-600 hover:text-gray-600 dark:text-white dark:hover:text-white dark:hover:decoration-green-400 hover:decoration-green-600 hover:decoration-2 hover:decoration-dotted font-medium transition-all"
-            href="https://www.elasticpath.com/blog/modern-commerce-ipaas-dbaas"
+            href="https://useast.cm.elasticpath.com/free-trial"
+            target="_blank"
           >
-            Why an iPaaS brings world-class commerce to life →
+            Enjoy full access to the Elastic Path product family →
           </a>
         </div>
         <h1 className="mb-4 text-center text-[4.5rem] md:text-[5rem] font-bold dark:drop-shadow-lg dark:text-white bg-clip-text text-transparent bg-gradient-to-r from-[#394464] -from-3% via-[#1F8552] via-32% to-[#2BCC7E] to-64%">
           Build modern commerce experiences
         </h1>
         <p className="text-base text-center md:text-[1.75rem] leading-10 font-light max-w-5xl">
-          Launch faster, solve complex problems, and build world-class
-          experiences with our {" "}
+          Launch faster, tackle complex challenges, and create world-class
+          experiences with our powerful {" "}
           <a
-            href="#CommerceServices"
-            className="dark:text-white text-black font-bold decoration-2 underline decoration-green-500"
+            href="#APIs"
+            className="dark:text-white text-black font-bold decoration-4 underline underline-offset-8 decoration-green-500"
           >
-            e-Commerce Services
+            APIs{" "}
           </a>
-          ,{" "}
+          , {" "}
           <a
-            href="#APIs"
-            className="dark:text-white text-black font-bold decoration-2 underline decoration-green-500"
+            href="#CommerceServices"
+            className="dark:text-white text-black font-bold decoration-4 underline underline-offset-8 decoration-green-500"
           >
-            APIs{" "}
+            e-Commerce Services
           </a>
           , &{" "}
           <a
             href="#Tools"
-            className="dark:text-white text-black font-bold decoration-2 underline decoration-green-500"
+            className="dark:text-white text-black font-bold decoration-4 underline underline-offset-8 decoration-green-500"
           >
             tools for developers
           </a>

src/css/custom.css

@@ -523,7 +523,7 @@ html[data-theme="dark"]
 }
 
 .sections-menu-trigger:hover {
-  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
+
 }
 
 .sections-menu-trigger,
@@ -591,8 +591,6 @@ html[data-theme="dark"]
   background-color: var(--docs-color-background-100);
   border-radius: 6px;
   padding: 6px 0;
-
-  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.2);
 }
 
 .sections-menu-trigger.compact {