diff --git a/package.json b/package.json
index da1d251..30070c1 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,7 @@
   },
   "dependencies": {
     "@acid-info/docusaurus-fathom": "^1.0.0-alpha.111",
-    "@acid-info/logos-docusaurus-preset": "^1.0.0-alpha.133",
+    "@acid-info/logos-docusaurus-preset": "^1.0.0-topic-new-layout.15",
     "@docusaurus/core": "2.4.1",
     "@docusaurus/preset-classic": "2.4.1",
     "@docusaurus/theme-mermaid": "^2.4.1",
diff --git a/src/pages/index.mdx b/src/pages/index.mdx
index a50e303..4169e49 100644
--- a/src/pages/index.mdx
+++ b/src/pages/index.mdx
@@ -7,9 +7,9 @@ import {
   Hero,
   HeroTitle,
   HeroDescription,
-  HeroVideo,
   HeroActions,
   HeroAction,
+  HeroImage,
   CallToActionSection,
   CallToActionButton,
   FeatureList,
@@ -18,15 +18,18 @@ import {
   Box,
   Grid,
   ProfileCard,
+  SectionHeader,
+  ShowcaseCard,
+  InputCTASection,
 } from '../components/mdx'
 
-<Hero size="large">
-  <HeroInfo>
-    <HeroTitle>
-      {'DEFEND AGAINST DATA CENSORSHIP WITH CODEX'}
+<Hero size="large" verticalAlign="center">
+  <HeroInfo hideScrollToBottom>
+    <HeroTitle uppercase={false}>
+      Defend against data censorship with Codex
     </HeroTitle>
     <HeroDescription>
-      {'Codex is a durable, decentralised data storage protocol, created so the world community can preserve its most important knowledge without risk of censorship.'} 
+      Codex is a durable, decentralised data storage protocol, created so the world community can preserve its most important knowledge without risk of censorship.
     </HeroDescription>
     <HeroActions>
       <HeroAction href="https://discord.gg/codex-storage" target="_blank">
@@ -34,51 +37,58 @@ import {
       </HeroAction>
     </HeroActions>
   </HeroInfo>
-  <HeroVideo
-    placeholderSrc="/hero/atlas02-1080x1080-placeholder.png"
-    mobile={{ height: "100%", minHeight: "80vh" }}
-  >
-    <source src="/hero/atlas02-2048x2048-24fps-1M.mov" type='video/mp4; codecs="hvc1"' />
-    <source src="/hero/atlas02-2048x2048-24fps-1M.webm" type="video/webm" />  
-  </HeroVideo>
+  <HeroImage src="/hero/hero-image.gif" alt="alt" />
 </Hero>
 
-<FeatureList
-  id="features"
-  alignment="top"
-  title="Codex attributes"
-  features={[
-    {
-      title: 'Durable',
-      description:
-        'Codex implements erasure coding to efficiently ensure data is always available without the storage cost of replication. Through sublinear sampling, Codex detects data corruption throughout the network, allowing for repairs to be made before loss is permanent.',
-    },
-    {
-      title: 'Censorship resistant',
-      description:
-        "The Codex network is designed to withstand DDoS attacks, data corruption, and even the shutdown of a significant number of nodes. Access to your data remains during these otherwise catastrophic events.",
-    },
-    {
-      title: 'Decentralised',
-      description:
-        'Codex implements protocol constructs that incentivize wide participation of data storage providers, both small and large, thus ensuring a robust network resistant to censorship and external attack.',
-    },
-    {
-      title: 'Accessible',
-      description:
-        "Participating in the Codex network is highly accessible thanks to its permissionless nature, bandwidth usage optimizations like its \"lazy repair\" recovery system, and lightweight ZK-based remote auditing.",
-    },
-  ]}
->
-  <CallToActionButton variant="outlined" href="/about">
-    Read more
-  </CallToActionButton>
-</FeatureList>
+<Box>
+  <SectionHeader noBorder title="Codex clients"></SectionHeader>
+  <Box top={{ xs: 64 }}>
+    <Grid
+      xs={{ cols: 2, wrap: true, gap: '1.5rem 1em' }}
+      lg={{ cols: 4, gap: '1rem' }}
+    >
+      <Grid.Item>
+        <ShowcaseCard
+          index={1}
+          name="Durable"
+          description="Codex implements erasure coding to efficiently ensure data is always available without the storage cost of replication. Through sublinear sampling, Codex detects data corruption throughout the network, allowing for repairs to be made before loss is permanent."
+          borderStyle="none"
+        />
+      </Grid.Item>
+      <Grid.Item>
+        <ShowcaseCard
+          index={2}
+          name="Censorship resistant"
+          description="The Codex network is designed to withstand DDoS attacks, data corruption, and even the shutdown of a significant number of nodes. Access to your data remains during these otherwise catastrophic events."
+          borderStyle="none"
+        />
+      </Grid.Item>
+      <Grid.Item>
+        <ShowcaseCard
+          index={3}
+          name="Decentralised"
+          description="Codex implements protocol constructs that incentivize wide participation of data storage providers, both small and large, thus ensuring a robust network resistant to censorship and external attack."
+          borderStyle="none"
+        />
+      </Grid.Item>
+      <Grid.Item>
+        <ShowcaseCard
+          index={4}
+          name="Accessible"
+          description='Participating in the Codex network is highly accessible thanks to its permissionless nature, bandwidth usage optimizations like its "lazy repair" recovery system, and lightweight ZK-based remote auditing.'
+          borderStyle="none"
+        />
+      </Grid.Item>
+    </Grid>
+  </Box>
+</Box>
 
 <Box top={{ xs: 144, lg: 216 }}>
   <CallToActionSection
     title="Logos Collective"
     columns={1}
+    border={false}
+    align="center"
     description={
       <>
         Codex is powering the data storage layer of the Logos technology stack. Logos is a grassroots movement, building the infrastructure for trust-minimised, corruption-resistant governing services and social institutions for peaceful people worldwide.
@@ -93,8 +103,9 @@ import {
   />
 </Box>
 
-<Box top={{ xs: 144, lg: 216 }}>
+<Box top={{ xs: 144, lg: 190 }}>
   <Roadmap
+    noBorder
     title="Development Roadmap"
     description="Codex is currently in its first proof-of-concept iteration and aims to release its alpha version, Katana, before the end of Q4 2023."
     timeline={[
@@ -198,15 +209,12 @@ import {
   />
 </Box>
 
-<Box top={{ xs: 144, lg: 216 }}>
-  <CallToActionSection
-    title="Team"
-    columns={1}
-  />
-  <Box top={{ xs: 40, md: 80 }} bottom={{ xs: 40, md: 80 }}>
+<Box top={{ xs: 144, lg: 190 }}>
+  <SectionHeader title="Team" noBorder />
+  <Box top={{ xs: 40, md: 80 }}>
     <Grid
-      xs={{ cols: 3, gap: '1rem', wrap: false, scrollButtons: false }}
-      md={{ cols: 4, gap: '1rem', wrap: true }}
+      xs={{ cols: 3, gap: '1.5rem 1rem', wrap: false, scrollButtons: false }}
+      md={{ cols: 4, gap: '1.5rem 1rem', wrap: true }}
     >
 			<Grid.Item>
 				<ProfileCard
@@ -330,16 +338,43 @@ import {
   </Box>
 </Box>
  
-<Box top={{ xs: 144, lg: 336 }}>
-  <CallToActionSection
-    title={
-      <>
-        Want to stay in touch with Codex? <br/> 
-        Join the Discord community.
-      </>
-    }
-    label="Discord"
-    target="_blank"
-    href="https://discord.gg/codex-storage"
-  />
-</Box>
+<Box top={{ xs: 152, lg: 300 }}>
+  <Grid
+    xs={{ cols: 1, gap: '1rem' }}
+    md={{ cols: 2 }}
+    className="events-cta-sections"
+  >
+    <Grid.Item xs={1}>
+      <InputCTASection
+        description={
+          'Want to get involved with Codex?\nJoin the Discord community.'
+        }
+        link="https://discord.gg/codex-storage"
+        label="Get Involved"
+      />
+    </Grid.Item>
+    <Grid.Item xs={1}>
+      <InputCTASection
+        description={'Subscribe\nto our newsletter'}
+        label="Subscribe"
+        formInput={[
+          {
+            label: 'Name',
+            placeholder: 'Name',
+            type: 'text',
+            name: 'name',
+            required: true,
+          },
+          {
+            label: 'Email',
+            placeholder: 'Enter your email',
+            type: 'email',
+            name: 'email',
+            required: true,
+          },
+        ]}
+        formListId={3}
+      />
+    </Grid.Item>
+  </Grid>
+</Box>
\ No newline at end of file
diff --git a/static/hero/codex_2.gif b/static/hero/codex_2.gif
new file mode 100644
index 0000000..049979c
Binary files /dev/null and b/static/hero/codex_2.gif differ
diff --git a/static/hero/hero-image.gif b/static/hero/hero-image.gif
new file mode 100644
index 0000000..9b76cfc
Binary files /dev/null and b/static/hero/hero-image.gif differ
diff --git a/yarn.lock b/yarn.lock
index 6248c7d..8e0b7c1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -19,7 +19,7 @@
     satori "^0.10.1"
     sharp "^0.32.1"
 
-"@acid-info/docusaurus-og@^1.0.0-alpha.131":
+"@acid-info/docusaurus-og@1.0.0-alpha.131":
   version "1.0.0-alpha.131"
   resolved "https://registry.yarnpkg.com/@acid-info/docusaurus-og/-/docusaurus-og-1.0.0-alpha.131.tgz#316a736455c3c0e542b32ad63f1b34714588b67b"
   integrity sha512-a0EbvwffHdShC8+bDzLA3VqPW71n2NPy01t0c2Tm8lMu1Xo/JOUEAr23qcuRETfOPbiHWY2DJC/3AGWOffc59g==
@@ -36,14 +36,14 @@
     satori "^0.10.1"
     sharp "^0.32.1"
 
-"@acid-info/logos-docusaurus-preset@^1.0.0-alpha.133":
-  version "1.0.0-alpha.133"
-  resolved "https://registry.yarnpkg.com/@acid-info/logos-docusaurus-preset/-/logos-docusaurus-preset-1.0.0-alpha.133.tgz#f1eaec307dd58dc2fc7f995c463ea91977f68bc9"
-  integrity sha512-t6IXF1sNEO/oaqJf1RHDbygoJQjIEHqrGKhprmrDU4pZhLTeXbjl1/2adI95y4lMXN5zAAUu5xuwvXYuN+sUEA==
+"@acid-info/logos-docusaurus-preset@^1.0.0-topic-new-layout.15":
+  version "1.0.0-topic-new-layout.15"
+  resolved "https://registry.yarnpkg.com/@acid-info/logos-docusaurus-preset/-/logos-docusaurus-preset-1.0.0-topic-new-layout.15.tgz#5ebc2378f4c759cea00f74e47e813ad31df0bb5f"
+  integrity sha512-v0zgML+pJW48jfa5nd9Y1SBJfOaQVG5W28WhwYII8uLdCwcCd6LEc3dtd0x9tFsOiDg2RDXP06XArRKTGjgGrQ==
   dependencies:
-    "@acid-info/docusaurus-og" "^1.0.0-alpha.131"
-    "@acid-info/logos-docusaurus-search-local" "^1.0.0-alpha.111"
-    "@acid-info/logos-docusaurus-theme" "^1.0.0-alpha.133"
+    "@acid-info/docusaurus-og" "1.0.0-alpha.131"
+    "@acid-info/logos-docusaurus-search-local" "1.0.0-alpha.111"
+    "@acid-info/logos-docusaurus-theme" "1.0.0-topic-new-layout.15+29438b5"
     "@docusaurus/core" "^2.4.1"
     "@docusaurus/module-type-aliases" "^2.4.1"
     "@docusaurus/preset-classic" "^2.4.1"
@@ -57,7 +57,7 @@
     lodash "^4.17.21"
     node-fetch "2"
 
-"@acid-info/logos-docusaurus-search-local@^1.0.0-alpha.111":
+"@acid-info/logos-docusaurus-search-local@1.0.0-alpha.111":
   version "1.0.0-alpha.111"
   resolved "https://registry.yarnpkg.com/@acid-info/logos-docusaurus-search-local/-/logos-docusaurus-search-local-1.0.0-alpha.111.tgz#f4a19ad1fdee4da58b7793dde5294304475cff70"
   integrity sha512-W8ILeA095JgaBcze/zsh7GX5yH+oee7QG7kFqfiO7F5apai/0tGfLm1tq7oiJT+jR7guW1jxwuACIFxP7Jm8pw==
@@ -71,13 +71,13 @@
     "@easyops-cn/docusaurus-search-local" "^0.33.6"
     lodash "^4.17.21"
 
-"@acid-info/logos-docusaurus-theme@^1.0.0-alpha.133":
-  version "1.0.0-alpha.133"
-  resolved "https://registry.yarnpkg.com/@acid-info/logos-docusaurus-theme/-/logos-docusaurus-theme-1.0.0-alpha.133.tgz#c59a56139c8672045262af46b8efeff3f639aa70"
-  integrity sha512-9hP7Ev4xU9v/O5vz3rSBl0/rNAgjUlKy3g1AlY82NpoB1mO+Jcakj6ISocwtj9ZhKddtmggqgLszbN+Ml2rL5g==
+"@acid-info/logos-docusaurus-theme@1.0.0-topic-new-layout.15+29438b5":
+  version "1.0.0-topic-new-layout.15"
+  resolved "https://registry.yarnpkg.com/@acid-info/logos-docusaurus-theme/-/logos-docusaurus-theme-1.0.0-topic-new-layout.15.tgz#7cbb216e2deab0527064e45e0ca6e1ad826874fb"
+  integrity sha512-BZikelWH1iqZSeQm5r0X3nAJW1nEnyP3E7gbEBeGCBxipNQ0bx/1sUxe+4j77SNm8QV6PMB7rkpAqjtkWsM/Iw==
   dependencies:
-    "@acid-info/docusaurus-og" "^1.0.0-alpha.131"
-    "@acid-info/lsd-react" "^0.1.0-beta.1"
+    "@acid-info/docusaurus-og" "1.0.0-alpha.131"
+    "@acid-info/lsd-react" "^0.1.0-beta.3"
     "@docusaurus/core" "^2.4.1"
     "@docusaurus/mdx-loader" "^2.4.1"
     "@docusaurus/module-type-aliases" "^2.4.1"
@@ -118,10 +118,10 @@
     three-stdlib "^2.23.4"
     utility-types "^3.10.0"
 
-"@acid-info/lsd-react@^0.1.0-beta.1":
-  version "0.1.0-beta.2"
-  resolved "https://registry.yarnpkg.com/@acid-info/lsd-react/-/lsd-react-0.1.0-beta.2.tgz#373e94e16d2f7db29ffe5eeae07b8d49e9373409"
-  integrity sha512-QHymPzqhhsDwa6QIms1MPlD0CR7+oduJKzd3sVGU2op20QtxzbgnMiqxEIdh3DK2zgtYxgfm5Bpfxqp6dK9MQA==
+"@acid-info/lsd-react@^0.1.0-beta.3":
+  version "0.1.0-beta.3"
+  resolved "https://registry.yarnpkg.com/@acid-info/lsd-react/-/lsd-react-0.1.0-beta.3.tgz#2f211b647d68d6fce163afb60989494f555354be"
+  integrity sha512-lD/x1BZyYdQCUmtMH3YpKSInEO73wRFRxUM6lzbz5UDDUnPfDpj/g4mQrXKL1keV3ujGJbMLaCC36cZT8VgNNw==
   dependencies:
     "@datepicker-react/hooks" "^2.8.4"
     "@emotion/react" "^11.10.5"