From b3b719f4b3f91ce1ca05acc084e0aabb9af2eb62 Mon Sep 17 00:00:00 2001
From: aamoghS <aamoghsawantt@gmail.com>
Date: Thu, 1 Oct 2026 19:06:26 -0400
Subject: [PATCH 1/3] feat(hacklytics): carry the Digital Bloom theme past the
 hero

Every section below the hero was the same bare template: a grey
label, a white headline, a hairline list and a lot of empty black.
The pixel frames, neon type and sprites the hero uses were defined in
globals.css and never reached the rest of the page.

- Eyebrows use the pixel font, a section number and a per-section
  neon color.
- About stats, tracks, prizes, schedule days, sponsors and FAQ are
  tinted pixel-frame cards; each track has its own color and sprite.
- Schedule is grouped by day on a timeline with glowing milestones.
- Headlines carry a neon accent word; body text moves from white/45
  to white/65-70 for contrast.
- Sponsors gets a real call to action instead of a plain text box.

Content and copy are unchanged apart from the sponsor pitch line.
---
 sites/hacklytics2027/components/Footer.tsx    |  6 +-
 .../components/sections/AboutSection.tsx      | 66 ++++++++-------
 .../components/sections/Eyebrow.tsx           | 28 ++++++-
 .../components/sections/FAQSection.tsx        | 27 +++---
 .../sections/PrizeAndSpeakerSection.tsx       | 75 +++++++++++------
 .../components/sections/Schedule/Schedule.tsx | 82 +++++++++++++------
 .../components/sections/Sponsor.tsx           | 68 +++++++--------
 .../components/sections/TracksSection.tsx     | 62 ++++++++------
 8 files changed, 260 insertions(+), 154 deletions(-)

