diff --git a/docs/index.html b/docs/index.html
index 405b475..bb61df8 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -56,32 +56,57 @@
 
 <main id="main">
 <div id="puddle-container"></div>
-<div class="hero">
-    <h1>Vale</h1>
-    Developer<br />
-    Designer<br />
-    Dabbler
-</div>
+
+<section class="hero">
+	<h1>Vale</h1>
+	<div class="hero-titles">
+		<p>Developer</p>
+		<p>Designer</p>
+		<p>Dabbler</p>
+	</div>
+</section>
+
 <div class="content">
-<h2>Ahoy!</h2>
-<p>I’m Declan Chidlow, a passionate front-end developer. I like to believe I’ve got an eye for aesthetics, and I’ve most definitely got a love for learning. My ultimate aspiration is to create digital experiences that are both functional and visually appealing.</p>
-<p>When I’m not bodging together some script or reinventing the wheel, you might find me cruising around on my unicycle. Alternatively, you may find me writing up some form of article for this very website, doing some gaming, inadvertently converting an otherwise functional piece of tech into a paperweight, or browsing the crevices of cyberspace.</p>
-<p>Apart from being a home for <a href="/posts">my thoughts and musings</a>, this website acts as a gateway to all sorts of horrific abominations I concoct. Some of them won’t even cause internal haemorrhaging.</p>
-<h2>Let’s Connect</h2>
-<p>Impressed by my work? Have a project in mind? I’d love to hear about it! Don’t hesitate to reach out. Visit my <a href="/contact">contact page</a> and let’s start a conversation.</p>
+	<section class="about">
+		<h2>Ahoy!</h2>
+		<p>
+			I'm Declan Chidlow, a passionate front-end developer. I like to believe I've got an eye for aesthetics, and I've most definitely got a love for learning. My ultimate aspiration is to create
+			digital experiences that are both functional and visually appealing.
+		</p>
+		<p>
+			When I'm not bodging together some script or reinventing the wheel, you might find me cruising around on my unicycle. Alternatively, you may find me writing up some form of article for this very
+			website, doing some gaming, inadvertently converting an otherwise functional piece of tech into a paperweight, or browsing the crevices of cyberspace.
+		</p>
+		<p>
+			Apart from being a home for <a href="/posts">my thoughts and musings</a>, this website acts as a gateway to all sorts of horrific abominations I concoct. Some of them won't even cause internal
+			haemorrhaging.
+		</p>
+	</section>
+
+	<a href="/posts" class="cta-link">
+		<h2>Read my writings<span aria-hidden="true"> →</span></h2>
+	</a>
+
+	<a href="/portfolio" class="cta-link">
+		<h2>Peruse my portfolio<span aria-hidden="true"> →</span></h2>
+	</a>
+
+	<a href="/contact" class="cta-link">
+		<h2>Get in contact<span aria-hidden="true"> →</span></h2>
+	</a>
 </div>
+
 <script>
-if (!window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
-    const script = document.createElement('script');
-    script.src = "/scripts/puddle.js";
-    script.onload = function() {
-        const puddle = new Puddle("#puddle-container");
-        puddle.setNodeStyle("ascii");
-    };
-    document.body.appendChild(script);
-}
+	if (!window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
+		const script = document.createElement("script");
+		script.src = "/scripts/puddle.js";
+		script.onload = function () {
+			const puddle = new Puddle("#puddle-container");
+			puddle.setNodeStyle("ascii");
+		};
+		document.body.appendChild(script);
+	}
 </script>
-
 		</main>
 
 		<footer>
