Redesign homepage for minimalist, centered layout

- Center hero section and simplify buttons
- Refine feature cards with concise descriptions
- Center-align Features heading for visual harmony

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

Author: DorianZheng

src/components/features.astro

@@ -4,52 +4,48 @@ import { Icon } from "astro-icon/components";
 
 const features = [
   {
-    title: "Bring Your Own Framework",
+    title: "Hardware Isolated",
     description:
-      "Build your site using React, Svelte, Vue, Preact, web components, or just plain ol' HTML + JavaScript.",
-    icon: "bx:bxs-briefcase",
+      "Each sandbox is a micro-VM with its own kernel. Not containers—real isolation.",
+    icon: "bx:bxs-shield",
   },
   {
-    title: "100% Static HTML, No JS",
+    title: "OCI Compatible",
     description:
-      "Astro renders your entire page to static HTML, removing all JavaScript from your final build by default.",
-    icon: "bx:bxs-window-alt",
+      "Use any Docker image. Fast startup with layer caching.",
+    icon: "bx:bxl-docker",
   },
   {
-    title: "On-Demand Components",
+    title: "Full Freedom Inside",
     description:
-      "Need some JS? Astro can automatically hydrate interactive components when they become visible on the page.  ",
-    icon: "bx:bxs-data",
+      "Complete Linux environment. Install anything. Nothing escapes.",
+    icon: "bx:bxs-terminal",
   },
   {
-    title: "Broad Integration",
+    title: "Batteries Included",
     description:
-      "Astro supports TypeScript, Scoped CSS, CSS Modules, Sass, Tailwind, Markdown, MDX, and any other npm packages.",
-    icon: "bx:bxs-bot",
+      "Networking, storage, and volumes—all built-in.",
+    icon: "bx:bxs-package",
   },
   {
-    title: "SEO Enabled",
+    title: "Cross-Platform",
     description:
-      "Automatic sitemaps, RSS feeds, pagination and collections take the pain out of SEO and syndication. It just works!",
-    icon: "bx:bxs-file-find",
+      "macOS Apple Silicon and Linux x86_64/ARM64.",
+    icon: "bx:bxs-devices",
   },
   {
-    title: "Community",
+    title: "Async-First",
     description:
-      "Astro is an open source project powered by hundreds of contributors making thousands of individual contributions.",
-    icon: "bx:bxs-user",
+      "Non-blocking I/O with real-time streaming.",
+    icon: "bx:bxs-zap",
   },
 ];
 ---
 
-<div class="mt-16 md:mt-0">
+<div class="mt-16 md:mt-0 text-center">
   <h2 class="text-4xl lg:text-5xl font-bold lg:tracking-tight">
-    Everything you need to start a website
+    Features
   </h2>
-  <p class="text-lg mt-4 text-slate-600">
-    Astro comes batteries included. It takes the best parts of state-of-the-art
-    tools and adds its own innovations.
-  </p>
 </div>
 
 <div class="grid sm:grid-cols-2 md:grid-cols-3 mt-16 gap-16">

src/components/hero.astro

@@ -5,47 +5,32 @@ import Link from "@/components/ui/link.astro";
 import { Icon } from "astro-icon/components";
 ---
 
-<main
-  class="grid lg:grid-cols-2 place-items-center pt-16 pb-8 md:pt-12 md:pb-24">
-  <!--<div class="py-6 md:order-1 hidden md:block">
-    <Picture
-      src={heroImage}
-      alt="Astronaut in the air"
-      widths={[200, 400, 600]}
-      sizes="(max-width: 800px) 100vw, 620px"
-      loading="eager"
-      format="avif"
-    />
-  </div>-->
-  <div>
-    <h1
-      class="text-5xl lg:text-6xl xl:text-7xl font-bold lg:tracking-tight xl:tracking-tighter">
-      Embed. Sandbox. Ship.
-    </h1>
-    <p class="text-lg mt-4 text-slate-600 max-w-xl">
-      A single library for AI agent isolation. No daemon, no dependencies—just import and sandbox.
-    </p>
-    <div class="mt-6 flex flex-col sm:flex-row gap-3">
-      <Link
-        href="#"
-        href="https://github.com/boxlite-labs/boxlite"
-        target="_blank"
-        class="flex gap-1 items-center justify-center"
-        rel="noopener">
-        <Icon class="text-white w-5 h-5" name="bx:bxs-cloud-download" />
-
-        Download for Free
-      </Link>
-      <Link
-        size="lg"
-        style="outline"
-        rel="noopener"
-        href="https://github.com/boxlite-labs/boxlite"
-        class="flex gap-1 items-center justify-center"
-        target="_blank">
-        <Icon class="text-black w-4 h-4" name="bx:bxl-github" />
-        GitHub Repo
-      </Link>
-    </div>
+<main class="flex flex-col items-center text-center pt-16 pb-8 md:pt-20 md:pb-24">
+  <h1
+    class="text-5xl lg:text-6xl xl:text-7xl font-bold lg:tracking-tight xl:tracking-tighter">
+    Embed. Sandbox. Ship.
+  </h1>
+  <p class="text-lg mt-4 text-slate-600 max-w-xl">
+    A single library for AI agent isolation. No daemon, no dependencies—just import and sandbox.
+  </p>
+  <div class="mt-6 flex flex-col sm:flex-row gap-3">
+    <Link
+      href="https://github.com/boxlite-labs/boxlite#quick-start"
+      target="_blank"
+      class="flex gap-1 items-center justify-center"
+      rel="noopener">
+      <Icon class="text-white w-5 h-5" name="bx:bxs-rocket" />
+      Get Started
+    </Link>
+    <Link
+      size="lg"
+      style="outline"
+      rel="noopener"
+      href="https://github.com/boxlite-labs/boxlite"
+      class="flex gap-1 items-center justify-center"
+      target="_blank">
+      <Icon class="text-black w-4 h-4" name="bx:bxl-github" />
+      GitHub
+    </Link>
   </div>
 </main>

src/pages/index.astro

@@ -10,8 +10,8 @@ import Layout from "@/layouts/Layout.astro";
 <Layout title="">
   <Container>
     <Hero />
-    <!--<Features />
-    <Logos />
+    <Features />
+    <!--<Logos />
     <Cta />-->
   </Container>
 </Layout>