styling updates

app/components/shared/AppCallToAction.tsx

@@ -32,7 +32,7 @@ const AppCallToAction = ({ data }: { data: CtaData }) => {
             </span>
           ) : null}
           {ctaDescription ? (
-            <span className="text-sm block text-th-fgd-2">
+            <span className="text-sm block text-th-fgd-2 font-body">
               {ctaDescription}
             </span>
           ) : null}

app/components/shared/TableOfContents.tsx

@@ -57,6 +57,7 @@ const TableOfContents = ({
 
   return (
     <div className="mt-8 p-6 rounded-lg bg-th-bkg-2 space-y-2 h-max md:sticky md:top-8 md:w-64">
+      <h4>Contents</h4>
       <button
         className={`font-normal text-base text-left focus:outline-none ${
           activeSection === 0 ? 'text-th-active' : 'text-th-fgd-2'
@@ -68,7 +69,9 @@ const TableOfContents = ({
       {headingTwos.map((heading, index) => (
         <a
           className={`block ${
-            activeSection === index + 1 ? 'text-th-active' : 'text-th-fgd-2'
+            activeSection === index + 1
+              ? 'text-th-active'
+              : 'text-th-fgd-2 md:hover:text-th-fgd-4'
           }`}
           href={`#anchor-link-${index}`}
           key={heading}