diff --git a/docs/styles/pages/index.css b/docs/styles/pages/index.css
index 3921927..e01f5bf 100644
--- a/docs/styles/pages/index.css
+++ b/docs/styles/pages/index.css
@@ -4,7 +4,7 @@ main {
 
 #puddle-container {
 	position: absolute;
-	inset: 0 0 0 0;
+	inset: 0;
 	color: var(--bright_grey);
 	user-select: none;
 
@@ -35,4 +35,25 @@ main {
 
 .content {
 	position: relative;
+	max-width: 80ch;
+
+	.about {
+		margin-bottom: 4rem;
+	}
+
+	.cta-link {
+		display: block;
+		border-top: 4px solid var(--grey);
+		border-bottom: 4px solid var(--grey);
+		padding: 1rem;
+		text-decoration: none;
+	}
+
+	p + h2 {
+		margin-top: 2rem;
+	}
+
+	* + * {
+		margin-top: 1rem;
+	}
 }
diff --git a/input/global/styles/pages/index.css b/input/global/styles/pages/index.css
index 3921927..e01f5bf 100644
--- a/input/global/styles/pages/index.css
+++ b/input/global/styles/pages/index.css
@@ -4,7 +4,7 @@ main {
 
 #puddle-container {
 	position: absolute;
-	inset: 0 0 0 0;
+	inset: 0;
 	color: var(--bright_grey);
 	user-select: none;
 
@@ -35,4 +35,25 @@ main {
 
 .content {
 	position: relative;
+	max-width: 80ch;
+
+	.about {
+		margin-bottom: 4rem;
+	}
+
+	.cta-link {
+		display: block;
+		border-top: 4px solid var(--grey);
+		border-bottom: 4px solid var(--grey);
+		padding: 1rem;
+		text-decoration: none;
+	}
+
+	p + h2 {
+		margin-top: 2rem;
+	}
+
+	* + * {
+		margin-top: 1rem;
+	}
 }
diff --git a/input/pages/index/conf.toml b/input/pages/index/conf.toml
index 3def5c7..37ee59a 100755
--- a/input/pages/index/conf.toml
+++ b/input/pages/index/conf.toml
@@ -13,8 +13,8 @@ format = "html"
 content_file = "input/global/elements/navbar.html"
 
 [[main.block]]
-format = "md"
-content_file = "input/pages/index/index.md"
+format = "html"
+content_file = "input/pages/index/index.html"
 
 [[main.block]]
 format = "html"
diff --git a/input/pages/index/index.html b/input/pages/index/index.html
new file mode 100755
index 0000000..ca58ed6
--- /dev/null
+++ b/input/pages/index/index.html
@@ -0,0 +1,52 @@
+<div id="puddle-container"></div>
+
+<section class="hero">
+	<h1>Vale</h1>
+	<div class="hero-titles">
+		<p>Developer</p>
+		<p>Designer</p>
+		<p>Dabbler</p>
+	</div>
+</section>
+
+<div class="content">
+	<section class="about">
+		<h2>Ahoy!</h2>
+		<p>
+			I'm Declan Chidlow, a passionate front-end developer. I like to believe I've got an eye for aesthetics, and I've most definitely got a love for learning. My ultimate aspiration is to create
+			digital experiences that are both functional and visually appealing.
+		</p>
+		<p>
+			When I'm not bodging together some script or reinventing the wheel, you might find me cruising around on my unicycle. Alternatively, you may find me writing up some form of article for this very
+			website, doing some gaming, inadvertently converting an otherwise functional piece of tech into a paperweight, or browsing the crevices of cyberspace.
+		</p>
+		<p>
+			Apart from being a home for <a href="/posts">my thoughts and musings</a>, this website acts as a gateway to all sorts of horrific abominations I concoct. Some of them won't even cause internal
+			haemorrhaging.
+		</p>
+	</section>
+
+	<a href="/posts" class="cta-link">
+		<h2>Read my writings<span aria-hidden="true"> →</span></h2>
+	</a>
+
+	<a href="/portfolio" class="cta-link">
+		<h2>Peruse my portfolio<span aria-hidden="true"> →</span></h2>
+	</a>
+
+	<a href="/contact" class="cta-link">
+		<h2>Get in contact<span aria-hidden="true"> →</span></h2>
+	</a>
+</div>
+
+<script>
+	if (!window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
+		const script = document.createElement("script");
+		script.src = "/scripts/puddle.js";
+		script.onload = function () {
+			const puddle = new Puddle("#puddle-container");
+			puddle.setNodeStyle("ascii");
+		};
+		document.body.appendChild(script);
+	}
+</script>
diff --git a/input/pages/index/index.md b/input/pages/index/index.md
deleted file mode 100755
index 95572d5..0000000
--- a/input/pages/index/index.md
+++ /dev/null
@@ -1,36 +0,0 @@
-<div id="puddle-container"></div>
-
-<div class="hero">
-    <h1>Vale</h1>
-    Developer<br />
-    Designer<br />
-    Dabbler
-</div>
-
-<div class="content">
-
-## Ahoy!
-
-I'm Declan Chidlow, a passionate front-end developer. I like to believe I've got an eye for aesthetics, and I've most definitely got a love for learning. My ultimate aspiration is to create digital experiences that are both functional and visually appealing.
-
-When I'm not bodging together some script or reinventing the wheel, you might find me cruising around on my unicycle. Alternatively, you may find me writing up some form of article for this very website, doing some gaming, inadvertently converting an otherwise functional piece of tech into a paperweight, or browsing the crevices of cyberspace.
-
-Apart from being a home for [my thoughts and musings](/posts), this website acts as a gateway to all sorts of horrific abominations I concoct. Some of them won't even cause internal haemorrhaging.
-
-## Let's Connect
-
-Impressed by my work? Have a project in mind? I'd love to hear about it! Don't hesitate to reach out. Visit my [contact page](/contact) and let's start a conversation.
-
-</div>
-
-<script>
-if (!window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
-    const script = document.createElement('script');
-    script.src = "/scripts/puddle.js";
-    script.onload = function() {
-        const puddle = new Puddle("#puddle-container");
-        puddle.setNodeStyle("ascii");
-    };
-    document.body.appendChild(script);
-}
-</script>