Fixed Titles

public/locales/common/en.json

@@ -20,7 +20,7 @@
     "heading": {
       "part1": "Unlock The Full ",
       "part2": "Potential",
-      "part3": "Of Your Business"
+      "part3": "Of Your Business!"
     },
     "cards": {
       "marketing": {

public/locales/common/pt.json

@@ -20,7 +20,7 @@
     "heading": {
       "part1": "Desbloqueia Todo O ",
       "part2": "Potencial",
-      "part3": "Do Teu Negócio"
+      "part3": "Do Teu Negócio!"
     },
     "cards": {
       "marketing": {

src/Components/Card.tsx

@@ -13,7 +13,7 @@ const Card = ({ title, description, image }: IProps) => {
       <div className="w-full font-medium flex-col md:px-4 py-1 bg-gradient-to-br from-custom-bglight to-custom-bgdark">
         <object type="image/svg+xml" data={image} className={imgClasses} aria-label={title}></object>
         <h1 className="mt-2 lg:mt-6 text-3xl xl:text-5xl">{title}</h1>
-        <h2 className="px-2 mb-2 mt-3 italic text-xl xl:text-3xl font-medium text-gray-300">
+        <h2 className="results-card-content">
           {description.split("\n").map((line, i) => (
             <span key={i}>
               {line}

src/index.css

@@ -50,19 +50,15 @@ body {
 }
 
 .results-card-content {
-  @apply mb-2 mt-3 italic text-xl xl:text-3xl font-medium text-gray-300;
-}
-
-.results-card-content-pt {
   @apply mb-2 mt-3 italic text-lg xl:text-2xl font-medium text-gray-300;
 }
 
 .footer-text {
-  @apply text-gray-400 font-medium
+  @apply text-gray-400 font-medium text-xs md:text-base
 }
 
 .footer-text-pt {
-  @apply text-gray-400 font-medium text-xs
+  @apply text-gray-400 font-medium text-xs md:text-base
 }
 
 @keyframes fadeEffect {