diff --git a/sites/hacklytics2027/components/Footer.tsx b/sites/hacklytics2027/components/Footer.tsx
index 56f42fa3..23428326 100644
--- a/sites/hacklytics2027/components/Footer.tsx
+++ b/sites/hacklytics2027/components/Footer.tsx
@@ -12,7 +12,7 @@ export default function Footer() {
     <footer className="relative z-10 w-full bg-gradient-to-b from-[#020204]/70 to-[#020204] to-40% overflow-hidden">
       <div className="section-wrap max-w-7xl mx-auto pt-20 md:pt-28 pb-10 px-6 relative z-10">
         <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-8">
-          Applications open soon.
+          Applications <span className="neon-cyan">open soon.</span>
         </h2>
 
         <div className="flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-16">
@@ -20,11 +20,11 @@ export default function Footer() {
             href={INTEREST_URL}
             target="_blank"
             rel="noopener noreferrer"
-            className="pixel-btn inline-flex items-center justify-center px-8 py-4 font-sans font-bold text-sm uppercase tracking-[0.14em] w-full sm:w-auto"
+            className="pixel-btn inline-flex items-center justify-center px-10 py-4 font-pixel text-xs w-full sm:w-auto"
           >
             Notify me →
           </a>
-          <p className="font-sans text-sm text-white/45 max-w-sm leading-relaxed">
+          <p className="font-sans text-base text-white/65 max-w-sm leading-relaxed">
             We’ll let you know the moment they do.
           </p>
         </div>
diff --git a/sites/hacklytics2027/components/sections/AboutSection.tsx b/sites/hacklytics2027/components/sections/AboutSection.tsx
index 03542504..a4c138cd 100644
--- a/sites/hacklytics2027/components/sections/AboutSection.tsx
+++ b/sites/hacklytics2027/components/sections/AboutSection.tsx
@@ -3,44 +3,48 @@ import React from "react";
 import Eyebrow from "./Eyebrow";
 
 const stats = [
-  { num: "01", label: "1,000+ hackers", detail: "Capacity at Klaus" },
-  { num: "02", label: "36 hours", detail: "Fri night through Sunday" },
-  { num: "03", label: "Free to attend", detail: "Meals, swag, and cloud credits included" },
-];
+  { value: "1,000+", label: "Hackers", detail: "Capacity at Klaus", tone: "cyan" },
+  { value: "36", label: "Hours", detail: "Fri night through Sunday", tone: "pink" },
+  { value: "Free", label: "To attend", detail: "Meals, swag, and cloud credits included", tone: "lime" },
+] as const;
+
+const FRAME = { cyan: "pixel-cyan", pink: "pixel-pink", lime: "pixel-lime" } as const;
+const NEON = { cyan: "neon-cyan", pink: "neon-pink", lime: "neon-lime" } as const;
 
 const AboutSection: React.FC = () => {
   return (
     <section id="about" className="section-anchor text-white relative">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-24 px-6">
-        <div className="grid grid-cols-1 lg:grid-cols-5 gap-12 lg:gap-20">
-          <div className="lg:col-span-3">
-            <Eyebrow>About</Eyebrow>
-            <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white mb-8 leading-[0.95] tracking-[-0.03em]">
-              A hub of innovation.
+      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
+        <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-20 items-end">
+          <div>
+            <Eyebrow index="01" tone="cyan">About</Eyebrow>
+            <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em]">
+              A hub of <span className="neon-cyan">innovation.</span>
             </h2>
-            <p className="font-sans text-lg md:text-xl text-white/55 leading-[1.65] max-w-xl font-normal">
-              Hacklytics is the Southeast’s 36-hour data science and AI hackathon,
-              hosted by Data Science @ GT at the Klaus Advanced Computing Building
-              in Atlanta, February 26–28, 2027.
-            </p>
           </div>
-
-          <ol className="lg:col-span-2 flex flex-col justify-center gap-8 lg:pt-12">
-            {stats.map((s) => (
-              <li key={s.num} className="flex items-baseline gap-5">
-                <span className="font-sans text-sm text-bloom-cyan tabular-nums w-8 shrink-0">
-                  {s.num}
-                </span>
-                <div>
-                  <p className="font-sans font-bold text-xl md:text-2xl text-white tracking-tight">
-                    {s.label}
-                  </p>
-                  <p className="font-sans text-sm text-white/40 mt-1">{s.detail}</p>
-                </div>
-              </li>
-            ))}
-          </ol>
+          <p className="font-sans text-lg md:text-xl text-white/70 leading-[1.65] max-w-xl">
+            Hacklytics is the Southeast’s 36-hour data science and AI hackathon,
+            hosted by Data Science @ GT at the Klaus Advanced Computing Building
+            in Atlanta, February 26–28, 2027.
+          </p>
         </div>
+
+        <ul className="grid grid-cols-1 sm:grid-cols-3 gap-5 mt-14 md:mt-20">
+          {stats.map((s) => (
+            <li
+              key={s.label}
+              className={`pixel-frame ${FRAME[s.tone]} bg-white/[0.03] px-6 py-7 md:px-8 md:py-9 transition-colors duration-300 hover:bg-white/[0.06]`}
+            >
+              <p className={`font-sans font-bold text-5xl md:text-6xl tracking-[-0.04em] tabular-nums ${NEON[s.tone]}`}>
+                {s.value}
+              </p>
+              <p className="font-pixel text-[11px] md:text-xs uppercase text-white/85 mt-4">
+                {s.label}
+              </p>
+              <p className="font-sans text-sm text-white/55 mt-2">{s.detail}</p>
+            </li>
+          ))}
+        </ul>
       </div>
     </section>
   );
diff --git a/sites/hacklytics2027/components/sections/Eyebrow.tsx b/sites/hacklytics2027/components/sections/Eyebrow.tsx
index cce0fe35..cb31277e 100644
--- a/sites/hacklytics2027/components/sections/Eyebrow.tsx
+++ b/sites/hacklytics2027/components/sections/Eyebrow.tsx
@@ -1,9 +1,31 @@
 import type { ReactNode } from "react";
 
-export default function Eyebrow({ children }: { children: ReactNode }) {
+export type Tone = "pink" | "cyan" | "lime" | "purple";
+
+const TONE: Record<Tone, { text: string; dot: string }> = {
+  pink: { text: "text-bloom-pink", dot: "bg-bloom-pink shadow-[0_0_10px_rgba(255,45,120,0.9)]" },
+  cyan: { text: "text-bloom-cyan", dot: "bg-bloom-cyan shadow-[0_0_10px_rgba(0,229,255,0.9)]" },
+  lime: { text: "text-bloom-lime", dot: "bg-bloom-lime shadow-[0_0_10px_rgba(200,255,0,0.9)]" },
+  purple: { text: "text-[#c77dff]", dot: "bg-bloom-purple shadow-[0_0_10px_rgba(155,0,255,0.9)]" },
+};
+
+/** Section label in the hero's pixel type, so the theme carries past the fold. */
+export default function Eyebrow({
+  children,
+  index,
+  tone = "cyan",
+}: {
+  children: ReactNode;
+  /** Two-digit section number, shown before the label. */
+  index?: string;
+  tone?: Tone;
+}) {
+  const t = TONE[tone];
   return (
-    <p className="font-sans text-[11px] uppercase tracking-[0.28em] text-white/40 mb-3">
-      {children}
+    <p className={`flex items-center gap-3 font-pixel text-[11px] md:text-xs uppercase mb-5 ${t.text}`}>
+      <span aria-hidden className={`h-2 w-2 ${t.dot}`} />
+      {index && <span className="text-white/35">{index}</span>}
+      <span>{children}</span>
     </p>
   );
 }
diff --git a/sites/hacklytics2027/components/sections/FAQSection.tsx b/sites/hacklytics2027/components/sections/FAQSection.tsx
index db79ef07..5024a9b6 100644
--- a/sites/hacklytics2027/components/sections/FAQSection.tsx
+++ b/sites/hacklytics2027/components/sections/FAQSection.tsx
@@ -26,7 +26,7 @@ const faqItems: { q: string; a: React.ReactNode }[] = [
           href={INTEREST_URL}
           target="_blank"
           rel="noopener noreferrer"
-          className="text-white underline underline-offset-4 hover:text-white"
+          className="text-bloom-cyan underline underline-offset-4 hover:text-white"
         >
           Get notified
         </Link>{" "}
@@ -48,7 +48,7 @@ const faqItems: { q: string; a: React.ReactNode }[] = [
           href="https://discord.gg/hacklytics"
           target="_blank"
           rel="noopener noreferrer"
-          className="text-white underline underline-offset-4 hover:text-white"
+          className="text-bloom-cyan underline underline-offset-4 hover:text-white"
         >
           Discord
         </Link>
@@ -65,7 +65,7 @@ const faqItems: { q: string; a: React.ReactNode }[] = [
           href="https://static.mlh.io/docs/mlh-code-of-conduct.pdf"
           target="_blank"
           rel="noopener noreferrer"
-          className="text-white underline underline-offset-4 hover:text-white"
+          className="text-bloom-cyan underline underline-offset-4 hover:text-white"
         >
           MLH Code of Conduct
         </Link>
@@ -75,22 +75,27 @@ const faqItems: { q: string; a: React.ReactNode }[] = [
   },
 ];
 
+const TINTS = ["pixel-cyan", "pixel-pink", "pixel-lime", "pixel-purple"];
+
 export default function FAQSection() {
   return (
-    <section id="faqs" className="section-anchor text-white relative border-t border-white/[0.06]">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-24 px-6">
-        <Eyebrow>FAQ</Eyebrow>
+    <section id="faqs" className="section-anchor text-white relative">
+      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
+        <Eyebrow index="06" tone="purple">FAQ</Eyebrow>
         <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-12 md:mb-16">
-          Ask us anything.
+          Ask us <span className="neon-purple">anything.</span>
         </h2>
 
-        <dl className="flex flex-col gap-10 max-w-3xl">
-          {faqItems.map((item) => (
-            <div key={item.q}>
+        <dl className="grid grid-cols-1 md:grid-cols-2 gap-5">
+          {faqItems.map((item, i) => (
+            <div
+              key={item.q}
+              className={`pixel-frame ${TINTS[i % TINTS.length]} bg-white/[0.03] p-6 md:p-7`}
+            >
               <dt className="font-sans font-bold text-lg md:text-xl text-white tracking-tight">
                 {item.q}
               </dt>
-              <dd className="font-sans text-base text-white/60 leading-[1.7] mt-2">
+              <dd className="font-sans text-base text-white/70 leading-[1.7] mt-2">
                 {item.a}
               </dd>
             </div>
diff --git a/sites/hacklytics2027/components/sections/PrizeAndSpeakerSection.tsx b/sites/hacklytics2027/components/sections/PrizeAndSpeakerSection.tsx
index 4f8db835..ed86f979 100644
--- a/sites/hacklytics2027/components/sections/PrizeAndSpeakerSection.tsx
+++ b/sites/hacklytics2027/components/sections/PrizeAndSpeakerSection.tsx
@@ -1,48 +1,69 @@
 "use client";
 import React from "react";
+import PixelSprite from "../pixel/PixelSprite";
+import { BLOOM, DAISY, SPROUT, TULIP } from "../pixel/sprites";
+import type { PaletteName, SpriteMap } from "../pixel/sprites";
 import Eyebrow from "./Eyebrow";
 
-const otherPrizes = [
-  { label: "Track", detail: "First and second in each track." },
-  { label: "MLH", detail: "Sponsor challenges stack on top." },
-  { label: "Beginner", detail: "Beginner-friendly award." },
+const otherPrizes: {
+  label: string;
+  detail: string;
+  sprite: SpriteMap;
+  palette: PaletteName;
+}[] = [
+  { label: "Track", detail: "First and second in each track.", sprite: DAISY, palette: "lime" },
+  { label: "MLH", detail: "Sponsor challenges stack on top.", sprite: TULIP, palette: "cyan" },
+  { label: "Beginner", detail: "Beginner-friendly award.", sprite: SPROUT, palette: "purple" },
 ];
 
+const FRAME: Record<PaletteName, string> = {
+  pink: "pixel-pink",
+  cyan: "pixel-cyan",
+  lime: "pixel-lime",
+  purple: "pixel-purple",
+};
+
 export default function PrizeAndSpeakerSection() {
   return (
-    <section id="prizes" className="section-anchor text-white relative border-t border-white/[0.06]">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-24 px-6">
-        <Eyebrow>Prizes</Eyebrow>
+    <section id="prizes" className="section-anchor text-white relative">
+      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
+        <Eyebrow index="03" tone="pink">Prizes</Eyebrow>
         <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-12 md:mb-16">
-          Bloom, then win.
+          Bloom, then <span className="neon-pink">win.</span>
         </h2>
 
-        <div className="grid grid-cols-1 md:grid-cols-2 gap-12 md:gap-20">
-          <div>
-            <p className="font-sans text-[11px] uppercase tracking-[0.28em] text-white/40 mb-4">
-              Best Overall
-            </p>
-            <p className="font-sans font-bold text-3xl md:text-4xl text-white tracking-tight">
-              Purse TBA.
-            </p>
-            <p className="font-sans text-base text-white/45 mt-4 max-w-sm leading-relaxed">
-              Top projects across all tracks. Prize details land closer to the
-              event.
-            </p>
+        <div className="grid grid-cols-1 lg:grid-cols-5 gap-5">
+          <div className="pixel-frame pixel-pink hud hud-pink relative overflow-hidden bg-white/[0.03] p-8 md:p-12 lg:col-span-3 flex flex-col justify-between min-h-[20rem]">
+            {/* The event's top prize gets the only oversized sprite on the page.
+                Hidden on phones, where it would sit under the text. */}
+            <div aria-hidden className="pointer-events-none hidden sm:block absolute right-6 bottom-6 md:right-10 md:bottom-10 opacity-70">
+              <PixelSprite map={BLOOM} palette="pink" scale={14} glow />
+            </div>
+            <p className="relative font-pixel text-xs uppercase text-bloom-pink">Best overall</p>
+            <div className="relative">
+              <p className="font-sans font-bold text-5xl md:text-7xl tracking-[-0.04em] text-white">
+                Purse <span className="neon-pink">TBA</span>
+              </p>
+              <p className="font-sans text-base md:text-lg text-white/65 mt-4 max-w-sm leading-relaxed">
+                Top projects across all tracks. Prize details land closer to the
+                event.
+              </p>
+            </div>
           </div>
 
-          <ul className="flex flex-col border-t border-white/10">
+          <ul className="lg:col-span-2 grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-1 gap-5">
             {otherPrizes.map((p) => (
               <li
                 key={p.label}
-                className="flex items-baseline justify-between gap-6 border-b border-white/10 py-5"
+                className={`pixel-frame ${FRAME[p.palette]} bg-white/[0.03] px-6 py-5 flex items-center gap-5 transition-colors duration-300 hover:bg-white/[0.06]`}
               >
-                <span className="font-sans text-[11px] uppercase tracking-[0.22em] text-white/40 shrink-0">
-                  {p.label}
-                </span>
-                <span className="font-sans text-base text-white text-right">
-                  {p.detail}
+                <span className="flex w-10 shrink-0 justify-center">
+                  <PixelSprite map={p.sprite} palette={p.palette} scale={3} glow />
                 </span>
+                <div>
+                  <p className="font-pixel text-[11px] uppercase text-white/85">{p.label}</p>
+                  <p className="font-sans text-sm md:text-base text-white/65 mt-1">{p.detail}</p>
+                </div>
               </li>
             ))}
           </ul>
diff --git a/sites/hacklytics2027/components/sections/Schedule/Schedule.tsx b/sites/hacklytics2027/components/sections/Schedule/Schedule.tsx
index c686e3d0..daa94e9b 100644
--- a/sites/hacklytics2027/components/sections/Schedule/Schedule.tsx
+++ b/sites/hacklytics2027/components/sections/Schedule/Schedule.tsx
@@ -3,38 +3,72 @@ import React from "react";
 import { board } from "./data";
 import Eyebrow from "../Eyebrow";
 
+const DAYS = [
+  { key: "Fri", name: "Friday", date: "Feb 26", frame: "pixel-cyan", text: "text-bloom-cyan" },
+  { key: "Sat", name: "Saturday", date: "Feb 27", frame: "pixel-lime", text: "text-bloom-lime" },
+  { key: "Sun", name: "Sunday", date: "Feb 28", frame: "pixel-pink", text: "text-bloom-pink" },
+] as const;
+
+// "Fri 5:00 PM" → day "Fri", time "5:00 PM"; "Sat, all day" → "Sat", "All day".
+const split = (when: string) => {
+  const day = when.slice(0, 3);
+  const rest = when.slice(3).replace(/^,?\s*/, "");
+  return { day, time: rest.charAt(0).toUpperCase() + rest.slice(1) };
+};
+
 export default function Schedule() {
+  const rows = board.map((row) => ({ ...row, ...split(row.when) }));
+
   return (
-    <section id="schedule" className="section-anchor text-white border-t border-white/[0.06]">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-24 px-6">
-        <Eyebrow>Schedule</Eyebrow>
-        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-4 max-w-3xl">
-          36 hours. One Klaus weekend.
+    <section id="schedule" className="section-anchor text-white">
+      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
+        <Eyebrow index="04" tone="cyan">Schedule</Eyebrow>
+        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-5 max-w-3xl">
+          36 hours. <span className="neon-cyan">One Klaus weekend.</span>
         </h2>
-        <p className="font-sans text-sm md:text-base text-white/45 mb-12 md:mb-16 max-w-xl">
+        <p className="font-sans text-base md:text-lg text-white/65 mb-12 md:mb-16 max-w-xl">
           The key times so far. Meals and workshops are added closer to the
           weekend.
         </p>
 
-        <ol className="border-t border-white/10">
-          {board.map((row) => (
-            <li
-              key={`${row.when}-${row.event}`}
-              className="grid grid-cols-[7.5rem_1fr] sm:grid-cols-[10rem_1fr] gap-4 sm:gap-10 border-b border-white/10 py-4 md:py-5"
-            >
-              <span
-                className={`font-sans text-sm md:text-base tabular-nums tracking-wide ${
-                  row.accent ? "text-bloom-cyan" : "text-white/45"
-                }`}
-              >
-                {row.when}
-              </span>
-              <span className="font-sans font-medium text-base md:text-lg text-white">
-                {row.event}
-              </span>
-            </li>
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-5">
+          {DAYS.map((d) => (
+            <div key={d.key} className={`pixel-frame ${d.frame} bg-white/[0.03] p-6 md:p-8`}>
+              <div className="flex items-baseline justify-between mb-8">
+                <p className={`font-pixel text-sm uppercase ${d.text}`}>{d.name}</p>
+                <p className="font-pixel text-[10px] uppercase text-white/45">{d.date}</p>
+              </div>
+
+              <ol className="relative border-l-2 border-dashed border-white/15 ml-1.5 flex flex-col gap-7">
+                {rows
+                  .filter((r) => r.day === d.key)
+                  .map((r) => (
+                    <li key={r.when} className="relative pl-7">
+                      {/* Square node on the rail; the milestones glow. */}
+                      <span
+                        aria-hidden
+                        className={`absolute -left-[7px] top-1.5 h-3 w-3 ${
+                          r.accent
+                            ? "bg-bloom-cyan shadow-[0_0_12px_rgba(0,229,255,0.9)]"
+                            : "bg-white/30"
+                        }`}
+                      />
+                      <p
+                        className={`font-sans text-sm tabular-nums ${
+                          r.accent ? "text-bloom-cyan" : "text-white/55"
+                        }`}
+                      >
+                        {r.time}
+                      </p>
+                      <p className="font-sans font-bold text-lg md:text-xl text-white tracking-tight mt-0.5">
+                        {r.event}
+                      </p>
+                    </li>
+                  ))}
+              </ol>
+            </div>
           ))}
-        </ol>
+        </div>
       </div>
     </section>
   );
diff --git a/sites/hacklytics2027/components/sections/Sponsor.tsx b/sites/hacklytics2027/components/sections/Sponsor.tsx
index 3aa61628..2484d0ba 100644
--- a/sites/hacklytics2027/components/sections/Sponsor.tsx
+++ b/sites/hacklytics2027/components/sections/Sponsor.tsx
@@ -1,50 +1,54 @@
 "use client";
 import React from "react";
-import Link from "next/link";
+import PixelSprite from "../pixel/PixelSprite";
+import { DAISY, MUSHROOM, TULIP } from "../pixel/sprites";
 import Eyebrow from "./Eyebrow";
 
 export default function SponsorsSection() {
   return (
-    <section id="sponsors" className="section-anchor relative text-white border-t border-white/[0.06]">
-      <div className="section-wrap max-w-7xl mx-auto px-6 py-20 md:py-24">
-        <Eyebrow>Sponsors</Eyebrow>
+    <section id="sponsors" className="section-anchor relative text-white">
+      <div className="section-wrap max-w-7xl mx-auto px-6 py-20 md:py-28">
+        <Eyebrow index="05" tone="lime">Sponsors</Eyebrow>
         <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-12 md:mb-16">
-          Grow with us.
+          Grow <span className="neon-lime">with us.</span>
         </h2>
 
-        <div className="flex flex-col sm:flex-row sm:items-stretch gap-4">
-          <div className="flex flex-col justify-center gap-1 border border-white/20 px-8 py-6 min-h-[5.5rem] sm:w-48">
-            <span className="font-sans text-[11px] uppercase tracking-[0.22em] text-white/40">
-              Hosted by
-            </span>
-            <span className="font-sans font-bold text-lg tracking-tight text-white">
-              DS @ GT
-            </span>
+        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-5">
+          <div className="pixel-frame pixel-cyan bg-white/[0.03] px-7 py-8 flex flex-col justify-between gap-6">
+            <p className="font-pixel text-[11px] uppercase text-bloom-cyan">Hosted by</p>
+            <p className="font-sans font-bold text-2xl tracking-tight text-white">Data Science @ GT</p>
           </div>
-          <div className="flex flex-col justify-center gap-1 border border-white/20 px-8 py-6 min-h-[5.5rem] sm:w-48">
-            <span className="font-sans text-[11px] uppercase tracking-[0.22em] text-white/40">
-              Member event
-            </span>
-            <span className="font-sans font-bold text-lg tracking-tight text-white">
-              MLH
-            </span>
+          <div className="pixel-frame pixel-pink bg-white/[0.03] px-7 py-8 flex flex-col justify-between gap-6">
+            <p className="font-pixel text-[11px] uppercase text-bloom-pink">Member event</p>
+            <p className="font-sans font-bold text-2xl tracking-tight text-white">Major League Hacking</p>
           </div>
+
           {/* An invitation, not an empty logo slot: 2027 partners are not
               announced yet. */}
-          <div className="flex flex-1 flex-col justify-center gap-1 border border-white/20 px-8 py-6 min-h-[5.5rem]">
-            <span className="font-sans font-bold text-lg tracking-tight text-white">
-              Sponsor Hacklytics 2027
-            </span>
-            <p className="font-sans text-sm text-white/50">
-              Email{" "}
-              <Link
+          <div className="pixel-frame pixel-lime hud hud-lime relative overflow-hidden bg-white/[0.03] px-7 py-8 sm:col-span-2 flex flex-col sm:flex-row sm:items-end justify-between gap-6">
+            <div className="relative">
+              <p className="font-pixel text-[11px] uppercase text-bloom-lime">2027 partners</p>
+              <p className="font-sans font-bold text-2xl md:text-3xl tracking-tight text-white mt-6">
+                Sponsor Hacklytics 2027
+              </p>
+              <p className="font-sans text-base text-white/65 mt-2 max-w-sm">
+                Put your problems in front of 1,000+ builders. Ask for the
+                partner deck.
+              </p>
+            </div>
+            <div className="relative flex flex-col items-start sm:items-end gap-5 shrink-0">
+              <span className="hidden sm:flex items-end gap-2" aria-hidden>
+                <PixelSprite map={TULIP} palette="cyan" scale={3} glow className="animate-bob" />
+                <PixelSprite map={DAISY} palette="lime" scale={3} glow className="animate-bob" />
+                <PixelSprite map={MUSHROOM} palette="pink" scale={3} glow className="animate-bob" />
+              </span>
+              <a
                 href="mailto:hello@hacklytics.io"
-                className="text-white/80 hover:text-white underline underline-offset-4"
+                className="pixel-btn inline-flex items-center justify-center px-6 py-3.5 font-pixel text-xs w-full sm:w-auto"
               >
-                hello@hacklytics.io
-              </Link>{" "}
-              for the partner deck.
-            </p>
+                Email us →
+              </a>
+            </div>
           </div>
         </div>
       </div>
diff --git a/sites/hacklytics2027/components/sections/TracksSection.tsx b/sites/hacklytics2027/components/sections/TracksSection.tsx
index dca1eb60..12886050 100644
--- a/sites/hacklytics2027/components/sections/TracksSection.tsx
+++ b/sites/hacklytics2027/components/sections/TracksSection.tsx
@@ -38,7 +38,7 @@ const tracks: {
     title: "Entertainment",
     description: "Media, games, and interactive AI.",
     sprite: MUSHROOM,
-    palette: "pink",
+    palette: "purple",
   },
   {
     num: "05",
@@ -49,37 +49,53 @@ const tracks: {
   },
 ];
 
+const FRAME: Record<PaletteName, string> = {
+  pink: "pixel-pink",
+  cyan: "pixel-cyan",
+  lime: "pixel-lime",
+  purple: "pixel-purple",
+};
+
+const NUM: Record<PaletteName, string> = {
+  pink: "text-bloom-pink",
+  cyan: "text-bloom-cyan",
+  lime: "text-bloom-lime",
+  purple: "text-[#c77dff]",
+};
+
 export default function TracksSection() {
   return (
-    <section id="tracks" className="section-anchor relative text-white border-t border-white/[0.06]">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-24 px-6">
-        <Eyebrow>Tracks</Eyebrow>
+    <section id="tracks" className="section-anchor relative text-white">
+      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
+        <Eyebrow index="02" tone="lime">Tracks</Eyebrow>
         <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-12 md:mb-16 max-w-3xl">
-          Five tracks. One weekend.
+          Five tracks. <span className="neon-lime">One weekend.</span>
         </h2>
 
-        <ul className="flex flex-col border-t border-white/10">
-          {tracks.map(({ num, title, description, sprite, palette }) => (
+        {/* Six columns so three cards fill the first row and two wider ones
+            the second, instead of a lone card stranded on the last row. */}
+        <ul className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-6 gap-5">
+          {tracks.map(({ num, title, description, sprite, palette }, i) => (
             <li
               key={num}
-              className="flex flex-col sm:flex-row sm:items-center gap-3 sm:gap-6 border-b border-white/10 py-6 md:py-8"
+              className={`group pixel-frame ${FRAME[palette]} relative overflow-hidden bg-white/[0.03] p-6 md:p-8 min-h-[15rem] flex flex-col transition-colors duration-300 hover:bg-white/[0.06] ${
+                i < 3 ? "lg:col-span-2" : "lg:col-span-3"
+              } ${i === 4 ? "sm:col-span-2 lg:col-span-3" : ""}`}
             >
-              <div className="flex items-center gap-4 sm:gap-6 min-w-0">
-                {/* Fixed cell: sprites are 27-33px wide, which staggered the
-                    numbers and titles beside them. */}
-                <span className="flex w-9 shrink-0 justify-center">
-                  <PixelSprite map={sprite} palette={palette} scale={3} />
-                </span>
-                <span className="font-sans text-xs text-white/35 w-6 shrink-0 tabular-nums">
-                  {num}
-                </span>
-                <h3 className="font-sans font-bold text-xl md:text-2xl text-white tracking-tight">
-                  {title}
-                </h3>
+              <div className="flex items-start justify-between">
+                <PixelSprite
+                  map={sprite}
+                  palette={palette}
+                  scale={5}
+                  glow
+                  className="transition-transform duration-300 group-hover:-translate-y-1"
+                />
+                <span className={`font-pixel text-xs ${NUM[palette]}`}>{num}</span>
               </div>
-              <p className="font-sans text-sm md:text-base text-white/45 sm:ml-auto sm:text-right max-w-md pl-[5.75rem] sm:pl-0">
-                {description}
-              </p>
+              <h3 className="font-sans font-bold text-2xl md:text-3xl text-white tracking-tight mt-auto pt-8">
+                {title}
+              </h3>
+              <p className="font-sans text-base text-white/65 mt-2">{description}</p>
             </li>
           ))}
         </ul>

From 41a9c38de791e1deb1c544c93247bd1a8c40581b Mon Sep 17 00:00:00 2001
From: aamoghS <aamoghsawantt@gmail.com>
Date: Thu, 1 Oct 2026 19:35:17 -0400
Subject: [PATCH 2/3] fix(hacklytics): clean up the hero and navbar

- Drop the two rotating petal rings behind the title: at that size
  and opacity they read as a pink smudge, not a lotus.
- Say when and where in the hero (Feb 26-28, 2027, Klaus, Atlanta);
  it said neither.
- The Data Science @ GT badge is a label, so it loses the pointer
  cursor and hover state, and one of its two blooms.
- Countdown digits are one weight and color with seconds as the live
  accent, instead of fading to 40% across the row.
- Subtitle, hint and nav text move up in contrast; nav and mobile
  Notify buttons use the pixel font like the hero buttons.
---
 sites/hacklytics2027/app/page.tsx          | 68 ++++++----------------
 sites/hacklytics2027/components/Navbar.tsx | 12 ++--
 2 files changed, 23 insertions(+), 57 deletions(-)

diff --git a/sites/hacklytics2027/app/page.tsx b/sites/hacklytics2027/app/page.tsx
index 91df5cd3..f1b16a6e 100644
--- a/sites/hacklytics2027/app/page.tsx
+++ b/sites/hacklytics2027/app/page.tsx
@@ -12,37 +12,6 @@ const FloralBackground = () => (
     {/* Subtle grid base */}
     <div className="absolute inset-0 bg-[url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGNpcmNsZSBjeD0iMSIgY3k9IjEiIHI9IjEiIGZpbGw9InJnYmEoMjU1LDI1NSwyNTUsMC4wMykiLz48L3N2Zz4=')] [mask-image:radial-gradient(ellipse_at_center,black_40%,transparent_80%)]" />
 
-    {/* Center digital bloom (rotating lotus).
-        No backdrop-blur on the petals: they sit over a near-black backdrop, so
-        the blur produced nothing visible while forcing 20 full-screen readbacks
-        per frame while rotating. Gradients alone look identical here. */}
-    <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] opacity-30 animate-spin-slow">
-      {Array.from({ length: 12 }).map((_, i) => (
-        <div
-          key={i}
-          className="absolute inset-0 rounded-full border border-bloom-pink/20 bg-gradient-to-t from-bloom-pink/10 to-transparent"
-          style={{
-            transform: `rotate(${i * 30}deg) scaleY(2.5) scaleX(0.3)`,
-            transformOrigin: "center center",
-          }}
-        />
-      ))}
-    </div>
-
-    {/* Secondary Bloom */}
-    <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[600px] h-[600px] opacity-20 animate-spin-slow" style={{ animationDirection: 'reverse', animationDuration: '40s' }}>
-      {Array.from({ length: 8 }).map((_, i) => (
-        <div
-          key={i}
-          className="absolute inset-0 rounded-full border border-bloom-cyan/30 bg-gradient-to-t from-bloom-cyan/15 to-transparent"
-          style={{
-            transform: `rotate(${i * 45}deg) scaleY(2) scaleX(0.4)`,
-            transformOrigin: "center center",
-          }}
-        />
-      ))}
-    </div>
-
     {/* Ambient light fields — static radial gradients instead of pulsing
         blur() layers, which re-rasterized a 50vw surface every frame. */}
     <div
@@ -85,19 +54,19 @@ const Countdown: React.FC<{ targetDate: Date }> = ({ targetDate }) => {
 
   const units = [
     { label: "Days",    value: timeLeft?.days,    color: "text-white" },
-    { label: "Hours",   value: timeLeft?.hours,   color: "text-white/80" },
-    { label: "Minutes", value: timeLeft?.minutes, color: "text-white/60" },
-    { label: "Seconds", value: timeLeft?.seconds, color: "text-white/40" },
+    { label: "Hours",   value: timeLeft?.hours,   color: "text-white" },
+    { label: "Minutes", value: timeLeft?.minutes, color: "text-white" },
+    { label: "Seconds", value: timeLeft?.seconds, color: "neon-cyan" },
   ];
 
   return (
     <div className="flex flex-wrap items-center justify-center gap-6 md:gap-12 mt-12 md:mt-20">
       {units.map(({ label, value, color }) => (
         <div key={label} className="flex flex-col items-center">
-          <span className={`font-sans font-light text-5xl md:text-7xl tracking-tighter ${mounted ? color : "text-white/10"} transition-colors duration-1000`}>
+          <span className={`font-sans font-medium text-5xl md:text-7xl tracking-tighter tabular-nums ${mounted ? color : "text-white/10"} transition-colors duration-1000`}>
             {mounted ? fmt(value) : "00"}
           </span>
-          <span className="font-pixel text-[10px] md:text-xs text-white/45 mt-3">
+          <span className="font-pixel text-[10px] md:text-xs text-white/60 mt-3">
             {label}
           </span>
         </div>
@@ -136,17 +105,16 @@ export default function HomePage() {
         <div className="relative z-10 w-full max-w-7xl mx-auto px-6 pt-32 pb-40 md:pt-48 md:pb-48 flex flex-col items-center text-center animate-fade-in-up">
 
           {/* Pill Badge */}
-          <div className="pixel-frame pixel-cyan hud inline-flex items-center gap-3 px-5 py-2.5 bg-white/5 mb-10 hover:bg-white/10 transition-colors duration-300 cursor-pointer group">
-            <span className="neo-blink h-2 w-2 bg-bloom-lime shadow-[0_0_10px_rgba(200,255,0,0.9)]" aria-hidden />
+          {/* A label, not a link: no pointer or hover state. */}
+          <div className="pixel-frame pixel-cyan hud inline-flex items-center gap-3 px-5 py-2.5 bg-white/5 mb-10">
             <PixelSprite map={BLOOM} palette="pink" scale={2} glow className="animate-bob" />
-            <span className="font-pixel text-[10px] md:text-xs text-white/80 group-hover:text-white transition-colors">
+            <span className="font-pixel text-[10px] md:text-xs text-white/85">
               Data Science @ Georgia Tech
             </span>
-            <PixelSprite map={BLOOM} palette="cyan" scale={2} glow className="animate-bob" />
           </div>
 
           {/* Main title - Elegantly oversized, tight tracking */}
-          <div className="flex items-end justify-center gap-4 md:gap-10 mb-8">
+          <div className="flex items-end justify-center gap-4 md:gap-10 mb-10 md:mb-12">
             <PixelSprite
               map={TULIP}
               palette="pink"
@@ -171,7 +139,12 @@ export default function HomePage() {
             />
           </div>
 
-          <p className="font-sans text-lg md:text-xl lg:text-2xl text-white/50 max-w-2xl mx-auto leading-relaxed mb-12 font-light tracking-wide">
+          {/* When and where, up front: the hero never said either. */}
+          <p className="font-pixel text-xs md:text-sm uppercase neon-cyan mb-6">
+            Feb 26–28, 2027 · Klaus, Atlanta
+          </p>
+
+          <p className="font-sans text-lg md:text-xl lg:text-2xl text-white/70 max-w-2xl mx-auto leading-relaxed mb-12 font-light tracking-wide">
             36 hours of intelligence, innovation, and digital bloom. <br className="hidden md:block"/>
             Join 1,000+ hackers in Atlanta, GA.
           </p>
@@ -201,7 +174,7 @@ export default function HomePage() {
             </div>
             <span
               id="notify-handoff-hint"
-              className="font-sans text-[11px] leading-snug text-white/40 text-center"
+              className="font-sans text-xs leading-snug text-white/55 text-center"
             >
               {INTEREST_HINT}
             </span>
@@ -223,15 +196,8 @@ export default function HomePage() {
         <HomeSections />
       </div>
       
-      {/* Required for the spin animation if not in tailwind config */}
+      {/* Hero entrance animation, not in the tailwind config */}
       <style dangerouslySetInnerHTML={{__html: `
-        @keyframes spin-slow {
-          from { transform: translate(-50%, -50%) rotate(0deg); }
-          to { transform: translate(-50%, -50%) rotate(360deg); }
-        }
-        .animate-spin-slow {
-          animation: spin-slow 60s linear infinite;
-        }
         @keyframes fade-in-up {
           from { opacity: 0; transform: translateY(20px); }
           to { opacity: 1; transform: translateY(0); }
diff --git a/sites/hacklytics2027/components/Navbar.tsx b/sites/hacklytics2027/components/Navbar.tsx
index ad0f967a..1b837be0 100644
--- a/sites/hacklytics2027/components/Navbar.tsx
+++ b/sites/hacklytics2027/components/Navbar.tsx
@@ -112,8 +112,8 @@ export default function Navbar() {
             onClick={() => setOpen(false)}
             className="flex items-center gap-3 group shrink-0"
           >
-            <PixelSprite map={SPROUT} palette="lime" scale={2} />
-            <span className="font-sans font-bold text-sm tracking-tight text-white group-hover:text-white/80 transition-colors">
+            <PixelSprite map={SPROUT} palette="lime" scale={2} glow />
+            <span className="font-pixel text-xs text-white group-hover:text-bloom-lime transition-colors">
               DS @ GT
             </span>
           </Link>
@@ -125,7 +125,7 @@ export default function Navbar() {
                 key={name}
                 href={href}
                 onClick={(e) => handleNavClick(e, href)}
-                className="font-sans text-[11px] uppercase tracking-[0.22em] text-white/55 hover:text-white transition-colors py-2"
+                className="font-sans text-xs uppercase tracking-[0.2em] text-white/70 hover:text-bloom-cyan transition-colors py-2"
               >
                 {name}
               </a>
@@ -137,7 +137,7 @@ export default function Navbar() {
             target="_blank"
             rel="noopener noreferrer"
             aria-label={`Notify me. ${INTEREST_HINT}`}
-            className="pixel-btn hidden lg:inline-flex items-center justify-center px-6 py-2.5 font-sans font-bold text-[11px] uppercase tracking-[0.14em] shrink-0"
+            className="pixel-btn hidden lg:inline-flex items-center justify-center px-6 py-2.5 font-pixel text-[11px] shrink-0"
           >
             Notify me
           </a>
@@ -181,7 +181,7 @@ export default function Navbar() {
               key={name}
               href={href}
               onClick={(e) => handleNavClick(e, href)}
-              className="font-sans font-medium text-3xl text-white/55 hover:text-white py-4 border-b border-white/10 transition-colors tracking-tight"
+              className="font-sans font-medium text-3xl text-white/75 hover:text-bloom-cyan py-4 border-b border-white/10 transition-colors tracking-tight"
             >
               {name}
             </a>
@@ -194,7 +194,7 @@ export default function Navbar() {
             rel="noopener noreferrer"
             onClick={() => setOpen(false)}
             aria-label={`Notify me. ${INTEREST_HINT}`}
-            className="pixel-btn flex items-center justify-center w-full font-sans font-bold text-sm uppercase tracking-[0.14em] px-8 py-4"
+            className="pixel-btn flex items-center justify-center w-full font-pixel text-xs px-8 py-4"
           >
             Notify me
           </a>

From 72588d7c876c79770aba2b114baadb9469b3b4a7 Mon Sep 17 00:00:00 2001
From: aamoghS <aamoghsawantt@gmail.com>
Date: Thu, 1 Oct 2026 19:44:38 -0400
Subject: [PATCH 3/3] fix(hacklytics): strip the template look from the landing
 page

The page read as generated: a numbered label over every heading, a
neon accent word in every headline, stat cards, the same tinted card
grid in every section, slogans in place of copy, and CRT scanlines,
an RGB-split glitch title, a synthwave grid and a vignette laid over
everything.

- Headings are plain words (Tracks, Prizes, Schedule, Sponsors, FAQ)
  with no numbered labels and no glowing accent words.
- Tracks are the garden: one plant per track on a shared strip of
  the hero's soil, names beneath. Phones get a plain list.
- About, prizes, sponsors and FAQ are text and rules, not cards.
- Hero: no kicker badge, glitch, scanlines, grid or vignette. The
  tagline states what the event is, who runs it, and that it is free.
- The vignette also darkened every heading near the screen edge to
  grey; text is now the white it was set to.
---
 sites/hacklytics2027/app/page.tsx             |  35 ++---
 sites/hacklytics2027/components/Footer.tsx    |   4 +-
 .../components/sections/AboutSection.tsx      |  55 ++-----
 .../components/sections/Eyebrow.tsx           |  31 ----
 .../components/sections/FAQSection.tsx        |  21 +--
 .../sections/PrizeAndSpeakerSection.tsx       |  78 +++-------
 .../components/sections/Schedule/Schedule.tsx |  63 ++++----
 .../components/sections/Sponsor.tsx           |  59 +++-----
 .../components/sections/TracksSection.tsx     | 141 ++++++++----------
 9 files changed, 164 insertions(+), 323 deletions(-)
 delete mode 100644 sites/hacklytics2027/components/sections/Eyebrow.tsx

diff --git a/sites/hacklytics2027/app/page.tsx b/sites/hacklytics2027/app/page.tsx
index f1b16a6e..e983bf30 100644
--- a/sites/hacklytics2027/app/page.tsx
+++ b/sites/hacklytics2027/app/page.tsx
@@ -3,15 +3,12 @@ import React, { useState, useEffect, useSyncExternalStore } from "react";
 import HomeSections from "@/components/HomeSections";
 import PixelGarden, { PixelGround } from "@/components/pixel/PixelGarden";
 import PixelSprite from "@/components/pixel/PixelSprite";
-import { BLOOM, DAISY, SPROUT, TULIP } from "@/components/pixel/sprites";
+import { DAISY, SPROUT, TULIP } from "@/components/pixel/sprites";
 import { INTEREST_HINT, INTEREST_URL } from "@/lib/links";
 
-// ─── Elegant Floral Background ─────────────────────────────────────────────
+// ─── Background: two soft color fields ────────────────────────────────────
 const FloralBackground = () => (
   <div className="fixed inset-0 z-0 pointer-events-none overflow-hidden bg-[#020204]">
-    {/* Subtle grid base */}
-    <div className="absolute inset-0 bg-[url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGNpcmNsZSBjeD0iMSIgY3k9IjEiIHI9IjEiIGZpbGw9InJnYmEoMjU1LDI1NSwyNTUsMC4wMykiLz48L3N2Zz4=')] [mask-image:radial-gradient(ellipse_at_center,black_40%,transparent_80%)]" />
-
     {/* Ambient light fields — static radial gradients instead of pulsing
         blur() layers, which re-rasterized a 50vw surface every frame. */}
     <div
@@ -56,7 +53,7 @@ const Countdown: React.FC<{ targetDate: Date }> = ({ targetDate }) => {
     { label: "Days",    value: timeLeft?.days,    color: "text-white" },
     { label: "Hours",   value: timeLeft?.hours,   color: "text-white" },
     { label: "Minutes", value: timeLeft?.minutes, color: "text-white" },
-    { label: "Seconds", value: timeLeft?.seconds, color: "neon-cyan" },
+    { label: "Seconds", value: timeLeft?.seconds, color: "text-bloom-cyan" },
   ];
 
   return (
@@ -78,7 +75,7 @@ const Countdown: React.FC<{ targetDate: Date }> = ({ targetDate }) => {
 // ─── Page ─────────────────────────────────────────────────────────────────
 export default function HomePage() {
   return (
-    <main className="scanlines neo-vignette relative w-full text-white bg-[#020204] overflow-x-hidden selection:bg-bloom-pink/30 selection:text-white min-h-screen">
+    <main className="relative w-full text-white bg-[#020204] overflow-x-hidden selection:bg-bloom-pink/30 selection:text-white min-h-screen">
       
       <FloralBackground />
       <PixelGarden />
@@ -86,9 +83,6 @@ export default function HomePage() {
       {/* ── HERO ── */}
       <section className="relative w-full min-h-screen flex flex-col justify-center items-center overflow-hidden">
 
-        {/* Synthwave horizon grid */}
-        <div className="neo-grid z-[1]" aria-hidden="true" />
-
         {/* MLH badge */}
         <a
           href="https://mlh.io/na?utm_source=na-hackathon&utm_medium=TrustBadge&utm_campaign=2026-season&utm_content=white"
@@ -105,14 +99,6 @@ export default function HomePage() {
         <div className="relative z-10 w-full max-w-7xl mx-auto px-6 pt-32 pb-40 md:pt-48 md:pb-48 flex flex-col items-center text-center animate-fade-in-up">
 
           {/* Pill Badge */}
-          {/* A label, not a link: no pointer or hover state. */}
-          <div className="pixel-frame pixel-cyan hud inline-flex items-center gap-3 px-5 py-2.5 bg-white/5 mb-10">
-            <PixelSprite map={BLOOM} palette="pink" scale={2} glow className="animate-bob" />
-            <span className="font-pixel text-[10px] md:text-xs text-white/85">
-              Data Science @ Georgia Tech
-            </span>
-          </div>
-
           {/* Main title - Elegantly oversized, tight tracking */}
           <div className="flex items-end justify-center gap-4 md:gap-10 mb-10 md:mb-12">
             <PixelSprite
@@ -124,8 +110,7 @@ export default function HomePage() {
               style={{ animationDuration: "6s" }}
             />
             <h1
-              data-text="Hacklytics"
-              className="neo-split neo-glitch font-sans font-medium text-[16vw] sm:text-[14vw] md:text-[11vw] lg:text-[10rem] xl:text-[12rem] leading-[0.8] tracking-[-0.04em] text-white"
+              className="font-sans font-medium text-[16vw] sm:text-[14vw] md:text-[11vw] lg:text-[10rem] xl:text-[12rem] leading-[0.8] tracking-[-0.04em] text-white"
             >
               Hacklytics
             </h1>
@@ -139,14 +124,14 @@ export default function HomePage() {
             />
           </div>
 
-          {/* When and where, up front: the hero never said either. */}
-          <p className="font-pixel text-xs md:text-sm uppercase neon-cyan mb-6">
-            Feb 26–28, 2027 · Klaus, Atlanta
+          {/* When, where and who, up front: the hero said none of them. */}
+          <p className="font-pixel text-xs md:text-sm uppercase text-bloom-cyan mb-6">
+            Feb 26–28, 2027 · Georgia Tech, Atlanta
           </p>
 
           <p className="font-sans text-lg md:text-xl lg:text-2xl text-white/70 max-w-2xl mx-auto leading-relaxed mb-12 font-light tracking-wide">
-            36 hours of intelligence, innovation, and digital bloom. <br className="hidden md:block"/>
-            Join 1,000+ hackers in Atlanta, GA.
+            A 36-hour data science and AI hackathon <br className="hidden md:block"/>
+            run by Data Science @ GT. Free to attend.
           </p>
 
           {/* The caption sits under the pair, not under Notify me alone:
diff --git a/sites/hacklytics2027/components/Footer.tsx b/sites/hacklytics2027/components/Footer.tsx
index 23428326..d23d07e1 100644
--- a/sites/hacklytics2027/components/Footer.tsx
+++ b/sites/hacklytics2027/components/Footer.tsx
@@ -11,8 +11,8 @@ export default function Footer() {
     // visible band where the translucent sections above it ended.
     <footer className="relative z-10 w-full bg-gradient-to-b from-[#020204]/70 to-[#020204] to-40% overflow-hidden">
       <div className="section-wrap max-w-7xl mx-auto pt-20 md:pt-28 pb-10 px-6 relative z-10">
-        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-8">
-          Applications <span className="neon-cyan">open soon.</span>
+        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl text-white leading-[1] tracking-[-0.03em] mb-8">
+          Applications open soon.
         </h2>
 
         <div className="flex flex-col sm:flex-row sm:items-center gap-5 sm:gap-8 mb-16">
diff --git a/sites/hacklytics2027/components/sections/AboutSection.tsx b/sites/hacklytics2027/components/sections/AboutSection.tsx
index a4c138cd..1cecf02e 100644
--- a/sites/hacklytics2027/components/sections/AboutSection.tsx
+++ b/sites/hacklytics2027/components/sections/AboutSection.tsx
@@ -1,50 +1,27 @@
 "use client";
 import React from "react";
-import Eyebrow from "./Eyebrow";
-
-const stats = [
-  { value: "1,000+", label: "Hackers", detail: "Capacity at Klaus", tone: "cyan" },
-  { value: "36", label: "Hours", detail: "Fri night through Sunday", tone: "pink" },
-  { value: "Free", label: "To attend", detail: "Meals, swag, and cloud credits included", tone: "lime" },
-] as const;
-
-const FRAME = { cyan: "pixel-cyan", pink: "pixel-pink", lime: "pixel-lime" } as const;
-const NEON = { cyan: "neon-cyan", pink: "neon-pink", lime: "neon-lime" } as const;
 
 const AboutSection: React.FC = () => {
   return (
     <section id="about" className="section-anchor text-white relative">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
-        <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-20 items-end">
-          <div>
-            <Eyebrow index="01" tone="cyan">About</Eyebrow>
-            <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em]">
-              A hub of <span className="neon-cyan">innovation.</span>
-            </h2>
+      <div className="section-wrap max-w-7xl mx-auto py-24 md:py-32 px-6">
+        <div className="grid grid-cols-1 lg:grid-cols-12 gap-10 lg:gap-16">
+          <h2 className="lg:col-span-5 font-sans font-bold text-4xl sm:text-5xl md:text-6xl text-white leading-[1] tracking-[-0.03em] text-balance">
+            The Southeast’s data science hackathon.
+          </h2>
+
+          <div className="lg:col-span-6 lg:col-start-7 lg:pt-3">
+            <p className="font-sans text-lg md:text-xl text-white/80 leading-[1.6] max-w-[60ch]">
+              Hacklytics is a 36-hour data science and AI hackathon run by Data
+              Science @ GT at the Klaus Advanced Computing Building in Atlanta,
+              February 26–28, 2027.
+            </p>
+            <p className="font-sans text-base md:text-lg text-white/65 leading-[1.6] max-w-[60ch] mt-5">
+              Room for 1,000+ hackers. It costs nothing to attend: meals, swag,
+              and cloud credits are covered.
+            </p>
           </div>
-          <p className="font-sans text-lg md:text-xl text-white/70 leading-[1.65] max-w-xl">
-            Hacklytics is the Southeast’s 36-hour data science and AI hackathon,
-            hosted by Data Science @ GT at the Klaus Advanced Computing Building
-            in Atlanta, February 26–28, 2027.
-          </p>
         </div>
-
-        <ul className="grid grid-cols-1 sm:grid-cols-3 gap-5 mt-14 md:mt-20">
-          {stats.map((s) => (
-            <li
-              key={s.label}
-              className={`pixel-frame ${FRAME[s.tone]} bg-white/[0.03] px-6 py-7 md:px-8 md:py-9 transition-colors duration-300 hover:bg-white/[0.06]`}
-            >
-              <p className={`font-sans font-bold text-5xl md:text-6xl tracking-[-0.04em] tabular-nums ${NEON[s.tone]}`}>
-                {s.value}
-              </p>
-              <p className="font-pixel text-[11px] md:text-xs uppercase text-white/85 mt-4">
-                {s.label}
-              </p>
-              <p className="font-sans text-sm text-white/55 mt-2">{s.detail}</p>
-            </li>
-          ))}
-        </ul>
       </div>
     </section>
   );
diff --git a/sites/hacklytics2027/components/sections/Eyebrow.tsx b/sites/hacklytics2027/components/sections/Eyebrow.tsx
deleted file mode 100644
index cb31277e..00000000
--- a/sites/hacklytics2027/components/sections/Eyebrow.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import type { ReactNode } from "react";
-
-export type Tone = "pink" | "cyan" | "lime" | "purple";
-
-const TONE: Record<Tone, { text: string; dot: string }> = {
-  pink: { text: "text-bloom-pink", dot: "bg-bloom-pink shadow-[0_0_10px_rgba(255,45,120,0.9)]" },
-  cyan: { text: "text-bloom-cyan", dot: "bg-bloom-cyan shadow-[0_0_10px_rgba(0,229,255,0.9)]" },
-  lime: { text: "text-bloom-lime", dot: "bg-bloom-lime shadow-[0_0_10px_rgba(200,255,0,0.9)]" },
-  purple: { text: "text-[#c77dff]", dot: "bg-bloom-purple shadow-[0_0_10px_rgba(155,0,255,0.9)]" },
-};
-
-/** Section label in the hero's pixel type, so the theme carries past the fold. */
-export default function Eyebrow({
-  children,
-  index,
-  tone = "cyan",
-}: {
-  children: ReactNode;
-  /** Two-digit section number, shown before the label. */
-  index?: string;
-  tone?: Tone;
-}) {
-  const t = TONE[tone];
-  return (
-    <p className={`flex items-center gap-3 font-pixel text-[11px] md:text-xs uppercase mb-5 ${t.text}`}>
-      <span aria-hidden className={`h-2 w-2 ${t.dot}`} />
-      {index && <span className="text-white/35">{index}</span>}
-      <span>{children}</span>
-    </p>
-  );
-}
diff --git a/sites/hacklytics2027/components/sections/FAQSection.tsx b/sites/hacklytics2027/components/sections/FAQSection.tsx
index 5024a9b6..94e292a1 100644
--- a/sites/hacklytics2027/components/sections/FAQSection.tsx
+++ b/sites/hacklytics2027/components/sections/FAQSection.tsx
@@ -2,7 +2,6 @@
 import React from "react";
 import Link from "next/link";
 import { INTEREST_URL } from "@/lib/links";
-import Eyebrow from "./Eyebrow";
 
 const faqItems: { q: string; a: React.ReactNode }[] = [
   {
@@ -75,27 +74,21 @@ const faqItems: { q: string; a: React.ReactNode }[] = [
   },
 ];
 
-const TINTS = ["pixel-cyan", "pixel-pink", "pixel-lime", "pixel-purple"];
-
 export default function FAQSection() {
   return (
     <section id="faqs" className="section-anchor text-white relative">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
-        <Eyebrow index="06" tone="purple">FAQ</Eyebrow>
-        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-12 md:mb-16">
-          Ask us <span className="neon-purple">anything.</span>
+      <div className="section-wrap max-w-7xl mx-auto py-24 md:py-32 px-6">
+        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl text-white leading-[1] tracking-[-0.03em] mb-14 md:mb-20">
+          FAQ
         </h2>
 
-        <dl className="grid grid-cols-1 md:grid-cols-2 gap-5">
-          {faqItems.map((item, i) => (
-            <div
-              key={item.q}
-              className={`pixel-frame ${TINTS[i % TINTS.length]} bg-white/[0.03] p-6 md:p-7`}
-            >
+        <dl className="grid grid-cols-1 md:grid-cols-2 gap-x-16 gap-y-10">
+          {faqItems.map((item) => (
+            <div key={item.q} className="border-t border-white/15 pt-5">
               <dt className="font-sans font-bold text-lg md:text-xl text-white tracking-tight">
                 {item.q}
               </dt>
-              <dd className="font-sans text-base text-white/70 leading-[1.7] mt-2">
+              <dd className="font-sans text-base md:text-lg text-white/70 leading-[1.65] mt-2 max-w-[55ch]">
                 {item.a}
               </dd>
             </div>
diff --git a/sites/hacklytics2027/components/sections/PrizeAndSpeakerSection.tsx b/sites/hacklytics2027/components/sections/PrizeAndSpeakerSection.tsx
index ed86f979..1dc14455 100644
--- a/sites/hacklytics2027/components/sections/PrizeAndSpeakerSection.tsx
+++ b/sites/hacklytics2027/components/sections/PrizeAndSpeakerSection.tsx
@@ -1,72 +1,38 @@
 "use client";
 import React from "react";
-import PixelSprite from "../pixel/PixelSprite";
-import { BLOOM, DAISY, SPROUT, TULIP } from "../pixel/sprites";
-import type { PaletteName, SpriteMap } from "../pixel/sprites";
-import Eyebrow from "./Eyebrow";
 
-const otherPrizes: {
-  label: string;
-  detail: string;
-  sprite: SpriteMap;
-  palette: PaletteName;
-}[] = [
-  { label: "Track", detail: "First and second in each track.", sprite: DAISY, palette: "lime" },
-  { label: "MLH", detail: "Sponsor challenges stack on top.", sprite: TULIP, palette: "cyan" },
-  { label: "Beginner", detail: "Beginner-friendly award.", sprite: SPROUT, palette: "purple" },
+const prizes = [
+  { label: "Best overall", detail: "Top project across all tracks. Purse to be announced." },
+  { label: "Track prizes", detail: "First and second place in each track." },
+  { label: "MLH challenges", detail: "Sponsor challenges stack on top of a track." },
+  { label: "Beginner", detail: "A beginner-friendly award." },
 ];
 
-const FRAME: Record<PaletteName, string> = {
-  pink: "pixel-pink",
-  cyan: "pixel-cyan",
-  lime: "pixel-lime",
-  purple: "pixel-purple",
-};
-
 export default function PrizeAndSpeakerSection() {
   return (
     <section id="prizes" className="section-anchor text-white relative">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
-        <Eyebrow index="03" tone="pink">Prizes</Eyebrow>
-        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-12 md:mb-16">
-          Bloom, then <span className="neon-pink">win.</span>
-        </h2>
-
-        <div className="grid grid-cols-1 lg:grid-cols-5 gap-5">
-          <div className="pixel-frame pixel-pink hud hud-pink relative overflow-hidden bg-white/[0.03] p-8 md:p-12 lg:col-span-3 flex flex-col justify-between min-h-[20rem]">
-            {/* The event's top prize gets the only oversized sprite on the page.
-                Hidden on phones, where it would sit under the text. */}
-            <div aria-hidden className="pointer-events-none hidden sm:block absolute right-6 bottom-6 md:right-10 md:bottom-10 opacity-70">
-              <PixelSprite map={BLOOM} palette="pink" scale={14} glow />
-            </div>
-            <p className="relative font-pixel text-xs uppercase text-bloom-pink">Best overall</p>
-            <div className="relative">
-              <p className="font-sans font-bold text-5xl md:text-7xl tracking-[-0.04em] text-white">
-                Purse <span className="neon-pink">TBA</span>
-              </p>
-              <p className="font-sans text-base md:text-lg text-white/65 mt-4 max-w-sm leading-relaxed">
-                Top projects across all tracks. Prize details land closer to the
-                event.
-              </p>
-            </div>
+      <div className="section-wrap max-w-7xl mx-auto py-24 md:py-32 px-6">
+        <div className="grid grid-cols-1 lg:grid-cols-12 gap-10 lg:gap-16">
+          <div className="lg:col-span-5">
+            <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl text-white leading-[1] tracking-[-0.03em]">
+              Prizes
+            </h2>
+            <p className="font-sans text-base md:text-lg text-white/65 leading-[1.6] mt-6 max-w-[40ch]">
+              Prize details land closer to the event.
+            </p>
           </div>
 
-          <ul className="lg:col-span-2 grid grid-cols-1 sm:grid-cols-3 lg:grid-cols-1 gap-5">
-            {otherPrizes.map((p) => (
-              <li
+          <dl className="lg:col-span-6 lg:col-start-7 border-t border-white/15">
+            {prizes.map((p) => (
+              <div
                 key={p.label}
-                className={`pixel-frame ${FRAME[p.palette]} bg-white/[0.03] px-6 py-5 flex items-center gap-5 transition-colors duration-300 hover:bg-white/[0.06]`}
+                className="grid grid-cols-1 sm:grid-cols-[11rem_1fr] gap-1 sm:gap-8 border-b border-white/15 py-5"
               >
-                <span className="flex w-10 shrink-0 justify-center">
-                  <PixelSprite map={p.sprite} palette={p.palette} scale={3} glow />
-                </span>
-                <div>
-                  <p className="font-pixel text-[11px] uppercase text-white/85">{p.label}</p>
-                  <p className="font-sans text-sm md:text-base text-white/65 mt-1">{p.detail}</p>
-                </div>
-              </li>
+                <dt className="font-sans font-bold text-lg text-white">{p.label}</dt>
+                <dd className="font-sans text-base md:text-lg text-white/70">{p.detail}</dd>
+              </div>
             ))}
-          </ul>
+          </dl>
         </div>
       </div>
     </section>
diff --git a/sites/hacklytics2027/components/sections/Schedule/Schedule.tsx b/sites/hacklytics2027/components/sections/Schedule/Schedule.tsx
index daa94e9b..478293ad 100644
--- a/sites/hacklytics2027/components/sections/Schedule/Schedule.tsx
+++ b/sites/hacklytics2027/components/sections/Schedule/Schedule.tsx
@@ -1,12 +1,11 @@
 "use client";
 import React from "react";
 import { board } from "./data";
-import Eyebrow from "../Eyebrow";
 
 const DAYS = [
-  { key: "Fri", name: "Friday", date: "Feb 26", frame: "pixel-cyan", text: "text-bloom-cyan" },
-  { key: "Sat", name: "Saturday", date: "Feb 27", frame: "pixel-lime", text: "text-bloom-lime" },
-  { key: "Sun", name: "Sunday", date: "Feb 28", frame: "pixel-pink", text: "text-bloom-pink" },
+  { key: "Fri", name: "Friday", date: "Feb 26" },
+  { key: "Sat", name: "Saturday", date: "Feb 27" },
+  { key: "Sun", name: "Sunday", date: "Feb 28" },
 ] as const;
 
 // "Fri 5:00 PM" → day "Fri", time "5:00 PM"; "Sat, all day" → "Sat", "All day".
@@ -21,48 +20,40 @@ export default function Schedule() {
 
   return (
     <section id="schedule" className="section-anchor text-white">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
-        <Eyebrow index="04" tone="cyan">Schedule</Eyebrow>
-        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-5 max-w-3xl">
-          36 hours. <span className="neon-cyan">One Klaus weekend.</span>
-        </h2>
-        <p className="font-sans text-base md:text-lg text-white/65 mb-12 md:mb-16 max-w-xl">
-          The key times so far. Meals and workshops are added closer to the
-          weekend.
-        </p>
+      <div className="section-wrap max-w-7xl mx-auto py-24 md:py-32 px-6">
+        <div className="flex flex-col md:flex-row md:items-end md:justify-between gap-4 mb-14 md:mb-20">
+          <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl text-white leading-[1] tracking-[-0.03em]">
+            Schedule
+          </h2>
+          <p className="font-sans text-base md:text-lg text-white/65 max-w-[44ch] md:text-right">
+            The key times so far. Meals and workshops are added closer to the
+            weekend.
+          </p>
+        </div>
 
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-5">
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-x-10 gap-y-12">
           {DAYS.map((d) => (
-            <div key={d.key} className={`pixel-frame ${d.frame} bg-white/[0.03] p-6 md:p-8`}>
-              <div className="flex items-baseline justify-between mb-8">
-                <p className={`font-pixel text-sm uppercase ${d.text}`}>{d.name}</p>
-                <p className="font-pixel text-[10px] uppercase text-white/45">{d.date}</p>
-              </div>
-
-              <ol className="relative border-l-2 border-dashed border-white/15 ml-1.5 flex flex-col gap-7">
+            <div key={d.key}>
+              <p className="flex items-baseline justify-between border-b border-white/25 pb-3">
+                <span className="font-sans font-bold text-xl text-white">{d.name}</span>
+                <span className="font-sans text-sm text-white/55 tabular-nums">{d.date}</span>
+              </p>
+              <ol>
                 {rows
                   .filter((r) => r.day === d.key)
                   .map((r) => (
-                    <li key={r.when} className="relative pl-7">
-                      {/* Square node on the rail; the milestones glow. */}
+                    <li
+                      key={r.when}
+                      className="grid grid-cols-[5.5rem_1fr] gap-4 border-b border-white/10 py-4"
+                    >
                       <span
-                        aria-hidden
-                        className={`absolute -left-[7px] top-1.5 h-3 w-3 ${
-                          r.accent
-                            ? "bg-bloom-cyan shadow-[0_0_12px_rgba(0,229,255,0.9)]"
-                            : "bg-white/30"
-                        }`}
-                      />
-                      <p
-                        className={`font-sans text-sm tabular-nums ${
+                        className={`font-sans text-base tabular-nums ${
                           r.accent ? "text-bloom-cyan" : "text-white/55"
                         }`}
                       >
                         {r.time}
-                      </p>
-                      <p className="font-sans font-bold text-lg md:text-xl text-white tracking-tight mt-0.5">
-                        {r.event}
-                      </p>
+                      </span>
+                      <span className="font-sans text-base md:text-lg text-white">{r.event}</span>
                     </li>
                   ))}
               </ol>
diff --git a/sites/hacklytics2027/components/sections/Sponsor.tsx b/sites/hacklytics2027/components/sections/Sponsor.tsx
index 2484d0ba..d6fd33b3 100644
--- a/sites/hacklytics2027/components/sections/Sponsor.tsx
+++ b/sites/hacklytics2027/components/sections/Sponsor.tsx
@@ -1,54 +1,31 @@
 "use client";
 import React from "react";
-import PixelSprite from "../pixel/PixelSprite";
-import { DAISY, MUSHROOM, TULIP } from "../pixel/sprites";
-import Eyebrow from "./Eyebrow";
 
 export default function SponsorsSection() {
   return (
     <section id="sponsors" className="section-anchor relative text-white">
-      <div className="section-wrap max-w-7xl mx-auto px-6 py-20 md:py-28">
-        <Eyebrow index="05" tone="lime">Sponsors</Eyebrow>
-        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-12 md:mb-16">
-          Grow <span className="neon-lime">with us.</span>
-        </h2>
+      <div className="section-wrap max-w-7xl mx-auto px-6 py-24 md:py-32">
+        <div className="grid grid-cols-1 lg:grid-cols-12 gap-10 lg:gap-16">
+          <h2 className="lg:col-span-5 font-sans font-bold text-4xl sm:text-5xl md:text-6xl text-white leading-[1] tracking-[-0.03em]">
+            Sponsors
+          </h2>
 
-        <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-5">
-          <div className="pixel-frame pixel-cyan bg-white/[0.03] px-7 py-8 flex flex-col justify-between gap-6">
-            <p className="font-pixel text-[11px] uppercase text-bloom-cyan">Hosted by</p>
-            <p className="font-sans font-bold text-2xl tracking-tight text-white">Data Science @ GT</p>
-          </div>
-          <div className="pixel-frame pixel-pink bg-white/[0.03] px-7 py-8 flex flex-col justify-between gap-6">
-            <p className="font-pixel text-[11px] uppercase text-bloom-pink">Member event</p>
-            <p className="font-sans font-bold text-2xl tracking-tight text-white">Major League Hacking</p>
-          </div>
-
-          {/* An invitation, not an empty logo slot: 2027 partners are not
-              announced yet. */}
-          <div className="pixel-frame pixel-lime hud hud-lime relative overflow-hidden bg-white/[0.03] px-7 py-8 sm:col-span-2 flex flex-col sm:flex-row sm:items-end justify-between gap-6">
-            <div className="relative">
-              <p className="font-pixel text-[11px] uppercase text-bloom-lime">2027 partners</p>
-              <p className="font-sans font-bold text-2xl md:text-3xl tracking-tight text-white mt-6">
-                Sponsor Hacklytics 2027
-              </p>
-              <p className="font-sans text-base text-white/65 mt-2 max-w-sm">
-                Put your problems in front of 1,000+ builders. Ask for the
-                partner deck.
-              </p>
-            </div>
-            <div className="relative flex flex-col items-start sm:items-end gap-5 shrink-0">
-              <span className="hidden sm:flex items-end gap-2" aria-hidden>
-                <PixelSprite map={TULIP} palette="cyan" scale={3} glow className="animate-bob" />
-                <PixelSprite map={DAISY} palette="lime" scale={3} glow className="animate-bob" />
-                <PixelSprite map={MUSHROOM} palette="pink" scale={3} glow className="animate-bob" />
-              </span>
+          {/* An invitation, not a wall of empty logo slots: 2027 partners
+              are not announced yet. */}
+          <div className="lg:col-span-6 lg:col-start-7 lg:pt-3">
+            <p className="font-sans text-lg md:text-xl text-white/80 leading-[1.6] max-w-[55ch]">
+              Hosted by Data Science @ GT. A Major League Hacking member event.
+            </p>
+            <p className="font-sans text-base md:text-lg text-white/65 leading-[1.6] max-w-[55ch] mt-5">
+              2027 partners are not announced yet. To sponsor, email{" "}
               <a
                 href="mailto:hello@hacklytics.io"
-                className="pixel-btn inline-flex items-center justify-center px-6 py-3.5 font-pixel text-xs w-full sm:w-auto"
+                className="text-bloom-cyan underline underline-offset-4 decoration-bloom-cyan/40 hover:decoration-bloom-cyan"
               >
-                Email us →
-              </a>
-            </div>
+                hello@hacklytics.io
+              </a>{" "}
+              for the partner deck.
+            </p>
           </div>
         </div>
       </div>
diff --git a/sites/hacklytics2027/components/sections/TracksSection.tsx b/sites/hacklytics2027/components/sections/TracksSection.tsx
index 12886050..93ece163 100644
--- a/sites/hacklytics2027/components/sections/TracksSection.tsx
+++ b/sites/hacklytics2027/components/sections/TracksSection.tsx
@@ -1,104 +1,87 @@
 "use client";
-import React from "react";
+import React, { useMemo } from "react";
 import PixelSprite from "../pixel/PixelSprite";
-import { BLOOM, DAISY, MUSHROOM, SPROUT, TULIP } from "../pixel/sprites";
+import { BLOOM, DAISY, GROUND, MUSHROOM, SPROUT, TULIP } from "../pixel/sprites";
 import type { PaletteName, SpriteMap } from "../pixel/sprites";
-import Eyebrow from "./Eyebrow";
+import { spriteToDataUri } from "../pixel/spriteUri";
 
 const tracks: {
-  num: string;
   title: string;
   description: string;
   sprite: SpriteMap;
   palette: PaletteName;
 }[] = [
-  {
-    num: "01",
-    title: "Finance",
-    description: "Markets, models, and fintech.",
-    sprite: DAISY,
-    palette: "lime",
-  },
-  {
-    num: "02",
-    title: "Sports Analytics",
-    description: "Performance, strategy, and the game.",
-    sprite: TULIP,
-    palette: "cyan",
-  },
-  {
-    num: "03",
-    title: "Healthcare",
-    description: "Care, bioinformatics, and health tech.",
-    sprite: BLOOM,
-    palette: "pink",
-  },
-  {
-    num: "04",
-    title: "Entertainment",
-    description: "Media, games, and interactive AI.",
-    sprite: MUSHROOM,
-    palette: "purple",
-  },
-  {
-    num: "05",
-    title: "Pure Imagination",
-    description: "Wildcard. Build the unexpected.",
-    sprite: SPROUT,
-    palette: "lime",
-  },
+  { title: "Finance", description: "Markets, models, and fintech.", sprite: DAISY, palette: "lime" },
+  { title: "Sports Analytics", description: "Performance, strategy, and the game.", sprite: TULIP, palette: "cyan" },
+  { title: "Healthcare", description: "Care, bioinformatics, and health tech.", sprite: BLOOM, palette: "pink" },
+  { title: "Entertainment", description: "Media, games, and interactive AI.", sprite: MUSHROOM, palette: "purple" },
+  { title: "Pure Imagination", description: "Wildcard. Build the unexpected.", sprite: SPROUT, palette: "lime" },
 ];
 
-const FRAME: Record<PaletteName, string> = {
-  pink: "pixel-pink",
-  cyan: "pixel-cyan",
-  lime: "pixel-lime",
-  purple: "pixel-purple",
-};
-
-const NUM: Record<PaletteName, string> = {
-  pink: "text-bloom-pink",
-  cyan: "text-bloom-cyan",
-  lime: "text-bloom-lime",
-  purple: "text-[#c77dff]",
-};
+const GROUND_SCALE = 4;
 
 export default function TracksSection() {
+  const ground = useMemo(() => spriteToDataUri(GROUND, "lime"), []);
+
   return (
     <section id="tracks" className="section-anchor relative text-white">
-      <div className="section-wrap max-w-7xl mx-auto py-20 md:py-28 px-6">
-        <Eyebrow index="02" tone="lime">Tracks</Eyebrow>
-        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl lg:text-7xl text-white leading-[0.95] tracking-[-0.03em] mb-12 md:mb-16 max-w-3xl">
-          Five tracks. <span className="neon-lime">One weekend.</span>
+      <div className="section-wrap max-w-7xl mx-auto py-24 md:py-32 px-6">
+        <h2 className="font-sans font-bold text-4xl sm:text-5xl md:text-6xl text-white leading-[1] tracking-[-0.03em] mb-14 md:mb-20">
+          Tracks
         </h2>
 
-        {/* Six columns so three cards fill the first row and two wider ones
-            the second, instead of a lone card stranded on the last row. */}
-        <ul className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-6 gap-5">
-          {tracks.map(({ num, title, description, sprite, palette }, i) => (
-            <li
-              key={num}
-              className={`group pixel-frame ${FRAME[palette]} relative overflow-hidden bg-white/[0.03] p-6 md:p-8 min-h-[15rem] flex flex-col transition-colors duration-300 hover:bg-white/[0.06] ${
-                i < 3 ? "lg:col-span-2" : "lg:col-span-3"
-              } ${i === 4 ? "sm:col-span-2 lg:col-span-3" : ""}`}
-            >
-              <div className="flex items-start justify-between">
-                <PixelSprite
-                  map={sprite}
-                  palette={palette}
-                  scale={5}
-                  glow
-                  className="transition-transform duration-300 group-hover:-translate-y-1"
-                />
-                <span className={`font-pixel text-xs ${NUM[palette]}`}>{num}</span>
+        {/* The tracks are the garden: one plant each, rooted in the same bed
+            of soil as the hero. Phones get a plain list; five plants do not
+            share a 390px bed. */}
+        <ul className="lg:hidden flex flex-col gap-8">
+          {tracks.map((t) => (
+            <li key={t.title} className="flex items-end gap-5">
+              <span className="flex w-14 shrink-0 justify-center">
+                <PixelSprite map={t.sprite} palette={t.palette} scale={4} glow />
+              </span>
+              <div className="pb-1">
+                <h3 className="font-sans font-bold text-xl text-white tracking-tight">{t.title}</h3>
+                <p className="font-sans text-base text-white/65 mt-1">{t.description}</p>
               </div>
-              <h3 className="font-sans font-bold text-2xl md:text-3xl text-white tracking-tight mt-auto pt-8">
-                {title}
-              </h3>
-              <p className="font-sans text-base text-white/65 mt-2">{description}</p>
             </li>
           ))}
         </ul>
+
+        <div className="hidden lg:block">
+          <ul className="grid grid-cols-5 items-end">
+            {tracks.map((t, i) => (
+              <li key={t.title} className="flex justify-center">
+                <PixelSprite
+                  map={t.sprite}
+                  palette={t.palette}
+                  scale={7}
+                  glow
+                  className="animate-sway origin-bottom"
+                  style={{ animationDuration: `${6 + i * 0.7}s`, animationDelay: `${-i * 1.3}s` }}
+                />
+              </li>
+            ))}
+          </ul>
+          <div
+            aria-hidden
+            className="w-full"
+            style={{
+              backgroundImage: ground.uri,
+              backgroundRepeat: "repeat-x",
+              backgroundSize: `${ground.w * GROUND_SCALE}px ${ground.h * GROUND_SCALE}px`,
+              height: ground.h * GROUND_SCALE,
+              imageRendering: "pixelated",
+            }}
+          />
+          <ul className="grid grid-cols-5 gap-6 mt-8">
+            {tracks.map((t) => (
+              <li key={t.title} className="text-center">
+                <h3 className="font-sans font-bold text-xl xl:text-2xl text-white tracking-tight">{t.title}</h3>
+                <p className="font-sans text-base text-white/65 mt-2">{t.description}</p>
+              </li>
+            ))}
+          </ul>
+        </div>
       </div>
     </section>
   );