diff --git a/apps/charterafrica/src/components/Tool/Contributors.js b/apps/charterafrica/src/components/Tool/Contributors.js
index 48f43ac9a..e88001762 100644
--- a/apps/charterafrica/src/components/Tool/Contributors.js
+++ b/apps/charterafrica/src/components/Tool/Contributors.js
@@ -12,7 +12,7 @@ const Contributors = React.forwardRef(function Contributors(props, ref) {
   return (
     <Box ref={ref} sx={sx}>
       <Box sx={{ p: 2 }}>
-        <RichTypography color="neutral.dark" variant="h4Small">
+        <RichTypography color="neutral.dark" variant="p3SemiBold">
           {title}
         </RichTypography>
         <AvatarGroup sx={{ justifyContent: { xs: "center", sm: "right" } }}>
diff --git a/apps/charterafrica/src/components/Tool/DescriptionAndShare.js b/apps/charterafrica/src/components/Tool/DescriptionAndShare.js
index 8cb6a76db..cd49706b6 100644
--- a/apps/charterafrica/src/components/Tool/DescriptionAndShare.js
+++ b/apps/charterafrica/src/components/Tool/DescriptionAndShare.js
@@ -7,7 +7,7 @@ import ShareThisPage from "@/charterafrica/components/ShareThisPage";
 
 const DescriptionAndShare = React.forwardRef(
   function DescriptionAndShare(props, ref) {
-    const { sx, description, lastActive } = props;
+    const { sx, description, lastActive, activeText } = props;
     return (
       <Box sx={sx} ref={ref}>
         <RichTypography
@@ -21,10 +21,14 @@ const DescriptionAndShare = React.forwardRef(
         <RichTypography
           textAlign="left"
           color="neutral.dark"
-          sx={{ mt: 3.75 }}
-          variant="p1"
+          sx={{
+            mt: 3.75,
+            textTransform: "none",
+            textAlign: { xs: "center", sm: "left" },
+          }}
+          variant="captionCap"
         >
-          {lastActive}
+          {activeText} {lastActive}
         </RichTypography>
         <Box
           display="flex"
diff --git a/apps/charterafrica/src/components/Tool/Metrics.js b/apps/charterafrica/src/components/Tool/Metrics.js
index ced7025eb..135117c6f 100644
--- a/apps/charterafrica/src/components/Tool/Metrics.js
+++ b/apps/charterafrica/src/components/Tool/Metrics.js
@@ -7,7 +7,6 @@ import CommitIcon from "@/charterafrica/assets/icons/Type=commit, Size=24, Color
 import ForksIcon from "@/charterafrica/assets/icons/Type=forks, Size=24, Color=CurrentColor.svg";
 import StarsIcon from "@/charterafrica/assets/icons/Type=stars, Size=24, Color=CurrentColor.svg";
 import ViewsIcon from "@/charterafrica/assets/icons/Type=views, Size=24, Color=CurrentColor.svg";
-import formatDateTime from "@/charterafrica/utils/formatDate";
 
 const Metrics = React.forwardRef(function Metrics(props, ref) {
   const {
@@ -23,7 +22,7 @@ const Metrics = React.forwardRef(function Metrics(props, ref) {
   } = props;
   return (
     <Box display="flex" sx={sx} ref={ref} flexWrap="wrap" alignItems="center">
-      <Box display="flex" alignItems="center" sx={{ mb: 2, ml: 2 }}>
+      <Box display="flex" alignItems="center" sx={{ mb: 2, mr: 2 }}>
         <SvgIcon
           inheritViewBox
           component={ViewsIcon}
@@ -56,11 +55,7 @@ const Metrics = React.forwardRef(function Metrics(props, ref) {
         />
         <Box sx={{ ml: 1 }}>
           <RichTypography color="neutral.dark">
-            {lastCommit.committedDate
-              ? formatDateTime(lastCommit.committedDate, {
-                  includeTime: false,
-                })
-              : "-"}
+            {lastCommit.committedDate || "-"}
           </RichTypography>
           <RichTypography color="neutral.dark">{commitText}</RichTypography>
         </Box>
diff --git a/apps/charterafrica/src/components/Tool/OrgThemeAndOperatingCountries.js b/apps/charterafrica/src/components/Tool/OrgThemeAndOperatingCountries.js
index 4e9b3a2a2..93734db76 100644
--- a/apps/charterafrica/src/components/Tool/OrgThemeAndOperatingCountries.js
+++ b/apps/charterafrica/src/components/Tool/OrgThemeAndOperatingCountries.js
@@ -13,34 +13,70 @@ const OrgThemeAndOperatingCountries = React.forwardRef(
     }
     return (
       <Box sx={sx} ref={ref}>
-        <Figure
-          ImageProps={{
-            alt: organisation.name,
-            src: organisation.avatarUrl,
+        <Box
+          display="flex"
+          sx={{
+            justifyContent: {
+              xs: "center",
+              sm: "left",
+              display: "flex",
+            },
           }}
+        >
+          <Figure
+            ImageProps={{
+              alt: organisation.name,
+              src: organisation.avatarUrl,
+            }}
+            sx={{
+              height: 50,
+              width: 150,
+            }}
+          />
+        </Box>
+        <Box
+          display="flex"
           sx={{
-            height: 50,
-            width: "auto",
+            justifyContent: {
+              xs: "center",
+              sm: "left",
+              display: "flex",
+            },
           }}
-        />
-        <Link
-          href={organisation?.link?.href || "#"}
-          textAlign="left"
-          color="neutral.dark"
-          sx={{ textDecoration: "none" }}
-          variant="h3Small"
         >
-          {organisation.name}
-        </Link>
-        {theme ? (
-          <Button
-            variant="contained"
-            component="div"
-            sx={{ backgroundColor: "success.main", color: "neutral.dark" }}
+          <Link
+            href={organisation?.link?.href || "#"}
+            textAlign="left"
+            color="neutral.dark"
+            sx={{ textDecoration: "none", fontWeight: 400 }}
+            variant="h4"
           >
-            {theme}
-          </Button>
-        ) : null}
+            {organisation.name}
+          </Link>
+        </Box>
+        <Box
+          sx={{
+            justifyContent: {
+              xs: "center",
+              sm: "left",
+              display: "flex",
+            },
+          }}
+        >
+          {theme ? (
+            <Button
+              variant="contained"
+              component="div"
+              sx={{
+                backgroundColor: "success.main",
+                color: "neutral.dark",
+                mt: 3.75,
+              }}
+            >
+              {theme}
+            </Button>
+          ) : null}
+        </Box>
         <RichTypography color="neutral.dark" variant="p3" sx={{ mt: 3.75 }}>
           {countries}
         </RichTypography>
diff --git a/apps/charterafrica/src/components/Tool/Partners.js b/apps/charterafrica/src/components/Tool/Partners.js
index 78addc654..40942eaec 100644
--- a/apps/charterafrica/src/components/Tool/Partners.js
+++ b/apps/charterafrica/src/components/Tool/Partners.js
@@ -14,7 +14,7 @@ const Partners = React.forwardRef(function Partners(props, ref) {
   return (
     <Box sx={sx} ref={ref}>
       <Box sx={{ p: 2 }}>
-        <RichTypography color="neutral.dark" variant="h4Small">
+        <RichTypography color="neutral.dark" variant="p3SemiBold">
           {title}
         </RichTypography>
         <Box
diff --git a/apps/charterafrica/src/components/Tool/TechSkills.js b/apps/charterafrica/src/components/Tool/TechSkills.js
index 3cc76d662..89f27a500 100644
--- a/apps/charterafrica/src/components/Tool/TechSkills.js
+++ b/apps/charterafrica/src/components/Tool/TechSkills.js
@@ -10,7 +10,7 @@ const TechSkills = React.forwardRef(function TechSkills(props, ref) {
   }
   return (
     <Box sx={sx} ref={ref}>
-      <RichTypography variant="p3" color="neutral.dark">
+      <RichTypography variant="p3SemiBold" color="neutral.dark">
         {title}
       </RichTypography>
       <br />
diff --git a/apps/charterafrica/src/components/Tool/Tool.js b/apps/charterafrica/src/components/Tool/Tool.js
index 8efebe559..df1bb532d 100644
--- a/apps/charterafrica/src/components/Tool/Tool.js
+++ b/apps/charterafrica/src/components/Tool/Tool.js
@@ -6,6 +6,7 @@ import React from "react";
 
 import ExternalLink from "@/charterafrica/assets/icons/Type=external-link, Size=24, Color=CurrentColor.svg";
 import GithubIcon from "@/charterafrica/assets/icons/Type=github, Size=24, Color=CurrentColor.svg";
+import LineClampedRichTypography from "@/charterafrica/components/LineClampedRichTypography";
 import Contributors from "@/charterafrica/components/Tool/Contributors";
 import DescriptionAndShare from "@/charterafrica/components/Tool/DescriptionAndShare";
 import Metrics from "@/charterafrica/components/Tool/Metrics";
@@ -22,7 +23,7 @@ const Tool = React.forwardRef(function Tool(props, ref) {
     theme,
     operatingCountries,
     description,
-    lastCommit,
+    lastActive,
     goToRepo,
     techSkills,
     contributors,
@@ -35,12 +36,14 @@ const Tool = React.forwardRef(function Tool(props, ref) {
     toolsTitle,
     externalLink,
     classification,
+    activeText,
+    collectionText,
   } = props;
   return (
     <Box bgcolor="common.white" ref={ref}>
       <Section sx={{ pb: { xs: 10 } }}>
         <Grid sx={{ py: { sm: 10 } }} container ref={ref}>
-          <Grid container item sm={6} sx={{ pr: { sm: 6.25 } }}>
+          <Grid container item sm={7} sx={{ pr: { sm: 6.25 } }}>
             <Grid item>
               <CardMedia
                 component="img"
@@ -52,7 +55,7 @@ const Tool = React.forwardRef(function Tool(props, ref) {
                 }}
               />
             </Grid>
-            <Grid xs={12} item>
+            <Grid sx={{ px: { xs: 2, sm: 0 } }} xs={12} item>
               <Box
                 sx={{ width: "100%", mt: 3.75 }}
                 display="flex"
@@ -60,9 +63,12 @@ const Tool = React.forwardRef(function Tool(props, ref) {
                 alignItems="center"
                 flex={1}
               >
-                <RichTypography color="neutral.dark" variant="h2SemiBold">
+                <LineClampedRichTypography
+                  color="neutral.dark"
+                  variant="h2SemiBold"
+                >
                   {name}
-                </RichTypography>
+                </LineClampedRichTypography>
                 {externalLink?.href ? (
                   <Link href={externalLink.href}>
                     <SvgIcon
@@ -79,7 +85,7 @@ const Tool = React.forwardRef(function Tool(props, ref) {
                 ) : null}
               </Box>
             </Grid>
-            <Grid item>
+            <Grid sx={{ px: { xs: 2, sm: 0 } }} item>
               <OrgThemeAndOperatingCountries
                 sx={{ mt: 3.75, textAlign: "left" }}
                 organisation={organisation}
@@ -92,7 +98,8 @@ const Tool = React.forwardRef(function Tool(props, ref) {
               />
               <DescriptionAndShare
                 description={description}
-                lastActive={lastCommit?.committedDate}
+                lastActive={lastActive}
+                activeText={activeText}
                 sx={{ mb: 6.75 }}
               />
             </Grid>
@@ -100,16 +107,19 @@ const Tool = React.forwardRef(function Tool(props, ref) {
           <Grid
             item
             xs={12}
-            sm={6}
+            sm={5}
             sx={() => ({
               borderLeft: `1px solid rgba(0, 0, 0, 0.1)`,
               textAlign: { sm: "right", xs: "center" },
-              pl: { sm: 6.25 },
+              px: { sm: 6.25, xs: 2 },
             })}
           >
             <Box
               ref={ref}
-              sx={{ width: { xs: "100%", sm: "fit-content" }, ml: "auto" }}
+              sx={{
+                width: { xs: "100%", sm: "fit-content" },
+                ml: "auto",
+              }}
             >
               <Button
                 component={goToRepo?.href ? Link : undefined}
@@ -142,8 +152,8 @@ const Tool = React.forwardRef(function Tool(props, ref) {
               sx={{ mt: 3.75 }}
             />
             <Box sx={{ mt: 3.75 }}>
-              <RichTypography variant="p3" color="neutral.dark">
-                Collection
+              <RichTypography variant="p3SemiBold" color="neutral.dark">
+                {collectionText}
               </RichTypography>
               <RichTypography sx={{ mt: 1 }} variant="p3">
                 {classification}
diff --git a/apps/charterafrica/src/components/Tool/Tool.snap.js b/apps/charterafrica/src/components/Tool/Tool.snap.js
index d65a87180..9a22618a0 100644
--- a/apps/charterafrica/src/components/Tool/Tool.snap.js
+++ b/apps/charterafrica/src/components/Tool/Tool.snap.js
@@ -12,7 +12,7 @@ exports[`<Tool /> renders unchanged 1`] = `
         class="MuiGrid-root MuiGrid-container css-xgaee2-MuiGrid-root"
       >
         <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-sm-6 css-1gxhccb-MuiGrid-root"
+          class="MuiGrid-root MuiGrid-container MuiGrid-item MuiGrid-grid-sm-7 css-kt7nt3-MuiGrid-root"
         >
           <div
             class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
@@ -24,26 +24,26 @@ exports[`<Tool /> renders unchanged 1`] = `
             />
           </div>
           <div
-            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 css-18qart5-MuiGrid-root"
+            class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 css-rwq5je-MuiGrid-root"
           >
             <div
               class="MuiBox-root css-kpcj8u"
             >
               <div
-                class="MuiTypography-root MuiTypography-h2SemiBold css-lknjzb-MuiTypography-root"
+                class="MuiTypography-root MuiTypography-h2SemiBold css-gegt74-MuiTypography-root"
               >
                 Tool Name
               </div>
             </div>
           </div>
           <div
-            class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
+            class="MuiGrid-root MuiGrid-item css-2yidix-MuiGrid-root"
           >
             <div
               class="MuiBox-root css-1bzzis0"
             >
               <div
-                class="MuiBox-root css-33u6ly"
+                class="MuiBox-root css-c7rfuk"
               >
                 <div
                   aria-hidden="true"
@@ -123,6 +123,12 @@ exports[`<Tool /> renders unchanged 1`] = `
               >
                 Lorem ipsum dolor sit amet consectetur adipiscing elit gravida, urna enim nulla iaculis taciti semper parturient laoreet luctus, orci ac ornare senectus posuere nam libero. Imperdiet turpis tortor nu. Lorem ipsum dolor sit amet consectetur adipiscing elit gravida, urna enim nulla iaculis taciti semper parturient laoreet luctus, orci ac ornare senectus posuere nam libero. Imperdiet turpis tortor nu.
               </div>
+              <div
+                class="MuiTypography-root MuiTypography-captionCap css-hr3rav-MuiTypography-root"
+              >
+                 
+                6 Months ago
+              </div>
               <div
                 class="MuiBox-root css-oqyb22"
               >
@@ -180,7 +186,7 @@ exports[`<Tool /> renders unchanged 1`] = `
           </div>
         </div>
         <div
-          class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-6 css-17qpvru-MuiGrid-root"
+          class="MuiGrid-root MuiGrid-item MuiGrid-grid-xs-12 MuiGrid-grid-sm-5 css-8zm4nk-MuiGrid-root"
         >
           <div
             class="MuiBox-root css-11uk14q"
@@ -203,13 +209,7 @@ exports[`<Tool /> renders unchanged 1`] = `
           </div>
           <div
             class="MuiBox-root css-46b038"
-          >
-            <div
-              class="MuiTypography-root MuiTypography-p3 css-1lspiuz-MuiTypography-root"
-            >
-              Collection
-            </div>
-          </div>
+          />
           <div
             class="MuiBox-root css-46b038"
           >
@@ -217,7 +217,7 @@ exports[`<Tool /> renders unchanged 1`] = `
               class="MuiBox-root css-19midj6"
             >
               <div
-                class="MuiTypography-root MuiTypography-h4Small css-4noust-MuiTypography-root"
+                class="MuiTypography-root MuiTypography-p3SemiBold css-3w2o4y-MuiTypography-root"
               >
                 Contributors
               </div>
diff --git a/apps/charterafrica/src/lib/data/common/processPageTools.js b/apps/charterafrica/src/lib/data/common/processPageTools.js
index c665ef92f..f4653f4c0 100644
--- a/apps/charterafrica/src/lib/data/common/processPageTools.js
+++ b/apps/charterafrica/src/lib/data/common/processPageTools.js
@@ -91,8 +91,8 @@ async function processPageSingleTool(page, api, context) {
         toolsTitle: filterLabels.tools,
         donorsTitle: filterLabels.donors,
         contributorsTitle: filterLabels.contributors,
-        lastActive: tool.lastActive
-          ? formatDateTime(tool.lastActive, {})
+        lastActive: tool.lastCommit?.committedDate
+          ? formatDateTime(tool.lastCommit.committedDate, { locale })
           : null,
         organisationName: tool.organisation?.name ?? null,
         twitter: tool.organisation?.twitter ?? null,
@@ -108,10 +108,18 @@ async function processPageSingleTool(page, api, context) {
         commitText: filterLabels.lastCommit,
         forksText: filterLabels.forks,
         starsText: filterLabels.stars,
+        collectionText: filterLabels.collection,
+        activeText: filterLabels.activeText,
         collection: tool.classification,
         externalLink: {
           href: tool.docLink ?? null,
         },
+        lastCommit: {
+          ...tool.lastCommit,
+          committedDate: tool.lastCommit?.committedDate
+            ? formatDateTime(tool.lastCommit.committedDate, { locale })
+            : null,
+        },
       },
     ],
   };
diff --git a/apps/charterafrica/src/utils/translationConstants.js b/apps/charterafrica/src/utils/translationConstants.js
index f4e5b7b4a..d1f8f7000 100644
--- a/apps/charterafrica/src/utils/translationConstants.js
+++ b/apps/charterafrica/src/utils/translationConstants.js
@@ -1,5 +1,6 @@
 const labelsPerLocale = {
   en: {
+    activeText: "Last Active",
     topic: "Topic A-Z",
     "-topic": "Topic Z-A",
     views: "Views Ascending",
@@ -34,6 +35,7 @@ const labelsPerLocale = {
     classification: "Classification",
   },
   fr: {
+    activeText: "Dernier actif",
     topic: "Sujet A-Z",
     "-topic": "Sujet Z-A",
     views: "Vues ascendantes",
@@ -68,6 +70,7 @@ const labelsPerLocale = {
     classification: "Classification",
   },
   pt: {
+    activeText: "ativo pela última vez",
     topic: "Tópico A-Z",
     "-topic": "Tópico Z-A",
     views: "Visualizações ascendentes",