diff --git a/apps/site/src/app/(home)/page.tsx b/apps/site/src/app/(home)/page.tsx
index 5cb9bd2f..7a2b1938 100644
--- a/apps/site/src/app/(home)/page.tsx
+++ b/apps/site/src/app/(home)/page.tsx
@@ -2,7 +2,7 @@ export const revalidate = 60;
 
 import Landing from "./sections/Landing";
 import Intro from "./sections/Intro";
-import Mentor from "./sections/Mentor";
+import GetInvolved from "./sections/GetInvolved";
 import Sponsors from "./sections/Sponsors";
 import FAQ from "./sections/FAQ";
 
@@ -12,9 +12,9 @@ const Home = () => {
 	return (
 		<div className={styles.home}>
 			<Landing />
-			{/* <Mentor />
-			<Sponsors />
-			<FAQ /> */}
+			<GetInvolved />
+			{/* <Sponsors /> */}
+			{/* <FAQ /> */}
 		</div>
 	);
 };
diff --git a/apps/site/src/app/(home)/sections/GetInvolved/GetInvolved.module.scss b/apps/site/src/app/(home)/sections/GetInvolved/GetInvolved.module.scss
new file mode 100644
index 00000000..25bfe2bc
--- /dev/null
+++ b/apps/site/src/app/(home)/sections/GetInvolved/GetInvolved.module.scss
@@ -0,0 +1,155 @@
+@use "zothacks-theme" as theme;
+@use "bootstrap-utils" as bootstrap;
+
+$text-font-weight: 600;
+$text-font-size: 1.5rem;
+$border-radius: 14px;
+$speech-padding: 20px;
+$speech-shadow: 0 10px 0 rgba(1, 57, 70, 0.2);
+
+@mixin speechBubble($bg-color, $border-color) {
+	background-color: $bg-color;
+	border: 6px solid $border-color;
+	border-radius: $border-radius;
+	padding: $speech-padding;
+	font-weight: $text-font-weight;
+	font-size: $text-font-size;
+	text-align: center;
+
+	@include bootstrap.media-breakpoint-up(md) {
+		padding: 32px 48px;
+		text-align: left;
+	}
+}
+
+@mixin boxShadow {
+	box-shadow: $speech-shadow;
+}
+
+.container {
+	padding-top: 0 !important;
+}
+
+.headingText {
+	color: theme.$white;
+	margin-bottom: 48px;
+	font-weight: $text-font-weight;
+}
+
+.anteaterContainerLeft,
+.anteaterContainerRight {
+	display: none;
+	height: 187px;
+	width: 136px;
+	z-index: 4;
+	@include bootstrap.media-breakpoint-up(md) {
+		display: block;
+		position: relative;
+	}
+}
+
+.anteaterContainerLeft {
+	@include bootstrap.media-breakpoint-up(md) {
+		left: -32px;
+		top: -32px;
+	}
+}
+
+.anteaterContainerRight {
+	@include bootstrap.media-breakpoint-up(md) {
+		top: -64px;
+		left: 48px;
+		margin-left: auto;
+	}
+}
+
+.anteaterImage {
+	&:hover {
+		transform: scale(1.05);
+		animation: rotateAnimation 0.7s ease-in-out 1;
+	}
+
+	height: 187px;
+	width: 136px;
+	z-index: 5;
+	transition: transform 0.5s ease-in-out;
+}
+
+@keyframes rotateAnimation {
+	0%,
+	100% {
+		transform: scale(1.05) rotate(0deg);
+	}
+	33% {
+		transform: scale(1.05) rotate(-7deg);
+	}
+	66% {
+		transform: scale(1.05) rotate(7deg);
+	}
+}
+
+.speechSectionLeft,
+.speechSectionRight {
+	margin-bottom: 20px;
+	position: relative;
+}
+
+.speechSectionRight {
+	@include bootstrap.media-breakpoint-up(md) {
+		top: -230px;
+	}
+}
+
+.speechBubbleOuterLeft,
+.speechBubbleOuterRight {
+	position: relative;
+	background-color: theme.$white;
+	border-radius: 18px;
+	padding: 4px;
+	@include boxShadow;
+
+	@include bootstrap.media-breakpoint-up(md) {
+		width: 65%;
+	}
+}
+
+.speechBubbleOuterLeft {
+	z-index: 2;
+	@include bootstrap.media-breakpoint-up(md) {
+		margin-left: 90px;
+	}
+}
+
+.speechBubbleOuterRight {
+	z-index: 1;
+	@include bootstrap.media-breakpoint-up(md) {
+		margin-left: auto;
+		margin-right: 90px;
+	}
+}
+
+.speechBubbleLeft {
+	@include speechBubble(theme.$white, theme.$black);
+}
+
+.speechBubbleRight {
+	@include speechBubble(theme.$light-green, theme.$black);
+}
+
+.applyButton {
+	background-color: theme.$purple;
+	color: theme.$white;
+	border: 0px;
+	padding: 4px 24px;
+	font-weight: $text-font-weight;
+
+	@include bootstrap.media-breakpoint-up(md) {
+		padding: 4px 32px;
+	}
+
+	&::before {
+		background-color: theme.$purple;
+		color: theme.$white;
+		padding: 10px;
+	}
+}
diff --git a/apps/site/src/app/(home)/sections/GetInvolved/GetInvolved.tsx b/apps/site/src/app/(home)/sections/GetInvolved/GetInvolved.tsx
new file mode 100644
index 00000000..df281ca4
--- /dev/null
+++ b/apps/site/src/app/(home)/sections/GetInvolved/GetInvolved.tsx
@@ -0,0 +1,65 @@
+"use client";
+import Container from "react-bootstrap/Container";
+import Button from "react-bootstrap/Button";
+import anteater_left from "@/assets/images/involved_anteater_left.png";
+import anteater_right from "@/assets/images/involved_anteater_right.png";
+import styles from "./GetInvolved.module.scss";
+
+const GetInvolved = () => {
+	const sectionHeading = <h2 className={styles.headingText}>GET INVOLVED</h2>;
+	const leftBubbleText = <p>Want to develop your first project?</p>;
+	const rightBubbleText = (
+		<p>Otherwise, if you have some experience under your belt,</p>
+	);
+	const applyLink = (
+		<Button href="/apply" type="button" className={styles.applyButton}>
+			Apply as a Hacker
+		</Button>
+	);
+
+	const mentorLink = (
+		<Button href="/mentor" type="button" className={styles.applyButton}>
+			Apply as a Mentor
+		</Button>
+	);
+
+	return (
+		<Container className={styles.container} as="section">
+			{sectionHeading}
+			<div>
+				<div className={styles.speechSectionLeft}>
+					<div className={styles.speechBubbleOuterLeft}>
+						<div className={styles.speechBubbleLeft}>
+							{leftBubbleText}
+							{applyLink}
+						</div>
+					</div>
+					<div className={styles.anteaterContainerLeft}>
+						<img
+							className={styles.anteaterImage}
+							src={anteater_left.src}
+							alt="A cartoon anteater sitting on a ring buoy coding"
+						/>
+					</div>
+				</div>
+				<div className={styles.speechSectionRight}>
+					<div className={styles.speechBubbleOuterRight}>
+						<div className={styles.speechBubbleRight}>
+							{rightBubbleText}
+							{mentorLink}
+						</div>
+					</div>
+					<div className={styles.anteaterContainerRight}>
+						<img
+							className={styles.anteaterImage}
+							src={anteater_right.src}
+							alt="A cartoon anteater captain sitting on a ring buoy"
+						/>
+					</div>
+				</div>
+			</div>
+		</Container>
+	);
+};
+
+export default GetInvolved;
diff --git a/apps/site/src/app/(home)/sections/GetInvolved/index.ts b/apps/site/src/app/(home)/sections/GetInvolved/index.ts
new file mode 100644
index 00000000..064f25c5
--- /dev/null
+++ b/apps/site/src/app/(home)/sections/GetInvolved/index.ts
@@ -0,0 +1 @@
+export { default } from "./GetInvolved";
diff --git a/apps/site/src/app/(home)/sections/Mentor/Mentor.module.scss b/apps/site/src/app/(home)/sections/Mentor/Mentor.module.scss
deleted file mode 100644
index d4124c44..00000000
--- a/apps/site/src/app/(home)/sections/Mentor/Mentor.module.scss
+++ /dev/null
@@ -1,134 +0,0 @@
-@use "zothacks-theme" as theme;
-@use "bootstrap-utils" as bootstrap;
-
-.applySticky {
-	@include bootstrap.rfs(400px, height);
-	@include bootstrap.rfs(15%, margin-left);
-	background-image: url("~@/assets/images/MentorStickyYellow.svg");
-	background-repeat: no-repeat;
-	background-size: contain;
-	filter: drop-shadow(5px 5px 5px lightgray);
-	padding-top: 3rem;
-	padding-left: 5rem;
-	padding-right: 5rem;
-	padding-bottom: 8rem;
-	position: relative;
-	z-index: 1;
-
-	h2 {
-		@include bootstrap.font-size(2rem);
-		@include bootstrap.padding(2rem);
-	}
-
-	a {
-		@include bootstrap.font-size(1.25rem);
-		position: absolute;
-		bottom: 10%;
-		left: 6%;
-		transform: rotate(7.5deg) translateZ(0);
-	}
-
-	p {
-		display: none;
-	}
-
-	@include bootstrap.media-breakpoint-down(lg) {
-		background-image: none;
-		background-color: theme.$sticky-yellow;
-		background-size: contain;
-		margin-left: 0;
-		height: auto;
-		padding: 0;
-		box-shadow: 0 3px 5px 3px lightgray;
-
-		.applyStickyContent {
-			@include bootstrap.padding(3rem);
-
-			h2 {
-				padding: 0;
-			}
-		}
-
-		a {
-			display: none;
-		}
-
-		p {
-			display: block;
-		}
-	}
-}
-
-.descSticky {
-	background-image: url("~@/assets/images/MentorStickyGreen.svg");
-	background-repeat: no-repeat;
-	background-size: contain;
-	background-position: 60%;
-	filter: drop-shadow(5px 5px 5px lightgray);
-	padding: 6rem;
-	position: absolute;
-	z-index: 0;
-	top: 15%;
-	left: 40%;
-	width: 41.667%;
-
-	p {
-		@include bootstrap.padding(1rem);
-		transform: rotate(-5deg);
-	}
-
-	a {
-		display: none;
-	}
-
-	@include bootstrap.media-breakpoint-down(xxl) {
-		top: 10%;
-		left: 47.5%;
-	}
-
-	@include bootstrap.media-breakpoint-down(xl) {
-		width: 50%;
-		padding: 5rem;
-	}
-
-	@include bootstrap.media-breakpoint-down(lg) {
-		width: 300px;
-		height: 300px;
-		top: auto;
-		left: auto;
-		bottom: -45%;
-		right: 0;
-
-		a {
-			@include bootstrap.font-size(1.2rem);
-			display: block;
-			position: absolute;
-			bottom: 2.5%;
-			left: 7.5%;
-			z-index: 2;
-			transform: rotate(-5deg) translateZ(0);
-		}
-		p {
-			display: none;
-		}
-	}
-
-	@include bootstrap.media-breakpoint-down(md) {
-		bottom: -30%;
-	}
-
-	@include bootstrap.media-breakpoint-down(sm) {
-		bottom: -27.5%;
-	}
-}
-
-.tape {
-	position: absolute;
-	top: 0;
-	left: 50%;
-	transform: translate(-50%, -50%);
-
-	@include bootstrap.media-breakpoint-up(lg) {
-		display: none;
-	}
-}
diff --git a/apps/site/src/app/(home)/sections/Mentor/Mentor.tsx b/apps/site/src/app/(home)/sections/Mentor/Mentor.tsx
deleted file mode 100644
index 51aca193..00000000
--- a/apps/site/src/app/(home)/sections/Mentor/Mentor.tsx
+++ /dev/null
@@ -1,88 +0,0 @@
-"use client";
-import { motion, cubicBezier, Variants } from "framer-motion";
-import Image from "next/image";
-import Col from "react-bootstrap/Col";
-import Container from "react-bootstrap/Container";
-
-import BookmarkLink from "@/components/BookmarkLink/BookmarkLink";
-import tape from "@/assets/images/tape.svg";
-
-import styles from "./Mentor.module.scss";
-
-const MENTOR_APP_URL = "/mentor";
-
-const variant: Variants = {
-	initial: {
-		scale: 1.1,
-		opacity: 0,
-		rotateX: 20,
-		translateY: 30,
-	},
-	animate: {
-		scale: 1,
-		rotateX: 0,
-		opacity: 1,
-		translateY: 0,
-		transition: {
-			duration: 0.85,
-			staggerChildren: 0.1,
-			ease: cubicBezier(0.33, 1, 0.68, 1),
-		},
-	},
-};
-
-const Mentor = () => {
-	const mentorHeader = (
-		<h2 className="mb-3 text-start">Interested in becoming a mentor?</h2>
-	);
-	const mentorDescription = (
-		<p>
-			Have a knack for innovation? Interested in inspiring the next generation
-			of developers? Mentor applications for ZotHacks 2023 have closed, but
-			please keep an eye out for future events!
-		</p>
-	);
-	const applyLink = (
-		<BookmarkLink
-			className="mb-4"
-			href={MENTOR_APP_URL}
-			target="_blank"
-			disabled
-		>
-			Applications have closed.
-		</BookmarkLink>
-	);
-
-	return (
-		<Container as="section">
-			<motion.div
-				variants={variant}
-				initial="initial"
-				whileInView="animate"
-				className="position-relative my-5"
-			>
-				<motion.div variants={variant}>
-					<Col lg={5} className={styles.applySticky}>
-						<motion.img
-							variants={variant}
-							src={tape.src}
-							alt="post-it tape"
-							className={styles.tape}
-						/>
-						<div className={styles.applyStickyContent}>
-							{mentorHeader}
-							{mentorDescription}
-						</div>
-						{applyLink}
-					</Col>
-					<Col className={styles.descSticky + " text-center"}>
-						{mentorDescription}
-						{applyLink}
-					</Col>
-				</motion.div>
-			</motion.div>
-		</Container>
-	);
-};
-
-export default Mentor;
diff --git a/apps/site/src/app/(home)/sections/Mentor/index.ts b/apps/site/src/app/(home)/sections/Mentor/index.ts
deleted file mode 100644
index 3ff6c4f7..00000000
--- a/apps/site/src/app/(home)/sections/Mentor/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default } from "./Mentor";
diff --git a/apps/site/src/assets/images/involved_anteater_left.png b/apps/site/src/assets/images/involved_anteater_left.png
new file mode 100644
index 00000000..48ef88d0
Binary files /dev/null and b/apps/site/src/assets/images/involved_anteater_left.png differ
diff --git a/apps/site/src/assets/images/involved_anteater_right.png b/apps/site/src/assets/images/involved_anteater_right.png
new file mode 100644
index 00000000..abef85bf
Binary files /dev/null and b/apps/site/src/assets/images/involved_anteater_right.png differ