diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index 0a20c51..fc9625e 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -1,53 +1,51 @@
 ---
-const { title = "", description = "" } = Astro.props;
+  const { title = "", description = "" } = Astro.props;
 ---
 
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
-	<meta charset="UTF-8">
-	<meta name="viewport" content="width=device-width">
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width">
   <link rel="icon" type="image/x-icon" href="/favicon.ico" />
-	<title>{title}</title>
+  <title>{title}</title>
   <meta name="description" content={description}>
 </head>
+
 <body>
-	<slot />
+  <slot />
 </body>
+
 </html>
 
 <style>
   :root {
     --font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem);
-		--font-size-lg: clamp(1.2rem, 0.7vw + 1.2rem, 1.5rem); 
+    --font-size-lg: clamp(1.2rem, 0.7vw + 1.2rem, 1.5rem);
     --font-size-xl: clamp(2.44rem, 2.38vw + 1.85rem, 3.75rem);
 
     --color-text: hsl(12, 5%, 4%);
-    --color-bg: hsl(10, 21%, 95%);
-		--color-border: hsl(17, 24%, 90%);
+    --color-bg: #fff;
+    --color-border: hsl(17, 24%, 90%);
+
+    --astro-gradient: linear-gradient(0deg, #4F39FA, #DA62C4);
   }
 
-  html {
-    font-family: system-ui, sans-serif;
-    font-size: var(--font-size-base);
-    color: var(--color-text);
-    background-color: var(--color-bg);
+  :global(main) {
+    margin: auto;
+    padding: 1em;
+    max-width: 60ch;
   }
 
-  body {
-    margin: 0;
+  :global(.text-gradient) {
+    font-weight: 900;
+    background-image: var(--astro-gradient);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+    background-size: 100% 200%;
+    background-position-y: 100%;
+    border-radius: 0.4rem;
+    animation: pulse 4s ease-in-out infinite;
   }
-
-  :global(h1) {
-    font-size: var(--font-size-xl);
-  }
-
-  :global(h2) {
-    font-size: var(--font-size-lg);
-  }
-
-  :global(code) {
-    font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
-			Bitstream Vera Sans Mono, Courier New, monospace;
-  }
-</style>
+</style>
\ No newline at end of file
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 3adf957..a79622c 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -1,66 +1,15 @@
 ---
-import Layout from '~/layouts/Layout.astro';
+	import Layout from '~/layouts/Layout.astro';
 ---
+
 <Layout title="Tailwind Astro">
 	<main>
-		<h1>Welcome to <span class="text-gradient">Tailwind Astro</span></h1>
-		<p class="instructions">
-			Check out the <code>src/pages</code> directory to get started.<br/>
-			<strong>Code Challenge:</strong> Tweak the "Welcome to Astro" message above.
+		<h1 class="font-extrabold text-4xl sm:text-5xl lg:text-6xl tracking-tight dark:text-white text-gradient">Tailwind Astro</h1>
+		<p class="mt-6 text-lg text-slate-600 max-w-3xl mx-auto dark:text-slate-400">
+			Lorem ipsum lorem
 		</p>
 	</main>
 </Layout>
 
 <style>
-	:root {
-		--astro-gradient: linear-gradient(0deg,#4F39FA, #DA62C4);
-	}
-
-	h1 {
-		margin: 2rem 0;
-	}
-
-	main {
-		margin: auto;
-    	padding: 1em;
-		max-width: 60ch;
-	}
-
-	.text-gradient {
-		font-weight: 900;
-		background-image: var(--astro-gradient);
-		-webkit-background-clip: text;
-		-webkit-text-fill-color: transparent;
-		background-size: 100% 200%;
-		background-position-y: 100%;
-		border-radius: 0.4rem;
-		animation: pulse 4s ease-in-out infinite;
-	}
-
-	@keyframes pulse {
-		0%, 100% { background-position-y: 0%; }
-		50% { background-position-y: 80%; }
-	}
-
-	.instructions {
-		line-height: 1.6;
-		margin: 1rem 0;
-		background: #4F39FA;
-		padding: 1.0rem;
-		border-radius: 0.4rem;
-		color: var(--color-bg);
-	}
-
-	.instructions code {
-		font-size: 0.875em;
-		border: 0.1em solid var(--color-border);
-		border-radius: 4px;
-		padding: 0.15em 0.25em;
-	}
-	.link-card-grid {
-		display: grid;
-		grid-template-columns: repeat(auto-fit, minmax(24ch, 1fr));
-		gap: 1rem;
-		padding: 0;
-	}
-</style>
+</style>
\ No newline at end of file
