diff --git a/RELEASE.rst b/RELEASE.rst
index 18594f6706..c6ef487394 100644
--- a/RELEASE.rst
+++ b/RELEASE.rst
@@ -1,6 +1,13 @@
 Release Notes
 =============
 
+Version 0.41.2
+--------------
+
+- Certificate page UI (#2429)
+- Fix bad urls for edx video contentfiles (#2444)
+- add program enrollments api and view program certificate button (#2439)
+
 Version 0.41.1 (Released August 18, 2025)
 --------------
 
diff --git a/data_fixtures/migrations/0017_update_edx_content_urls.py b/data_fixtures/migrations/0017_update_edx_content_urls.py
new file mode 100644
index 0000000000..8c68c05f86
--- /dev/null
+++ b/data_fixtures/migrations/0017_update_edx_content_urls.py
@@ -0,0 +1,44 @@
+# Generated manually
+
+
+from django.db import migrations
+from django.db.models import Value
+from django.db.models.functions import Replace
+
+from learning_resources.utils import content_files_loaded_actions
+
+
+def update_contentfile_urls(apps, schema_editor):
+    """
+    Update incorrect ContentFile URLs that use the "/jump_to/" format
+    """
+
+    ContentFile = apps.get_model("learning_resources", "ContentFile")
+    LearningResourceRun = apps.get_model("learning_resources", "LearningResourceRun")
+    content_files = ContentFile.objects.filter(url__contains="/jump_to/").only(
+        "id", "url", "run__id"
+    )
+    # Get unique run IDs before updating
+    run_ids = set(content_files.values_list("run__id", flat=True).distinct())
+
+    # Update all ContentFile URLs in a single database query
+    content_files.update(url=Replace("url", Value("/jump_to/"), Value("/jump_to_id/")))
+
+    # Process the runs
+    for run in LearningResourceRun.objects.filter(id__in=run_ids):
+        content_files_loaded_actions(run)
+
+
+class Migration(migrations.Migration):
+    dependencies = [
+        (
+            "data_fixtures",
+            "0016_add_canvas_platform",
+        ),
+    ]
+
+    operations = [
+        migrations.RunPython(
+            update_contentfile_urls, reverse_code=migrations.RunPython.noop
+        ),
+    ]
diff --git a/frontends/api/package.json b/frontends/api/package.json
index 9a85853dbc..e7763145fa 100644
--- a/frontends/api/package.json
+++ b/frontends/api/package.json
@@ -30,7 +30,7 @@
     "ol-test-utilities": "0.0.0"
   },
   "dependencies": {
-    "@mitodl/mitxonline-api-axios": "2025.8.12",
+    "@mitodl/mitxonline-api-axios": "2025.8.18",
     "@tanstack/react-query": "^5.66.0",
     "axios": "^1.6.3"
   }
diff --git a/frontends/api/src/mitxonline/clients.ts b/frontends/api/src/mitxonline/clients.ts
index 073ff1d62e..3227a2ee7c 100644
--- a/frontends/api/src/mitxonline/clients.ts
+++ b/frontends/api/src/mitxonline/clients.ts
@@ -7,6 +7,7 @@ import {
   ProgramsApi,
   ProgramCertificatesApi,
   UsersApi,
+  ProgramEnrollmentsApi,
 } from "@mitodl/mitxonline-api-axios/v2"
 import axios from "axios"
 
@@ -51,10 +52,17 @@ const courseRunEnrollmentsApi = new EnrollmentsApi(
   axiosInstance,
 )
 
+const programEnrollmentsApi = new ProgramEnrollmentsApi(
+  undefined,
+  BASE_PATH,
+  axiosInstance,
+)
+
 export {
   usersApi,
   b2bApi,
   courseRunEnrollmentsApi,
+  programEnrollmentsApi,
   programsApi,
   programCollectionsApi,
   coursesApi,
diff --git a/frontends/api/src/mitxonline/hooks/enrollment/queries.ts b/frontends/api/src/mitxonline/hooks/enrollment/queries.ts
index 1d790f3dbf..8cad29588b 100644
--- a/frontends/api/src/mitxonline/hooks/enrollment/queries.ts
+++ b/frontends/api/src/mitxonline/hooks/enrollment/queries.ts
@@ -1,7 +1,11 @@
 import { queryOptions } from "@tanstack/react-query"
-import type { CourseRunEnrollment } from "@mitodl/mitxonline-api-axios/v2"
+import type {
+  CourseRunEnrollment,
+  UserProgramEnrollmentDetail,
+} from "@mitodl/mitxonline-api-axios/v2"
 
-import { courseRunEnrollmentsApi } from "../../clients"
+import { courseRunEnrollmentsApi, programEnrollmentsApi } from "../../clients"
+import { RawAxiosRequestConfig } from "axios"
 
 const enrollmentKeys = {
   root: ["mitxonline", "enrollments"],
@@ -10,10 +14,11 @@ const enrollmentKeys = {
     "courseRunEnrollments",
     "list",
   ],
-  programEnrollmentsList: () => [
+  programEnrollmentsList: (opts?: RawAxiosRequestConfig) => [
     ...enrollmentKeys.root,
     "programEnrollments",
     "list",
+    opts,
   ],
 }
 
@@ -25,6 +30,15 @@ const enrollmentQueries = {
         return courseRunEnrollmentsApi.enrollmentsList().then((res) => res.data)
       },
     }),
+  programEnrollmentsList: (opts?: RawAxiosRequestConfig) =>
+    queryOptions({
+      queryKey: enrollmentKeys.programEnrollmentsList(opts),
+      queryFn: async (): Promise<UserProgramEnrollmentDetail[]> => {
+        return programEnrollmentsApi
+          .programEnrollmentsList(opts)
+          .then((res) => res.data)
+      },
+    }),
 }
 
 export { enrollmentQueries, enrollmentKeys }
diff --git a/frontends/api/src/mitxonline/test-utils/factories/courses.ts b/frontends/api/src/mitxonline/test-utils/factories/courses.ts
index adc81659c8..871f1165cc 100644
--- a/frontends/api/src/mitxonline/test-utils/factories/courses.ts
+++ b/frontends/api/src/mitxonline/test-utils/factories/courses.ts
@@ -1,12 +1,80 @@
 import { mergeOverrides, makePaginatedFactory } from "ol-test-utilities"
 import type { PartialFactory } from "ol-test-utilities"
-import type { CourseWithCourseRunsSerializerV2 } from "@mitodl/mitxonline-api-axios/v2"
+import type {
+  CourseWithCourseRunsSerializerV2,
+  V1CourseWithCourseRuns,
+} from "@mitodl/mitxonline-api-axios/v2"
 import { faker } from "@faker-js/faker/locale/en"
 import { UniqueEnforcer } from "enforce-unique"
 
 const uniqueCourseId = new UniqueEnforcer()
 const uniqueCourseRunId = new UniqueEnforcer()
 
+const v1Course: PartialFactory<V1CourseWithCourseRuns> = (overrides = {}) => {
+  const defaults: V1CourseWithCourseRuns = {
+    id: uniqueCourseId.enforce(() => faker.number.int()),
+    title: faker.lorem.words(3),
+    readable_id: faker.lorem.slug(),
+    next_run_id: faker.number.int(),
+    departments: [
+      {
+        name: faker.company.name(),
+      },
+    ],
+    page: {
+      feature_image_src: faker.image.url(),
+      page_url: faker.internet.url(),
+      description: faker.lorem.paragraph(),
+      live: faker.datatype.boolean(),
+      length: `${faker.number.int({ min: 1, max: 12 })} weeks`,
+      effort: `${faker.number.int({ min: 1, max: 10 })} hours/week`,
+      financial_assistance_form_url: faker.internet.url(),
+      current_price: faker.number.int({ min: 0, max: 1000 }),
+      instructors: [
+        {
+          name: faker.person.fullName(),
+          bio: faker.lorem.paragraph(),
+        },
+      ],
+    },
+    programs: null,
+    courseruns: [
+      {
+        id: uniqueCourseRunId.enforce(() => faker.number.int()),
+        title: faker.lorem.words(3),
+        start_date: faker.date.future().toISOString(),
+        end_date: faker.date.future().toISOString(),
+        enrollment_start: faker.date.past().toISOString(),
+        enrollment_end: faker.date.future().toISOString(),
+        expiration_date: faker.date.future().toISOString(),
+        courseware_url: faker.internet.url(),
+        courseware_id: faker.string.uuid(),
+        certificate_available_date: faker.date.future().toISOString(),
+        upgrade_deadline: faker.date.future().toISOString(),
+        is_upgradable: faker.datatype.boolean(),
+        is_enrollable: faker.datatype.boolean(),
+        is_archived: faker.datatype.boolean(),
+        is_self_paced: faker.datatype.boolean(),
+        run_tag: faker.lorem.word(),
+        live: faker.datatype.boolean(),
+        course_number: faker.lorem.word(),
+        products: [
+          {
+            id: faker.number.int(),
+            price: faker.commerce.price(),
+            description: faker.lorem.sentence(),
+            is_active: faker.datatype.boolean(),
+            product_flexible_price: null,
+          },
+        ],
+        approved_flexible_price_exists: faker.datatype.boolean(),
+      },
+    ],
+  }
+
+  return mergeOverrides<V1CourseWithCourseRuns>(defaults, overrides)
+}
+
 const course: PartialFactory<CourseWithCourseRunsSerializerV2> = (
   overrides = {},
 ) => {
@@ -91,6 +159,7 @@ const course: PartialFactory<CourseWithCourseRunsSerializerV2> = (
   return mergeOverrides<CourseWithCourseRunsSerializerV2>(defaults, overrides)
 }
 
+const v1Courses = makePaginatedFactory(v1Course)
 const courses = makePaginatedFactory(course)
 
-export { course, courses }
+export { v1Course, v1Courses, course, courses }
diff --git a/frontends/api/src/mitxonline/test-utils/factories/enrollment.ts b/frontends/api/src/mitxonline/test-utils/factories/enrollment.ts
index a419a31326..99b57908e5 100644
--- a/frontends/api/src/mitxonline/test-utils/factories/enrollment.ts
+++ b/frontends/api/src/mitxonline/test-utils/factories/enrollment.ts
@@ -4,8 +4,10 @@ import type { PartialFactory } from "ol-test-utilities"
 import type {
   CourseRunEnrollment,
   CourseRunGrade,
+  UserProgramEnrollmentDetail,
 } from "@mitodl/mitxonline-api-axios/v2"
 import { UniqueEnforcer } from "enforce-unique"
+import { factories } from ".."
 
 const uniqueEnrollmentId = new UniqueEnforcer()
 const uniqueRunId = new UniqueEnforcer()
@@ -99,9 +101,56 @@ const courseEnrollment: PartialFactory<CourseRunEnrollment> = (
   return mergeOverrides<CourseRunEnrollment>(defaults, overrides)
 }
 
+const programEnrollment: PartialFactory<UserProgramEnrollmentDetail> = (
+  overrides = {},
+): UserProgramEnrollmentDetail => {
+  const defaults: UserProgramEnrollmentDetail = {
+    certificate: faker.datatype.boolean()
+      ? {
+          uuid: faker.string.uuid(),
+          link: faker.internet.url(),
+        }
+      : null,
+    program: {
+      id: faker.number.int(),
+      title: faker.lorem.words(3),
+      readable_id: faker.lorem.slug(),
+      courses: factories.courses.v1Course(),
+      requirements: {
+        required: [faker.number.int()],
+        electives: [faker.number.int()],
+      },
+      req_tree: [],
+      page: {
+        feature_image_src: faker.image.url(),
+        page_url: faker.internet.url(),
+        financial_assistance_form_url: faker.internet.url(),
+        description: faker.lorem.paragraph(),
+        live: faker.datatype.boolean(),
+        length: `${faker.number.int({ min: 1, max: 12 })} weeks`,
+        effort: `${faker.number.int({ min: 1, max: 10 })} hours/week`,
+        price: faker.commerce.price(),
+      },
+      program_type: faker.helpers.arrayElement([
+        "certificate",
+        "degree",
+        "diploma",
+      ]),
+      departments: [
+        {
+          name: faker.company.name(),
+        },
+      ],
+      live: faker.datatype.boolean(),
+    },
+    enrollments: [courseEnrollment()],
+  }
+  return mergeOverrides<UserProgramEnrollmentDetail>(defaults, overrides)
+}
+
 // Not paginated
 const courseEnrollments = (count: number): CourseRunEnrollment[] => {
   return new Array(count).fill(null).map(() => courseEnrollment())
 }
 
-export { courseEnrollment, courseEnrollments, grade }
+export { courseEnrollment, courseEnrollments, grade, programEnrollment }
diff --git a/frontends/api/src/mitxonline/test-utils/urls.ts b/frontends/api/src/mitxonline/test-utils/urls.ts
index 129e030080..6ebaaf6b74 100644
--- a/frontends/api/src/mitxonline/test-utils/urls.ts
+++ b/frontends/api/src/mitxonline/test-utils/urls.ts
@@ -19,6 +19,10 @@ const enrollment = {
     `${API_BASE_URL}/api/v1/enrollments/${id ? `${id}/` : ""}`,
 }
 
+const programEnrollments = {
+  enrollmentsList: () => `${API_BASE_URL}/api/v1/program_enrollments/`,
+}
+
 const b2b = {
   courseEnrollment: (readableId?: string) =>
     `${API_BASE_URL}/api/v0/b2b/enroll/${readableId}/`,
@@ -59,4 +63,5 @@ export {
   programCollections,
   courses,
   organization,
+  programEnrollments,
 }
diff --git a/frontends/main/next.config.js b/frontends/main/next.config.js
index 9ee6c74782..f2f968dbb7 100644
--- a/frontends/main/next.config.js
+++ b/frontends/main/next.config.js
@@ -92,16 +92,7 @@ const nextConfig = {
   images: {
     remotePatterns: [
       {
-        protocol: "http",
         hostname: "**",
-        port: "",
-        pathname: "**",
-      },
-      {
-        protocol: "https",
-        hostname: "**",
-        port: "",
-        pathname: "**",
       },
     ],
   },
diff --git a/frontends/main/public/images/certificate-badge-desktop.svg b/frontends/main/public/images/certificate-badge-desktop.svg
new file mode 100644
index 0000000000..d94accad15
--- /dev/null
+++ b/frontends/main/public/images/certificate-badge-desktop.svg
@@ -0,0 +1,8 @@
+<svg width="230" height="391" viewBox="0 0 230 391" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M183.001 391L114.501 349.587L46.0015 391V0H183.001V391Z" fill="#DDE1E6"/>
+<path d="M230.001 198.963C230.001 211.203 221.176 221.735 217.476 232.552C214.06 243.938 214.914 257.886 208.082 267.28C201.251 276.673 188.156 280.089 178.763 286.921C169.369 293.752 162.253 305.708 151.152 309.408C140.335 313.109 127.525 307.701 115.855 307.701C103.899 307.701 91.0897 313.109 80.5575 309.408C69.1714 305.708 62.055 293.752 52.9461 286.921C43.5525 280.089 30.1739 276.673 23.3422 267.28C16.5105 257.886 17.6491 243.938 13.9486 232.552C10.5328 221.735 1.42383 211.203 1.42383 198.963C1.42383 186.723 10.5328 176.191 13.9486 165.374C17.6491 153.988 16.5105 140.04 23.3422 130.646C30.1739 121.253 43.5525 117.837 52.9461 111.005C62.055 104.173 69.1714 92.2178 80.5575 88.5173C91.0897 84.8168 103.899 90.2253 115.855 90.2253C127.525 90.2253 140.335 84.8168 151.152 88.5173C162.253 92.2178 169.369 104.173 178.763 111.005C188.156 117.837 201.251 121.253 208.082 130.646C214.914 140.04 214.06 153.988 217.476 165.374C221.176 176.191 230.001 186.723 230.001 198.963Z" fill="#750014"/>
+<path d="M228.578 200.102C228.578 212.057 219.753 222.589 216.053 233.406C212.352 244.507 213.491 258.171 206.659 267.28C199.828 276.673 186.449 280.089 177.34 286.921C167.947 293.468 160.83 305.139 149.729 308.839C138.912 312.255 126.102 307.131 114.147 307.131C102.476 307.131 89.6668 312.255 78.85 308.839C67.7485 305.139 60.6321 293.468 51.2386 286.921C41.845 280.089 28.751 276.673 21.9193 267.28C15.0876 258.171 15.9416 244.507 12.5258 233.406C8.8253 222.589 0.000976562 212.057 0.000976562 200.102C0.000976562 188.146 8.8253 177.899 12.5258 167.082C15.9416 155.98 15.0876 142.317 21.9193 132.923C28.751 123.814 41.845 120.399 51.2386 113.567C60.6321 106.735 67.7485 95.0644 78.85 91.6486C89.6668 87.9481 102.476 93.0718 114.147 93.0718C126.102 93.0718 138.912 87.9481 149.729 91.6486C160.83 95.0644 167.947 106.735 177.34 113.567C186.449 120.399 199.828 123.814 206.659 132.923C213.491 142.317 212.352 155.98 216.053 167.082C219.753 177.899 228.578 188.146 228.578 200.102Z" fill="#750014"/>
+<path d="M200.967 197.255C200.967 246.785 160.547 287.206 111.017 287.206C61.4871 287.206 21.0664 246.785 21.0664 197.255C21.0664 147.725 61.4871 107.305 111.017 107.305C160.547 107.305 200.967 147.725 200.967 197.255Z" fill="#212326" fill-opacity="0.2"/>
+<path d="M205.806 203.233C205.806 252.763 165.67 292.899 116.14 292.899C66.3256 292.899 26.1895 252.763 26.1895 203.233C26.1895 153.419 66.3256 113.283 116.14 113.283C165.67 113.283 205.806 153.419 205.806 203.233Z" fill="#212326" fill-opacity="0.2"/>
+<path d="M204.098 200.387C204.098 250.201 163.962 290.337 114.147 290.337C64.6176 290.337 24.4814 250.201 24.4814 200.387C24.4814 150.857 64.6176 110.721 114.147 110.721C163.962 110.721 204.098 150.857 204.098 200.387Z" fill="#83192A"/>
+</svg>
diff --git a/frontends/main/public/images/certificate-badge-mobile.svg b/frontends/main/public/images/certificate-badge-mobile.svg
new file mode 100644
index 0000000000..e2e09beda8
--- /dev/null
+++ b/frontends/main/public/images/certificate-badge-mobile.svg
@@ -0,0 +1,8 @@
+<svg width="158" height="192" viewBox="0 0 158 192" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M125.5 191.662L78.9995 163.488L32.5 191.662V35.6616H125.5V191.662Z" fill="#DDE1E6"/>
+<path d="M157.235 76.0175C157.235 84.3445 151.232 91.5096 148.715 98.8683C146.391 106.614 146.972 116.103 142.324 122.494C137.676 128.884 128.768 131.208 122.378 135.856C115.987 140.503 111.146 148.637 103.594 151.154C96.2349 153.672 87.5206 149.992 79.5809 149.992C71.4475 149.992 62.7332 153.672 55.5681 151.154C47.822 148.637 42.9807 140.503 36.7839 135.856C30.3934 131.208 21.2918 128.884 16.6441 122.494C11.9965 116.103 12.7711 106.614 10.2536 98.8683C7.92981 91.5096 1.73291 84.3445 1.73291 76.0175C1.73291 67.6905 7.92981 60.5254 10.2536 53.1666C12.7711 45.4206 11.9965 35.9317 16.6441 29.5412C21.2918 23.1507 30.3934 20.8268 36.7839 16.1792C42.9807 11.5316 47.822 3.39824 55.5681 0.880773C62.7332 -1.63669 71.4475 2.04269 79.5809 2.04269C87.5206 2.04269 96.2349 -1.63669 103.594 0.880773C111.146 3.39824 115.987 11.5316 122.378 16.1792C128.768 20.8268 137.676 23.1507 142.324 29.5412C146.972 35.9317 146.391 45.4206 148.715 53.1666C151.232 60.5254 157.235 67.6905 157.235 76.0175Z" fill="#750014"/>
+<path d="M156.267 76.7921C156.267 84.9254 150.264 92.0905 147.747 99.4492C145.229 107.002 146.004 116.297 141.356 122.494C136.709 128.884 127.607 131.208 121.41 135.856C115.02 140.31 110.178 148.249 102.626 150.767C95.2672 153.091 86.5528 149.605 78.4195 149.605C70.4797 149.605 61.7654 153.091 54.4067 150.767C46.8543 148.249 42.0129 140.31 35.6224 135.856C29.2319 131.208 20.324 128.884 15.6763 122.494C11.0287 116.297 11.6097 107.002 9.28586 99.4492C6.76839 92.0905 0.765137 84.9254 0.765137 76.7921C0.765137 68.6587 6.76839 61.6873 9.28586 54.3285C11.6097 46.7761 11.0287 37.4808 15.6763 31.0903C20.324 24.8935 29.2319 22.5697 35.6224 17.9221C42.0129 13.2744 46.8543 5.33472 54.4067 3.01091C61.7654 0.493439 70.4797 3.97916 78.4195 3.97916C86.5528 3.97916 95.2672 0.493439 102.626 3.01091C110.178 5.33472 115.02 13.2744 121.41 17.9221C127.607 22.5697 136.709 24.8935 141.356 31.0903C146.004 37.4808 145.229 46.7761 147.747 54.3285C150.264 61.6873 156.267 68.6587 156.267 76.7921Z" fill="#750014"/>
+<path d="M137.484 74.8559C137.484 108.551 109.985 136.05 76.2901 136.05C42.5947 136.05 15.0962 108.551 15.0962 74.8559C15.0962 41.1606 42.5947 13.6621 76.2901 13.6621C109.985 13.6621 137.484 41.1606 137.484 74.8559Z" fill="#212326" fill-opacity="0.2"/>
+<path d="M140.776 78.9228C140.776 112.618 113.471 139.923 79.7755 139.923C45.8864 139.923 18.5815 112.618 18.5815 78.9228C18.5815 45.0339 45.8864 17.729 79.7755 17.729C113.471 17.729 140.776 45.0339 140.776 78.9228Z" fill="#212326" fill-opacity="0.2"/>
+<path d="M139.614 76.986C139.614 110.875 112.309 138.18 78.4197 138.18C44.7243 138.18 17.4194 110.875 17.4194 76.986C17.4194 43.2907 44.7243 15.9858 78.4197 15.9858C112.309 15.9858 139.614 43.2907 139.614 76.986Z" fill="#83192A"/>
+</svg>
diff --git a/frontends/main/public/images/mit-learn-logo-black.svg b/frontends/main/public/images/mit-learn-logo-black.svg
new file mode 100644
index 0000000000..7fa921fc6c
--- /dev/null
+++ b/frontends/main/public/images/mit-learn-logo-black.svg
@@ -0,0 +1,5 @@
+<svg width="143" height="26" viewBox="0 0 143 26" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M0.462 25V0.689999H9.71L13.45 14.29H13.518L17.258 0.689999H26.574V25H20.148V9.768H20.08L16.034 25H10.832L6.786 9.768H6.718V25H0.462ZM29.4815 25V0.689999H36.5875V25H29.4815ZM38.5569 6.742V0.689999H59.5009V6.742H52.5309V25H45.4249V6.742H38.5569ZM67.2834 25V0.689999H69.5614V22.892H82.5154V25H67.2834ZM91.5167 25.442C88.9553 25.442 86.9493 24.592 85.4987 22.892C84.048 21.1693 83.3227 18.948 83.3227 16.228C83.3227 13.5533 84.0593 11.3547 85.5327 9.632C87.006 7.88667 88.944 7.014 91.3467 7.014C92.7067 7.014 93.8853 7.27467 94.8827 7.796C95.9027 8.31733 96.696 9.04267 97.2627 9.972C97.8293 10.9013 98.2373 11.9213 98.4867 13.032C98.7587 14.12 98.8947 15.31 98.8947 16.602H85.4987C85.544 18.6873 86.0767 20.3873 87.0967 21.702C88.1167 22.994 89.59 23.64 91.5167 23.64C94.1913 23.64 95.9027 22.3253 96.6507 19.696H98.6907C98.3053 21.464 97.4893 22.8693 96.2427 23.912C95.0187 24.932 93.4433 25.442 91.5167 25.442ZM85.5327 14.936H96.6847C96.6393 13.1 96.1633 11.6153 95.2567 10.482C94.3727 9.326 93.0693 8.748 91.3467 8.748C89.6467 8.748 88.298 9.31467 87.3007 10.448C86.326 11.5813 85.7367 13.0773 85.5327 14.936ZM106.266 25.408C104.566 25.408 103.184 24.9887 102.118 24.15C101.053 23.3113 100.52 22.0987 100.52 20.512C100.52 19.5147 100.69 18.676 101.03 17.996C101.393 17.2933 101.937 16.7493 102.662 16.364C103.41 15.9787 104.158 15.6953 104.906 15.514C105.677 15.31 106.629 15.14 107.762 15.004C109.666 14.7773 110.924 14.5393 111.536 14.29C112.171 14.018 112.488 13.4627 112.488 12.624V12.284C112.488 9.92667 111.083 8.748 108.272 8.748C105.144 8.748 103.501 10.0513 103.342 12.658H101.268C101.382 10.9127 102.028 9.54133 103.206 8.544C104.385 7.54667 106.074 7.048 108.272 7.048C112.42 7.048 114.494 8.86133 114.494 12.488V22.042C114.494 23.0167 114.88 23.5267 115.65 23.572C115.764 23.572 116.024 23.5267 116.432 23.436H116.534V24.966C116.126 25.1473 115.65 25.238 115.106 25.238C113.474 25.238 112.613 24.4107 112.522 22.756V22.382H112.42C110.992 24.3993 108.941 25.408 106.266 25.408ZM106.64 23.708C108.454 23.708 109.882 23.198 110.924 22.178C111.99 21.1353 112.522 19.9567 112.522 18.642V15.48C111.661 15.956 110.142 16.3413 107.966 16.636C107.241 16.7267 106.663 16.8173 106.232 16.908C105.824 16.9987 105.36 17.1347 104.838 17.316C104.34 17.4973 103.954 17.7127 103.682 17.962C103.433 18.2113 103.206 18.5513 103.002 18.982C102.821 19.4127 102.73 19.9227 102.73 20.512C102.73 22.6427 104.034 23.708 106.64 23.708ZM118.473 25V7.422H120.581V10.686H120.649C121.85 8.41933 123.641 7.286 126.021 7.286C126.225 7.286 126.418 7.30867 126.599 7.354V9.428C125.216 9.20133 123.97 9.48467 122.859 10.278C121.34 11.4113 120.581 12.9867 120.581 15.004V25H118.473ZM128.932 25V7.422H131.04V10.108H131.108C132.491 8.068 134.451 7.048 136.99 7.048C138.667 7.048 140.016 7.53533 141.036 8.51C142.079 9.462 142.6 10.7993 142.6 12.522V25H140.492V12.726C140.492 10.142 139.155 8.85 136.48 8.85C134.961 8.85 133.669 9.326 132.604 10.278C131.561 11.23 131.04 12.42 131.04 13.848V25H128.932Z"
+    fill="black" />
+</svg>
diff --git a/frontends/main/public/images/mit-open-learning-logo.svg b/frontends/main/public/images/mit-open-learning-logo.svg
new file mode 100644
index 0000000000..9f54342c30
--- /dev/null
+++ b/frontends/main/public/images/mit-open-learning-logo.svg
@@ -0,0 +1,22 @@
+<svg width="260" height="67" viewBox="0 0 260 67" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_22738_68399)">
+<path d="M60.0756 60.8451H73.4258V20.6102H60.0756V60.8451ZM80.1008 13.9044H113.476V0.492798H80.1008V13.9044ZM60.0756 0.492798H73.4258V13.9044H60.0756V0.492798ZM40.0504 60.8451H53.4006V0.492798H40.0504V60.8451ZM20.0252 47.4335H33.3754V0.492798H20.0252V47.4335ZM0 60.8451H13.3501V0.492798H0V60.8451ZM80.1008 60.8451H93.451V20.6102H80.1008V60.8451Z" fill="black"/>
+<path d="M128.752 35.6979H133.828V56.5893H145.592V60.8451H128.752V35.6979Z" fill="black"/>
+<path d="M146.711 51.8062C146.711 46.4602 150.317 42.3101 155.569 42.3101C161.345 42.3101 164.426 46.7416 164.426 53.1778H151.403C151.753 55.9563 153.293 57.6797 155.989 57.6797C157.844 57.6797 158.93 56.8356 159.455 55.4638H164.146C163.481 58.6644 160.645 61.3726 156.024 61.3726C150.072 61.3727 146.711 57.1872 146.711 51.8062ZM151.473 49.8718H159.455C159.315 47.5857 157.809 46.003 155.639 46.003C153.118 46.003 151.893 47.5153 151.473 49.8718Z" fill="black"/>
+<path d="M177.379 58.8402H177.309C176.399 60.2119 175.104 61.2671 172.023 61.2671C168.347 61.2671 165.756 59.3327 165.756 55.7453C165.756 51.7709 168.977 50.5048 172.968 49.9421C175.944 49.52 177.31 49.2738 177.31 47.9022C177.31 46.6009 176.294 45.7567 174.299 45.7567C172.058 45.7567 170.973 46.5656 170.833 48.289H166.597C166.737 45.1236 169.082 42.3452 174.334 42.3452C179.725 42.3452 181.896 44.772 181.896 48.9925V58.172C181.896 59.5436 182.106 60.3527 182.526 60.6691V60.845H177.94C177.66 60.4933 177.485 59.6491 177.379 58.8402ZM177.415 54.4791V51.7709C176.574 52.2634 175.279 52.5447 174.089 52.8261C171.603 53.3888 170.378 53.9515 170.378 55.6397C170.378 57.3279 171.498 57.9257 173.178 57.9257C175.909 57.9258 177.415 56.2376 177.415 54.4791Z" fill="black"/>
+<path d="M189.492 45.6864H189.597C190.682 43.6465 191.908 42.5914 194.008 42.5914C194.533 42.5914 194.848 42.6266 195.129 42.7321V46.9175H195.024C191.908 46.6009 189.667 48.2539 189.667 52.0524V60.8451H184.906V42.8024H189.492L189.492 45.6864Z" fill="black"/>
+<path d="M201.85 45.2644H201.955C203.18 43.33 204.826 42.3101 207.277 42.3101C210.988 42.3101 213.473 45.1236 213.473 49.0629V60.8452H208.712V49.7663C208.712 47.832 207.592 46.4603 205.596 46.4603C203.496 46.4603 201.955 48.1486 201.955 50.6105V60.8452H197.194V42.8024H201.85L201.85 45.2644Z" fill="black"/>
+<path d="M216.414 35.6979H221.175V39.9887H216.414V35.6979ZM216.414 42.8024H221.175V60.8451H216.414V42.8024Z" fill="black"/>
+<path d="M228.912 45.2644H229.017C230.242 43.33 231.888 42.3101 234.339 42.3101C238.05 42.3101 240.535 45.1236 240.535 49.0629V60.8452H235.774V49.7663C235.774 47.832 234.654 46.4603 232.658 46.4603C230.558 46.4603 229.017 48.1486 229.017 50.6105V60.8452H224.256V42.8024H228.912L228.912 45.2644Z" fill="black"/>
+<path d="M242.985 61.3727H247.712C248.097 62.4981 249.112 63.3774 251.318 63.3774C254.013 63.3774 255.309 62.0761 255.309 59.6141V57.6445H255.204C254.153 58.8403 252.788 59.7547 250.512 59.7547C246.521 59.7547 242.6 56.5893 242.6 51.1379C242.6 45.7568 245.821 42.3101 250.372 42.3101C252.613 42.3101 254.258 43.1893 255.344 44.7017H255.414V42.8024H260V59.4734C260 62.0057 259.195 63.7292 257.864 64.9601C256.359 66.3669 254.048 67 251.387 67C246.486 67 243.475 64.8897 242.985 61.3727ZM255.554 51.0324C255.554 48.3945 254.153 46.1436 251.283 46.1436C248.867 46.1436 247.256 48.0429 247.256 51.0675C247.256 54.1274 248.867 55.9211 251.318 55.9211C254.328 55.9212 255.554 53.7054 255.554 51.0324Z" fill="black"/>
+<path d="M127.667 13.1187C127.667 5.59223 132.358 0 139.745 0C147.132 0 151.788 5.59223 151.788 13.1187C151.788 20.6453 147.132 26.2023 139.745 26.2023C132.358 26.2023 127.667 20.6453 127.667 13.1187ZM146.607 13.1187C146.607 8.0893 144.366 4.18535 139.78 4.18535C135.194 4.18535 132.848 8.0893 132.848 13.1187C132.848 18.113 135.194 22.0169 139.78 22.0169C144.366 22.0169 146.607 18.113 146.607 13.1187Z" fill="black"/>
+<path d="M154.168 7.59693H158.755V9.8479H158.86C160.015 8.26524 161.696 7.10455 164.146 7.10455C168.907 7.10455 171.953 11.0085 171.953 16.6359C171.953 22.4742 168.802 26.1672 164.181 26.1672C161.66 26.1672 160.015 25.1472 159 23.5997H158.93V31.5482H154.168V7.59693ZM167.122 16.7765C167.122 13.365 165.932 10.9734 162.991 10.9734C160.015 10.9734 158.825 13.5409 158.825 16.7765C158.825 20.0474 160.33 22.1928 163.166 22.1928C165.582 22.1928 167.122 20.1881 167.122 16.7765Z" fill="black"/>
+<path d="M173.283 16.6006C173.283 11.2547 176.889 7.10455 182.141 7.10455C187.917 7.10455 190.998 11.5361 190.998 17.9723H177.974C178.325 20.7508 179.865 22.4742 182.561 22.4742C184.416 22.4742 185.502 21.6301 186.027 20.2583H190.718C190.053 23.4589 187.217 26.1671 182.596 26.1671C176.644 26.1672 173.283 21.9817 173.283 16.6006ZM178.045 14.6663H186.027C185.887 12.3802 184.381 10.7975 182.211 10.7975C179.69 10.7974 178.465 12.3098 178.045 14.6663Z" fill="black"/>
+<path d="M197.859 10.0589H197.964C199.19 8.12451 200.835 7.10455 203.286 7.10455C206.997 7.10455 209.483 9.91814 209.483 13.8574V25.6397H204.721V14.5608C204.721 12.6265 203.601 11.2548 201.605 11.2548C199.505 11.2548 197.964 12.943 197.964 15.405V25.6397H193.203V7.59693H197.859L197.859 10.0589Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_22738_68399">
+<rect width="260" height="67" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/frontends/main/src/app-pages/CertificatePage/CertificatePage.tsx b/frontends/main/src/app-pages/CertificatePage/CertificatePage.tsx
new file mode 100644
index 0000000000..2cc5b029ba
--- /dev/null
+++ b/frontends/main/src/app-pages/CertificatePage/CertificatePage.tsx
@@ -0,0 +1,502 @@
+"use client"
+
+import React from "react"
+import { useParams } from "next/navigation"
+import Image from "next/image"
+import { Link, Typography, styled } from "ol-components"
+import backgroundImage from "@/public/images/backgrounds/error_page_background.svg"
+import { certificateQueries } from "api/mitxonline-hooks/certificates"
+import { useQuery } from "@tanstack/react-query"
+import OpenLearningLogo from "@/public/images/mit-open-learning-logo.svg"
+import CertificateBadgeDesktop from "@/public/images/certificate-badge-desktop.svg"
+import CertificateBadgeMobile from "@/public/images/certificate-badge-mobile.svg"
+import { formatDate, NoSSR } from "ol-utilities"
+
+const Page = styled.div(({ theme }) => ({
+  backgroundImage: `url(${backgroundImage.src})`,
+  backgroundAttachment: "fixed",
+  backgroundRepeat: "no-repeat",
+  backgroundSize: "contain",
+  display: "flow-root",
+  flexGrow: 1,
+  height: "100%",
+  padding: "0 16px 90px",
+  [theme.breakpoints.down("sm")]: {
+    backgroundImage: "none",
+    padding: "0 40px 40px",
+  },
+}))
+
+const Title = styled(Typography)(({ theme }) => ({
+  margin: "60px 160px 40px",
+  textAlign: "center",
+  span: {
+    fontWeight: theme.typography.fontWeightLight,
+    color: theme.custom.colors.darkGray2,
+  },
+  [theme.breakpoints.down("lg")]: {
+    span: {
+      fontSize: theme.typography.pxToRem(26),
+      lineHeight: theme.typography.pxToRem(30),
+    },
+  },
+  [theme.breakpoints.down("md")]: {
+    textAlign: "left",
+    margin: "24px 0",
+    span: {
+      fontSize: theme.typography.pxToRem(24),
+      lineHeight: theme.typography.pxToRem(30),
+    },
+  },
+}))
+
+const Certificate = styled.div(({ theme }) => ({
+  maxWidth: "1306px",
+  minWidth: "1200px",
+  border: `4px solid ${theme.custom.colors.silverGray}`,
+  padding: "24px 23px",
+  backgroundColor: theme.custom.colors.white,
+  marginTop: "50px",
+  margin: "0 auto",
+  [theme.breakpoints.down("lg")]: {
+    padding: 0,
+    border: "none",
+    maxWidth: "unset",
+    minWidth: "unset",
+  },
+}))
+
+const Inner = styled.div(({ theme }) => ({
+  border: `1px solid ${theme.custom.colors.silverGrayLight}`,
+  padding: "67px",
+  display: "flex",
+  flexDirection: "column",
+  gap: "56px",
+  position: "relative",
+  [theme.breakpoints.down("lg")]: {
+    padding: "40px",
+    gap: "40px",
+  },
+  [theme.breakpoints.down("md")]: {
+    border: `2px solid ${theme.custom.colors.lightGray2}`,
+    padding: "24px 16px",
+    gap: "24px",
+    textAlign: "center",
+  },
+}))
+
+const Logo = styled(Image)(({ theme }) => ({
+  width: "260px",
+  height: "auto",
+  [theme.breakpoints.down("lg")]: {
+    width: "230px",
+    height: "59px",
+  },
+  [theme.breakpoints.down("md")]: {
+    width: "129px",
+    margin: "0 auto",
+  },
+}))
+
+const Badge = styled.div(({ theme }) => ({
+  backgroundImage: `url(${CertificateBadgeDesktop.src})`,
+  position: "absolute",
+  top: 0,
+  right: "67px",
+  width: "230px",
+  height: "391px",
+  textAlign: "center",
+  padding: "81px 34px",
+  backgroundRepeat: "no-repeat",
+  [theme.breakpoints.down("lg")]: {
+    backgroundImage: `url(${CertificateBadgeMobile.src})`,
+    top: "24px",
+    right: "40px",
+    width: "156px",
+    height: "191px",
+  },
+  [theme.breakpoints.down("md")]: {
+    position: "relative",
+    height: "191px",
+    top: 0,
+    right: 0,
+    margin: "0 auto",
+  },
+}))
+
+const BadgeText = styled(Typography)(({ theme }) => ({
+  color: theme.custom.colors.white,
+  position: "absolute",
+  top: "169px",
+  right: "26px",
+  width: "175px",
+  textAlign: "center",
+  [theme.breakpoints.down("lg")]: {
+    fontSize: theme.typography.pxToRem(16),
+    lineHeight: "150%",
+    fontWeight: theme.typography.fontWeightMedium,
+    top: "53px",
+    right: "18px",
+    width: "119px",
+  },
+  [theme.breakpoints.down("md")]: {
+    width: "130px",
+    position: "absolute",
+    top: "50px",
+    right: "50%",
+    transform: "translateX(50%)",
+  },
+}))
+
+const Certification = styled.div(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  gap: "16px",
+  maxWidth: "850px",
+  ".MuiTypography-h4": {
+    fontWeight: theme.typography.fontWeightLight,
+    color: theme.custom.colors.silverGrayDark,
+  },
+  [theme.breakpoints.down("lg")]: {
+    ".MuiTypography-h4": {
+      fontSize: theme.typography.pxToRem(16),
+    },
+  },
+  [theme.breakpoints.down("md")]: {
+    gap: 0,
+    ".MuiTypography-h4": {
+      fontSize: theme.typography.pxToRem(16),
+      fontWeight: theme.typography.fontWeightMedium,
+      lineHeight: "150%",
+      color: theme.custom.colors.silverGrayDark,
+    },
+  },
+}))
+
+const NameText = styled(Typography)(({ theme }) => ({
+  color: theme.custom.colors.red,
+  display: "block",
+  [theme.breakpoints.down("lg")]: {
+    fontSize: theme.typography.pxToRem(34),
+    lineHeight: theme.typography.pxToRem(40),
+  },
+  [theme.breakpoints.down("md")]: {
+    fontSize: theme.typography.pxToRem(24),
+    lineHeight: theme.typography.pxToRem(30),
+    marginTop: "4px",
+  },
+}))
+
+const AchievementText = styled(Typography)(({ theme }) => ({
+  fontWeight: theme.typography.fontWeightLight,
+  fontSize: theme.typography.pxToRem(20),
+  lineHeight: theme.typography.pxToRem(26),
+  color: theme.custom.colors.silverGrayDark,
+  strong: {
+    fontWeight: theme.typography.fontWeightBold,
+  },
+  [theme.breakpoints.down("lg")]: {
+    fontSize: theme.typography.pxToRem(16),
+    lineHeight: theme.typography.pxToRem(24),
+  },
+  [theme.breakpoints.down("md")]: {
+    fontSize: theme.typography.pxToRem(14),
+    lineHeight: theme.typography.pxToRem(18),
+    marginTop: "16px",
+  },
+}))
+
+const CourseInfo = styled.div(({ theme }) => ({
+  display: "flex",
+  flexDirection: "column",
+  gap: "16px",
+  ".MuiTypography-h4": {
+    fontWeight: theme.typography.fontWeightLight,
+    color: theme.custom.colors.silverGrayDark,
+  },
+  [theme.breakpoints.down("lg")]: {
+    ".MuiTypography-h2": {
+      fontSize: theme.typography.pxToRem(28),
+      lineHeight: theme.typography.pxToRem(36),
+    },
+    ".MuiTypography-h4": {
+      fontSize: theme.typography.pxToRem(16),
+      lineHeight: theme.typography.pxToRem(20),
+    },
+  },
+  [theme.breakpoints.down("md")]: {
+    ".MuiTypography-h2": {
+      fontSize: theme.typography.pxToRem(18),
+      lineHeight: theme.typography.pxToRem(26),
+      fontWeight: theme.typography.fontWeightMedium,
+    },
+    ".MuiTypography-h4": {
+      fontSize: theme.typography.pxToRem(14),
+      lineHeight: theme.typography.pxToRem(18),
+      color: theme.custom.colors.darkGray1,
+    },
+  },
+}))
+
+const Spacer = styled.div(({ theme }) => ({
+  height: "30px",
+  [theme.breakpoints.down("lg")]: {
+    display: "none",
+  },
+}))
+
+const Signatories = styled.div(({ theme }) => ({
+  display: "flex",
+  flexDirection: "row",
+  gap: "16px",
+  width: "100%",
+  [theme.breakpoints.down("md")]: {
+    flexDirection: "column",
+    gap: "24px",
+  },
+}))
+
+const Signatory = styled.div(({ theme }) => ({
+  flex: "1 1 0",
+  minWidth: 0,
+  span: {
+    display: "block",
+  },
+  ".MuiTypography-body1": {
+    color: theme.custom.colors.silverGrayDark,
+  },
+  [theme.breakpoints.down("lg")]: {
+    ".MuiTypography-body1": {
+      fontSize: theme.typography.pxToRem(12),
+      lineHeight: theme.typography.pxToRem(16),
+    },
+    ".MuiTypography-body1:last-child": {
+      marginTop: "8px",
+    },
+  },
+  [theme.breakpoints.down("md")]: {
+    ".MuiTypography-body1": {
+      color: theme.custom.colors.darkGray1,
+      fontSize: theme.typography.pxToRem(14),
+      lineHeight: theme.typography.pxToRem(18),
+    },
+    borderBottom: `1px solid ${theme.custom.colors.lightGray2}`,
+    paddingBottom: "24px",
+    p: {
+      marginTop: "8px",
+    },
+  },
+}))
+
+const Signature = styled.img(({ theme }) => ({
+  width: "auto",
+  height: "60px",
+  [theme.breakpoints.down("lg")]: {
+    height: "54px",
+  },
+  [theme.breakpoints.down("md")]: {
+    height: "40px",
+  },
+}))
+
+const SignatoryName = styled(Typography)(({ theme }) => ({
+  marginBottom: "8px",
+  [theme.breakpoints.down("lg")]: {
+    fontSize: theme.typography.pxToRem(18),
+    lineHeight: theme.typography.pxToRem(26),
+    fontWeight: theme.typography.fontWeightMedium,
+  },
+  [theme.breakpoints.down("md")]: {
+    fontSize: theme.typography.pxToRem(16),
+    lineHeight: "150%",
+    marginTop: "16px",
+  },
+}))
+
+const CertificateId = styled(Typography)(({ theme }) => ({
+  span: {
+    color: theme.custom.colors.silverGrayDark,
+  },
+  [theme.breakpoints.down("lg")]: {
+    fontSize: theme.typography.pxToRem(12),
+    lineHeight: theme.typography.pxToRem(16),
+  },
+  [theme.breakpoints.down("md")]: {
+    fontSize: theme.typography.pxToRem(14),
+    lineHeight: theme.typography.pxToRem(20),
+    span: {
+      display: "block",
+    },
+  },
+}))
+
+const Note = styled(Typography)(({ theme }) => ({
+  margin: "48px 0 64px 0",
+  textAlign: "center",
+  fontSize: theme.typography.pxToRem(16),
+  a: {
+    color: theme.custom.colors.red,
+    textDecoration: "underline",
+    fontSize: theme.typography.pxToRem(16),
+  },
+  [theme.breakpoints.down("lg")]: {
+    fontSize: theme.typography.pxToRem(14),
+    lineHeight: theme.typography.pxToRem(18),
+    a: {
+      fontSize: theme.typography.pxToRem(14),
+    },
+  },
+  [theme.breakpoints.down("md")]: {
+    margin: "32px 0 16px",
+    textAlign: "left",
+  },
+}))
+
+enum CertificateType {
+  Course = "course",
+  Program = "program",
+}
+
+const CertificatePage: React.FC = () => {
+  const { certificateType, uuid } = useParams<{
+    certificateType: CertificateType
+    uuid: string
+  }>()
+
+  console.log("certificateType", certificateType)
+  console.log("uuid", uuid)
+
+  const { data: courseCertData, isLoading: isCourseLoading } = useQuery({
+    ...certificateQueries.courseCertificatesRetrieve({
+      cert_uuid: uuid,
+    }),
+    enabled: certificateType === CertificateType.Course,
+  })
+
+  const { data: programCertData, isLoading: isProgramLoading } = useQuery({
+    ...certificateQueries.programCertificatesRetrieve({
+      cert_uuid: uuid,
+    }),
+    enabled: certificateType === CertificateType.Program,
+  })
+
+  const isLoading = isCourseLoading || isProgramLoading
+
+  if (isLoading) {
+    return <Page />
+  }
+
+  const title =
+    certificateType === CertificateType.Course
+      ? courseCertData?.course_run?.course?.title
+      : programCertData?.program?.title
+
+  const displayType =
+    certificateType === CertificateType.Course
+      ? "Module Certificate"
+      : `${programCertData?.program?.program_type} Certificate`
+
+  const userName =
+    certificateType === CertificateType.Course
+      ? courseCertData?.user?.name
+      : programCertData?.user?.name
+
+  const shortDisplayType =
+    certificateType === CertificateType.Course
+      ? "module"
+      : programCertData?.program?.program_type === "Series"
+        ? "series"
+        : `${programCertData?.program?.program_type} program`
+
+  const ceus =
+    certificateType === CertificateType.Course
+      ? null
+      : programCertData?.certificate_page?.CEUs
+
+  const signatories =
+    certificateType === CertificateType.Course
+      ? courseCertData?.certificate_page?.signatory_items
+      : programCertData?.certificate_page?.signatory_items
+
+  const startDate =
+    certificateType === CertificateType.Course
+      ? courseCertData?.course_run?.start_date
+      : programCertData?.program?.start_date
+
+  const endDate =
+    certificateType === CertificateType.Course
+      ? courseCertData?.course_run?.end_date
+      : programCertData?.program?.end_date
+
+  return (
+    <Page>
+      <Title>
+        <Typography variant="h3">
+          <strong>{title}</strong> {displayType}
+        </Typography>
+      </Title>
+      <Certificate>
+        <Inner>
+          <Logo src={OpenLearningLogo} alt="MIT Open Learning" />
+          <Badge>
+            <BadgeText variant="h4">{displayType}</BadgeText>
+          </Badge>
+          <Certification>
+            <Typography variant="h4">This is to certify that</Typography>
+            <NameText variant="h1">{userName}</NameText>
+            <AchievementText>
+              has successfully completed all requirements of the{" "}
+              <strong>Universal Artificial Intelligence</strong>{" "}
+              {shortDisplayType}:
+            </AchievementText>
+          </Certification>
+          <CourseInfo>
+            <Typography variant="h2">{title}</Typography>
+            {ceus ? (
+              <Typography variant="h4">
+                Awarded {ceus} Continuing Education Units (CEUs)
+              </Typography>
+            ) : null}
+            {startDate && endDate && (
+              <Typography variant="h4">
+                <NoSSR>
+                  {formatDate(startDate)} - {formatDate(endDate)}
+                </NoSSR>
+              </Typography>
+            )}
+            {ceus ? null : <Spacer />}
+          </CourseInfo>
+          <Signatories>
+            {signatories?.map((signatory, index) => (
+              <Signatory key={index}>
+                <Signature
+                  src={`${process.env.NEXT_PUBLIC_MITX_ONLINE_BASE_URL}${signatory.signature_image}`}
+                  alt={signatory.name}
+                />
+                <SignatoryName variant="h3">{signatory.name}</SignatoryName>
+                <Typography variant="body1">{signatory.title_1}</Typography>
+                <Typography variant="body1">{signatory.title_2}</Typography>
+                <Typography variant="body1">
+                  {signatory.organization}
+                </Typography>
+              </Signatory>
+            ))}
+          </Signatories>
+          <CertificateId variant="body1">
+            Valid Certificate ID: <span>{uuid}</span>
+          </CertificateId>
+        </Inner>
+      </Certificate>
+      <Note>
+        <strong>Note:</strong> The name displayed on your certificate is based
+        on your{" "}
+        <Link href="/dashboard/profile" color="red">
+          Profile
+        </Link>{" "}
+        information.
+      </Note>
+    </Page>
+  )
+}
+
+export default CertificatePage
diff --git a/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/DashboardCard.tsx b/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/DashboardCard.tsx
index e697569c04..0bbf1ec12f 100644
--- a/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/DashboardCard.tsx
+++ b/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/DashboardCard.tsx
@@ -338,6 +338,7 @@ const DashboardCard: React.FC<DashboardCardProps> = ({
 }) => {
   const course = dashboardResource as DashboardCourse
   const { title, marketingUrl, enrollment, run } = course
+
   const titleSection = isLoading ? (
     <>
       <Skeleton variant="text" width="95%" height={16} />
@@ -353,8 +354,9 @@ const DashboardCard: React.FC<DashboardCardProps> = ({
       >
         {title}
       </TitleLink>
-      {enrollment?.status === EnrollmentStatus.Completed ? (
-        <SubtitleLink href="#">
+      {enrollment?.status === EnrollmentStatus.Completed &&
+      run.certificate?.link ? (
+        <SubtitleLink href={run.certificate.link}>
           {<RiAwardLine size="16px" />}
           View Certificate
         </SubtitleLink>
diff --git a/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/test-utils.ts b/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/test-utils.ts
index 81e5eb815c..72d23d8139 100644
--- a/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/test-utils.ts
+++ b/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/test-utils.ts
@@ -14,7 +14,7 @@ import moment from "moment"
 const makeCourses = factories.courses.courses
 const makeProgram = factories.programs.program
 const makeProgramCollection = factories.programs.programCollection
-const makeEnrollment = factories.enrollment.courseEnrollment
+const makeCourseEnrollment = factories.enrollment.courseEnrollment
 const makeGrade = factories.enrollment.grade
 
 const dashboardCourse: PartialFactory<DashboardCourse> = (...overrides) => {
@@ -45,20 +45,20 @@ const dashboardCourse: PartialFactory<DashboardCourse> = (...overrides) => {
 
 const setupEnrollments = (includeExpired: boolean) => {
   const completed = [
-    makeEnrollment({
+    makeCourseEnrollment({
       run: { title: "C Course Ended" },
       grades: [makeGrade({ passed: true })],
     }),
   ]
   const expired = includeExpired
     ? [
-        makeEnrollment({
+        makeCourseEnrollment({
           run: {
             title: "A Course Ended",
             end_date: faker.date.past().toISOString(),
           },
         }),
-        makeEnrollment({
+        makeCourseEnrollment({
           run: {
             title: "B Course Ended",
             end_date: faker.date.past().toISOString(),
@@ -67,13 +67,13 @@ const setupEnrollments = (includeExpired: boolean) => {
       ]
     : []
   const started = [
-    makeEnrollment({
+    makeCourseEnrollment({
       run: {
         title: "A Course Started",
         start_date: faker.date.past().toISOString(),
       },
     }),
-    makeEnrollment({
+    makeCourseEnrollment({
       run: {
         title: "B Course Started",
         start_date: faker.date.past().toISOString(),
@@ -81,12 +81,12 @@ const setupEnrollments = (includeExpired: boolean) => {
     }),
   ]
   const notStarted = [
-    makeEnrollment({
+    makeCourseEnrollment({
       run: {
         start_date: moment().add(1, "day").toISOString(), // Sooner first
       },
     }),
-    makeEnrollment({
+    makeCourseEnrollment({
       run: {
         start_date: moment().add(5, "day").toISOString(), // Later second
       },
diff --git a/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/transform.ts b/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/transform.ts
index 0065d5eda5..b96af4ce58 100644
--- a/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/transform.ts
+++ b/frontends/main/src/app-pages/DashboardPage/CoursewareDisplay/transform.ts
@@ -55,7 +55,11 @@ const mitxonlineEnrollment = (raw: CourseRunEnrollment): DashboardCourse => {
       coursewareUrl: raw.run.courseware_url,
       certificate: {
         uuid: raw.certificate?.uuid ?? "",
-        link: raw.certificate?.link ?? "",
+        link:
+          raw.certificate?.link?.replace(
+            /^\/certificate\/([^/]+)\/$/,
+            "/certificate/course/$1/",
+          ) ?? "",
       },
     },
     enrollment: {
diff --git a/frontends/main/src/app-pages/DashboardPage/OrganizationContent.test.tsx b/frontends/main/src/app-pages/DashboardPage/OrganizationContent.test.tsx
index f4275882e6..379f596741 100644
--- a/frontends/main/src/app-pages/DashboardPage/OrganizationContent.test.tsx
+++ b/frontends/main/src/app-pages/DashboardPage/OrganizationContent.test.tsx
@@ -24,6 +24,8 @@ describe("OrganizationContent", () => {
     mockedUseFeatureFlagEnabled.mockReturnValue(true)
     // Set default empty enrollments for all tests
     setMockResponse.get(urls.enrollment.enrollmentsList(), [])
+    // Add missing program enrollments mock
+    setMockResponse.get(urls.programEnrollments.enrollmentsList(), [])
   })
 
   it("displays a header for each program returned and cards for courses in program", async () => {
@@ -300,4 +302,41 @@ describe("OrganizationContent", () => {
       )
     })
   })
+
+  test("Shows the program certificate link button if the program has a certificate", async () => {
+    const { orgX, programA } = setupProgramsAndCourses()
+
+    // Mock the program to have a certificate
+    const programWithCertificate = {
+      ...programA,
+      program_type: "Program", // Set specific program type
+      certificate: {
+        uuid: "cert-123",
+        url: "/certificates/program/1",
+      },
+    }
+    const programEnrollment = factories.enrollment.programEnrollment({
+      program: { id: programWithCertificate.id },
+      certificate: {
+        link: programWithCertificate.certificate.url,
+      },
+    })
+    setMockResponse.get(urls.programs.programsList({ org_id: orgX.id }), {
+      results: [programWithCertificate],
+    })
+    setMockResponse.get(urls.programEnrollments.enrollmentsList(), [
+      programEnrollment,
+    ])
+
+    renderWithProviders(<OrganizationContent orgSlug={orgX.slug} />)
+
+    const programRoot = await screen.findByTestId("org-program-root")
+    const certificateButton = within(programRoot).getByRole("link", {
+      name: "View Program Certificate",
+    })
+    expect(certificateButton).toHaveAttribute(
+      "href",
+      programWithCertificate.certificate.url,
+    )
+  })
 })
diff --git a/frontends/main/src/app-pages/DashboardPage/OrganizationContent.tsx b/frontends/main/src/app-pages/DashboardPage/OrganizationContent.tsx
index fb7283c24c..9a9fc29d35 100644
--- a/frontends/main/src/app-pages/DashboardPage/OrganizationContent.tsx
+++ b/frontends/main/src/app-pages/DashboardPage/OrganizationContent.tsx
@@ -23,8 +23,11 @@ import graduateLogo from "@/public/images/dashboard/graduate.png"
 import {
   CourseRunEnrollment,
   OrganizationPage,
+  UserProgramEnrollmentDetail,
 } from "@mitodl/mitxonline-api-axios/v2"
 import { useMitxOnlineCurrentUser } from "api/mitxonline-hooks/user"
+import { ButtonLink } from "@mitodl/smoot-design"
+import { RiAwardFill } from "@remixicon/react"
 
 const HeaderRoot = styled.div({
   display: "flex",
@@ -78,23 +81,45 @@ const DashboardCardStyled = styled(DashboardCard)({
     borderRadius: "0px 0px 8px 8px",
   },
 })
+
 const ProgramRoot = styled.div(({ theme }) => ({
   color: theme.custom.colors.darkGray2,
   boxShadow: "0px 4px 8px 0px rgba(19, 20, 21, 0.08)",
   backgroundColor: theme.custom.colors.white,
   borderRadius: "8px",
 }))
+
 const ProgramHeader = styled.div(({ theme }) => ({
   display: "flex",
   padding: "24px",
-  flexDirection: "column",
-
+  flexDirection: "row",
+  justifyContent: "space-between",
   gap: "16px",
   backgroundColor: theme.custom.colors.white,
   borderRadius: "8px 8px 0px 0px",
   border: `1px solid ${theme.custom.colors.lightGray2}`,
   borderBottom: `1px solid ${theme.custom.colors.red}`,
+  [theme.breakpoints.down("sm")]: {
+    flexDirection: "column",
+  },
 }))
+
+const ProgramHeaderText = styled.div({
+  flexDirection: "column",
+  gap: "8px",
+})
+
+const ProgramCertificateButton = styled(ButtonLink)(({ theme }) => ({
+  color: theme.custom.colors.red,
+  display: "flex",
+  width: "192px",
+  height: "32px",
+  padding: "12px 12px 12px 8px",
+  justifyContent: "center",
+  alignItems: "center",
+  gap: "10px",
+}))
+
 const ProgramDescription = styled(Typography)({
   p: {
     margin: 0,
@@ -148,18 +173,24 @@ const OrgProgramCollectionDisplay: React.FC<{
   const { isLoading, programsWithCourses, hasAnyCourses } =
     useProgramCollectionCourses(collection.programIds, orgId)
 
+  const header = (
+    <ProgramHeader>
+      <ProgramHeaderText>
+        <Typography variant="h5" component="h2">
+          {collection.title}
+        </Typography>
+        <ProgramDescription
+          variant="body2"
+          dangerouslySetInnerHTML={{ __html: sanitizedDescription }}
+        />
+      </ProgramHeaderText>
+    </ProgramHeader>
+  )
+
   if (isLoading) {
     return (
       <ProgramRoot data-testid="org-program-collection-root">
-        <ProgramHeader>
-          <Typography variant="h5" component="h2">
-            {collection.title}
-          </Typography>
-          <ProgramDescription
-            variant="body2"
-            dangerouslySetInnerHTML={{ __html: sanitizedDescription }}
-          />
-        </ProgramHeader>
+        {header}
         <PlainList>
           <Skeleton
             width="100%"
@@ -178,15 +209,7 @@ const OrgProgramCollectionDisplay: React.FC<{
 
   return (
     <ProgramRoot data-testid="org-program-collection-root">
-      <ProgramHeader>
-        <Typography variant="h5" component="h2">
-          {collection.title}
-        </Typography>
-        <ProgramDescription
-          variant="body2"
-          dangerouslySetInnerHTML={{ __html: sanitizedDescription }}
-        />
-      </ProgramHeader>
+      {header}
       <PlainList>
         {programsWithCourses.map((item) =>
           item ? (
@@ -206,9 +229,20 @@ const OrgProgramCollectionDisplay: React.FC<{
 const OrgProgramDisplay: React.FC<{
   program: DashboardProgram
   courseRunEnrollments?: CourseRunEnrollment[]
+  programEnrollments?: UserProgramEnrollmentDetail[]
   programLoading: boolean
   orgId: number
-}> = ({ program, courseRunEnrollments, programLoading, orgId }) => {
+}> = ({
+  program,
+  courseRunEnrollments,
+  programEnrollments,
+  programLoading,
+  orgId,
+}) => {
+  const programEnrollment = programEnrollments?.find(
+    (enrollment) => enrollment.program.id === program.id,
+  )
+  const hasValidCertificate = !!programEnrollment?.certificate
   const courses = useQuery(
     coursesQueries.coursesList({ id: program.courseIds, org_id: orgId }),
   )
@@ -225,13 +259,25 @@ const OrgProgramDisplay: React.FC<{
   return (
     <ProgramRoot data-testid="org-program-root">
       <ProgramHeader>
-        <Typography variant="h5" component="h2">
-          {program.title}
-        </Typography>
-        <ProgramDescription
-          variant="body2"
-          dangerouslySetInnerHTML={{ __html: sanitizedHtml }}
-        />
+        <ProgramHeaderText>
+          <Typography variant="h5" component="h2">
+            {program.title}
+          </Typography>
+          <ProgramDescription
+            variant="body2"
+            dangerouslySetInnerHTML={{ __html: sanitizedHtml }}
+          />
+        </ProgramHeaderText>
+        {hasValidCertificate && (
+          <ProgramCertificateButton
+            size="small"
+            variant="bordered"
+            startIcon={<RiAwardFill />}
+            href={programEnrollment?.certificate?.link}
+          >
+            View {program.programType} Certificate
+          </ProgramCertificateButton>
+        )}
       </ProgramHeader>
       <PlainList>
         {transform
@@ -316,6 +362,9 @@ const OrganizationContentInternal: React.FC<
   const courseRunEnrollments = useQuery(
     enrollmentQueries.courseRunEnrollmentsList(),
   )
+  const programEnrollments = useQuery(
+    enrollmentQueries.programEnrollmentsList(),
+  )
   const programs = useQuery(programsQueries.programsList({ org_id: orgId }))
   const programCollections = useQuery(
     programCollectionQueries.programCollectionsList({}),
@@ -345,6 +394,7 @@ const OrganizationContentInternal: React.FC<
               key={program.key}
               program={program}
               courseRunEnrollments={courseRunEnrollments.data}
+              programEnrollments={programEnrollments.data}
               programLoading={programs.isLoading}
               orgId={orgId}
             />
diff --git a/frontends/main/src/app-pages/ErrorPage/ErrorPageTemplate.tsx b/frontends/main/src/app-pages/ErrorPage/ErrorPageTemplate.tsx
index f77e04b1b7..173e2aac8d 100644
--- a/frontends/main/src/app-pages/ErrorPage/ErrorPageTemplate.tsx
+++ b/frontends/main/src/app-pages/ErrorPage/ErrorPageTemplate.tsx
@@ -13,7 +13,7 @@ type ErrorPageTemplateProps = {
   loading?: boolean
 }
 
-const Page = styled(Container)(({ theme }) => ({
+const Page = styled.div(({ theme }) => ({
   backgroundImage: `url(${backgroundImage.src})`,
   backgroundAttachment: "fixed",
   backgroundRepeat: "no-repeat",
@@ -25,7 +25,7 @@ const Page = styled(Container)(({ theme }) => ({
   },
 }))
 
-const ErrorContainer = styled.div(({ theme }) => ({
+const ErrorContainer = styled(Container)(({ theme }) => ({
   padding: "56px 0",
   display: "flex",
   flexDirection: "column",
diff --git a/frontends/main/src/app/certificate/[certificateType]/[uuid]/page.tsx b/frontends/main/src/app/certificate/[certificateType]/[uuid]/page.tsx
new file mode 100644
index 0000000000..044e755952
--- /dev/null
+++ b/frontends/main/src/app/certificate/[certificateType]/[uuid]/page.tsx
@@ -0,0 +1,31 @@
+import React from "react"
+import { notFound } from "next/navigation"
+import CertificatePage from "@/app-pages/CertificatePage/CertificatePage"
+
+enum CertificateType {
+  Course = "course",
+  Program = "program",
+}
+
+interface PageProps {
+  params: Promise<{
+    certificateType: CertificateType
+    uuid: string
+  }>
+}
+
+const Page: React.FC<PageProps> = async ({ params }) => {
+  const { certificateType } = await params
+
+  if (
+    ![CertificateType.Course, CertificateType.Program].includes(
+      certificateType as CertificateType,
+    )
+  ) {
+    notFound()
+  }
+
+  return <CertificatePage />
+}
+
+export default Page
diff --git a/learning_resources/etl/utils.py b/learning_resources/etl/utils.py
index 06a31682d3..2d770f2507 100644
--- a/learning_resources/etl/utils.py
+++ b/learning_resources/etl/utils.py
@@ -463,14 +463,15 @@ def get_url_from_module_id(
         if run.learning_resource.etl_source == ETLSource.oll.value
         else run.run_id
     )
+    base_jump_url = f"{root_url}/courses/{run_id}/jump_to_id/"
     if module_id.startswith("asset"):
         video_meta = video_srt_metadata.get(module_id, {}) if video_srt_metadata else {}
         if video_meta:
             # Link to the parent video
-            return f"{root_url}/courses/{run_id}/jump_to/{video_meta.split('@')[-1]}"
+            return f"{base_jump_url}{video_meta.split('@')[-1]}"
         return f"{root_url}/{module_id}"
     elif module_id.startswith("block") and is_valid_uuid(module_id.split("@")[-1]):
-        return f"{root_url}/courses/{run_id}/jump_to_id/{module_id.split('@')[-1]}"
+        return f"{base_jump_url}{module_id.split('@')[-1]}"
     else:
         return None
 
diff --git a/learning_resources/etl/utils_test.py b/learning_resources/etl/utils_test.py
index 1ad8631436..52737c62e8 100644
--- a/learning_resources/etl/utils_test.py
+++ b/learning_resources/etl/utils_test.py
@@ -715,7 +715,7 @@ def test_get_video_metadata(mocker, tmp_path, video_dir_exists):
             "mit_edx",
             "asset-v1:test+type@asset+block@transcript.srt",
             True,
-            "https://edx.org/courses/course-v1:test_run/jump_to/test_video",
+            "https://edx.org/courses/course-v1:test_run/jump_to_id/test_video",
         ),
         (
             "mit_edx",
diff --git a/main/settings.py b/main/settings.py
index 313a791095..972f015718 100644
--- a/main/settings.py
+++ b/main/settings.py
@@ -34,7 +34,7 @@
 from main.settings_pluggy import *  # noqa: F403
 from openapi.settings_spectacular import open_spectacular_settings
 
-VERSION = "0.41.1"
+VERSION = "0.41.2"
 
 log = logging.getLogger()
 
diff --git a/yarn.lock b/yarn.lock
index d080767835..9da5db8882 100755
--- a/yarn.lock
+++ b/yarn.lock
@@ -3028,6 +3028,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@mitodl/mitxonline-api-axios@npm:2025.8.18":
+  version: 2025.8.18
+  resolution: "@mitodl/mitxonline-api-axios@npm:2025.8.18"
+  dependencies:
+    "@types/node": "npm:^20.11.19"
+    axios: "npm:^1.6.5"
+  checksum: 10/91ff2d63fd251ef07dcea8c34497ddbd3b24046ba639b5ac6819d7bcdef560ea4838ecfd2e8db7876d4611072c7d37250d0bd8bc7e643d96d17d61b4db0c192e
+  languageName: node
+  linkType: hard
+
 "@mitodl/open-api-axios@npm:2024.9.16":
   version: 2024.9.16
   resolution: "@mitodl/open-api-axios@npm:2024.9.16"
@@ -7363,7 +7373,7 @@ __metadata:
   resolution: "api@workspace:frontends/api"
   dependencies:
     "@faker-js/faker": "npm:^9.9.0"
-    "@mitodl/mitxonline-api-axios": "npm:2025.8.12"
+    "@mitodl/mitxonline-api-axios": "npm:2025.8.18"
     "@tanstack/react-query": "npm:^5.66.0"
     "@testing-library/react": "npm:^16.1.0"
     axios: "npm:^1.6.3"