diff --git a/docs/src/containers/DownloadApp/index.js b/docs/src/containers/DownloadApp/index.js
index 9d1cd6a48..e3e5b6d42 100644
--- a/docs/src/containers/DownloadApp/index.js
+++ b/docs/src/containers/DownloadApp/index.js
@@ -133,7 +133,7 @@ export default function DownloadApp() {
   }
 
   return (
-    <div className="w-full lg:w-3/5 mx-auto px-4">
+    <div className="w-full lg:w-3/4 mx-auto px-4">
       <div className="grid grid-cols-1 lg:grid-cols-3 py-10 gap-8">
         {groupTemnplate.map((item, i) => {
           return (
diff --git a/docs/src/containers/Testimonial/index.js b/docs/src/containers/Testimonial/index.js
index d5c86c082..04f566126 100644
--- a/docs/src/containers/Testimonial/index.js
+++ b/docs/src/containers/Testimonial/index.js
@@ -78,287 +78,289 @@ const Testimonial = () => {
 
   return (
     <div className="bg-[#F0F0F0] dark:bg-[#242424] p-8 mt-10 pb-20">
-      <div className="w-full xl:w-3/5 mx-auto relative py-8 text-center">
-        <h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
-          People say nice things
-        </h1>
-        <p className="leading-relaxed mt-2 text-black/60 dark:text-white/60 flex gap-x-2 justify-center">
-          ...despite our bugs and fast moving releases{' '}
-          <svg
-            width="24"
-            height="24"
-            viewBox="0 0 24 24"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <g clip-path="url(#clip0_1810_7276)">
-              <path
-                d="M24.0001 11.4301H22.8601V19.4326H24.0001V11.4301Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M22.8599 19.4325H21.7124V20.5725H22.8599V19.4325Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M22.8599 9.14246H21.7124V11.43H22.8599V9.14246Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M21.7125 20.5725H20.5725V21.72H21.7125V20.5725Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M21.7125 6.86255H20.5725V9.14255H21.7125V6.86255Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M20.5726 21.72H19.4326V22.86H20.5726V21.72Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M20.5726 5.71497H19.4326V6.86247H20.5726V5.71497Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M19.4324 2.28748H18.2849V5.71498H19.4324V2.28748Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M12.5701 22.86V21.72H14.8576V20.5725H11.4301V21.72H5.71509V22.86H11.4301V24H19.4326V22.86H12.5701Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M18.285 1.14746H17.145V2.28746H18.285V1.14746Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M17.1449 11.4301H14.8574V12.5701H17.1449V11.4301Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M16.0049 19.4325H14.8574V20.5725H16.0049V19.4325Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M17.145 0H13.7175V1.1475H17.145V0Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M14.8575 18.285H13.7175V19.4325H14.8575V18.285Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M14.8575 12.5699H13.7175V13.7174H14.8575V12.5699Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M16.005 2.28748H13.7175V4.57498H16.005V2.28748Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M13.7176 13.7175H12.5701V18.285H13.7176V13.7175Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M13.7176 1.14746H12.5701V2.28746H13.7176V1.14746Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M12.5699 2.28748H11.4299V4.57498H12.5699V2.28748Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M11.43 19.4325H10.29V20.5725H11.43V19.4325Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M10.2901 16.005H9.14258V19.4325H10.2901V16.005Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M11.4301 4.57495H9.14258V5.71495H11.4301V4.57495Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M9.14244 14.8575H8.00244V16.005H9.14244V14.8575Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M9.14244 6.86255H8.00244V8.00255H9.14244V6.86255Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M9.14244 2.28748H8.00244V4.57498H9.14244V2.28748Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M8.00255 1.14746H6.86255V2.28746H8.00255V1.14746Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M8.00245 8.00244H4.57495V9.14244H8.00245V8.00244Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M5.71495 20.5725H4.57495V21.72H5.71495V20.5725Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M6.86249 0H3.42749V1.1475H6.86249V0Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M1.1475 22.86V21.72H0V24H5.715V22.86H1.1475Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M8.0026 13.7175H2.2876V14.8575H8.0026V13.7175Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M5.71499 2.28748H3.42749V4.57498H5.71499V2.28748Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M3.42746 20.5725H4.57496V19.4325H2.28746V20.5725H1.14746V21.72H3.42746V20.5725Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M3.4276 5.71497H2.2876V8.00247H3.4276V5.71497Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M3.4276 1.14746H2.2876V2.28746H3.4276V1.14746Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M2.28746 18.285H1.14746V19.4325H2.28746V18.285Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M2.28746 8.00244H1.14746V10.2899H2.28746V8.00244Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M2.28746 2.28748H1.14746V5.71498H2.28746V2.28748Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-              <path
-                d="M2.2875 16.005V14.8575H1.1475V10.29H0V18.285H1.1475V16.005H2.2875Z"
-                className="fill-black/60 dark:fill-white/60"
-              />
-            </g>
-            <defs>
-              <clipPath id="clip0_1810_7276">
-                <rect width="24" height="24" fill="white" />
-              </clipPath>
-            </defs>
-          </svg>
-        </p>
-      </div>
-      <div className="w-full xl:w-3/4 mx-auto relative text-center">
-        <div data-theme={colorMode} className="mt-10">
-          <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 lg:gap-8 text-left">
-            <div className="space-y-4 lg:space-y-8">
-              {firstColumn.map((item, i) => {
-                if (item.type === 'tweet')
-                  return (
-                    <div key={i} className="tweet-wrapper">
-                      <Tweet id={item.id} />
-                    </div>
-                  )
-                if (item.type === 'youtube')
-                  return (
-                    <div key={i}>
-                      <iframe
-                        width="100%"
-                        height="260"
-                        src={`https://www.youtube.com/embed/${item.id}`}
-                        title="Install Jan to Run LLM Offline and Local First"
-                        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-                        allowFullScreen
-                        className="rounded-xl"
-                        loading="lazy"
-                      />
-                    </div>
-                  )
-              })}
-            </div>
-            <div className="space-y-4 lg:space-y-8">
-              {secondColumn.map((item, i) => {
-                if (item.type === 'tweet')
-                  return (
-                    <div key={i} className="tweet-wrapper">
-                      <Tweet id={item.id} />
-                    </div>
-                  )
-                if (item.type === 'youtube')
-                  return (
-                    <div key={i}>
-                      <iframe
-                        width="100%"
-                        height="260"
-                        src={`https://www.youtube.com/embed/${item.id}`}
-                        title="Install Jan to Run LLM Offline and Local First"
-                        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-                        allowFullScreen
-                        className="rounded-xl"
-                        loading="lazy"
-                      />
-                    </div>
-                  )
-              })}
-            </div>
-            <div className="space-y-4 lg:space-y-8">
-              {thirdColumn.map((item, i) => {
-                if (item.type === 'tweet')
-                  return (
-                    <div key={i} className="tweet-wrapper">
-                      <Tweet id={item.id} />
-                    </div>
-                  )
-                if (item.type === 'youtube')
-                  return (
-                    <div key={i}>
-                      <iframe
-                        width="100%"
-                        height="260"
-                        src={`https://www.youtube.com/embed/${item.id}`}
-                        title="Install Jan to Run LLM Offline and Local First"
-                        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-                        allowFullScreen
-                        className="rounded-xl"
-                        loading="lazy"
-                      />
-                    </div>
-                  )
-              })}
-            </div>
-            <div className="space-y-4 lg:space-y-8">
-              {fourthColumn.map((item, i) => {
-                if (item.type === 'tweet')
-                  return (
-                    <div key={i} className="tweet-wrapper">
-                      <Tweet id={item.id} />
-                    </div>
-                  )
-                if (item.type === 'youtube')
-                  return (
-                    <div key={i}>
-                      <iframe
-                        width="100%"
-                        height="260"
-                        src={`https://www.youtube.com/embed/${item.id}`}
-                        title="Install Jan to Run LLM Offline and Local First"
-                        allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
-                        allowFullScreen
-                        className="rounded-xl"
-                        loading="lazy"
-                      />
-                    </div>
-                  )
-              })}
+      <div className="container">
+        <div className="w-full mx-auto relative py-8 text-center">
+          <h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
+            People say nice things
+          </h1>
+          <p className="leading-relaxed mt-2 text-black/60 dark:text-white/60 flex gap-x-2 justify-center">
+            ...despite our bugs and fast moving releases{' '}
+            <svg
+              width="24"
+              height="24"
+              viewBox="0 0 24 24"
+              fill="none"
+              xmlns="http://www.w3.org/2000/svg"
+            >
+              <g clip-path="url(#clip0_1810_7276)">
+                <path
+                  d="M24.0001 11.4301H22.8601V19.4326H24.0001V11.4301Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M22.8599 19.4325H21.7124V20.5725H22.8599V19.4325Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M22.8599 9.14246H21.7124V11.43H22.8599V9.14246Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M21.7125 20.5725H20.5725V21.72H21.7125V20.5725Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M21.7125 6.86255H20.5725V9.14255H21.7125V6.86255Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M20.5726 21.72H19.4326V22.86H20.5726V21.72Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M20.5726 5.71497H19.4326V6.86247H20.5726V5.71497Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M19.4324 2.28748H18.2849V5.71498H19.4324V2.28748Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M12.5701 22.86V21.72H14.8576V20.5725H11.4301V21.72H5.71509V22.86H11.4301V24H19.4326V22.86H12.5701Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M18.285 1.14746H17.145V2.28746H18.285V1.14746Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M17.1449 11.4301H14.8574V12.5701H17.1449V11.4301Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M16.0049 19.4325H14.8574V20.5725H16.0049V19.4325Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M17.145 0H13.7175V1.1475H17.145V0Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M14.8575 18.285H13.7175V19.4325H14.8575V18.285Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M14.8575 12.5699H13.7175V13.7174H14.8575V12.5699Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M16.005 2.28748H13.7175V4.57498H16.005V2.28748Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M13.7176 13.7175H12.5701V18.285H13.7176V13.7175Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M13.7176 1.14746H12.5701V2.28746H13.7176V1.14746Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M12.5699 2.28748H11.4299V4.57498H12.5699V2.28748Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M11.43 19.4325H10.29V20.5725H11.43V19.4325Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M10.2901 16.005H9.14258V19.4325H10.2901V16.005Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M11.4301 4.57495H9.14258V5.71495H11.4301V4.57495Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M9.14244 14.8575H8.00244V16.005H9.14244V14.8575Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M9.14244 6.86255H8.00244V8.00255H9.14244V6.86255Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M9.14244 2.28748H8.00244V4.57498H9.14244V2.28748Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M8.00255 1.14746H6.86255V2.28746H8.00255V1.14746Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M8.00245 8.00244H4.57495V9.14244H8.00245V8.00244Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M5.71495 20.5725H4.57495V21.72H5.71495V20.5725Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M6.86249 0H3.42749V1.1475H6.86249V0Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M1.1475 22.86V21.72H0V24H5.715V22.86H1.1475Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M8.0026 13.7175H2.2876V14.8575H8.0026V13.7175Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M5.71499 2.28748H3.42749V4.57498H5.71499V2.28748Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M3.42746 20.5725H4.57496V19.4325H2.28746V20.5725H1.14746V21.72H3.42746V20.5725Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M3.4276 5.71497H2.2876V8.00247H3.4276V5.71497Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M3.4276 1.14746H2.2876V2.28746H3.4276V1.14746Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M2.28746 18.285H1.14746V19.4325H2.28746V18.285Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M2.28746 8.00244H1.14746V10.2899H2.28746V8.00244Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M2.28746 2.28748H1.14746V5.71498H2.28746V2.28748Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+                <path
+                  d="M2.2875 16.005V14.8575H1.1475V10.29H0V18.285H1.1475V16.005H2.2875Z"
+                  className="fill-black/60 dark:fill-white/60"
+                />
+              </g>
+              <defs>
+                <clipPath id="clip0_1810_7276">
+                  <rect width="24" height="24" fill="white" />
+                </clipPath>
+              </defs>
+            </svg>
+          </p>
+        </div>
+        <div className="w-full mx-auto relative text-center">
+          <div data-theme={colorMode} className="mt-10">
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 lg:gap-8 text-left">
+              <div className="space-y-4 lg:space-y-8">
+                {firstColumn.map((item, i) => {
+                  if (item.type === 'tweet')
+                    return (
+                      <div key={i} className="tweet-wrapper">
+                        <Tweet id={item.id} />
+                      </div>
+                    )
+                  if (item.type === 'youtube')
+                    return (
+                      <div key={i}>
+                        <iframe
+                          width="100%"
+                          height="260"
+                          src={`https://www.youtube.com/embed/${item.id}`}
+                          title="Install Jan to Run LLM Offline and Local First"
+                          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                          allowFullScreen
+                          className="rounded-xl"
+                          loading="lazy"
+                        />
+                      </div>
+                    )
+                })}
+              </div>
+              <div className="space-y-4 lg:space-y-8">
+                {secondColumn.map((item, i) => {
+                  if (item.type === 'tweet')
+                    return (
+                      <div key={i} className="tweet-wrapper">
+                        <Tweet id={item.id} />
+                      </div>
+                    )
+                  if (item.type === 'youtube')
+                    return (
+                      <div key={i}>
+                        <iframe
+                          width="100%"
+                          height="260"
+                          src={`https://www.youtube.com/embed/${item.id}`}
+                          title="Install Jan to Run LLM Offline and Local First"
+                          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                          allowFullScreen
+                          className="rounded-xl"
+                          loading="lazy"
+                        />
+                      </div>
+                    )
+                })}
+              </div>
+              <div className="space-y-4 lg:space-y-8">
+                {thirdColumn.map((item, i) => {
+                  if (item.type === 'tweet')
+                    return (
+                      <div key={i} className="tweet-wrapper">
+                        <Tweet id={item.id} />
+                      </div>
+                    )
+                  if (item.type === 'youtube')
+                    return (
+                      <div key={i}>
+                        <iframe
+                          width="100%"
+                          height="260"
+                          src={`https://www.youtube.com/embed/${item.id}`}
+                          title="Install Jan to Run LLM Offline and Local First"
+                          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                          allowFullScreen
+                          className="rounded-xl"
+                          loading="lazy"
+                        />
+                      </div>
+                    )
+                })}
+              </div>
+              <div className="space-y-4 lg:space-y-8">
+                {fourthColumn.map((item, i) => {
+                  if (item.type === 'tweet')
+                    return (
+                      <div key={i} className="tweet-wrapper">
+                        <Tweet id={item.id} />
+                      </div>
+                    )
+                  if (item.type === 'youtube')
+                    return (
+                      <div key={i}>
+                        <iframe
+                          width="100%"
+                          height="260"
+                          src={`https://www.youtube.com/embed/${item.id}`}
+                          title="Install Jan to Run LLM Offline and Local First"
+                          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
+                          allowFullScreen
+                          className="rounded-xl"
+                          loading="lazy"
+                        />
+                      </div>
+                    )
+                })}
+              </div>
             </div>
           </div>
         </div>
diff --git a/docs/src/pages/download.js b/docs/src/pages/download.js
index 4cbf471d8..b04af5d65 100644
--- a/docs/src/pages/download.js
+++ b/docs/src/pages/download.js
@@ -18,32 +18,34 @@ export default function Download() {
       >
         <main>
           {/* Hero */}
-          <div className="text-center px-4 py-20">
-            <h1 className="text-6xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
-              Download Jan for your desktop
-            </h1>
-            <p className="text-2xl -mt-1 leading-relaxed text-black/60 dark:text-white/60">
-              Turn your computer into an AI machine
-            </p>
-            <div className="my-8">
-              <DownloadApp />
-            </div>
+          <div className="container">
+            <div className="text-center px-4 py-20">
+              <h1 className="text-6xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
+                Download Jan for your desktop
+              </h1>
+              <p className="text-2xl -mt-1 leading-relaxed text-black/60 dark:text-white/60">
+                Turn your computer into an AI machine
+              </p>
+              <div className="my-8">
+                <DownloadApp />
+              </div>
 
-            <div className="mb-14">
-              <a
-                href="https://jan.ai/guides/install/"
-                target="_blank"
-                className="text-blue-500 hover:text-blue-500 pr-4 border-r border-black/40 dark:border-white/40 mr-4 inline-block"
-              >
-                Installation Guide
-              </a>
-              <a
-                href="https://jan.ai/changelog/"
-                target="_blank"
-                className="text-blue-500 hover:text-blue-500"
-              >
-                Changelog
-              </a>
+              <div className="mb-14">
+                <a
+                  href="https://jan.ai/guides/install/"
+                  target="_blank"
+                  className="text-blue-500 hover:text-blue-500 pr-4 border-r border-black/40 dark:border-white/40 mr-4 inline-block"
+                >
+                  Installation Guide
+                </a>
+                <a
+                  href="https://jan.ai/changelog/"
+                  target="_blank"
+                  className="text-blue-500 hover:text-blue-500"
+                >
+                  Changelog
+                </a>
+              </div>
             </div>
           </div>
         </main>
diff --git a/docs/src/pages/index.js b/docs/src/pages/index.js
index 0311c8153..9fd0d3b2c 100644
--- a/docs/src/pages/index.js
+++ b/docs/src/pages/index.js
@@ -148,666 +148,18 @@ export default function Home() {
   return (
     <>
       <Banner />
-      <Layout
-        description="Jan turns your computer into an AI machine by running LLMs locally on your computer. It's a privacy-focus, local-first, open-source solution."
-      >
+      <Layout description="Jan turns your computer into an AI machine by running LLMs locally on your computer. It's a privacy-focus, local-first, open-source solution.">
         <main>
           {/* Hero */}
-          <div className="text-center px-4 py-16">
-            <h1 className="text-6xl lg:text-8xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
-              Rethink the Computer
-            </h1>
-            <p className="text-2xl -mt-1 leading-relaxed text-black/60 dark:text-white/60">
-              Turn your computer into an AI machine
-            </p>
-            <div className="mt-10">
-              {!isBrowserChrome ? (
-                <a
-                  href="/download"
-                  className="inline-flex px-4 py-3 rounded-lg text-lg font-semibold cursor-pointer justify-center items-center space-x-2 dark:bg-white dark:text-black bg-black text-white dark:hover:text-black hover:text-white scroll-smooth"
-                >
-                  <span>Download Jan for PC</span>
-                </a>
-              ) : (
-                <Dropdown />
-              )}
-            </div>
-            <p className="mt-6 text-black/60 dark:text-white/60">
-              500K+ Downloads | Free & Open Source
-            </p>
-
-            <div className="w-4/5  mx-auto mt-10">
-              <ThemedImage
-                className="object-cover w-full object-center mx-auto h-full lg:-left-4 relative"
-                alt="App screenshots"
-                sources={{
-                  light: useBaseUrl('/img/homepage/app-frame-light.webp'),
-                  dark: useBaseUrl('/img/homepage/app-frame-dark.webp'),
-                }}
-              />
-            </div>
-          </div>
-
-          {/* Build with Love */}
-          <div className="w-full px-4 xl:w-3/5 mx-auto relative py-8">
-            <div className="text-center">
-              <h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
-                Built with love
+          <div className="container">
+            <div className="text-center px-4 py-16">
+              <h1 className="text-6xl lg:text-[80px] !font-normal leading-tight lg:leading-tight mt-2 font-serif">
+                Rethink the Computer
               </h1>
-              <p className="leading-relaxed text-black/60 dark:text-white/60">
-                Jan is entirely open-source. We build it transparently, guided
-                by the belief <br className="hidden lg:block" /> that AI's
-                future should be open and shared with everyone.
+              <p className="text-2xl -mt-1 leading-relaxed text-black/60 dark:text-white/60">
+                Turn your computer into an AI machine
               </p>
-            </div>
-
-            <div className="grid grid-cols-1 lg:grid-cols-3 gap-8 mt-8">
-              <a
-                href="https://github.com/janhq/jan"
-                target="_blank"
-                className="card-wrapper dark:card-wrapper-dark p-4 inline-flex px-4 py-3 rounded-lg cursor-pointer justify-center items-start space-x-4 min-h-28"
-              >
-                <span>
-                  <FaGithub className="text-3xl" />
-                </span>
-                <div className="flex-col">
-                  <div className="flex items-center gap-2">
-                    <h6 className="text-base">Github</h6>
-                    <div className="text-sm text-black/60 dark:text-white/60 flex items-center space-x-1 py-1 px-2 rounded-md bg-[#E9E9E9] dark:bg-[#484748]">
-                      <RiStarSFill className="text-lg text-[#CA8A04]" />
-                      <span className="font-semibold">
-                        {stargazers.count} stars
-                      </span>
-                    </div>
-                  </div>
-                  <p className="text-sm mt-1">
-                    Jan is entirely open source and free to use.
-                  </p>
-                </div>
-              </a>
-              <a
-                href="https://discord.gg/FTk2MvZwJH"
-                target="_blank"
-                className="card-wrapper dark:card-wrapper-dark p-4 inline-flex px-4 py-3 rounded-lg cursor-pointer justify-center items-start space-x-4 min-h-28"
-              >
-                <span>
-                  <FaDiscord className="text-3xl" />
-                </span>
-                <div className="flex-col">
-                  <div className="flex items-center gap-2">
-                    <h6 className="text-base">Discord</h6>
-                    <div className="text-sm text-black/60 dark:text-white/60 flex items-center space-x-1 py-1 px-2 rounded-md bg-[#E9E9E9] dark:bg-[#484748]">
-                      <div className="w-2 h-2 bg-green-500 rounded-full" />
-                      <span className="font-semibold">
-                        {data.presence_count} online
-                      </span>
-                    </div>
-                  </div>
-                  <p className="text-sm mt-1">
-                    Join the community to ask questions, get help and learn
-                    more.
-                  </p>
-                </div>
-              </a>
-              <a
-                href="https://github.com/orgs/janhq/projects/5/views/16"
-                target="_blank"
-                className="card-wrapper dark:card-wrapper-dark p-4 inline-flex px-4 py-3 rounded-lg cursor-pointer justify-center items-start space-x-4 min-h-28"
-              >
-                <span>
-                  <IoMapOutline className="text-3xl" />
-                </span>
-                <div className="flex-col">
-                  <div className="flex items-center gap-2">
-                    <h6 className="text-base">Roadmap</h6>
-                  </div>
-                  <p className="text-sm mt-1">
-                    We build in public. See where we're headed!
-                  </p>
-                </div>
-              </a>
-            </div>
-          </div>
-
-          {/* Wall of love */}
-          <Testimonial />
-
-          {/* Feature */}
-          <div className="w-full xl:w-10/12 mx-auto relative py-8 lg:pt-24">
-            <div className="flex p-4 lg:px-0 lg:justify-between flex-col lg:flex-row items-end">
-              <div className="w-full">
-                <h1 className="text-5xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
-                  Jan redefines <br className="hidden lg:block" /> how we use
-                  computers
-                </h1>
-              </div>
-              <div className="mt-10 w-full lg:w-1/2 mr-auto lg:text-right">
-                <a
-                  className="mt-6 text-blue-600 dark:text-blue-400 cursor-pointer"
-                  href="https://jan.ai/features/"
-                  target="_blank"
-                >
-                  View Our Features <BsArrowRight className="inline-block" />
-                </a>
-              </div>
-            </div>
-
-            <div className="flex lg:flex-row flex-col items-start gap-8 mt-10">
-              <div className="w-full lg:w-2/5 px-4 lg:p-0">
-                {features.map((feature, i) => {
-                  const isActive = activeFeature === i
-                  return (
-                    <div
-                      key={i}
-                      className="mb-4 dark:bg-[#1F1F1F] bg-[#F5F5F5] p-6 rounded-xl cursor-pointer"
-                      onClick={() => setActiveFeature(i)}
-                    >
-                      <div
-                        className={twMerge(
-                          'flex items-center gap-4',
-                          isActive && 'items-start'
-                        )}
-                      >
-                        <h1 className="dark:text-[#4C4C4C] text-[#C4C4C4] text-[32px]">
-                          0{i + 1}
-                        </h1>
-                        <div>
-                          <h6 className="text-xl">{feature.title}</h6>
-                          <p
-                            className={twMerge(
-                              'mt-1 leading-relaxed text-black/60 dark:text-white/60 hidden',
-                              isActive && 'block'
-                            )}
-                          >
-                            {feature.description}
-                          </p>
-                        </div>
-                      </div>
-                    </div>
-                  )
-                })}
-              </div>
-
-              <div className="relative w-full -right-[10%] rounded-l-3xl overflow-hidden hidden lg:block">
-                {activeFeature === 0 && (
-                  <ThemedImage
-                    alt="App screenshots"
-                    sources={{
-                      light: useBaseUrl('/img/homepage/features01.webp'),
-                      dark: useBaseUrl('/img/homepage/features01dark.webp'),
-                    }}
-                  />
-                )}
-                {activeFeature === 1 && (
-                  <ThemedImage
-                    alt="App screenshots"
-                    sources={{
-                      light: useBaseUrl('/img/homepage/features02.webp'),
-                      dark: useBaseUrl('/img/homepage/features02dark.webp'),
-                    }}
-                  />
-                )}
-                {activeFeature === 2 && (
-                  <ThemedImage
-                    alt="App screenshots"
-                    sources={{
-                      light: useBaseUrl('/img/homepage/features03.webp'),
-                      dark: useBaseUrl('/img/homepage/features03dark.webp'),
-                    }}
-                  />
-                )}
-                {activeFeature === 3 && (
-                  <ThemedImage
-                    alt="App screenshots"
-                    sources={{
-                      light: useBaseUrl('/img/homepage/features04.webp'),
-                      dark: useBaseUrl('/img/homepage/features04dark.webp'),
-                    }}
-                  />
-                )}
-              </div>
-            </div>
-          </div>
-
-          {/* Philosophy */}
-          <div className="px-4 lg:px-8 mt-10 lg:mt-20 border-y border-[#F0F0F0] dark:border-gray-800">
-            <div className="w-full xl:w-3/4 mx-auto relative pt-8 text-center">
-              <h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
-                Our Philosophy
-              </h1>
-              <p className="leading-relaxed mt-2 text-black/60 dark:text-white/60 flex gap-x-2 justify-center">
-                Jan is opinionated software on what AI should be{' '}
-                <svg
-                  width="24"
-                  height="24"
-                  viewBox="0 0 24 24"
-                  fill="none"
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  <path
-                    d="M10.5 0H15V1.5H13.5V3H18V4.5H16.5V6H15V7.5H13.5V9H12V10.5H13.5V12H15V13.5H10.5V16.5H9V12H7.5V10.5H6V9H7.5V7.5H9V6H10.5V4.5H12V1.5H10.5V0Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M21 0H22.5V1.5H21V0Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M9 1.5H10.5V4.5H9V1.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M18 1.5H21V3H18V1.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M4.5 10.5H6V12H4.5V10.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M3 12H4.5V13.5H3V12Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M0 13.5H3V15H0V13.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M15 13.5H16.5V15H21V16.5H15V13.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M7.5 16.5H9V18H12V19.5H7.5V21H3V19.5H6V18H7.5V16.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M12 16.5H15V18H12V16.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M21 16.5H22.5V18H21V16.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M15 18H16.5V19.5H15V18Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M19.5 18H21V19.5H19.5V18Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M16.5 19.5H19.5V21H16.5V19.5Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M1.5 21H3V22.5H1.5V21Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M7.5 21H9V22.5H12V24H3V22.5H7.5V21Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                  <path
-                    d="M12 21H16.5V22.5H12V21Z"
-                    className="fill-black/60 dark:fill-white/60"
-                  />
-                </svg>
-              </p>
-
-              <div className="grid grid-cols-1 lg:grid-cols-3 gap-8 text-left mt-16">
-                <div>
-                  <svg
-                    width="32"
-                    height="32"
-                    viewBox="0 0 32 32"
-                    fill="none"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M28.96 13.72V9.14H27.43V10.67H24.39V7.62H25.91V6.1H22.86V3.05H21.34V0H4.58V1.52H1.53V13.72H0V32H32V13.72H28.96ZM22.86 7.62V12.19H27.43V13.72H15.24V7.62H22.86ZM3.05 3.05H4.58V13.72H3.05V3.05ZM9.15 18.29H7.62V19.81H4.58V18.29H3.05V16.76H9.15V18.29ZM9.15 13.72H6.1V1.52H19.81V3.05H9.15V13.72ZM10.67 4.57H21.34V6.1H13.72V13.72H10.67V4.57ZM30.48 30.48H12.2V15.24H30.48V30.48Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M28.9601 22.86H27.4301V24.38H28.9601V22.86Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M28.9601 27.43H19.8101V28.95H28.9601V27.43Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M27.43 7.62H25.91V9.14H27.43V7.62Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M25.91 24.38H22.86V25.91H25.91V24.38Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M21.3401 22.86H19.8101V24.38H21.3401V22.86Z"
-                      fill="#4377E9"
-                    />
-                  </svg>
-                  <h5 className="mt-4 mb-2">Local-first</h5>
-                  <p className="text-black/60 dark:text-white/60">
-                    We believe your conversations and files should remain yours
-                    alone. That's why we prioritize local-first AI, running
-                    open-source models directly on your computer.
-                  </p>
-                </div>
-                <div>
-                  <svg
-                    width="29"
-                    height="32"
-                    viewBox="0 0 29 32"
-                    fill="none"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M28.9495 22.8602H24.3795V21.3302H25.8995V19.8103H3.04994V21.3302H4.57491V22.8602H0V32H28.9495V22.8602ZM6.08989 21.3302H22.8496V22.8602H6.08989V21.3302ZM27.4295 30.4801H1.51997V24.3802H27.4295V30.4801Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M27.4294 1.52042H25.8994V19.8101H27.4294V1.52042Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M24.3795 25.8996H16.7596V27.4296H24.3795V25.8996Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M18.2796 10.6697H16.7596V12.1897H18.2796V10.6697Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M18.2796 7.62H16.7596V9.13997H18.2796V7.62Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M16.7596 12.1889H12.1897V13.7089H16.7596V12.1889Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M12.1896 10.6697H10.6597V12.1897H12.1896V10.6697Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M12.1896 7.62H10.6597V9.13997H12.1896V7.62Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M4.57483 18.2895H24.3845V3.04974H4.57483V18.2895ZM6.0898 4.56972H22.8495V16.7595H6.0898V4.56972Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M7.61977 25.8996H4.56982V28.9495H7.61977V25.8996Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M25.8995 0H3.04993V1.51997H25.8995V0Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M3.04987 1.52042H1.5199V19.8101H3.04987V1.52042Z"
-                      fill="#4377E9"
-                    />
-                  </svg>
-                  <h5 className="mt-4 mb-2">User-owned</h5>
-                  <p className="text-black/60 dark:text-white/60">
-                    Your data, your rules. Jan stores everything on your device
-                    in universal formats, giving you total freedom to move your
-                    data without tricks or traps.
-                  </p>
-                </div>
-                <div>
-                  <svg
-                    width="28"
-                    height="32"
-                    viewBox="0 0 28 32"
-                    fill="none"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M27.715 9.90503H26.185V28.195H27.715V9.90503Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M26.185 28.195H24.665V29.715H26.185V28.195Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M26.185 8.38501H24.665V9.90501H26.185V8.38501Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M24.665 29.715H3.33496V31.235H24.665V29.715Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M24.665 6.85501H18.565V8.38501H24.665V6.85501Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M18.565 3.80502H17.045V6.85502H18.565V3.80502Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M17.045 2.285H15.525V3.805H17.045V2.285Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M15.525 0.765015H12.475V2.28501H15.525V0.765015Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M12.4749 2.285H10.9449V3.805H12.4749V2.285Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M10.945 3.80502H9.42499V6.85502H10.945V3.80502Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M7.905 17.525H6.375V20.575H7.905V17.525Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M6.37498 20.575H4.85498V22.095H6.37498V20.575Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M6.37498 15.995H4.85498V17.525H6.37498V15.995Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M9.42496 6.85501H3.33496V8.38501H9.42496V6.85501Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M1.80497 14.475V9.90503H0.284973V15.995H4.85497V14.475H1.80497Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M3.33499 28.195H1.80499V29.715H3.33499V28.195Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M3.33499 8.38501H1.80499V9.90501H3.33499V8.38501Z"
-                      fill="#4377E9"
-                    />
-                    <path
-                      d="M1.80497 23.615H4.85497V22.095H0.284973V28.195H1.80497V23.615Z"
-                      fill="#4377E9"
-                    />
-                  </svg>
-
-                  <h5 className="mt-4 mb-2">Fully Customizable</h5>
-                  <p className="text-black/60 dark:text-white/60">
-                    You can endlessly customize the experience with 3rd party
-                    extensions. You can adjust alignment, moderation, and
-                    censorship levels to your needs.
-                  </p>
-                </div>
-              </div>
-
-              <div className="mt-20 flex dark:bg-[#181818] bg-[#FAFAFA] border border-gray-300 dark:border-gray-600 rounded-t-2xl border-b-0">
-                <div className="w-56 lg:w-80 border-r border-gray-300 dark:border-gray-600">
-                  <div className="h-[52px]"></div>
-                  {table.labels.map((label, i) => {
-                    return (
-                      <div
-                        className="border-t border-gray-300 dark:border-gray-600 p-4 font-bold text-left"
-                        title={label}
-                        key={i}
-                      >
-                        <h6 className="line-clamp-1 my-[2px]">{label}</h6>
-                      </div>
-                    )
-                  })}
-                </div>
-
-                <div className="w-full lg:w-1/2 border-r border-gray-300 dark:border-gray-600 hidden md:block">
-                  <h6 className="p-4 mb-0">Status Quo</h6>
-                  {table.statusQuo.map((label, i) => {
-                    return (
-                      <div
-                        className="border-t border-gray-300 dark:border-gray-600 p-4"
-                        key={i}
-                        title={label}
-                      >
-                        <p className="text-black/60 dark:text-white/60 line-clamp-1">
-                          {label}
-                        </p>
-                      </div>
-                    )
-                  })}
-                </div>
-                <div className="w-full lg:w-1/2">
-                  <div className="flex p-4 items-center gap-x-2 justify-center">
-                    <img
-                      src="img/logo.svg"
-                      alt="logo-mark"
-                      width={20}
-                      height={20}
-                    />
-                    <h6 className="mb-0">Jan</h6>
-                  </div>
-                  {table.jan.map((label, i) => {
-                    return (
-                      <div
-                        className="border-t border-gray-300 dark:border-gray-600 p-4"
-                        key={i}
-                        title={label}
-                      >
-                        <p className="text-black/60 dark:text-white/60 line-clamp-1">
-                          {label}
-                        </p>
-                      </div>
-                    )
-                  })}
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* CTA email newsletter */}
-          <div className="bg-[#F0F0F0] dark:bg-[#242424] text-center py-16">
-            <div className="w-full xl:w-10/12 mx-auto relative">
-              <div className="flex p-4 lg:justify-between flex-col lg:flex-row items-end">
-                <div className="w-full">
-                  <ThemedImage
-                    className="w-28 mx-auto h-auto"
-                    alt="App screenshots"
-                    sources={{
-                      light: useBaseUrl('/img/homepage/mac-system-black.svg'),
-                      dark: useBaseUrl('/img/homepage/mac-system-white.svg'),
-                    }}
-                  />
-                  <h1 className="text-5xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
-                    The Soul of a New Machine
-                  </h1>
-                  <p className="leading-relaxed text-black/60 dark:text-white/60">
-                    Follow our AI research and journey in building Jan
-                  </p>
-
-                  <div className="w-full lg:w-1/2 mt-8 mx-auto">
-                    <form
-                      className="relative"
-                      onSubmit={handleSubmit(onSubmit)}
-                    >
-                      <input
-                        type="email"
-                        className="w-full h-16 p-4 pr-14 rounded-xl border border-[#F0F0F0] dark:bg-white/10 dark:border-gray-600"
-                        placeholder="Enter your email"
-                        {...register('email')}
-                      />
-                      <button
-                        type="submit"
-                        className="absolute flex p-2 px-4 items-center dark:text-black bg-black text-white dark:bg-white h-12 border border-gray-600 rounded-lg top-1/2 right-3 -translate-y-1/2 font-medium"
-                      >
-                        Subscribe
-                      </button>
-                    </form>
-                    {formMessage && (
-                      <p className="text-left mt-4">{formMessage}</p>
-                    )}
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* Location and statistic */}
-          <div className="lg:w-4/5 w-full px-4 mx-auto py-10 lg:pb-20 lg:pt-32">
-            <div className="w-full lg:w-3/4 mx-auto pb-20">
-              <div className="grid grid-cols-2 lg:grid-cols-4 gap-4">
-                <div className="text-center">
-                  <h1>13</h1>
-                  <p className="font-medium text-black/60 dark:text-white/60">
-                    Core team
-                  </p>
-                </div>
-                <div className="text-center">
-                  <h1>39+</h1>
-                  <p className="font-medium text-black/60 dark:text-white/60">
-                    Contributors
-                  </p>
-                </div>
-                <div className="text-center">
-                  <h1>2416+</h1>
-                  <p className="font-medium text-black/60 dark:text-white/60">
-                    Pull Requests
-                  </p>
-                </div>
-                <div className="text-center">
-                  <h1>500K+</h1>
-                  <p className="font-medium text-black/60 dark:text-white/60">
-                    Downloads
-                  </p>
-                </div>
-              </div>
-            </div>
-            <ThemedImage
-              className="w-full mx-auto h-auto"
-              alt="App screenshots"
-              sources={{
-                light: useBaseUrl('/img/homepage/mapbase-light.webp'),
-                dark: useBaseUrl('/img/homepage/mapbase.webp'),
-              }}
-            />
-          </div>
-
-          {/* CTA Bottom */}
-          <div className="w-full xl:w-10/12 mx-auto relative py-8">
-            <div className="flex p-4 lg:justify-between flex-col lg:flex-row">
-              <div className="w-full">
-                <h1 className="text-5xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
-                  Change how <br className="hidden lg:block" /> you use
-                  computers
-                </h1>
-              </div>
-              <div className="mt-10 w-full lg:w-1/2 mx-auto lg:mr-auto lg:text-right">
+              <div className="mt-10">
                 {!isBrowserChrome ? (
                   <a
                     href="/download"
@@ -818,10 +170,670 @@ export default function Home() {
                 ) : (
                   <Dropdown />
                 )}
-                <p className="mt-6 text-zinc-text-black/60 dark:text-white/60">
-                  500K+ Downloads | Free & Open Source
+              </div>
+              <p className="mt-6 text-black/60 dark:text-white/60">
+                500K+ Downloads | Free & Open Source
+              </p>
+
+              <div className="w-4/5  mx-auto mt-10">
+                <ThemedImage
+                  className="object-cover w-full object-center mx-auto h-full lg:-left-4 relative"
+                  alt="App screenshots"
+                  sources={{
+                    light: useBaseUrl('/img/homepage/app-frame-light.webp'),
+                    dark: useBaseUrl('/img/homepage/app-frame-dark.webp'),
+                  }}
+                />
+              </div>
+            </div>
+          </div>
+
+          {/* Build with Love */}
+          <div className="container">
+            <div className="w-full px-4 xl:w-3/4 mx-auto relative py-8">
+              <div className="text-center">
+                <h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
+                  Built with love
+                </h1>
+                <p className="leading-relaxed text-black/60 dark:text-white/60">
+                  Jan is entirely open-source. We build it transparently, guided
+                  by the belief <br className="hidden lg:block" /> that AI's
+                  future should be open and shared with everyone.
                 </p>
               </div>
+
+              <div className="grid grid-cols-1 lg:grid-cols-3 gap-8 mt-8">
+                <a
+                  href="https://github.com/janhq/jan"
+                  target="_blank"
+                  className="card-wrapper dark:card-wrapper-dark p-4 inline-flex px-4 py-3 rounded-lg cursor-pointer justify-center items-start space-x-4 min-h-28"
+                >
+                  <span>
+                    <FaGithub className="text-3xl" />
+                  </span>
+                  <div className="flex-col">
+                    <div className="flex items-center gap-2">
+                      <h6 className="text-base">Github</h6>
+                      <div className="text-sm text-black/60 dark:text-white/60 flex items-center space-x-1 py-1 px-2 rounded-md bg-[#E9E9E9] dark:bg-[#484748]">
+                        <RiStarSFill className="text-lg text-[#CA8A04]" />
+                        <span className="font-semibold">
+                          {stargazers.count} stars
+                        </span>
+                      </div>
+                    </div>
+                    <p className="text-sm mt-1">
+                      Jan is entirely open source and free to use.
+                    </p>
+                  </div>
+                </a>
+                <a
+                  href="https://discord.gg/FTk2MvZwJH"
+                  target="_blank"
+                  className="card-wrapper dark:card-wrapper-dark p-4 inline-flex px-4 py-3 rounded-lg cursor-pointer justify-center items-start space-x-4 min-h-28"
+                >
+                  <span>
+                    <FaDiscord className="text-3xl" />
+                  </span>
+                  <div className="flex-col">
+                    <div className="flex items-center gap-2">
+                      <h6 className="text-base">Discord</h6>
+                      <div className="text-sm text-black/60 dark:text-white/60 flex items-center space-x-1 py-1 px-2 rounded-md bg-[#E9E9E9] dark:bg-[#484748]">
+                        <div className="w-2 h-2 bg-green-500 rounded-full" />
+                        <span className="font-semibold">
+                          {data.presence_count} online
+                        </span>
+                      </div>
+                    </div>
+                    <p className="text-sm mt-1">
+                      Join the community to ask questions, get help and learn
+                      more.
+                    </p>
+                  </div>
+                </a>
+                <a
+                  href="https://github.com/orgs/janhq/projects/5/views/16"
+                  target="_blank"
+                  className="card-wrapper dark:card-wrapper-dark p-4 inline-flex px-4 py-3 rounded-lg cursor-pointer justify-center items-start space-x-4 min-h-28"
+                >
+                  <span>
+                    <IoMapOutline className="text-3xl" />
+                  </span>
+                  <div className="flex-col">
+                    <div className="flex items-center gap-2">
+                      <h6 className="text-base">Roadmap</h6>
+                    </div>
+                    <p className="text-sm mt-1">
+                      We build in public. See where we're headed!
+                    </p>
+                  </div>
+                </a>
+              </div>
+            </div>
+          </div>
+
+          {/* Wall of love */}
+          <Testimonial />
+
+          {/* Feature */}
+          <div className="container">
+            <div className="w-full mx-auto relative py-8 lg:pt-24">
+              <div className="flex p-4 lg:px-0 lg:justify-between flex-col lg:flex-row items-end">
+                <div className="w-full">
+                  <h1 className="text-5xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
+                    Jan redefines <br className="hidden lg:block" /> how we use
+                    computers
+                  </h1>
+                </div>
+                <div className="mt-10 w-full lg:w-1/2 mr-auto lg:text-right">
+                  <a
+                    className="mt-6 text-blue-600 dark:text-blue-400 cursor-pointer"
+                    href="https://jan.ai/features/"
+                    target="_blank"
+                  >
+                    View Our Features <BsArrowRight className="inline-block" />
+                  </a>
+                </div>
+              </div>
+
+              <div className="flex lg:flex-row flex-col items-start gap-8 mt-10">
+                <div className="w-full lg:w-2/5 px-4 lg:p-0">
+                  {features.map((feature, i) => {
+                    const isActive = activeFeature === i
+                    return (
+                      <div
+                        key={i}
+                        className="mb-4 dark:bg-[#1F1F1F] bg-[#F5F5F5] p-6 rounded-xl cursor-pointer"
+                        onClick={() => setActiveFeature(i)}
+                      >
+                        <div
+                          className={twMerge(
+                            'flex items-center gap-4',
+                            isActive && 'items-start'
+                          )}
+                        >
+                          <h1 className="dark:text-[#4C4C4C] text-[#C4C4C4] text-[32px]">
+                            0{i + 1}
+                          </h1>
+                          <div>
+                            <h6 className="text-xl">{feature.title}</h6>
+                            <p
+                              className={twMerge(
+                                'mt-1 leading-relaxed text-black/60 dark:text-white/60 hidden',
+                                isActive && 'block'
+                              )}
+                            >
+                              {feature.description}
+                            </p>
+                          </div>
+                        </div>
+                      </div>
+                    )
+                  })}
+                </div>
+
+                <div className="relative w-full -right-[10%] rounded-l-3xl overflow-hidden hidden lg:block">
+                  {activeFeature === 0 && (
+                    <ThemedImage
+                      alt="App screenshots"
+                      sources={{
+                        light: useBaseUrl('/img/homepage/features01.webp'),
+                        dark: useBaseUrl('/img/homepage/features01dark.webp'),
+                      }}
+                    />
+                  )}
+                  {activeFeature === 1 && (
+                    <ThemedImage
+                      alt="App screenshots"
+                      sources={{
+                        light: useBaseUrl('/img/homepage/features02.webp'),
+                        dark: useBaseUrl('/img/homepage/features02dark.webp'),
+                      }}
+                    />
+                  )}
+                  {activeFeature === 2 && (
+                    <ThemedImage
+                      alt="App screenshots"
+                      sources={{
+                        light: useBaseUrl('/img/homepage/features03.webp'),
+                        dark: useBaseUrl('/img/homepage/features03dark.webp'),
+                      }}
+                    />
+                  )}
+                  {activeFeature === 3 && (
+                    <ThemedImage
+                      alt="App screenshots"
+                      sources={{
+                        light: useBaseUrl('/img/homepage/features04.webp'),
+                        dark: useBaseUrl('/img/homepage/features04dark.webp'),
+                      }}
+                    />
+                  )}
+                </div>
+              </div>
+            </div>
+          </div>
+
+          {/* Philosophy */}
+          <div className="px-4 lg:px-8 mt-10 lg:mt-20 border-y border-[#F0F0F0] dark:border-gray-800">
+            <div className="container">
+              <div className="w-full mx-auto relative pt-8 text-center">
+                <h1 className="text-5xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
+                  Our Philosophy
+                </h1>
+                <p className="leading-relaxed mt-2 text-black/60 dark:text-white/60 flex gap-x-2 justify-center">
+                  Jan is opinionated software on what AI should be{' '}
+                  <svg
+                    width="24"
+                    height="24"
+                    viewBox="0 0 24 24"
+                    fill="none"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10.5 0H15V1.5H13.5V3H18V4.5H16.5V6H15V7.5H13.5V9H12V10.5H13.5V12H15V13.5H10.5V16.5H9V12H7.5V10.5H6V9H7.5V7.5H9V6H10.5V4.5H12V1.5H10.5V0Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M21 0H22.5V1.5H21V0Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M9 1.5H10.5V4.5H9V1.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M18 1.5H21V3H18V1.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M4.5 10.5H6V12H4.5V10.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M3 12H4.5V13.5H3V12Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M0 13.5H3V15H0V13.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M15 13.5H16.5V15H21V16.5H15V13.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M7.5 16.5H9V18H12V19.5H7.5V21H3V19.5H6V18H7.5V16.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M12 16.5H15V18H12V16.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M21 16.5H22.5V18H21V16.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M15 18H16.5V19.5H15V18Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M19.5 18H21V19.5H19.5V18Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M16.5 19.5H19.5V21H16.5V19.5Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M1.5 21H3V22.5H1.5V21Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M7.5 21H9V22.5H12V24H3V22.5H7.5V21Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                    <path
+                      d="M12 21H16.5V22.5H12V21Z"
+                      className="fill-black/60 dark:fill-white/60"
+                    />
+                  </svg>
+                </p>
+
+                <div className="grid grid-cols-1 lg:grid-cols-3 gap-8 text-left mt-16">
+                  <div>
+                    <svg
+                      width="32"
+                      height="32"
+                      viewBox="0 0 32 32"
+                      fill="none"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M28.96 13.72V9.14H27.43V10.67H24.39V7.62H25.91V6.1H22.86V3.05H21.34V0H4.58V1.52H1.53V13.72H0V32H32V13.72H28.96ZM22.86 7.62V12.19H27.43V13.72H15.24V7.62H22.86ZM3.05 3.05H4.58V13.72H3.05V3.05ZM9.15 18.29H7.62V19.81H4.58V18.29H3.05V16.76H9.15V18.29ZM9.15 13.72H6.1V1.52H19.81V3.05H9.15V13.72ZM10.67 4.57H21.34V6.1H13.72V13.72H10.67V4.57ZM30.48 30.48H12.2V15.24H30.48V30.48Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M28.9601 22.86H27.4301V24.38H28.9601V22.86Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M28.9601 27.43H19.8101V28.95H28.9601V27.43Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M27.43 7.62H25.91V9.14H27.43V7.62Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M25.91 24.38H22.86V25.91H25.91V24.38Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M21.3401 22.86H19.8101V24.38H21.3401V22.86Z"
+                        fill="#4377E9"
+                      />
+                    </svg>
+                    <h5 className="mt-4 mb-2">Local-first</h5>
+                    <p className="text-black/60 dark:text-white/60">
+                      We believe your conversations and files should remain
+                      yours alone. That's why we prioritize local-first AI,
+                      running open-source models directly on your computer.
+                    </p>
+                  </div>
+                  <div>
+                    <svg
+                      width="29"
+                      height="32"
+                      viewBox="0 0 29 32"
+                      fill="none"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M28.9495 22.8602H24.3795V21.3302H25.8995V19.8103H3.04994V21.3302H4.57491V22.8602H0V32H28.9495V22.8602ZM6.08989 21.3302H22.8496V22.8602H6.08989V21.3302ZM27.4295 30.4801H1.51997V24.3802H27.4295V30.4801Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M27.4294 1.52042H25.8994V19.8101H27.4294V1.52042Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M24.3795 25.8996H16.7596V27.4296H24.3795V25.8996Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M18.2796 10.6697H16.7596V12.1897H18.2796V10.6697Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M18.2796 7.62H16.7596V9.13997H18.2796V7.62Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M16.7596 12.1889H12.1897V13.7089H16.7596V12.1889Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M12.1896 10.6697H10.6597V12.1897H12.1896V10.6697Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M12.1896 7.62H10.6597V9.13997H12.1896V7.62Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M4.57483 18.2895H24.3845V3.04974H4.57483V18.2895ZM6.0898 4.56972H22.8495V16.7595H6.0898V4.56972Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M7.61977 25.8996H4.56982V28.9495H7.61977V25.8996Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M25.8995 0H3.04993V1.51997H25.8995V0Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M3.04987 1.52042H1.5199V19.8101H3.04987V1.52042Z"
+                        fill="#4377E9"
+                      />
+                    </svg>
+                    <h5 className="mt-4 mb-2">User-owned</h5>
+                    <p className="text-black/60 dark:text-white/60">
+                      Your data, your rules. Jan stores everything on your
+                      device in universal formats, giving you total freedom to
+                      move your data without tricks or traps.
+                    </p>
+                  </div>
+                  <div>
+                    <svg
+                      width="28"
+                      height="32"
+                      viewBox="0 0 28 32"
+                      fill="none"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M27.715 9.90503H26.185V28.195H27.715V9.90503Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M26.185 28.195H24.665V29.715H26.185V28.195Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M26.185 8.38501H24.665V9.90501H26.185V8.38501Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M24.665 29.715H3.33496V31.235H24.665V29.715Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M24.665 6.85501H18.565V8.38501H24.665V6.85501Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M18.565 3.80502H17.045V6.85502H18.565V3.80502Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M17.045 2.285H15.525V3.805H17.045V2.285Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M15.525 0.765015H12.475V2.28501H15.525V0.765015Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M12.4749 2.285H10.9449V3.805H12.4749V2.285Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M10.945 3.80502H9.42499V6.85502H10.945V3.80502Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M7.905 17.525H6.375V20.575H7.905V17.525Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M6.37498 20.575H4.85498V22.095H6.37498V20.575Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M6.37498 15.995H4.85498V17.525H6.37498V15.995Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M9.42496 6.85501H3.33496V8.38501H9.42496V6.85501Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M1.80497 14.475V9.90503H0.284973V15.995H4.85497V14.475H1.80497Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M3.33499 28.195H1.80499V29.715H3.33499V28.195Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M3.33499 8.38501H1.80499V9.90501H3.33499V8.38501Z"
+                        fill="#4377E9"
+                      />
+                      <path
+                        d="M1.80497 23.615H4.85497V22.095H0.284973V28.195H1.80497V23.615Z"
+                        fill="#4377E9"
+                      />
+                    </svg>
+
+                    <h5 className="mt-4 mb-2">Fully Customizable</h5>
+                    <p className="text-black/60 dark:text-white/60">
+                      You can endlessly customize the experience with 3rd party
+                      extensions. You can adjust alignment, moderation, and
+                      censorship levels to your needs.
+                    </p>
+                  </div>
+                </div>
+
+                <div className="mt-20 flex dark:bg-[#181818] bg-[#FAFAFA] border border-gray-300 dark:border-gray-600 rounded-t-2xl border-b-0">
+                  <div className="w-56 lg:w-80 border-r border-gray-300 dark:border-gray-600">
+                    <div className="h-[52px]"></div>
+                    {table.labels.map((label, i) => {
+                      return (
+                        <div
+                          className="border-t border-gray-300 dark:border-gray-600 p-4 font-bold text-left"
+                          title={label}
+                          key={i}
+                        >
+                          <h6 className="line-clamp-1 my-[2px]">{label}</h6>
+                        </div>
+                      )
+                    })}
+                  </div>
+
+                  <div className="w-full lg:w-1/2 border-r border-gray-300 dark:border-gray-600 hidden md:block">
+                    <h6 className="p-4 mb-0">Status Quo</h6>
+                    {table.statusQuo.map((label, i) => {
+                      return (
+                        <div
+                          className="border-t border-gray-300 dark:border-gray-600 p-4"
+                          key={i}
+                          title={label}
+                        >
+                          <p className="text-black/60 dark:text-white/60 line-clamp-1">
+                            {label}
+                          </p>
+                        </div>
+                      )
+                    })}
+                  </div>
+                  <div className="w-full lg:w-1/2">
+                    <div className="flex p-4 items-center gap-x-2 justify-center">
+                      <img
+                        src="img/logo.svg"
+                        alt="logo-mark"
+                        width={20}
+                        height={20}
+                      />
+                      <h6 className="mb-0">Jan</h6>
+                    </div>
+                    {table.jan.map((label, i) => {
+                      return (
+                        <div
+                          className="border-t border-gray-300 dark:border-gray-600 p-4"
+                          key={i}
+                          title={label}
+                        >
+                          <p className="text-black/60 dark:text-white/60 line-clamp-1">
+                            {label}
+                          </p>
+                        </div>
+                      )
+                    })}
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          {/* CTA email newsletter */}
+          <div className="bg-[#F0F0F0] dark:bg-[#242424] text-center py-16">
+            <div className="container">
+              <div className="w-full xl:w-10/12 mx-auto relative">
+                <div className="flex p-4 lg:justify-between flex-col lg:flex-row items-end">
+                  <div className="w-full">
+                    <ThemedImage
+                      className="w-28 mx-auto h-auto"
+                      alt="App screenshots"
+                      sources={{
+                        light: useBaseUrl('/img/homepage/mac-system-black.svg'),
+                        dark: useBaseUrl('/img/homepage/mac-system-white.svg'),
+                      }}
+                    />
+                    <h1 className="text-5xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
+                      The Soul of a New Machine
+                    </h1>
+                    <p className="leading-relaxed text-black/60 dark:text-white/60">
+                      Follow our AI research and journey in building Jan
+                    </p>
+
+                    <div className="w-full lg:w-1/2 mt-8 mx-auto">
+                      <form
+                        className="relative"
+                        onSubmit={handleSubmit(onSubmit)}
+                      >
+                        <input
+                          type="email"
+                          className="w-full h-16 p-4 pr-14 rounded-xl border border-[#F0F0F0] dark:bg-white/10 dark:border-gray-600"
+                          placeholder="Enter your email"
+                          {...register('email')}
+                        />
+                        <button
+                          type="submit"
+                          className="absolute flex p-2 px-4 items-center dark:text-black bg-black text-white dark:bg-white h-12 border border-gray-600 rounded-lg top-1/2 right-3 -translate-y-1/2 font-medium"
+                        >
+                          Subscribe
+                        </button>
+                      </form>
+                      {formMessage && (
+                        <p className="text-left mt-4">{formMessage}</p>
+                      )}
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          {/* Location and statistic */}
+          <div className="lg:w-4/5 w-full px-4 mx-auto py-10 lg:pb-20 lg:pt-32">
+            <div className="container">
+              <div className="w-full lg:w-3/4 mx-auto pb-20">
+                <div className="grid grid-cols-2 lg:grid-cols-4 gap-4">
+                  <div className="text-center">
+                    <h1>13</h1>
+                    <p className="font-medium text-black/60 dark:text-white/60">
+                      Core team
+                    </p>
+                  </div>
+                  <div className="text-center">
+                    <h1>39+</h1>
+                    <p className="font-medium text-black/60 dark:text-white/60">
+                      Contributors
+                    </p>
+                  </div>
+                  <div className="text-center">
+                    <h1>2416+</h1>
+                    <p className="font-medium text-black/60 dark:text-white/60">
+                      Pull Requests
+                    </p>
+                  </div>
+                  <div className="text-center">
+                    <h1>500K+</h1>
+                    <p className="font-medium text-black/60 dark:text-white/60">
+                      Downloads
+                    </p>
+                  </div>
+                </div>
+              </div>
+              <ThemedImage
+                className="w-full mx-auto h-auto"
+                alt="App screenshots"
+                sources={{
+                  light: useBaseUrl('/img/homepage/mapbase-light.webp'),
+                  dark: useBaseUrl('/img/homepage/mapbase.webp'),
+                }}
+              />
+            </div>
+          </div>
+
+          {/* CTA Bottom */}
+          <div className="w-full xl:w-10/12 mx-auto relative py-8">
+            <div className="container">
+              <div className="flex p-4 lg:justify-between flex-col lg:flex-row">
+                <div className="w-full">
+                  <h1 className="text-5xl lg:text-7xl !font-normal leading-tight lg:leading-tight mt-2 font-serif">
+                    Change how <br className="hidden lg:block" /> you use
+                    computers
+                  </h1>
+                </div>
+                <div className="mt-10 w-full lg:w-1/2 mx-auto lg:mr-auto lg:text-right">
+                  {!isBrowserChrome ? (
+                    <a
+                      href="/download"
+                      className="inline-flex px-4 py-3 rounded-lg text-lg font-semibold cursor-pointer justify-center items-center space-x-2 dark:bg-white dark:text-black bg-black text-white dark:hover:text-black hover:text-white scroll-smooth"
+                    >
+                      <span>Download Jan for PC</span>
+                    </a>
+                  ) : (
+                    <Dropdown />
+                  )}
+                  <p className="mt-6 text-zinc-text-black/60 dark:text-white/60">
+                    500K+ Downloads | Free & Open Source
+                  </p>
+                </div>
+              </div>
             </div>
           </div>
         </main>
diff --git a/docs/src/styles/components/base.scss b/docs/src/styles/components/base.scss
index 73adc8d1c..8a2e3f5c1 100644
--- a/docs/src/styles/components/base.scss
+++ b/docs/src/styles/components/base.scss
@@ -169,5 +169,5 @@
 }
 
 .font-serif {
-  letter-spacing: -4px;
+  letter-spacing: -1.6px;
 }
diff --git a/docs/src/styles/components/font.scss b/docs/src/styles/components/font.scss
new file mode 100644
index 000000000..c1d9b0ca7
--- /dev/null
+++ b/docs/src/styles/components/font.scss
@@ -0,0 +1,41 @@
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
+
+@font-face {
+  font-family: 'PPEditorialNew';
+  src: url('/static/font/PPEditorialNew-Regular.otf') format('opentype');
+  font-weight: 400;
+}
+
+@font-face {
+  font-family: 'PPEditorialNew';
+  src: url('/static/font/PPEditorialNew-RegularItalic.otf') format('opentype');
+  font-weight: 400;
+  font-style: italic;
+}
+
+@font-face {
+  font-family: 'PPEditorialNew';
+  src: url('/static/font/PPEditorialNew-Ultrabold.otf') format('opentype');
+  font-weight: 700;
+}
+
+@font-face {
+  font-family: 'PPEditorialNew';
+  src: url('/static/font/PPEditorialNew-UltraboldItalic.otf') format('opentype');
+  font-weight: 700;
+  font-style: italic;
+}
+
+@font-face {
+  font-family: 'PPEditorialNew';
+  src: url('/static/font/PPEditorialNew-Ultralight.otf') format('opentype');
+  font-weight: 300;
+}
+
+@font-face {
+  font-family: 'PPEditorialNew';
+  src: url('/static/font/PPEditorialNew-UltralightItalic.otf')
+    format('opentype');
+  font-weight: 300;
+  font-style: italic;
+}
diff --git a/docs/src/styles/main.scss b/docs/src/styles/main.scss
index dd95de34b..25e5a6882 100644
--- a/docs/src/styles/main.scss
+++ b/docs/src/styles/main.scss
@@ -1,9 +1,8 @@
-@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,100..700;1,100..700&display=swap&family=Inter:wght@100..900&display=swap');
-
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
 @import 'tailwindcss/utilities';
 
+@import './components/font.scss';
 @import './components/base.scss';
 @import './components/typography.scss';
 @import './components/card.scss';
diff --git a/docs/static/font/PPEditorialNew-Regular.otf b/docs/static/font/PPEditorialNew-Regular.otf
new file mode 100644
index 000000000..778c9025d
Binary files /dev/null and b/docs/static/font/PPEditorialNew-Regular.otf differ
diff --git a/docs/static/font/PPEditorialNew-RegularItalic.otf b/docs/static/font/PPEditorialNew-RegularItalic.otf
new file mode 100644
index 000000000..d20c33a63
Binary files /dev/null and b/docs/static/font/PPEditorialNew-RegularItalic.otf differ
diff --git a/docs/static/font/PPEditorialNew-Ultrabold.otf b/docs/static/font/PPEditorialNew-Ultrabold.otf
new file mode 100644
index 000000000..507b09150
Binary files /dev/null and b/docs/static/font/PPEditorialNew-Ultrabold.otf differ
diff --git a/docs/static/font/PPEditorialNew-UltraboldItalic.otf b/docs/static/font/PPEditorialNew-UltraboldItalic.otf
new file mode 100644
index 000000000..58282cceb
Binary files /dev/null and b/docs/static/font/PPEditorialNew-UltraboldItalic.otf differ
diff --git a/docs/static/font/PPEditorialNew-Ultralight.otf b/docs/static/font/PPEditorialNew-Ultralight.otf
new file mode 100644
index 000000000..59addeb80
Binary files /dev/null and b/docs/static/font/PPEditorialNew-Ultralight.otf differ
diff --git a/docs/static/font/PPEditorialNew-UltralightItalic.otf b/docs/static/font/PPEditorialNew-UltralightItalic.otf
new file mode 100644
index 000000000..d3e636b53
Binary files /dev/null and b/docs/static/font/PPEditorialNew-UltralightItalic.otf differ
diff --git a/docs/tailwind.config.js b/docs/tailwind.config.js
index cb9e5c9e1..f72fa3bf4 100644
--- a/docs/tailwind.config.js
+++ b/docs/tailwind.config.js
@@ -56,7 +56,7 @@ module.exports = {
         'Helvetica',
         'sans-serif',
       ],
-      serif: ['Josefin Sans'],
+      serif: ['PPEditorialNew'],
     },
     extend: {
       backgroundImage: {