diff --git a/frontend/components/analysis/ListView.vue b/frontend/components/analysis/ListView.vue
index bd4bd62..227375b 100644
--- a/frontend/components/analysis/ListView.vue
+++ b/frontend/components/analysis/ListView.vue
@@ -96,21 +96,21 @@ const deleteSelected = () => Promise.all([selectedRows.value.map((row) => delete
       :value="editorObjects"
       data-key="id"
       size="small"
-      sort-field="editorValues.value.createdAt.originalValue"
+      sort-field="currentValue.value.createdAt"
       :sort-order="-1"
     >
       <PVColumn selection-mode="multiple" />
       <PVColumn
-        field="editorValues.value.createdAt.originalValue"
+        field="currentValue.value.createdAt"
         :header="tt('Created At')"
         sortable
       >
         <template #body="slotProps">
-          {{ humanReadableTimeFromStandardString(slotProps.data.editorValues.value.createdAt.originalValue).value }}
+          {{ humanReadableTimeFromStandardString(slotProps.data.currentValue.value.createdAt).value }}
         </template>
       </PVColumn>
       <PVColumn
-        field="editorValues.value.name.originalValue"
+        field="currentValue.value.name"
         sortable
         :header="tt('Name')"
       />
diff --git a/frontend/components/incompleteupload/ListView.vue b/frontend/components/incompleteupload/ListView.vue
index 933029a..6c72995 100644
--- a/frontend/components/incompleteupload/ListView.vue
+++ b/frontend/components/incompleteupload/ListView.vue
@@ -83,22 +83,22 @@ const saveChanges = (id: string) => {
       data-key="id"
       class="w-full"
       size="small"
-      sort-field="editorValues.value.createdAt.originalValue"
+      sort-field="currentValue.value.createdAt"
       :sort-order="-1"
     >
       <PVColumn selection-mode="multiple" />
       <PVColumn
-        field="editorValues.value.name.originalValue"
+        field="currentValue.value.name"
         sortable
         :header="tt('Name')"
       />
       <PVColumn
-        field="editorValues.value.createdAt.originalValue"
+        field="currentValue.value.createdAt"
         :header="tt('Created At')"
         sortable
       >
         <template #body="slotProps">
-          {{ humanReadableTimeFromStandardString(slotProps.data.editorValues.value.createdAt.originalValue).value }}
+          {{ humanReadableTimeFromStandardString(slotProps.data.currentValue.value.createdAt).value }}
         </template>
       </PVColumn>
       <PVColumn
@@ -115,7 +115,7 @@ const saveChanges = (id: string) => {
           <div class="flex flex-column gap-2 w-fit">
             <div class="flex gap-2 justify-content-between">
               <span>Created At</span>
-              <b>{{ humanReadableTimeFromStandardString(slotProps.data.editorValues.value.createdAt.originalValue).value }}</b>
+              <b>{{ humanReadableTimeFromStandardString(slotProps.data.currentValue.value.createdAt).value }}</b>
             </div>
           </div>
           <!-- TODO(grady) add failure information here. -->
diff --git a/frontend/components/portfolio/ListView.vue b/frontend/components/portfolio/ListView.vue
index a3d24b0..0a88347 100644
--- a/frontend/components/portfolio/ListView.vue
+++ b/frontend/components/portfolio/ListView.vue
@@ -116,7 +116,7 @@ const deleteSelected = () => Promise.all([selectedRows.value.map((row) => delete
       :value="editorObjects"
       data-key="id"
       size="small"
-      sort-field="editorValues.value.createdAt.originalValue"
+      sort-field="currentValue.value.createdAt"
       :sort-order="-1"
     >
       <template #empty>
@@ -126,16 +126,16 @@ const deleteSelected = () => Promise.all([selectedRows.value.map((row) => delete
       </template>
       <PVColumn selection-mode="multiple" />
       <PVColumn
-        field="editorValues.value.createdAt.originalValue"
+        field="currentValue.value.createdAt"
         :header="tt('Created At')"
         sortable
       >
         <template #body="slotProps">
-          {{ humanReadableTimeFromStandardString(slotProps.data.editorValues.value.createdAt.originalValue).value }}
+          {{ humanReadableTimeFromStandardString(slotProps.data.currentValue.value.createdAt).value }}
         </template>
       </PVColumn>
       <PVColumn
-        field="editorValues.value.name.originalValue"
+        field="currentValue.value.name"
         sortable
         :header="tt('Name')"
       />
@@ -145,12 +145,12 @@ const deleteSelected = () => Promise.all([selectedRows.value.map((row) => delete
         <template #body="slotProps">
           <div class="flex flex-column gap-2">
             <div
-              v-if="slotProps.data.editorValues.value.groups.originalValue.length > 0"
+              v-if="slotProps.data.currentValue.value.groups.length > 0"
               class="flex gap-1 align-items-center flex-wrap"
             >
               <span>{{ tt('Groups') }}:</span>
               <LinkButton
-                v-for="membership in slotProps.data.editorValues.value.groups.originalValue"
+                v-for="membership in slotProps.data.currentValue.value.groups"
                 :key="membership.portfolioGroup.id"
                 class="p-button-outlined p-button-xs"
                 icon="pi pi-table"
@@ -159,12 +159,12 @@ const deleteSelected = () => Promise.all([selectedRows.value.map((row) => delete
               />
             </div>
             <div
-              v-if="slotProps.data.editorValues.value.initiatives.originalValue.length > 0"
+              v-if="slotProps.data.currentValue.value.initiatives.length > 0"
               class="flex gap-1 align-items-center flex-wrap"
             >
               <span>{{ tt('Initiatives') }}:</span>
               <LinkButton
-                v-for="membership in slotProps.data.editorValues.value.initiatives.originalValue"
+                v-for="membership in slotProps.data.currentValue.value.initiatives"
                 :key="membership.initiative.id"
                 class="p-button-xs"
                 :label="membership.initiative.name"
diff --git a/frontend/components/portfolio/group/ListView.vue b/frontend/components/portfolio/group/ListView.vue
index 7a00285..f2db465 100644
--- a/frontend/components/portfolio/group/ListView.vue
+++ b/frontend/components/portfolio/group/ListView.vue
@@ -74,7 +74,7 @@ const saveChanges = (id: string) => {
   )
 }
 const editorObjectToIds = (editorObject: EditorObject): string[] => {
-  return (editorObject.editorValues.value.members.originalValue ?? []).map((m: PortfolioGroupMembershipPortfolio) => m.portfolio.id)
+  return (editorObject.currentValue.value.members ?? []).map((m: PortfolioGroupMembershipPortfolio) => m.portfolio.id)
 }
 </script>
 
@@ -102,7 +102,7 @@ const editorObjectToIds = (editorObject: EditorObject): string[] => {
       data-key="id"
       class="w-full"
       size="small"
-      sort-field="editorValues.value.createdAt.originalValue"
+      sort-field="currentValue.value.createdAt"
       :sort-order="-1"
     >
       <template #empty>
@@ -112,17 +112,17 @@ const editorObjectToIds = (editorObject: EditorObject): string[] => {
       </template>
       <PVColumn selection-mode="multiple" />
       <PVColumn
-        field="editorValues.value.name.originalValue"
+        field="currentValue.value.name"
         sortable
         :header="tt('Name')"
       />
       <PVColumn
-        field="editorValues.value.createdAt.originalValue"
+        field="currentValue.value.createdAt"
         :header="tt('Created At')"
         sortable
       >
         <template #body="slotProps">
-          {{ humanReadableTimeFromStandardString(slotProps.data.editorValues.value.createdAt.originalValue).value }}
+          {{ humanReadableTimeFromStandardString(slotProps.data.currentValue.value.createdAt).value }}
         </template>
       </PVColumn>
       <PVColumn
diff --git a/frontend/components/standard/Nav.vue b/frontend/components/standard/Nav.vue
index 2ff6f3e..cb2d0e8 100644
--- a/frontend/components/standard/Nav.vue
+++ b/frontend/components/standard/Nav.vue
@@ -28,11 +28,15 @@ const menuStyles = computed(() => {
 
 const menuItems = computed(() => {
   const result: MenuItem[] = [
+    {
+      to: 'https://pacta.rmi.org',
+      external: true,
+      label: tt('About'),
+    },
     {
       to: localePath('/'),
       label: tt('Home'),
     },
-
   ]
   if (isAdmin.value) {
     result.push({
diff --git a/frontend/lang/en.json b/frontend/lang/en.json
index 3da0d13..47aebc6 100644
--- a/frontend/lang/en.json
+++ b/frontend/lang/en.json
@@ -24,7 +24,7 @@
     "Metadata": "Metadata",
     "Number of Rows": "Number of Rows",
     "Save Changes": "Save Changes",
-    "Refresh": "Refresh",
+    "Refresh": "Refresh"
   },
   "components/analysis/ListView": {
     "Created At": "Created At",
@@ -239,7 +239,8 @@
   },
   "components/standard/Nav": {
     "Admin": "Admin",
-    "Home": "Home",
+    "About": "About PACTA", 
+    "Home": "Portfolio Analysis Tool",
     "My Data": "My Data",
     "Sign In": "Sign In",
     "Sign Out": "Sign Out"
@@ -402,5 +403,23 @@
     "Secondary Target ID": "Secondary Target ID",
     "Secondary Target Owner": "Secondary Target Owner",
     "Secondary Target Type": "Secondary Target Type"
+  },
+  "pages/index": {
+    "Heading": "PACTA for Investors",
+    "Subheading": "Measure the alignment of financial portfolios with climate scenarios",
+    "Description": "The Paris Agreement Capital Transition Assessment (PACTA) is an open-source and free of charge online software platform that enables users to measure the alignment of financial portfolios with climate scenarios as well as analyze specific companies.",
+    "Section1Heading": "How PACTA Works",
+    "Section1Paragraph1": "PACTA compares what needs to happen in climate-relevant sectors in order to minimize global temperature rises with financial institutions' exposure to companies in these sectors. It uses a dynamic, forward-looking approach, based on the 5-year production plans of companies in a financial institution's portfolio.",
+    "Section1Paragraph2": "The methodology measures alignment per sector or per technology, ensuring sector specific needs are included. For example, some sectors need to move more quickly than others; some need to reform (such as power generation); and others need to phase out (for instance, fossil fuels).",
+    "Section2Heading": "Portfolio Analysis Tool",
+    "Section2Paragraph1": "The PACTA tool to analyze listed equity and corporate bond portfolios was relaunched in March 2021 with a new interactive format. For the first time, investors can now analyze multiple portfolios simultaneously, save their results online, and receive interactive results on their alignment with the Paris climate goals.",
+    "Section2Paragraph2": "The tool is free to use, and requires a csv file including the ISIN, value and currency of the investment to run the analysis. For more information on how to format your portfolios for analysis, please see the Input User Guide.",
+    "Input User Guide": "Input User Guide",
+    "Section2Paragraph3": "All uploaded data and results are only visible to the user that uploaded them, and strict audit logs are maintained for your piece of mind. Portfolios can be deleted from the platform at any time by the user that uploaded them.",
+    "Sign In": "Sign In or Create an Account to Access the Tool",
+    "Get Started": "Get Started, Upload Portfolio(s)",
+    "Section4Heading": "About This Tool",
+    "Section4Paragraph1": "PACTA was originally developed by 2° Investing Initiative (2DII) with backing from UN Principles for Responsible Investment. In June 2022, 2DII transferred stewardship of PACTA to RMI, formerly Rocky Mountain Institute. In 2024, the PACTA for Investors tool was modernized by Silicon Ally, a software development non-profit. The code for this tool, as well as the analysis code for PACTA is open source.",
+    "Section4CTA": "Learn More About PACTA"
   }
 }
diff --git a/frontend/pages/incomplete-uploads.vue b/frontend/pages/incomplete-uploads.vue
index fe3f572..bea71eb 100644
--- a/frontend/pages/incomplete-uploads.vue
+++ b/frontend/pages/incomplete-uploads.vue
@@ -72,16 +72,16 @@ const deleteAll = () => withLoading(
       class="incomplete-upload-table"
     >
       <PVColumn
-        field="editorValues.value.createdAt.originalValue"
+        field="currentValue.value.createdAt"
         header="Created At"
         sortable
       >
         <template #body="slotProps">
-          {{ humanReadableTimeFromStandardString(slotProps.data.editorValues.value.createdAt.originalValue).value }}
+          {{ humanReadableTimeFromStandardString(slotProps.data.currentValue.value.createdAt).value }}
         </template>
       </PVColumn>
       <PVColumn
-        field="editorValues.value.name.originalValue"
+        field="currentValue.value.name"
         sortable
         header="Name"
       />
@@ -99,23 +99,23 @@ const deleteAll = () => withLoading(
           <div class="flex flex-column gap-2 w-fit">
             <div class="flex gap-2 justify-content-between">
               <span>Created At</span>
-              <b>{{ humanReadableTimeFromStandardString(slotProps.data.editorValues.value.createdAt.originalValue).value }}</b>
+              <b>{{ humanReadableTimeFromStandardString(slotProps.data.currentValue.value.createdAt).value }}</b>
             </div>
             <div class="flex gap-2 justify-content-between">
               <span>Ran At</span>
-              <b>{{ slotProps.data.editorValues.value.ranAt.originalValue ? humanReadableTimeFromStandardString(slotProps.data.editorValues.value.ranAt.originalValue).value : 'N/A' }}</b>
+              <b>{{ slotProps.data.currentValue.value.ranAt ? humanReadableTimeFromStandardString(slotProps.data.currentValue.value.ranAt).value : 'N/A' }}</b>
             </div>
             <div class="flex gap-2 justify-content-between">
               <span>Completed At</span>
-              <b>{{ slotProps.data.editorValues.value.completedAt.originalValue ? humanReadableTimeFromStandardString(slotProps.data.editorValues.value.completedAt.originalValue).value : 'N/A' }}</b>
+              <b>{{ slotProps.data.currentValue.value.completedAt ? humanReadableTimeFromStandardString(slotProps.data.currentValue.value.completedAt).value : 'N/A' }}</b>
             </div>
             <div class="flex gap-2 justify-content-between">
               <span>Failure Code</span>
-              <b>{{ slotProps.data.editorValues.value.failureCode.originalValue ?? 'N/A' }}</b>
+              <b>{{ slotProps.data.currentValue.value.failureCode ?? 'N/A' }}</b>
             </div>
             <div class="flex gap-2 justify-content-between">
               <span>Failure Message</span>
-              <b>{{ slotProps.data.editorValues.value.failureMessage.originalValue ?? 'N/A' }}</b>
+              <b>{{ slotProps.data.currentValue.value.failureMessage ?? 'N/A' }}</b>
             </div>
             <div class="flex gap-2 justify-content-between">
               <span>ID</span>
diff --git a/frontend/pages/index.vue b/frontend/pages/index.vue
index 8e3bc16..c46a1de 100644
--- a/frontend/pages/index.vue
+++ b/frontend/pages/index.vue
@@ -1,40 +1,100 @@
 <script setup lang="ts">
 const isAuthenticated = useIsAuthenticated()
-const { $msal: { signOut } } = useNuxtApp()
 const { signIn } = useSignIn()
+const { t } = useI18n()
+const localePath = useLocalePath()
+
+const tt = (s: string) => t(`pages/index.${s}`)
+
 </script>
 
 <template>
   <StandardContent>
-    <TitleBar title="RMI PACTA" />
-    <p>
-      TODO(#80) This will eventually be the site for RMI's PACTA, but now it's mostly just a placeholder.
-    </p>
-    <p>
-      This project is open source. You can view the code at <a href="https://github.com/RMI-PACTA/app">github.com/RMI-PACTA/app</a>.
-    </p>
-
-    <PVButton
-      v-if="!isAuthenticated"
-      label="Sign In"
-      icon="pi pi-sign-in"
-      icon-pos="right"
-      @click="signIn"
-    />
-    <template v-else>
-      <LinkButton
-        label="Get Started"
-        icon="pi pi-arrow-right"
-        icon-pos="right"
-        to="/upload"
-      />
-      <PVButton
-        class="p-button-outlined"
-        label="Sign Out"
-        icon="pi pi-sign-out"
-        icon-pos="right"
-        @click="signOut"
-      />
-    </template>
+    <div class="border-round p-3">
+      <h1 class="text-5xl mt-0 mb-2 ">
+        {{ tt('Heading') }}
+      </h1>
+      <div class="text-2xl mt-0 mb-4">
+        {{ tt('Subheading') }}
+      </div>
+      <p class="">
+        {{ tt('Description') }}
+      </p>
+    </div>
+    <div class="flex gap-3 flex-wrap">
+      <div class="border-primary border-2 border-round p-3 flex flex-column gap-3 flex-1">
+        <h2 class="m-0">
+          {{ tt('Section1Heading') }}
+        </h2>
+        <p>{{ tt('Section1Paragraph1') }}</p>
+        <p>{{ tt('Section1Paragraph2') }}</p>
+      </div>
+      <div
+        class="w-12 md:w-6 xl:w-5 flex p-2 border-2 border-round align-items-center justify-content-center"
+      >
+        <PVImage
+          preview
+          src="/img/how-it-works.jpg"
+          :pt="{
+            root: {
+              'class': 'max-w-full',
+            },
+            image : {
+              'class': 'max-w-full',
+            }
+          }"
+        />
+      </div>
+    </div>
+    <div class="flex gap-3 flex-column p-3">
+      <h2 class="m-0">
+        {{ tt('Section2Heading') }}
+      </h2>
+      <p>{{ tt('Section2Paragraph1') }}</p>
+      <p>
+        {{ tt('Section2Paragraph2') }}
+        <LinkButton
+          :to="localePath('/input-user-guide')"
+          class="p-button-xs align-self-center py-0 ml-2 p-button-outlined"
+          :label="tt('Input User Guide')"
+          icon="pi pi-arrow-right"
+          icon-pos="right"
+        />
+      </p>
+      <p>{{ tt('Section2Paragraph3') }}</p>
+      <div class="flex justify-content-center mt-2">
+        <PVButton
+          v-if="!isAuthenticated"
+          :label="tt('Sign In')"
+          icon="pi pi-sign-in"
+          icon-pos="right"
+          class="max-w-30rem"
+          @click="signIn"
+        />
+        <LinkButton
+          v-else
+          :label="tt('Get Started')"
+          icon="pi pi-arrow-right"
+          icon-pos="right"
+          class="max-w-30rem"
+          to="/upload"
+        />
+      </div>
+    </div>
+    <div class="flex gap-3 flex-column p-3">
+      <h2 class="m-0">
+        {{ tt('Section4Heading') }}
+      </h2>
+      <p>
+        {{ tt('Section4Paragraph1') }}
+        <LinkButton
+          to="pacta.rmi.org"
+          class="p-button-xs align-self-center py-0 ml-2 p-button-outlined"
+          :label="tt('Section4CTA')"
+          icon="pi pi-arrow-right"
+          icon-pos="right"
+        />
+      </p>
+    </div>
   </StandardContent>
 </template>
diff --git a/frontend/plugins/primevue.ts b/frontend/plugins/primevue.ts
index 6954ee9..6353731 100644
--- a/frontend/plugins/primevue.ts
+++ b/frontend/plugins/primevue.ts
@@ -11,6 +11,7 @@ import Column from 'primevue/column'
 import DataTable from 'primevue/datatable'
 import Dialog from 'primevue/dialog'
 import Dropdown from 'primevue/dropdown'
+import Image from 'primevue/image'
 import InputNumber from 'primevue/inputnumber'
 import InputText from 'primevue/inputtext'
 import InputSwitch from 'primevue/inputswitch'
@@ -42,6 +43,7 @@ export default defineNuxtPlugin(({ vueApp }) => {
   vueApp.component('PVDialog', Dialog)
   vueApp.component('PVDropdown', Dropdown)
   vueApp.component('PVFileUpload', FileUpload)
+  vueApp.component('PVImage', Image)
   vueApp.component('PVInputNumber', InputNumber)
   vueApp.component('PVInputText', InputText)
   vueApp.component('PVInputSwitch', InputSwitch)
diff --git a/frontend/public/img/how-it-works.jpg b/frontend/public/img/how-it-works.jpg
new file mode 100644
index 0000000..b6c5760
Binary files /dev/null and b/frontend/public/img/how-it-works.jpg differ