feat(cripto): build detail pages, cyberpunk intro panel, tighter copy

Builds link to internal /cripto/builds/[slug] detail pages (SSG) instead of external sites. Replace intro halftone box with an animated synthwave/cyberpunk panel (CSS-only). Rewrite manifesto with a Proof of work headline and a pragmatic web3 stack blurb. Remove the redundant two-worlds section and renumber sections.

Author: louzoshi

app/cripto/_components/Contributions.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import Link from "next/link";
 import type { CSSProperties } from "react";
 import Reveal from "@/components/Reveal";
 import { contributions } from "../_data";
@@ -34,10 +35,8 @@ export default function Contributions() {
         <div className="border-t-2 border-[var(--c-ink)]">
           {contributions.map((c) => (
             <Reveal key={c.title}>
-              <a
-                href={c.href}
-                target="_blank"
-                rel="noopener noreferrer"
+              <Link
+                href={`/cripto/builds/${c.slug}`}
                 className="row-link group flex items-center gap-4 md:gap-8 py-5 md:py-6 px-2 md:px-4 border-b-2 border-[var(--c-ink)]"
                 style={
                   {
@@ -65,7 +64,7 @@ export default function Contributions() {
                 <span className="row-arrow c-mono text-lg group-hover:text-[var(--row-fg)] transition-colors">
                   ↗
                 </span>
-              </a>
+              </Link>
             </Reveal>
           ))}
         </div>

app/cripto/_components/Intro.tsx

@@ -13,14 +13,12 @@ export default function Intro() {
     <section className="border-b-2 border-[var(--c-ink)] bg-[var(--c-paper-2)]">
       <div className="max-w-[1160px] mx-auto px-5 py-20 grid md:grid-cols-[0.85fr_1.15fr] gap-12 items-start">
         <Reveal>
-          <div
-            className="halftone aspect-[4/3] border-2 border-[var(--c-ink)] shadow-[5px_5px_0_var(--c-ink)]"
-            style={{
-              ["--dot" as string]: "var(--c-teal)",
-              background:
-                "linear-gradient(120deg, var(--c-lime) 0 55%, var(--c-red) 55% 100%)",
-            }}
-          />
+          <div className="cyber aspect-[4/3] border-2 border-[var(--c-ink)] shadow-[5px_5px_0_var(--c-ink)]">
+            <div className="cyber-sun" />
+            <div className="cyber-grid" />
+            <div className="cyber-scan" />
+            <span className="cyber-tag">SYS://ONCHAIN</span>
+          </div>
         </Reveal>
 
         <Reveal delay={0.08}>

app/cripto/_components/WhatIDo.tsx

@@ -27,52 +27,64 @@ export const stack = [
   "VERCEL",
 ];
 
+export type BuildSlug = "skatehive" | "community-org" | "gnars" | "builderdao";
+
 export type Contribution = {
   index: string;
+  slug: BuildSlug; // internal detail page: /cripto/builds/[slug]
   title: string;
   meta: string;
   role: "contributor" | "dev"; // translated via _i18n.ts
-  href: string;
+  href: string; // external project link (shown on the detail page)
   accent: string; // css var name
   font: "display" | "serif" | "mono";
+  stack: string[]; // tech tags (not translated)
 };
 
 export const contributions: Contribution[] = [
   {
     index: "01",
+    slug: "skatehive",
     title: "SkateHive",
     meta: "OPEN SOURCE · WEB3",
     role: "contributor",
     href: "https://skatehive.app/",
     accent: "--c-red",
     font: "serif",
+    stack: ["React", "TypeScript", "Next.js", "Hive"],
   },
   {
     index: "02",
+    slug: "community-org",
     title: "Community Org",
     meta: "PLATFORM · 2025",
     role: "dev",
     href: "https://community-org-beta.vercel.app/",
     accent: "--c-blue",
     font: "mono",
+    stack: ["Next.js", "TypeScript", "Vercel"],
   },
   {
     index: "03",
+    slug: "gnars",
     title: "Gnars",
     meta: "SKATE DAO · ONCHAIN",
     role: "contributor",
     href: "https://gnars.com",
     accent: "--c-teal",
     font: "display",
+    stack: ["React", "wagmi", "viem", "Nouns"],
   },
   {
     index: "04",
+    slug: "builderdao",
     title: "BuilderDAO",
     meta: "NOUNS BUILDER · DAO",
     role: "contributor",
     href: "https://nouns.build",
     accent: "--c-lime",
     font: "mono",
+    stack: ["Next.js", "TypeScript", "Solidity"],
   },
 ];